From 6ee9717a88b47e5ee640e36d5502c3e1e0555ecf Mon Sep 17 00:00:00 2001 From: Steve Date: Fri, 29 Mar 2024 14:15:13 +0100 Subject: [PATCH] feat: branding --- demo/img/android-chrome-192x192.png | Bin 1600 -> 0 bytes demo/img/android-chrome-256x256.png | Bin 2318 -> 0 bytes demo/img/apple-touch-icon.png | Bin 1544 -> 0 bytes demo/img/browserconfig.xml | 9 ----- demo/img/favicon-16x16.png | Bin 492 -> 0 bytes demo/img/favicon-32x32.png | Bin 571 -> 0 bytes demo/img/favicon.ico | Bin 7406 -> 0 bytes demo/img/mstile-150x150.png | Bin 1359 -> 0 bytes demo/img/site.webmanifest | 19 ----------- demo/index.html | 14 ++++---- dist/main.js | 6 +++- dist/main.js.map | 2 +- docs/.vitepress/config.js | 5 ++- docs/index.md | 6 ++-- src/index.html | 6 ++-- src/js/kompletr.js | 50 +++++++++++++++++----------- src/sass/kompletr.demo.scss | 46 ++++++++++--------------- src/sass/kompletr.scss | 2 +- 18 files changed, 71 insertions(+), 94 deletions(-) delete mode 100755 demo/img/android-chrome-192x192.png delete mode 100755 demo/img/android-chrome-256x256.png delete mode 100755 demo/img/apple-touch-icon.png delete mode 100755 demo/img/browserconfig.xml delete mode 100755 demo/img/favicon-16x16.png delete mode 100755 demo/img/favicon-32x32.png delete mode 100755 demo/img/favicon.ico delete mode 100755 demo/img/mstile-150x150.png delete mode 100755 demo/img/site.webmanifest diff --git a/demo/img/android-chrome-192x192.png b/demo/img/android-chrome-192x192.png deleted file mode 100755 index 0744cc72a91afbb0d4ee644d1b96b61f51fd3afa..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1600 zcmb_ceLNF*9R6)n8*-99D63o4@)9i+hKyU;%&-|MqLCrVV&2QrQ7K>bJ#c(9qm6?Vv#B9m}B0sv+8Z-9Wjd@Z>NXA#LK;1U>8Q3F1c$ooM) zI7r0X(PGBt$LCy-?pj+vN(*w^YK;#ymA&;C&!gU_!qAnE^@6Y8C9idVWgkNatv@H+ z-*2Dvz}rm%?LI@N)1zCYxx=cBIvxWxEtr8zSBk>;{No)D^KBv+Fs@rf4^DGC;Bmm< z76pzm3a}uMVr2w4ivtoU^#6>e*s3+o^%+zpYI^Pfl%H5gnm@igR-A7iZs=|a!~G_G zqzx+srqoh*i$Gca={n zj26mY#daw*NL9v*h#}@C@eQ^!qm|VT(3}l?*L1t+gAb+R>1OiaS8+4Zpa3h3y{Z;L zivP8LTdS|Nci;1EHO6cW^Lx#omwvoPwK^l=DWOLxqx2hlIN9c3%Rc zZNcS1{i0G0V;>3-LKxip)@x2$$Y5*eFk`K zRr5l3QVlGO7uVO`n+0jaA)^Ww<|g42vx{lhR%7x!o-n)v(<0Spq3fod(@SZOwSikg z$R&YHni2<=!m2tVt|;_Q+!1H@E4bDUWkz%izD4YI727OL*Z-MX9iczIU50hv195f= zfam;CU`JhjL&|ay-py0Oy@yv&1iK$v5k#V<5Q8Ec3n@i%5n_-@ugh1|iF{DUSHg5x zsN$SH^NwndgO!leqkhM7otqd*aI=#=SU^Svtu+jtgf|yLRlZ}|CTk<7+JAl_;V^8I z$A=}rGI{rLD6YKky_tTgqX@0j^1-Z&c5h6Uc(ZI{eUC13pF3xAho|DyXwQ+`hgoX7 zY}7r4>wR0}D5Z|Li{W*GX`ErkkSPU2s+jE0x~*7zt-W=PQ8qG3#*5)D(Vc?wXTR8c ze0<}0RF))}Yvx6k6zuYyn=I^nsjZsX-*9Zr@4~~CnCyz>w1ea*HBIxvLW_W%aholW z32bLu!mDZ8xR2}R_0(Kz*~K2V8S|yRvTM4|hbtvUGZk=G%U<=|4Ak!(FKm(bVf^mE z6nsg>aT>e(swebKkSD*vp}2Xqm5?~(a@ge6PmRis~a?*P}Y6+a9xssZ7#0 zm67^Ec!I2!EgaDF>;9ZD_DHul2k9H_ax>LrcsO+oLOb0W$UWJMNak5@@-yk%DHmoY zcwefXgc@Y5u1<*#&L^PNKc*^L6|Dt3PEKAmzUAcVb99B`n3_i3yQq==QW_&@h%*6B8`P+z^AoVla-2`-uN2god3D zX2kw`!KyBIMPBfXqn%<=>Cq@=co-x2VgQO2%M3sTGgSJ|KY@o)ILr~&{0 diff --git a/demo/img/android-chrome-256x256.png b/demo/img/android-chrome-256x256.png deleted file mode 100755 index f1fa6a1bb97c925e0184139352b66c16744d226e..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2318 zcmds2dpHw(8~*K}k?0kr9A1+*Eq&O#NR4Egm_urlYyvy@?%!f3=Y@s7Rw{`~&<{{F7(yRPTC@8`Ln>%N{p@ATux>{T{uZ3Fv0S-hL01^!WU|j@YRW7ln0XT;S zV8#~!Y&HOz(YcK$tmFr%zmq*4$kH-8dGbvu+QB0h0A=-mHw4_x-7XgqRDz2gVj8BS zv<)$t+;~K;VQv4^;$Y(e0p{*Of&v&|PaZuF%rQY_XX76j`&?EwpThx9;CTt0; zu&(tAB`3AMUd9&tqBrC#bNoz#mmxR(wTFVSujm`*=i8k!zeF)&gUn)sUe9c_o^u~j zXfOc(MnVevN-%LkX;q20%;Kgrr9?}Y>NCRpsH(2v zxWU)$O|jvda)sY)8J1k8=kve0H}T0-w2g=zrkA^gWqEF;ZzWy-Lsu7;d8jBQR@0R4 zlQ=os2T-|9lD}5`5b*&IDX2Qj0~qr|v{}L4zEgp&IgEOvJXv48W?J|hU2ttJ?9%PUi-jD%wPvD7m67mX-kpqUDyRx>y?23W$x7Sss`69LKPpt7k{+I_$+*ywE+mZi=CR3^QSJZ>04- zT!)~LJKNR;I%RCz`-Oa;!$4K7zsK9hgWN?vyc)v*$hb+g7NPoCo*fI{R9>TaeOk3rj;LTYWRENDFsPQlCAXKqOsvb zuV3|Ar0*YA8+I({09u4EJ2%8n$4Mz~Sa8gUwK~wT6hJ>QWDMJGTv-u0861^8ahO*CIyDn1Xs@vQv*$f&P#elXN-+soIBu2~EfUehc~5RV2)=1b=`+f31xCF4(& z3;tx4u1U)TV#geZM-}EHBhSREUODiJ6dnF=SrQu*J8^gOyCfo>z)0ByA-x((fE2)? zshgd3o|~GM(3Qfp);Fy;7mJa{A8D+ra9*Wc29)80*|=)$eH5`vUvzS!auuO;b!z}6W3!6HvKA{ zqme&5qeB4&EaL(dGCb5(b-z5v)2hEaJ+SLhxYyE18(qc zy0o>i#|Q)G#EVBSC3@io4*QHmh{8qsPOiUf!R@KwfBNy0GX-j8qW5vyV_7DNiHAEFl3g=tK z%)&!dZQkD#O)d>zz&4v^)BVOgPR@4m=R0LtDe#ikeh=#qldg=+$DN}ZF8KA1fvJwT zx~ujf1uLxav*pA0_4aJb{U(x!BX!zB&y+vr@cm0rwbG4-CVw8PNwqJ)4}R$Z`xV=z zO?S;B8KoL$LG~mVQU>k>ZoQ29T+-%PhPN!ec+!8Ezp}<_?_J0Rimd;ANx4!4S!=(t z`~4f;^6=h8wR5Ki`cWy^fEbFL00xaQGe++-#vCA_4`MMGEZSl(8jVGx9q084|6z!T z3JeWO`0obG>YOFH!7Y*GP9^%qA){lWfQ1*bVCqOb%d9mJW>7;yc6{uA+t%5p(}w6^IdB|Jz>KCEbpS6aWAK diff --git a/demo/img/apple-touch-icon.png b/demo/img/apple-touch-icon.png deleted file mode 100755 index 93839e7da78b6b19aef4d501648dec4a564c5c99..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1544 zcmbVMdo&by6#kVrJ1Or)HFioKVaRiiC^McJBRj{dVl>7pGGj&>de#Wgi={T9HAkO_kxcAGY=beq0TNeh3 z3Yt1u#I-JI2$cOo$GlXo_Jk}t%)xN4gL2`JJbj3+%ijH8WmNM!I@$PpIxXJQoH}j# zv+k=Xi3I3w*&w7&b2Ff2UxXMq0X5$y(y4{L0)SeTJwNEVO6fG)BL} zgNh0^N_<`1@%2tHI3qde*O@sq(0?Jdb^L6#T%fwDI}!o-5_;8Hjr!WCYv&H6x7}Xl z?W`?3G>GZ?^T&aqkhE0V;8OB(=0UDreSt9>ca<<6X}( z)4hk={IbVY5f0sBXP7V3dGroj4YJ8dtwY3}=1|ijGK+nhD@s(f+O{9rSgUc!Y9L0+ zYR=EsZau{~t`B>Prlafr__DDI#YQJbnQJ*6Ok^OD$eOd#aSx@23<&%f1*MN+CqShR zFtfBaU3)Be!qlPd97-Y1`i%Tye0A-Hw`D|G)C0T2!!vJgvle+mSgzCvZkhizX$0Xjy41&|MgTSi-4fPn(qPd1*dkYBevZb%~Q0|mO z%SLDqw{+l(#a#j;Aa8GD-~*{ZTXQQxB;=mL-0$vMirxspOA;$Vg{lY_8dKKlCRzUP zmpp07cFTgxt@mv*ActbL(P=Qj@O-tt~#1u1k}R`kq+X>$EXC zXTyd4kT8toD0?%k$&8<16%}j^+)7|Fl6$D{CrR~|Vh!$HG6dM!%lNPv!ivbPG?ejG1-F&QEaV0m^rI`MMA)l8*8r~eB@_Uc;f=& zGt;Lg+gY7$w11(-c00-C)qK5gxzqpt?!RZjPrEKoxOH<8NVeII4T!6H|@0=PPQpdL8juKopbT&qL? diff --git a/demo/img/browserconfig.xml b/demo/img/browserconfig.xml deleted file mode 100755 index b3930d0..0000000 --- a/demo/img/browserconfig.xml +++ /dev/null @@ -1,9 +0,0 @@ - - - - - - #da532c - - - diff --git a/demo/img/favicon-16x16.png b/demo/img/favicon-16x16.png deleted file mode 100755 index 7aeafe19cd872b34684dfa0bddff210df8c3b6b1..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 492 zcmeAS@N?(olHy`uVBq!ia0vp^0wBx*Bp9q_EZ7UASkfJR9T^xl_H+M9WCijSl0AZa z85pY67#JE_7#My5g&JNkFq9fFFuY0t>0)3IFPO6{&;}^Ml;rL1!tlSn|IB_MkF&rd zvY3H^TNs2H8D`Cq01C2~c>21szhIW(6k~tZxXT$RRO9L57$R|bYTrh#LjeLT>F;Gv z>Ua2ZM0B=J`2U}aTd~({o1$Zo#>w3ximef;yJaQHu6~eCHZS0~d@b#vOYJ-##)N+B zKELy?t}zG1-M%S!H?@NK!%wbu57$#nO3Z%qUWJ!NOf{O^S8`P1G@Xzme6lMrqk8o>d@ssFt`!l%yn2I`Q&6e6=(&6r>mdKI;Vst06|fmApigX diff --git a/demo/img/favicon-32x32.png b/demo/img/favicon-32x32.png deleted file mode 100755 index 199b9dbc6953c1af4f0ad55b06f619307072c765..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 571 zcmeAS@N?(olHy`uVBq!ia0vp^3Lwk@BpAX3RW*PVOS+@4BLl<6e(pbstRTr`k04(L zhAK4%hK3dfhF?ITh8GMBr3MTPuM!v-tY$DUh!@P+6=(yLU`q0KcVYP7-hXC4kjGiz z5n0T@z%2~Ij105pNB{-dOFVsD*hZ+$%-6h01hdL{gf?3r^iNxBvftp}<+? z59|yMObih-%U<#pRA0EX-Y0>9;pxYzTnBoqw$EzF)%E+rH0Ao-rF^NCQ)m2g_tv(E zyfy#E>e8cy^E&!Hg+A`v{M*ZAsmKB4jqk#O`JKET?`Mnn`8Y8_%lW&)3j_B>JCZJW zayOiliIs4f8fqRP#K6V4!F*Eb$G2_V2Wq&rz9;wv^!;S7J0on=Z@j?ziXjuwTdF0l z5hW>!C8<`)MX5lF!N|bKMAyJr*T^Eoz|zXd$jZQ6+rYrez`*Ohq9=-m-29Zxv`X9> ztT)a43e*r@6%tVrlvu7%P?VpRnUkteQdy9ykXcZY%)n4F=kX^Vj>0evjZ^-o&v-r! zVqjM0)=TCVRu=Z2EW#|T;L>1nIE7hxbBMy}8&^&oIdeqj2>a;`=zy+Qy0 diff --git a/demo/img/favicon.ico b/demo/img/favicon.ico deleted file mode 100755 index 2835526477bfecc638890f5a78a535b7151c340d..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 7406 zcmeHMSxa0=6#hEyYrC(lcDFHYw$^rQ_a*Lg$5zKU(HMFds3-_(^5Bx7 zNRS9BCN2*lA$g3LJSl>pLgG^%@)xG6?B%w$!XV59=6-OyPTe|nPTjBZdcM_4Yha(;b8=-2hipMPx#&Iyo8y6fijM6MA3mU{s0i8F z*_fG`L2PU+Mn^}{)6;{!y**S`Rw6Sq6E9!BM09jCy1KgX`SWK?PfsH%Dhf3S$|Nb4@+uL~h^eNWY*O8Z(hxz$=q@<)EEG!JGtE({TCot?$l*cg8N_<^mhEj)bq5bxi= z$DKQOkd>8%n3x#U*Vp6SyLZUQ$iRyiFQ8Vd(b?IF-Q8W(*4E;|g9lhxSU_4@8m6YE z5E&VXqoX72?ChYrx*Fx><;c&^M|gNRhK7dl?b|o3t*s$9Hy6pt$xx|OxOeX!5)%^< z5)y*`{(c-B9N^KTNBH>hBUV;c5Fa0p@$qqd`SOKFwqObj{F)4;3lJC(7)Y0-yPXG# zc+U^s#bP8znG9kc5*;rJTehIC)AWKY=*VIbGr+ z5{Yb#qUa}_=;|fDe^NnwI%gkzBeT#=@548Uzv`sF#5XoMBZ2Q_uub`=OSAJlH3lEP zWzwHZlQ~KGUIyE=zjxlPe-i(8zPn|PAtvAALQg+07abgsdHoE2PWco5Ro2!@e|}Vh zP2wBz?{+!DT&hth6dLj!n?ksU4WEB5&MNE5If#n6W@pGot^ANbZ=MYYi{JR+iN7Q) z=p5X3JK;`uoCkUY0RjWRJOjUGRrdcm71gOyawU^XuT#y*LrVpvc zTU=aZ`f_-9801~YG$Yldj~_oqTU#5`a?8uh==x zv9S>y9UV-+QH@76Z*y}q(~fW7zC~eSA=89Z+fm)x-QCSJ9@T-bUcJK7(h_=md$F;x zf#Tv~rZb;Ef6nyhlP6Em-rkOqk`ktMsZOPOd0=1wrKP1zuTo7M7Z-<#i3#N7n` zdwgLO7!Vks{Vo9)W|g!H~D(6Fv>^9hd8X44JE>&|{Rw9!njhvAA$w{kr4 z_gmP8T1NSv$RDTAAK>p{D>J)EWE3BlJ#`twVk}8(@B|dzv1)Bbwak^YEE(*SN;?MS zC3D@fRBDoc!?N+gg&CiL|N0$B>lD&rXSIsHPSMsT>}*>5{{8!`PNDS)?Hkj2Bq=G0 z)g!cjUQkfLddTE&g!Rm6oiR8#h_bRWR%6h9Iw_i2Kb+PYv`1Z6SBKWtR#sQgo;K}8 zH#9Wp>xz+)5ms9?H8p|bI96BCnu7MU1qciX4E%cxh%XGetq%Tj5=`zblab%|7@Wxs zxqG0G=W*-B)80)i76rKa+4<8g{^m|zWNt5Y@Rl=J(Ye@OW@%=@a4Eo??6>xH@v!uu U@U@|bm5cO^Pnz$7xG2+q1Lv;HSO5S3 diff --git a/demo/img/mstile-150x150.png b/demo/img/mstile-150x150.png deleted file mode 100755 index 798426fd037e0b035b9653dd2fb9fa05125abdbb..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1359 zcmeAS@N?(olHy`uVBq!ia0y~yVB`Z~4xj)-?5$;$K#C>Z(btiIVPik{pF~z5Um@8e z$d`ekN{xY`p@o6r7f`6-1p`B=0RzLU1O^7H84L{K1#@-<+5jb(N`m}?85qhYpS1w- zlDyqr82-2SpV<%Ov6p!Iy0X7umf;j*f7ZCmnSp`%nWu|mNX4zUch2TZyUMhGyuaox zi*>DMrh+2N(yp!r8x2-!#jT5(pvuI)L$PtfsrhV7T7^!ox*-aUB1^VR&A9BgM?{g& zMCGja)GdB@D#|Tbg7z(Xb<}vbna%uQKjHI_@80}am1+#M8y&o0)w|-boNMl}rw)%* zTF)(dKEau~aLQx8_j2~7Yo0XoZm<6QDM;*%9;Y$gN%1$O;Pj~JN(tMS=srt@8!NB4#Un)O31QxUW`LIp@-L1nXl};!|Si9U`D_i)q zy5!5Bhm)?~dbqhPYv1J5y|qW4Y|&opJEe~=$|&r;POg~k(?i8SvWm+V80Gbw#Cz?x z-hA!wavwYQ;{}@&)28+G-FoQ#+V%X-4>D`B7uWw?oRhfpg{Hla-FNG4c6$PDMmul* z|Nd{^@9dWNyZe=IyiM;jd9_sYo%xSvwKF(=Pl~#-*73+eYw4BNCK6>n_E%OMJtO$> z#f_gI-(5KQ@~6p*($Y6i4&=q#U3gF?zP{gQp4^|*-*FQZ?wtvpU-Nm#-5;9wj;TJn z_%MH7ZB)Hnx|`z9Skx*?_62@?ChCJD=Vm;IB_b0j69^w56 zRG?bo8c~vxSdwa$T$Bo=7>o>zOmq#5b&V`S3@ojTjI0dIwG9lc3=F*9D|(`6$jwj5 zOsmAL!FtoouRsmqRUr{2L5bxG1x5L3nK`KnC6xuK3Yi5Z$qWn?a~^-<;V2B#&^YCP z`i$q(AO>b-ZoOn~VP#?O$s)|c3N8&Mhf|o9H-{*kzH#NmkuyhRj - - - - + + + + @@ -30,16 +30,14 @@
-

