wj-elements 0.1.250 → 0.1.252
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/dark.css +11 -0
- package/dist/light.css +30 -10
- package/dist/styles.css +1 -0
- package/dist/wje-animation.js +1 -1
- package/dist/wje-aside.js +1 -1
- package/dist/wje-container.js +1 -1
- package/dist/wje-dialog.js +1 -0
- package/dist/wje-dialog.js.map +1 -1
- package/dist/wje-header.js +1 -1
- package/dist/wje-icon-picker.js +1 -1
- package/dist/wje-select.js +2 -2
- package/dist/wje-select.js.map +1 -1
- package/package.json +1 -1
package/dist/dark.css
CHANGED
|
@@ -138,6 +138,9 @@
|
|
|
138
138
|
[ Elements ]
|
|
139
139
|
*/
|
|
140
140
|
|
|
141
|
+
/* Aside */
|
|
142
|
+
--wje-aside-border-color: var(--wje-border-color);
|
|
143
|
+
|
|
141
144
|
/* Avatar */
|
|
142
145
|
--wje-avatar-color: var(--wje-color-contrast-11);
|
|
143
146
|
--wje-avatar-background-color: var(--wje-color-contrast-3);
|
|
@@ -162,6 +165,14 @@
|
|
|
162
165
|
--wje-file-upload-item-border-style: solid;
|
|
163
166
|
--wje-file-upload-item-border-color: var(--wje-border-color);
|
|
164
167
|
|
|
168
|
+
/* Header */
|
|
169
|
+
--wje-header-background: var(--wje-background);
|
|
170
|
+
--wje-header-border-color: var(--wje-border-color);
|
|
171
|
+
|
|
172
|
+
/* Icon Picker */
|
|
173
|
+
--wje-icon-picker-background: var(--wje-color-contrast-0);
|
|
174
|
+
--wje-icon-picker-border-color: var(--wje-border-color);
|
|
175
|
+
|
|
165
176
|
/* Input */
|
|
166
177
|
--wje-input-background-color: var(--wje-color-contrast-0);
|
|
167
178
|
--wje-input-color: var(--wje-color);
|
package/dist/light.css
CHANGED
|
@@ -225,6 +225,12 @@
|
|
|
225
225
|
/*
|
|
226
226
|
[ Elements ]
|
|
227
227
|
*/
|
|
228
|
+
/* Aside */
|
|
229
|
+
--wje-aside-width: 100px;
|
|
230
|
+
--wje-aside-top: 0;
|
|
231
|
+
--wje-aside-border-color: var(--wje-border-color);
|
|
232
|
+
--wje-aside-border-width: 0 1px 0 0;
|
|
233
|
+
--wje-aside-border-style: solid;
|
|
228
234
|
|
|
229
235
|
/* Avatar */
|
|
230
236
|
--wje-avatar-size: var(--wje-size-x-large);
|
|
@@ -378,24 +384,29 @@
|
|
|
378
384
|
--wje-file-upload-item-border-style: solid;
|
|
379
385
|
--wje-file-upload-item-border-color: var(--wje-border-color);
|
|
380
386
|
|
|
387
|
+
/* Header */
|
|
388
|
+
--wje-header-background: var(--wje-background);
|
|
389
|
+
--wje-header-border-color: var(--wje-border-color);
|
|
390
|
+
--wje-header-border-width: 0 0 1px 0;
|
|
391
|
+
--wje-header-border-style: solid;
|
|
392
|
+
--wje-header-top: 0;
|
|
393
|
+
--wje-header-height: 60px;
|
|
394
|
+
|
|
381
395
|
/* Icon */
|
|
382
396
|
--wje-icon-stroke: 2;
|
|
383
397
|
--wje-icon-size: var(--wje-size);
|
|
384
398
|
--wje-icon-color: currentColor;
|
|
385
399
|
|
|
386
400
|
/* Icon Picker */
|
|
387
|
-
--wje-icon-picker-
|
|
401
|
+
--wje-icon-picker-shadow: var(--wje-shadow-x-large);
|
|
402
|
+
--wje-icon-picker-background: var(--wje-color-contrast-0);
|
|
403
|
+
--wje-icon-picker-radius: var(--wje-border-radius-large);
|
|
388
404
|
--wje-icon-picker-icon-size: 1.5rem;
|
|
389
405
|
--wje-icon-picker-border-width: 1px;
|
|
390
406
|
--wje-icon-picker-border-style: solid;
|
|
391
407
|
--wje-icon-picker-border-color: var(--wje-border-color);
|
|
392
408
|
--wje-icon-picker-padding: 0.25rem;
|
|
393
409
|
|
|
394
|
-
/* Infinite Scroll */
|
|
395
|
-
--wje-infinite-scroll-width: 100%;
|
|
396
|
-
--wje-infinite-scroll-height: 300px;
|
|
397
|
-
--wje-infinite-scroll-loading-bg: rgba(255, 255, 255, 1);
|
|
398
|
-
|
|
399
410
|
/* Img - Comparer */
|
|
400
411
|
--wje-img-compare-divider-area: 12px;
|
|
401
412
|
--wje-img-compare-divider-background: white;
|
|
@@ -404,6 +415,11 @@
|
|
|
404
415
|
--wje-img-compare-position: 50%;
|
|
405
416
|
--wje-img-compare-clip-path: inset(0 calc(100% - var(--wje-img-compare-position)) 0 0);
|
|
406
417
|
|
|
418
|
+
/* Infinite Scroll */
|
|
419
|
+
--wje-infinite-scroll-width: 100%;
|
|
420
|
+
--wje-infinite-scroll-height: 300px;
|
|
421
|
+
--wje-infinite-scroll-loading-bg: rgba(255, 255, 255, 1);
|
|
422
|
+
|
|
407
423
|
/* Input */
|
|
408
424
|
--wje-input-font-family: var(--wje-font-family);
|
|
409
425
|
--wje-input-background-color: var(--wje-color-contrast-0);
|
|
@@ -441,7 +457,7 @@
|
|
|
441
457
|
--wje-item-inner-padding-bottom: 0px;
|
|
442
458
|
--wje-item-inner-padding-start: 0px;
|
|
443
459
|
--wje-item-inner-padding-end: 0px;
|
|
444
|
-
--wje-item-inner-
|
|
460
|
+
--wje-item-inner-shadow: none;
|
|
445
461
|
--wje-item-min-height: 40px;
|
|
446
462
|
--wje-item-transition: var(--wje-transition-fast);
|
|
447
463
|
|
|
@@ -555,16 +571,20 @@
|
|
|
555
571
|
--wje-select-options-border-radius: var(--wje-border-radius-medium);
|
|
556
572
|
--wje-select-line-height: 20px;
|
|
557
573
|
--wje-select-color: var(--wje-color);
|
|
558
|
-
--wje-select-label-margin: 0 0 var(--wje-spacing-x-small) 0;
|
|
559
|
-
--wje-select-label-font-size: var(--wje-font-size);
|
|
560
574
|
--wje-select-margin-bottom: var(--wje-spacing-x-small);
|
|
561
575
|
--wje-select-find-margin-inline: var(--wje-spacing-x-small);
|
|
562
576
|
--wje-select-find-margin-block: var(--wje-spacing-x-small);
|
|
563
577
|
--wje-select-find-width: calc(100% - var(--wje-select-find-margin-inline) * 2);
|
|
564
578
|
|
|
579
|
+
--wje-select-label-margin: 0 0 var(--wje-spacing-x-small);
|
|
580
|
+
--wje-select-label-padding: 0;
|
|
581
|
+
--wje-select-label-display: block;
|
|
582
|
+
--wje-select-label-line-height: var(--wje-line-height-normal);
|
|
583
|
+
--wje-select-label-font-size: var(--wje-font-size);
|
|
584
|
+
|
|
565
585
|
/* Sliding - Container */
|
|
566
586
|
--wje-sliding-container-background: transparent;
|
|
567
|
-
--wje-sliding-container-
|
|
587
|
+
--wje-sliding-container-shadow: none;
|
|
568
588
|
--wje-sliding-container-border-radius: var(--wje-border-radius-large);
|
|
569
589
|
|
|
570
590
|
/* Status */
|
package/dist/styles.css
CHANGED
package/dist/wje-animation.js
CHANGED
|
@@ -3,7 +3,7 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
|
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
4
|
import { fetchAndParseCSS } from "./animations.js";
|
|
5
5
|
import WJElement from "./wje-element.js";
|
|
6
|
-
const styles = "/*\n[ Standard Element ]\n*/\n\nhtml {\n font-size: 100%;\n -ms-text-size-adjust: 100%;\n -webkit-text-size-adjust: 100%;\n}\nbody {\n color: var(--wje-color-contrast-8);\n font-family: var(--wje-font-family);\n font-size: var(--wje-font-size);\n font-weight: normal;\n letter-spacing: 0.01em;\n -webkit-font-smoothing: antialiased;\n -webkit-text-size-adjust: 100%;\n -ms-text-size-adjust: 100%;\n -webkit-font-feature-settings: 'kern' 1;\n -moz-font-feature-settings: 'kern' 1;\n margin: 0;\n padding: 0 !important;\n}\n/* Headings\n------------------------------------\n*/\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin: 0.625rem 0;\n font-family: var(--wje-font-family);\n -webkit-font-smoothing: antialiased;\n -webkit-text-size-adjust: 100%;\n -ms-text-size-adjust: 100%;\n font-weight: 500;\n color: inherit;\n display: inline-block;\n}\nh1 {\n font-size: var(--wje-font-size-2x-large);\n line-height: 44px;\n letter-spacing: -0.0141279em;\n}\nh2 {\n font-size: var(--wje-font-size-x-large);\n line-height: 34px;\n letter-spacing: -0.021em;\n}\nh3 {\n font-size: var(--wje-font-size-large);\n line-height: 28px;\n letter-spacing: -0.0114923em;\n}\nh4 {\n font-size: var(--wje-font-size-large);\n line-height: 26px;\n letter-spacing: -0.00865734em;\n}\nh5 {\n font-size: var(--wje-font-size-medium);\n line-height: 24px;\n letter-spacing: -0.00630069em;\n}\nh3 small,\nh4 small,\nh5 small {\n font-weight: 300;\n}\nh1.block,\nh2.block,\nh3.block,\nh4.block,\nh5.block,\nh6.block {\n padding-bottom: 0.625rem;\n}\n/* Lins and Others\n------------------------------------\n*/\na {\n text-shadow: none !important;\n color: var(--wje-color-primary-11);\n transition:\n color 0.1s linear 0s,\n background-color 0.1s linear 0s,\n opacity 0.2s linear 0s !important;\n font-weight: 500;\n}\na:focus,\na:hover,\na:active {\n color: var(--wje-color-primary);\n}\n\na,\na:focus,\na:hover,\na:active {\n outline: 0 !important;\n text-decoration: none;\n}\n\na.no-style {\n color: inherit;\n font-weight: normal;\n}\n\nbr {\n line-height: normal;\n clear: both;\n}\n\np {\n display: block;\n color: inherit;\n font-size: var(--wje-font-size);\n font-weight: normal;\n letter-spacing: 0.00177646em;\n line-height: 21px;\n margin: 0 0 0.625rem 0;\n font-style: normal;\n white-space: normal;\n}\n\nsmall,\n.small {\n line-height: 18px;\n font-size: 85.714%;\n}\n\nlabel {\n &.inline {\n display: inline-block;\n position: relative;\n top: 0;\n font-size: 13px;\n }\n}\n\nul,\nol {\n margin-bottom: 0.625rem;\n & > li {\n padding-left: 3px;\n line-height: 24px;\n }\n &.lg-icon {\n & > li {\n font-size: 21px;\n & span {\n font-size: 14px;\n }\n }\n }\n &.no-style {\n list-style: none;\n padding-left: 5px;\n }\n}\n\naddress {\n margin-bottom: 0;\n a {\n color: var(--wje-color-contrast-8);\n }\n}\n\nblockquote {\n padding: 4px 0 0 18px;\n border-left: 0;\n &:before {\n content: '\\e95d';\n font-size: 20px;\n margin-right: 6px;\n float: left;\n position: relative;\n top: -12px;\n }\n p {\n font-size: 16px;\n margin-bottom: 4px;\n }\n small {\n line-height: 29px;\n color: var(--wje-color-contrast-8);\n &:before {\n content: '—';\n margin-right: 6px;\n }\n }\n &.pull-right {\n border-right: 0;\n &:before {\n float: right;\n content: '';\n margin-left: 6px;\n margin-right: 0;\n }\n small {\n padding-right: 30px;\n &:after {\n content: '';\n }\n }\n }\n}\nhr {\n border-color: var(--wje-border-color);\n &.double {\n border-width: 2px;\n }\n &.dotted {\n border-style: dotted none none;\n }\n}\n\n.ff-sup {\n font-feature-settings:\n 'kern' 1,\n 'sups' 1;\n -webkit-font-feature-settings:\n 'kern' 1,\n 'sups' 1;\n -moz-font-feature-settings:\n 'kern' 1,\n 'sups' 1;\n}\n\n.ff-sub {\n font-feature-settings:\n 'kern' 1,\n 'subs' 1;\n -webkit-font-feature-settings:\n 'kern' 1,\n 'subs' 1;\n -moz-font-feature-settings:\n 'kern' 1,\n 'subs' 1;\n}\n\n/* Standard HTML Typography tags\n------------------------------------\n*/\n\ncode {\n color: var(--wje-color-contrast-6);\n background-color: var(--wje-color);\n font-size: 97%;\n position: relative;\n line-height: inherit;\n border-radius: 3px;\n padding: 5px 7px;\n margin: 0;\n &:hover {\n color: var(--wje-color-complete);\n }\n &.code-sm {\n padding: 3px 6px;\n }\n}\n\nfigcaption {\n font-size: 13px;\n margin-top: 0.625rem;\n font-weight: 400;\n display: block;\n letter-spacing: 0.008em;\n text-align: center;\n color: var(--wje-color-contrast-6);\n line-height: 1.46;\n}\n\nem {\n font-style: italic !important;\n font-family: inherit;\n font-weight: inherit;\n}\n\nins {\n font-family: var(--wje-font-family);\n border-bottom: 1px solid #d0d0d0;\n text-decoration: none;\n color: var(--wje-color-contrast-8);\n font-weight: normal;\n font-size: 94%;\n}\n\ncite {\n font-family: var(--wje-font-family);\n font-weight: 300;\n color: var(--wje-color-contrast-6);\n text-decoration: none;\n font-style: normal;\n hanging-punctuation: first;\n}\n\nsup {\n top: -0.28em;\n font-size: 70%;\n}\n\nsub {\n bottom: 0.03em;\n}\n\nvar {\n font-family: var(--wje-font-family);\n font-feature-settings:\n 'calt' 1,\n 'tnum' 1,\n 'frac' 1,\n 'case' 1,\n 'ss01' 1,\n 'cv11' 1;\n}\n\nabbr {\n text-decoration: none;\n letter-spacing: 0.01em;\n background-color: transparent;\n border-bottom: 2px solid #ffba5a;\n transition-property: color, background, border;\n transition-duration: 0.15s;\n transition-timing-function: linear;\n color: var(--wje-color-contrast-8);\n}\n\nq {\n font-family: var(--wje-font-family);\n font-weight: 500;\n font-size: 20px;\n hanging-punctuation: first;\n\n &:before {\n content: '\\201C';\n color: rgba(0, 0, 0, 0.44);\n font-size: 35px;\n }\n\n &:after {\n content: '\\201D';\n font-size: 35px;\n color: rgba(0, 0, 0, 0.44);\n }\n}\naudio {\n margin-top: 42px;\n}\nhr {\n clear: both;\n margin-bottom: 42px;\n margin-top: 42px;\n border: 0;\n border-bottom: 1px solid rgba(0, 0, 0, 0.13);\n}\naddress {\n font-family: var(--wje-font-family);\n font-style: normal;\n margin: 0 0 1.75em;\n font-size: 14px;\n line-height: 24px;\n margin-top: 24px;\n}\nabbr {\n text-decoration: none;\n letter-spacing: 0.01em;\n background-color: transparent;\n border-bottom: 2px solid #ffba5a;\n transition-property: color, background, border;\n transition-duration: 0.15s;\n transition-timing-function: linear;\n color: var(--wje-color-contrast-8);\n}\n\nacronym {\n text-decoration: none;\n text-transform: uppercase;\n letter-spacing: 0.06em;\n background-color: transparent;\n border-bottom: 2px solid #ffba5a;\n transition-property: color, background, border;\n transition-duration: 0.15s;\n transition-timing-function: linear;\n color: var(--wje-color-contrast-8);\n}\n\npre {\n tab-size: 4;\n font-size: 85.714%;\n overflow-x: auto;\n font-family: monospace, monospace;\n line-height: 1.7;\n counter-reset: line;\n background-color: var(--wje-color-contrast-3) er;\n color: var(--wje-color-contrast-8);\n margin-inline: 0;\n padding: 1rem 1.25rem;\n border-radius: 3px;\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n\ndt {\n font-weight: 700;\n margin-bottom: 5px;\n}\n\ndd {\n margin: 0 0 1.75em;\n}\n\nkbd {\n font-size: 85.714%;\n font-family: var(--wje-font-family);\n position: relative;\n line-height: 34px;\n top: -3px;\n letter-spacing: 0.01em;\n padding: 5px 7px;\n margin: 0;\n color: rgba(0, 0, 0, 0.53);\n background-color: #fff;\n border-radius: 3px;\n box-shadow:\n 0 2px 0 1px #c7c7c7,\n 0 1px 0 1px rgba(0, 0, 0, 0.15),\n 0 0 0 1px #ececec;\n}\n\n/* Types\n------------------------------------\n*/\n\n.overline {\n text-transform: uppercase;\n display: inline-block;\n letter-spacing: 0.06em;\n font-size: 11px;\n}\n\n/* Font Sizes\n------------------------------------\n*/\n\n.small-text {\n font-size: 12px !important;\n letter-spacing: 0.00849077em;\n line-height: 18px;\n a {\n text-decoration: underline;\n }\n}\n.normal-text {\n font-size: 13px !important;\n}\n.large-text {\n font-size: 15px !important;\n}\n\n/* Font Weights\n------------------------------------\n */\n\n.normal {\n font-weight: normal !important;\n}\n.semi-bold {\n font-weight: 500 !important;\n}\n.bold {\n font-weight: 600 !important;\n}\n.light {\n font-weight: 300 !important;\n}\n\n/* Misc\n------------------------------------\n*/\n\n.all-caps {\n text-transform: uppercase;\n letter-spacing: 0.07em !important;\n}\n.text-uppercase {\n text-transform: uppercase !important;\n letter-spacing: 0.07em !important;\n}\n.muted {\n color: var(--wje-color-contrast-6);\n}\n.hint-text {\n opacity: 0.76 !important;\n}\n.no-decoration {\n text-decoration: none !important;\n}\n\n.text-ellipsis {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n/* Gradients\n------------------------------------\n*/\n.gradient-grey {\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 75%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 75%);\n}\n.gradient-black {\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 75%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 75%);\n}\n\n/* Other Colors\n------------------------------------\n*/\n.bg-black {\n background-color: var(--wje-color-black) !important;\n color: var(--wje-color-contrast-0);\n}\n.bg-white {\n background-color: var(--wje-color-contrast-0) !important;\n color: var(--wje-color-contrast-8);\n}\n.bg-transparent {\n background-color: transparent !important;\n}\n\n/* Text Colors */\n.link {\n opacity: 0.7;\n &:hover {\n opacity: 1;\n }\n}\n\n/* Text Aligngments\n------------------------------------\n*/\n\n.text-right {\n text-align: right !important;\n}\n.text-left {\n text-align: left !important;\n}\n.text-center {\n text-align: center !important;\n}\n\n/* Strokes\n------------------------------------\n*/\n\n.stroke-primary {\n stroke: var(--wje-color-primary) !important;\n}\n.stroke-complete {\n stroke: var(--wje-color-complete) !important;\n}\n.stroke-success {\n stroke: var(--wje-color-success) !important;\n}\n.stroke-info {\n stroke: var(--wje-color-info) !important;\n}\n.stroke-warning {\n stroke: var(--wje-color-warning) !important;\n}\n.stroke-danger {\n stroke: var(--wje-color-danger) !important;\n}\n\n/* Font Sizes\n------------------------------------\ntracking =a+b×e(c × z)\n\na, b and c are constants\na = -0.0223\nb = 0.185\nc = -0.1745\nz = font size\n\n*/\n.fs-x-small {\n font-size: var(--wje-font-size-x-small) !important;\n letter-spacing: 0.0180093em;\n line-height: 15px;\n}\n.fs-small {\n font-size: var(--wje-font-size-small) !important;\n letter-spacing: 0.00849077em;\n line-height: 18px;\n}\n.fs {\n font-size: var(--wje-font-size) !important;\n letter-spacing: 0.00177646em;\n line-height: 22px;\n}\n\n.fs-medium {\n font-size: var(--wje-font-size-medium) !important;\n letter-spacing: -0.00295978em;\n line-height: 24px;\n}\n\n.fs-large {\n font-size: var(--wje-font-size-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-x-large {\n font-size: var(--wje-font-size-x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-2x-large {\n font-size: var(--wje-font-size-2x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-3x-large {\n font-size: var(--wje-font-size-3x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-4x-large {\n font-size: var(--wje-font-size-4x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n/* Line-heights\n------------------------------------\n*/\n.lh-normal {\n line-height: normal;\n}\n.lh-10 {\n line-height: 10px;\n}\n.lh-11 {\n line-height: 11px;\n}\n.lh-12 {\n line-height: 12px;\n}\n.lh-13 {\n line-height: 13px;\n}\n.lh-14 {\n line-height: 14px;\n}\n.lh-15 {\n line-height: 15px;\n}\n.lh-16 {\n line-height: 16px;\n}\n\n/* Font Faces\n------------------------------------\n*/\n\n.font-arial {\n font-family: Arial, sans-serif !important;\n}\n.font-montserrat {\n font-family: var(--wje-font-family-secondary) !important;\n}\n.font-heading {\n font-family: var(--wje-font-family-secondary);\n}\n.font-secondary {\n font-family: var(--wje-font-family-secondary);\n}\n\n/* Wells\n------------------------------------\n*/\n.well {\n background-color: var(--wje-color-contrast-3);\n -webkit-border-radius: 3px;\n -moz-border-radius: 3px;\n border-radius: 3px;\n -webkit-box-shadow: none !important;\n -moz-box-shadow: none !important;\n box-shadow: none !important;\n border: none;\n background-image: none;\n &.well-large {\n padding: 24px;\n width: auto;\n }\n &.well-small {\n padding: 13px;\n width: auto;\n }\n &.green {\n background-color: var(--wje-color-complete);\n color: var(--wje-color-contrast-0);\n border: none;\n }\n}\n.overflow-ellipsis {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}\n\n/* Responsive Handlers : Typo\n------------------------------------\n*/\n\n@media (max-width: 1024px) {\n body,\n p {\n font-size: var(--wje-font-size-small);\n line-height: 20px;\n }\n\n h1 {\n font-size: var(--wje-font-size-2x-large);\n line-height: 44px;\n letter-spacing: -0.08px;\n }\n h2 {\n font-size: var(--wje-font-size-x-large);\n line-height: 40px;\n }\n h3 {\n font-size: var(--wje-font-size-large);\n line-height: 35.88px;\n }\n h4 {\n font-size: var(--wje-font-size-large);\n line-height: 33.88px;\n }\n h5 {\n font-size: var(--wje-font-size-medium);\n line-height: 25.88px;\n }\n small,\n .small {\n font-size: 89%;\n line-height: 17px;\n }\n}\n\n.alert {\n & > p,\n & > ul {\n margin-bottom: 0;\n }\n}\n.table {\n & > tbody {\n & > tr {\n & > td,\n & > th {\n line-height: 1.42857143;\n }\n }\n }\n & > tfoot {\n & > tr {\n & > td,\n & > th {\n line-height: 1.42857143;\n }\n }\n }\n & > thead {\n & > tr {\n & > td,\n & > th {\n line-height: 1.42857143;\n }\n }\n }\n}\n\n/* For Windows : Fixes\n------------------------------------\n*/\n\n.line-clamp-2 {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.line-clamp-3 {\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.line-clamp-5 {\n display: -webkit-box;\n -webkit-line-clamp: 5;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.text-separator {\n display: block;\n text-align: center;\n margin: 1.5rem 0;\n width: 100%;\n background: linear-gradient(\n to top,\n transparent 0%,\n transparent calc(50% - 1px),\n var(--wje-border-color) calc(50% - 1px),\n var(--wje-border-color) calc(50% + 1px),\n transparent calc(50% + 1px),\n transparent 100%\n );\n}\n.text-separator::before {\n background: #fff;\n content: attr(data-text);\n padding: 0 1rem;\n text-transform: uppercase;\n}\n\n.wje-toast-stack {\n position: fixed;\n top: 0;\n margin: 0 0.5rem;\n width: 300px;\n max-width: 100%;\n max-height: 100%;\n overflow: auto;\n z-index: 9999;\n}\n";
|
|
6
|
+
const styles = "/*\n[ Standard Element ]\n*/\n\nhtml {\n height: 100%;\n font-size: 100%;\n -ms-text-size-adjust: 100%;\n -webkit-text-size-adjust: 100%;\n}\nbody {\n color: var(--wje-color-contrast-8);\n font-family: var(--wje-font-family);\n font-size: var(--wje-font-size);\n font-weight: normal;\n letter-spacing: 0.01em;\n -webkit-font-smoothing: antialiased;\n -webkit-text-size-adjust: 100%;\n -ms-text-size-adjust: 100%;\n -webkit-font-feature-settings: 'kern' 1;\n -moz-font-feature-settings: 'kern' 1;\n margin: 0;\n padding: 0 !important;\n}\n/* Headings\n------------------------------------\n*/\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin: 0.625rem 0;\n font-family: var(--wje-font-family);\n -webkit-font-smoothing: antialiased;\n -webkit-text-size-adjust: 100%;\n -ms-text-size-adjust: 100%;\n font-weight: 500;\n color: inherit;\n display: inline-block;\n}\nh1 {\n font-size: var(--wje-font-size-2x-large);\n line-height: 44px;\n letter-spacing: -0.0141279em;\n}\nh2 {\n font-size: var(--wje-font-size-x-large);\n line-height: 34px;\n letter-spacing: -0.021em;\n}\nh3 {\n font-size: var(--wje-font-size-large);\n line-height: 28px;\n letter-spacing: -0.0114923em;\n}\nh4 {\n font-size: var(--wje-font-size-large);\n line-height: 26px;\n letter-spacing: -0.00865734em;\n}\nh5 {\n font-size: var(--wje-font-size-medium);\n line-height: 24px;\n letter-spacing: -0.00630069em;\n}\nh3 small,\nh4 small,\nh5 small {\n font-weight: 300;\n}\nh1.block,\nh2.block,\nh3.block,\nh4.block,\nh5.block,\nh6.block {\n padding-bottom: 0.625rem;\n}\n/* Lins and Others\n------------------------------------\n*/\na {\n text-shadow: none !important;\n color: var(--wje-color-primary-11);\n transition:\n color 0.1s linear 0s,\n background-color 0.1s linear 0s,\n opacity 0.2s linear 0s !important;\n font-weight: 500;\n}\na:focus,\na:hover,\na:active {\n color: var(--wje-color-primary);\n}\n\na,\na:focus,\na:hover,\na:active {\n outline: 0 !important;\n text-decoration: none;\n}\n\na.no-style {\n color: inherit;\n font-weight: normal;\n}\n\nbr {\n line-height: normal;\n clear: both;\n}\n\np {\n display: block;\n color: inherit;\n font-size: var(--wje-font-size);\n font-weight: normal;\n letter-spacing: 0.00177646em;\n line-height: 21px;\n margin: 0 0 0.625rem 0;\n font-style: normal;\n white-space: normal;\n}\n\nsmall,\n.small {\n line-height: 18px;\n font-size: 85.714%;\n}\n\nlabel {\n &.inline {\n display: inline-block;\n position: relative;\n top: 0;\n font-size: 13px;\n }\n}\n\nul,\nol {\n margin-bottom: 0.625rem;\n & > li {\n padding-left: 3px;\n line-height: 24px;\n }\n &.lg-icon {\n & > li {\n font-size: 21px;\n & span {\n font-size: 14px;\n }\n }\n }\n &.no-style {\n list-style: none;\n padding-left: 5px;\n }\n}\n\naddress {\n margin-bottom: 0;\n a {\n color: var(--wje-color-contrast-8);\n }\n}\n\nblockquote {\n padding: 4px 0 0 18px;\n border-left: 0;\n &:before {\n content: '\\e95d';\n font-size: 20px;\n margin-right: 6px;\n float: left;\n position: relative;\n top: -12px;\n }\n p {\n font-size: 16px;\n margin-bottom: 4px;\n }\n small {\n line-height: 29px;\n color: var(--wje-color-contrast-8);\n &:before {\n content: '—';\n margin-right: 6px;\n }\n }\n &.pull-right {\n border-right: 0;\n &:before {\n float: right;\n content: '';\n margin-left: 6px;\n margin-right: 0;\n }\n small {\n padding-right: 30px;\n &:after {\n content: '';\n }\n }\n }\n}\nhr {\n border-color: var(--wje-border-color);\n &.double {\n border-width: 2px;\n }\n &.dotted {\n border-style: dotted none none;\n }\n}\n\n.ff-sup {\n font-feature-settings:\n 'kern' 1,\n 'sups' 1;\n -webkit-font-feature-settings:\n 'kern' 1,\n 'sups' 1;\n -moz-font-feature-settings:\n 'kern' 1,\n 'sups' 1;\n}\n\n.ff-sub {\n font-feature-settings:\n 'kern' 1,\n 'subs' 1;\n -webkit-font-feature-settings:\n 'kern' 1,\n 'subs' 1;\n -moz-font-feature-settings:\n 'kern' 1,\n 'subs' 1;\n}\n\n/* Standard HTML Typography tags\n------------------------------------\n*/\n\ncode {\n color: var(--wje-color-contrast-6);\n background-color: var(--wje-color);\n font-size: 97%;\n position: relative;\n line-height: inherit;\n border-radius: 3px;\n padding: 5px 7px;\n margin: 0;\n &:hover {\n color: var(--wje-color-complete);\n }\n &.code-sm {\n padding: 3px 6px;\n }\n}\n\nfigcaption {\n font-size: 13px;\n margin-top: 0.625rem;\n font-weight: 400;\n display: block;\n letter-spacing: 0.008em;\n text-align: center;\n color: var(--wje-color-contrast-6);\n line-height: 1.46;\n}\n\nem {\n font-style: italic !important;\n font-family: inherit;\n font-weight: inherit;\n}\n\nins {\n font-family: var(--wje-font-family);\n border-bottom: 1px solid #d0d0d0;\n text-decoration: none;\n color: var(--wje-color-contrast-8);\n font-weight: normal;\n font-size: 94%;\n}\n\ncite {\n font-family: var(--wje-font-family);\n font-weight: 300;\n color: var(--wje-color-contrast-6);\n text-decoration: none;\n font-style: normal;\n hanging-punctuation: first;\n}\n\nsup {\n top: -0.28em;\n font-size: 70%;\n}\n\nsub {\n bottom: 0.03em;\n}\n\nvar {\n font-family: var(--wje-font-family);\n font-feature-settings:\n 'calt' 1,\n 'tnum' 1,\n 'frac' 1,\n 'case' 1,\n 'ss01' 1,\n 'cv11' 1;\n}\n\nabbr {\n text-decoration: none;\n letter-spacing: 0.01em;\n background-color: transparent;\n border-bottom: 2px solid #ffba5a;\n transition-property: color, background, border;\n transition-duration: 0.15s;\n transition-timing-function: linear;\n color: var(--wje-color-contrast-8);\n}\n\nq {\n font-family: var(--wje-font-family);\n font-weight: 500;\n font-size: 20px;\n hanging-punctuation: first;\n\n &:before {\n content: '\\201C';\n color: rgba(0, 0, 0, 0.44);\n font-size: 35px;\n }\n\n &:after {\n content: '\\201D';\n font-size: 35px;\n color: rgba(0, 0, 0, 0.44);\n }\n}\naudio {\n margin-top: 42px;\n}\nhr {\n clear: both;\n margin-bottom: 42px;\n margin-top: 42px;\n border: 0;\n border-bottom: 1px solid rgba(0, 0, 0, 0.13);\n}\naddress {\n font-family: var(--wje-font-family);\n font-style: normal;\n margin: 0 0 1.75em;\n font-size: 14px;\n line-height: 24px;\n margin-top: 24px;\n}\nabbr {\n text-decoration: none;\n letter-spacing: 0.01em;\n background-color: transparent;\n border-bottom: 2px solid #ffba5a;\n transition-property: color, background, border;\n transition-duration: 0.15s;\n transition-timing-function: linear;\n color: var(--wje-color-contrast-8);\n}\n\nacronym {\n text-decoration: none;\n text-transform: uppercase;\n letter-spacing: 0.06em;\n background-color: transparent;\n border-bottom: 2px solid #ffba5a;\n transition-property: color, background, border;\n transition-duration: 0.15s;\n transition-timing-function: linear;\n color: var(--wje-color-contrast-8);\n}\n\npre {\n tab-size: 4;\n font-size: 85.714%;\n overflow-x: auto;\n font-family: monospace, monospace;\n line-height: 1.7;\n counter-reset: line;\n background-color: var(--wje-color-contrast-3) er;\n color: var(--wje-color-contrast-8);\n margin-inline: 0;\n padding: 1rem 1.25rem;\n border-radius: 3px;\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n\ndt {\n font-weight: 700;\n margin-bottom: 5px;\n}\n\ndd {\n margin: 0 0 1.75em;\n}\n\nkbd {\n font-size: 85.714%;\n font-family: var(--wje-font-family);\n position: relative;\n line-height: 34px;\n top: -3px;\n letter-spacing: 0.01em;\n padding: 5px 7px;\n margin: 0;\n color: rgba(0, 0, 0, 0.53);\n background-color: #fff;\n border-radius: 3px;\n box-shadow:\n 0 2px 0 1px #c7c7c7,\n 0 1px 0 1px rgba(0, 0, 0, 0.15),\n 0 0 0 1px #ececec;\n}\n\n/* Types\n------------------------------------\n*/\n\n.overline {\n text-transform: uppercase;\n display: inline-block;\n letter-spacing: 0.06em;\n font-size: 11px;\n}\n\n/* Font Sizes\n------------------------------------\n*/\n\n.small-text {\n font-size: 12px !important;\n letter-spacing: 0.00849077em;\n line-height: 18px;\n a {\n text-decoration: underline;\n }\n}\n.normal-text {\n font-size: 13px !important;\n}\n.large-text {\n font-size: 15px !important;\n}\n\n/* Font Weights\n------------------------------------\n */\n\n.normal {\n font-weight: normal !important;\n}\n.semi-bold {\n font-weight: 500 !important;\n}\n.bold {\n font-weight: 600 !important;\n}\n.light {\n font-weight: 300 !important;\n}\n\n/* Misc\n------------------------------------\n*/\n\n.all-caps {\n text-transform: uppercase;\n letter-spacing: 0.07em !important;\n}\n.text-uppercase {\n text-transform: uppercase !important;\n letter-spacing: 0.07em !important;\n}\n.muted {\n color: var(--wje-color-contrast-6);\n}\n.hint-text {\n opacity: 0.76 !important;\n}\n.no-decoration {\n text-decoration: none !important;\n}\n\n.text-ellipsis {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n/* Gradients\n------------------------------------\n*/\n.gradient-grey {\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 75%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 75%);\n}\n.gradient-black {\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 75%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 75%);\n}\n\n/* Other Colors\n------------------------------------\n*/\n.bg-black {\n background-color: var(--wje-color-black) !important;\n color: var(--wje-color-contrast-0);\n}\n.bg-white {\n background-color: var(--wje-color-contrast-0) !important;\n color: var(--wje-color-contrast-8);\n}\n.bg-transparent {\n background-color: transparent !important;\n}\n\n/* Text Colors */\n.link {\n opacity: 0.7;\n &:hover {\n opacity: 1;\n }\n}\n\n/* Text Aligngments\n------------------------------------\n*/\n\n.text-right {\n text-align: right !important;\n}\n.text-left {\n text-align: left !important;\n}\n.text-center {\n text-align: center !important;\n}\n\n/* Strokes\n------------------------------------\n*/\n\n.stroke-primary {\n stroke: var(--wje-color-primary) !important;\n}\n.stroke-complete {\n stroke: var(--wje-color-complete) !important;\n}\n.stroke-success {\n stroke: var(--wje-color-success) !important;\n}\n.stroke-info {\n stroke: var(--wje-color-info) !important;\n}\n.stroke-warning {\n stroke: var(--wje-color-warning) !important;\n}\n.stroke-danger {\n stroke: var(--wje-color-danger) !important;\n}\n\n/* Font Sizes\n------------------------------------\ntracking =a+b×e(c × z)\n\na, b and c are constants\na = -0.0223\nb = 0.185\nc = -0.1745\nz = font size\n\n*/\n.fs-x-small {\n font-size: var(--wje-font-size-x-small) !important;\n letter-spacing: 0.0180093em;\n line-height: 15px;\n}\n.fs-small {\n font-size: var(--wje-font-size-small) !important;\n letter-spacing: 0.00849077em;\n line-height: 18px;\n}\n.fs {\n font-size: var(--wje-font-size) !important;\n letter-spacing: 0.00177646em;\n line-height: 22px;\n}\n\n.fs-medium {\n font-size: var(--wje-font-size-medium) !important;\n letter-spacing: -0.00295978em;\n line-height: 24px;\n}\n\n.fs-large {\n font-size: var(--wje-font-size-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-x-large {\n font-size: var(--wje-font-size-x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-2x-large {\n font-size: var(--wje-font-size-2x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-3x-large {\n font-size: var(--wje-font-size-3x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-4x-large {\n font-size: var(--wje-font-size-4x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n/* Line-heights\n------------------------------------\n*/\n.lh-normal {\n line-height: normal;\n}\n.lh-10 {\n line-height: 10px;\n}\n.lh-11 {\n line-height: 11px;\n}\n.lh-12 {\n line-height: 12px;\n}\n.lh-13 {\n line-height: 13px;\n}\n.lh-14 {\n line-height: 14px;\n}\n.lh-15 {\n line-height: 15px;\n}\n.lh-16 {\n line-height: 16px;\n}\n\n/* Font Faces\n------------------------------------\n*/\n\n.font-arial {\n font-family: Arial, sans-serif !important;\n}\n.font-montserrat {\n font-family: var(--wje-font-family-secondary) !important;\n}\n.font-heading {\n font-family: var(--wje-font-family-secondary);\n}\n.font-secondary {\n font-family: var(--wje-font-family-secondary);\n}\n\n/* Wells\n------------------------------------\n*/\n.well {\n background-color: var(--wje-color-contrast-3);\n -webkit-border-radius: 3px;\n -moz-border-radius: 3px;\n border-radius: 3px;\n -webkit-box-shadow: none !important;\n -moz-box-shadow: none !important;\n box-shadow: none !important;\n border: none;\n background-image: none;\n &.well-large {\n padding: 24px;\n width: auto;\n }\n &.well-small {\n padding: 13px;\n width: auto;\n }\n &.green {\n background-color: var(--wje-color-complete);\n color: var(--wje-color-contrast-0);\n border: none;\n }\n}\n.overflow-ellipsis {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}\n\n/* Responsive Handlers : Typo\n------------------------------------\n*/\n\n@media (max-width: 1024px) {\n body,\n p {\n font-size: var(--wje-font-size-small);\n line-height: 20px;\n }\n\n h1 {\n font-size: var(--wje-font-size-2x-large);\n line-height: 44px;\n letter-spacing: -0.08px;\n }\n h2 {\n font-size: var(--wje-font-size-x-large);\n line-height: 40px;\n }\n h3 {\n font-size: var(--wje-font-size-large);\n line-height: 35.88px;\n }\n h4 {\n font-size: var(--wje-font-size-large);\n line-height: 33.88px;\n }\n h5 {\n font-size: var(--wje-font-size-medium);\n line-height: 25.88px;\n }\n small,\n .small {\n font-size: 89%;\n line-height: 17px;\n }\n}\n\n.alert {\n & > p,\n & > ul {\n margin-bottom: 0;\n }\n}\n.table {\n & > tbody {\n & > tr {\n & > td,\n & > th {\n line-height: 1.42857143;\n }\n }\n }\n & > tfoot {\n & > tr {\n & > td,\n & > th {\n line-height: 1.42857143;\n }\n }\n }\n & > thead {\n & > tr {\n & > td,\n & > th {\n line-height: 1.42857143;\n }\n }\n }\n}\n\n/* For Windows : Fixes\n------------------------------------\n*/\n\n.line-clamp-2 {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.line-clamp-3 {\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.line-clamp-5 {\n display: -webkit-box;\n -webkit-line-clamp: 5;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.text-separator {\n display: block;\n text-align: center;\n margin: 1.5rem 0;\n width: 100%;\n background: linear-gradient(\n to top,\n transparent 0%,\n transparent calc(50% - 1px),\n var(--wje-border-color) calc(50% - 1px),\n var(--wje-border-color) calc(50% + 1px),\n transparent calc(50% + 1px),\n transparent 100%\n );\n}\n.text-separator::before {\n background: #fff;\n content: attr(data-text);\n padding: 0 1rem;\n text-transform: uppercase;\n}\n\n.wje-toast-stack {\n position: fixed;\n top: 0;\n margin: 0 0.5rem;\n width: 300px;\n max-width: 100%;\n max-height: 100%;\n overflow: auto;\n z-index: 9999;\n}\n";
|
|
7
7
|
const animations = `@charset "UTF-8";/*!
|
|
8
8
|
* animate.css - https://animate.style/
|
|
9
9
|
* Version - 4.1.1
|
package/dist/wje-aside.js
CHANGED
|
@@ -2,7 +2,7 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
4
|
import WJElement from "./wje-element.js";
|
|
5
|
-
const styles = "/*\n[ WJ Aside ]\n*/\n\n:host {\n
|
|
5
|
+
const styles = "/*\n[ WJ Aside ]\n*/\n\n:host {\n box-sizing: border-box;\n flex-shrink: 0;\n overflow: auto;\n border-color: var(--wje-aside-border-color);\n border-width: var(--wje-aside-border-width);\n border-style: var(--wje-aside-border-style);\n}\n\n:host(.open) {\n display: block !important;\n}\n\n@media (min-width: 768px) {\n :host([fixed]) {\n position: fixed;\n width: var(--wje-aside-width);\n top: var(--wje-aside-top);\n height: calc(100% - var(--wje-aside-top));\n }\n}\n\n@media (max-width: 768px) {\n :host {\n display: none;\n }\n\n :host([variant='top-start']) {\n position: fixed;\n top: 0;\n left: 0;\n width: 80%;\n height: 100%;\n z-index: 9999;\n background-color: #fff;\n }\n}\n";
|
|
6
6
|
class Aside extends WJElement {
|
|
7
7
|
/**
|
|
8
8
|
* Constructor for the Aside class.
|
package/dist/wje-container.js
CHANGED
|
@@ -2,7 +2,7 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
4
|
import WJElement from "./wje-element.js";
|
|
5
|
-
const styles = "/*\n[ WJ Container ]\n*/\n\n:host {\n
|
|
5
|
+
const styles = "/*\n[ WJ Container ]\n*/\n\n:host {\n display: flex;\n flex-direction: row;\n flex: 1;\n flex-basis: auto;\n box-sizing: border-box;\n min-width: 0;\n}\n\n:host([vertical]) {\n flex-direction: column;\n}\n\n@media (min-width: 768px) {\n :host([indent]) {\n margin-left: var(--wje-container-indent);\n }\n}\n";
|
|
6
6
|
class Container extends WJElement {
|
|
7
7
|
/**
|
|
8
8
|
* Container constructor method.
|
package/dist/wje-dialog.js
CHANGED
package/dist/wje-dialog.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wje-dialog.js","sources":["../packages/wje-dialog/dialog.element.js","../packages/wje-dialog/dialog.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport '../wje-button/button.element.js';\nimport '../wje-icon/icon.element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Dialog` is a custom web component that represents a dialog.\n * @summary This element represents a dialog.\n * @documentation https://elements.webjet.sk/components/dialog\n * @status stable\n * @augments {WJElement}\n * @slot header - Slot for the header content.\n * @slot body - Slot for the body content.\n * @slot footer - Slot for the footer content.\n * @csspart dialog - The dialog wrapper.\n * @csspart header - The header of the dialog.\n * @csspart body - The body of the dialog.\n * @csspart footer - The footer of the dialog.\n * @csspart close - The close button of the dialog.\n * @cssproperty [--wje-dialog-background=var(--wje-background-color)] - Specifies the background color of the dialog.\n * @cssproperty [--wje-dialog-color=var(--wje-text-color)] - Defines the text color within the dialog.\n * @cssproperty [--wje-dialog-padding=1rem] - Controls the padding inside the dialog.\n * @cssproperty [--wje-dialog-border-radius=0.5rem] - Sets the border radius for the dialog's corners.\n * @cssproperty [--wje-dialog-box-shadow=0 2px 10px rgba(0, 0, 0, 0.1)] - Applies a shadow effect to the dialog.\n * @tag wje-dialog\n */\n\nexport default class Dialog extends WJElement {\n /**\n * @class\n */\n constructor() {\n super();\n }\n\n /**\n * Sets the value of the 'headline' attribute.\n * @param {string} value The new value for the 'headline' attribute.\n */\n set headline(value) {\n this.setAttribute('headline', value);\n }\n\n /**\n * Retrieves the value of the \"headline\" attribute from the element.\n * If the \"headline\" attribute is not present, returns an empty string.\n * @returns {string} The headline attribute value or an empty string if not set.\n */\n get headline() {\n return this.getAttribute('headline') || '';\n }\n\n /**\n * Sets the headline of the dialog.\n * @param value\n */\n set placement(value) {\n this.setAttribute('placement', value);\n }\n\n /**\n * Gets the headline of the dialog.\n * @returns {string|string}\n */\n get placement() {\n return this.getAttribute('placement') || 'slide-up';\n }\n\n /**\n * Sets the headline of the dialog.\n * @param value\n */\n set async(value) {\n this.setAttribute('async', '');\n }\n\n /**\n * Gets the headline of the dialog.\n * @returns {boolean}\n */\n get async() {\n return this.hasAttribute('async');\n }\n\n /**\n * Sets the headline of the dialog.\n * @param value\n */\n set closeHidden(value) {\n if (value) this.setAttribute('close-hidden', '');\n }\n\n /**\n * Gets the headline of the dialog.\n * @returns {boolean}\n */\n get closeHidden() {\n return !!this.hasAttribute('close-hidden');\n }\n\n set hiddenHeader(value) {\n if (value) this.setAttribute('hidden-header', '');\n }\n\n get hiddenHeader() {\n return !!this.hasAttribute('hidden-header');\n }\n\n set hiddenFooter(value) {\n if (value) this.setAttribute('hidden-footer', '');\n }\n\n get hiddenFooter() {\n return !!this.hasAttribute('hidden-footer');\n }\n\n /**\n * Sets the headline of the dialog.\n * @type {string}\n */\n className = 'Dialog';\n\n /**\n * Returns the CSS styles for the component.\n * @returns {*}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Returns the list of attributes to observe for changes.\n * @returns {*[]}\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Sets up the attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Draws the component.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n * @returns {DocumentFragment}\n */\n draw(context, store, params) {\n let fragment = document.createDocumentFragment();\n\n this.classList.add('fade', this.placement, params.size);\n\n let dialog = document.createElement('dialog');\n dialog.setAttribute('part', 'dialog');\n dialog.classList.add('modal-dialog');\n\n fragment.appendChild(dialog);\n\n this.dialog = dialog;\n\n return fragment;\n }\n\n /**\n * Draws the component after it has been drawn.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n */\n afterDraw(context, store, params) {\n if (params.trigger) {\n event.addListener(document, params.trigger, null, this.onOpen);\n }\n\n //this.dialog.addEventListener('close', this.onClose);\n }\n\n /**\n * Creates the dialog body.\n * @param dialog\n */\n htmlDialogBody(dialog) {\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'x');\n icon.setAttribute('slot', 'icon-only');\n\n let close = document.createElement('wje-button');\n close.setAttribute('fill', 'link');\n close.setAttribute('size', 'small');\n close.setAttribute('part', 'close');\n close.addEventListener('click', (e) => {\n this.close(e);\n });\n\n let header = document.createElement('div');\n header.setAttribute('part', 'header');\n header.classList.add('dialog-header');\n if (this.hasAttribute('headline'))\n header.innerHTML = `<span part=\"headline\">${this.headline}</span>`;\n\n let slotHeader = document.createElement('slot');\n slotHeader.setAttribute('name', 'header');\n\n const headerActions = document.createElement('div');\n headerActions.classList.add('header-actions');\n headerActions.setAttribute('part', 'header-actions');\n headerActions.appendChild(slotHeader);\n\n let contentSlot = document.createElement('slot');\n\n let body = document.createElement('div');\n body.setAttribute('part', 'body');\n body.classList.add('dialog-content');\n\n let footer = document.createElement('div');\n footer.setAttribute('part', 'footer');\n footer.classList.add('dialog-footer');\n footer.innerHTML = '';\n\n let slotFooter = document.createElement('slot');\n slotFooter.setAttribute('name', 'footer');\n\n close.appendChild(icon);\n\n if (!this.closeHidden) header.appendChild(close);\n\n header.appendChild(headerActions);\n body.appendChild(contentSlot);\n footer.appendChild(slotFooter);\n\n if (!this.hiddenHeader) dialog.appendChild(header);\n dialog.appendChild(body);\n if (!this.hiddenFooter) dialog.appendChild(footer);\n }\n\n /**\n * Closes the dialog.\n * @param e\n */\n close(e) {\n this.onClose(e);\n }\n\n /**\n * Before the component is disconnected.\n */\n beforeDisconnect() {\n if (this.params?.trigger) {\n event.removeListener(document, this.params?.trigger, null, this.onOpen);\n }\n\n //this.dialog.removeEventListener('close', this.onClose);\n }\n\n /**\n * Before the dialog opens.\n */\n beforeOpen(dialog, trigger) {\n // Hook for extending behavior before the dialog opens\n }\n\n /**\n * After the dialog opens.\n */\n afterOpen(dialog, trigger) {\n // Hook for extending behavior after the dialog opens\n }\n\n /**\n * Before the dialog closes.\n */\n beforeClose(dialog, trigger) {\n // Hook for extending behavior before the dialog closes\n }\n\n /**\n * After the dialog closes.\n */\n afterClose(dialog, trigger) {\n // Hook for extending behavior after the dialog closes\n }\n\n /**\n * Opens the dialog.\n * @param e\n */\n onOpen = (e) => {\n if (this.dialog) {\n this.dialog.innerHTML = '';\n }\n\n setTimeout(() => {\n Promise.resolve(this.beforeOpen(this, e)).then((res) => {\n this.htmlDialogBody(this.dialog);\n\n this.dialog.showModal(); // Now open the dialog\n\n if (this.dialog.open) {\n Promise.resolve(this.afterOpen(this, e));\n }\n });\n }, 0);\n }\n\n /**\n * Closes the dialog.\n * @param {object} e\n */\n onClose = (e) => {\n Promise.resolve(this.beforeClose(this, e)).then((res) => {\n this.dialog.close(); // Now close the dialog\n\n if (!this.dialog.open) {\n Promise.resolve(this.afterClose(this, e));\n }\n });\n };\n\n /**\n * Registers an event listener on the provided button that triggers a blocking UI element\n * and executes a given promise when the button is clicked.\n * @param {HTMLElement} button The button element to attach the event listener to.\n * @param {Function} promise A function that returns a promise to be executed when the button is clicked.\n */\n registerBlockingEvent(button, promise) {\n button.addEventListener('wje-button:click', async (e) => {\n let blockingElement = document.createElement('div');\n blockingElement.classList.add('blocking-element');\n\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'loader-2');\n icon.setAttribute('size', '2x-large');\n\n blockingElement.appendChild(icon);\n\n let scrollOffset = this.dialog.scrollTop;\n blockingElement.style.top = `${scrollOffset}px`;\n blockingElement.style.bottom = `-${scrollOffset}px`;\n\n this.dialog.appendChild(blockingElement);\n\n await promise()\n .then((res) => {\n this.close();\n blockingElement.remove();\n })\n .catch((err) => {\n console.error(err);\n blockingElement.remove();\n });\n });\n }\n}\n","import Dialog from './dialog.element.js';\n\nexport default Dialog;\n\nDialog.define('wje-dialog', Dialog);\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"wje-dialog.js","sources":["../packages/wje-dialog/dialog.element.js","../packages/wje-dialog/dialog.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport '../wje-button/button.element.js';\nimport '../wje-icon/icon.element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Dialog` is a custom web component that represents a dialog.\n * @summary This element represents a dialog.\n * @documentation https://elements.webjet.sk/components/dialog\n * @status stable\n * @augments {WJElement}\n * @slot header - Slot for the header content.\n * @slot body - Slot for the body content.\n * @slot footer - Slot for the footer content.\n * @csspart dialog - The dialog wrapper.\n * @csspart header - The header of the dialog.\n * @csspart body - The body of the dialog.\n * @csspart footer - The footer of the dialog.\n * @csspart close - The close button of the dialog.\n * @cssproperty [--wje-dialog-background=var(--wje-background-color)] - Specifies the background color of the dialog.\n * @cssproperty [--wje-dialog-color=var(--wje-text-color)] - Defines the text color within the dialog.\n * @cssproperty [--wje-dialog-padding=1rem] - Controls the padding inside the dialog.\n * @cssproperty [--wje-dialog-border-radius=0.5rem] - Sets the border radius for the dialog's corners.\n * @cssproperty [--wje-dialog-box-shadow=0 2px 10px rgba(0, 0, 0, 0.1)] - Applies a shadow effect to the dialog.\n * @tag wje-dialog\n */\n\nexport default class Dialog extends WJElement {\n /**\n * @class\n */\n constructor() {\n super();\n }\n\n /**\n * Sets the value of the 'headline' attribute.\n * @param {string} value The new value for the 'headline' attribute.\n */\n set headline(value) {\n this.setAttribute('headline', value);\n }\n\n /**\n * Retrieves the value of the \"headline\" attribute from the element.\n * If the \"headline\" attribute is not present, returns an empty string.\n * @returns {string} The headline attribute value or an empty string if not set.\n */\n get headline() {\n return this.getAttribute('headline') || '';\n }\n\n /**\n * Sets the headline of the dialog.\n * @param value\n */\n set placement(value) {\n this.setAttribute('placement', value);\n }\n\n /**\n * Gets the headline of the dialog.\n * @returns {string|string}\n */\n get placement() {\n return this.getAttribute('placement') || 'slide-up';\n }\n\n /**\n * Sets the headline of the dialog.\n * @param value\n */\n set async(value) {\n this.setAttribute('async', '');\n }\n\n /**\n * Gets the headline of the dialog.\n * @returns {boolean}\n */\n get async() {\n return this.hasAttribute('async');\n }\n\n /**\n * Sets the headline of the dialog.\n * @param value\n */\n set closeHidden(value) {\n if (value) this.setAttribute('close-hidden', '');\n }\n\n /**\n * Gets the headline of the dialog.\n * @returns {boolean}\n */\n get closeHidden() {\n return !!this.hasAttribute('close-hidden');\n }\n\n set hiddenHeader(value) {\n if (value) this.setAttribute('hidden-header', '');\n }\n\n get hiddenHeader() {\n return !!this.hasAttribute('hidden-header');\n }\n\n set hiddenFooter(value) {\n if (value) this.setAttribute('hidden-footer', '');\n }\n\n get hiddenFooter() {\n return !!this.hasAttribute('hidden-footer');\n }\n\n /**\n * Sets the headline of the dialog.\n * @type {string}\n */\n className = 'Dialog';\n\n /**\n * Returns the CSS styles for the component.\n * @returns {*}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Returns the list of attributes to observe for changes.\n * @returns {*[]}\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Sets up the attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Draws the component.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n * @returns {DocumentFragment}\n */\n draw(context, store, params) {\n let fragment = document.createDocumentFragment();\n\n this.classList.add('fade', this.placement, params.size);\n\n let dialog = document.createElement('dialog');\n dialog.setAttribute('part', 'dialog');\n dialog.classList.add('modal-dialog');\n\n fragment.appendChild(dialog);\n\n this.dialog = dialog;\n\n return fragment;\n }\n\n /**\n * Draws the component after it has been drawn.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n */\n afterDraw(context, store, params) {\n if (params.trigger) {\n event.addListener(document, params.trigger, null, this.onOpen);\n }\n\n //this.dialog.addEventListener('close', this.onClose);\n }\n\n /**\n * Creates the dialog body.\n * @param dialog\n */\n htmlDialogBody(dialog) {\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'x');\n icon.setAttribute('slot', 'icon-only');\n\n let close = document.createElement('wje-button');\n close.setAttribute('fill', 'link');\n close.setAttribute('size', 'small');\n close.setAttribute('part', 'close');\n close.addEventListener('click', (e) => {\n this.close(e);\n });\n\n let header = document.createElement('div');\n header.setAttribute('part', 'header');\n header.classList.add('dialog-header');\n if (this.hasAttribute('headline'))\n header.innerHTML = `<span part=\"headline\">${this.headline}</span>`;\n\n let slotHeader = document.createElement('slot');\n slotHeader.setAttribute('name', 'header');\n\n const headerActions = document.createElement('div');\n headerActions.classList.add('header-actions');\n headerActions.setAttribute('part', 'header-actions');\n headerActions.appendChild(slotHeader);\n\n let contentSlot = document.createElement('slot');\n\n let body = document.createElement('div');\n body.setAttribute('part', 'body');\n body.classList.add('dialog-content');\n\n let footer = document.createElement('div');\n footer.setAttribute('part', 'footer');\n footer.classList.add('dialog-footer');\n footer.innerHTML = '';\n\n let slotFooter = document.createElement('slot');\n slotFooter.setAttribute('name', 'footer');\n\n close.appendChild(icon);\n\n if (!this.closeHidden) header.appendChild(close);\n\n header.appendChild(headerActions);\n body.appendChild(contentSlot);\n footer.appendChild(slotFooter);\n\n if (!this.hiddenHeader) dialog.appendChild(header);\n dialog.appendChild(body);\n if (!this.hiddenFooter) dialog.appendChild(footer);\n }\n\n /**\n * Closes the dialog.\n * @param e\n */\n close(e) {\n this.onClose(e);\n }\n\n /**\n * Before the component is disconnected.\n */\n beforeDisconnect() {\n if (this.params?.trigger) {\n event.removeListener(document, this.params?.trigger, null, this.onOpen);\n }\n\n //this.dialog.removeEventListener('close', this.onClose);\n }\n\n /**\n * Before the dialog opens.\n */\n beforeOpen(dialog, trigger) {\n // Hook for extending behavior before the dialog opens\n }\n\n /**\n * After the dialog opens.\n */\n afterOpen(dialog, trigger) {\n // Hook for extending behavior after the dialog opens\n }\n\n /**\n * Before the dialog closes.\n */\n beforeClose(dialog, trigger) {\n // Hook for extending behavior before the dialog closes\n }\n\n /**\n * After the dialog closes.\n */\n afterClose(dialog, trigger) {\n // Hook for extending behavior after the dialog closes\n }\n\n /**\n * Opens the dialog.\n * @param e\n */\n onOpen = (e) => {\n if (this.dialog) {\n this.dialog.innerHTML = '';\n }\n\n setTimeout(() => {\n Promise.resolve(this.beforeOpen(this, e)).then((res) => {\n this.htmlDialogBody(this.dialog);\n\n this.dialog.showModal(); // Now open the dialog\n\n if (this.dialog.open) {\n Promise.resolve(this.afterOpen(this, e));\n }\n });\n }, 0);\n }\n\n /**\n * Closes the dialog.\n * @param {object} e\n */\n onClose = (e) => {\n Promise.resolve(this.beforeClose(this, e)).then((res) => {\n this.dialog.close(); // Now close the dialog\n\n if (!this.dialog.open) {\n Promise.resolve(this.afterClose(this, e));\n }\n });\n };\n\n /**\n * Registers an event listener on the provided button that triggers a blocking UI element\n * and executes a given promise when the button is clicked.\n * @param {HTMLElement} button The button element to attach the event listener to.\n * @param {Function} promise A function that returns a promise to be executed when the button is clicked.\n */\n registerBlockingEvent(button, promise) {\n button.addEventListener('wje-button:click', async (e) => {\n let blockingElement = document.createElement('div');\n blockingElement.classList.add('blocking-element');\n\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'loader-2');\n icon.setAttribute('size', '2x-large');\n\n blockingElement.appendChild(icon);\n\n let scrollOffset = this.dialog.scrollTop;\n blockingElement.style.top = `${scrollOffset}px`;\n blockingElement.style.bottom = `-${scrollOffset}px`;\n\n this.dialog.appendChild(blockingElement);\n\n await promise()\n .then((res) => {\n this.close();\n blockingElement.remove();\n })\n .catch((err) => {\n console.error(err);\n blockingElement.remove();\n });\n });\n }\n}\n","import Dialog from './dialog.element.js';\n\nexport default Dialog;\n\nDialog.define('wje-dialog', Dialog);\n"],"names":[],"mappings":"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"}
|
package/dist/wje-header.js
CHANGED
|
@@ -2,7 +2,7 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
4
|
import WJElement from "./wje-element.js";
|
|
5
|
-
const styles = "/*\n[ WJ Header ]\n*/\n\n:host {\n
|
|
5
|
+
const styles = "/*\n[ WJ Header ]\n*/\n\n:host {\n display: block;\n height: var(--wje-header-height);\n width: 100%;\n background: var(--wje-header-background);\n border-width: var(--wje-header-border-width);\n border-style: var(--wje-header-border-style);\n border-color: var(--wje-header-border-color);\n .native-header {\n display: flex;\n padding-inline: 1rem;\n }\n}\n\n:host([sticky]) {\n position: sticky;\n top: var(--wje-header-top);\n z-index: 999;\n}\n";
|
|
6
6
|
class Header extends WJElement {
|
|
7
7
|
/**
|
|
8
8
|
* Creates an instance of Header.
|
package/dist/wje-icon-picker.js
CHANGED
|
@@ -7,7 +7,7 @@ import InfiniteScroll from "./wje-infinite-scroll.js";
|
|
|
7
7
|
import Input from "./wje-input.js";
|
|
8
8
|
import Tooltip from "./wje-tooltip.js";
|
|
9
9
|
import { event } from "./event.js";
|
|
10
|
-
const styles = "/*\n[ Wj Icon Picker ]\n*/\n\n:host {\n /*padding: 0 1rem;*/\n}\n\n.anchor {\n width: var(--wje-icon-picker-icon-size);\n height: var(--wje-icon-picker-icon-size);\n padding: var(--wje-icon-picker-padding);\n border-width: var(--wje-icon-picker-border-width);\n border-style: var(--wje-icon-picker-border-style);\n border-color: var(--wje-icon-picker-border-color);\n box-sizing: border-box;\n border-radius: var(--wje-icon-picker-radius);\n}\n\n.picker {\n width: 320px;\n height: 271px;\n box-shadow
|
|
10
|
+
const styles = "/*\n[ Wj Icon Picker ]\n*/\n\n:host {\n /*padding: 0 1rem;*/\n}\n\n.anchor {\n width: var(--wje-icon-picker-icon-size);\n height: var(--wje-icon-picker-icon-size);\n padding: var(--wje-icon-picker-padding);\n border-width: var(--wje-icon-picker-border-width);\n border-style: var(--wje-icon-picker-border-style);\n border-color: var(--wje-icon-picker-border-color);\n box-sizing: border-box;\n border-radius: var(--wje-icon-picker-radius);\n}\n\n.picker {\n width: 320px;\n height: 271px;\n box-shadow: var(--wje-icon-picker-shadow);\n border-radius: var(--wje-icon-picker-radius);\n border-width: var(--wje-icon-picker-border-width);\n border-style: var(--wje-icon-picker-border-style);\n border-color: var(--wje-icon-picker-border-color);\n overflow: auto;\n padding: 1rem;\n background: var(--wje-icon-picker-background);\n}\n\n.icon-items {\n --icon-min-width: 2rem;\n display: grid;\n grid-gap: 0.5rem;\n grid-template-columns: repeat(auto-fit, minmax(var(--icon-min-width), 1fr));\n}\n\n.icon-item {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n color: inherit;\n padding: 0.25rem;\n min-height: var(--wje-icon-picker-icon-size);\n min-width: var(--wje-icon-picker-icon-size);\n text-decoration: none;\n\n &:hover {\n border-radius: 0.25rem;\n background: var(--wje-border-color);\n }\n}\n\n.wje-size {\n --wje-icon-size: 24px !important;\n}\n\nicon-item svg {\n width: var(--wje-icon-picker-icon-size);\n height: var(--wje-icon-picker-icon-size);\n}\n\nwje-input {\n --wje-input-border-radius: 4px;\n --wje-input-margin-bottom: 0;\n}\n\nwje-infinite-scroll {\n margin-top: 1rem;\n}\n\nwje-select {\n --wje-select-border-width: 0 0 1px 0 !important;\n --wje-select-border-radius: 0 !important;\n margin-bottom: 1rem;\n}\n\n.anchor wje-icon {\n --wje-icon-size: 100% !important;\n}\n";
|
|
11
11
|
class IconPicker extends WJElement {
|
|
12
12
|
/**
|
|
13
13
|
* Creates an instance of IconPicker.
|
package/dist/wje-select.js
CHANGED
|
@@ -22,7 +22,7 @@ import Option from "./wje-option.js";
|
|
|
22
22
|
import Options from "./wje-options.js";
|
|
23
23
|
import Checkbox from "./wje-checkbox.js";
|
|
24
24
|
import { P as Popup } from "./popup.element-DeajFyOQ.js";
|
|
25
|
-
const styles = "/*\n[ WJ Select ]\n*/\n\n:host {\n margin-bottom: var(--wje-select-margin-bottom);\n width: 100%;\n display: block;\n [slot='arrow'] {\n transform: rotate(0deg);\n transition: all 0.2s ease-in;\n }\n}\n\n.native-select {\n position: relative;\n &.default {\n .wrapper {\n display: block;\n background-color: var(--wje-select-background);\n border-width: var(--wje-select-border-width);\n border-style: var(--wje-select-border-style);\n border-color: var(--wje-select-border-color);\n border-radius: var(--wje-select-border-radius);\n padding-inline: 0.5rem;\n padding-top: 0.125rem;\n padding-bottom: 0.125rem;\n }\n .input-wrapper {\n padding: 0;\n min-height: 28px;\n margin-top: -4px;\n }\n &.focused {\n wje-label {\n opacity: 0.67;\n font-size: 12px;\n letter-spacing: normal;\n }\n }\n
|
|
25
|
+
const styles = "/*\n[ WJ Select ]\n*/\n\n:host {\n margin-bottom: var(--wje-select-margin-bottom);\n width: 100%;\n display: block;\n [slot='arrow'] {\n transform: rotate(0deg);\n transition: all 0.2s ease-in;\n }\n label {\n margin: var(--wje-select-label-margin);\n padding: var(--wje-select-label-padding);\n display: var(--wje-select-label-display);\n opacity: 1;\n cursor: text;\n transition: opacity 0.2s ease;\n line-height: var(--wje-select-label-line-height);\n font-size: var(--wje-select-label-font-size);\n }\n}\n\n.native-select {\n position: relative;\n &.default {\n .wrapper {\n display: block;\n background-color: var(--wje-select-background);\n border-width: var(--wje-select-border-width);\n border-style: var(--wje-select-border-style);\n border-color: var(--wje-select-border-color);\n border-radius: var(--wje-select-border-radius);\n padding-inline: 0.5rem;\n padding-top: 0.125rem;\n padding-bottom: 0.125rem;\n }\n .input-wrapper {\n padding: 0;\n min-height: 28px;\n margin-top: -4px;\n }\n &.focused {\n wje-label {\n opacity: 0.67;\n font-size: 12px;\n letter-spacing: normal;\n }\n }\n label {\n &.fade {\n opacity: 0.5;\n font-size: 12px;\n letter-spacing: normal;\n }\n }\n }\n &.standard {\n .wrapper {\n height: var(--wje-select-height);\n box-sizing: border-box;\n background-color: var(--wje-select-background);\n border-width: var(--wje-select-border-width);\n border-style: var(--wje-select-border-style);\n border-color: var(--wje-select-border-color);\n border-radius: var(--wje-select-border-radius);\n }\n .input-wrapper {\n background: transparent;\n width: 100%;\n }\n slot[name='error'] {\n position: static;\n\n background: transparent;\n padding: 0.25rem 0;\n left: auto;\n transform: none;\n color: var(--wje-input-color-invalid);\n font-size: 12px;\n line-height: normal;\n }\n }\n}\n\n.wrapper {\n display: flex;\n width: 100%;\n}\n\n.input-wrapper {\n display: grid;\n grid-template-columns: auto 1fr auto auto auto;\n align-items: center;\n background-color: var(--wje-select-background);\n /*min-height: 28px;*/\n color: var(--wje-select-color);\n line-height: var(--wje-select-line-height);\n appearance: none;\n padding: 2px 0.5rem;\n font-size: 14px !important;\n font-weight: normal;\n vertical-align: middle;\n input[readonly] {\n pointer-events: none;\n caret-color: transparent;\n }\n}\n\ninput {\n color: var(--wje-select-color);\n line-height: var(--wje-select-line-height);\n font-size: 14px !important;\n font-weight: 400;\n letter-spacing: 0.01em;\n border: medium;\n height: 25px;\n min-height: 25px;\n padding: 0;\n background: none;\n box-shadow: none;\n width: 100%;\n outline: 0;\n font-size: 14px !important;\n}\n\n::placeholder {\n opacity: 1;\n}\n\n:host [active] {\n .wrapper {\n border-radius: var(--wje-select-border-radius);\n }\n [slot='arrow'] {\n transform: rotate(180deg);\n transition: all 0.2s ease-in;\n }\n}\n\n.options-wrapper {\n border-width: var(--wje-select-options-border-width);\n border-style: var(--wje-select-options-border-style);\n border-color: var(--wje-select-options-border-color);\n border-radius: var(--wje-select-options-border-radius);\n margin-top: calc(0px - var(--wje-select-border-width));\n background-color: var(--wje-select-options-background-color);\n overflow: hidden;\n}\n\n.find {\n margin-block: var(--wje-select-find-margin-block);\n margin-inline: var(--wje-select-find-margin-inline);\n width: var(--wje-select-find-width);\n}\n\n.list {\n overflow: auto;\n height: 100%;\n}\n\n.options-wrapper:has(.find) .list {\n height: calc(100% - 32px - 2 * var(--wje-select-find-margin-block));\n}\n\n:host([multiple]) input {\n position: absolute;\n z-index: -1;\n top: 0;\n left: 0;\n width: 0;\n height: 0;\n opacity: 0;\n}\n\n:host([multiple]) .chips {\n display: flex;\n flex: 1;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--wje-spacing-3x-small);\n}\n\n:host([disabled]) .input-wrapper {\n opacity: 0.5;\n pointer-events: none;\n cursor: not-allowed;\n}\n\n.counter {\n padding-inline: 0.5rem;\n}\n\nwje-chip {\n --wje-chip-margin: 0 0.25rem 0 0;\n}\n\nwje-button {\n --wje-padding-top: 0.25rem;\n --wje-padding-start: 0.25rem;\n --wje-padding-end: 0.25rem;\n --wje-padding-bottom: 0.25rem;\n --wje-button-margin-inline: 0 0.25rem;\n}\n\n.slot-start,\n.slot-end {\n &:not(:empty) {\n margin-right: 0.5rem;\n }\n}\n\nslot[name='error'] {\n display: none;\n}\n\n:host([invalid]) slot[name='error'] {\n display: block;\n}\n\nslot[name='error'] {\n display: none;\n position: absolute;\n max-width: 100%;\n min-width: auto;\n border-radius: 50px;\n background: black;\n padding: 0.25rem 0.5rem;\n top: 0;\n left: 50%;\n transform: translate(-50%, -50%);\n color: white;\n font-size: var(--wje-font-size-small);\n width: max-content;\n line-height: normal;\n}\n\n.input-hidden{\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n opacity: 0;\n z-index: -1;\n}\n\n:host([required]) .wrapper::after {\n color: var(--wje-input-color-invalid);\n content: var(--wje-input-required-symbol);\n font-size: 24px;\n position: absolute;\n right: 12px;\n top: 0;\n}\n\n:host([required]) .standard .input-wrapper::after {\n right: 13px;\n top: -20px;\n}";
|
|
26
26
|
class Select extends FormAssociatedElement {
|
|
27
27
|
constructor() {
|
|
28
28
|
super();
|
|
@@ -463,7 +463,7 @@ class Select extends FormAssociatedElement {
|
|
|
463
463
|
let wrapper = document.createElement("div");
|
|
464
464
|
wrapper.classList.add("wrapper");
|
|
465
465
|
wrapper.setAttribute("slot", "anchor");
|
|
466
|
-
let label = document.createElement("
|
|
466
|
+
let label = document.createElement("label");
|
|
467
467
|
label.setAttribute("part", "label");
|
|
468
468
|
label.innerText = this.label || "";
|
|
469
469
|
let inputWrapper = document.createElement("div");
|
package/dist/wje-select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wje-select.js","sources":["../packages/wje-select/select.element.js","../packages/wje-select/select.js"],"sourcesContent":["import { FormAssociatedElement } from '../internals/form-associated-element.js';\nimport { event } from '../utils/event.js';\nimport Button from '../wje-button/button.js';\nimport Popup from '../wje-popup/popup.js';\nimport Icon from '../wje-icon/icon.js';\nimport Label from '../wje-label/label.js';\nimport Chip from '../wje-chip/chip.js';\nimport Input from '../wje-input/input.js';\nimport Option from '../wje-option/option.js';\nimport Options from '../wje-options/options.js';\nimport Checkbox from '../wje-checkbox/checkbox.js';\nimport styles from './styles/styles.css?inline';\n\nexport class Select extends FormAssociatedElement {\n\tconstructor() {\n\t\tsuper();\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the counter element, initially null.\n\t\t * @private\n\t\t */\n\t\tthis.counterEl = null;\n\n\t\t/**\n\t\t * @type {boolean}\n\t\t * @description Tracks whether the select element was previously opened, initially false.\n\t\t * @private\n\t\t * @default {boolean} false\n\t\t */\n\t\tthis._wasOppened = false;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the native select element, initially null.\n\t\t */\n\t\tthis.native = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the popup element, initially null.\n\t\t */\n\t\tthis.popup = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the label element, initially null.\n\t\t */\n\t\tthis.labelElement = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the slot start element, initially null.\n\t\t */\n\t\tthis.slotStart = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the slot end element, initially null.\n\t\t */\n\t\tthis.slotEnd = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the input element, initially null.\n\t\t */\n\t\tthis.input = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the chips element, initially null.\n\t\t */\n\t\tthis.chips = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the clear button element, initially null.\n\t\t */\n\t\tthis.clear = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the list element, initially null.\n\t\t */\n\t\tthis.list = null;\n\n\t\tthis._value = [];\n\t\tthis._selectedOptions = [];\n\t}\n\n\t#addedOptions = [];\n\n\t#htmlOptions = [];\n\n\t/**\n\t * Prevent closing the parent <wje-select>'s popup when a nested <wje-dropdown>\n\t * menu item is clicked. Closes only the dropdown that owns the clicked item.\n\t * This captures the event at the document level (useCapture=true) so it can\n\t * stop the global outside-click logic that would otherwise hide the select's popup.\n\t */\n\t#onMenuItemClickCapture = (e) => {\n\t\tconst target = /** @type {HTMLElement} */(e.target);\n\t\tif (!target || !target.closest) return;\n\n\t\t// Run only for clicks inside a dropdown menu item\n\t\tconst menuItem = target.closest('wje-menu-item');\n\t\tif (!menuItem) return;\n\n\t\tconst dropdown = target.closest('wje-dropdown');\n\t\tif (dropdown && typeof dropdown.hide === 'function') {\n\t\t\t// Close only the dropdown; keep the select's popup open\n\t\t\tdropdown.hide();\n\t\t}\n\n\t\t// Block bubbling to document-level outside-click handlers that\n\t\t// might close <wje-popup> used by <wje-select>\n\t\te.stopPropagation();\n\t};\n\n\t/**\n\t * An object representing component dependencies with their respective classes.\n\t * Each property in the object maps a custom component name (as a string key)\n\t * to its corresponding class or constructor.\n\t * @typedef {{[key: string]: Function}} Dependencies\n\t * @property {Function} 'wje-button' Represents the Button component class.\n\t * @property {Function} 'wje-popup' Represents the Popup component class.\n\t * @property {Function} 'wje-icon' Represents the Icon component class.\n\t * @property {Function} 'wje-label' Represents the Label component class.\n\t * @property {Function} 'wje-chip' Represents the Chip component class.\n\t * @property {Function} 'wje-input' Represents the Input component class.\n\t * @property {Function} 'wje-option' Represents the Option component class.\n\t * @property {Function} 'wje-checkbox' Represents the Checkbox component class.\n\t */\n\tdependencies = {\n\t\t'wje-button': Button,\n\t\t'wje-popup': Popup,\n\t\t'wje-icon': Icon,\n\t\t'wje-label': Label,\n\t\t'wje-chip': Chip,\n\t\t'wje-input': Input,\n\t\t'wje-option': Option,\n\t\t'wje-options': Options,\n\t\t'wje-checkbox': Checkbox,\n\t};\n\n\t/**\n\t * Sets the value for the form field. Converts the input value into a FormData object\n\t * if it is not already an array, splitting by spaces if necessary, and sets the\n\t * internal form value as well as the selected values.\n\t * @param {string|Array} value The value to be set. Can be a string (which will be\n\t * split into an array by spaces) or an array of values.\n\t */\n\tset value(value) {\n\t\tconst formData = new FormData();\n\n\t\tif (value) {\n\t\t\tlet data = value;\n\n\t\t\tif (!Array.isArray(data)) {\n\t\t\t\tdata = data.split(' ');\n\t\t\t}\n\t\t\tdata.forEach(v => {\n\t\t\t\tformData.append(this.name, v)\n\t\t\t});\n\t\t\tvalue = formData;\n\n\t\t\tthis._value = data;\n\t\t} else {\n\t\t\tformData.delete(this.name);\n\t\t\tvalue = formData;\n\t\t\tthis._value = [];\n\t\t}\n\t\tthis.internals.setFormValue(value);\n\t}\n\n\t/**\n\t * Retrieves the current value.\n\t * @returns {any} The value of the `_value` property.\n\t */\n\tget value() {\n\t\treturn this._value;\n\t}\n\n\t/**\n\t * Sets the maximum number of options allowed.\n\t * @param { number | object} value The value to set as the maximum number of options.\n\t * If null, the 'max-options' attribute will be removed.\n\t */\n\tset maxOptions(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('max-options', value);\n\t\t} else {\n\t\t\tthis.removeAttribute('max-options');\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the maximum number of options allowed.\n\t * Parses the value of the 'max-options' attribute from the element and converts it to a number.\n\t * If the attribute is not present or cannot be converted to a valid number, defaults to 1.\n\t * @returns {number} The maximum number of options, or 0 if the attribute is not set or invalid.\n\t */\n\tget maxOptions() {\n\t\treturn +this.getAttribute('max-options') || 1;\n\t}\n\n\t/**\n\t * @summary Setter for the defaultValue attribute.\n\t * This method sets the 'value' attribute of the custom input element to the provided value.\n\t * The 'value' attribute represents the default value of the input element.\n\t * @param {string} value The value to set as the default value.\n\t */\n\tset defaultValue(value) {\n\t\tthis.setAttribute('value', value);\n\t}\n\n\t/**\n\t * @summary Getter for the defaultValue attribute.\n\t * This method retrieves the 'value' attribute of the custom input element.\n\t * The 'value' attribute represents the default value of the input element.\n\t * If the 'value' attribute is not set, it returns an empty string.\n\t * @returns {string} The default value of the input element.\n\t */\n\tget defaultValue() {\n\t\treturn this.getAttribute('value') ?? '';\n\t}\n\n\t/**\n\t * Sets the trigger value.\n\t * @param {string} value The trigger value to set.\n\t */\n\tset trigger(value) {\n\t\tthis.setAttribute('trigger', value);\n\t}\n\n\t/**\n\t * Returns the trigger value.\n\t * @returns {string} The trigger value.\n\t */\n\tget trigger() {\n\t\treturn this.getAttribute('trigger') || 'click';\n\t}\n\n\t/**\n\t * Sets or removes the disabled state for the associated elements.\n\t * @param {boolean} value A boolean indicating whether the elements should be disabled.\n\t * If true, the disabled attribute is added to the elements. If false, the disabled attribute is removed.\n\t */\n\tset disabled(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('disabled', '');\n\t\t\tthis.input.setAttribute('disabled', '');\n\t\t\tthis.displayInput.setAttribute('disabled', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('disabled');\n\t\t\tthis.input.removeAttribute('disabled');\n\t\t\tthis.displayInput.removeAttribute('disabled');\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the current state of the 'disabled' attribute.\n\t * @returns {boolean} Returns true if the 'disabled' attribute is present, otherwise false.\n\t */\n\tget disabled() {\n\t\treturn this.hasAttribute('disabled');\n\t}\n\n\t/**\n\t * Sets the readonly state of the element. When set to true,\n\t * the element and its associated inputs are marked as readonly or disabled.\n\t * When set to false, the readonly and disabled attributes are removed,\n\t * allowing user interaction.\n\t * @param {boolean} value A boolean value indicating whether to set the\n\t * element and its associated inputs to readonly (true) or not (false).\n\t */\n\tset readonly(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('disabled', '');\n\t\t\tthis.input.setAttribute('readonly', '');\n\t\t\tthis.displayInput.setAttribute('disabled', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('disabled');\n\t\t\tthis.input.removeAttribute('readonly');\n\t\t\tthis.displayInput.removeAttribute('disabled');\n\t\t}\n\t}\n\n\t/**\n\t * Checks if the 'readonly' attribute is present on the element.\n\t * @returns {boolean} Returns true if the 'readonly' attribute is set, otherwise false.\n\t */\n\tget readonly() {\n\t\treturn this.hasAttribute('readonly');\n\t}\n\n\t/**\n\t * Sets the maximum height value for the element.\n\t * If a value is provided, it sets the 'max-height' attribute on the element.\n\t * If no value is provided, it removes the 'max-height' attribute from the element.\n\t * @param {string|null} value The maximum height to be set. If null or undefined, the attribute is removed.\n\t */\n\tset maxHeight(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('max-height', value);\n\t\t} else {\n\t\t\tthis.removeAttribute('max-height');\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the maximum height value, which is determined by the 'max-height' attribute.\n\t * If the attribute is not set, a default value of '200px' is returned.\n\t * @returns {string} The maximum height value as a string.\n\t */\n\tget maxHeight() {\n\t\treturn this.getAttribute('max-height') || 'auto';\n\t}\n\n\t/**\n\t * Sets the offset attribute for the element.\n\t * @param {string} value The value to assign to the offset attribute.\n\t */\n\tset offset(value) {\n\t\tthis.setAttribute('offset', value);\n\t}\n\n\t/**\n\t * Gets the value of the offset attribute of the current element.\n\t * If the offset attribute is not present, returns a default value of '0'.\n\t * @returns {string} The value of the offset attribute or the default value '0'.\n\t */\n\tget offset() {\n\t\treturn this.getAttribute('offset') || '5';\n\t}\n\n\t/**\n\t * Sets the selected options for the object.\n\t * @param {Array|object} value The new value for the selected options. It can be an array or object containing the selected options.\n\t */\n\tset selectedOptions(value) {\n\t\tthis._selectedOptions = value;\n\t}\n\n\t/**\n\t * Retrieves the selected options.\n\t * @returns {Array} An array containing the currently selected options. If no options are selected, an empty array is returned.\n\t */\n\tget selectedOptions() {\n\t\treturn this._selectedOptions || [];\n\t}\n\n\t/**\n\t * Sets the `lazy` attribute on the element. If the provided value is truthy, the `lazy` attribute is added. If the value is falsy, the `lazy` attribute is removed.\n\t * @param {boolean} value A boolean value indicating whether to add or remove the `lazy` attribute. If `true`, the attribute is added; if `false`, it is removed.\n\t */\n\tset lazy(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('lazy', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('lazy');\n\t\t}\n\t}\n\n\t/**\n\t * Getter for the 'lazy' property.\n\t * @returns {boolean} Returns true if the 'lazy' attribute is present on the element, otherwise false.\n\t */\n\tget lazy() {\n\t\treturn this.hasAttribute('lazy');\n\t}\n\n\t/**\n\t * Sets or removes the 'no-size' attribute on an element.\n\t * @param {boolean} value A boolean indicating whether to add or remove the 'no-size' attribute. If true, the attribute is added; if false, the attribute is removed.\n\t */\n\tset noSize(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('no-size', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('no-size');\n\t\t}\n\t}\n\n\t/**\n\t * Gets the value of the 'no-size' attribute for the element.\n\t * @returns {boolean} True if the 'no-size' attribute is present, otherwise false.\n\t */\n\tget noSize() {\n\t\treturn this.hasAttribute('no-size');\n\t}\n\n\t/**\n\t * Getter for the customErrorDisplay attribute.\n\t * @returns {boolean} Whether the attribute is present.\n\t */\n\tget customErrorDisplay() {\n\t\treturn this.hasAttribute('custom-error-display');\n\t}\n\n\t/**\n\t * Retrieves the complete list of options available for the component.\n\t * The options are determined by combining elements from various sources, including loaded options, added options, and HTML-sourced options.\n\t * If a `wje-options` element is present within the component, its loaded options are included in the merged list.\n\t * In the absence of a `wje-options` element, duplicates among the added and HTML options are removed, retaining their order.\n\t * @returns {Array<object>} An array containing all the available options, combining the loaded, added, and HTML-based options, with duplicates removed where applicable.\n\t */\n\tget options() {\n\t\tif (this.querySelector('wje-options')) {\n\t\t\tconst allOptions = [...this.querySelector('wje-options').loadedOptions, ...this.#addedOptions, ...this.#htmlOptions]\n\n\t\t\treturn allOptions\n\t\t} else {\n\t\t\tconst allOptions = [...this.#addedOptions, ...this.#htmlOptions]\n\n\t\t\treturn Array.from(\n\t\t\t\tnew Map(allOptions.reverse().map(obj => [obj.value, obj])).values()\n\t\t\t).reverse();\n\t\t}\n\t}\n\n\tclassName = 'Select';\n\n\t/**\n\t * Returns the CSS styles for the component.\n\t * @static\n\t * @returns {CSSStyleSheet}\n\t */\n\tstatic get cssStyleSheet() {\n\t\treturn styles;\n\t}\n\n\t/**\n\t * Returns the list of attributes to observe for changes.\n\t * @static\n\t * @returns {Array<string>}\n\t */\n\tstatic get observedAttributes() {\n\t\treturn ['active', 'value', 'disabled', 'readonly', 'multiple', 'label', 'placeholder', 'max-height', 'max-options', 'variant', 'placement'];\n\t}\n\n\t/**\n\t * Sets up the attributes for the component.\n\t */\n\tsetupAttributes() {\n\t\tthis.isShadowRoot = 'open';\n\t}\n\n\tbeforeDraw() {\n\t\tif(this.hasAttribute('value')) {\n\t\t\tthis.value = this.getAttribute('value');\n\t\t}\n\t}\n\n\t/**\n\t * Draws the component for the select.\n\t * @returns {DocumentFragment}\n\t */\n\tdraw() {\n\t\tlet fragment = document.createDocumentFragment();\n\n\t\tthis.classList.add('wje-placement', this.placement ? 'wje-' + this.placement : 'wje-start');\n\n\t\t// zakladny obalovac\n\t\tlet native = document.createElement('div');\n\t\tnative.setAttribute('part', 'native');\n\t\tnative.classList.add('native-select', this.variant || 'default');\n\n\t\t// wrapper pre label a inputWrapper\n\t\tlet wrapper = document.createElement('div');\n\t\twrapper.classList.add('wrapper');\n\t\twrapper.setAttribute('slot', 'anchor');\n\n\t\t// label\n\t\tlet label = document.createElement('wje-label');\n\t\tlabel.setAttribute('part', 'label');\n\t\tlabel.innerText = this.label || '';\n\n\t\t// obalovac pre input\n\t\tlet inputWrapper = document.createElement('div');\n\t\tinputWrapper.setAttribute('part', 'input-wrapper');\n\t\tinputWrapper.classList.add('input-wrapper');\n\n\t\tlet slotStart = document.createElement('div');\n\t\tslotStart.classList.add('slot-start');\n\n\t\tlet input = document.createElement('input');\n\t\tinput.setAttribute('type', 'text');\n\t\tinput.value = this.value.join(' ').trim();\n\t\tinput.classList.add('input-hidden');\n\n\t\tlet display = document.createElement('input');\n\t\tdisplay.setAttribute('type', 'text');\n\t\tdisplay.setAttribute('part', 'input');\n\t\tdisplay.setAttribute('autocomplete', 'off');\n\t\tdisplay.setAttribute('readonly', '');\n\t\tdisplay.setAttribute('placeholder', this.placeholder || '');\n\n\t\tif (this.required) {\n\t\t\tinput.setAttribute('required', '');\n\t\t\tdisplay.setAttribute('required', '');\n\t\t}\n\n\t\tlet slotEnd = document.createElement('div');\n\t\tslotEnd.classList.add('slot-end');\n\n\t\tlet arrow = document.createElement('wje-icon');\n\t\tarrow.setAttribute('name', 'chevron-down');\n\t\tarrow.setAttribute('slot', 'arrow');\n\n\t\tlet chips = document.createElement('div');\n\t\tchips.classList.add('chips');\n\t\tchips.innerText = this.placeholder || '';\n\n\t\t// obalovac pre option a find\n\t\tlet optionsWrapper = document.createElement('div');\n\t\toptionsWrapper.setAttribute('part', 'options-wrapper');\n\t\toptionsWrapper.classList.add('options-wrapper');\n\t\toptionsWrapper.style.setProperty('height', this.maxHeight);\n\n\t\tlet list = document.createElement('div');\n\t\tlist.classList.add('list');\n\n\t\tlet slot = document.createElement('slot');\n\n\t\tlet clear = document.createElement('wje-button');\n\t\tclear.setAttribute('fill', 'link');\n\t\tclear.setAttribute('part', 'clear');\n\t\tclear.setAttribute('stop-propagation', '');\n\n\t\tlet clearIcon = document.createElement('wje-icon');\n\t\tclearIcon.setAttribute('name', 'x');\n\n\t\tlet error = document.createElement('div');\n\t\terror.setAttribute('slot', 'error');\n\n\t\tlet errorSlot = document.createElement('slot');\n\t\terrorSlot.setAttribute('name', 'error');\n\n\t\t// vytvorime popup\n\t\tlet popup = document.createElement('wje-popup');\n\t\tpopup.setAttribute('placement', 'bottom-start');\n\t\tif (!this.noSize)\n\t\t\tpopup.setAttribute('size', '');\n\t\tpopup.setAttribute('part', 'popup');\n\t\tpopup.setAttribute('offset', this.offset);\n\n\t\tif(this.lazy || this.querySelector('wje-options')) {\n\t\t\tpopup.setAttribute('loader', '');\n\t\t}\n\n\t\tif (this.disabled || this.readonly) {\n\t\t\tpopup.setAttribute('disabled', '');\n\t\t} else {\n\t\t\tpopup.removeAttribute('loader');\n\t\t}\n\n\t\tif (this.variant === 'standard') {\n\t\t\tif (this.hasAttribute('label')) native.appendChild(label);\n\t\t} else {\n\t\t\twrapper.appendChild(label);\n\t\t}\n\n\t\tinputWrapper.append(slotStart);\n\t\tinputWrapper.append(display);\n\t\tinputWrapper.append(input);\n\n\t\tclear.append(clearIcon);\n\n\t\tif (this.hasAttribute('multiple')) inputWrapper.append(chips);\n\n\t\tif (this.hasAttribute('clearable')) inputWrapper.append(clear);\n\n\t\tinputWrapper.appendChild(slotEnd);\n\t\tinputWrapper.appendChild(arrow);\n\n\t\tlist.appendChild(slot);\n\n\t\tif (this.hasAttribute('find')) {\n\t\t\tlet find = document.createElement('wje-input');\n\t\t\tfind.setAttribute('variant', 'standard');\n\t\t\tfind.setAttribute('placeholder', 'Hľadať');\n\t\t\tfind.setAttribute('part', 'find');\n\t\t\tfind.clearable = true;\n\t\t\tfind.classList.add('find');\n\n\t\t\toptionsWrapper.appendChild(find);\n\n\t\t\tthis.findEl = find;\n\t\t}\n\n\t\tlet slotFooter = document.createElement('slot');\n\t\tslotFooter.setAttribute('name', 'footer');\n\n\t\t// APPEND\n\t\toptionsWrapper.append(list);\n\t\toptionsWrapper.append(slotFooter);\n\n\t\twrapper.append(inputWrapper);\n\n\t\tpopup.append(wrapper);\n\t\tpopup.append(optionsWrapper);\n\n\t\tif (this.trigger === 'click') popup.setAttribute('manual', '');\n\n\t\tthis.append(error);\n\n\t\tnative.append(popup);\n\t\tnative.append(errorSlot);\n\n\t\tfragment.appendChild(native);\n\n\t\tthis.native = native;\n\t\tthis.popup = popup;\n\t\tthis.labelElement = label;\n\t\tthis.slotStart = slotStart;\n\t\tthis.slotEnd = slotEnd;\n\t\tthis.input = input;\n\t\tthis.displayInput = display;\n\t\tthis.chips = chips;\n\t\tthis.clear = clear;\n\t\tthis.list = list;\n\t\tthis.slotFooter = slotFooter;\n\n\t\treturn fragment;\n\t}\n\n\t/**\n\t * Executes post-render logic for the custom element.\n\t * This includes validation, event listener registration, managing custom attributes, and\n\t * handling options initialization for the component.\n\t * @returns {void} This method does not return any value.\n\t */\n\tafterDraw() {\n\t\tdocument.addEventListener('mousedown', this.#onMenuItemClickCapture, true);\n\n\t\tthis.validate();\n\n\t\tif (this.hasAttribute('invalid')) {\n\t\t\tthis.showInvalidMessage();\n\t\t}\n\n\t\tthis.getAllOptions()?.forEach((option) => {\n\t\t\tthis.optionCheckSlot(option);\n\t\t});\n\n\t\tthis.selectedOptions = this.#getSelectedOptions();\n\t\tthis.selectOptions(this.value, true);\n\n\t\tif (this.lazy) {\n\t\t\tevent.addListener(this.popup, 'wje-popup:show', null, (e) => {\n\t\t\t\tif (this._wasOppened) return;\n\t\t\t\tthis._wasOppened = true;\n\n\t\t\t\tconst optionsElement = this.querySelector('wje-options');\n\t\t\t\toptionsElement.setAttribute('lazy', '');\n\t\t\t\toptionsElement.setAttribute('attached', '');\n\t\t\t});\n\t\t}\n\n\t\tevent.addListener(this.popup, 'wje-popup:aftershow', null, () => {\n\t\t\tconst assignedElements = this.slotFooter.assignedElements();\n\n\t\t\tif (assignedElements.length > 0) {\n\t\t\t\tconst el = assignedElements[0];\n\t\t\t\tconst rect = el.getBoundingClientRect();\n\t\t\t\tlet totalHeight = 0;\n\n\t\t\t\tif(this.hasAttribute('find')) {\n\t\t\t\t\tlet style = getComputedStyle(this.findEl);\n\n\t\t\t\t\tlet height = this.findEl.offsetHeight;\n\t\t\t\t\tlet marginTop = parseFloat(style.marginTop);\n\t\t\t\t\tlet marginBottom = parseFloat(style.marginBottom);\n\n\t\t\t\t\ttotalHeight = height + marginTop + marginBottom;\n\t\t\t\t}\n\n\t\t\t\tlet subtractHeight = rect.height + totalHeight;\n\n\t\t\t\tthis.list.style.height = `calc(100% - ${subtractHeight}px)`;\n\t\t\t}\n\t\t});\n\n\t\tthis.#htmlOptions = Array.from(this.querySelectorAll(':scope > wje-option')).map((option) => {\n\t\t\treturn {\n\t\t\t\tvalue: option.value,\n\t\t\t\ttext: option.textContent.trim(),\n\t\t\t};\n\t\t})\n\n\t\tthis.input.addEventListener('focus', (e) => {\n\t\t\tthis.labelElement?.classList.add('fade');\n\t\t\tthis.native.classList.add('focused');\n\t\t});\n\n\t\tthis.input.addEventListener('blur', (e) => {\n\t\t\tthis.native.classList.remove('focused');\n\t\t\tif (!e.target.value) this.labelElement?.classList.remove('fade');\n\t\t});\n\n\t\tthis.input.addEventListener('input', (e) => {\n\t\t\tthis.propagateValidation();\n\t\t});\n\n\t\tthis.addEventListener('wje-option:change', this.optionChange);\n\n\t\tthis.addEventListener('invalid', (e) => {\n\t\t\tthis.invalid = true;\n\t\t\tthis.pristine = false;\n\n\t\t\tthis.showInvalidMessage();\n\n\t\t\tif (this.customErrorDisplay) {\n\t\t\t\te.preventDefault();\n\t\t\t}\n\t\t});\n\n\t\tthis.clear?.addEventListener('wje-button:click', (e) => {\n\t\t\te.preventDefault();\n\t\t\te.stopPropagation();\n\t\t\tthis.clearSelections();\n\t\t});\n\n\t\tthis.list.addEventListener('wje-options:load', (e) => {\n\t\t\tthis.selectedOptions.forEach((option) => {\n\t\t\t\tthis.getAllOptions().forEach((el) => {\n\t\t\t\t\tif (el.value === option.value) {\n\t\t\t\t\t\tel.selected = true;\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t});\n\n\t\t\t// Ensure values from the value attribute are (re)selected after lazy-loaded pages\n\t\t\tconst attrValue = this.getAttribute('value')?.split(' ') || [];\n\n\t\t\tattrValue.forEach(val => {\n\t\t\t\tconst existingOption = Array.from(this.getAllOptions()).find(el => el.value === val);\n\t\t\t\tif (existingOption) {\n\t\t\t\t\texistingOption.selected = true;\n\t\t\t\t}\n\t\t\t});\n\n\t\t\tthis.selectedOptions = this.#getSelectedOptions();\n\t\t\tthis.selections(true);\n\n\t\t\tthis.list.scrollTo(0, 0);\n\t\t\tevent.dispatchCustomEvent(this.popup, 'wje-popup:content-ready'); // Notify that the content is ready\n\t\t});\n\n\t\t// skontrolujeme ci ma select atribut find\n\t\tif (this.hasAttribute('find') && this.findEl instanceof HTMLElement) {\n\t\t\tevent.addListener(this.findEl, 'keyup', '', this.#applySearchFilter);\n\t\t\tevent.addListener(this.findEl, 'wje-input:clear', '', this.#applySearchFilter);\n\t\t}\n\t}\n\n\t/**\n\t * Handles the change event for an option element within a select-like component.\n\t * This method processes user interactions with options and updates the state of the component,\n\t * including selection management, validation, and UI updates. Behavior differs based on\n\t * whether the component supports multiple selections.\n\t * Key functionality:\n\t * - Prevents the default behavior, event propagation, and immediate propagation of the event.\n\t * - Retrieves all options within the component.\n\t * - If the component doesn't support multiple selection:\n\t * - Marks only the clicked option as selected and deselects others.\n\t * - Hides the option popup.\n\t * - If the component supports multiple selection:\n\t * - Processes the clicked option without deselecting others.\n\t * - Updates the selected options and triggers validation.\n\t * - Marks the form state as non-pristine.\n\t * - Propagates the validation state to other relevant parts of the component or system.\n\t * @param {Event} e The event object representing the option change interaction.\n\t */\n\toptionChange = (e) => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\te.stopImmediatePropagation();\n\n\t\tlet allOptions = this.getAllOptions();\n\n\t\tif (!this.hasAttribute('multiple')) {\n\t\t\tallOptions.forEach((option) => {\n\t\t\t\tif (option.value === e.target.value) {\n\t\t\t\t\tthis.processClickedOption(option);\n\t\t\t\t} else {\n\t\t\t\t\toption.selected = false;\n\t\t\t\t}\n\t\t\t});\n\t\t\tthis.popup.hide(false);\n\t\t} else {\n\t\t\tthis.processClickedOption(e.target, true);\n\t\t}\n\n\t\tthis.selections();\n\n\t\tthis.validate(this.selectedOptions);\n\n\t\tthis.pristine = false;\n\t\tthis.propagateValidation();\n\t}\n\n\t/**\n\t * Handles the logic for processing the selection state of a clicked option element.\n\t * @function processClickedOption\n\t * @param {Element} option The option element that is clicked.\n\t * @param {boolean} [multiple] A Boolean indicating whether multiple options can be selected. Defaults to false.\n\t * Changes the selected state of the passed option and updates the selected options list.\n\t * Checks if the option already has a \"selected\" attribute, toggles its state,\n\t * and updates the internal selected options.\n\t */\n\tprocessClickedOption = (option, multiple = false) => {\n\t\tconst isSelected = option.hasAttribute('selected');\n\t\toption.selected = !isSelected;\n\n\t\tthis.selectedOptions = this.#getSelectedOptions();\n\t}\n\n\t/**\n\t * Returns all the options as HTML.\n\t * @returns {NodeList} The options as HTML.\n\t */\n\tgetAllOptions() {\n\t\treturn this.querySelectorAll('wje-option');\n\t}\n\n\t/**\n\t * Handles changes in the selection for a component, updating internal values, input fields,\n\t * and visual presentation (like chips or slots) as per the given selection options.\n\t * @param {Array|null} options The collection of selected option elements. If null, no options are selected.\n\t * @param {number} length The total number of selected options.\n\t * @returns {void}\n\t */\n\tselectionChanged(options = null, length = 0) {\n\t\tif (this.hasAttribute('multiple')) {\n\t\t\tthis.value = options.map((el) => el.value).reverse();\n\t\t\tthis.input.value = this.value.map(a => a).join(\" \").trim();\n\n\t\t\tif (this.placeholder && length === 0) {\n\t\t\t\tthis.chips.innerHTML = this.placeholder;\n\t\t\t} else {\n\t\t\t\tif (options !== null) Array.from(options).slice(0, +this.maxOptions).forEach(option => this.chips.appendChild(this.getChip(option)));\n\t\t\t\tif (this.counterEl instanceof HTMLElement || !this.maxOptions || length > +this.maxOptions) {\n\t\t\t\t\tthis.counter();\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\tconst option = options?.at(0);\n\n\t\t\tthis.value = options?.map((el) => el.value)?.at(0) || '';\n\t\t\tthis.input.value = this.value[0] || '';\n\t\t\tthis.displayInput.value = options[0]?.textContent?.trim() || '';\n\n\t\t\tthis.slotStart.innerHTML = '';\n\t\t\tthis.slotEnd.innerHTML = '';\n\n\t\t\tif (option && option instanceof HTMLElement) {\n\t\t\t\tlet optionSlotStart = option?.querySelector('wje-option > [slot=start]');\n\t\t\t\tif (optionSlotStart) {\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tthis.slotStart.append(optionSlotStart.cloneNode(true));\n\t\t\t\t\t},0)\n\t\t\t\t}\n\n\t\t\t\tlet optionSlotEnd = option?.querySelector('wje-option > [slot=end]');\n\n\t\t\t\tif (optionSlotEnd && optionSlotEnd instanceof HTMLElement && optionSlotEnd.tagName !== 'WJE-DROPDOWN' && optionSlotEnd.tagName !== 'WJE-BUTTON') {\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tthis.slotEnd.append(optionSlotEnd.cloneNode(true));\n\t\t\t\t\t},0)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Handles the logic for updating selections based on the current selected options,\n\t * updating chips content, and dispatching change events if necessary.\n\t * @param {boolean} [silence] If true, suppresses the dispatch of a custom change event.\n\t * @returns {void} This method does not return a value.\n\t */\n\tselections(silence = false) {\n\t\tif (this.selectedOptions.length >= +this.maxOptions) {\n\t\t\tthis.counterEl = null;\n\t\t}\n\n\t\tif (this.chips) {\n\t\t\tthis.chips.innerHTML = '';\n\t\t}\n\n\t\tif (this.selectedOptions.length > 0) {\n\t\t\tthis.selectionChanged(this.selectedOptions, this.selectedOptions.length);\n\t\t} else {\n\t\t\tthis.selectionChanged(this.selectedOptions);\n\t\t}\n\n\t\tif (silence) return;\n\t\tevent.dispatchCustomEvent(this, 'wje-select:change');\n\t}\n\n\t/**\n\t * Updates the counter element to reflect the current state of selected values relative to the maximum allowed options.\n\t * If the maximum options are selected, the counter element is removed. If it does not already exist and needs to be displayed, it is created.\n\t * @returns {void} Does not return a value.\n\t */\n\tcounter() {\n\t\t// zmazanie counter (span)\n\t\tif (this.counterEl && this.value.length === +this.maxOptions) {\n\t\t\tthis.counterEl.remove();\n\t\t\tthis.counterEl = null;\n\t\t\treturn;\n\t\t}\n\n\t\t// ak counter nie je, tak ho vytvorime\n\t\tif (!this.counterEl) {\n\t\t\tthis.counterEl = document.createElement('span');\n\t\t\tthis.counterEl.classList.add('counter');\n\n\t\t\tthis.chips.appendChild(this.counterEl);\n\t\t}\n\n\t\t// nastavime hodnotu counter\n\t\tthis.counterEl.innerText = `+${this.value.length - +this.maxOptions}`;\n\t}\n\n\t/**\n\t * Creates and returns a chip element with specified properties and a label.\n\t * @param {object} option The configuration object for the chip. Typically includes properties such as value and textContent to set up the chip's label and data.\n\t * @returns {HTMLElement} The newly created chip element with a label and default properties.\n\t */\n\tgetChip(option) {\n\t\tlet chip = document.createElement('wje-chip');\n\t\tchip.size = 'small';\n\t\tchip.removable = true;\n\t\tchip.round = true;\n\t\tchip.addEventListener('wje:chip-remove', this.removeChip);\n\t\tchip.option = option;\n\n\t\tlet label = document.createElement('wje-label');\n\t\tlabel.innerText = this.#htmlSelectedItem(option.value) // option.textContent.trim();\n\n\t\tchip.appendChild(label);\n\n\t\treturn chip;\n\t}\n\n\t/**\n\t * Handles the removal of a chip element from the DOM and updates the related state.\n\t * @param {Event} e The event object triggered by the chip removal action.\n\t * The target of the event is expected to be the chip element itself.\n\t */\n\tremoveChip = (e) => {\n\t\te.target.parentNode.removeChild(e.target);\n\t\tthis.processClickedOption(e.target.option, true);\n\t\tthis.selections();\n\t};\n\n\t/**\n\t * Generates an HTML option element based on the provided item and mapping.\n\t * @param {object} item The item to generate the option for.\n\t * @param {object} [map] The mapping object that specifies the properties of the item to use for the option's value and text.\n\t * @param {string} [map.value] The property of the item to use for the option's value.\n\t * @param {string} [map.text] The property of the item to use for the option's text.\n\t * @returns {HTMLElement} The generated HTML option element.\n\t */\n\thtmlOption(item, map = { value: 'value', text: 'text' }) {\n\t\tlet option = document.createElement('wje-option');\n\n\t\tif (item[map.value] === null) {\n\t\t\tconsole.warn(`The item ${JSON.stringify(item)} does not have the property ${map.value}`);\n\t\t}\n\n\t\tif (item[map.text] === null) {\n\t\t\tconsole.warn(`The item ${JSON.stringify(item)} does not have the property ${map.text}`);\n\t\t}\n\n\t\toption.setAttribute('value', item[map.value] ?? '');\n\t\toption.innerText = item[map.text] ?? '';\n\n\t\tthis.#addedOptions.push({ [map.value]: item[map.value], [map.text]: item[map.text] });\n\t\treturn option;\n\t}\n\n\t/**\n\t * Returns the provided item.\n\t * @param {any} item The item to be returned.\n\t * @returns {any} The same item that was passed as input.\n\t */\n\thtmlSelectedItem(item) {\n\t\treturn item;\n\t}\n\n\t/**\n\t * Adds a new option to the component.\n\t * @param {object} optionData The data used to create the new option.\n\t * @param {boolean} [silent] Whether the addition should trigger events or not.\n\t * @param {object} [map] Mapping of keys to identify value and text in the optionData.\n\t * @param {string} [map.value] The key in optionData that represents the value of the option.\n\t * @param {string} [map.text] The key in optionData that represents the text of the option.\n\t * @returns {void}\n\t */\n\taddOption(optionData, silent = false, map = { value: 'value', text: 'text' }) {\n\t\tif (!optionData) return;\n\n\t\tconst optionsElement = this.querySelector('wje-options');\n\t\tif (optionsElement) {\n\t\t\toptionsElement.addOption(optionData, silent, map);\n\t\t\treturn;\n\t\t}\n\t\tlet option = this.htmlOption(optionData, map);\n\t\tthis.appendChild(option);\n\t}\n\n\t/**\n\t * Adds one or more options to a collection. If the input is an array, it adds each option within the array.\n\t * Otherwise, it adds a single option.\n\t * @param {Array | object} optionsData The data representing the options to be added. It can be a single object or an array of objects.\n\t * @param {boolean} [silent] Optional flag to determine if events or notifications should be suppressed while adding options.\n\t * @param {object} [map] An optional mapping object specifying how to map data properties to value and text for the options.\n\t * @param {string} [map.value] The property in the optionsData that represents the value of the option.\n\t * @param {string} [map.text] The property in the optionsData that represents the text of the option.\n\t * @returns {void}\n\t */\n\taddOptions(optionsData, silent = false, map = { value: 'value', text: 'text' }) {\n\t\tif (!Array.isArray(optionsData)) {\n\t\t\tthis.addOption(optionsData, silent, map);\n\t\t} else {\n\t\t\toptionsData.forEach((item) => {\n\t\t\t\tthis.addOption(item, silent, map);\n\t\t\t});\n\t\t}\n\t}\n\n\t/**\n\t * Selects an option from the available options within the component.\n\t * @param {string} value The value of the option to be selected.\n\t * @param {boolean} [silent] Determines whether the selection should trigger notification or updates. Defaults to false.\n\t * @returns {void} Does not return a value.\n\t */\n\tselectOption(value, silent = false) {\n\t\tif (!value) return;\n\n\t\tlet option = this.querySelector(`wje-option[value=\"${value}\"]`);\n\n\t\tif (option) {\n\t\t\tthis.processClickedOption(option, this.hasAttribute('multiple'));\n\t\t}\n\n\t\tif (this.drawingStatus > this.drawingStatuses.START) this.selections(silent);\n\t}\n\n\t/**\n\t * Selects multiple options based on the provided values. If a single value is provided, it selects that option.\n\t * If an array of values is provided, it iterates through the array and selects each option.\n\t * @param {any|any[]} values A single value or an array of values to be selected.\n\t * @param {boolean} [silent] Determines whether the selection action should occur silently without triggering other side effects or events.\n\t * @returns {void} This method does not return a value.\n\t */\n\tselectOptions(values, silent = false) {\n\t\tif (!Array.isArray(values)) {\n\t\t\tthis.selectOption(values, silent);\n\t\t} else {\n\t\t\tvalues.forEach((value) => {\n\t\t\t\tthis.selectOption(value, silent);\n\t\t\t});\n\t\t}\n\t}\n\n\t/**\n\t * Clones and appends an icon with the \"check\" slot to the specified option element.\n\t * @param {HTMLElement} option The target HTML element to which the cloned \"check\" icon will be appended.\n\t * @returns {void} This method does not return a value, but it modifies the DOM by appending a cloned \"check\" icon to the provided option element.\n\t */\n\toptionCheckSlot(option) {\n\t\tlet icon = this.querySelector('template')?.content.querySelector(`[slot=\"check\"]`);\n\t\tif (!icon) {\n\t\t\tconsole.warn(`Icon with slot \"check\" was not found.`);\n\t\t\treturn;\n\t\t}\n\n\t\tlet iconClone = icon.cloneNode(true);\n\t\toption.append(iconClone);\n\t}\n\n\t/**\n\t * Clears all selected options and resets selections.\n\t * The method ensures that all options are deselected, updates the internal state, validates the selections,\n\t * propagates the validation status, and indicates invalid state if necessary.\n\t * @returns {void} No value is returned by this method.\n\t */\n\tclearSelections() {\n\t\tthis.selectedOptions = [];\n\n\t\tthis.getAllOptions().forEach((option) => {\n\t\t\toption.selected = false;\n\t\t});\n\t\tthis.selections();\n\n\t\tthis.validate();\n\t\tthis.propagateValidation();\n\n\t\tif (this.hasAttribute('invalid')) {\n\t\t\tthis.showInvalidMessage();\n\t\t}\n\t}\n\n\t/**\n\t * Processes the given item and retrieves the corresponding value from the selected options.\n\t * @param {string} item The key to search for in the selected options.\n\t * @returns {string} The text content associated with the selected item, or an empty string if not found.\n\t */\n\t#htmlSelectedItem(item) {\n\t\tconst keyValue = \"value\"\n\t\tconst textValue = \"textContent\";\n\n\t\tconst value = this.selectedOptions.find((option) => option[keyValue] === item)?.[textValue] ?? \"\";\n\n\t\treturn this.htmlSelectedItem(value);\n\t}\n\n\t/**\n\t * Retrieves the list of selected options within the component.\n\t * @returns {Array<Element>} An array of elements representing the options that are currently selected.\n\t */\n\t#getSelectedOptions() {\n\t\treturn Array.from(this.querySelectorAll('wje-option[selected]'));\n\t}\n\n\t/**\n\t * Filters option elements based on the search input value.\n\t * This function applies a search filter to a list of options. If a `wj-options` element exists and has\n\t * the `lazy` attribute, the search value is passed to the `wj-options` element, enabling infinite scroll\n\t * functionality to handle the filtering. If the `lazy` attribute is not present, it performs a local\n\t * search to show or hide options depending on whether their text content matches the search input.\n\t * @param {Event} e The input event containing the search input value from the user.\n\t */\n\t#applySearchFilter = (e) => {\n\t\t// contains wj-options element with options\n\t\tconst optionsElement = this.querySelector('wje-options');\n\n\t\tif (optionsElement && optionsElement.hasAttribute('lazy')) {\n\t\t\t// pass search value to wj-options element and infinite scroll will handle the rest\n\t\t\toptionsElement.setAttribute('search', e.target.value);\n\t\t} else {\n\t\t\tlet value = e.target.value.trim().toLowerCase();\n\n\t\t\tthis.getAllOptions().forEach((option) => {\n\t\t\t\tif (option.textContent.trim().toLowerCase().includes(value)) {\n\t\t\t\t\toption.style.display = 'block';\n\t\t\t\t} else {\n\t\t\t\t\toption.style.display = 'none';\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t}\n\n\tdisconnectedCallback() {\n\t\tdocument.removeEventListener('mousedown', this.#onMenuItemClickCapture, true);\n\t}\n}","import { Select } from \"./select.element.js\";\n\nexport default Select;\n\nSelect.define('wje-select', Select);\n"],"names":["_a"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAaO,MAAM,eAAe,sBAAsB;AAAA,EACjD,cAAc;AACb,UAAO;AAFF;AA4EN,sCAAgB,CAAE;AAElB,qCAAe,CAAE;AAQjB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gDAA0B,CAAC,MAAM;AAChC,YAAM;AAAA;AAAA,QAAoC,EAAE;AAAA;AAC5C,UAAI,CAAC,UAAU,CAAC,OAAO,QAAS;AAGhC,YAAM,WAAW,OAAO,QAAQ,eAAe;AAC/C,UAAI,CAAC,SAAU;AAEf,YAAM,WAAW,OAAO,QAAQ,cAAc;AAC9C,UAAI,YAAY,OAAO,SAAS,SAAS,YAAY;AAEpD,iBAAS,KAAM;AAAA,MAClB;AAIE,QAAE,gBAAiB;AAAA,IACnB;AAgBD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wCAAe;AAAA,MACd,cAAc;AAAA,MACd,aAAa;AAAA,MACb,YAAY;AAAA,MACZ,aAAa;AAAA,MACb,YAAY;AAAA,MACZ,aAAa;AAAA,MACb,cAAc;AAAA,MACd,eAAe;AAAA,MACf,gBAAgB;AAAA,IAChB;AAsRD,qCAAY;AAkWZ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wCAAe,CAAC,MAAM;AACrB,QAAE,eAAgB;AAClB,QAAE,gBAAiB;AACnB,QAAE,yBAA0B;AAE5B,UAAI,aAAa,KAAK,cAAe;AAErC,UAAI,CAAC,KAAK,aAAa,UAAU,GAAG;AACnC,mBAAW,QAAQ,CAAC,WAAW;AAC9B,cAAI,OAAO,UAAU,EAAE,OAAO,OAAO;AACpC,iBAAK,qBAAqB,MAAM;AAAA,UACrC,OAAW;AACN,mBAAO,WAAW;AAAA,UACvB;AAAA,QACA,CAAI;AACD,aAAK,MAAM,KAAK,KAAK;AAAA,MACxB,OAAS;AACN,aAAK,qBAAqB,EAAE,QAAQ,IAAI;AAAA,MAC3C;AAEE,WAAK,WAAY;AAEjB,WAAK,SAAS,KAAK,eAAe;AAElC,WAAK,WAAW;AAChB,WAAK,oBAAqB;AAAA,IAC5B;AAWC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gDAAuB,CAAC,QAAQ,WAAW,UAAU;AACpD,YAAM,aAAa,OAAO,aAAa,UAAU;AACjD,aAAO,WAAW,CAAC;AAEnB,WAAK,kBAAkB,sBAAK,0CAAL;AAAA,IACzB;AAuIC;AAAA;AAAA;AAAA;AAAA;AAAA,sCAAa,CAAC,MAAM;AACnB,QAAE,OAAO,WAAW,YAAY,EAAE,MAAM;AACxC,WAAK,qBAAqB,EAAE,OAAO,QAAQ,IAAI;AAC/C,WAAK,WAAY;AAAA,IACjB;AAqLD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2CAAqB,CAAC,MAAM;AAE3B,YAAM,iBAAiB,KAAK,cAAc,aAAa;AAEvD,UAAI,kBAAkB,eAAe,aAAa,MAAM,GAAG;AAE1D,uBAAe,aAAa,UAAU,EAAE,OAAO,KAAK;AAAA,MACvD,OAAS;AACN,YAAI,QAAQ,EAAE,OAAO,MAAM,KAAM,EAAC,YAAa;AAE/C,aAAK,cAAa,EAAG,QAAQ,CAAC,WAAW;AACxC,cAAI,OAAO,YAAY,KAAI,EAAG,cAAc,SAAS,KAAK,GAAG;AAC5D,mBAAO,MAAM,UAAU;AAAA,UAC5B,OAAW;AACN,mBAAO,MAAM,UAAU;AAAA,UAC5B;AAAA,QACA,CAAI;AAAA,MACJ;AAAA,IACA;AA7mCE,SAAK,YAAY;AAQjB,SAAK,cAAc;AAMnB,SAAK,SAAS;AAMd,SAAK,QAAQ;AAMb,SAAK,eAAe;AAMpB,SAAK,YAAY;AAMjB,SAAK,UAAU;AAMf,SAAK,QAAQ;AAMb,SAAK,QAAQ;AAMb,SAAK,QAAQ;AAMb,SAAK,OAAO;AAEZ,SAAK,SAAS,CAAE;AAChB,SAAK,mBAAmB,CAAE;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgEC,IAAI,MAAM,OAAO;AAChB,UAAM,WAAW,IAAI,SAAU;AAE/B,QAAI,OAAO;AACV,UAAI,OAAO;AAEX,UAAI,CAAC,MAAM,QAAQ,IAAI,GAAG;AACzB,eAAO,KAAK,MAAM,GAAG;AAAA,MACzB;AACG,WAAK,QAAQ,OAAK;AACjB,iBAAS,OAAO,KAAK,MAAM,CAAC;AAAA,MAChC,CAAI;AACD,cAAQ;AAER,WAAK,SAAS;AAAA,IACjB,OAAS;AACN,eAAS,OAAO,KAAK,IAAI;AACzB,cAAQ;AACR,WAAK,SAAS,CAAE;AAAA,IACnB;AACE,SAAK,UAAU,aAAa,KAAK;AAAA,EACnC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,QAAQ;AACX,WAAO,KAAK;AAAA,EACd;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOC,IAAI,WAAW,OAAO;AACrB,QAAI,OAAO;AACV,WAAK,aAAa,eAAe,KAAK;AAAA,IACzC,OAAS;AACN,WAAK,gBAAgB,aAAa;AAAA,IACrC;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQC,IAAI,aAAa;AAChB,WAAO,CAAC,KAAK,aAAa,aAAa,KAAK;AAAA,EAC9C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQC,IAAI,aAAa,OAAO;AACvB,SAAK,aAAa,SAAS,KAAK;AAAA,EAClC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASC,IAAI,eAAe;AAClB,WAAO,KAAK,aAAa,OAAO,KAAK;AAAA,EACvC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,QAAQ,OAAO;AAClB,SAAK,aAAa,WAAW,KAAK;AAAA,EACpC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,UAAU;AACb,WAAO,KAAK,aAAa,SAAS,KAAK;AAAA,EACzC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOC,IAAI,SAAS,OAAO;AACnB,QAAI,OAAO;AACV,WAAK,aAAa,YAAY,EAAE;AAChC,WAAK,MAAM,aAAa,YAAY,EAAE;AACtC,WAAK,aAAa,aAAa,YAAY,EAAE;AAAA,IAChD,OAAS;AACN,WAAK,gBAAgB,UAAU;AAC/B,WAAK,MAAM,gBAAgB,UAAU;AACrC,WAAK,aAAa,gBAAgB,UAAU;AAAA,IAC/C;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,WAAW;AACd,WAAO,KAAK,aAAa,UAAU;AAAA,EACrC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUC,IAAI,SAAS,OAAO;AACnB,QAAI,OAAO;AACV,WAAK,aAAa,YAAY,EAAE;AAChC,WAAK,MAAM,aAAa,YAAY,EAAE;AACtC,WAAK,aAAa,aAAa,YAAY,EAAE;AAAA,IAChD,OAAS;AACN,WAAK,gBAAgB,UAAU;AAC/B,WAAK,MAAM,gBAAgB,UAAU;AACrC,WAAK,aAAa,gBAAgB,UAAU;AAAA,IAC/C;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,WAAW;AACd,WAAO,KAAK,aAAa,UAAU;AAAA,EACrC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQC,IAAI,UAAU,OAAO;AACpB,QAAI,OAAO;AACV,WAAK,aAAa,cAAc,KAAK;AAAA,IACxC,OAAS;AACN,WAAK,gBAAgB,YAAY;AAAA,IACpC;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOC,IAAI,YAAY;AACf,WAAO,KAAK,aAAa,YAAY,KAAK;AAAA,EAC5C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,OAAO,OAAO;AACjB,SAAK,aAAa,UAAU,KAAK;AAAA,EACnC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOC,IAAI,SAAS;AACZ,WAAO,KAAK,aAAa,QAAQ,KAAK;AAAA,EACxC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,gBAAgB,OAAO;AAC1B,SAAK,mBAAmB;AAAA,EAC1B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,kBAAkB;AACrB,WAAO,KAAK,oBAAoB,CAAE;AAAA,EACpC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,KAAK,OAAO;AACf,QAAI,OAAO;AACV,WAAK,aAAa,QAAQ,EAAE;AAAA,IAC/B,OAAS;AACN,WAAK,gBAAgB,MAAM;AAAA,IAC9B;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,OAAO;AACV,WAAO,KAAK,aAAa,MAAM;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,OAAO,OAAO;AACjB,QAAI,OAAO;AACV,WAAK,aAAa,WAAW,EAAE;AAAA,IAClC,OAAS;AACN,WAAK,gBAAgB,SAAS;AAAA,IACjC;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,SAAS;AACZ,WAAO,KAAK,aAAa,SAAS;AAAA,EACpC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,IAAI,qBAAqB;AACxB,WAAO,KAAK,aAAa,sBAAsB;AAAA,EACjD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASC,IAAI,UAAU;AACb,QAAI,KAAK,cAAc,aAAa,GAAG;AACtC,YAAM,aAAa,CAAC,GAAG,KAAK,cAAc,aAAa,EAAE,eAAe,GAAG,mBAAK,gBAAe,GAAG,mBAAK,aAAY;AAEnH,aAAO;AAAA,IACV,OAAS;AACN,YAAM,aAAa,CAAC,GAAG,mBAAK,gBAAe,GAAG,mBAAK,aAAY;AAE/D,aAAO,MAAM;AAAA,QACZ,IAAI,IAAI,WAAW,QAAO,EAAG,IAAI,SAAO,CAAC,IAAI,OAAO,GAAG,CAAC,CAAC,EAAE,OAAM;AAAA,MACjE,EAAC,QAAS;AAAA,IACd;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASC,WAAW,gBAAgB;AAC1B,WAAO;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOC,WAAW,qBAAqB;AAC/B,WAAO,CAAC,UAAU,SAAS,YAAY,YAAY,YAAY,SAAS,eAAe,cAAc,eAAe,WAAW,WAAW;AAAA,EAC5I;AAAA;AAAA;AAAA;AAAA,EAKC,kBAAkB;AACjB,SAAK,eAAe;AAAA,EACtB;AAAA,EAEC,aAAa;AACZ,QAAG,KAAK,aAAa,OAAO,GAAG;AAC9B,WAAK,QAAQ,KAAK,aAAa,OAAO;AAAA,IACzC;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMC,OAAO;AACN,QAAI,WAAW,SAAS,uBAAwB;AAEhD,SAAK,UAAU,IAAI,iBAAiB,KAAK,YAAY,SAAS,KAAK,YAAY,WAAW;AAG1F,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,UAAU,IAAI,iBAAiB,KAAK,WAAW,SAAS;AAG/D,QAAI,UAAU,SAAS,cAAc,KAAK;AAC1C,YAAQ,UAAU,IAAI,SAAS;AAC/B,YAAQ,aAAa,QAAQ,QAAQ;AAGrC,QAAI,QAAQ,SAAS,cAAc,WAAW;AAC9C,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,YAAY,KAAK,SAAS;AAGhC,QAAI,eAAe,SAAS,cAAc,KAAK;AAC/C,iBAAa,aAAa,QAAQ,eAAe;AACjD,iBAAa,UAAU,IAAI,eAAe;AAE1C,QAAI,YAAY,SAAS,cAAc,KAAK;AAC5C,cAAU,UAAU,IAAI,YAAY;AAEpC,QAAI,QAAQ,SAAS,cAAc,OAAO;AAC1C,UAAM,aAAa,QAAQ,MAAM;AACjC,UAAM,QAAQ,KAAK,MAAM,KAAK,GAAG,EAAE,KAAM;AACzC,UAAM,UAAU,IAAI,cAAc;AAElC,QAAI,UAAU,SAAS,cAAc,OAAO;AAC5C,YAAQ,aAAa,QAAQ,MAAM;AACnC,YAAQ,aAAa,QAAQ,OAAO;AACpC,YAAQ,aAAa,gBAAgB,KAAK;AAC1C,YAAQ,aAAa,YAAY,EAAE;AACnC,YAAQ,aAAa,eAAe,KAAK,eAAe,EAAE;AAE1D,QAAI,KAAK,UAAU;AAClB,YAAM,aAAa,YAAY,EAAE;AACjC,cAAQ,aAAa,YAAY,EAAE;AAAA,IACtC;AAEE,QAAI,UAAU,SAAS,cAAc,KAAK;AAC1C,YAAQ,UAAU,IAAI,UAAU;AAEhC,QAAI,QAAQ,SAAS,cAAc,UAAU;AAC7C,UAAM,aAAa,QAAQ,cAAc;AACzC,UAAM,aAAa,QAAQ,OAAO;AAElC,QAAI,QAAQ,SAAS,cAAc,KAAK;AACxC,UAAM,UAAU,IAAI,OAAO;AAC3B,UAAM,YAAY,KAAK,eAAe;AAGtC,QAAI,iBAAiB,SAAS,cAAc,KAAK;AACjD,mBAAe,aAAa,QAAQ,iBAAiB;AACrD,mBAAe,UAAU,IAAI,iBAAiB;AAC9C,mBAAe,MAAM,YAAY,UAAU,KAAK,SAAS;AAEzD,QAAI,OAAO,SAAS,cAAc,KAAK;AACvC,SAAK,UAAU,IAAI,MAAM;AAEzB,QAAI,OAAO,SAAS,cAAc,MAAM;AAExC,QAAI,QAAQ,SAAS,cAAc,YAAY;AAC/C,UAAM,aAAa,QAAQ,MAAM;AACjC,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,aAAa,oBAAoB,EAAE;AAEzC,QAAI,YAAY,SAAS,cAAc,UAAU;AACjD,cAAU,aAAa,QAAQ,GAAG;AAElC,QAAI,QAAQ,SAAS,cAAc,KAAK;AACxC,UAAM,aAAa,QAAQ,OAAO;AAElC,QAAI,YAAY,SAAS,cAAc,MAAM;AAC7C,cAAU,aAAa,QAAQ,OAAO;AAGtC,QAAI,QAAQ,SAAS,cAAc,WAAW;AAC9C,UAAM,aAAa,aAAa,cAAc;AAC9C,QAAI,CAAC,KAAK;AACT,YAAM,aAAa,QAAQ,EAAE;AAC9B,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,aAAa,UAAU,KAAK,MAAM;AAExC,QAAG,KAAK,QAAQ,KAAK,cAAc,aAAa,GAAG;AAClD,YAAM,aAAa,UAAU,EAAE;AAAA,IAClC;AAEE,QAAI,KAAK,YAAY,KAAK,UAAU;AACnC,YAAM,aAAa,YAAY,EAAE;AAAA,IACpC,OAAS;AACN,YAAM,gBAAgB,QAAQ;AAAA,IACjC;AAEE,QAAI,KAAK,YAAY,YAAY;AAChC,UAAI,KAAK,aAAa,OAAO,EAAG,QAAO,YAAY,KAAK;AAAA,IAC3D,OAAS;AACN,cAAQ,YAAY,KAAK;AAAA,IAC5B;AAEE,iBAAa,OAAO,SAAS;AAC7B,iBAAa,OAAO,OAAO;AAC3B,iBAAa,OAAO,KAAK;AAEzB,UAAM,OAAO,SAAS;AAEtB,QAAI,KAAK,aAAa,UAAU,EAAG,cAAa,OAAO,KAAK;AAE5D,QAAI,KAAK,aAAa,WAAW,EAAG,cAAa,OAAO,KAAK;AAE7D,iBAAa,YAAY,OAAO;AAChC,iBAAa,YAAY,KAAK;AAE9B,SAAK,YAAY,IAAI;AAErB,QAAI,KAAK,aAAa,MAAM,GAAG;AAC9B,UAAI,OAAO,SAAS,cAAc,WAAW;AAC7C,WAAK,aAAa,WAAW,UAAU;AACvC,WAAK,aAAa,eAAe,QAAQ;AACzC,WAAK,aAAa,QAAQ,MAAM;AAChC,WAAK,YAAY;AACjB,WAAK,UAAU,IAAI,MAAM;AAEzB,qBAAe,YAAY,IAAI;AAE/B,WAAK,SAAS;AAAA,IACjB;AAEE,QAAI,aAAa,SAAS,cAAc,MAAM;AAC9C,eAAW,aAAa,QAAQ,QAAQ;AAGxC,mBAAe,OAAO,IAAI;AAC1B,mBAAe,OAAO,UAAU;AAEhC,YAAQ,OAAO,YAAY;AAE3B,UAAM,OAAO,OAAO;AACpB,UAAM,OAAO,cAAc;AAE3B,QAAI,KAAK,YAAY,QAAS,OAAM,aAAa,UAAU,EAAE;AAE7D,SAAK,OAAO,KAAK;AAEjB,WAAO,OAAO,KAAK;AACnB,WAAO,OAAO,SAAS;AAEvB,aAAS,YAAY,MAAM;AAE3B,SAAK,SAAS;AACd,SAAK,QAAQ;AACb,SAAK,eAAe;AACpB,SAAK,YAAY;AACjB,SAAK,UAAU;AACf,SAAK,QAAQ;AACb,SAAK,eAAe;AACpB,SAAK,QAAQ;AACb,SAAK,QAAQ;AACb,SAAK,OAAO;AACZ,SAAK,aAAa;AAElB,WAAO;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQC,YAAY;;AACX,aAAS,iBAAiB,aAAa,mBAAK,0BAAyB,IAAI;AAEzE,SAAK,SAAU;AAEf,QAAI,KAAK,aAAa,SAAS,GAAG;AACjC,WAAK,mBAAoB;AAAA,IAC5B;AAEE,eAAK,cAAa,MAAlB,mBAAsB,QAAQ,CAAC,WAAW;AACzC,WAAK,gBAAgB,MAAM;AAAA,IAC9B;AAEE,SAAK,kBAAkB,sBAAK,0CAAL;AACvB,SAAK,cAAc,KAAK,OAAO,IAAI;AAEnC,QAAI,KAAK,MAAM;AACd,YAAM,YAAY,KAAK,OAAO,kBAAkB,MAAM,CAAC,MAAM;AAC5D,YAAI,KAAK,YAAa;AACtB,aAAK,cAAc;AAEnB,cAAM,iBAAiB,KAAK,cAAc,aAAa;AACvD,uBAAe,aAAa,QAAQ,EAAE;AACtC,uBAAe,aAAa,YAAY,EAAE;AAAA,MAC9C,CAAI;AAAA,IACJ;AAEE,UAAM,YAAY,KAAK,OAAO,uBAAuB,MAAM,MAAM;AAChE,YAAM,mBAAmB,KAAK,WAAW,iBAAkB;AAE3D,UAAI,iBAAiB,SAAS,GAAG;AAChC,cAAM,KAAK,iBAAiB,CAAC;AAC7B,cAAM,OAAO,GAAG,sBAAuB;AACvC,YAAI,cAAc;AAElB,YAAG,KAAK,aAAa,MAAM,GAAG;AAC7B,cAAI,QAAQ,iBAAiB,KAAK,MAAM;AAExC,cAAI,SAAS,KAAK,OAAO;AACzB,cAAI,YAAY,WAAW,MAAM,SAAS;AAC1C,cAAI,eAAe,WAAW,MAAM,YAAY;AAEhD,wBAAc,SAAS,YAAY;AAAA,QACxC;AAEI,YAAI,iBAAiB,KAAK,SAAS;AAEnC,aAAK,KAAK,MAAM,SAAS,eAAe,cAAc;AAAA,MAC1D;AAAA,IACA,CAAG;AAED,uBAAK,cAAe,MAAM,KAAK,KAAK,iBAAiB,qBAAqB,CAAC,EAAE,IAAI,CAAC,WAAW;AAC5F,aAAO;AAAA,QACN,OAAO,OAAO;AAAA,QACd,MAAM,OAAO,YAAY,KAAM;AAAA,MAC/B;AAAA,IACD,CAAA;AAED,SAAK,MAAM,iBAAiB,SAAS,CAAC,MAAM;;AAC3C,OAAAA,MAAA,KAAK,iBAAL,gBAAAA,IAAmB,UAAU,IAAI;AACjC,WAAK,OAAO,UAAU,IAAI,SAAS;AAAA,IACtC,CAAG;AAED,SAAK,MAAM,iBAAiB,QAAQ,CAAC,MAAM;;AAC1C,WAAK,OAAO,UAAU,OAAO,SAAS;AACtC,UAAI,CAAC,EAAE,OAAO,MAAO,EAAAA,MAAA,KAAK,iBAAL,gBAAAA,IAAmB,UAAU,OAAO;AAAA,IAC5D,CAAG;AAED,SAAK,MAAM,iBAAiB,SAAS,CAAC,MAAM;AAC3C,WAAK,oBAAqB;AAAA,IAC7B,CAAG;AAED,SAAK,iBAAiB,qBAAqB,KAAK,YAAY;AAE5D,SAAK,iBAAiB,WAAW,CAAC,MAAM;AACvC,WAAK,UAAU;AACf,WAAK,WAAW;AAEhB,WAAK,mBAAoB;AAEzB,UAAI,KAAK,oBAAoB;AAC5B,UAAE,eAAgB;AAAA,MACtB;AAAA,IACA,CAAG;AAED,eAAK,UAAL,mBAAY,iBAAiB,oBAAoB,CAAC,MAAM;AACvD,QAAE,eAAgB;AAClB,QAAE,gBAAiB;AACnB,WAAK,gBAAiB;AAAA,IACzB;AAEE,SAAK,KAAK,iBAAiB,oBAAoB,CAAC,MAAM;;AACrD,WAAK,gBAAgB,QAAQ,CAAC,WAAW;AACxC,aAAK,cAAa,EAAG,QAAQ,CAAC,OAAO;AACpC,cAAI,GAAG,UAAU,OAAO,OAAO;AAC9B,eAAG,WAAW;AAAA,UACpB;AAAA,QACA,CAAK;AAAA,MACL,CAAI;AAGD,YAAM,cAAYA,MAAA,KAAK,aAAa,OAAO,MAAzB,gBAAAA,IAA4B,MAAM,SAAQ,CAAE;AAE9D,gBAAU,QAAQ,SAAO;AACxB,cAAM,iBAAiB,MAAM,KAAK,KAAK,cAAa,CAAE,EAAE,KAAK,QAAM,GAAG,UAAU,GAAG;AACnF,YAAI,gBAAgB;AACnB,yBAAe,WAAW;AAAA,QAC/B;AAAA,MACA,CAAI;AAED,WAAK,kBAAkB,sBAAK,0CAAL;AACvB,WAAK,WAAW,IAAI;AAEpB,WAAK,KAAK,SAAS,GAAG,CAAC;AACvB,YAAM,oBAAoB,KAAK,OAAO,yBAAyB;AAAA,IAClE,CAAG;AAGD,QAAI,KAAK,aAAa,MAAM,KAAK,KAAK,kBAAkB,aAAa;AACpE,YAAM,YAAY,KAAK,QAAQ,SAAS,IAAI,mBAAK,mBAAkB;AACnE,YAAM,YAAY,KAAK,QAAQ,mBAAmB,IAAI,mBAAK,mBAAkB;AAAA,IAChF;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoEC,gBAAgB;AACf,WAAO,KAAK,iBAAiB,YAAY;AAAA,EAC3C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASC,iBAAiB,UAAU,MAAM,SAAS,GAAG;;AAC5C,QAAI,KAAK,aAAa,UAAU,GAAG;AAClC,WAAK,QAAQ,QAAQ,IAAI,CAAC,OAAO,GAAG,KAAK,EAAE,QAAS;AACpD,WAAK,MAAM,QAAQ,KAAK,MAAM,IAAI,OAAK,CAAC,EAAE,KAAK,GAAG,EAAE,KAAM;AAE1D,UAAI,KAAK,eAAe,WAAW,GAAG;AACrC,aAAK,MAAM,YAAY,KAAK;AAAA,MAChC,OAAU;AACN,YAAI,YAAY,KAAM,OAAM,KAAK,OAAO,EAAE,MAAM,GAAG,CAAC,KAAK,UAAU,EAAE,QAAQ,YAAU,KAAK,MAAM,YAAY,KAAK,QAAQ,MAAM,CAAC,CAAC;AACnI,YAAI,KAAK,qBAAqB,eAAe,CAAC,KAAK,cAAc,SAAS,CAAC,KAAK,YAAY;AAC3F,eAAK,QAAS;AAAA,QACnB;AAAA,MACA;AAAA,IACA,OAAS;AACN,YAAM,SAAS,mCAAS,GAAG;AAE3B,WAAK,UAAQ,wCAAS,IAAI,CAAC,OAAO,GAAG,WAAxB,mBAAgC,GAAG,OAAM;AACtD,WAAK,MAAM,QAAQ,KAAK,MAAM,CAAC,KAAK;AACpC,WAAK,aAAa,UAAQ,mBAAQ,CAAC,MAAT,mBAAY,gBAAZ,mBAAyB,WAAU;AAE7D,WAAK,UAAU,YAAY;AAC3B,WAAK,QAAQ,YAAY;AAEzB,UAAI,UAAU,kBAAkB,aAAa;AAC5C,YAAI,kBAAkB,iCAAQ,cAAc;AAC5C,YAAI,iBAAiB;AACpB,qBAAW,MAAM;AAChB,iBAAK,UAAU,OAAO,gBAAgB,UAAU,IAAI,CAAC;AAAA,UAC3D,GAAO,CAAC;AAAA,QACR;AAEI,YAAI,gBAAgB,iCAAQ,cAAc;AAE1C,YAAI,iBAAiB,yBAAyB,eAAe,cAAc,YAAY,kBAAkB,cAAc,YAAY,cAAc;AAChJ,qBAAW,MAAM;AAChB,iBAAK,QAAQ,OAAO,cAAc,UAAU,IAAI,CAAC;AAAA,UACvD,GAAO,CAAC;AAAA,QACR;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQC,WAAW,UAAU,OAAO;AAC3B,QAAI,KAAK,gBAAgB,UAAU,CAAC,KAAK,YAAY;AACpD,WAAK,YAAY;AAAA,IACpB;AAEE,QAAI,KAAK,OAAO;AACf,WAAK,MAAM,YAAY;AAAA,IAC1B;AAEE,QAAI,KAAK,gBAAgB,SAAS,GAAG;AACpC,WAAK,iBAAiB,KAAK,iBAAiB,KAAK,gBAAgB,MAAM;AAAA,IAC1E,OAAS;AACN,WAAK,iBAAiB,KAAK,eAAe;AAAA,IAC7C;AAEE,QAAI,QAAS;AACb,UAAM,oBAAoB,MAAM,mBAAmB;AAAA,EACrD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOC,UAAU;AAET,QAAI,KAAK,aAAa,KAAK,MAAM,WAAW,CAAC,KAAK,YAAY;AAC7D,WAAK,UAAU,OAAQ;AACvB,WAAK,YAAY;AACjB;AAAA,IACH;AAGE,QAAI,CAAC,KAAK,WAAW;AACpB,WAAK,YAAY,SAAS,cAAc,MAAM;AAC9C,WAAK,UAAU,UAAU,IAAI,SAAS;AAEtC,WAAK,MAAM,YAAY,KAAK,SAAS;AAAA,IACxC;AAGE,SAAK,UAAU,YAAY,IAAI,KAAK,MAAM,SAAS,CAAC,KAAK,UAAU;AAAA,EACrE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOC,QAAQ,QAAQ;AACf,QAAI,OAAO,SAAS,cAAc,UAAU;AAC5C,SAAK,OAAO;AACZ,SAAK,YAAY;AACjB,SAAK,QAAQ;AACb,SAAK,iBAAiB,mBAAmB,KAAK,UAAU;AACxD,SAAK,SAAS;AAEd,QAAI,QAAQ,SAAS,cAAc,WAAW;AAC9C,UAAM,YAAY,sBAAK,wCAAL,WAAuB,OAAO;AAEhD,SAAK,YAAY,KAAK;AAEtB,WAAO;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqBC,WAAW,MAAM,MAAM,EAAE,OAAO,SAAS,MAAM,UAAU;AACxD,QAAI,SAAS,SAAS,cAAc,YAAY;AAEhD,QAAI,KAAK,IAAI,KAAK,MAAM,MAAM;AAC7B,cAAQ,KAAK,YAAY,KAAK,UAAU,IAAI,CAAC,+BAA+B,IAAI,KAAK,EAAE;AAAA,IAC1F;AAEE,QAAI,KAAK,IAAI,IAAI,MAAM,MAAM;AAC5B,cAAQ,KAAK,YAAY,KAAK,UAAU,IAAI,CAAC,+BAA+B,IAAI,IAAI,EAAE;AAAA,IACzF;AAEE,WAAO,aAAa,SAAS,KAAK,IAAI,KAAK,KAAK,EAAE;AAClD,WAAO,YAAY,KAAK,IAAI,IAAI,KAAK;AAErC,uBAAK,eAAc,KAAK,EAAE,CAAC,IAAI,KAAK,GAAG,KAAK,IAAI,KAAK,GAAG,CAAC,IAAI,IAAI,GAAG,KAAK,IAAI,IAAI,GAAG;AACpF,WAAO;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOC,iBAAiB,MAAM;AACtB,WAAO;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWC,UAAU,YAAY,SAAS,OAAO,MAAM,EAAE,OAAO,SAAS,MAAM,UAAU;AAC7E,QAAI,CAAC,WAAY;AAEjB,UAAM,iBAAiB,KAAK,cAAc,aAAa;AACvD,QAAI,gBAAgB;AACnB,qBAAe,UAAU,YAAY,QAAQ,GAAG;AAChD;AAAA,IACH;AACE,QAAI,SAAS,KAAK,WAAW,YAAY,GAAG;AAC5C,SAAK,YAAY,MAAM;AAAA,EACzB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYC,WAAW,aAAa,SAAS,OAAO,MAAM,EAAE,OAAO,SAAS,MAAM,UAAU;AAC/E,QAAI,CAAC,MAAM,QAAQ,WAAW,GAAG;AAChC,WAAK,UAAU,aAAa,QAAQ,GAAG;AAAA,IAC1C,OAAS;AACN,kBAAY,QAAQ,CAAC,SAAS;AAC7B,aAAK,UAAU,MAAM,QAAQ,GAAG;AAAA,MACpC,CAAI;AAAA,IACJ;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQC,aAAa,OAAO,SAAS,OAAO;AACnC,QAAI,CAAC,MAAO;AAEZ,QAAI,SAAS,KAAK,cAAc,qBAAqB,KAAK,IAAI;AAE9D,QAAI,QAAQ;AACX,WAAK,qBAAqB,QAAQ,KAAK,aAAa,UAAU,CAAC;AAAA,IAClE;AAEE,QAAI,KAAK,gBAAgB,KAAK,gBAAgB,MAAO,MAAK,WAAW,MAAM;AAAA,EAC7E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASC,cAAc,QAAQ,SAAS,OAAO;AACrC,QAAI,CAAC,MAAM,QAAQ,MAAM,GAAG;AAC3B,WAAK,aAAa,QAAQ,MAAM;AAAA,IACnC,OAAS;AACN,aAAO,QAAQ,CAAC,UAAU;AACzB,aAAK,aAAa,OAAO,MAAM;AAAA,MACnC,CAAI;AAAA,IACJ;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOC,gBAAgB,QAAQ;;AACvB,QAAI,QAAO,UAAK,cAAc,UAAU,MAA7B,mBAAgC,QAAQ,cAAc;AACjE,QAAI,CAAC,MAAM;AACV,cAAQ,KAAK,uCAAuC;AACpD;AAAA,IACH;AAEE,QAAI,YAAY,KAAK,UAAU,IAAI;AACnC,WAAO,OAAO,SAAS;AAAA,EACzB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQC,kBAAkB;AACjB,SAAK,kBAAkB,CAAE;AAEzB,SAAK,cAAa,EAAG,QAAQ,CAAC,WAAW;AACxC,aAAO,WAAW;AAAA,IACrB,CAAG;AACD,SAAK,WAAY;AAEjB,SAAK,SAAU;AACf,SAAK,oBAAqB;AAE1B,QAAI,KAAK,aAAa,SAAS,GAAG;AACjC,WAAK,mBAAoB;AAAA,IAC5B;AAAA,EACA;AAAA,EAoDC,uBAAuB;AACtB,aAAS,oBAAoB,aAAa,mBAAK,0BAAyB,IAAI;AAAA,EAC9E;AACA;AA9iCC;AAEA;AAQA;AAtFM;AAAA;AAAA;AAAA;AAAA;AAAA;AA0kCN,sBAAiB,SAAC,MAAM;;AACvB,QAAM,WAAW;AACjB,QAAM,YAAY;AAElB,QAAM,UAAQ,UAAK,gBAAgB,KAAK,CAAC,WAAW,OAAO,QAAQ,MAAM,IAAI,MAA/D,mBAAmE,eAAc;AAE/F,SAAO,KAAK,iBAAiB,KAAK;AACpC;AAAA;AAAA;AAAA;AAAA;AAMC,wBAAmB,WAAG;AACrB,SAAO,MAAM,KAAK,KAAK,iBAAiB,sBAAsB,CAAC;AACjE;AAUC;AC5mCD,OAAO,OAAO,cAAc,MAAM;"}
|
|
1
|
+
{"version":3,"file":"wje-select.js","sources":["../packages/wje-select/select.element.js","../packages/wje-select/select.js"],"sourcesContent":["import { FormAssociatedElement } from '../internals/form-associated-element.js';\nimport { event } from '../utils/event.js';\nimport Button from '../wje-button/button.js';\nimport Popup from '../wje-popup/popup.js';\nimport Icon from '../wje-icon/icon.js';\nimport Label from '../wje-label/label.js';\nimport Chip from '../wje-chip/chip.js';\nimport Input from '../wje-input/input.js';\nimport Option from '../wje-option/option.js';\nimport Options from '../wje-options/options.js';\nimport Checkbox from '../wje-checkbox/checkbox.js';\nimport styles from './styles/styles.css?inline';\n\nexport class Select extends FormAssociatedElement {\n\tconstructor() {\n\t\tsuper();\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the counter element, initially null.\n\t\t * @private\n\t\t */\n\t\tthis.counterEl = null;\n\n\t\t/**\n\t\t * @type {boolean}\n\t\t * @description Tracks whether the select element was previously opened, initially false.\n\t\t * @private\n\t\t * @default {boolean} false\n\t\t */\n\t\tthis._wasOppened = false;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the native select element, initially null.\n\t\t */\n\t\tthis.native = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the popup element, initially null.\n\t\t */\n\t\tthis.popup = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the label element, initially null.\n\t\t */\n\t\tthis.labelElement = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the slot start element, initially null.\n\t\t */\n\t\tthis.slotStart = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the slot end element, initially null.\n\t\t */\n\t\tthis.slotEnd = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the input element, initially null.\n\t\t */\n\t\tthis.input = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the chips element, initially null.\n\t\t */\n\t\tthis.chips = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the clear button element, initially null.\n\t\t */\n\t\tthis.clear = null;\n\n\t\t/**\n\t\t * @type {HTMLElement|null}\n\t\t * @description A reference to the list element, initially null.\n\t\t */\n\t\tthis.list = null;\n\n\t\tthis._value = [];\n\t\tthis._selectedOptions = [];\n\t}\n\n\t#addedOptions = [];\n\n\t#htmlOptions = [];\n\n\t/**\n\t * Prevent closing the parent <wje-select>'s popup when a nested <wje-dropdown>\n\t * menu item is clicked. Closes only the dropdown that owns the clicked item.\n\t * This captures the event at the document level (useCapture=true) so it can\n\t * stop the global outside-click logic that would otherwise hide the select's popup.\n\t */\n\t#onMenuItemClickCapture = (e) => {\n\t\tconst target = /** @type {HTMLElement} */(e.target);\n\t\tif (!target || !target.closest) return;\n\n\t\t// Run only for clicks inside a dropdown menu item\n\t\tconst menuItem = target.closest('wje-menu-item');\n\t\tif (!menuItem) return;\n\n\t\tconst dropdown = target.closest('wje-dropdown');\n\t\tif (dropdown && typeof dropdown.hide === 'function') {\n\t\t\t// Close only the dropdown; keep the select's popup open\n\t\t\tdropdown.hide();\n\t\t}\n\n\t\t// Block bubbling to document-level outside-click handlers that\n\t\t// might close <wje-popup> used by <wje-select>\n\t\te.stopPropagation();\n\t};\n\n\t/**\n\t * An object representing component dependencies with their respective classes.\n\t * Each property in the object maps a custom component name (as a string key)\n\t * to its corresponding class or constructor.\n\t * @typedef {{[key: string]: Function}} Dependencies\n\t * @property {Function} 'wje-button' Represents the Button component class.\n\t * @property {Function} 'wje-popup' Represents the Popup component class.\n\t * @property {Function} 'wje-icon' Represents the Icon component class.\n\t * @property {Function} 'wje-label' Represents the Label component class.\n\t * @property {Function} 'wje-chip' Represents the Chip component class.\n\t * @property {Function} 'wje-input' Represents the Input component class.\n\t * @property {Function} 'wje-option' Represents the Option component class.\n\t * @property {Function} 'wje-checkbox' Represents the Checkbox component class.\n\t */\n\tdependencies = {\n\t\t'wje-button': Button,\n\t\t'wje-popup': Popup,\n\t\t'wje-icon': Icon,\n\t\t'wje-label': Label,\n\t\t'wje-chip': Chip,\n\t\t'wje-input': Input,\n\t\t'wje-option': Option,\n\t\t'wje-options': Options,\n\t\t'wje-checkbox': Checkbox,\n\t};\n\n\t/**\n\t * Sets the value for the form field. Converts the input value into a FormData object\n\t * if it is not already an array, splitting by spaces if necessary, and sets the\n\t * internal form value as well as the selected values.\n\t * @param {string|Array} value The value to be set. Can be a string (which will be\n\t * split into an array by spaces) or an array of values.\n\t */\n\tset value(value) {\n\t\tconst formData = new FormData();\n\n\t\tif (value) {\n\t\t\tlet data = value;\n\n\t\t\tif (!Array.isArray(data)) {\n\t\t\t\tdata = data.split(' ');\n\t\t\t}\n\t\t\tdata.forEach(v => {\n\t\t\t\tformData.append(this.name, v)\n\t\t\t});\n\t\t\tvalue = formData;\n\n\t\t\tthis._value = data;\n\t\t} else {\n\t\t\tformData.delete(this.name);\n\t\t\tvalue = formData;\n\t\t\tthis._value = [];\n\t\t}\n\t\tthis.internals.setFormValue(value);\n\t}\n\n\t/**\n\t * Retrieves the current value.\n\t * @returns {any} The value of the `_value` property.\n\t */\n\tget value() {\n\t\treturn this._value;\n\t}\n\n\t/**\n\t * Sets the maximum number of options allowed.\n\t * @param { number | object} value The value to set as the maximum number of options.\n\t * If null, the 'max-options' attribute will be removed.\n\t */\n\tset maxOptions(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('max-options', value);\n\t\t} else {\n\t\t\tthis.removeAttribute('max-options');\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the maximum number of options allowed.\n\t * Parses the value of the 'max-options' attribute from the element and converts it to a number.\n\t * If the attribute is not present or cannot be converted to a valid number, defaults to 1.\n\t * @returns {number} The maximum number of options, or 0 if the attribute is not set or invalid.\n\t */\n\tget maxOptions() {\n\t\treturn +this.getAttribute('max-options') || 1;\n\t}\n\n\t/**\n\t * @summary Setter for the defaultValue attribute.\n\t * This method sets the 'value' attribute of the custom input element to the provided value.\n\t * The 'value' attribute represents the default value of the input element.\n\t * @param {string} value The value to set as the default value.\n\t */\n\tset defaultValue(value) {\n\t\tthis.setAttribute('value', value);\n\t}\n\n\t/**\n\t * @summary Getter for the defaultValue attribute.\n\t * This method retrieves the 'value' attribute of the custom input element.\n\t * The 'value' attribute represents the default value of the input element.\n\t * If the 'value' attribute is not set, it returns an empty string.\n\t * @returns {string} The default value of the input element.\n\t */\n\tget defaultValue() {\n\t\treturn this.getAttribute('value') ?? '';\n\t}\n\n\t/**\n\t * Sets the trigger value.\n\t * @param {string} value The trigger value to set.\n\t */\n\tset trigger(value) {\n\t\tthis.setAttribute('trigger', value);\n\t}\n\n\t/**\n\t * Returns the trigger value.\n\t * @returns {string} The trigger value.\n\t */\n\tget trigger() {\n\t\treturn this.getAttribute('trigger') || 'click';\n\t}\n\n\t/**\n\t * Sets or removes the disabled state for the associated elements.\n\t * @param {boolean} value A boolean indicating whether the elements should be disabled.\n\t * If true, the disabled attribute is added to the elements. If false, the disabled attribute is removed.\n\t */\n\tset disabled(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('disabled', '');\n\t\t\tthis.input.setAttribute('disabled', '');\n\t\t\tthis.displayInput.setAttribute('disabled', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('disabled');\n\t\t\tthis.input.removeAttribute('disabled');\n\t\t\tthis.displayInput.removeAttribute('disabled');\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the current state of the 'disabled' attribute.\n\t * @returns {boolean} Returns true if the 'disabled' attribute is present, otherwise false.\n\t */\n\tget disabled() {\n\t\treturn this.hasAttribute('disabled');\n\t}\n\n\t/**\n\t * Sets the readonly state of the element. When set to true,\n\t * the element and its associated inputs are marked as readonly or disabled.\n\t * When set to false, the readonly and disabled attributes are removed,\n\t * allowing user interaction.\n\t * @param {boolean} value A boolean value indicating whether to set the\n\t * element and its associated inputs to readonly (true) or not (false).\n\t */\n\tset readonly(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('disabled', '');\n\t\t\tthis.input.setAttribute('readonly', '');\n\t\t\tthis.displayInput.setAttribute('disabled', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('disabled');\n\t\t\tthis.input.removeAttribute('readonly');\n\t\t\tthis.displayInput.removeAttribute('disabled');\n\t\t}\n\t}\n\n\t/**\n\t * Checks if the 'readonly' attribute is present on the element.\n\t * @returns {boolean} Returns true if the 'readonly' attribute is set, otherwise false.\n\t */\n\tget readonly() {\n\t\treturn this.hasAttribute('readonly');\n\t}\n\n\t/**\n\t * Sets the maximum height value for the element.\n\t * If a value is provided, it sets the 'max-height' attribute on the element.\n\t * If no value is provided, it removes the 'max-height' attribute from the element.\n\t * @param {string|null} value The maximum height to be set. If null or undefined, the attribute is removed.\n\t */\n\tset maxHeight(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('max-height', value);\n\t\t} else {\n\t\t\tthis.removeAttribute('max-height');\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the maximum height value, which is determined by the 'max-height' attribute.\n\t * If the attribute is not set, a default value of '200px' is returned.\n\t * @returns {string} The maximum height value as a string.\n\t */\n\tget maxHeight() {\n\t\treturn this.getAttribute('max-height') || 'auto';\n\t}\n\n\t/**\n\t * Sets the offset attribute for the element.\n\t * @param {string} value The value to assign to the offset attribute.\n\t */\n\tset offset(value) {\n\t\tthis.setAttribute('offset', value);\n\t}\n\n\t/**\n\t * Gets the value of the offset attribute of the current element.\n\t * If the offset attribute is not present, returns a default value of '0'.\n\t * @returns {string} The value of the offset attribute or the default value '0'.\n\t */\n\tget offset() {\n\t\treturn this.getAttribute('offset') || '5';\n\t}\n\n\t/**\n\t * Sets the selected options for the object.\n\t * @param {Array|object} value The new value for the selected options. It can be an array or object containing the selected options.\n\t */\n\tset selectedOptions(value) {\n\t\tthis._selectedOptions = value;\n\t}\n\n\t/**\n\t * Retrieves the selected options.\n\t * @returns {Array} An array containing the currently selected options. If no options are selected, an empty array is returned.\n\t */\n\tget selectedOptions() {\n\t\treturn this._selectedOptions || [];\n\t}\n\n\t/**\n\t * Sets the `lazy` attribute on the element. If the provided value is truthy, the `lazy` attribute is added. If the value is falsy, the `lazy` attribute is removed.\n\t * @param {boolean} value A boolean value indicating whether to add or remove the `lazy` attribute. If `true`, the attribute is added; if `false`, it is removed.\n\t */\n\tset lazy(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('lazy', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('lazy');\n\t\t}\n\t}\n\n\t/**\n\t * Getter for the 'lazy' property.\n\t * @returns {boolean} Returns true if the 'lazy' attribute is present on the element, otherwise false.\n\t */\n\tget lazy() {\n\t\treturn this.hasAttribute('lazy');\n\t}\n\n\t/**\n\t * Sets or removes the 'no-size' attribute on an element.\n\t * @param {boolean} value A boolean indicating whether to add or remove the 'no-size' attribute. If true, the attribute is added; if false, the attribute is removed.\n\t */\n\tset noSize(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('no-size', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('no-size');\n\t\t}\n\t}\n\n\t/**\n\t * Gets the value of the 'no-size' attribute for the element.\n\t * @returns {boolean} True if the 'no-size' attribute is present, otherwise false.\n\t */\n\tget noSize() {\n\t\treturn this.hasAttribute('no-size');\n\t}\n\n\t/**\n\t * Getter for the customErrorDisplay attribute.\n\t * @returns {boolean} Whether the attribute is present.\n\t */\n\tget customErrorDisplay() {\n\t\treturn this.hasAttribute('custom-error-display');\n\t}\n\n\t/**\n\t * Retrieves the complete list of options available for the component.\n\t * The options are determined by combining elements from various sources, including loaded options, added options, and HTML-sourced options.\n\t * If a `wje-options` element is present within the component, its loaded options are included in the merged list.\n\t * In the absence of a `wje-options` element, duplicates among the added and HTML options are removed, retaining their order.\n\t * @returns {Array<object>} An array containing all the available options, combining the loaded, added, and HTML-based options, with duplicates removed where applicable.\n\t */\n\tget options() {\n\t\tif (this.querySelector('wje-options')) {\n\t\t\tconst allOptions = [...this.querySelector('wje-options').loadedOptions, ...this.#addedOptions, ...this.#htmlOptions]\n\n\t\t\treturn allOptions\n\t\t} else {\n\t\t\tconst allOptions = [...this.#addedOptions, ...this.#htmlOptions]\n\n\t\t\treturn Array.from(\n\t\t\t\tnew Map(allOptions.reverse().map(obj => [obj.value, obj])).values()\n\t\t\t).reverse();\n\t\t}\n\t}\n\n\tclassName = 'Select';\n\n\t/**\n\t * Returns the CSS styles for the component.\n\t * @static\n\t * @returns {CSSStyleSheet}\n\t */\n\tstatic get cssStyleSheet() {\n\t\treturn styles;\n\t}\n\n\t/**\n\t * Returns the list of attributes to observe for changes.\n\t * @static\n\t * @returns {Array<string>}\n\t */\n\tstatic get observedAttributes() {\n\t\treturn ['active', 'value', 'disabled', 'readonly', 'multiple', 'label', 'placeholder', 'max-height', 'max-options', 'variant', 'placement'];\n\t}\n\n\t/**\n\t * Sets up the attributes for the component.\n\t */\n\tsetupAttributes() {\n\t\tthis.isShadowRoot = 'open';\n\t}\n\n\tbeforeDraw() {\n\t\tif(this.hasAttribute('value')) {\n\t\t\tthis.value = this.getAttribute('value');\n\t\t}\n\t}\n\n\t/**\n\t * Draws the component for the select.\n\t * @returns {DocumentFragment}\n\t */\n\tdraw() {\n\t\tlet fragment = document.createDocumentFragment();\n\n\t\tthis.classList.add('wje-placement', this.placement ? 'wje-' + this.placement : 'wje-start');\n\n\t\t// zakladny obalovac\n\t\tlet native = document.createElement('div');\n\t\tnative.setAttribute('part', 'native');\n\t\tnative.classList.add('native-select', this.variant || 'default');\n\n\t\t// wrapper pre label a inputWrapper\n\t\tlet wrapper = document.createElement('div');\n\t\twrapper.classList.add('wrapper');\n\t\twrapper.setAttribute('slot', 'anchor');\n\n\t\t// label\n\t\tlet label = document.createElement('label');\n\t\tlabel.setAttribute('part', 'label');\n\t\tlabel.innerText = this.label || '';\n\n\t\t// obalovac pre input\n\t\tlet inputWrapper = document.createElement('div');\n\t\tinputWrapper.setAttribute('part', 'input-wrapper');\n\t\tinputWrapper.classList.add('input-wrapper');\n\n\t\tlet slotStart = document.createElement('div');\n\t\tslotStart.classList.add('slot-start');\n\n\t\tlet input = document.createElement('input');\n\t\tinput.setAttribute('type', 'text');\n\t\tinput.value = this.value.join(' ').trim();\n\t\tinput.classList.add('input-hidden');\n\n\t\tlet display = document.createElement('input');\n\t\tdisplay.setAttribute('type', 'text');\n\t\tdisplay.setAttribute('part', 'input');\n\t\tdisplay.setAttribute('autocomplete', 'off');\n\t\tdisplay.setAttribute('readonly', '');\n\t\tdisplay.setAttribute('placeholder', this.placeholder || '');\n\n\t\tif (this.required) {\n\t\t\tinput.setAttribute('required', '');\n\t\t\tdisplay.setAttribute('required', '');\n\t\t}\n\n\t\tlet slotEnd = document.createElement('div');\n\t\tslotEnd.classList.add('slot-end');\n\n\t\tlet arrow = document.createElement('wje-icon');\n\t\tarrow.setAttribute('name', 'chevron-down');\n\t\tarrow.setAttribute('slot', 'arrow');\n\n\t\tlet chips = document.createElement('div');\n\t\tchips.classList.add('chips');\n\t\tchips.innerText = this.placeholder || '';\n\n\t\t// obalovac pre option a find\n\t\tlet optionsWrapper = document.createElement('div');\n\t\toptionsWrapper.setAttribute('part', 'options-wrapper');\n\t\toptionsWrapper.classList.add('options-wrapper');\n\t\toptionsWrapper.style.setProperty('height', this.maxHeight);\n\n\t\tlet list = document.createElement('div');\n\t\tlist.classList.add('list');\n\n\t\tlet slot = document.createElement('slot');\n\n\t\tlet clear = document.createElement('wje-button');\n\t\tclear.setAttribute('fill', 'link');\n\t\tclear.setAttribute('part', 'clear');\n\t\tclear.setAttribute('stop-propagation', '');\n\n\t\tlet clearIcon = document.createElement('wje-icon');\n\t\tclearIcon.setAttribute('name', 'x');\n\n\t\tlet error = document.createElement('div');\n\t\terror.setAttribute('slot', 'error');\n\n\t\tlet errorSlot = document.createElement('slot');\n\t\terrorSlot.setAttribute('name', 'error');\n\n\t\t// vytvorime popup\n\t\tlet popup = document.createElement('wje-popup');\n\t\tpopup.setAttribute('placement', 'bottom-start');\n\t\tif (!this.noSize)\n\t\t\tpopup.setAttribute('size', '');\n\t\tpopup.setAttribute('part', 'popup');\n\t\tpopup.setAttribute('offset', this.offset);\n\n\t\tif(this.lazy || this.querySelector('wje-options')) {\n\t\t\tpopup.setAttribute('loader', '');\n\t\t}\n\n\t\tif (this.disabled || this.readonly) {\n\t\t\tpopup.setAttribute('disabled', '');\n\t\t} else {\n\t\t\tpopup.removeAttribute('loader');\n\t\t}\n\n\t\tif (this.variant === 'standard') {\n\t\t\tif (this.hasAttribute('label')) native.appendChild(label);\n\t\t} else {\n\t\t\twrapper.appendChild(label);\n\t\t}\n\n\t\tinputWrapper.append(slotStart);\n\t\tinputWrapper.append(display);\n\t\tinputWrapper.append(input);\n\n\t\tclear.append(clearIcon);\n\n\t\tif (this.hasAttribute('multiple')) inputWrapper.append(chips);\n\n\t\tif (this.hasAttribute('clearable')) inputWrapper.append(clear);\n\n\t\tinputWrapper.appendChild(slotEnd);\n\t\tinputWrapper.appendChild(arrow);\n\n\t\tlist.appendChild(slot);\n\n\t\tif (this.hasAttribute('find')) {\n\t\t\tlet find = document.createElement('wje-input');\n\t\t\tfind.setAttribute('variant', 'standard');\n\t\t\tfind.setAttribute('placeholder', 'Hľadať');\n\t\t\tfind.setAttribute('part', 'find');\n\t\t\tfind.clearable = true;\n\t\t\tfind.classList.add('find');\n\n\t\t\toptionsWrapper.appendChild(find);\n\n\t\t\tthis.findEl = find;\n\t\t}\n\n\t\tlet slotFooter = document.createElement('slot');\n\t\tslotFooter.setAttribute('name', 'footer');\n\n\t\t// APPEND\n\t\toptionsWrapper.append(list);\n\t\toptionsWrapper.append(slotFooter);\n\n\t\twrapper.append(inputWrapper);\n\n\t\tpopup.append(wrapper);\n\t\tpopup.append(optionsWrapper);\n\n\t\tif (this.trigger === 'click') popup.setAttribute('manual', '');\n\n\t\tthis.append(error);\n\n\t\tnative.append(popup);\n\t\tnative.append(errorSlot);\n\n\t\tfragment.appendChild(native);\n\n\t\tthis.native = native;\n\t\tthis.popup = popup;\n\t\tthis.labelElement = label;\n\t\tthis.slotStart = slotStart;\n\t\tthis.slotEnd = slotEnd;\n\t\tthis.input = input;\n\t\tthis.displayInput = display;\n\t\tthis.chips = chips;\n\t\tthis.clear = clear;\n\t\tthis.list = list;\n\t\tthis.slotFooter = slotFooter;\n\n\t\treturn fragment;\n\t}\n\n\t/**\n\t * Executes post-render logic for the custom element.\n\t * This includes validation, event listener registration, managing custom attributes, and\n\t * handling options initialization for the component.\n\t * @returns {void} This method does not return any value.\n\t */\n\tafterDraw() {\n\t\tdocument.addEventListener('mousedown', this.#onMenuItemClickCapture, true);\n\n\t\tthis.validate();\n\n\t\tif (this.hasAttribute('invalid')) {\n\t\t\tthis.showInvalidMessage();\n\t\t}\n\n\t\tthis.getAllOptions()?.forEach((option) => {\n\t\t\tthis.optionCheckSlot(option);\n\t\t});\n\n\t\tthis.selectedOptions = this.#getSelectedOptions();\n\t\tthis.selectOptions(this.value, true);\n\n\t\tif (this.lazy) {\n\t\t\tevent.addListener(this.popup, 'wje-popup:show', null, (e) => {\n\t\t\t\tif (this._wasOppened) return;\n\t\t\t\tthis._wasOppened = true;\n\n\t\t\t\tconst optionsElement = this.querySelector('wje-options');\n\t\t\t\toptionsElement.setAttribute('lazy', '');\n\t\t\t\toptionsElement.setAttribute('attached', '');\n\t\t\t});\n\t\t}\n\n\t\tevent.addListener(this.popup, 'wje-popup:aftershow', null, () => {\n\t\t\tconst assignedElements = this.slotFooter.assignedElements();\n\n\t\t\tif (assignedElements.length > 0) {\n\t\t\t\tconst el = assignedElements[0];\n\t\t\t\tconst rect = el.getBoundingClientRect();\n\t\t\t\tlet totalHeight = 0;\n\n\t\t\t\tif(this.hasAttribute('find')) {\n\t\t\t\t\tlet style = getComputedStyle(this.findEl);\n\n\t\t\t\t\tlet height = this.findEl.offsetHeight;\n\t\t\t\t\tlet marginTop = parseFloat(style.marginTop);\n\t\t\t\t\tlet marginBottom = parseFloat(style.marginBottom);\n\n\t\t\t\t\ttotalHeight = height + marginTop + marginBottom;\n\t\t\t\t}\n\n\t\t\t\tlet subtractHeight = rect.height + totalHeight;\n\n\t\t\t\tthis.list.style.height = `calc(100% - ${subtractHeight}px)`;\n\t\t\t}\n\t\t});\n\n\t\tthis.#htmlOptions = Array.from(this.querySelectorAll(':scope > wje-option')).map((option) => {\n\t\t\treturn {\n\t\t\t\tvalue: option.value,\n\t\t\t\ttext: option.textContent.trim(),\n\t\t\t};\n\t\t})\n\n\t\tthis.input.addEventListener('focus', (e) => {\n\t\t\tthis.labelElement?.classList.add('fade');\n\t\t\tthis.native.classList.add('focused');\n\t\t});\n\n\t\tthis.input.addEventListener('blur', (e) => {\n\t\t\tthis.native.classList.remove('focused');\n\t\t\tif (!e.target.value) this.labelElement?.classList.remove('fade');\n\t\t});\n\n\t\tthis.input.addEventListener('input', (e) => {\n\t\t\tthis.propagateValidation();\n\t\t});\n\n\t\tthis.addEventListener('wje-option:change', this.optionChange);\n\n\t\tthis.addEventListener('invalid', (e) => {\n\t\t\tthis.invalid = true;\n\t\t\tthis.pristine = false;\n\n\t\t\tthis.showInvalidMessage();\n\n\t\t\tif (this.customErrorDisplay) {\n\t\t\t\te.preventDefault();\n\t\t\t}\n\t\t});\n\n\t\tthis.clear?.addEventListener('wje-button:click', (e) => {\n\t\t\te.preventDefault();\n\t\t\te.stopPropagation();\n\t\t\tthis.clearSelections();\n\t\t});\n\n\t\tthis.list.addEventListener('wje-options:load', (e) => {\n\t\t\tthis.selectedOptions.forEach((option) => {\n\t\t\t\tthis.getAllOptions().forEach((el) => {\n\t\t\t\t\tif (el.value === option.value) {\n\t\t\t\t\t\tel.selected = true;\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t});\n\n\t\t\t// Ensure values from the value attribute are (re)selected after lazy-loaded pages\n\t\t\tconst attrValue = this.getAttribute('value')?.split(' ') || [];\n\n\t\t\tattrValue.forEach(val => {\n\t\t\t\tconst existingOption = Array.from(this.getAllOptions()).find(el => el.value === val);\n\t\t\t\tif (existingOption) {\n\t\t\t\t\texistingOption.selected = true;\n\t\t\t\t}\n\t\t\t});\n\n\t\t\tthis.selectedOptions = this.#getSelectedOptions();\n\t\t\tthis.selections(true);\n\n\t\t\tthis.list.scrollTo(0, 0);\n\t\t\tevent.dispatchCustomEvent(this.popup, 'wje-popup:content-ready'); // Notify that the content is ready\n\t\t});\n\n\t\t// skontrolujeme ci ma select atribut find\n\t\tif (this.hasAttribute('find') && this.findEl instanceof HTMLElement) {\n\t\t\tevent.addListener(this.findEl, 'keyup', '', this.#applySearchFilter);\n\t\t\tevent.addListener(this.findEl, 'wje-input:clear', '', this.#applySearchFilter);\n\t\t}\n\t}\n\n\t/**\n\t * Handles the change event for an option element within a select-like component.\n\t * This method processes user interactions with options and updates the state of the component,\n\t * including selection management, validation, and UI updates. Behavior differs based on\n\t * whether the component supports multiple selections.\n\t * Key functionality:\n\t * - Prevents the default behavior, event propagation, and immediate propagation of the event.\n\t * - Retrieves all options within the component.\n\t * - If the component doesn't support multiple selection:\n\t * - Marks only the clicked option as selected and deselects others.\n\t * - Hides the option popup.\n\t * - If the component supports multiple selection:\n\t * - Processes the clicked option without deselecting others.\n\t * - Updates the selected options and triggers validation.\n\t * - Marks the form state as non-pristine.\n\t * - Propagates the validation state to other relevant parts of the component or system.\n\t * @param {Event} e The event object representing the option change interaction.\n\t */\n\toptionChange = (e) => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\te.stopImmediatePropagation();\n\n\t\tlet allOptions = this.getAllOptions();\n\n\t\tif (!this.hasAttribute('multiple')) {\n\t\t\tallOptions.forEach((option) => {\n\t\t\t\tif (option.value === e.target.value) {\n\t\t\t\t\tthis.processClickedOption(option);\n\t\t\t\t} else {\n\t\t\t\t\toption.selected = false;\n\t\t\t\t}\n\t\t\t});\n\t\t\tthis.popup.hide(false);\n\t\t} else {\n\t\t\tthis.processClickedOption(e.target, true);\n\t\t}\n\n\t\tthis.selections();\n\n\t\tthis.validate(this.selectedOptions);\n\n\t\tthis.pristine = false;\n\t\tthis.propagateValidation();\n\t}\n\n\t/**\n\t * Handles the logic for processing the selection state of a clicked option element.\n\t * @function processClickedOption\n\t * @param {Element} option The option element that is clicked.\n\t * @param {boolean} [multiple] A Boolean indicating whether multiple options can be selected. Defaults to false.\n\t * Changes the selected state of the passed option and updates the selected options list.\n\t * Checks if the option already has a \"selected\" attribute, toggles its state,\n\t * and updates the internal selected options.\n\t */\n\tprocessClickedOption = (option, multiple = false) => {\n\t\tconst isSelected = option.hasAttribute('selected');\n\t\toption.selected = !isSelected;\n\n\t\tthis.selectedOptions = this.#getSelectedOptions();\n\t}\n\n\t/**\n\t * Returns all the options as HTML.\n\t * @returns {NodeList} The options as HTML.\n\t */\n\tgetAllOptions() {\n\t\treturn this.querySelectorAll('wje-option');\n\t}\n\n\t/**\n\t * Handles changes in the selection for a component, updating internal values, input fields,\n\t * and visual presentation (like chips or slots) as per the given selection options.\n\t * @param {Array|null} options The collection of selected option elements. If null, no options are selected.\n\t * @param {number} length The total number of selected options.\n\t * @returns {void}\n\t */\n\tselectionChanged(options = null, length = 0) {\n\t\tif (this.hasAttribute('multiple')) {\n\t\t\tthis.value = options.map((el) => el.value).reverse();\n\t\t\tthis.input.value = this.value.map(a => a).join(\" \").trim();\n\n\t\t\tif (this.placeholder && length === 0) {\n\t\t\t\tthis.chips.innerHTML = this.placeholder;\n\t\t\t} else {\n\t\t\t\tif (options !== null) Array.from(options).slice(0, +this.maxOptions).forEach(option => this.chips.appendChild(this.getChip(option)));\n\t\t\t\tif (this.counterEl instanceof HTMLElement || !this.maxOptions || length > +this.maxOptions) {\n\t\t\t\t\tthis.counter();\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\tconst option = options?.at(0);\n\n\t\t\tthis.value = options?.map((el) => el.value)?.at(0) || '';\n\t\t\tthis.input.value = this.value[0] || '';\n\t\t\tthis.displayInput.value = options[0]?.textContent?.trim() || '';\n\n\t\t\tthis.slotStart.innerHTML = '';\n\t\t\tthis.slotEnd.innerHTML = '';\n\n\t\t\tif (option && option instanceof HTMLElement) {\n\t\t\t\tlet optionSlotStart = option?.querySelector('wje-option > [slot=start]');\n\t\t\t\tif (optionSlotStart) {\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tthis.slotStart.append(optionSlotStart.cloneNode(true));\n\t\t\t\t\t},0)\n\t\t\t\t}\n\n\t\t\t\tlet optionSlotEnd = option?.querySelector('wje-option > [slot=end]');\n\n\t\t\t\tif (optionSlotEnd && optionSlotEnd instanceof HTMLElement && optionSlotEnd.tagName !== 'WJE-DROPDOWN' && optionSlotEnd.tagName !== 'WJE-BUTTON') {\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tthis.slotEnd.append(optionSlotEnd.cloneNode(true));\n\t\t\t\t\t},0)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Handles the logic for updating selections based on the current selected options,\n\t * updating chips content, and dispatching change events if necessary.\n\t * @param {boolean} [silence] If true, suppresses the dispatch of a custom change event.\n\t * @returns {void} This method does not return a value.\n\t */\n\tselections(silence = false) {\n\t\tif (this.selectedOptions.length >= +this.maxOptions) {\n\t\t\tthis.counterEl = null;\n\t\t}\n\n\t\tif (this.chips) {\n\t\t\tthis.chips.innerHTML = '';\n\t\t}\n\n\t\tif (this.selectedOptions.length > 0) {\n\t\t\tthis.selectionChanged(this.selectedOptions, this.selectedOptions.length);\n\t\t} else {\n\t\t\tthis.selectionChanged(this.selectedOptions);\n\t\t}\n\n\t\tif (silence) return;\n\t\tevent.dispatchCustomEvent(this, 'wje-select:change');\n\t}\n\n\t/**\n\t * Updates the counter element to reflect the current state of selected values relative to the maximum allowed options.\n\t * If the maximum options are selected, the counter element is removed. If it does not already exist and needs to be displayed, it is created.\n\t * @returns {void} Does not return a value.\n\t */\n\tcounter() {\n\t\t// zmazanie counter (span)\n\t\tif (this.counterEl && this.value.length === +this.maxOptions) {\n\t\t\tthis.counterEl.remove();\n\t\t\tthis.counterEl = null;\n\t\t\treturn;\n\t\t}\n\n\t\t// ak counter nie je, tak ho vytvorime\n\t\tif (!this.counterEl) {\n\t\t\tthis.counterEl = document.createElement('span');\n\t\t\tthis.counterEl.classList.add('counter');\n\n\t\t\tthis.chips.appendChild(this.counterEl);\n\t\t}\n\n\t\t// nastavime hodnotu counter\n\t\tthis.counterEl.innerText = `+${this.value.length - +this.maxOptions}`;\n\t}\n\n\t/**\n\t * Creates and returns a chip element with specified properties and a label.\n\t * @param {object} option The configuration object for the chip. Typically includes properties such as value and textContent to set up the chip's label and data.\n\t * @returns {HTMLElement} The newly created chip element with a label and default properties.\n\t */\n\tgetChip(option) {\n\t\tlet chip = document.createElement('wje-chip');\n\t\tchip.size = 'small';\n\t\tchip.removable = true;\n\t\tchip.round = true;\n\t\tchip.addEventListener('wje:chip-remove', this.removeChip);\n\t\tchip.option = option;\n\n\t\tlet label = document.createElement('wje-label');\n\t\tlabel.innerText = this.#htmlSelectedItem(option.value) // option.textContent.trim();\n\n\t\tchip.appendChild(label);\n\n\t\treturn chip;\n\t}\n\n\t/**\n\t * Handles the removal of a chip element from the DOM and updates the related state.\n\t * @param {Event} e The event object triggered by the chip removal action.\n\t * The target of the event is expected to be the chip element itself.\n\t */\n\tremoveChip = (e) => {\n\t\te.target.parentNode.removeChild(e.target);\n\t\tthis.processClickedOption(e.target.option, true);\n\t\tthis.selections();\n\t};\n\n\t/**\n\t * Generates an HTML option element based on the provided item and mapping.\n\t * @param {object} item The item to generate the option for.\n\t * @param {object} [map] The mapping object that specifies the properties of the item to use for the option's value and text.\n\t * @param {string} [map.value] The property of the item to use for the option's value.\n\t * @param {string} [map.text] The property of the item to use for the option's text.\n\t * @returns {HTMLElement} The generated HTML option element.\n\t */\n\thtmlOption(item, map = { value: 'value', text: 'text' }) {\n\t\tlet option = document.createElement('wje-option');\n\n\t\tif (item[map.value] === null) {\n\t\t\tconsole.warn(`The item ${JSON.stringify(item)} does not have the property ${map.value}`);\n\t\t}\n\n\t\tif (item[map.text] === null) {\n\t\t\tconsole.warn(`The item ${JSON.stringify(item)} does not have the property ${map.text}`);\n\t\t}\n\n\t\toption.setAttribute('value', item[map.value] ?? '');\n\t\toption.innerText = item[map.text] ?? '';\n\n\t\tthis.#addedOptions.push({ [map.value]: item[map.value], [map.text]: item[map.text] });\n\t\treturn option;\n\t}\n\n\t/**\n\t * Returns the provided item.\n\t * @param {any} item The item to be returned.\n\t * @returns {any} The same item that was passed as input.\n\t */\n\thtmlSelectedItem(item) {\n\t\treturn item;\n\t}\n\n\t/**\n\t * Adds a new option to the component.\n\t * @param {object} optionData The data used to create the new option.\n\t * @param {boolean} [silent] Whether the addition should trigger events or not.\n\t * @param {object} [map] Mapping of keys to identify value and text in the optionData.\n\t * @param {string} [map.value] The key in optionData that represents the value of the option.\n\t * @param {string} [map.text] The key in optionData that represents the text of the option.\n\t * @returns {void}\n\t */\n\taddOption(optionData, silent = false, map = { value: 'value', text: 'text' }) {\n\t\tif (!optionData) return;\n\n\t\tconst optionsElement = this.querySelector('wje-options');\n\t\tif (optionsElement) {\n\t\t\toptionsElement.addOption(optionData, silent, map);\n\t\t\treturn;\n\t\t}\n\t\tlet option = this.htmlOption(optionData, map);\n\t\tthis.appendChild(option);\n\t}\n\n\t/**\n\t * Adds one or more options to a collection. If the input is an array, it adds each option within the array.\n\t * Otherwise, it adds a single option.\n\t * @param {Array | object} optionsData The data representing the options to be added. It can be a single object or an array of objects.\n\t * @param {boolean} [silent] Optional flag to determine if events or notifications should be suppressed while adding options.\n\t * @param {object} [map] An optional mapping object specifying how to map data properties to value and text for the options.\n\t * @param {string} [map.value] The property in the optionsData that represents the value of the option.\n\t * @param {string} [map.text] The property in the optionsData that represents the text of the option.\n\t * @returns {void}\n\t */\n\taddOptions(optionsData, silent = false, map = { value: 'value', text: 'text' }) {\n\t\tif (!Array.isArray(optionsData)) {\n\t\t\tthis.addOption(optionsData, silent, map);\n\t\t} else {\n\t\t\toptionsData.forEach((item) => {\n\t\t\t\tthis.addOption(item, silent, map);\n\t\t\t});\n\t\t}\n\t}\n\n\t/**\n\t * Selects an option from the available options within the component.\n\t * @param {string} value The value of the option to be selected.\n\t * @param {boolean} [silent] Determines whether the selection should trigger notification or updates. Defaults to false.\n\t * @returns {void} Does not return a value.\n\t */\n\tselectOption(value, silent = false) {\n\t\tif (!value) return;\n\n\t\tlet option = this.querySelector(`wje-option[value=\"${value}\"]`);\n\n\t\tif (option) {\n\t\t\tthis.processClickedOption(option, this.hasAttribute('multiple'));\n\t\t}\n\n\t\tif (this.drawingStatus > this.drawingStatuses.START) this.selections(silent);\n\t}\n\n\t/**\n\t * Selects multiple options based on the provided values. If a single value is provided, it selects that option.\n\t * If an array of values is provided, it iterates through the array and selects each option.\n\t * @param {any|any[]} values A single value or an array of values to be selected.\n\t * @param {boolean} [silent] Determines whether the selection action should occur silently without triggering other side effects or events.\n\t * @returns {void} This method does not return a value.\n\t */\n\tselectOptions(values, silent = false) {\n\t\tif (!Array.isArray(values)) {\n\t\t\tthis.selectOption(values, silent);\n\t\t} else {\n\t\t\tvalues.forEach((value) => {\n\t\t\t\tthis.selectOption(value, silent);\n\t\t\t});\n\t\t}\n\t}\n\n\t/**\n\t * Clones and appends an icon with the \"check\" slot to the specified option element.\n\t * @param {HTMLElement} option The target HTML element to which the cloned \"check\" icon will be appended.\n\t * @returns {void} This method does not return a value, but it modifies the DOM by appending a cloned \"check\" icon to the provided option element.\n\t */\n\toptionCheckSlot(option) {\n\t\tlet icon = this.querySelector('template')?.content.querySelector(`[slot=\"check\"]`);\n\t\tif (!icon) {\n\t\t\tconsole.warn(`Icon with slot \"check\" was not found.`);\n\t\t\treturn;\n\t\t}\n\n\t\tlet iconClone = icon.cloneNode(true);\n\t\toption.append(iconClone);\n\t}\n\n\t/**\n\t * Clears all selected options and resets selections.\n\t * The method ensures that all options are deselected, updates the internal state, validates the selections,\n\t * propagates the validation status, and indicates invalid state if necessary.\n\t * @returns {void} No value is returned by this method.\n\t */\n\tclearSelections() {\n\t\tthis.selectedOptions = [];\n\n\t\tthis.getAllOptions().forEach((option) => {\n\t\t\toption.selected = false;\n\t\t});\n\t\tthis.selections();\n\n\t\tthis.validate();\n\t\tthis.propagateValidation();\n\n\t\tif (this.hasAttribute('invalid')) {\n\t\t\tthis.showInvalidMessage();\n\t\t}\n\t}\n\n\t/**\n\t * Processes the given item and retrieves the corresponding value from the selected options.\n\t * @param {string} item The key to search for in the selected options.\n\t * @returns {string} The text content associated with the selected item, or an empty string if not found.\n\t */\n\t#htmlSelectedItem(item) {\n\t\tconst keyValue = \"value\"\n\t\tconst textValue = \"textContent\";\n\n\t\tconst value = this.selectedOptions.find((option) => option[keyValue] === item)?.[textValue] ?? \"\";\n\n\t\treturn this.htmlSelectedItem(value);\n\t}\n\n\t/**\n\t * Retrieves the list of selected options within the component.\n\t * @returns {Array<Element>} An array of elements representing the options that are currently selected.\n\t */\n\t#getSelectedOptions() {\n\t\treturn Array.from(this.querySelectorAll('wje-option[selected]'));\n\t}\n\n\t/**\n\t * Filters option elements based on the search input value.\n\t * This function applies a search filter to a list of options. If a `wj-options` element exists and has\n\t * the `lazy` attribute, the search value is passed to the `wj-options` element, enabling infinite scroll\n\t * functionality to handle the filtering. If the `lazy` attribute is not present, it performs a local\n\t * search to show or hide options depending on whether their text content matches the search input.\n\t * @param {Event} e The input event containing the search input value from the user.\n\t */\n\t#applySearchFilter = (e) => {\n\t\t// contains wj-options element with options\n\t\tconst optionsElement = this.querySelector('wje-options');\n\n\t\tif (optionsElement && optionsElement.hasAttribute('lazy')) {\n\t\t\t// pass search value to wj-options element and infinite scroll will handle the rest\n\t\t\toptionsElement.setAttribute('search', e.target.value);\n\t\t} else {\n\t\t\tlet value = e.target.value.trim().toLowerCase();\n\n\t\t\tthis.getAllOptions().forEach((option) => {\n\t\t\t\tif (option.textContent.trim().toLowerCase().includes(value)) {\n\t\t\t\t\toption.style.display = 'block';\n\t\t\t\t} else {\n\t\t\t\t\toption.style.display = 'none';\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t}\n\n\tdisconnectedCallback() {\n\t\tdocument.removeEventListener('mousedown', this.#onMenuItemClickCapture, true);\n\t}\n}","import { Select } from \"./select.element.js\";\n\nexport default Select;\n\nSelect.define('wje-select', Select);\n"],"names":["_a"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "wj-elements",
|
|
3
3
|
"description": "WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.",
|
|
4
|
-
"version": "0.1.
|
|
4
|
+
"version": "0.1.252",
|
|
5
5
|
"homepage": "https://github.com/lencys/wj-elements",
|
|
6
6
|
"author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
|
|
7
7
|
"license": "MIT",
|