le-kit 0.4.0 → 0.5.0
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/LLM_CONTEXT.md +1377 -0
- package/dist/cjs/le-bar_16.cjs.entry.js +15 -15
- package/dist/cjs/le-code-input.cjs.entry.js +181 -0
- package/dist/cjs/le-combobox.cjs.entry.js +1 -1
- package/dist/cjs/le-header-placeholder.cjs.entry.js +1 -1
- package/dist/cjs/le-kit.cjs.js +1 -1
- package/dist/cjs/le-multiselect.cjs.entry.js +3 -3
- package/dist/cjs/le-number-input.cjs.entry.js +1 -1
- package/dist/cjs/le-round-progress.cjs.entry.js +1 -1
- package/dist/cjs/le-segmented-control.cjs.entry.js +1 -1
- package/dist/cjs/le-stack.cjs.entry.js +1 -1
- package/dist/cjs/le-tab-bar.cjs.entry.js +1 -1
- package/dist/cjs/le-tab-panel.cjs.entry.js +2 -2
- package/dist/cjs/le-tab.cjs.entry.js +1 -1
- package/dist/cjs/le-tabs.cjs.entry.js +2 -2
- package/dist/cjs/le-tag.cjs.entry.js +1 -1
- package/dist/cjs/le-turntable.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/le-code-input/le-code-input.css +106 -0
- package/dist/collection/components/le-code-input/le-code-input.js +466 -0
- package/dist/collection/components/le-code-input/le-code-input.js.map +1 -0
- package/dist/collection/components/le-collapse/le-collapse.js +1 -1
- package/dist/collection/components/le-combobox/le-combobox.js +1 -1
- package/dist/collection/components/le-current-heading/le-current-heading.js +1 -1
- package/dist/collection/components/le-dropdown-base/le-dropdown-base.js +1 -1
- package/dist/collection/components/le-header/le-header.js +2 -2
- package/dist/collection/components/le-header-placeholder/le-header-placeholder.js +1 -1
- package/dist/collection/components/le-icon/le-icon.js +1 -1
- package/dist/collection/components/le-multiselect/le-multiselect.js +3 -3
- package/dist/collection/components/le-number-input/le-number-input.js +1 -1
- package/dist/collection/components/le-popover/le-popover.js +3 -3
- package/dist/collection/components/le-round-progress/le-round-progress.js +1 -1
- package/dist/collection/components/le-scroll-progress/le-scroll-progress.js +1 -1
- package/dist/collection/components/le-segmented-control/le-segmented-control.js +1 -1
- package/dist/collection/components/le-select/le-select.js +2 -2
- package/dist/collection/components/le-slot/le-slot.js +1 -1
- package/dist/collection/components/le-stack/le-stack.js +1 -1
- package/dist/collection/components/le-string-input/le-string-input.js +2 -2
- package/dist/collection/components/le-tab/le-tab.js +1 -1
- package/dist/collection/components/le-tab-bar/le-tab-bar.js +1 -1
- package/dist/collection/components/le-tab-panel/le-tab-panel.js +2 -2
- package/dist/collection/components/le-tabs/le-tabs.js +2 -2
- package/dist/collection/components/le-tag/le-tag.js +1 -1
- package/dist/collection/components/le-turntable/le-turntable.js +1 -1
- package/dist/collection/dist/components/assets/custom-elements.json +1248 -871
- package/dist/components/assets/custom-elements.json +1248 -871
- package/dist/components/le-button2.js +5 -5
- package/dist/components/le-code-input.d.ts +11 -0
- package/dist/components/le-code-input.js +265 -0
- package/dist/components/le-code-input.js.map +1 -0
- package/dist/components/le-collapse2.js +1 -1
- package/dist/components/le-combobox.js +1 -1
- package/dist/components/le-current-heading.js +1 -1
- package/dist/components/le-dropdown-base2.js +1 -1
- package/dist/components/le-header-placeholder.js +1 -1
- package/dist/components/le-header.js +2 -2
- package/dist/components/le-icon2.js +1 -1
- package/dist/components/le-multiselect.js +3 -3
- package/dist/components/le-number-input.js +1 -1
- package/dist/components/le-popover2.js +3 -3
- package/dist/components/le-round-progress.js +1 -1
- package/dist/components/le-scroll-progress.js +1 -1
- package/dist/components/le-segmented-control.js +1 -1
- package/dist/components/le-stack.js +1 -1
- package/dist/components/le-tab-bar.js +1 -1
- package/dist/components/le-tab-panel.js +2 -2
- package/dist/components/le-tab2.js +1 -1
- package/dist/components/le-tabs.js +2 -2
- package/dist/components/le-tag2.js +1 -1
- package/dist/components/le-turntable.js +1 -1
- package/dist/docs.json +442 -1
- package/dist/esm/le-bar_16.entry.js +15 -15
- package/dist/esm/le-code-input.entry.js +179 -0
- package/dist/esm/le-code-input.entry.js.map +1 -0
- package/dist/esm/le-combobox.entry.js +1 -1
- package/dist/esm/le-header-placeholder.entry.js +1 -1
- package/dist/esm/le-kit.js +1 -1
- package/dist/esm/le-multiselect.entry.js +3 -3
- package/dist/esm/le-number-input.entry.js +1 -1
- package/dist/esm/le-round-progress.entry.js +1 -1
- package/dist/esm/le-segmented-control.entry.js +1 -1
- package/dist/esm/le-stack.entry.js +1 -1
- package/dist/esm/le-tab-bar.entry.js +1 -1
- package/dist/esm/le-tab-panel.entry.js +2 -2
- package/dist/esm/le-tab.entry.js +1 -1
- package/dist/esm/le-tabs.entry.js +2 -2
- package/dist/esm/le-tag.entry.js +1 -1
- package/dist/esm/le-turntable.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/le-kit/dist/components/assets/custom-elements.json +1248 -871
- package/dist/le-kit/le-kit.esm.js +1 -1
- package/dist/le-kit/{p-c4975e66.entry.js → p-24112ca3.entry.js} +2 -2
- package/dist/le-kit/{p-3f26be75.entry.js → p-2c6d080d.entry.js} +2 -2
- package/dist/le-kit/p-516c8531.entry.js +2 -0
- package/dist/le-kit/{p-69dd089a.entry.js → p-6b69f9a2.entry.js} +2 -2
- package/dist/le-kit/{p-6da2d81a.entry.js → p-6d14306f.entry.js} +2 -2
- package/dist/le-kit/{p-7201ae65.entry.js → p-7bcdf2d4.entry.js} +2 -2
- package/dist/le-kit/{p-36f126bb.entry.js → p-7cf1e23c.entry.js} +2 -2
- package/dist/le-kit/{p-d449a88b.entry.js → p-85f2fd4d.entry.js} +2 -2
- package/dist/le-kit/{p-d1eee582.entry.js → p-ab6c1def.entry.js} +2 -2
- package/dist/le-kit/{p-3f31e31b.entry.js → p-ae4ead64.entry.js} +2 -2
- package/dist/le-kit/{p-33a24394.entry.js → p-b05d4511.entry.js} +2 -2
- package/dist/le-kit/{p-9863d6fb.entry.js → p-b6ac02ff.entry.js} +2 -2
- package/dist/le-kit/{p-cd38c01b.entry.js → p-c24769e2.entry.js} +2 -2
- package/dist/le-kit/{p-bf66757c.entry.js → p-dc0445ad.entry.js} +2 -2
- package/dist/le-kit/p-eb5286f2.entry.js +2 -0
- package/dist/le-kit/p-eb5286f2.entry.js.map +1 -0
- package/dist/types/components/le-code-input/le-code-input.d.ts +102 -0
- package/dist/types/components.d.ts +183 -0
- package/package.json +7 -5
- package/dist/le-kit/p-7a60bfff.entry.js +0 -2
- /package/dist/le-kit/{p-c4975e66.entry.js.map → p-24112ca3.entry.js.map} +0 -0
- /package/dist/le-kit/{p-3f26be75.entry.js.map → p-2c6d080d.entry.js.map} +0 -0
- /package/dist/le-kit/{p-7a60bfff.entry.js.map → p-516c8531.entry.js.map} +0 -0
- /package/dist/le-kit/{p-69dd089a.entry.js.map → p-6b69f9a2.entry.js.map} +0 -0
- /package/dist/le-kit/{p-6da2d81a.entry.js.map → p-6d14306f.entry.js.map} +0 -0
- /package/dist/le-kit/{p-7201ae65.entry.js.map → p-7bcdf2d4.entry.js.map} +0 -0
- /package/dist/le-kit/{p-36f126bb.entry.js.map → p-7cf1e23c.entry.js.map} +0 -0
- /package/dist/le-kit/{p-d449a88b.entry.js.map → p-85f2fd4d.entry.js.map} +0 -0
- /package/dist/le-kit/{p-d1eee582.entry.js.map → p-ab6c1def.entry.js.map} +0 -0
- /package/dist/le-kit/{p-3f31e31b.entry.js.map → p-ae4ead64.entry.js.map} +0 -0
- /package/dist/le-kit/{p-33a24394.entry.js.map → p-b05d4511.entry.js.map} +0 -0
- /package/dist/le-kit/{p-9863d6fb.entry.js.map → p-b6ac02ff.entry.js.map} +0 -0
- /package/dist/le-kit/{p-cd38c01b.entry.js.map → p-c24769e2.entry.js.map} +0 -0
- /package/dist/le-kit/{p-bf66757c.entry.js.map → p-dc0445ad.entry.js.map} +0 -0
|
@@ -662,7 +662,7 @@ const LeCollapse = class {
|
|
|
662
662
|
this.el.toggleAttribute('data-open', nextOpen);
|
|
663
663
|
}
|
|
664
664
|
render() {
|
|
665
|
-
return (h(Host, { key: '
|
|
665
|
+
return (h(Host, { key: 'e0882ec40ed132dbd6eeaa43da4aff03b6e45352', "data-open": this.shouldBeOpen() ? 'true' : 'false' }, h("le-component", { key: '55c98e5382ddd6b5ef8a8f506f9a2901fc0b48ce', component: "le-collapse" }, h("div", { key: '0bcfa5aada8a7a6f9c86011e6a3dfa5bbb5e08c4', class: { 'region': true, 'scroll-down': this.scrollDown }, part: "region" }, h("slot", { key: '7b762e372802512a287ae98d4aeecdb3160bb54e' })))));
|
|
666
666
|
}
|
|
667
667
|
static get watchers() { return {
|
|
668
668
|
"open": ["onOpenChange"],
|
|
@@ -968,7 +968,7 @@ const LeCurrentHeading = class {
|
|
|
968
968
|
}
|
|
969
969
|
}
|
|
970
970
|
render() {
|
|
971
|
-
return (h(Host, { key: '
|
|
971
|
+
return (h(Host, { key: 'c8d94a695a402039000210914b6780264a034a89' }, this.activeText ? (h("span", { class: "title", part: "title" }, this.activeText)) : (h("slot", null))));
|
|
972
972
|
}
|
|
973
973
|
static get watchers() { return {
|
|
974
974
|
"selector": ["onSelectorChange"]
|
|
@@ -1308,7 +1308,7 @@ const LeDropdownBase = class {
|
|
|
1308
1308
|
}
|
|
1309
1309
|
render() {
|
|
1310
1310
|
const dropdownWidth = this.width || (this.triggerWidth ? `${this.triggerWidth}px` : undefined);
|
|
1311
|
-
return (h(Host, { key: '
|
|
1311
|
+
return (h(Host, { key: '90bca5763b9110f8e5cad70870110cab1efeeec6' }, h("le-popover", { key: 'ebded64a4f2b23c8b1a954dd995c4d6171ef9c88', ref: el => (this.popoverEl = el), position: "bottom", align: "start", showClose: false, closeOnClickOutside: this.closeOnClickOutside, closeOnEscape: true, offset: 4, width: dropdownWidth, minWidth: "150px", "trigger-full-width": this.fullWidth, onLePopoverOpen: this.handlePopoverOpen, onLePopoverClose: this.handlePopoverClose }, h("slot", { key: '57e540660ee269de594209186d6fbe066b9c8fc1', name: "trigger", slot: "trigger" }), h("slot", { key: 'e58a76a0097f938873f5462c844ee9f1a5eece72', name: "header" }), h("div", { key: 'c4fa35069438df82894e45e87f46aef67a189c43', class: "dropdown-list", role: "listbox", "aria-multiselectable": this.multiple ? 'true' : undefined, ref: el => (this.listEl = el), style: { maxHeight: this.maxHeight } }, this.renderOptions()))));
|
|
1312
1312
|
}
|
|
1313
1313
|
static get watchers() { return {
|
|
1314
1314
|
"options": ["handleOptionsChange"],
|
|
@@ -1552,7 +1552,7 @@ const LeHeader = class {
|
|
|
1552
1552
|
'is-hidden': !this.revealed,
|
|
1553
1553
|
'is-shrunk': this.shrunk,
|
|
1554
1554
|
});
|
|
1555
|
-
return (h(Host, { key: '
|
|
1555
|
+
return (h(Host, { key: 'd1a4ae64dff81139b1c35681698539fdf072ae66', class: hostClass, onMouseEnter: () => {
|
|
1556
1556
|
if (!this.expandOnHover)
|
|
1557
1557
|
return;
|
|
1558
1558
|
this.hoverActive = true;
|
|
@@ -1562,7 +1562,7 @@ const LeHeader = class {
|
|
|
1562
1562
|
return;
|
|
1563
1563
|
this.hoverActive = false;
|
|
1564
1564
|
this.scheduleUpdate(true);
|
|
1565
|
-
} }, h("le-component", { key: '
|
|
1565
|
+
} }, h("le-component", { key: '305bc8b4aefaf2ef1dd7287422167cfd68d3e8c2', component: "le-header" }, h("header", { key: '1cf3b2ab01140e14870c1282e49e6eb3dbae5bf8', class: "header", part: "header", role: "banner", ref: el => (this.headerEl = el) }, h("div", { key: 'b238e3762dd31228f3ab3627fbca2ff1a9c630fd', class: "inner", part: "inner" }, h("div", { key: 'f186fbecc9c9b6f6f08f45c272c292af9333450e', class: "row", part: "row" }, h("div", { key: 'e496055801a36f4cf7a045513df2bc917a573786', class: "start", part: "start" }, h("le-slot", { key: '697b90a8291836452c17d2c9d3759c23b7238e93', name: "start", label: "Start", description: "Logo / back button / nav", "allowed-components": "le-button,le-text,le-tag,le-box,le-stack" }, h("slot", { key: 'e7e2b7ad283ce089def47d1f11f78a8a1603face', name: "start" }))), h("div", { key: '145aaadb93972b9018f9303baee2d5b3c42db319', class: "title", part: "title" }, h("le-slot", { key: 'c488ef0d01da476a6351ae4b7dfb397950f9c3ce', name: "title", label: "Title", description: "Header title", type: "text", tag: "span" }, h("span", { key: '78c21f46cbc81dc720e2f803cb3edc81ba5f76cf', class: "title-slot", part: "title" }, h("slot", { key: 'a47d5c8d4d0ae42b1cb4d7fab98022cbb380a27e', name: "title" })))), h("div", { key: '5fb7c5febcfb9b837f313caa65ea9b5e08b6f9cb', class: "end", part: "end" }, h("le-slot", { key: 'cc2ed75ea779a29e5c616daafec3ef90bbec3cfc', name: "end", label: "End", description: "Actions", "allowed-components": "le-button,le-text,le-tag,le-box,le-stack" }, h("slot", { key: '135e8c2c0d7a7d9bef174f380d1f31d377cb043f', name: "end" })))), h("div", { key: 'b0d9e5fba045b7cfd5640e7ba700cb44d673f982', class: "secondary", part: "secondary" }, h("le-slot", { key: '75ed60e3ddef918db1534f8818cd0f337c71e8db', name: "", label: "Secondary", description: "Secondary row content", "allowed-components": "le-tabs,le-tab-bar,le-select,le-combobox,le-text,le-stack,le-box" }, h("slot", { key: '1266dc5bb54bf22055acbfc23befb398c1ee5a31' }))))))));
|
|
1566
1566
|
}
|
|
1567
1567
|
static get watchers() { return {
|
|
1568
1568
|
"revealOnScroll": ["onBehaviorPropsChange"],
|
|
@@ -1683,7 +1683,7 @@ const LeIcon = class {
|
|
|
1683
1683
|
return svgElements;
|
|
1684
1684
|
}
|
|
1685
1685
|
render() {
|
|
1686
|
-
return (h("svg", { key: '
|
|
1686
|
+
return (h("svg", { key: '679c2641c722c5321ffc90a372d3f5fa5d748946', xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", height: this.size || 16, width: this.size || 16, viewBox: this.iconData?.viewBox || `0 0 ${this.size || 16} ${this.size || 16}` }, this.renderSVGContent(this.iconData?.children)));
|
|
1687
1687
|
}
|
|
1688
1688
|
static get assetsDirs() { return ["assets/icons"]; }
|
|
1689
1689
|
static get watchers() { return {
|
|
@@ -2692,12 +2692,12 @@ const LePopover = class {
|
|
|
2692
2692
|
popoverStyles.minWidth = this.minWidth;
|
|
2693
2693
|
if (this.maxWidth)
|
|
2694
2694
|
popoverStyles.maxWidth = this.maxWidth;
|
|
2695
|
-
return (h(Host, { key: '
|
|
2695
|
+
return (h(Host, { key: '542d4ab391a9b176d110fe00c0dd61f2c46d73ef', "trigger-full-width": this.triggerFullWidth }, h("div", { key: '2248ab763d65e8a9150e62644452085f01c6a238', class: classnames('le-popover-trigger', {
|
|
2696
2696
|
'le-popover-trigger-full-width': this.triggerFullWidth,
|
|
2697
|
-
}), ref: el => (this.triggerEl = el), onClick: this.handleTriggerClick, part: "trigger" }, h("slot", { key: '
|
|
2697
|
+
}), ref: el => (this.triggerEl = el), onClick: this.handleTriggerClick, part: "trigger" }, h("slot", { key: '9d9a5f05f4b9f1b11f1fcbb09d29f0c1e36a2cd6', name: "trigger" }, h("button", { key: 'ed573daefaffb7b1effb3c7891722aa40e4b606e', type: "button", class: "le-popover-default-trigger" }, h("span", { key: '61f00ea9761935224e1529adc3b102b85efd4f33' }, "\u2295")))), h("div", { key: 'bf447493c9c7dedb7f2ae7083c80a7a2d06aebe0', id: this.uniqueId, class: "le-popover-content",
|
|
2698
2698
|
// Always use manual mode so nested popovers can be open together.
|
|
2699
2699
|
// We implement click-outside and Escape handling ourselves.
|
|
2700
|
-
popover: "manual", ref: el => (this.popoverEl = el), style: popoverStyles, "data-fallback-open": this.supportsPopoverApi ? undefined : String(this.open) }, (this.popoverTitle || this.showClose) && (h("div", { key: '
|
|
2700
|
+
popover: "manual", ref: el => (this.popoverEl = el), style: popoverStyles, "data-fallback-open": this.supportsPopoverApi ? undefined : String(this.open) }, (this.popoverTitle || this.showClose) && (h("div", { key: '50fe79bb415b5de315aea7f766d57ae911a90343', class: "le-popover-header" }, this.popoverTitle && h("span", { key: 'd809f12c512197bd34ca215a05820b533f4d8734', class: "le-popover-title" }, this.popoverTitle), this.showClose && (h("button", { key: '2baee3e910ad65243a66eee2bba1c46d9fa628b4', type: "button", class: "le-popover-close", onClick: () => this.hide(), "aria-label": "Close" }, "\u00D7")))), h("div", { key: 'eacad60a20becde7f4f8b9fa01d195dd3f4c08f1', class: "le-popover-body", part: "content" }, h("slot", { key: 'f8aa2edd170ee039d5277a1b9ebc8ee077a1a9dc' })))));
|
|
2701
2701
|
}
|
|
2702
2702
|
};
|
|
2703
2703
|
LePopover.style = lePopoverCss();
|
|
@@ -3016,7 +3016,7 @@ const LeScrollProgress = class {
|
|
|
3016
3016
|
}
|
|
3017
3017
|
render() {
|
|
3018
3018
|
const width = `${this.progress * 100}%`;
|
|
3019
|
-
return (h(Host, { key: '
|
|
3019
|
+
return (h(Host, { key: '7a93dbfd8b14e5e581ff1480ad0e657f8f33bcf4' }, h("div", { key: 'fe4ff14af541e2a610d0b32605aaadb87ccea957', class: "track", part: "track", "aria-hidden": "true" }, h("div", { key: 'f46a09358bf77a7cff64deafa63702360a686c6a', class: "fill", part: "fill", style: { width } }))));
|
|
3020
3020
|
}
|
|
3021
3021
|
static get watchers() { return {
|
|
3022
3022
|
"trackScrollProgress": ["onTrackChange"]
|
|
@@ -3191,13 +3191,13 @@ const LeSelect = class {
|
|
|
3191
3191
|
}
|
|
3192
3192
|
render() {
|
|
3193
3193
|
const hasValue = this.selectedOption !== undefined;
|
|
3194
|
-
return (h("le-component", { key: '
|
|
3194
|
+
return (h("le-component", { key: '670430a0ca8f310b7454c7dd93098b6b57f3bb82', component: "le-select" }, h("le-dropdown-base", { key: '58716c031b14513b67a1106b90b6174fa363c8b4', ref: el => (this.dropdownEl = el), options: this.parsedOptions, value: this.value, disabled: this.disabled, filterFn: this.searchable ? this.filterOption : undefined, filterQuery: this.searchQuery, onLeOptionSelect: this.handleOptionSelect, onLeDropdownOpen: this.handleDropdownOpen, onLeDropdownClose: this.handleDropdownClose, fullWidth: this.fullWidth }, h("le-button", { key: 'b9cb202179c8fbc6dea9bc7af5ccf11deeb7c0f1', variant: this.variant && this.variant !== 'default' ? this.variant : 'outlined', slot: "trigger", align: "space-between", class: {
|
|
3195
3195
|
'select-trigger': true,
|
|
3196
3196
|
'has-value': hasValue,
|
|
3197
3197
|
'is-open': this.open,
|
|
3198
3198
|
}, mode: "default", size: this.size, disabled: this.disabled, "aria-haspopup": "listbox", "aria-expanded": this.open ? 'true' : 'false', onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown, fullWidth: this.fullWidth, iconStart: hasValue && this.selectedOption?.iconStart
|
|
3199
3199
|
? this.renderIcon(this.selectedOption.iconStart)
|
|
3200
|
-
: null, iconEnd: h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { d: "M4 6l4 4 4-4" })) }, h("span", { key: '
|
|
3200
|
+
: null, iconEnd: h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { d: "M4 6l4 4 4-4" })) }, h("span", { key: '592267788f6a02d6b501941863e91bcd68742233', class: "trigger-label" }, hasValue ? this.selectedOption.label : this.placeholder)), this.searchable && this.open && (h("div", { key: 'd4d2611e8b1f7fb243675cc11fa4982331b3c330', class: "multiselect-search", slot: "header" }, h("le-string-input", { key: 'f2a7e477eaf730173cfbca35b33d263eda860dc2', mode: "default", inputRef: el => (this.inputEl = el), class: "search-input", placeholder: "Search...", value: this.searchQuery, onInput: this.handleSearchInput })))), this.name && h("input", { key: 'bf9dc8141d02c272b0b81557dbc7c24a419ce558', type: "hidden", name: this.name, value: this.value?.toString() ?? '' })));
|
|
3201
3201
|
}
|
|
3202
3202
|
static get watchers() { return {
|
|
3203
3203
|
"value": ["handleValueChange"],
|
|
@@ -3541,7 +3541,7 @@ const LeSlot = class {
|
|
|
3541
3541
|
render() {
|
|
3542
3542
|
const displayLabel = this.label || this.name;
|
|
3543
3543
|
// Always render the same structure, CSS handles visibility via .admin-mode class
|
|
3544
|
-
return (h(Host, { key: '
|
|
3544
|
+
return (h(Host, { key: '8a48f7865340d9a2e201a2f878b2f1c66c55d86c', class: {
|
|
3545
3545
|
'admin-mode': this.adminMode,
|
|
3546
3546
|
'invalid-html': !this.isValidHtml,
|
|
3547
3547
|
}, role: this.adminMode ? 'region' : undefined, "aria-label": this.adminMode ? `Slot: ${displayLabel}` : undefined, "data-slot-name": this.name, "data-slot-type": this.type, "data-allowed": this.allowedComponents, "data-multiple": this.multiple, "data-required": this.required }, this.adminMode ? (h("div", { class: "le-slot-container" }, h("div", { class: classnames('le-slot-header', {
|
|
@@ -3679,11 +3679,11 @@ const LeStringInput = class {
|
|
|
3679
3679
|
ev.stopPropagation();
|
|
3680
3680
|
};
|
|
3681
3681
|
render() {
|
|
3682
|
-
return (h("le-component", { key: '
|
|
3682
|
+
return (h("le-component", { key: '385fe7607d573ab4cfe81315f74e650f8e57faa1', component: "le-string-input", hostClass: classnames({ disabled: this.disabled }) }, h("div", { key: 'a36c5a32238eb6c9c574aeb3955343e042d89225', class: "le-input-wrapper" }, this.label && (h("label", { key: 'c1ff01932ada19ecea0cd2e2b477615d0c873ff0', class: "le-input-label", htmlFor: this.name }, this.label)), h("div", { key: '7c8909ed5e4e3404a2900a3f9beef8b0f331d62c', class: "le-input-container", part: "container" }, this.iconStart && h("span", { key: 'cf7e7355e22de3100bade2399ba63702731350e0', class: "icon-start" }, this.iconStart), h("input", { key: '6d71245d395f6cd2c55110ca902fc0374c74026b', ref: el => {
|
|
3683
3683
|
if (this.inputRef) {
|
|
3684
3684
|
this.inputRef(el);
|
|
3685
3685
|
}
|
|
3686
|
-
}, id: this.name, type: this.type, name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, onInput: this.handleInput, onChange: this.handleChange, onClick: this.handleClick }), this.iconEnd && h("span", { key: '
|
|
3686
|
+
}, id: this.name, type: this.type, name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, onInput: this.handleInput, onChange: this.handleChange, onClick: this.handleClick }), this.iconEnd && h("span", { key: 'e086f9559b086212be3cd231b7c870cdb229a733', class: "icon-end" }, this.iconEnd)), !this.hideDescription && (h("div", { key: '531ac78b43382166023a79475152345956188bcc', class: "le-input-description" }, h("le-slot", { key: '38700e86adc0c3bf049b0ad828d14993ddef7844', name: "description", type: "text", tag: "p", label: "Description" }, h("slot", { key: 'c2982e93304a872ec79446fe525eb5448e764401', name: "description" })))))));
|
|
3687
3687
|
}
|
|
3688
3688
|
};
|
|
3689
3689
|
LeStringInput.style = leStringInputCss();
|
|
@@ -0,0 +1,179 @@
|
|
|
1
|
+
import { r as registerInstance, c as createEvent, a as getElement, h } from './index-DFTm5BqT.js';
|
|
2
|
+
import { c as classnames } from './utils-DZYCZLrF.js';
|
|
3
|
+
|
|
4
|
+
const leCodeInputCss = () => `:host{display:block;--le-input-bg:var(--le-color-surface, #ffffff);--le-input-color:var(--le-color-text-primary, #333333);--le-input-border:var(--le-border-width, 2px) solid var(--le-color-border-input, #007bff);--le-input-radius:var(--le-radius-sm, 4px);--le-input-border-focus:2px solid var(--le-color-focus);--le-input-border-focus-offset:2px}.le-code-input-wrapper{position:relative;display:flex;flex-direction:column}.le-input-label{display:block;margin-bottom:var(--le-spacing-2, 0.5rem);color:var(--le-text-color, inherit);font-size:var(--le-font-size-sm, 0.875rem);font-weight:500}.input-group{position:relative;display:inline-flex;width:fit-content}.ghost-input{position:absolute;inset:0;width:100%;height:100%;opacity:0;z-index:10;cursor:text;color:transparent;background:transparent;caret-color:transparent;border:none;outline:none;letter-spacing:1em;}.ghost-input:disabled{cursor:not-allowed}.visual-container{display:flex;gap:var(--le-spacing-2, 8px);pointer-events:none;}.code-box{position:relative;width:var(--le-code-box-size, 32px);height:var(--le-code-box-size, 42px);display:flex;align-items:center;justify-content:center;background:var(--le-input-bg);border:var(--le-input-border);border-radius:var(--le-input-radius);color:var(--le-input-color);font-size:1.2rem;transition:all 0.15s ease-in-out;box-sizing:border-box;user-select:none}.code-box.active{outline:var(--le-input-border-focus);outline-offset:var(--le-input-border-focus-offset);z-index:1}.code-box.selected{background-color:SelectedItem;outline:var(--le-input-border-focus);outline-offset:var(--le-input-border-focus-offset)}.input-group.has-error .code-box{border:var(--le-input-border-error, 1px solid #ef4444)}.input-group.has-error .code-box.active{border-width:2px}:host(.disabled) .code-box{background-color:var(--le-color-disabled-bg, #f3f4f6);color:var(--le-color-disabled-text, #9ca3af);border-color:var(--le-color-disabled-border, #e5e7eb)}.le-input-description,:host(p){margin-top:var(--le-spacing-1, 0.25rem);color:var(--le-text-muted, #6b7280);font-size:var(--le-font-size-sm, 0.875rem)}`;
|
|
5
|
+
|
|
6
|
+
const LeCodeInput = class {
|
|
7
|
+
constructor(hostRef) {
|
|
8
|
+
registerInstance(this, hostRef);
|
|
9
|
+
this.leChange = createEvent(this, "leChange");
|
|
10
|
+
this.leInput = createEvent(this, "leInput");
|
|
11
|
+
this.leFocus = createEvent(this, "leFocus");
|
|
12
|
+
this.leBlur = createEvent(this, "leBlur");
|
|
13
|
+
}
|
|
14
|
+
get el() { return getElement(this); }
|
|
15
|
+
/**
|
|
16
|
+
* The value of the input
|
|
17
|
+
*/
|
|
18
|
+
value = '';
|
|
19
|
+
/**
|
|
20
|
+
* The name of the input
|
|
21
|
+
*/
|
|
22
|
+
name;
|
|
23
|
+
/**
|
|
24
|
+
* Label for the input
|
|
25
|
+
*/
|
|
26
|
+
label;
|
|
27
|
+
/**
|
|
28
|
+
* Length of the code (number of characters)
|
|
29
|
+
*/
|
|
30
|
+
length = 6;
|
|
31
|
+
/**
|
|
32
|
+
* Description text displayed below the input
|
|
33
|
+
* in case there is a more complex markup,
|
|
34
|
+
* it can be provided via slot as well
|
|
35
|
+
*/
|
|
36
|
+
description;
|
|
37
|
+
/**
|
|
38
|
+
* The type of code (numeric or alphanumeric)
|
|
39
|
+
* This affects the keyboard layout on mobile devices.
|
|
40
|
+
*/
|
|
41
|
+
type = 'text';
|
|
42
|
+
/**
|
|
43
|
+
* Whether the input is disabled
|
|
44
|
+
*/
|
|
45
|
+
disabled = false;
|
|
46
|
+
/**
|
|
47
|
+
* Whether the input is read-only
|
|
48
|
+
*/
|
|
49
|
+
readonly = false;
|
|
50
|
+
/**
|
|
51
|
+
* External ID for linking with external systems
|
|
52
|
+
*/
|
|
53
|
+
externalId;
|
|
54
|
+
/**
|
|
55
|
+
* Internal validation state (can be set externally manually or via simple check)
|
|
56
|
+
*/
|
|
57
|
+
error = false;
|
|
58
|
+
/**
|
|
59
|
+
* Emitted when the value changes (on blur or Enter)
|
|
60
|
+
*/
|
|
61
|
+
leChange;
|
|
62
|
+
/**
|
|
63
|
+
* Emitted when the input value changes (on keystroke)
|
|
64
|
+
*/
|
|
65
|
+
leInput;
|
|
66
|
+
/**
|
|
67
|
+
* Emitted when the input is focused
|
|
68
|
+
*/
|
|
69
|
+
leFocus;
|
|
70
|
+
/**
|
|
71
|
+
* Emitted when the input is blurred
|
|
72
|
+
*/
|
|
73
|
+
leBlur;
|
|
74
|
+
isFocused = false;
|
|
75
|
+
selectionStart = 0;
|
|
76
|
+
selectionEnd = 0;
|
|
77
|
+
valueChanged(newValue) {
|
|
78
|
+
if (newValue && newValue.length > this.length) {
|
|
79
|
+
this.value = newValue.slice(0, this.length);
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
componentWillLoad() {
|
|
83
|
+
if (this.value && this.value.length > this.length) {
|
|
84
|
+
this.value = this.value.slice(0, this.length);
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
handleInput = (ev) => {
|
|
88
|
+
const input = ev.target;
|
|
89
|
+
let val = input.value;
|
|
90
|
+
// Enforce length limit
|
|
91
|
+
if (val.length > this.length) {
|
|
92
|
+
val = val.slice(0, this.length);
|
|
93
|
+
// We need to force update the input value if it exceeded length
|
|
94
|
+
// because Stencil prop update might not happen if value is same as prop but input is different
|
|
95
|
+
input.value = val;
|
|
96
|
+
}
|
|
97
|
+
this.value = val;
|
|
98
|
+
this.updateSelection(input);
|
|
99
|
+
this.leInput.emit({
|
|
100
|
+
value: this.value,
|
|
101
|
+
name: this.name,
|
|
102
|
+
externalId: this.externalId,
|
|
103
|
+
});
|
|
104
|
+
};
|
|
105
|
+
handleChange = () => {
|
|
106
|
+
this.leChange.emit({
|
|
107
|
+
value: this.value,
|
|
108
|
+
name: this.name,
|
|
109
|
+
externalId: this.externalId,
|
|
110
|
+
});
|
|
111
|
+
};
|
|
112
|
+
handleFocus = (ev) => {
|
|
113
|
+
this.isFocused = true;
|
|
114
|
+
const input = ev.target;
|
|
115
|
+
// Move cursor to the end on focus so typing appends to current value
|
|
116
|
+
window.requestAnimationFrame(() => {
|
|
117
|
+
const len = input.value.length;
|
|
118
|
+
input.setSelectionRange(len, len);
|
|
119
|
+
this.updateSelection(input);
|
|
120
|
+
});
|
|
121
|
+
this.leFocus.emit();
|
|
122
|
+
};
|
|
123
|
+
handleBlur = () => {
|
|
124
|
+
this.isFocused = false;
|
|
125
|
+
this.leBlur.emit();
|
|
126
|
+
// Trigger change on blur
|
|
127
|
+
this.handleChange();
|
|
128
|
+
};
|
|
129
|
+
handleSelect = (ev) => {
|
|
130
|
+
this.updateSelection(ev.target);
|
|
131
|
+
};
|
|
132
|
+
updateSelection(input) {
|
|
133
|
+
this.selectionStart = input.selectionStart || 0;
|
|
134
|
+
this.selectionEnd = input.selectionEnd || 0;
|
|
135
|
+
}
|
|
136
|
+
/**
|
|
137
|
+
* Helper to determine active index for focus ring
|
|
138
|
+
*/
|
|
139
|
+
getActiveIndex() {
|
|
140
|
+
if (!this.isFocused)
|
|
141
|
+
return -1;
|
|
142
|
+
// If we have a range selection, usually focus ring is not shown or shown around selection?
|
|
143
|
+
// We'll stick to showing it at the cursor end (selectionEnd) or start?
|
|
144
|
+
// If range selected, `selectionStart` is start of range.
|
|
145
|
+
// If cursor is at the very end (pos == length), we highlight the last box
|
|
146
|
+
if (this.selectionStart === this.length && this.length > 0) {
|
|
147
|
+
return this.length - 1;
|
|
148
|
+
}
|
|
149
|
+
return this.selectionStart;
|
|
150
|
+
}
|
|
151
|
+
renderBoxes() {
|
|
152
|
+
const boxes = [];
|
|
153
|
+
const activeIndex = this.getActiveIndex();
|
|
154
|
+
const isRangeSelection = this.selectionEnd - this.selectionStart > 0;
|
|
155
|
+
for (let i = 0; i < this.length; i++) {
|
|
156
|
+
const char = this.value ? this.value[i] : '';
|
|
157
|
+
const isActive = this.isFocused && !isRangeSelection && i === activeIndex;
|
|
158
|
+
const isSelected = this.isFocused && isRangeSelection && i >= this.selectionStart && i < this.selectionEnd;
|
|
159
|
+
boxes.push(h("div", { class: classnames('code-box', {
|
|
160
|
+
'active': isActive,
|
|
161
|
+
'selected': isSelected,
|
|
162
|
+
'has-value': !!char,
|
|
163
|
+
}) }, char));
|
|
164
|
+
}
|
|
165
|
+
return boxes;
|
|
166
|
+
}
|
|
167
|
+
render() {
|
|
168
|
+
return (h("le-component", { key: '74615aa06971f7b2883e4a8e6f77b76918722e53', component: "le-code-input", hostClass: classnames({ 'disabled': this.disabled, 'has-error': this.error }) }, h("div", { key: '423a974717f0676b266a362d0151540577ae8845', class: "le-code-input-wrapper" }, this.label && (h("label", { key: 'f2ba7d9c8a8a400ca31adc944919e4750785503d', class: "le-input-label", htmlFor: this.name }, this.label)), h("div", { key: 'f56b80ffc1362c164bdfe473877d934c252c9bd5', class: classnames('input-group', { 'has-error': this.error }) }, h("input", { key: 'a94d422a0884c731ecfc6221133d725057fbb87c', class: "ghost-input", id: this.name, name: this.name, type: "text", inputMode: this.type === 'number' ? 'numeric' : 'text', pattern: this.type === 'number' ? '[0-9]*' : undefined, autocomplete: "one-time-code", value: this.value, maxLength: this.length, disabled: this.disabled, readOnly: this.readonly, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, onSelect: this.handleSelect,
|
|
169
|
+
// Prevent browser autofill background from messing up visual
|
|
170
|
+
spellcheck: false, autoCapitalize: "none", autoCorrect: "off" }), h("div", { key: '9436ca5298d83aae923e762748d634b9517a3b17', class: "visual-container" }, this.renderBoxes())), !this.error && (h("div", { key: '398a377af9c6c26f441e94b3598a1007c64e6ea0', class: "le-input-description" }, h("le-slot", { key: '3d9a8c248efc57ffa026f9ffdf889599b276f344', name: "description", type: "text", tag: "p", label: "Description" }, h("slot", { key: '6873dec4bea990f9fe6de013e8fa729fc385871c', name: "description" }, this.description)))))));
|
|
171
|
+
}
|
|
172
|
+
static get watchers() { return {
|
|
173
|
+
"value": ["valueChanged"]
|
|
174
|
+
}; }
|
|
175
|
+
};
|
|
176
|
+
LeCodeInput.style = leCodeInputCss();
|
|
177
|
+
|
|
178
|
+
export { LeCodeInput as le_code_input };
|
|
179
|
+
//# sourceMappingURL=le-code-input.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"le-code-input.entry.js","sources":["src/components/le-code-input/le-code-input.css?tag=le-code-input&encapsulation=shadow","src/components/le-code-input/le-code-input.tsx"],"sourcesContent":[":host {\n display: block;\n\n --le-input-bg: var(--le-color-surface, #ffffff);\n --le-input-color: var(--le-color-text-primary, #333333);\n --le-input-border: var(--le-border-width, 2px) solid var(--le-color-border-input, #007bff);\n --le-input-radius: var(--le-radius-sm, 4px);\n --le-input-border-focus: 2px solid var(--le-color-focus);\n --le-input-border-focus-offset: 2px;\n}\n\n.le-code-input-wrapper {\n position: relative;\n display: flex;\n flex-direction: column;\n}\n\n.le-input-label {\n display: block;\n margin-bottom: var(--le-spacing-2, 0.5rem);\n color: var(--le-text-color, inherit);\n font-size: var(--le-font-size-sm, 0.875rem);\n font-weight: 500;\n}\n\n.input-group {\n position: relative;\n display: inline-flex;\n width: fit-content;\n}\n\n.ghost-input {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n z-index: 10;\n cursor: text;\n color: transparent;\n background: transparent;\n caret-color: transparent;\n border: none;\n outline: none;\n letter-spacing: 1em; /* Try to match boxes? */\n}\n\n.ghost-input:disabled {\n cursor: not-allowed;\n}\n\n.visual-container {\n display: flex;\n gap: var(--le-spacing-2, 8px);\n pointer-events: none; /* Let clicks pass to ghost input */\n}\n\n.code-box {\n position: relative;\n width: var(--le-code-box-size, 32px);\n height: var(--le-code-box-size, 42px);\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--le-input-bg);\n border: var(--le-input-border);\n border-radius: var(--le-input-radius);\n color: var(--le-input-color);\n font-size: 1.2rem;\n transition: all 0.15s ease-in-out;\n box-sizing: border-box;\n user-select: none;\n}\n\n.code-box.active {\n outline: var(--le-input-border-focus);\n outline-offset: var(--le-input-border-focus-offset);\n z-index: 1;\n}\n\n.code-box.selected {\n background-color: SelectedItem;\n outline: var(--le-input-border-focus);\n outline-offset: var(--le-input-border-focus-offset);\n}\n\n.input-group.has-error .code-box {\n border: var(--le-input-border-error, 1px solid #ef4444);\n}\n\n.input-group.has-error .code-box.active {\n border-width: 2px;\n}\n\n:host(.disabled) .code-box {\n background-color: var(--le-color-disabled-bg, #f3f4f6);\n color: var(--le-color-disabled-text, #9ca3af);\n border-color: var(--le-color-disabled-border, #e5e7eb);\n}\n\n.le-input-description,\n:host(p) {\n margin-top: var(--le-spacing-1, 0.25rem);\n color: var(--le-text-muted, #6b7280);\n font-size: var(--le-font-size-sm, 0.875rem);\n}\n","import { Component, Prop, Event, EventEmitter, State, h, Element, Watch } from '@stencil/core';\nimport { classnames } from '../../utils/utils';\n\n/**\n * A one-time code input component with individual frames for each character.\n * Supports standard copy/paste and range selection behaviors.\n *\n * @slot description - Additional description text displayed below the input\n *\n * @cssprop --le-code-box-size - Size of each character box (default: 40px width, 48px height)\n * @cssprop --le-input-bg - Input background color\n * @cssprop --le-input-color - Input text color\n * @cssprop --le-input-border - Input border style\n * @cssprop --le-input-border-focus - Input border style when focused\n * @cssprop --le-input-border-error - Input border style when invalid\n * @cssprop --le-input-radius - Input border radius\n */\n@Component({\n tag: 'le-code-input',\n styleUrl: 'le-code-input.css',\n shadow: true,\n})\nexport class LeCodeInput {\n @Element() el: HTMLElement;\n\n /**\n * The value of the input\n */\n @Prop({ mutable: true, reflect: true }) value: string = '';\n\n /**\n * The name of the input\n */\n @Prop() name: string;\n\n /**\n * Label for the input\n */\n @Prop() label: string;\n\n /**\n * Length of the code (number of characters)\n */\n @Prop() length: number = 6;\n\n /**\n * Description text displayed below the input\n * in case there is a more complex markup,\n * it can be provided via slot as well\n */\n @Prop() description?: string;\n\n /**\n * The type of code (numeric or alphanumeric)\n * This affects the keyboard layout on mobile devices.\n */\n @Prop() type: 'text' | 'number' = 'text';\n\n /**\n * Whether the input is disabled\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Whether the input is read-only\n */\n @Prop() readonly: boolean = false;\n\n /**\n * External ID for linking with external systems\n */\n @Prop() externalId: string;\n\n /**\n * Internal validation state (can be set externally manually or via simple check)\n */\n @Prop() error: boolean = false;\n\n /**\n * Emitted when the value changes (on blur or Enter)\n */\n @Event() leChange: EventEmitter<{ value: string; name: string; externalId: string }>;\n\n /**\n * Emitted when the input value changes (on keystroke)\n */\n @Event() leInput: EventEmitter<{ value: string; name: string; externalId: string }>;\n\n /**\n * Emitted when the input is focused\n */\n @Event() leFocus: EventEmitter<void>;\n\n /**\n * Emitted when the input is blurred\n */\n @Event() leBlur: EventEmitter<void>;\n\n @State() private isFocused: boolean = false;\n @State() private selectionStart: number = 0;\n @State() private selectionEnd: number = 0;\n\n @Watch('value')\n valueChanged(newValue: string) {\n if (newValue && newValue.length > this.length) {\n this.value = newValue.slice(0, this.length);\n }\n }\n\n componentWillLoad() {\n if (this.value && this.value.length > this.length) {\n this.value = this.value.slice(0, this.length);\n }\n }\n\n private handleInput = (ev: Event) => {\n const input = ev.target as HTMLInputElement;\n let val = input.value;\n\n // Enforce length limit\n if (val.length > this.length) {\n val = val.slice(0, this.length);\n // We need to force update the input value if it exceeded length\n // because Stencil prop update might not happen if value is same as prop but input is different\n input.value = val;\n }\n\n this.value = val;\n this.updateSelection(input);\n\n this.leInput.emit({\n value: this.value,\n name: this.name,\n externalId: this.externalId,\n });\n };\n\n private handleChange = () => {\n this.leChange.emit({\n value: this.value,\n name: this.name,\n externalId: this.externalId,\n });\n };\n\n private handleFocus = (ev: Event) => {\n this.isFocused = true;\n const input = ev.target as HTMLInputElement;\n\n // Move cursor to the end on focus so typing appends to current value\n window.requestAnimationFrame(() => {\n const len = input.value.length;\n input.setSelectionRange(len, len);\n this.updateSelection(input);\n });\n\n this.leFocus.emit();\n };\n\n private handleBlur = () => {\n this.isFocused = false;\n this.leBlur.emit();\n // Trigger change on blur\n this.handleChange();\n };\n\n private handleSelect = (ev: Event) => {\n this.updateSelection(ev.target as HTMLInputElement);\n };\n\n private updateSelection(input: HTMLInputElement) {\n this.selectionStart = input.selectionStart || 0;\n this.selectionEnd = input.selectionEnd || 0;\n }\n\n /**\n * Helper to determine active index for focus ring\n */\n private getActiveIndex(): number {\n if (!this.isFocused) return -1;\n\n // If we have a range selection, usually focus ring is not shown or shown around selection?\n // We'll stick to showing it at the cursor end (selectionEnd) or start?\n // If range selected, `selectionStart` is start of range.\n\n // If cursor is at the very end (pos == length), we highlight the last box\n if (this.selectionStart === this.length && this.length > 0) {\n return this.length - 1;\n }\n\n return this.selectionStart;\n }\n\n private renderBoxes() {\n const boxes = [];\n const activeIndex = this.getActiveIndex();\n const isRangeSelection = this.selectionEnd - this.selectionStart > 0;\n\n for (let i = 0; i < this.length; i++) {\n const char = this.value ? this.value[i] : '';\n const isActive = this.isFocused && !isRangeSelection && i === activeIndex;\n const isSelected =\n this.isFocused && isRangeSelection && i >= this.selectionStart && i < this.selectionEnd;\n\n boxes.push(\n <div\n class={classnames('code-box', {\n 'active': isActive,\n 'selected': isSelected,\n 'has-value': !!char,\n })}\n >\n {char}\n </div>,\n );\n }\n return boxes;\n }\n\n render() {\n return (\n <le-component\n component=\"le-code-input\"\n hostClass={classnames({ 'disabled': this.disabled, 'has-error': this.error })}\n >\n <div class=\"le-code-input-wrapper\">\n {this.label && (\n <label class=\"le-input-label\" htmlFor={this.name}>\n {this.label}\n </label>\n )}\n\n <div class={classnames('input-group', { 'has-error': this.error })}>\n <input\n class=\"ghost-input\"\n id={this.name}\n name={this.name}\n type=\"text\"\n inputMode={this.type === 'number' ? 'numeric' : 'text'}\n pattern={this.type === 'number' ? '[0-9]*' : undefined}\n autocomplete=\"one-time-code\"\n value={this.value}\n maxLength={this.length}\n disabled={this.disabled}\n readOnly={this.readonly}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n onSelect={this.handleSelect}\n // Prevent browser autofill background from messing up visual\n spellcheck={false}\n autoCapitalize=\"none\"\n autoCorrect=\"off\"\n />\n\n <div class=\"visual-container\">{this.renderBoxes()}</div>\n </div>\n\n {!this.error && (\n <div class=\"le-input-description\">\n <le-slot name=\"description\" type=\"text\" tag=\"p\" label=\"Description\">\n <slot name=\"description\">{this.description}</slot>\n </le-slot>\n </div>\n )}\n </div>\n </le-component>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -222,7 +222,7 @@ const LeCombobox = class {
|
|
|
222
222
|
}
|
|
223
223
|
render() {
|
|
224
224
|
const hasValue = this.inputValue.length > 0;
|
|
225
|
-
return (h("le-component", { key: '
|
|
225
|
+
return (h("le-component", { key: '77660875e900dceb4cca50087a9ea7fad38d0de8', component: "le-combobox" }, h("le-dropdown-base", { key: 'a7d46b3226322945465a8d22c87c3df1939d0c11', ref: el => (this.dropdownEl = el), options: this.parsedOptions, value: this.value, disabled: this.disabled, filterFn: this.filterOption, filterQuery: this.inputValue, emptyText: this.emptyText, fullWidth: this.fullWidth, closeOnClickOutside: false, onLeOptionSelect: this.handleOptionSelect, onLeDropdownOpen: this.handleDropdownOpen, onLeDropdownClose: this.handleDropdownClose }, h("div", { key: 'bc402ba87163d604c49d41acf32a2da7710c12d5', slot: "trigger", class: { 'combobox-trigger': true, 'is-open': this.open } }, h("le-string-input", { key: 'd676bb665963d090e88195b133f7a0f5e379b9e9', mode: "default", hideDescription: true, inputRef: el => (this.inputEl = el), type: "text", class: "combobox-input", value: this.inputValue, placeholder: this.placeholder, disabled: this.disabled, "aria-haspopup": "listbox", "aria-expanded": this.open ? 'true' : 'false', "aria-autocomplete": "list", onInput: this.handleInputChange, onFocus: this.handleInputFocus, onKeyDown: this.handleInputKeyDown }), hasValue && !this.disabled && (h("button", { key: '78446bc41c35fa2815acbfc34ea377dc33a1e55b', type: "button", class: "combobox-clear", onClick: this.handleClear, "aria-label": "Clear", tabIndex: -1 }, h("svg", { key: 'a596191694990ebb2e48d1529da0e0a6eb61e5b9', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: 'd6503800924e82555571c8955b33bcfddd90c7d0', d: "M4 4l8 8M12 4l-8 8" })))), h("span", { key: 'a032adbc03c135bf0e9c28f7272fa125c22fd37c', class: "combobox-arrow" }, h("svg", { key: '258a8d6a98071654a8bf59ac23dc517a9af19daa', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '5960ffe0d91ae52563420fa901653e17d458b522', d: "M4 6l4 4 4-4" }))))), this.name && h("input", { key: '44791ad0af7eae39a3d8b7cabf12a68b11fc20ba', type: "hidden", name: this.name, value: this.value?.toString() ?? '' })));
|
|
226
226
|
}
|
|
227
227
|
static get watchers() { return {
|
|
228
228
|
"value": ["handleValueChange"],
|
|
@@ -5,7 +5,7 @@ const LeHeaderPlaceholder = class {
|
|
|
5
5
|
registerInstance(this, hostRef);
|
|
6
6
|
}
|
|
7
7
|
render() {
|
|
8
|
-
return (h(Host, { key: '
|
|
8
|
+
return (h(Host, { key: '0b056eac512d668bc8c3aa7000bdc7363dace713', "aria-hidden": "true", style: {
|
|
9
9
|
display: 'block',
|
|
10
10
|
height: 'var(--le-header-height, 64px)',
|
|
11
11
|
} }));
|
package/dist/esm/le-kit.js
CHANGED
|
@@ -16,7 +16,7 @@ var patchBrowser = () => {
|
|
|
16
16
|
|
|
17
17
|
patchBrowser().then(async (options) => {
|
|
18
18
|
await globalScripts();
|
|
19
|
-
return bootstrapLazy(JSON.parse("[[\"le-bar_16\",[[769,\"le-navigation\",{\"items\":[1],\"orientation\":[513],\"wrap\":[516],\"overflowMode\":[513,\"overflow-mode\"],\"minVisibleItemsForMore\":[2,\"min-visible-items-for-more\"],\"align\":[513],\"activeUrl\":[1,\"active-url\"],\"searchable\":[4],\"searchPlaceholder\":[1,\"search-placeholder\"],\"emptyText\":[1,\"empty-text\"],\"submenuSearchable\":[4,\"submenu-searchable\"],\"searchQuery\":[32],\"openState\":[32],\"overflowIds\":[32],\"hamburgerActive\":[32],\"submenuQueries\":[32],\"overflowPopoverOpen\":[32]},null,{\"items\":[\"handleLayoutInputsChange\"],\"orientation\":[\"handleLayoutInputsChange\"],\"wrap\":[\"handleLayoutInputsChange\"],\"overflowMode\":[\"handleLayoutInputsChange\"]}],[769,\"le-header\",{\"isStatic\":[516,\"static\"],\"sticky\":[516],\"fixed\":[516],\"revealOnScroll\":[513,\"reveal-on-scroll\"],\"shrinkOffset\":[513,\"shrink-offset\"],\"expandOnHover\":[516,\"expand-on-hover\"],\"revealed\":[32],\"shrunk\":[32],\"placeholderHeight\":[32],\"hoverActive\":[32]},[[9,\"scroll\",\"onWindowScroll\"],[9,\"resize\",\"onWindowResize\"]],{\"revealOnScroll\":[\"onBehaviorPropsChange\"],\"shrinkOffset\":[\"onBehaviorPropsChange\"],\"fixed\":[\"onBehaviorPropsChange\"],\"sticky\":[\"onBehaviorPropsChange\"],\"isStatic\":[\"onBehaviorPropsChange\"]}],[769,\"le-current-heading\",{\"selector\":[1],\"activeText\":[32]},[[9,\"scroll\",\"onScroll\"],[9,\"resize\",\"onResize\"]],{\"selector\":[\"onSelectorChange\"]}],[769,\"le-scroll-progress\",{\"trackScrollProgress\":[513,\"track-scroll-progress\"],\"progress\":[32]},[[9,\"scroll\",\"onScroll\"],[9,\"resize\",\"onResize\"]],{\"trackScrollProgress\":[\"onTrackChange\"]}],[769,\"le-collapse\",{\"closed\":[1540],\"scrollDown\":[516,\"scroll-down\"],\"noFading\":[516,\"no-fading\"],\"collapseOnHeaderShrink\":[516,\"collapse-on-header-shrink\"],\"headerShrunk\":[32]},[[8,\"leHeaderShrinkChange\",\"handleHeaderShrink\"]],{\"open\":[\"onOpenChange\"],\"headerShrunk\":[\"onDrivenStateChange\"]}],[769,\"le-bar\",{\"overflow\":[513],\"alignItems\":[513,\"align-items\"],\"arrows\":[4],\"disablePopover\":[4,\"disable-popover\"],\"minVisibleItems\":[2,\"min-visible-items\"],\"showAllMenu\":[8,\"show-all-menu\"],\"popoverOpen\":[32],\"hamburgerActive\":[32],\"overflowingIds\":[32],\"canScrollStart\":[32],\"canScrollEnd\":[32],\"allMenuOpen\":[32],\"containerHeight\":[32],\"recalculate\":[64]},[[0,\"slotchange\",\"handleSlotChange\"]],{\"overflow\":[\"handleOverflowChange\"]}],[769,\"le-icon\",{\"name\":[1],\"size\":[2],\"iconData\":[32],\"visible\":[32]},null,{\"name\":[\"loadIconData\"]}],[769,\"le-dropdown-base\",{\"options\":[16],\"value\":[8],\"multiple\":[4],\"open\":[1540],\"disabled\":[516],\"filterFn\":[16],\"filterQuery\":[1,\"filter-query\"],\"emptyText\":[1,\"empty-text\"],\"showCheckboxes\":[4,\"show-checkboxes\"],\"maxHeight\":[1,\"max-height\"],\"width\":[1],\"fullWidth\":[4,\"full-width\"],\"closeOnClickOutside\":[4,\"close-on-click-outside\"],\"focusedIndex\":[32],\"filteredOptions\":[32],\"show\":[64],\"hide\":[64],\"toggle\":[64]},null,{\"options\":[\"handleOptionsChange\"],\"filterQuery\":[\"handleOptionsChange\"]}],[769,\"le-button\",{\"mode\":[1537],\"variant\":[1],\"color\":[1],\"size\":[1],\"selected\":[4],\"fullWidth\":[516,\"full-width\"],\"iconOnly\":[1,\"icon-only\"],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"disabled\":[4],\"type\":[1],\"href\":[1],\"target\":[1],\"align\":[1]}],[769,\"le-checkbox\",{\"checked\":[1540],\"disabled\":[4],\"name\":[1],\"value\":[1],\"externalId\":[1,\"external-id\"]}],[769,\"le-component\",{\"component\":[1],\"displayName\":[1,\"display-name\"],\"hostClass\":[1,\"host-class\"],\"hostStyle\":[16],\"adminMode\":[32],\"componentMeta\":[32],\"propertyValues\":[32]}],[769,\"le-popup\",{\"mode\":[1537],\"open\":[1540],\"type\":[1],\"popupTitle\":[1,\"popup-title\"],\"message\":[1],\"modal\":[4],\"position\":[1],\"confirmText\":[1,\"confirm-text\"],\"cancelText\":[1,\"cancel-text\"],\"placeholder\":[1],\"defaultValue\":[1,\"default-value\"],\"closeOnBackdrop\":[4,\"close-on-backdrop\"],\"inputValue\":[32],\"show\":[64],\"hide\":[64]}],[769,\"le-select\",{\"options\":[1],\"value\":[1032],\"placeholder\":[1],\"disabled\":[516],\"required\":[4],\"name\":[1],\"fullWidth\":[4,\"full-width\"],\"size\":[513],\"variant\":[513],\"searchable\":[4],\"emptyText\":[1,\"empty-text\"],\"open\":[1540],\"selectedOption\":[32],\"searchQuery\":[32],\"showDropdown\":[64],\"hideDropdown\":[64]},null,{\"value\":[\"handleValueChange\"],\"options\":[\"handleOptionsChange\"]}],[769,\"le-slot\",{\"type\":[1],\"name\":[1],\"label\":[1],\"description\":[1],\"allowedComponents\":[1,\"allowed-components\"],\"multiple\":[4],\"required\":[4],\"placeholder\":[1],\"tag\":[1],\"slotStyle\":[1,\"slot-style\"],\"adminMode\":[32],\"textValue\":[32],\"isValidHtml\":[32],\"availableComponents\":[32],\"pickerOpen\":[32]}],[769,\"le-string-input\",{\"inputRef\":[16],\"mode\":[1537],\"value\":[1537],\"name\":[1],\"type\":[1],\"label\":[1],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"placeholder\":[1],\"hideDescription\":[4,\"hide-description\"],\"disabled\":[4],\"readonly\":[4],\"externalId\":[1,\"external-id\"]}],[769,\"le-popover\",{\"mode\":[1537],\"open\":[1540],\"position\":[1],\"align\":[1],\"popoverTitle\":[1,\"popover-title\"],\"showClose\":[4,\"show-close\"],\"closeOnClickOutside\":[4,\"close-on-click-outside\"],\"closeOnEscape\":[4,\"close-on-escape\"],\"offset\":[2],\"width\":[1],\"minWidth\":[1,\"min-width\"],\"maxWidth\":[1,\"max-width\"],\"triggerFullWidth\":[4,\"trigger-full-width\"],\"isPositioned\":[32],\"updatePosition\":[64],\"show\":[64],\"hide\":[64],\"toggle\":[64]}]]],[\"le-multiselect\",[[769,\"le-multiselect\",{\"options\":[1],\"value\":[1040],\"placeholder\":[1],\"disabled\":[516],\"required\":[4],\"name\":[1],\"fullWidth\":[516,\"full-width\"],\"size\":[513],\"maxSelections\":[2,\"max-selections\"],\"showSelectAll\":[1032,\"show-select-all\"],\"searchable\":[4],\"emptyText\":[1,\"empty-text\"],\"open\":[1540],\"selectAllLabel\":[32],\"deselectAllLabel\":[32],\"selectedOptions\":[32],\"searchQuery\":[32],\"showDropdown\":[64],\"hideDropdown\":[64],\"clearSelection\":[64]},null,{\"value\":[\"handleValueChange\"],\"options\":[\"handleOptionsChange\"],\"showSelectAll\":[\"handleShowSelectAllChange\"]}]]],[\"le-segmented-control\",[[769,\"le-segmented-control\",{\"options\":[16],\"value\":[1032],\"size\":[1],\"overflow\":[1],\"fullWidth\":[4,\"full-width\"],\"disabled\":[4],\"segmentConfigs\":[32],\"focusedIndex\":[32],\"isDeclarativeMode\":[32]},[[0,\"slotchange\",\"handleSlotChange\"]],{\"options\":[\"tabsChanged\"]}]]],[\"le-side-panel\",[[769,\"le-side-panel\",{\"panelId\":[1,\"panel-id\"],\"side\":[1],\"collapseAt\":[1,\"collapse-at\"],\"narrowBehavior\":[1,\"narrow-behavior\"],\"open\":[1540],\"collapsed\":[1540],\"panelWidth\":[2,\"panel-width\"],\"minPanelWidth\":[2,\"min-panel-width\"],\"maxPanelWidth\":[2,\"max-panel-width\"],\"resizable\":[4],\"persistKey\":[1,\"persist-key\"],\"showCloseButton\":[4,\"show-close-button\"],\"autoShowOnWide\":[4,\"auto-show-on-wide\"],\"autoHideOnNarrow\":[4,\"auto-hide-on-narrow\"],\"panelLabel\":[1,\"panel-label\"],\"isNarrow\":[32],\"responsiveReady\":[32],\"overlayMounted\":[32],\"overlayVisible\":[32],\"currentWidthPx\":[32],\"resizing\":[32]},[[6,\"keydown\",\"onDocumentKeyDown\"],[4,\"leSidePanelRequestToggle\",\"onToggleRequest\"]],{\"panelWidth\":[\"onPanelWidthChanged\"],\"collapsed\":[\"onCollapsedChanged\"],\"open\":[\"onOpenChanged\"],\"collapseAt\":[\"onResponsivePropChanged\"],\"narrowBehavior\":[\"onResponsivePropChanged\"]}]]],[\"le-tab-bar\",[[769,\"le-tab-bar\",{\"tabs\":[16],\"selected\":[1032],\"fullWidth\":[4,\"full-width\"],\"showLabels\":[4,\"show-labels\"],\"position\":[1],\"size\":[1],\"bordered\":[4],\"tabConfigs\":[32],\"isDeclarativeMode\":[32],\"focusedIndex\":[32]},[[0,\"slotchange\",\"handleSlotChange\"]],{\"selected\":[\"selectedChanged\"],\"tabs\":[\"tabsChanged\"]}]]],[\"le-tabs\",[[769,\"le-tabs\",{\"tabs\":[16],\"selected\":[1032],\"orientation\":[1],\"position\":[1],\"variant\":[1],\"fullWidth\":[4,\"full-width\"],\"size\":[1],\"wrap\":[4],\"overflow\":[1],\"tabConfigs\":[32],\"focusedIndex\":[32],\"isDeclarativeMode\":[32]},[[0,\"slotchange\",\"handleSlotChange\"]],{\"selected\":[\"selectedChanged\"],\"tabs\":[\"tabsChanged\"]}]]],[\"le-box\",[[769,\"le-box\",{\"grow\":[2],\"shrink\":[2],\"basis\":[1],\"width\":[1],\"height\":[1],\"minWidth\":[1,\"min-width\"],\"maxWidth\":[1,\"max-width\"],\"minHeight\":[1,\"min-height\"],\"maxHeight\":[1,\"max-height\"],\"background\":[1],\"borderRadius\":[1,\"border-radius\"],\"border\":[1],\"alignSelf\":[1,\"align-self\"],\"alignContent\":[1,\"align-content\"],\"justifyContent\":[1,\"justify-content\"],\"padding\":[1],\"order\":[2],\"displayFlex\":[4,\"display-flex\"],\"innerDirection\":[1,\"inner-direction\"],\"innerGap\":[1,\"inner-gap\"]}]]],[\"le-card\",[[769,\"le-card\",{\"variant\":[1],\"interactive\":[4]}]]],[\"le-combobox\",[[769,\"le-combobox\",{\"options\":[1],\"value\":[1032],\"placeholder\":[1],\"disabled\":[516],\"required\":[4],\"name\":[1],\"fullWidth\":[516,\"full-width\"],\"size\":[513],\"allowCustom\":[4,\"allow-custom\"],\"minSearchLength\":[2,\"min-search-length\"],\"emptyText\":[1,\"empty-text\"],\"open\":[1540],\"inputValue\":[32],\"selectedOption\":[32],\"showDropdown\":[64],\"hideDropdown\":[64],\"focusInput\":[64]},[[8,\"click\",\"handleWindowClick\"]],{\"value\":[\"handleValueChange\"],\"options\":[\"handleOptionsChange\"]}]]],[\"le-number-input\",[[769,\"le-number-input\",{\"value\":[1538],\"name\":[1],\"label\":[1],\"placeholder\":[1],\"min\":[2],\"max\":[2],\"step\":[2],\"required\":[4],\"disabled\":[4],\"readonly\":[4],\"iconStart\":[1,\"icon-start\"],\"showSpinners\":[4,\"show-spinners\"],\"externalId\":[1,\"external-id\"],\"isValid\":[32],\"validationMessage\":[32]},null,{\"value\":[\"valueChanged\"]}]]],[\"le-stack\",[[769,\"le-stack\",{\"direction\":[1],\"gap\":[1],\"align\":[1],\"justify\":[1],\"wrap\":[4],\"alignContent\":[1,\"align-content\"],\"reverse\":[4],\"maxItems\":[2,\"max-items\"],\"fullWidth\":[4,\"full-width\"],\"fullHeight\":[4,\"full-height\"],\"padding\":[1]}]]],[\"le-tab-panel\",[[769,\"le-tab-panel\",{\"label\":[1],\"value\":[1],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"disabled\":[4],\"lazy\":[4],\"active\":[32],\"hasBeenActive\":[32],\"getValue\":[64],\"getTabConfig\":[64],\"setActive\":[64]},null,{\"active\":[\"activeChanged\"]}]]],[\"le-text\",[[769,\"le-text\",{\"variant\":[1537],\"align\":[513],\"color\":[1],\"truncate\":[4],\"maxLines\":[2,\"max-lines\"],\"adminMode\":[32],\"content\":[32],\"isFocused\":[32],\"selectionState\":[32]},null,{\"variant\":[\"onVariantChange\"]}]]],[\"le-header-placeholder\",[[256,\"le-header-placeholder\"]]],[\"le-round-progress\",[[769,\"le-round-progress\",{\"value\":[2],\"padding\":[2],\"paths\":[1],\"params\":[32]},null,{\"value\":[\"updateValue\"],\"padding\":[\"updatePadding\"],\"paths\":[\"updateProgressBackgrounds\"]}]]],[\"le-turntable\",[[769,\"le-turntable\",{\"center\":[1],\"value\":[2]},[[9,\"mousemove\",\"handleMouseMove\"],[9,\"mouseup\",\"handleMouseUp\"],[9,\"resize\",\"handleWindowResize\"]],{\"value\":[\"updateValue\"]}]]],[\"le-tag\",[[769,\"le-tag\",{\"label\":[1],\"mode\":[1537],\"icon\":[1],\"dismissible\":[4],\"disabled\":[516],\"size\":[513],\"variant\":[513]}]]],[\"le-side-panel-toggle\",[[769,\"le-side-panel-toggle\",{\"panelId\":[1,\"panel-id\"],\"action\":[1],\"shortcut\":[1],\"disabled\":[4],\"mode\":[1537],\"variant\":[1],\"color\":[1],\"size\":[1],\"selected\":[4],\"fullWidth\":[516,\"full-width\"],\"iconOnly\":[1,\"icon-only\"],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"type\":[1],\"href\":[1],\"target\":[1],\"align\":[1]},null,{\"shortcut\":[\"onShortcutChanged\"]}]]],[\"le-tab\",[[769,\"le-tab\",{\"mode\":[1537],\"label\":[1],\"value\":[1],\"variant\":[1],\"position\":[1],\"size\":[1],\"focusable\":[4],\"selected\":[4],\"fullWidth\":[516,\"full-width\"],\"icon\":[1],\"showLabel\":[4,\"show-label\"],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"disabled\":[4],\"href\":[1],\"target\":[1],\"align\":[1],\"getTabConfig\":[64]}]]]]"), options);
|
|
19
|
+
return bootstrapLazy(JSON.parse("[[\"le-bar_16\",[[769,\"le-navigation\",{\"items\":[1],\"orientation\":[513],\"wrap\":[516],\"overflowMode\":[513,\"overflow-mode\"],\"minVisibleItemsForMore\":[2,\"min-visible-items-for-more\"],\"align\":[513],\"activeUrl\":[1,\"active-url\"],\"searchable\":[4],\"searchPlaceholder\":[1,\"search-placeholder\"],\"emptyText\":[1,\"empty-text\"],\"submenuSearchable\":[4,\"submenu-searchable\"],\"searchQuery\":[32],\"openState\":[32],\"overflowIds\":[32],\"hamburgerActive\":[32],\"submenuQueries\":[32],\"overflowPopoverOpen\":[32]},null,{\"items\":[\"handleLayoutInputsChange\"],\"orientation\":[\"handleLayoutInputsChange\"],\"wrap\":[\"handleLayoutInputsChange\"],\"overflowMode\":[\"handleLayoutInputsChange\"]}],[769,\"le-header\",{\"isStatic\":[516,\"static\"],\"sticky\":[516],\"fixed\":[516],\"revealOnScroll\":[513,\"reveal-on-scroll\"],\"shrinkOffset\":[513,\"shrink-offset\"],\"expandOnHover\":[516,\"expand-on-hover\"],\"revealed\":[32],\"shrunk\":[32],\"placeholderHeight\":[32],\"hoverActive\":[32]},[[9,\"scroll\",\"onWindowScroll\"],[9,\"resize\",\"onWindowResize\"]],{\"revealOnScroll\":[\"onBehaviorPropsChange\"],\"shrinkOffset\":[\"onBehaviorPropsChange\"],\"fixed\":[\"onBehaviorPropsChange\"],\"sticky\":[\"onBehaviorPropsChange\"],\"isStatic\":[\"onBehaviorPropsChange\"]}],[769,\"le-current-heading\",{\"selector\":[1],\"activeText\":[32]},[[9,\"scroll\",\"onScroll\"],[9,\"resize\",\"onResize\"]],{\"selector\":[\"onSelectorChange\"]}],[769,\"le-scroll-progress\",{\"trackScrollProgress\":[513,\"track-scroll-progress\"],\"progress\":[32]},[[9,\"scroll\",\"onScroll\"],[9,\"resize\",\"onResize\"]],{\"trackScrollProgress\":[\"onTrackChange\"]}],[769,\"le-collapse\",{\"closed\":[1540],\"scrollDown\":[516,\"scroll-down\"],\"noFading\":[516,\"no-fading\"],\"collapseOnHeaderShrink\":[516,\"collapse-on-header-shrink\"],\"headerShrunk\":[32]},[[8,\"leHeaderShrinkChange\",\"handleHeaderShrink\"]],{\"open\":[\"onOpenChange\"],\"headerShrunk\":[\"onDrivenStateChange\"]}],[769,\"le-bar\",{\"overflow\":[513],\"alignItems\":[513,\"align-items\"],\"arrows\":[4],\"disablePopover\":[4,\"disable-popover\"],\"minVisibleItems\":[2,\"min-visible-items\"],\"showAllMenu\":[8,\"show-all-menu\"],\"popoverOpen\":[32],\"hamburgerActive\":[32],\"overflowingIds\":[32],\"canScrollStart\":[32],\"canScrollEnd\":[32],\"allMenuOpen\":[32],\"containerHeight\":[32],\"recalculate\":[64]},[[0,\"slotchange\",\"handleSlotChange\"]],{\"overflow\":[\"handleOverflowChange\"]}],[769,\"le-icon\",{\"name\":[1],\"size\":[2],\"iconData\":[32],\"visible\":[32]},null,{\"name\":[\"loadIconData\"]}],[769,\"le-dropdown-base\",{\"options\":[16],\"value\":[8],\"multiple\":[4],\"open\":[1540],\"disabled\":[516],\"filterFn\":[16],\"filterQuery\":[1,\"filter-query\"],\"emptyText\":[1,\"empty-text\"],\"showCheckboxes\":[4,\"show-checkboxes\"],\"maxHeight\":[1,\"max-height\"],\"width\":[1],\"fullWidth\":[4,\"full-width\"],\"closeOnClickOutside\":[4,\"close-on-click-outside\"],\"focusedIndex\":[32],\"filteredOptions\":[32],\"show\":[64],\"hide\":[64],\"toggle\":[64]},null,{\"options\":[\"handleOptionsChange\"],\"filterQuery\":[\"handleOptionsChange\"]}],[769,\"le-button\",{\"mode\":[1537],\"variant\":[1],\"color\":[1],\"size\":[1],\"selected\":[4],\"fullWidth\":[516,\"full-width\"],\"iconOnly\":[1,\"icon-only\"],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"disabled\":[4],\"type\":[1],\"href\":[1],\"target\":[1],\"align\":[1]}],[769,\"le-checkbox\",{\"checked\":[1540],\"disabled\":[4],\"name\":[1],\"value\":[1],\"externalId\":[1,\"external-id\"]}],[769,\"le-component\",{\"component\":[1],\"displayName\":[1,\"display-name\"],\"hostClass\":[1,\"host-class\"],\"hostStyle\":[16],\"adminMode\":[32],\"componentMeta\":[32],\"propertyValues\":[32]}],[769,\"le-popup\",{\"mode\":[1537],\"open\":[1540],\"type\":[1],\"popupTitle\":[1,\"popup-title\"],\"message\":[1],\"modal\":[4],\"position\":[1],\"confirmText\":[1,\"confirm-text\"],\"cancelText\":[1,\"cancel-text\"],\"placeholder\":[1],\"defaultValue\":[1,\"default-value\"],\"closeOnBackdrop\":[4,\"close-on-backdrop\"],\"inputValue\":[32],\"show\":[64],\"hide\":[64]}],[769,\"le-select\",{\"options\":[1],\"value\":[1032],\"placeholder\":[1],\"disabled\":[516],\"required\":[4],\"name\":[1],\"fullWidth\":[4,\"full-width\"],\"size\":[513],\"variant\":[513],\"searchable\":[4],\"emptyText\":[1,\"empty-text\"],\"open\":[1540],\"selectedOption\":[32],\"searchQuery\":[32],\"showDropdown\":[64],\"hideDropdown\":[64]},null,{\"value\":[\"handleValueChange\"],\"options\":[\"handleOptionsChange\"]}],[769,\"le-slot\",{\"type\":[1],\"name\":[1],\"label\":[1],\"description\":[1],\"allowedComponents\":[1,\"allowed-components\"],\"multiple\":[4],\"required\":[4],\"placeholder\":[1],\"tag\":[1],\"slotStyle\":[1,\"slot-style\"],\"adminMode\":[32],\"textValue\":[32],\"isValidHtml\":[32],\"availableComponents\":[32],\"pickerOpen\":[32]}],[769,\"le-string-input\",{\"inputRef\":[16],\"mode\":[1537],\"value\":[1537],\"name\":[1],\"type\":[1],\"label\":[1],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"placeholder\":[1],\"hideDescription\":[4,\"hide-description\"],\"disabled\":[4],\"readonly\":[4],\"externalId\":[1,\"external-id\"]}],[769,\"le-popover\",{\"mode\":[1537],\"open\":[1540],\"position\":[1],\"align\":[1],\"popoverTitle\":[1,\"popover-title\"],\"showClose\":[4,\"show-close\"],\"closeOnClickOutside\":[4,\"close-on-click-outside\"],\"closeOnEscape\":[4,\"close-on-escape\"],\"offset\":[2],\"width\":[1],\"minWidth\":[1,\"min-width\"],\"maxWidth\":[1,\"max-width\"],\"triggerFullWidth\":[4,\"trigger-full-width\"],\"isPositioned\":[32],\"updatePosition\":[64],\"show\":[64],\"hide\":[64],\"toggle\":[64]}]]],[\"le-multiselect\",[[769,\"le-multiselect\",{\"options\":[1],\"value\":[1040],\"placeholder\":[1],\"disabled\":[516],\"required\":[4],\"name\":[1],\"fullWidth\":[516,\"full-width\"],\"size\":[513],\"maxSelections\":[2,\"max-selections\"],\"showSelectAll\":[1032,\"show-select-all\"],\"searchable\":[4],\"emptyText\":[1,\"empty-text\"],\"open\":[1540],\"selectAllLabel\":[32],\"deselectAllLabel\":[32],\"selectedOptions\":[32],\"searchQuery\":[32],\"showDropdown\":[64],\"hideDropdown\":[64],\"clearSelection\":[64]},null,{\"value\":[\"handleValueChange\"],\"options\":[\"handleOptionsChange\"],\"showSelectAll\":[\"handleShowSelectAllChange\"]}]]],[\"le-segmented-control\",[[769,\"le-segmented-control\",{\"options\":[16],\"value\":[1032],\"size\":[1],\"overflow\":[1],\"fullWidth\":[4,\"full-width\"],\"disabled\":[4],\"segmentConfigs\":[32],\"focusedIndex\":[32],\"isDeclarativeMode\":[32]},[[0,\"slotchange\",\"handleSlotChange\"]],{\"options\":[\"tabsChanged\"]}]]],[\"le-side-panel\",[[769,\"le-side-panel\",{\"panelId\":[1,\"panel-id\"],\"side\":[1],\"collapseAt\":[1,\"collapse-at\"],\"narrowBehavior\":[1,\"narrow-behavior\"],\"open\":[1540],\"collapsed\":[1540],\"panelWidth\":[2,\"panel-width\"],\"minPanelWidth\":[2,\"min-panel-width\"],\"maxPanelWidth\":[2,\"max-panel-width\"],\"resizable\":[4],\"persistKey\":[1,\"persist-key\"],\"showCloseButton\":[4,\"show-close-button\"],\"autoShowOnWide\":[4,\"auto-show-on-wide\"],\"autoHideOnNarrow\":[4,\"auto-hide-on-narrow\"],\"panelLabel\":[1,\"panel-label\"],\"isNarrow\":[32],\"responsiveReady\":[32],\"overlayMounted\":[32],\"overlayVisible\":[32],\"currentWidthPx\":[32],\"resizing\":[32]},[[6,\"keydown\",\"onDocumentKeyDown\"],[4,\"leSidePanelRequestToggle\",\"onToggleRequest\"]],{\"panelWidth\":[\"onPanelWidthChanged\"],\"collapsed\":[\"onCollapsedChanged\"],\"open\":[\"onOpenChanged\"],\"collapseAt\":[\"onResponsivePropChanged\"],\"narrowBehavior\":[\"onResponsivePropChanged\"]}]]],[\"le-tab-bar\",[[769,\"le-tab-bar\",{\"tabs\":[16],\"selected\":[1032],\"fullWidth\":[4,\"full-width\"],\"showLabels\":[4,\"show-labels\"],\"position\":[1],\"size\":[1],\"bordered\":[4],\"tabConfigs\":[32],\"isDeclarativeMode\":[32],\"focusedIndex\":[32]},[[0,\"slotchange\",\"handleSlotChange\"]],{\"selected\":[\"selectedChanged\"],\"tabs\":[\"tabsChanged\"]}]]],[\"le-tabs\",[[769,\"le-tabs\",{\"tabs\":[16],\"selected\":[1032],\"orientation\":[1],\"position\":[1],\"variant\":[1],\"fullWidth\":[4,\"full-width\"],\"size\":[1],\"wrap\":[4],\"overflow\":[1],\"tabConfigs\":[32],\"focusedIndex\":[32],\"isDeclarativeMode\":[32]},[[0,\"slotchange\",\"handleSlotChange\"]],{\"selected\":[\"selectedChanged\"],\"tabs\":[\"tabsChanged\"]}]]],[\"le-box\",[[769,\"le-box\",{\"grow\":[2],\"shrink\":[2],\"basis\":[1],\"width\":[1],\"height\":[1],\"minWidth\":[1,\"min-width\"],\"maxWidth\":[1,\"max-width\"],\"minHeight\":[1,\"min-height\"],\"maxHeight\":[1,\"max-height\"],\"background\":[1],\"borderRadius\":[1,\"border-radius\"],\"border\":[1],\"alignSelf\":[1,\"align-self\"],\"alignContent\":[1,\"align-content\"],\"justifyContent\":[1,\"justify-content\"],\"padding\":[1],\"order\":[2],\"displayFlex\":[4,\"display-flex\"],\"innerDirection\":[1,\"inner-direction\"],\"innerGap\":[1,\"inner-gap\"]}]]],[\"le-card\",[[769,\"le-card\",{\"variant\":[1],\"interactive\":[4]}]]],[\"le-code-input\",[[769,\"le-code-input\",{\"value\":[1537],\"name\":[1],\"label\":[1],\"length\":[2],\"description\":[1],\"type\":[1],\"disabled\":[4],\"readonly\":[4],\"externalId\":[1,\"external-id\"],\"error\":[4],\"isFocused\":[32],\"selectionStart\":[32],\"selectionEnd\":[32]},null,{\"value\":[\"valueChanged\"]}]]],[\"le-combobox\",[[769,\"le-combobox\",{\"options\":[1],\"value\":[1032],\"placeholder\":[1],\"disabled\":[516],\"required\":[4],\"name\":[1],\"fullWidth\":[516,\"full-width\"],\"size\":[513],\"allowCustom\":[4,\"allow-custom\"],\"minSearchLength\":[2,\"min-search-length\"],\"emptyText\":[1,\"empty-text\"],\"open\":[1540],\"inputValue\":[32],\"selectedOption\":[32],\"showDropdown\":[64],\"hideDropdown\":[64],\"focusInput\":[64]},[[8,\"click\",\"handleWindowClick\"]],{\"value\":[\"handleValueChange\"],\"options\":[\"handleOptionsChange\"]}]]],[\"le-number-input\",[[769,\"le-number-input\",{\"value\":[1538],\"name\":[1],\"label\":[1],\"placeholder\":[1],\"min\":[2],\"max\":[2],\"step\":[2],\"required\":[4],\"disabled\":[4],\"readonly\":[4],\"iconStart\":[1,\"icon-start\"],\"showSpinners\":[4,\"show-spinners\"],\"externalId\":[1,\"external-id\"],\"isValid\":[32],\"validationMessage\":[32]},null,{\"value\":[\"valueChanged\"]}]]],[\"le-stack\",[[769,\"le-stack\",{\"direction\":[1],\"gap\":[1],\"align\":[1],\"justify\":[1],\"wrap\":[4],\"alignContent\":[1,\"align-content\"],\"reverse\":[4],\"maxItems\":[2,\"max-items\"],\"fullWidth\":[4,\"full-width\"],\"fullHeight\":[4,\"full-height\"],\"padding\":[1]}]]],[\"le-tab-panel\",[[769,\"le-tab-panel\",{\"label\":[1],\"value\":[1],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"disabled\":[4],\"lazy\":[4],\"active\":[32],\"hasBeenActive\":[32],\"getValue\":[64],\"getTabConfig\":[64],\"setActive\":[64]},null,{\"active\":[\"activeChanged\"]}]]],[\"le-text\",[[769,\"le-text\",{\"variant\":[1537],\"align\":[513],\"color\":[1],\"truncate\":[4],\"maxLines\":[2,\"max-lines\"],\"adminMode\":[32],\"content\":[32],\"isFocused\":[32],\"selectionState\":[32]},null,{\"variant\":[\"onVariantChange\"]}]]],[\"le-header-placeholder\",[[256,\"le-header-placeholder\"]]],[\"le-round-progress\",[[769,\"le-round-progress\",{\"value\":[2],\"padding\":[2],\"paths\":[1],\"params\":[32]},null,{\"value\":[\"updateValue\"],\"padding\":[\"updatePadding\"],\"paths\":[\"updateProgressBackgrounds\"]}]]],[\"le-turntable\",[[769,\"le-turntable\",{\"center\":[1],\"value\":[2]},[[9,\"mousemove\",\"handleMouseMove\"],[9,\"mouseup\",\"handleMouseUp\"],[9,\"resize\",\"handleWindowResize\"]],{\"value\":[\"updateValue\"]}]]],[\"le-tag\",[[769,\"le-tag\",{\"label\":[1],\"mode\":[1537],\"icon\":[1],\"dismissible\":[4],\"disabled\":[516],\"size\":[513],\"variant\":[513]}]]],[\"le-side-panel-toggle\",[[769,\"le-side-panel-toggle\",{\"panelId\":[1,\"panel-id\"],\"action\":[1],\"shortcut\":[1],\"disabled\":[4],\"mode\":[1537],\"variant\":[1],\"color\":[1],\"size\":[1],\"selected\":[4],\"fullWidth\":[516,\"full-width\"],\"iconOnly\":[1,\"icon-only\"],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"type\":[1],\"href\":[1],\"target\":[1],\"align\":[1]},null,{\"shortcut\":[\"onShortcutChanged\"]}]]],[\"le-tab\",[[769,\"le-tab\",{\"mode\":[1537],\"label\":[1],\"value\":[1],\"variant\":[1],\"position\":[1],\"size\":[1],\"focusable\":[4],\"selected\":[4],\"fullWidth\":[516,\"full-width\"],\"icon\":[1],\"showLabel\":[4,\"show-label\"],\"iconStart\":[1,\"icon-start\"],\"iconEnd\":[1,\"icon-end\"],\"disabled\":[4],\"href\":[1],\"target\":[1],\"align\":[1],\"getTabConfig\":[64]}]]]]"), options);
|
|
20
20
|
});
|
|
21
21
|
//# sourceMappingURL=le-kit.js.map
|
|
22
22
|
|
|
@@ -284,13 +284,13 @@ const LeMultiselect = class {
|
|
|
284
284
|
render() {
|
|
285
285
|
const hasSelections = this.selectedOptions.length > 0;
|
|
286
286
|
const atMaxSelections = this.maxSelections && this.value.length >= this.maxSelections;
|
|
287
|
-
return (h("le-component", { key: '
|
|
287
|
+
return (h("le-component", { key: 'e6183adb112775737e6a7f47b0be614a76a1c110', component: "le-multiselect" }, h("le-dropdown-base", { key: 'ee8ba9e02608a5c26d8a8b0a659e89e5631f3f6a', ref: el => (this.dropdownEl = el), options: this.effectiveOptions, value: this.value, multiple: true, disabled: this.disabled, filterFn: this.searchable ? this.filterOption : undefined, filterQuery: this.searchQuery, emptyText: this.emptyText, showCheckboxes: true, fullWidth: this.fullWidth, onLeOptionSelect: this.handleOptionSelect, onLeDropdownOpen: this.handleDropdownOpen, onLeDropdownClose: this.handleDropdownClose }, h("div", { key: '4c87bf167dd876476dae3b0259cda2f28e3787a5', slot: "trigger", class: {
|
|
288
288
|
'multiselect-trigger': true,
|
|
289
289
|
'has-selections': hasSelections,
|
|
290
290
|
'is-open': this.open,
|
|
291
291
|
'is-disabled': this.disabled,
|
|
292
|
-
}, tabIndex: this.disabled ? -1 : 0, role: "combobox", "aria-haspopup": "listbox", "aria-expanded": this.open ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, this.renderTags(), h("div", { key: '
|
|
293
|
-
this.value.map(val => (h("input", { type: "hidden", name: this.name, value: val.toString(), key: val.toString() }))), atMaxSelections && (h("span", { key: '
|
|
292
|
+
}, tabIndex: this.disabled ? -1 : 0, role: "combobox", "aria-haspopup": "listbox", "aria-expanded": this.open ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, this.renderTags(), h("div", { key: 'be629671c75d408127edb480df54c6649e28ca2a', class: "multiselect-actions" }, hasSelections && !this.disabled && (h("button", { key: '67f4c2152e4b2f8f52b8b98093fbb238571f6105', type: "button", class: "multiselect-clear", onClick: this.handleClearAll, "aria-label": "Clear all", tabIndex: -1 }, h("svg", { key: '5894bfb10a310a29f21c865323b2175cde05173e', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '50f7445b3627bf110a899dbba2b5f7244d706a49', d: "M4 4l8 8M12 4l-8 8" })))), h("span", { key: '58ef10834f74ce5b21b675b47a4c2a96df4bd173', class: "multiselect-arrow" }, h("svg", { key: '74a20681e12aff0295c219c8ff8f953908aa9a94', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '8e48c5333f7f3035e4c4f80f7c3507e5d3d4caaa', d: "M4 6l4 4 4-4" }))))), this.searchable && this.open && (h("div", { key: '906f9596d6a0da2840d534570d38ea008d7cdb4b', class: "multiselect-search", slot: "header" }, h("le-string-input", { key: 'ccd7f1b2594be3440adb16ef5c001beaa5547396', mode: "default", inputRef: el => (this.inputEl = el), class: "search-input", placeholder: "Search...", value: this.searchQuery, onInput: this.handleSearchInput })))), this.name &&
|
|
293
|
+
this.value.map(val => (h("input", { type: "hidden", name: this.name, value: val.toString(), key: val.toString() }))), atMaxSelections && (h("span", { key: 'c329c06d0e00a1516c9d3323ad4a83b81a205f13', class: "multiselect-status" }, "Maximum ", this.maxSelections, " selections"))));
|
|
294
294
|
}
|
|
295
295
|
static get watchers() { return {
|
|
296
296
|
"value": ["handleValueChange"],
|
|
@@ -188,7 +188,7 @@ const LeNumberInput = class {
|
|
|
188
188
|
this.emitChange();
|
|
189
189
|
};
|
|
190
190
|
render() {
|
|
191
|
-
return (h("le-component", { key: '
|
|
191
|
+
return (h("le-component", { key: '38670cabc16dd9a966a5f430e1d4d5e2fc618744', component: "le-number-input", hostClass: classnames({ 'disabled': this.disabled }) }, h("div", { key: '473450ef637fa744c7a83416beabd87fe9540436', class: "le-input-wrapper" }, this.label && (h("label", { key: 'c74d4166c1925f02c743dc1250b574a679415ae8', class: "le-input-label", htmlFor: this.name }, this.label)), h("div", { key: '9066bfe0737700717bf902f46a6a6fa51b22a3a1', class: classnames('le-input-container', { 'has-error': !this.isValid }) }, this.iconStart && (h("span", { key: 'dcabeda7256fc25dc8bacd4ecbd2cc2941ea02d7', class: "icon-start" }, this.iconStart)), h("input", { key: '85d9040a37f4f5cf5c8c403dd58a3b1e9947d21d', id: this.name, type: "number", name: this.name, placeholder: this.placeholder, min: this.min, max: this.max, step: this.step, value: this.value, disabled: this.disabled, readOnly: this.readonly, required: this.required, onInput: this.handleInput, onChange: this.handleChange, onKeyDown: this.handleKeyDown, onWheel: this.handleWheel }), this.showSpinners && (h("div", { key: '9a197fc41798ff09b5618f5fb901b51ca2581d28', class: "le-input-controls" }, h("le-button", { key: '8befc86b373c03417ba87110d4092c8f6bf2f19c', mode: "default", variant: "clear", size: "small", "icon-only": true, class: "le-input-control-btn", onClick: this.increment, disabled: this.disabled || this.readonly || (this.max !== undefined && this.value >= this.max), tabindex: "-1" }, h("span", { key: '70b53c26b9e061cd747bd1ccaa39d14c4ac69b68', slot: "icon-only" }, "\u2191")), h("le-button", { key: '3f9f65048977127cc2faaf911b9db6861005e17d', mode: "default", variant: "clear", size: "small", "icon-only": true, class: "le-input-control-btn", onClick: this.decrement, disabled: this.disabled || this.readonly || (this.min !== undefined && this.value <= this.min), tabindex: "-1" }, h("span", { key: 'ecbdfd9a72b357b1daca7be54ba5188795a44929', slot: "icon-only" }, "\u2193"))))), !this.isValid && h("div", { key: '41b7315c03d7caba36a535375e6a4774f9ff82b9', class: "le-input-error" }, this.validationMessage), h("div", { key: '3eda10b4e02add4dd780f6b51b5fd9565882dba8', class: "le-input-description" }, h("le-slot", { key: '7f9d9e5299dde3bc2f003687830f6d26d9f234b1', name: "description", type: "text", tag: "p", label: "Description" }, h("slot", { key: 'a80e340b5ba3c4b84e6d684156ccdfae106d6fc0', name: "description" }))))));
|
|
192
192
|
}
|
|
193
193
|
static get watchers() { return {
|
|
194
194
|
"value": ["valueChanged"]
|
|
@@ -90,7 +90,7 @@ const LeRoundProgress = class {
|
|
|
90
90
|
return (h("svg", { viewBox: this.getViewBox(), class: "round-progress" }, paths));
|
|
91
91
|
}
|
|
92
92
|
render() {
|
|
93
|
-
return (h("div", { key: '
|
|
93
|
+
return (h("div", { key: 'dd678c7e3ff93c60f9eb6c2c09cbf1eab963ec69', class: "round-progress--container" }, this.getPaths(), h("svg", { key: '4a7fc03af132741d9bcddb10d94db800a51e53bc', viewBox: this.getViewBox(), class: "round-progress round-progress--progress" }, h("path", { key: 'd3091d22a5c5e696d0e58748f880471d99f4ac4d', class: "round-progress--circle", "stroke-dasharray": this.getStrokeDashArray(), d: this.getPath() })), h("slot", { key: '8dabb64461b68928e1e58c48dcaec84f504d4639' })));
|
|
94
94
|
}
|
|
95
95
|
static get watchers() { return {
|
|
96
96
|
"value": ["updateValue"],
|
|
@@ -226,7 +226,7 @@ const LeSegmentedControl = class {
|
|
|
226
226
|
'full-width': fullWidth,
|
|
227
227
|
'disabled': disabled,
|
|
228
228
|
};
|
|
229
|
-
return (h(Host, { key: '
|
|
229
|
+
return (h(Host, { key: 'dfe7d637e07af470756a57e8878e455c472a2790', class: `overflow-${this.overflow}` }, h("le-component", { key: '5ffa309951b8f509fe0b0db09a9273256ec5a1b5', component: "le-segmented-control" }, h("div", { key: 'a448e9be4011230c689a4bab5963f1588496c1ba', class: classes, ref: el => (this.containerRef = el), role: "radiogroup", part: "container", onKeyDown: this.handleKeyDown, tabIndex: 0 }, segmentConfigs.map(option => {
|
|
230
230
|
const optValue = this.getOptionValue(option);
|
|
231
231
|
const isSelected = optValue === value;
|
|
232
232
|
const isDisabled = option.disabled || disabled;
|
|
@@ -124,7 +124,7 @@ const LeStack = class {
|
|
|
124
124
|
});
|
|
125
125
|
// Slot style for admin mode - make items display in the same direction
|
|
126
126
|
const slotStyle = `display: flex; flex-direction: ${this.getFlexDirection()}; gap: ${this.gap || 'var(--le-space-md)'}; flex-wrap: ${this.wrap ? 'wrap' : 'nowrap'}; justify-content: ${this.getJustifyContent()}; align-items: ${this.getAlignItems()};`;
|
|
127
|
-
return (h("le-component", { key: '
|
|
127
|
+
return (h("le-component", { key: '465b00b5165b3c19f0043f5ffaab5081464692dc', component: "le-stack", hostClass: hostClass }, h("div", { key: '1787122eea7ee7f2986581ef8ab3c65068ef799f', class: "stack", part: "stack", style: style }, h("le-slot", { key: '5be191bf1ea7d4edc2f27a6f97e57a038dc8cc94', name: "", description: `Items arranged ${this.direction}ly${this.maxItems ? ` (max ${this.maxItems})` : ''}`, type: "slot", "allowed-components": "le-text,le-box,le-card,le-button,le-stack", slotStyle: slotStyle }, h("slot", { key: '9b11206293f60733a0c59de456513088373ce245' })))));
|
|
128
128
|
}
|
|
129
129
|
};
|
|
130
130
|
LeStack.style = leStackDefaultCss();
|
|
@@ -223,7 +223,7 @@ const LeTabBar = class {
|
|
|
223
223
|
'position-top': this.position === 'top',
|
|
224
224
|
'position-bottom': this.position === 'bottom',
|
|
225
225
|
};
|
|
226
|
-
return (h(Host, { key: '
|
|
226
|
+
return (h(Host, { key: '71b1a2d80884dc9a494edf55b28bfa178b44f284', class: classes }, h("le-component", { key: 'a09f1adff893b3b1f7c2f2ea0115133df906153f', component: "le-tab-bar" }, h("div", { key: 'f9b3046469fcaf0a3164fc5bb2038d54916dcb83', class: "tablist", role: "tablist", "aria-orientation": "horizontal", part: "tablist", onKeyDown: this.handleKeyDown }, h("le-slot", { key: '2a4ef6c858a7a0c8d9d2942d68183887153101c3', name: "", type: "slot", allowedComponents: "le-tab" }, tabConfigs.map(tab => {
|
|
227
227
|
const value = this.getTabValue(tab);
|
|
228
228
|
const isSelected = value === selected;
|
|
229
229
|
return (h("le-tab", { key: value, class: "tab", role: "tab", variant: "icon-only", label: tab.label, value: tab.value, icon: tab.icon, href: tab.href, selected: isSelected, disabled: tab.disabled, showLabel: this.showLabels, size: size, part: isSelected ? 'tab tab-active' : 'tab', "aria-selected": isSelected ? 'true' : 'false', "aria-disabled": tab.disabled ? 'true' : undefined, tabIndex: -1, onClick: () => this.handleTabClick(tab) }, h("span", { class: "tab-label" }, tab.label)));
|