Documentation

-
- Logo Kømpletr - 10kb of vanilla lightweight for a simple & efficient autocomplete + Logo Kømpletr + 10kb of vanilla lightweight for an efficient autocomplete
diff --git a/dist/main.js b/dist/main.js index 797f2ad..7926ac7 100644 --- a/dist/main.js +++ b/dist/main.js @@ -705,10 +705,14 @@ class DOM { * @returns {Void} */ focus(pointer) { - if (isNaN(parseInt(pointer, 10)) || pointer < 0 || pointer > this.result.children.length - 1) { + if (isNaN(parseInt(pointer, 10))) { throw new Error('pointer should be a valid integer in the result lenght range: ' + pointer + ' given.'); } + if (pointer < 0 || pointer > this.result.children.length - 1) { + return false; + } + this.focused = null; Array.from(this.result.children).forEach(result => { ((result) => { diff --git a/dist/main.js.map b/dist/main.js.map index c96b738..f34fe2e 100644 --- a/dist/main.js.map +++ b/dist/main.js.map @@ -1 +1 @@ -{"version":3,"file":"main.js","mappings":";;;;;;;;;;;;;;;AAAuC;;AAEvC;AACA;AACA;AACO;AACP;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,QAAQ;AACR;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B,aAAa,QAAQ;AACrB,aAAa,QAAQ;AACrB;AACA,cAAc,QAAQ;AACtB;AACA,qCAAqC,gDAAS;AAC9C;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;ACvImC;;AAEnC;AACA;AACA;AACO;AACP;;AAEA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB,aAAa,UAAU;AACvB;AACA,cAAc,OAAO;AACrB;AACA;AACA,uBAAuB,4CAAK;AAC5B,gDAAgD,YAAY,4CAAK,EAAE,IAAI,MAAM;AAC7E;AACA,4BAA4B,eAAe;AAC3C;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B,aAAa,QAAQ;AACrB,aAAa,UAAU;AACvB;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB,aAAa,QAAQ;AACrB;AACA,cAAc,OAAO;AACrB;AACA,2BAA2B;AAC3B,uBAAuB,4CAAK;AAC5B,gDAAgD,YAAY,4CAAK,EAAE,IAAI,MAAM;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;ACrDmC;;AAEnC;AACA;AACA;AACA;AACA;AACA;AACO;;AAEP;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB,aAAa,UAAU;AACvB;AACA,mDAAmD;AACnD,4CAA4C;AAC5C;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAW;AACX,OAAO;AACP;AACA,kCAAkC,4CAAK;AACvC,OAAO;AACP;;AAEA;AACA;AACA;AACA,aAAa,QAAQ,OAAO;AAC5B;AACA,4CAA4C;AAC5C;AACA,eAAe;AACf;AACA,QAAQ,cAAc;AACtB;AACA;AACA;AACA;AACA,gDAAgD,eAAe;AAC/D,sBAAsB,OAAO,wCAAwC,SAAS;AAC9E,OAAO;AACP;AACA,kCAAkC,4CAAK;AACvC,OAAO;AACP;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA,6CAA6C,OAAO;AACpD;AACA;AACA;AACA;AACA,MAAM;AACN,gCAAgC,4CAAK;AACrC;AACA;AACA;;;;;;;;;;;;;;;ACnGgE;;AAEhE;AACA;AACA;AACO;AACP;AACA;AACA,YAAY;AACZ;AACA,mBAAmB,gDAAS;AAC5B;AACA;AACA;AACA,YAAY;AACZ;AACA;;AAEA;AACA;AACA,YAAY;AACZ;AACA;AACA;AACA;AACA;AACA;AACA,YAAY;AACZ;AACA,WAAW,4CAAK;;AAEhB;AACA;AACA,YAAY;AACZ;AACA;AACA;;AAEA;AACA;AACA,YAAY;AACZ;AACA;;AAEA;AACA;AACA,YAAY;AACZ;AACA;;AAEA;AACA;AACA,YAAY;AACZ;AACA;AACA;;AAEA;AACA;AACA;AACA,YAAY;AACZ;AACA,cAAc,uDAAgB;;AAE9B;AACA;AACA,YAAY;AACZ;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,8BAA8B,gDAAS;AACvC;AACA,yDAAyD,iBAAiB;AAC1E;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,8BAA8B,4CAAK;AACnC;AACA,gDAAgD,iBAAiB,IAAI,OAAO;AAC5E;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,8BAA8B,uDAAgB;AAC9C;AACA,mDAAmD,iBAAiB,IAAI,OAAO;AAC/E;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;ACvNmC;;AAE5B;AACP;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,uEAAuE,OAAO;AAC9E;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,aAAa,yBAAyB;AACtC,aAAa,QAAQ;AACrB,aAAa,QAAQ;AACrB,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA,8CAA8C,gBAAgB;AAC9D;;AAEA;AACA;AACA;AACA,wCAAwC,mCAAmC,EAAE,oBAAoB;AACjG;AACA,wCAAwC,+BAA+B,IAAI,+BAA+B;;AAE1G,sDAAsD,iDAAiD,EAAE,oBAAoB,EAAE,cAAc;AAC7I;AACA;;AAEA;AACA;AACA;AACA,YAAY,QAAQ;AACpB,YAAY,UAAU;AACtB;AACA,cAAc;AACd;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA,OAAO;AACP,KAAK;;AAEL;AACA,mDAAmD,oBAAoB;AACvE;;AAEA;AACA;AACA;AACA,eAAe;AACf;AACA;AACA;;AAEA;AACA;AACA;AACA,8BAA8B,YAAY,WAAW,qBAAqB;AAC1E;AACA;AACA,oCAAoC,mBAAmB,IAAI,aAAa;AACxE;AACA;AACA;AACA,2BAA2B,uBAAuB;AAClD,sCAAsC,mBAAmB,IAAI,4BAA4B;AACzF;AACA;AACA;AACA;AACA;AACA,SAAS;AACT;AACA,MAAM;AACN,4BAA4B,qBAAqB;AACjD;;AAEA;;AAEA,8BAA8B,4CAAK,wBAAwB;AAC3D;AACA;;;;;;;;;;;;;;;;;;ACpLA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA,CAAC;;;AAGD;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA,CAAC;;;;;;;;;;;;;;;;;;;ACxD0C;AACkB;;AAE7D;AACA;AACA;AACA;AACA;AACA;AACA;AACe;AACf;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA,gBAAgB,gFAAgF;AAChG;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA,iCAAiC,4CAAK;AACtC,iCAAiC,4CAAK;AACtC,iCAAiC,4CAAK,UAAU,oDAAS;AACzD,iCAAiC,4CAAK;AACtC,iCAAiC,4CAAK;;AAEtC;AACA,0EAA0E;;AAE1E;AACA,yDAAyD,4BAA4B;AACrF;AACA,MAAM;AACN,wCAAwC,4CAAK,iEAAiE,QAAQ;AACtH;AACA;;AAEA;AACA;AACA;AACA;AACA,IAAI,oDAAS;AACb;AACA;;AAEA;AACA;AACA;;AAEA;AACA,wDAAwD,QAAQ;AAChE,IAAI,oDAAS;AACb;AACA;;AAEA;AACA;AACA;AACA,0CAA0C,uDAAgB;AAC1D;AACA;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA;AACA;AACA,yBAAyB,YAAY;AACrC;;AAEA,mDAAmD,mBAAmB,KAAK;;AAE3E;AACA;AACA;;AAEA,+BAA+B,6CAAM;AACrC,uBAAuB,oCAAoC;AAC3D;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,qBAAqB,qCAAqC;AAC1D;AACA;AACA;AACA;AACA,WAAW;AACX,SAAS;AACT;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA,8CAA8C;AAC9C,uCAAuC;AACvC;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mCAAmC,4CAAK,aAAa,MAAM,6CAAM,oBAAoB;AACrF,SAAS;AACT,QAAQ;AACR;AACA,mCAAmC,4CAAK,aAAa,MAAM,6CAAM,uBAAuB;AACxF,SAAS;AACT,QAAQ;AACR,iCAAiC,4CAAK,aAAa,MAAM,6CAAM,+BAA+B;AAC9F;AACA,MAAM;AACN,+BAA+B,4CAAK;AACpC;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,MAAM;AACN;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA;AACA;AACA,eAAe;AACf;AACA;AACA;AACA;AACA,6BAA6B,4CAAK;AAClC;AACA;;;;;;;;;;;;;;ACtOA;AACA;AACA;AACO;;AAEP;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,gDAAgD,kBAAkB;AAClE;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,qDAAqD,kBAAkB;AACvE;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;;;;;UCrDA;UACA;;UAEA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;;UAEA;UACA;;UAEA;UACA;UACA;;;;;WCtBA;WACA;WACA;WACA;WACA,yCAAyC,wCAAwC;WACjF;WACA;WACA;;;;;WCPA,8CAA8C;;;;;WCA9C;WACA;WACA;WACA,uDAAuD,iBAAiB;WACxE;WACA,gDAAgD,aAAa;WAC7D;;;;;;;;;;;;;;;;;;;;ACNqC;;AAEc;AAChB;AACY;AACF;AACd;;AAE/B;AACA;AACA;AACA,WAAW,yBAAyB;AACpC,WAAW,QAAQ;AACnB,WAAW,QAAQ;AACnB,WAAW,UAAU;AACrB,WAAW,UAAU;AACrB,WAAW,UAAU;AACrB;AACA,aAAa;AACb;AACA,4BAA4B,kDAAkD;AAC9E,0BAA0B,wDAAW;;AAErC,4BAA4B,4DAAa;AACzC,yBAAyB,sDAAU;;AAEnC,kBAAkB,wCAAG;AACrB,0CAA0C,4CAAK;AAC/C;AACA,MAAM,oDAAQ,GAAG,gFAAgF;AACjG;;AAEA","sources":["webpack://kompletr/./src/js/animation.js","webpack://kompletr/./src/js/broadcaster.js","webpack://kompletr/./src/js/cache.js","webpack://kompletr/./src/js/configuration.js","webpack://kompletr/./src/js/dom.js","webpack://kompletr/./src/js/enums.js","webpack://kompletr/./src/js/kompletr.js","webpack://kompletr/./src/js/properties.js","webpack://kompletr/webpack/bootstrap","webpack://kompletr/webpack/runtime/define property getters","webpack://kompletr/webpack/runtime/hasOwnProperty shorthand","webpack://kompletr/webpack/runtime/make namespace object","webpack://kompletr/./src/js/index.js"],"sourcesContent":["import { animation } from './enums.js';\n\n/**\n * Represents an Animation class that provides various animation effects.\n */\nexport class Animation {\n constructor() {}\n\n /**\n * Apply a fadeIn animation effect to the target HTML element.\n * \n * @param {HTMLElement} element - The target HTML element.\n * \n * @returns {Void}\n * \n * @todo Manage duration\n */\n static fadeIn(element) {\n element.style.opacity = 0;\n element.style.display = 'block';\n (function fade(){\n let value = parseFloat(element.style.opacity);\n if (!((value += .1) > 1)) {\n element.style.opacity = value;\n requestAnimationFrame(fade);\n }\n })();\n }\n\n /**\n * Apply a fadeOut animation effect to the target HTML element.\n * \n * @param {HTMLElement} element - The target HTML element.\n * \n * @returns {Void}\n * \n * @todo Manage duration\n */\n static fadeOut(element) {\n element.style.opacity = 1;\n (function fade() {\n if ((element.style.opacity -= .1) < 0) {\n element.style.display = 'none';\n } else {\n requestAnimationFrame(fade);\n }\n })();\n }\n\n /**\n * Apply a slideUp animation effect to the target HTML element.\n * \n * @param {HTMLElement} element - The target HTML element.\n * @param {Number} duration - The duration of the animation in milliseconds.\n * \n * @returns {Void}\n */\n static slideUp(element, duration = 500) {\n element.style.transitionProperty = 'height, margin, padding';\n element.style.transitionDuration = duration + 'ms';\n element.style.boxSizing = 'border-box';\n element.style.height = element.offsetHeight + 'px';\n element.offsetHeight;\n element.style.overflow = 'hidden';\n element.style.height = 0;\n element.style.paddingTop = 0;\n element.style.paddingBottom = 0;\n element.style.marginTop = 0;\n element.style.marginBottom = 0;\n window.setTimeout( () => {\n element.style.display = 'none';\n element.style.removeProperty('height');\n element.style.removeProperty('padding-top');\n element.style.removeProperty('padding-bottom');\n element.style.removeProperty('margin-top');\n element.style.removeProperty('margin-bottom');\n element.style.removeProperty('overflow');\n element.style.removeProperty('transition-duration');\n element.style.removeProperty('transition-property');\n }, duration);\n }\n\n /**\n * Apply a slideDown animation effect to the target HTML element.\n * \n * @param {HTMLElement} element - The target HTML element.\n * @param {Number} duration - The duration of the animation in milliseconds.\n * \n * @returns {Void}\n */\n static slideDown(element, duration = 500) {\n element.style.removeProperty('display');\n let display = window.getComputedStyle(element).display;\n if (display === 'none') display = 'block';\n element.style.display = display;\n let height = element.offsetHeight;\n element.style.overflow = 'hidden';\n element.style.height = 0;\n element.style.paddingTop = 0;\n element.style.paddingBottom = 0;\n element.style.marginTop = 0;\n element.style.marginBottom = 0;\n element.offsetHeight;\n element.style.boxSizing = 'border-box';\n element.style.transitionProperty = 'height, margin, padding';\n element.style.transitionDuration = duration + 'ms';\n element.style.height = height + 'px';\n element.style.removeProperty('padding-top');\n element.style.removeProperty('padding-bottom');\n element.style.removeProperty('margin-top');\n element.style.removeProperty('margin-bottom');\n window.setTimeout( () => {\n element.style.removeProperty('height');\n element.style.removeProperty('overflow');\n element.style.removeProperty('transition-duration');\n element.style.removeProperty('transition-property');\n },duration);\n }\n\n /**\n * Apply the opposite animation effect to a given element.\n * \n * @param {HTMLElement} element - The element to animate.\n * @param {string} [type=animation.fadeIn] - The animation to apply. By default, it's 'fadeIn'.\n * @param {number} [duration=500] - The duration of the animation in milliseconds. By default, it's 500.\n * \n * @return {Object} Returns the result of the Animation function with the opposite animation, the element, and the duration as parameters.\n */\n static animateBack(element, type = animation.fadeIn , duration = 500) {\n const animations = {\n fadeIn: 'fadeOut',\n slideDown: 'slideUp'\n };\n return Animation[animations[type]](element, duration);\n }\n}","import { event } from './enums.js';\n\n/**\n * Represents a Broadcaster that allows subscribing to and triggering events.\n */\nexport class Broadcaster {\n subscribers = [];\n\n constructor() {}\n\n /**\n * Subscribes to an event.\n * \n * @param {string} type - The type of event to subscribe to.\n * @param {Function} handler - The event handler function.\n * \n * @throws {Error} If the event type is not valid.\n */\n subscribe(type, handler) {\n if (!Object.values(event).includes(type)) {\n throw new Error(`Event should be one of ${Object.keys(event)}: ${type} given.`);\n }\n this.subscribers.push({ type, handler });\n }\n\n /**\n * Listens for an event on a specified element.\n * \n * @param {HTMLElement} element - The element to listen on.\n * @param {string} type - The type of event to listen for.\n * @param {Function} handler - The event handler function.\n */\n listen(element, type, handler) {\n element.addEventListener(type, handler);\n }\n\n /**\n * Triggers an event.\n * \n * @param {string} type - The type of event to trigger.\n * @param {Object} detail - Additional details to pass to the event handler.\n * \n * @throws {Error} If the event type is not valid.\n */\n trigger(type, detail = {}) {\n if (!Object.values(event).includes(type)) {\n throw new Error(`Event should be one of ${Object.keys(event)}: ${type} given.`);\n }\n \n this.subscribers\n .filter(subscriber => subscriber.type === type)\n .forEach(subscriber => subscriber.handler(detail));\n }\n}","import { event } from './enums.js';\n\n/**\n * @description Kompletr simple caching mechanism implementation.\n * \n * @see https://developer.mozilla.org/en-US/docs/Web/API/Cache\n * @see https://web.dev/articles/cache-api-quick-guide\n */\nexport class Cache {\n\n /**\n * @description Cache name value\n */\n _name = null;\n\n /**\n * @description Cache timelife duration\n */\n _duration = null;\n \n /**\n * @description Broadcaster instance\n */\n _braodcaster = null;\n \n constructor(broadcaster, duration = 0, name = 'kompletr.cache') {\n if (!window.caches) {\n return false;\n }\n this._broadcaster = broadcaster;\n this._name = name;\n this._duration = duration;\n }\n\n /**\n * @description Retrieve the data stored in cache and dispatch event with\n * \n * @param {String} string Input value of the current request as string\n * @param {Function} done Callback function\n * \n * @emits CustomEvent 'kompltetr.request.done' { from, data }\n * @emits CustomEvent 'kompltetr.error' { error }\n * \n * @returns {Void}\n */\n get(string, done) {\n window.caches.open(this._name)\n .then(cache => {\n cache.match(string)\n .then(async (data) => {\n done(await data.json());\n });\n })\n .catch(e => {\n this._broadcaster.trigger(event.error, e);\n });\n }\n\n /**\n * @description Push data into the cache\n * \n * @param {Object} args { string, data }\n * \n * @emits CustomEvent 'kompltetr.error' { error }\n * \n * @returns {Void}\n */\n set({ string, data }) {\n window.caches.open(this._name)\n .then(cache => {\n const headers = new Headers();\n headers.set('Content-Type', 'application/json');\n headers.set('Cache-Control', `max-age=${this._duration}`);\n cache.put(`/${string}`, new Response(JSON.stringify(data), { headers }));\n })\n .catch(e => {\n this._broadcaster.trigger(event.error, e);\n });\n }\n\n /**\n * @description Check the cache validity regarding the current request and the cache timelife\n * \n * @param {String} string The current request value\n *\n * @returns {Promise}\n */\n async isValid(string) {\n try {\n const cache = await window.caches.open(this._name);\n const response = await cache.match(`/${string}`);\n if (!response) {\n return false;\n }\n return true;\n } catch(e) {\n this._broadcaster.trigger(event.error, e);\n }\n }\n}","import { animation, searchExpression, theme } from './enums.js';\n\n/**\n * @description Represents the configuration for the Kompleter library.\n */\nexport class Configuration {\n /**\n * The type of animation for the element.\n * @type {string}\n */\n _animationType = animation.fadeIn;\n \n /**\n * The duration of the animation in milliseconds.\n * @type {number}\n */\n _animationDuration = 500;\n\n /**\n * Indicates whether multiple selections are allowed.\n * @type {boolean}\n * @private\n */\n _multiple = false;\n \n /**\n * The theme for the kompletr options.\n * @type {string}\n */\n _theme = theme.light;\n\n /**\n * Array containing the fields to be displayed.\n * @type {Array}\n * @private\n */\n _fieldsToDisplay = [];\n\n /**\n * The maximum number of results to display.\n * @type {number}\n */\n _maxResults = 10;\n\n /**\n * The character index from which querying should start.\n * @type {number}\n */\n _startQueryingFromChar = 2;\n\n /**\n * Represents the value of a property to be mapped.\n * @type {string}\n * @private\n */\n _propToMapAsValue = '';\n\n /**\n * The filter option used for filtering data.\n * Possible values are 'prefix', 'expression'.\n * @type {string}\n */\n _filterOn = searchExpression.prefix;\n\n /**\n * Represents the cache value.\n * @type {number}\n * @private\n */\n _cache = 0;\n\n /**\n * @description Type of animation between valid types\n */\n get animationType() {\n return this._animationType;\n }\n\n set animationType(value) {\n const valid = Object.keys(animation);\n if (!valid.includes(value)) {\n throw new Error(`animation.type should be one of ${valid.toString()}`);\n }\n this._animationType = value;\n }\n\n /**\n * @description Duration of some animation in ms. Default 500\n */\n get animationDuration() {\n return this._animationDuration;\n }\n\n set animationDuration(value) {\n if (isNaN(parseInt(value, 10))) {\n throw new Error('animation.duration should be an integer');\n }\n this._animationDuration = value;\n }\n\n /**\n * @description Enable / disable multiple choices\n */\n get multiple() {\n return this._multiple;\n }\n\n set multiple(value) {\n this._multiple = value;\n }\n\n /**\n * @description Display theme between light | dark\n */\n get theme() {\n return this._theme;\n }\n\n set theme(value) {\n const valid = Object.keys(theme);\n if (!valid.includes(value)) {\n throw new Error(`theme should be one of ${valid.toString()}, ${value} given`);\n }\n this._theme = value;\n }\n\n /**\n * @description Fields to display in each suggestion item\n */\n get fieldsToDisplay() {\n return this._fieldsToDisplay;\n }\n\n set fieldsToDisplay(value) {\n this._fieldsToDisplay = value;\n }\n \n /**\n * @description Maximum number of results to display as suggestions (can be different thant the number of results availables)\n */\n get maxResults() {\n return this._maxResults;\n }\n\n set maxResults(value) {\n this._maxResults = value;\n }\n\n /**\n * @description Input minimal value length before to fire research\n */\n get startQueryingFromChar() {\n return this._startQueryingFromChar;\n }\n\n set startQueryingFromChar(value) {\n this._startQueryingFromChar = value;\n }\n\n /**\n * @description Property to map as value\n */\n get propToMapAsValue() {\n return this._propToMapAsValue;\n }\n\n set propToMapAsValue(value) {\n this._propToMapAsValue = value;\n }\n\n /**\n * @description Apply filtering from the beginning of the word (prefix) or on the entire expression (expression)\n */\n get filterOn() {\n return this._filterOn;\n }\n\n set filterOn(value) {\n const valid = Object.keys(searchExpression);\n if (!valid.includes(value)) {\n throw new Error(`filterOn should be one of ${valid.toString()}, ${value} given`);\n }\n this._filterOn = value;\n }\n\n /**\n * @description Time life of the cache when data is retrieved from an API call\n */\n get cache() {\n return this._cache;\n }\n\n set cache(value) {\n if (isNaN(parseInt(value, 10))) {\n throw new Error('cache should be an integer');\n }\n this._cache = value;\n }\n\n constructor(options) {\n if (options === undefined) return;\n if (typeof options !== 'object') {\n throw new Error('options should be an object');\n }\n this.theme = options?.theme || this._theme;\n this.animationType = options?.animationType || this._animationType;\n this.animationDuration = options?.animationDuration || this._animationDuration;\n this.multiple = options?.multiple || this._multiple;\n this.fieldsToDisplay = options?.fieldsToDisplay || this._fieldsToDisplay;\n this.maxResults = options?.maxResults || this._maxResults;\n this.startQueryingFromChar = options?.startQueryingFromChar || this._startQueryingFromChar;\n this.propToMapAsValue = options?.propToMapAsValue || this._propToMapAsValue;\n this.filterOn = options?.filterOn || this._filterOn;\n this.cache = options?.cache || this._cache;\n }\n}","import { event } from './enums.js';\n\nexport class DOM {\n /**\n * @description Identifiers for the DOM elements\n */\n _identifiers = {\n results: 'kpl-result',\n };\n\n /**\n * @description Classes for the DOM elements\n */\n _classes = {\n main: 'kompletr',\n input: 'input--search',\n results: 'form--search__result',\n result: 'item--result',\n data: 'item--data',\n focus: 'focus',\n };\n\n /**\n * @description Body tag\n */\n _body = null;\n\n get body() {\n return this._body;\n }\n\n set body(value) {\n this._body = value;\n }\n\n /**\n * @description Main input text\n */\n _input = null;\n\n get input() {\n return this._input;\n }\n\n set input(value) {\n if (value instanceof HTMLInputElement === false) {\n throw new Error(`input should be an HTMLInputElement instance: ${value} given.`);\n }\n this._input = value;\n }\n\n /**\n * @description HTMLElement in suggestions who's have the focus\n */\n _focused = null;\n\n get focused() {\n return this._focused;\n }\n\n set focused(value) {\n this._focused = value;\n }\n\n /**\n * @description HTMLElement results container\n */\n _result = null;\n\n get result() {\n return this._result;\n }\n\n set result(value) {\n this._result = value;\n }\n \n /**\n * @description Broadcaster instance\n */\n _broadcaster = null;\n\n /**\n * Represents a Kompletr DOM container.\n * \n * @param {string|HTMLInputElement} input - The input element or its ID.\n * @param {object} broadcaster - The broadcaster object.\n * @param {object} [options] - The options for the DOM object.\n * @param {string} [options.theme='light'] - The theme for the DOM object.\n * \n * @returns {void}\n */\n constructor(input, broadcaster, options = { theme: 'light' }) {\n this._broadcaster = broadcaster;\n\n this.body = document.getElementsByTagName('body')[0];\n \n this.input = input instanceof HTMLInputElement ? input : document.getElementById(input);\n this.input.setAttribute('class', `${this._input.getAttribute('class')} ${this._classes.input}`);\n \n this.result = this.build('div', [ { id: this._identifiers.results }, { class: this._classes.results } ]);\n\n this.input.parentElement.setAttribute('class', `${this._input.parentElement.getAttribute('class')} ${this._classes.main} ${options.theme}`);\n this.input.parentElement.appendChild(this._result);\n }\n\n /**\n * @description Build an HTML element and set his attributes\n * \n * @param {String} element HTML tag to build\n * @param {Object[]} attributes Key / values pairs\n * \n * @returns {HTMLElement}\n */\n build(element, attributes = []) {\n const htmlElement = document.createElement(element);\n attributes.forEach(attribute => {\n htmlElement.setAttribute(Object.keys(attribute)[0], Object.values(attribute)[0]);\n });\n return htmlElement;\n }\n\n /**\n * @description Add / remove the focus on a HTMLElement\n * \n * @param {String} action add|remove\n *\n * @returns {Void}\n */\n focus(pointer) {\n if (isNaN(parseInt(pointer, 10)) || pointer < 0 || pointer > this.result.children.length - 1) {\n throw new Error('pointer should be a valid integer in the result lenght range: ' + pointer + ' given.');\n }\n\n this.focused = null;\n Array.from(this.result.children).forEach(result => {\n ((result) => {\n result.className = this._classes.result;\n })(result);\n });\n\n this.focused = this.result.children[pointer];\n this.result.children[pointer].className += ` ${this._classes.focus}`;\n }\n\n /**\n * @description Display results according to the current input value / setup\n * \n * @returns {Void}\n */\n buildResults(data, fieldsToDisplay) {\n let html = '';\n\n if(data && data.length) {\n html = data\n .reduce((html, current) => {\n html += `
`;\n switch (typeof current.data) {\n case 'string':\n html += `${current.data}`;\n break;\n case 'object': {\n let properties = Array.isArray(fieldsToDisplay) && fieldsToDisplay.length ? fieldsToDisplay: Object.keys(current.data);\n for(let j = 0; j < properties.length; j++) {\n html += `${current.data[properties[j]]}`;\n }\n break;\n }}\n html += '
';\n return html;\n }, '');\n \n } else {\n html = `
Not found
`;\n }\n\n this.result.innerHTML = html;\n\n this._broadcaster.trigger(event.domDone, this.result); // TODO: to be validated\n }\n}","/**\n * Enum representing different animation types.\n * \n * @enum {string}\n * @readonly\n */\nconst animation = Object.freeze({\n fadeIn: 'fadeIn',\n slideDown: 'slideDown',\n});\n\n\n/**\n * Enum representing different custom events.\n * \n * @enum {string}\n * @readonly\n */\nconst event = Object.freeze({\n error: 'kompletr.error',\n domDone: 'kompletr.dom.done',\n dataDone: 'kompletr.data.done',\n selectDone: 'kompletr.select.done'\n});\n\n/**\n * Enum representing the origin of a value.\n * \n * @enum {string}\n * @readonly\n */\nconst origin = Object.freeze({\n cache: 'cache',\n callback: 'callback',\n local: 'local',\n});\n\n/**\n * Enum representing the search expression options.\n * \n * @enum {string}\n * @readonly\n */\nconst searchExpression = Object.freeze({\n prefix: 'prefix',\n expression: 'expression',\n});\n\n/**\n * Enum representing the theme options.\n *\n * @enum {string}\n * @readonly\n */\nconst theme = Object.freeze({\n light: 'light',\n dark: 'dark',\n});\n\nexport { animation, event, origin, searchExpression, theme };","\nimport { Animation } from './animation.js';\nimport { event, origin, searchExpression } from './enums.js';\n\n/**\n * @summary Kømpletr.js is a library providing features dedicated to autocomplete fields.\n * \n * @author Steve Lebleu \n * \n * @see https://github.com/steve-lebleu/kompletr\n */\nexport default class Kompletr {\n /**\n * \n */\n broadcaster = null;\n\n /**\n * \n */\n cache = null;\n\n /**\n * \n */\n callbacks = {};\n\n /**\n * \n */\n configuration = null;\n\n /**\n * \n */\n dom = null;\n\n /**\n * \n */\n props = null;\n\n constructor({ configuration, properties, dom, cache, broadcaster, onKeyup, onSelect, onError }) {\n try {\n this.configuration = configuration;\n this.broadcaster = broadcaster;\n this.props = properties;\n this.dom = dom;\n this.cache = cache;\n\n // animation parameters = this.result, this.configuration.animationDuration\n\n this.broadcaster.subscribe(event.error, this.error);\n this.broadcaster.subscribe(event.dataDone, this.showResults);\n this.broadcaster.subscribe(event.domDone, Animation[this.configuration.animationType]);\n this.broadcaster.subscribe(event.domDone, this.bindResults);\n this.broadcaster.subscribe(event.selectDone, this.closeTheShop);\n\n this.broadcaster.listen(this.dom.input, 'keyup', this.suggest);\n this.broadcaster.listen(this.dom.body, 'click', this.closeTheShop); // TODO: validate this because it can be called many times if many kompletr instances\n\n if(onKeyup || onSelect || onError) {\n this.callbacks = Object.assign(this.callbacks, { onKeyup, onSelect, onError });\n }\n } catch(e) {\n broadcaster ? broadcaster.trigger(event.error, e) : console.error(`[kompletr] An error has occured -> ${e.stack}`);\n }\n }\n\n closeTheShop = (e) => {\n if (e.srcElement === this.dom.input) {\n return true;\n }\n Animation.animateBack(this.dom.result, this.configuration.animationType, this.configuration.animationDuration);\n this.resetPointer();\n };\n\n resetPointer = () => {\n this.props.pointer = -1;\n };\n\n error = (e) => {\n console.error(`[kompletr] An error has occured -> ${e.stack}`);\n Animation.fadeIn(this.dom.result);\n this.callbacks.onError && this.callbacks.onError(e);\n };\n\n filter = (data, pattern) => {\n return data.filter((record) => {\n const value = typeof record.data === 'string' ? record.data : record.data[this.configuration.propToMapAsValue];\n if (this.configuration.filterOn === searchExpression.prefix) {\n return value.toLowerCase().lastIndexOf(pattern.toLowerCase(), 0) === 0;\n }\n return value.toLowerCase().lastIndexOf(pattern.toLowerCase()) !== -1;\n });\n };\n\n /**\n * @description CustomEvent 'this.request.done' listener\n * \n * @todo Check something else to determine if we filter or not -> currently just the presence of onKeyup callback\n */\n showResults = async ({ from, data }) => {\n this.props.data = data;\n\n data = this.props.data.map((record, idx) => ({ idx, data: record }) ); // TODO: Check if we can avoid this shit\n\n if (!this.callbacks.onKeyup) {\n data = this.filter(data, this.dom.input.value);\n }\n\n if (this.cache && from !== origin.cache) {\n this.cache.set({ string: this.dom.input.value, data });\n }\n\n this.dom.buildResults(data.slice(0, this.configuration.maxResults), this.configuration.fieldsToDisplay);\n };\n\n /**\n * @description CustomEvent 'kompletr.dom.done' listener\n */\n bindResults = () => { \n if(this.dom.result?.children?.length) {\n for(let i = 0; i < this.dom.result.children.length; i++) {\n ((i) => {\n return this.broadcaster.listen(this.dom.result.children[i], 'click', () => {\n this.dom.focused = this.dom.result.children[i];\n this.select(this.dom.focused.id);\n });\n })(i);\n }\n }\n };\n\n /**\n * @description 'input.keyup' listener\n */\n suggest = (e) => {\n if (this.dom.input.value.length < this.configuration.startQueryingFromChar) {\n return;\n }\n \n const keyCode = e.keyCode;\n\n switch (keyCode) {\n case 13: // Enter\n this.select(this.dom.focused.id);\n break;\n case 38: // Up\n case 40: // Down\n this.navigate(keyCode);\n break;\n default:\n if (this.dom.input.value !== this.props.previousValue) {\n this.hydrate(this.dom.input.value);\n }\n this.resetPointer();\n break;\n }\n };\n\n /**\n * @description Manage the data hydration according to the current setup (cache, request or local data)\n * \n * @param {String} value Current input value\n * \n * @emits CustomEvent 'this.request.done' { from, data }\n * @emits CustomEvent 'this.error' { error }\n * \n * @returns {Void}\n * \n * @todo options.data could returns Promise, and same for the onKeyup callback\n */\n hydrate = async (value) => {\n try {\n if (this.cache && await this.cache.isValid(value)) {\n this.cache.get(value, (data) => {\n this.broadcaster.trigger(event.dataDone, { from: origin.cache, data: data }); \n });\n } else if (this.callbacks.onKeyup) {\n this.callbacks.onKeyup(value, (data) => {\n this.broadcaster.trigger(event.dataDone, { from: origin.callback, data: data });\n });\n } else {\n this.broadcaster.trigger(event.dataDone, { from: origin.local, data: this.props.data });\n }\n } catch(e) {\n this.broadcaster.trigger(event.error, e);\n }\n };\n\n /**\n * @description Apply visual navigation into the suggestions set\n * \n * @param {Number} keyCode The current keyCode value\n * \n * @returns {Void}\n */\n navigate = (keyCode) => {\n if (keyCode != 38 && keyCode != 40) {\n return false;\n }\n\n if(this.props.pointer < -1 || this.props.pointer > this.dom.result.children.length - 1) {\n return false;\n }\n\n if (keyCode === 38 && this.props.pointer >= -1) {\n this.props.pointer--;\n } else if (keyCode === 40 && this.props.pointer < this.dom.result.children.length - 1) {\n this.props.pointer++;\n } \n\n this.dom.focus(this.props.pointer);\n };\n\n /**\n * @description Select a suggested item as user choice\n * \n * @param {Number} idx The index of the selected suggestion\n * \n * @emits CustomEvent 'this.select.done'\n * \n * @returns {Void}\n */\n select = (idx = 0) => { \n this.dom.input.value = typeof this.props.data[idx] === 'object' ? this.props.data[idx][this.configuration.propToMapAsValue] : this.props.data[idx];\n this.callbacks.onSelect && this.callbacks.onSelect(this.props.data[idx]);\n this.broadcaster.trigger(event.selectDone);\n };\n}","/**\n * @description Dynamic properties of current Kompltr instance.\n */\nexport class Properties {\n\n /**\n * @description Data storage\n */\n _data = null;\n\n get data() {\n return this._data;\n }\n\n set data(value) {\n if (!Array.isArray(value)) {\n throw new Error(`data must be an array (${value.toString()} given)`);\n }\n this._data = value;\n }\n\n /**\n * @description Position of the pointer inside the suggestions\n */\n _pointer = null;\n\n get pointer() {\n return this._pointer;\n }\n\n set pointer(value) {\n if (isNaN(parseInt(value, 10))) {\n throw new Error(`pointer must be an integer (${value.toString()} given)`);\n }\n this._pointer = value;\n }\n\n /**\n * @description Previous input value\n */\n _previousValue = null;\n\n get previousValue() {\n return this._previousValue;\n }\n\n set previousValue(value) {\n this._previousValue = value;\n }\n\n constructor(data = []) {\n this._data = data;\n }\n}","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import Kompletr from './kompletr.js';\n\nimport { Configuration } from './configuration.js';\nimport { Cache } from './cache.js';\nimport { Broadcaster } from './broadcaster.js';\nimport { Properties } from './properties.js';\nimport { DOM } from './dom.js';\n\n/**\n * Initializes the module with the provided data and options.\n *\n * @param {string|HTMLInputElement} input - The target input as selector or instance.\n * @param {Object} data - The data used by the application.\n * @param {Object} options - The configuration options for the application.\n * @param {Function} onKeyup - The callback function to be executed on keyup event.\n * @param {Function} onSelect - The callback function to be executed on select event.\n * @param {Function} onError - The callback function to be executed on error event.\n * \n * @returns {void}\n */\nconst kompletr = function({ input, data, options, onKeyup, onSelect, onError }) {\n const broadcaster = new Broadcaster();\n\n const configuration = new Configuration(options);\n const properties = new Properties(data);\n\n const dom = new DOM(input, broadcaster, configuration);\n const cache = configuration.cache ? new Cache(broadcaster, configuration.cache) : null;\n \n new Kompletr({ configuration, properties, dom, cache, broadcaster, onKeyup, onSelect, onError });\n};\n\nwindow.kompletr = kompletr;\n\nexport { kompletr };"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"main.js","mappings":";;;;;;;;;;;;;;;AAAuC;;AAEvC;AACA;AACA;AACO;AACP;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,QAAQ;AACR;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B,aAAa,QAAQ;AACrB,aAAa,QAAQ;AACrB;AACA,cAAc,QAAQ;AACtB;AACA,qCAAqC,gDAAS;AAC9C;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;ACvImC;;AAEnC;AACA;AACA;AACO;AACP;;AAEA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB,aAAa,UAAU;AACvB;AACA,cAAc,OAAO;AACrB;AACA;AACA,uBAAuB,4CAAK;AAC5B,gDAAgD,YAAY,4CAAK,EAAE,IAAI,MAAM;AAC7E;AACA,4BAA4B,eAAe;AAC3C;;AAEA;AACA;AACA;AACA,aAAa,aAAa;AAC1B,aAAa,QAAQ;AACrB,aAAa,UAAU;AACvB;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB,aAAa,QAAQ;AACrB;AACA,cAAc,OAAO;AACrB;AACA,2BAA2B;AAC3B,uBAAuB,4CAAK;AAC5B,gDAAgD,YAAY,4CAAK,EAAE,IAAI,MAAM;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;ACrDmC;;AAEnC;AACA;AACA;AACA;AACA;AACA;AACO;;AAEP;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB,aAAa,UAAU;AACvB;AACA,mDAAmD;AACnD,4CAA4C;AAC5C;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAW;AACX,OAAO;AACP;AACA,kCAAkC,4CAAK;AACvC,OAAO;AACP;;AAEA;AACA;AACA;AACA,aAAa,QAAQ,OAAO;AAC5B;AACA,4CAA4C;AAC5C;AACA,eAAe;AACf;AACA,QAAQ,cAAc;AACtB;AACA;AACA;AACA;AACA,gDAAgD,eAAe;AAC/D,sBAAsB,OAAO,wCAAwC,SAAS;AAC9E,OAAO;AACP;AACA,kCAAkC,4CAAK;AACvC,OAAO;AACP;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA,6CAA6C,OAAO;AACpD;AACA;AACA;AACA;AACA,MAAM;AACN,gCAAgC,4CAAK;AACrC;AACA;AACA;;;;;;;;;;;;;;;ACnGgE;;AAEhE;AACA;AACA;AACO;AACP;AACA;AACA,YAAY;AACZ;AACA,mBAAmB,gDAAS;AAC5B;AACA;AACA;AACA,YAAY;AACZ;AACA;;AAEA;AACA;AACA,YAAY;AACZ;AACA;AACA;AACA;AACA;AACA;AACA,YAAY;AACZ;AACA,WAAW,4CAAK;;AAEhB;AACA;AACA,YAAY;AACZ;AACA;AACA;;AAEA;AACA;AACA,YAAY;AACZ;AACA;;AAEA;AACA;AACA,YAAY;AACZ;AACA;;AAEA;AACA;AACA,YAAY;AACZ;AACA;AACA;;AAEA;AACA;AACA;AACA,YAAY;AACZ;AACA,cAAc,uDAAgB;;AAE9B;AACA;AACA,YAAY;AACZ;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,8BAA8B,gDAAS;AACvC;AACA,yDAAyD,iBAAiB;AAC1E;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,8BAA8B,4CAAK;AACnC;AACA,gDAAgD,iBAAiB,IAAI,OAAO;AAC5E;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,8BAA8B,uDAAgB;AAC9C;AACA,mDAAmD,iBAAiB,IAAI,OAAO;AAC/E;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;ACvNmC;;AAE5B;AACP;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,uEAAuE,OAAO;AAC9E;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,aAAa,yBAAyB;AACtC,aAAa,QAAQ;AACrB,aAAa,QAAQ;AACrB,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA,8CAA8C,gBAAgB;AAC9D;;AAEA;AACA;AACA;AACA,wCAAwC,mCAAmC,EAAE,oBAAoB;AACjG;AACA,wCAAwC,+BAA+B,IAAI,+BAA+B;;AAE1G,sDAAsD,iDAAiD,EAAE,oBAAoB,EAAE,cAAc;AAC7I;AACA;;AAEA;AACA;AACA;AACA,YAAY,QAAQ;AACpB,YAAY,UAAU;AACtB;AACA,cAAc;AACd;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO;AACP,KAAK;;AAEL;AACA,mDAAmD,oBAAoB;AACvE;;AAEA;AACA;AACA;AACA,eAAe;AACf;AACA;AACA;;AAEA;AACA;AACA;AACA,8BAA8B,YAAY,WAAW,qBAAqB;AAC1E;AACA;AACA,oCAAoC,mBAAmB,IAAI,aAAa;AACxE;AACA;AACA;AACA,2BAA2B,uBAAuB;AAClD,sCAAsC,mBAAmB,IAAI,4BAA4B;AACzF;AACA;AACA;AACA;AACA;AACA,SAAS;AACT;AACA,MAAM;AACN,4BAA4B,qBAAqB;AACjD;;AAEA;;AAEA,8BAA8B,4CAAK,wBAAwB;AAC3D;AACA;;;;;;;;;;;;;;;;;;ACxLA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA,CAAC;;;AAGD;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA,CAAC;;;;;;;;;;;;;;;;;;;ACxD0C;AACkB;;AAE7D;AACA;AACA;AACA;AACA;AACA;AACA;AACe;AACf;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA,gBAAgB,gFAAgF;AAChG;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA,iCAAiC,4CAAK;AACtC,iCAAiC,4CAAK;AACtC,iCAAiC,4CAAK,UAAU,oDAAS;AACzD,iCAAiC,4CAAK;AACtC,iCAAiC,4CAAK;;AAEtC;AACA,0EAA0E;;AAE1E;AACA,yDAAyD,4BAA4B;AACrF;AACA,MAAM;AACN,wCAAwC,4CAAK,iEAAiE,QAAQ;AACtH;AACA;;AAEA;AACA;AACA;AACA;AACA,IAAI,oDAAS;AACb;AACA;;AAEA;AACA;AACA;;AAEA;AACA,wDAAwD,QAAQ;AAChE,IAAI,oDAAS;AACb;AACA;;AAEA;AACA;AACA;AACA,0CAA0C,uDAAgB;AAC1D;AACA;AACA;AACA,KAAK;AACL;;AAEA;AACA;AACA;AACA;AACA;AACA,yBAAyB,YAAY;AACrC;;AAEA,mDAAmD,mBAAmB,KAAK;;AAE3E;AACA;AACA;;AAEA,+BAA+B,6CAAM;AACrC,uBAAuB,oCAAoC;AAC3D;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,qBAAqB,qCAAqC;AAC1D;AACA;AACA;AACA;AACA,WAAW;AACX,SAAS;AACT;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA,8CAA8C;AAC9C,uCAAuC;AACvC;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mCAAmC,4CAAK,aAAa,MAAM,6CAAM,oBAAoB;AACrF,SAAS;AACT,QAAQ;AACR;AACA,mCAAmC,4CAAK,aAAa,MAAM,6CAAM,uBAAuB;AACxF,SAAS;AACT,QAAQ;AACR,iCAAiC,4CAAK,aAAa,MAAM,6CAAM,+BAA+B;AAC9F;AACA,MAAM;AACN,+BAA+B,4CAAK;AACpC;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,MAAM;AACN;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA,aAAa,QAAQ;AACrB;AACA;AACA;AACA,eAAe;AACf;AACA;AACA;AACA;AACA,6BAA6B,4CAAK;AAClC;AACA;;;;;;;;;;;;;;ACtOA;AACA;AACA;AACO;;AAEP;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,gDAAgD,kBAAkB;AAClE;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,qDAAqD,kBAAkB;AACvE;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;;;;;UCrDA;UACA;;UAEA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;;UAEA;UACA;;UAEA;UACA;UACA;;;;;WCtBA;WACA;WACA;WACA;WACA,yCAAyC,wCAAwC;WACjF;WACA;WACA;;;;;WCPA,8CAA8C;;;;;WCA9C;WACA;WACA;WACA,uDAAuD,iBAAiB;WACxE;WACA,gDAAgD,aAAa;WAC7D;;;;;;;;;;;;;;;;;;;;ACNqC;;AAEc;AAChB;AACY;AACF;AACd;;AAE/B;AACA;AACA;AACA,WAAW,yBAAyB;AACpC,WAAW,QAAQ;AACnB,WAAW,QAAQ;AACnB,WAAW,UAAU;AACrB,WAAW,UAAU;AACrB,WAAW,UAAU;AACrB;AACA,aAAa;AACb;AACA,4BAA4B,kDAAkD;AAC9E,0BAA0B,wDAAW;;AAErC,4BAA4B,4DAAa;AACzC,yBAAyB,sDAAU;;AAEnC,kBAAkB,wCAAG;AACrB,0CAA0C,4CAAK;AAC/C;AACA,MAAM,oDAAQ,GAAG,gFAAgF;AACjG;;AAEA","sources":["webpack://kompletr/./src/js/animation.js","webpack://kompletr/./src/js/broadcaster.js","webpack://kompletr/./src/js/cache.js","webpack://kompletr/./src/js/configuration.js","webpack://kompletr/./src/js/dom.js","webpack://kompletr/./src/js/enums.js","webpack://kompletr/./src/js/kompletr.js","webpack://kompletr/./src/js/properties.js","webpack://kompletr/webpack/bootstrap","webpack://kompletr/webpack/runtime/define property getters","webpack://kompletr/webpack/runtime/hasOwnProperty shorthand","webpack://kompletr/webpack/runtime/make namespace object","webpack://kompletr/./src/js/index.js"],"sourcesContent":["import { animation } from './enums.js';\n\n/**\n * Represents an Animation class that provides various animation effects.\n */\nexport class Animation {\n constructor() {}\n\n /**\n * Apply a fadeIn animation effect to the target HTML element.\n * \n * @param {HTMLElement} element - The target HTML element.\n * \n * @returns {Void}\n * \n * @todo Manage duration\n */\n static fadeIn(element) {\n element.style.opacity = 0;\n element.style.display = 'block';\n (function fade(){\n let value = parseFloat(element.style.opacity);\n if (!((value += .1) > 1)) {\n element.style.opacity = value;\n requestAnimationFrame(fade);\n }\n })();\n }\n\n /**\n * Apply a fadeOut animation effect to the target HTML element.\n * \n * @param {HTMLElement} element - The target HTML element.\n * \n * @returns {Void}\n * \n * @todo Manage duration\n */\n static fadeOut(element) {\n element.style.opacity = 1;\n (function fade() {\n if ((element.style.opacity -= .1) < 0) {\n element.style.display = 'none';\n } else {\n requestAnimationFrame(fade);\n }\n })();\n }\n\n /**\n * Apply a slideUp animation effect to the target HTML element.\n * \n * @param {HTMLElement} element - The target HTML element.\n * @param {Number} duration - The duration of the animation in milliseconds.\n * \n * @returns {Void}\n */\n static slideUp(element, duration = 500) {\n element.style.transitionProperty = 'height, margin, padding';\n element.style.transitionDuration = duration + 'ms';\n element.style.boxSizing = 'border-box';\n element.style.height = element.offsetHeight + 'px';\n element.offsetHeight;\n element.style.overflow = 'hidden';\n element.style.height = 0;\n element.style.paddingTop = 0;\n element.style.paddingBottom = 0;\n element.style.marginTop = 0;\n element.style.marginBottom = 0;\n window.setTimeout( () => {\n element.style.display = 'none';\n element.style.removeProperty('height');\n element.style.removeProperty('padding-top');\n element.style.removeProperty('padding-bottom');\n element.style.removeProperty('margin-top');\n element.style.removeProperty('margin-bottom');\n element.style.removeProperty('overflow');\n element.style.removeProperty('transition-duration');\n element.style.removeProperty('transition-property');\n }, duration);\n }\n\n /**\n * Apply a slideDown animation effect to the target HTML element.\n * \n * @param {HTMLElement} element - The target HTML element.\n * @param {Number} duration - The duration of the animation in milliseconds.\n * \n * @returns {Void}\n */\n static slideDown(element, duration = 500) {\n element.style.removeProperty('display');\n let display = window.getComputedStyle(element).display;\n if (display === 'none') display = 'block';\n element.style.display = display;\n let height = element.offsetHeight;\n element.style.overflow = 'hidden';\n element.style.height = 0;\n element.style.paddingTop = 0;\n element.style.paddingBottom = 0;\n element.style.marginTop = 0;\n element.style.marginBottom = 0;\n element.offsetHeight;\n element.style.boxSizing = 'border-box';\n element.style.transitionProperty = 'height, margin, padding';\n element.style.transitionDuration = duration + 'ms';\n element.style.height = height + 'px';\n element.style.removeProperty('padding-top');\n element.style.removeProperty('padding-bottom');\n element.style.removeProperty('margin-top');\n element.style.removeProperty('margin-bottom');\n window.setTimeout( () => {\n element.style.removeProperty('height');\n element.style.removeProperty('overflow');\n element.style.removeProperty('transition-duration');\n element.style.removeProperty('transition-property');\n },duration);\n }\n\n /**\n * Apply the opposite animation effect to a given element.\n * \n * @param {HTMLElement} element - The element to animate.\n * @param {string} [type=animation.fadeIn] - The animation to apply. By default, it's 'fadeIn'.\n * @param {number} [duration=500] - The duration of the animation in milliseconds. By default, it's 500.\n * \n * @return {Object} Returns the result of the Animation function with the opposite animation, the element, and the duration as parameters.\n */\n static animateBack(element, type = animation.fadeIn , duration = 500) {\n const animations = {\n fadeIn: 'fadeOut',\n slideDown: 'slideUp'\n };\n return Animation[animations[type]](element, duration);\n }\n}","import { event } from './enums.js';\n\n/**\n * Represents a Broadcaster that allows subscribing to and triggering events.\n */\nexport class Broadcaster {\n subscribers = [];\n\n constructor() {}\n\n /**\n * Subscribes to an event.\n * \n * @param {string} type - The type of event to subscribe to.\n * @param {Function} handler - The event handler function.\n * \n * @throws {Error} If the event type is not valid.\n */\n subscribe(type, handler) {\n if (!Object.values(event).includes(type)) {\n throw new Error(`Event should be one of ${Object.keys(event)}: ${type} given.`);\n }\n this.subscribers.push({ type, handler });\n }\n\n /**\n * Listens for an event on a specified element.\n * \n * @param {HTMLElement} element - The element to listen on.\n * @param {string} type - The type of event to listen for.\n * @param {Function} handler - The event handler function.\n */\n listen(element, type, handler) {\n element.addEventListener(type, handler);\n }\n\n /**\n * Triggers an event.\n * \n * @param {string} type - The type of event to trigger.\n * @param {Object} detail - Additional details to pass to the event handler.\n * \n * @throws {Error} If the event type is not valid.\n */\n trigger(type, detail = {}) {\n if (!Object.values(event).includes(type)) {\n throw new Error(`Event should be one of ${Object.keys(event)}: ${type} given.`);\n }\n \n this.subscribers\n .filter(subscriber => subscriber.type === type)\n .forEach(subscriber => subscriber.handler(detail));\n }\n}","import { event } from './enums.js';\n\n/**\n * @description Kompletr simple caching mechanism implementation.\n * \n * @see https://developer.mozilla.org/en-US/docs/Web/API/Cache\n * @see https://web.dev/articles/cache-api-quick-guide\n */\nexport class Cache {\n\n /**\n * @description Cache name value\n */\n _name = null;\n\n /**\n * @description Cache timelife duration\n */\n _duration = null;\n \n /**\n * @description Broadcaster instance\n */\n _braodcaster = null;\n \n constructor(broadcaster, duration = 0, name = 'kompletr.cache') {\n if (!window.caches) {\n return false;\n }\n this._broadcaster = broadcaster;\n this._name = name;\n this._duration = duration;\n }\n\n /**\n * @description Retrieve the data stored in cache and dispatch event with\n * \n * @param {String} string Input value of the current request as string\n * @param {Function} done Callback function\n * \n * @emits CustomEvent 'kompltetr.request.done' { from, data }\n * @emits CustomEvent 'kompltetr.error' { error }\n * \n * @returns {Void}\n */\n get(string, done) {\n window.caches.open(this._name)\n .then(cache => {\n cache.match(string)\n .then(async (data) => {\n done(await data.json());\n });\n })\n .catch(e => {\n this._broadcaster.trigger(event.error, e);\n });\n }\n\n /**\n * @description Push data into the cache\n * \n * @param {Object} args { string, data }\n * \n * @emits CustomEvent 'kompltetr.error' { error }\n * \n * @returns {Void}\n */\n set({ string, data }) {\n window.caches.open(this._name)\n .then(cache => {\n const headers = new Headers();\n headers.set('Content-Type', 'application/json');\n headers.set('Cache-Control', `max-age=${this._duration}`);\n cache.put(`/${string}`, new Response(JSON.stringify(data), { headers }));\n })\n .catch(e => {\n this._broadcaster.trigger(event.error, e);\n });\n }\n\n /**\n * @description Check the cache validity regarding the current request and the cache timelife\n * \n * @param {String} string The current request value\n *\n * @returns {Promise}\n */\n async isValid(string) {\n try {\n const cache = await window.caches.open(this._name);\n const response = await cache.match(`/${string}`);\n if (!response) {\n return false;\n }\n return true;\n } catch(e) {\n this._broadcaster.trigger(event.error, e);\n }\n }\n}","import { animation, searchExpression, theme } from './enums.js';\n\n/**\n * @description Represents the configuration for the Kompleter library.\n */\nexport class Configuration {\n /**\n * The type of animation for the element.\n * @type {string}\n */\n _animationType = animation.fadeIn;\n \n /**\n * The duration of the animation in milliseconds.\n * @type {number}\n */\n _animationDuration = 500;\n\n /**\n * Indicates whether multiple selections are allowed.\n * @type {boolean}\n * @private\n */\n _multiple = false;\n \n /**\n * The theme for the kompletr options.\n * @type {string}\n */\n _theme = theme.light;\n\n /**\n * Array containing the fields to be displayed.\n * @type {Array}\n * @private\n */\n _fieldsToDisplay = [];\n\n /**\n * The maximum number of results to display.\n * @type {number}\n */\n _maxResults = 10;\n\n /**\n * The character index from which querying should start.\n * @type {number}\n */\n _startQueryingFromChar = 2;\n\n /**\n * Represents the value of a property to be mapped.\n * @type {string}\n * @private\n */\n _propToMapAsValue = '';\n\n /**\n * The filter option used for filtering data.\n * Possible values are 'prefix', 'expression'.\n * @type {string}\n */\n _filterOn = searchExpression.prefix;\n\n /**\n * Represents the cache value.\n * @type {number}\n * @private\n */\n _cache = 0;\n\n /**\n * @description Type of animation between valid types\n */\n get animationType() {\n return this._animationType;\n }\n\n set animationType(value) {\n const valid = Object.keys(animation);\n if (!valid.includes(value)) {\n throw new Error(`animation.type should be one of ${valid.toString()}`);\n }\n this._animationType = value;\n }\n\n /**\n * @description Duration of some animation in ms. Default 500\n */\n get animationDuration() {\n return this._animationDuration;\n }\n\n set animationDuration(value) {\n if (isNaN(parseInt(value, 10))) {\n throw new Error('animation.duration should be an integer');\n }\n this._animationDuration = value;\n }\n\n /**\n * @description Enable / disable multiple choices\n */\n get multiple() {\n return this._multiple;\n }\n\n set multiple(value) {\n this._multiple = value;\n }\n\n /**\n * @description Display theme between light | dark\n */\n get theme() {\n return this._theme;\n }\n\n set theme(value) {\n const valid = Object.keys(theme);\n if (!valid.includes(value)) {\n throw new Error(`theme should be one of ${valid.toString()}, ${value} given`);\n }\n this._theme = value;\n }\n\n /**\n * @description Fields to display in each suggestion item\n */\n get fieldsToDisplay() {\n return this._fieldsToDisplay;\n }\n\n set fieldsToDisplay(value) {\n this._fieldsToDisplay = value;\n }\n \n /**\n * @description Maximum number of results to display as suggestions (can be different thant the number of results availables)\n */\n get maxResults() {\n return this._maxResults;\n }\n\n set maxResults(value) {\n this._maxResults = value;\n }\n\n /**\n * @description Input minimal value length before to fire research\n */\n get startQueryingFromChar() {\n return this._startQueryingFromChar;\n }\n\n set startQueryingFromChar(value) {\n this._startQueryingFromChar = value;\n }\n\n /**\n * @description Property to map as value\n */\n get propToMapAsValue() {\n return this._propToMapAsValue;\n }\n\n set propToMapAsValue(value) {\n this._propToMapAsValue = value;\n }\n\n /**\n * @description Apply filtering from the beginning of the word (prefix) or on the entire expression (expression)\n */\n get filterOn() {\n return this._filterOn;\n }\n\n set filterOn(value) {\n const valid = Object.keys(searchExpression);\n if (!valid.includes(value)) {\n throw new Error(`filterOn should be one of ${valid.toString()}, ${value} given`);\n }\n this._filterOn = value;\n }\n\n /**\n * @description Time life of the cache when data is retrieved from an API call\n */\n get cache() {\n return this._cache;\n }\n\n set cache(value) {\n if (isNaN(parseInt(value, 10))) {\n throw new Error('cache should be an integer');\n }\n this._cache = value;\n }\n\n constructor(options) {\n if (options === undefined) return;\n if (typeof options !== 'object') {\n throw new Error('options should be an object');\n }\n this.theme = options?.theme || this._theme;\n this.animationType = options?.animationType || this._animationType;\n this.animationDuration = options?.animationDuration || this._animationDuration;\n this.multiple = options?.multiple || this._multiple;\n this.fieldsToDisplay = options?.fieldsToDisplay || this._fieldsToDisplay;\n this.maxResults = options?.maxResults || this._maxResults;\n this.startQueryingFromChar = options?.startQueryingFromChar || this._startQueryingFromChar;\n this.propToMapAsValue = options?.propToMapAsValue || this._propToMapAsValue;\n this.filterOn = options?.filterOn || this._filterOn;\n this.cache = options?.cache || this._cache;\n }\n}","import { event } from './enums.js';\n\nexport class DOM {\n /**\n * @description Identifiers for the DOM elements\n */\n _identifiers = {\n results: 'kpl-result',\n };\n\n /**\n * @description Classes for the DOM elements\n */\n _classes = {\n main: 'kompletr',\n input: 'input--search',\n results: 'form--search__result',\n result: 'item--result',\n data: 'item--data',\n focus: 'focus',\n };\n\n /**\n * @description Body tag\n */\n _body = null;\n\n get body() {\n return this._body;\n }\n\n set body(value) {\n this._body = value;\n }\n\n /**\n * @description Main input text\n */\n _input = null;\n\n get input() {\n return this._input;\n }\n\n set input(value) {\n if (value instanceof HTMLInputElement === false) {\n throw new Error(`input should be an HTMLInputElement instance: ${value} given.`);\n }\n this._input = value;\n }\n\n /**\n * @description HTMLElement in suggestions who's have the focus\n */\n _focused = null;\n\n get focused() {\n return this._focused;\n }\n\n set focused(value) {\n this._focused = value;\n }\n\n /**\n * @description HTMLElement results container\n */\n _result = null;\n\n get result() {\n return this._result;\n }\n\n set result(value) {\n this._result = value;\n }\n \n /**\n * @description Broadcaster instance\n */\n _broadcaster = null;\n\n /**\n * Represents a Kompletr DOM container.\n * \n * @param {string|HTMLInputElement} input - The input element or its ID.\n * @param {object} broadcaster - The broadcaster object.\n * @param {object} [options] - The options for the DOM object.\n * @param {string} [options.theme='light'] - The theme for the DOM object.\n * \n * @returns {void}\n */\n constructor(input, broadcaster, options = { theme: 'light' }) {\n this._broadcaster = broadcaster;\n\n this.body = document.getElementsByTagName('body')[0];\n \n this.input = input instanceof HTMLInputElement ? input : document.getElementById(input);\n this.input.setAttribute('class', `${this._input.getAttribute('class')} ${this._classes.input}`);\n \n this.result = this.build('div', [ { id: this._identifiers.results }, { class: this._classes.results } ]);\n\n this.input.parentElement.setAttribute('class', `${this._input.parentElement.getAttribute('class')} ${this._classes.main} ${options.theme}`);\n this.input.parentElement.appendChild(this._result);\n }\n\n /**\n * @description Build an HTML element and set his attributes\n * \n * @param {String} element HTML tag to build\n * @param {Object[]} attributes Key / values pairs\n * \n * @returns {HTMLElement}\n */\n build(element, attributes = []) {\n const htmlElement = document.createElement(element);\n attributes.forEach(attribute => {\n htmlElement.setAttribute(Object.keys(attribute)[0], Object.values(attribute)[0]);\n });\n return htmlElement;\n }\n\n /**\n * @description Add / remove the focus on a HTMLElement\n * \n * @param {String} action add|remove\n *\n * @returns {Void}\n */\n focus(pointer) {\n if (isNaN(parseInt(pointer, 10))) {\n throw new Error('pointer should be a valid integer in the result lenght range: ' + pointer + ' given.');\n }\n\n if (pointer < 0 || pointer > this.result.children.length - 1) {\n return false;\n }\n \n this.focused = null;\n Array.from(this.result.children).forEach(result => {\n ((result) => {\n result.className = this._classes.result;\n })(result);\n });\n\n this.focused = this.result.children[pointer];\n this.result.children[pointer].className += ` ${this._classes.focus}`;\n }\n\n /**\n * @description Display results according to the current input value / setup\n * \n * @returns {Void}\n */\n buildResults(data, fieldsToDisplay) {\n let html = '';\n\n if(data && data.length) {\n html = data\n .reduce((html, current) => {\n html += `
`;\n switch (typeof current.data) {\n case 'string':\n html += `${current.data}`;\n break;\n case 'object': {\n let properties = Array.isArray(fieldsToDisplay) && fieldsToDisplay.length ? fieldsToDisplay: Object.keys(current.data);\n for(let j = 0; j < properties.length; j++) {\n html += `${current.data[properties[j]]}`;\n }\n break;\n }}\n html += '
';\n return html;\n }, '');\n \n } else {\n html = `
Not found
`;\n }\n\n this.result.innerHTML = html;\n\n this._broadcaster.trigger(event.domDone, this.result); // TODO: to be validated\n }\n}","/**\n * Enum representing different animation types.\n * \n * @enum {string}\n * @readonly\n */\nconst animation = Object.freeze({\n fadeIn: 'fadeIn',\n slideDown: 'slideDown',\n});\n\n\n/**\n * Enum representing different custom events.\n * \n * @enum {string}\n * @readonly\n */\nconst event = Object.freeze({\n error: 'kompletr.error',\n domDone: 'kompletr.dom.done',\n dataDone: 'kompletr.data.done',\n selectDone: 'kompletr.select.done'\n});\n\n/**\n * Enum representing the origin of a value.\n * \n * @enum {string}\n * @readonly\n */\nconst origin = Object.freeze({\n cache: 'cache',\n callback: 'callback',\n local: 'local',\n});\n\n/**\n * Enum representing the search expression options.\n * \n * @enum {string}\n * @readonly\n */\nconst searchExpression = Object.freeze({\n prefix: 'prefix',\n expression: 'expression',\n});\n\n/**\n * Enum representing the theme options.\n *\n * @enum {string}\n * @readonly\n */\nconst theme = Object.freeze({\n light: 'light',\n dark: 'dark',\n});\n\nexport { animation, event, origin, searchExpression, theme };","\nimport { Animation } from './animation.js';\nimport { event, origin, searchExpression } from './enums.js';\n\n/**\n * @summary Kømpletr.js is a library providing features dedicated to autocomplete fields.\n * \n * @author Steve Lebleu \n * \n * @see https://github.com/steve-lebleu/kompletr\n */\nexport default class Kompletr {\n /**\n * \n */\n broadcaster = null;\n\n /**\n * \n */\n cache = null;\n\n /**\n * \n */\n callbacks = {};\n\n /**\n * \n */\n configuration = null;\n\n /**\n * \n */\n dom = null;\n\n /**\n * \n */\n props = null;\n\n constructor({ configuration, properties, dom, cache, broadcaster, onKeyup, onSelect, onError }) {\n try {\n this.configuration = configuration;\n this.broadcaster = broadcaster;\n this.props = properties;\n this.dom = dom;\n this.cache = cache;\n\n // animation parameters = this.result, this.configuration.animationDuration\n\n this.broadcaster.subscribe(event.error, this.error);\n this.broadcaster.subscribe(event.dataDone, this.showResults);\n this.broadcaster.subscribe(event.domDone, Animation[this.configuration.animationType]);\n this.broadcaster.subscribe(event.domDone, this.bindResults);\n this.broadcaster.subscribe(event.selectDone, this.closeTheShop);\n\n this.broadcaster.listen(this.dom.input, 'keyup', this.suggest);\n this.broadcaster.listen(this.dom.body, 'click', this.closeTheShop); // TODO: validate this because it can be called many times if many kompletr instances\n\n if(onKeyup || onSelect || onError) {\n this.callbacks = Object.assign(this.callbacks, { onKeyup, onSelect, onError });\n }\n } catch(e) {\n broadcaster ? broadcaster.trigger(event.error, e) : console.error(`[kompletr] An error has occured -> ${e.stack}`);\n }\n }\n\n closeTheShop = (e) => {\n if (e.srcElement === this.dom.input) {\n return true;\n }\n Animation.animateBack(this.dom.result, this.configuration.animationType, this.configuration.animationDuration);\n this.resetPointer();\n };\n\n resetPointer = () => {\n this.props.pointer = -1;\n };\n\n error = (e) => {\n console.error(`[kompletr] An error has occured -> ${e.stack}`);\n Animation.fadeIn(this.dom.result);\n this.callbacks.onError && this.callbacks.onError(e);\n };\n\n filter = (data, pattern) => {\n return data.filter((record) => {\n const value = typeof record.data === 'string' ? record.data : record.data[this.configuration.propToMapAsValue];\n if (this.configuration.filterOn === searchExpression.prefix) {\n return value.toLowerCase().lastIndexOf(pattern.toLowerCase(), 0) === 0;\n }\n return value.toLowerCase().lastIndexOf(pattern.toLowerCase()) !== -1;\n });\n };\n\n /**\n * @description CustomEvent 'this.request.done' listener\n * \n * @todo Check something else to determine if we filter or not -> currently just the presence of onKeyup callback\n */\n showResults = async ({ from, data }) => {\n this.props.data = data;\n\n data = this.props.data.map((record, idx) => ({ idx, data: record }) ); // TODO: Check if we can avoid this shit\n\n if (!this.callbacks.onKeyup) {\n data = this.filter(data, this.dom.input.value);\n }\n\n if (this.cache && from !== origin.cache) {\n this.cache.set({ string: this.dom.input.value, data });\n }\n\n this.dom.buildResults(data.slice(0, this.configuration.maxResults), this.configuration.fieldsToDisplay);\n };\n\n /**\n * @description CustomEvent 'kompletr.dom.done' listener\n */\n bindResults = () => { \n if(this.dom.result?.children?.length) {\n for(let i = 0; i < this.dom.result.children.length; i++) {\n ((i) => {\n return this.broadcaster.listen(this.dom.result.children[i], 'click', () => {\n this.dom.focused = this.dom.result.children[i];\n this.select(this.dom.focused.id);\n });\n })(i);\n }\n }\n };\n\n /**\n * @description 'input.keyup' listener\n */\n suggest = (e) => {\n if (this.dom.input.value.length < this.configuration.startQueryingFromChar) {\n return;\n }\n \n const keyCode = e.keyCode;\n\n switch (keyCode) {\n case 13: // Enter\n this.select(this.dom.focused.id);\n break;\n case 38: // Up\n case 40: // Down\n this.navigate(keyCode);\n break;\n default:\n if (this.dom.input.value !== this.props.previousValue) {\n this.hydrate(this.dom.input.value);\n }\n this.resetPointer();\n break;\n }\n };\n\n /**\n * @description Manage the data hydration according to the current setup (cache, request or local data)\n * \n * @param {String} value Current input value\n * \n * @emits CustomEvent 'this.request.done' { from, data }\n * @emits CustomEvent 'this.error' { error }\n * \n * @returns {Void}\n * \n * @todo options.data could returns Promise, and same for the onKeyup callback\n */\n hydrate = async (value) => {\n try {\n if (this.cache && await this.cache.isValid(value)) {\n this.cache.get(value, (data) => {\n this.broadcaster.trigger(event.dataDone, { from: origin.cache, data: data }); \n });\n } else if (this.callbacks.onKeyup) {\n this.callbacks.onKeyup(value, (data) => {\n this.broadcaster.trigger(event.dataDone, { from: origin.callback, data: data });\n });\n } else {\n this.broadcaster.trigger(event.dataDone, { from: origin.local, data: this.props.data });\n }\n } catch(e) {\n this.broadcaster.trigger(event.error, e);\n }\n };\n\n /**\n * @description Apply visual navigation into the suggestions set\n * \n * @param {Number} keyCode The current keyCode value\n * \n * @returns {Void}\n */\n navigate = (keyCode) => {\n if (keyCode != 38 && keyCode != 40) {\n return false;\n }\n\n if(this.props.pointer < -1 || this.props.pointer > this.dom.result.children.length - 1) {\n return false;\n }\n\n if (keyCode === 38 && this.props.pointer >= -1) {\n this.props.pointer--;\n } else if (keyCode === 40 && this.props.pointer < this.dom.result.children.length - 1) {\n this.props.pointer++;\n } \n\n this.dom.focus(this.props.pointer);\n };\n\n /**\n * @description Select a suggested item as user choice\n * \n * @param {Number} idx The index of the selected suggestion\n * \n * @emits CustomEvent 'this.select.done'\n * \n * @returns {Void}\n */\n select = (idx = 0) => { \n this.dom.input.value = typeof this.props.data[idx] === 'object' ? this.props.data[idx][this.configuration.propToMapAsValue] : this.props.data[idx];\n this.callbacks.onSelect && this.callbacks.onSelect(this.props.data[idx]);\n this.broadcaster.trigger(event.selectDone);\n };\n}","/**\n * @description Dynamic properties of current Kompltr instance.\n */\nexport class Properties {\n\n /**\n * @description Data storage\n */\n _data = null;\n\n get data() {\n return this._data;\n }\n\n set data(value) {\n if (!Array.isArray(value)) {\n throw new Error(`data must be an array (${value.toString()} given)`);\n }\n this._data = value;\n }\n\n /**\n * @description Position of the pointer inside the suggestions\n */\n _pointer = null;\n\n get pointer() {\n return this._pointer;\n }\n\n set pointer(value) {\n if (isNaN(parseInt(value, 10))) {\n throw new Error(`pointer must be an integer (${value.toString()} given)`);\n }\n this._pointer = value;\n }\n\n /**\n * @description Previous input value\n */\n _previousValue = null;\n\n get previousValue() {\n return this._previousValue;\n }\n\n set previousValue(value) {\n this._previousValue = value;\n }\n\n constructor(data = []) {\n this._data = data;\n }\n}","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import Kompletr from './kompletr.js';\n\nimport { Configuration } from './configuration.js';\nimport { Cache } from './cache.js';\nimport { Broadcaster } from './broadcaster.js';\nimport { Properties } from './properties.js';\nimport { DOM } from './dom.js';\n\n/**\n * Initializes the module with the provided data and options.\n *\n * @param {string|HTMLInputElement} input - The target input as selector or instance.\n * @param {Object} data - The data used by the application.\n * @param {Object} options - The configuration options for the application.\n * @param {Function} onKeyup - The callback function to be executed on keyup event.\n * @param {Function} onSelect - The callback function to be executed on select event.\n * @param {Function} onError - The callback function to be executed on error event.\n * \n * @returns {void}\n */\nconst kompletr = function({ input, data, options, onKeyup, onSelect, onError }) {\n const broadcaster = new Broadcaster();\n\n const configuration = new Configuration(options);\n const properties = new Properties(data);\n\n const dom = new DOM(input, broadcaster, configuration);\n const cache = configuration.cache ? new Cache(broadcaster, configuration.cache) : null;\n \n new Kompletr({ configuration, properties, dom, cache, broadcaster, onKeyup, onSelect, onError });\n};\n\nwindow.kompletr = kompletr;\n\nexport { kompletr };"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/docs/.vitepress/config.js b/docs/.vitepress/config.js index 5e0553d..6f281b1 100644 --- a/docs/.vitepress/config.js +++ b/docs/.vitepress/config.js @@ -4,9 +4,12 @@ import { tabsMarkdownPlugin } from 'vitepress-plugin-tabs' // https://vitepress.dev/reference/site-config // https://vitepress.dev/reference/default-theme-config export default defineConfig({ - title: "Kømpletr", + title: "Kømpletr - JS autocomplete library", description: "JS autocomplete library", themeConfig: { + head: [ + ['link', { rel: 'icon', href: 'https://cdn.konfer.be/images/kompletr/favicon.ico' }], + ], logo: { light: 'https://cdn.konfer.be/images/kompletr/logo-kompletr-dark.png', dark: 'https://cdn.konfer.be/images/kompletr/logo-kompletr-light.png' diff --git a/docs/index.md b/docs/index.md index 2cff2f0..2a035a4 100644 --- a/docs/index.md +++ b/docs/index.md @@ -3,8 +3,8 @@ layout: home hero: - text: "JS autocomplete" - tagline: 10kb of vanilla lightweight for a simple & efficient autocomplete + text: "JS Autocompletion" + tagline: 10kb of vanilla lightweight for autocomplete image: light: 'https://cdn.konfer.be/images/kompletr/logo-kompletr-dark.png' dark: 'https://cdn.konfer.be/images/kompletr/logo-kompletr-light.png' @@ -19,7 +19,7 @@ features: - icon: ✨ title: Light details: Less than 10kb of Vanilla - - icon: 🚀 + - icon: 🐰 title: Performant details: Faster than the white rabbit - icon: 🍃 diff --git a/src/index.html b/src/index.html index 2f554e4..1e62b5f 100644 --- a/src/index.html +++ b/src/index.html @@ -23,16 +23,14 @@
-

Documentation

-
- Logo Kømpletr - 10kb of vanilla lightweight for a simple & efficient autocomplete + Logo Kømpletr + 10kb of vanilla lightweight for an efficient autocomplete
diff --git a/src/js/kompletr.js b/src/js/kompletr.js index 2b8e0f3..51cc1d5 100644 --- a/src/js/kompletr.js +++ b/src/js/kompletr.js @@ -57,7 +57,7 @@ export default class Kompletr { this.broadcaster.subscribe(event.selectDone, this.closeTheShop); this.broadcaster.listen(this.dom.input, 'keyup', this.suggest); - this.broadcaster.listen(this.dom.body, 'click', this.closeTheShop); // TODO: validate this because it can be called many times if many kompletr instances + this.broadcaster.listen(this.dom.body, 'click', this.closeTheShop); if(onKeyup || onSelect || onError) { this.callbacks = Object.assign(this.callbacks, { onKeyup, onSelect, onError }); @@ -103,7 +103,7 @@ export default class Kompletr { showResults = async ({ from, data }) => { this.props.data = data; - data = this.props.data.map((record, idx) => ({ idx, data: record }) ); // TODO: Check if we can avoid this shit + data = this.props.data.map((record, idx) => ({ idx, data: record }) ); // TODO: Check to avoid this if (!this.callbacks.onKeyup) { data = this.filter(data, this.dom.input.value); @@ -197,21 +197,29 @@ export default class Kompletr { * @returns {Void} */ navigate = (keyCode) => { - if (keyCode != 38 && keyCode != 40) { - return false; - } + try { + if (keyCode != 38 && keyCode != 40) { + return false; + } + + if(this.props.pointer < -1 || this.props.pointer > this.dom.result.children.length - 1) { + return false; + } + + if ((keyCode === 38 && this.props.pointer === 0) || (keyCode === 40 && this.props.pointer === this.dom.result.children.length - 1)) { + return false; + } - if(this.props.pointer < -1 || this.props.pointer > this.dom.result.children.length - 1) { - return false; + if (keyCode === 38 && this.props.pointer >= -1) { + this.props.pointer--; + } else if (keyCode === 40 && this.props.pointer < this.dom.result.children.length - 1) { + this.props.pointer++; + } + + this.dom.focus(this.props.pointer); + } catch(e) { + this.broadcaster.trigger(event.error, e); } - - if (keyCode === 38 && this.props.pointer >= -1) { - this.props.pointer--; - } else if (keyCode === 40 && this.props.pointer < this.dom.result.children.length - 1) { - this.props.pointer++; - } - - this.dom.focus(this.props.pointer); }; /** @@ -223,9 +231,13 @@ export default class Kompletr { * * @returns {Void} */ - select = (idx = 0) => { - this.dom.input.value = typeof this.props.data[idx] === 'object' ? this.props.data[idx][this.configuration.propToMapAsValue] : this.props.data[idx]; - this.callbacks.onSelect && this.callbacks.onSelect(this.props.data[idx]); - this.broadcaster.trigger(event.selectDone); + select = (idx = 0) => { + try { + this.dom.input.value = typeof this.props.data[idx] === 'object' ? this.props.data[idx][this.configuration.propToMapAsValue] : this.props.data[idx]; + this.callbacks.onSelect && this.callbacks.onSelect(this.props.data[idx]); + this.broadcaster.trigger(event.selectDone); + } catch(e) { + this.broadcaster.trigger(event.error, e); + } }; } \ No newline at end of file diff --git a/src/sass/kompletr.demo.scss b/src/sass/kompletr.demo.scss index ce62ff7..fb65499 100644 --- a/src/sass/kompletr.demo.scss +++ b/src/sass/kompletr.demo.scss @@ -8,23 +8,6 @@ html { font-size: $font-size-base; } -header { - p:first-child { - text-align: center; - - a { - color: #333; - text-decoration: underline; - font-size: 0.9rem; - transition: all 0.4s ease-in-out; - &:hover { - color: #444; - text-decoration: none; - } - } - } -} - .github-corner { position: fixed; right: 0; @@ -35,9 +18,9 @@ header { & svg { height: 80px; width: 80px; - color: #fff; - fill: #333; - fill: var(--theme-color, #333); + color: #333; + fill: #fff; + fill: var(--theme-color, #fff); } &:hover { transform: scale(1.1); @@ -51,33 +34,35 @@ body { margin: 0; min-height: 100vh; font-family: $font-base; - background: rgb(2,0,36); - background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(133,255,189,1) 50%, rgba(255,251,125,1) 100%); + background: #333; } hgroup { - margin: 0 auto 40px; + margin: 0 auto 60px; text-align: center; img { - margin: 100px auto 0; + margin: 90px auto 0; display: block; max-width: 500px; } cite { - color: #444; + color: #fff; + z-index: 999999999; + position: relative; } } a { - color: #333; + color: #2cc1fb; } footer { margin-top: auto; - color: #333; + color: #fff; text-align: center; + font-size: 0.9em; } //// @@ -91,6 +76,11 @@ footer { max-width: 400px; position: relative; margin: 0 auto; + + -webkit-box-shadow:0px 0px 105px 45px rgba(44,193,251,0.9); + -moz-box-shadow: 0px 0px 105px 45px rgba(44,193,251,0.9); + box-shadow: 0px 0px 105px 45px rgba(44,193,251,0.9); + @media (max-width: 480px) { width: 90%; } @@ -137,7 +127,7 @@ footer { border-right: none; &:last-child { - border-bottom: none; + border-bottom: none !important; } &:hover, &.focus { diff --git a/src/sass/kompletr.scss b/src/sass/kompletr.scss index 53a3d42..dbeb5ef 100755 --- a/src/sass/kompletr.scss +++ b/src/sass/kompletr.scss @@ -57,7 +57,7 @@ border-right: none; &:last-child { - border-bottom: none; + border-bottom: none !important; } &:hover, &.focus {