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
|
@@ -195,7 +195,7 @@ export class LeNumberInput {
|
|
|
195
195
|
this.emitChange();
|
|
196
196
|
};
|
|
197
197
|
render() {
|
|
198
|
-
return (h("le-component", { key: '
|
|
198
|
+
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" }))))));
|
|
199
199
|
}
|
|
200
200
|
static get is() { return "le-number-input"; }
|
|
201
201
|
static get encapsulation() { return "shadow"; }
|
|
@@ -459,12 +459,12 @@ export class LePopover {
|
|
|
459
459
|
popoverStyles.minWidth = this.minWidth;
|
|
460
460
|
if (this.maxWidth)
|
|
461
461
|
popoverStyles.maxWidth = this.maxWidth;
|
|
462
|
-
return (h(Host, { key: '
|
|
462
|
+
return (h(Host, { key: '542d4ab391a9b176d110fe00c0dd61f2c46d73ef', "trigger-full-width": this.triggerFullWidth }, h("div", { key: '2248ab763d65e8a9150e62644452085f01c6a238', class: classnames('le-popover-trigger', {
|
|
463
463
|
'le-popover-trigger-full-width': this.triggerFullWidth,
|
|
464
|
-
}), ref: el => (this.triggerEl = el), onClick: this.handleTriggerClick, part: "trigger" }, h("slot", { key: '
|
|
464
|
+
}), 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",
|
|
465
465
|
// Always use manual mode so nested popovers can be open together.
|
|
466
466
|
// We implement click-outside and Escape handling ourselves.
|
|
467
|
-
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: '
|
|
467
|
+
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' })))));
|
|
468
468
|
}
|
|
469
469
|
static get is() { return "le-popover"; }
|
|
470
470
|
static get encapsulation() { return "shadow"; }
|
|
@@ -85,7 +85,7 @@ export class LeRoundProgress {
|
|
|
85
85
|
return (h("svg", { viewBox: this.getViewBox(), class: "round-progress" }, paths));
|
|
86
86
|
}
|
|
87
87
|
render() {
|
|
88
|
-
return (h("div", { key: '
|
|
88
|
+
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' })));
|
|
89
89
|
}
|
|
90
90
|
static get is() { return "le-round-progress"; }
|
|
91
91
|
static get encapsulation() { return "shadow"; }
|
|
@@ -118,7 +118,7 @@ export class LeScrollProgress {
|
|
|
118
118
|
}
|
|
119
119
|
render() {
|
|
120
120
|
const width = `${this.progress * 100}%`;
|
|
121
|
-
return (h(Host, { key: '
|
|
121
|
+
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 } }))));
|
|
122
122
|
}
|
|
123
123
|
static get is() { return "le-scroll-progress"; }
|
|
124
124
|
static get encapsulation() { return "shadow"; }
|
|
@@ -236,7 +236,7 @@ export class LeSegmentedControl {
|
|
|
236
236
|
'full-width': fullWidth,
|
|
237
237
|
'disabled': disabled,
|
|
238
238
|
};
|
|
239
|
-
return (h(Host, { key: '
|
|
239
|
+
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 => {
|
|
240
240
|
const optValue = this.getOptionValue(option);
|
|
241
241
|
const isSelected = optValue === value;
|
|
242
242
|
const isDisabled = option.disabled || disabled;
|
|
@@ -192,13 +192,13 @@ export class LeSelect {
|
|
|
192
192
|
}
|
|
193
193
|
render() {
|
|
194
194
|
const hasValue = this.selectedOption !== undefined;
|
|
195
|
-
return (h("le-component", { key: '
|
|
195
|
+
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: {
|
|
196
196
|
'select-trigger': true,
|
|
197
197
|
'has-value': hasValue,
|
|
198
198
|
'is-open': this.open,
|
|
199
199
|
}, 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
|
|
200
200
|
? this.renderIcon(this.selectedOption.iconStart)
|
|
201
|
-
: 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: '
|
|
201
|
+
: 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() ?? '' })));
|
|
202
202
|
}
|
|
203
203
|
static get is() { return "le-select"; }
|
|
204
204
|
static get encapsulation() { return "shadow"; }
|
|
@@ -343,7 +343,7 @@ export class LeSlot {
|
|
|
343
343
|
render() {
|
|
344
344
|
const displayLabel = this.label || this.name;
|
|
345
345
|
// Always render the same structure, CSS handles visibility via .admin-mode class
|
|
346
|
-
return (h(Host, { key: '
|
|
346
|
+
return (h(Host, { key: '8a48f7865340d9a2e201a2f878b2f1c66c55d86c', class: {
|
|
347
347
|
'admin-mode': this.adminMode,
|
|
348
348
|
'invalid-html': !this.isValidHtml,
|
|
349
349
|
}, 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', {
|
|
@@ -134,7 +134,7 @@ export class LeStack {
|
|
|
134
134
|
});
|
|
135
135
|
// Slot style for admin mode - make items display in the same direction
|
|
136
136
|
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()};`;
|
|
137
|
-
return (h("le-component", { key: '
|
|
137
|
+
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' })))));
|
|
138
138
|
}
|
|
139
139
|
static get is() { return "le-stack"; }
|
|
140
140
|
static get encapsulation() { return "shadow"; }
|
|
@@ -99,11 +99,11 @@ export class LeStringInput {
|
|
|
99
99
|
ev.stopPropagation();
|
|
100
100
|
};
|
|
101
101
|
render() {
|
|
102
|
-
return (h("le-component", { key: '
|
|
102
|
+
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 => {
|
|
103
103
|
if (this.inputRef) {
|
|
104
104
|
this.inputRef(el);
|
|
105
105
|
}
|
|
106
|
-
}, 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: '
|
|
106
|
+
}, 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" })))))));
|
|
107
107
|
}
|
|
108
108
|
static get is() { return "le-string-input"; }
|
|
109
109
|
static get encapsulation() { return "shadow"; }
|
|
@@ -135,7 +135,7 @@ export class LeTab {
|
|
|
135
135
|
const attrs = this.href
|
|
136
136
|
? { href: this.href, target: this.target, role: 'button' }
|
|
137
137
|
: { disabled: this.disabled };
|
|
138
|
-
return (h(Host, { key: '
|
|
138
|
+
return (h(Host, { key: 'a539044017f98ddaa7636df1457b669f56c19d94' }, h("le-component", { key: 'b6df3e0738be09d00f3cd802b3cd06af4402e746', component: "le-tab" }, h(TagType, { key: 'a37f2d404da74b5b0d99bbb0b9ff57121903ee2d', class: classnames('le-tab-container', `le-tab-align-${this.align}`, classes), part: "button", ...attrs, onClick: this.handleClick, tabIndex: this.focusable ? 0 : -1 }, this.icon !== undefined ? (h("div", { class: "icon-only" }, h("div", { class: "icon" }, this.icon), this.showLabel && h("span", { class: "icon-label" }, this.label))) : (h(Fragment, null, h("span", { class: "le-tab-label" }, this.iconStart && (h("span", { class: "icon-start", part: "icon-start" }, this.iconStart)), h("le-slot", { name: "", description: "Tab text", type: "text", class: "content", part: "content" }, h("slot", null, this.label))), this.iconEnd && (h("span", { class: "icon-end", part: "icon-end" }, this.iconEnd))))))));
|
|
139
139
|
}
|
|
140
140
|
static get is() { return "le-tab"; }
|
|
141
141
|
static get encapsulation() { return "shadow"; }
|
|
@@ -236,7 +236,7 @@ export class LeTabBar {
|
|
|
236
236
|
'position-top': this.position === 'top',
|
|
237
237
|
'position-bottom': this.position === 'bottom',
|
|
238
238
|
};
|
|
239
|
-
return (h(Host, { key: '
|
|
239
|
+
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 => {
|
|
240
240
|
const value = this.getTabValue(tab);
|
|
241
241
|
const isSelected = value === selected;
|
|
242
242
|
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)));
|
|
@@ -88,11 +88,11 @@ export class LeTabPanel {
|
|
|
88
88
|
}
|
|
89
89
|
render() {
|
|
90
90
|
const shouldRender = this.shouldRenderContent();
|
|
91
|
-
return (h("le-component", { key: '
|
|
91
|
+
return (h("le-component", { key: '1315534f32fe8cc7f2ff1c0ec0457d30514064d4', component: "le-tab-panel" }, h("div", { key: '7544225e28b3be3e09269a669676515dc4ad097c', class: {
|
|
92
92
|
'tab-panel': true,
|
|
93
93
|
'active': this.active,
|
|
94
94
|
'lazy-hidden': this.lazy && !this.active,
|
|
95
|
-
}, role: "tabpanel", "aria-hidden": !this.active ? 'true' : undefined, tabIndex: this.active ? 0 : -1 }, h("le-slot", { key: '
|
|
95
|
+
}, role: "tabpanel", "aria-hidden": !this.active ? 'true' : undefined, tabIndex: this.active ? 0 : -1 }, h("le-slot", { key: 'a686c87a4e5a62a6befb425141bd96b59273ec6b', name: "", description: "Tab panel content", type: "slot" }, shouldRender && h("slot", { key: '76bd67392762a5ddbf8124c5596c6cb37ecf44fa' })))));
|
|
96
96
|
}
|
|
97
97
|
static get is() { return "le-tab-panel"; }
|
|
98
98
|
static get encapsulation() { return "shadow"; }
|
|
@@ -291,7 +291,7 @@ export class LeTabs {
|
|
|
291
291
|
: this.position === 'start'
|
|
292
292
|
? 'top'
|
|
293
293
|
: 'bottom';
|
|
294
|
-
return (h("le-component", { key: '
|
|
294
|
+
return (h("le-component", { key: '9a92363db43231088e476bca66dbbf47f26ebf34', component: "le-tabs", hostClass: classnames(classes) }, h("div", { key: '3c14f3367e2b281090721e5521bfa8a3b53f5b97', class: classes }, h("div", { key: 'cd4aad46f9a8e1ec5760f9388a0c4149556bfb06', class: {
|
|
295
295
|
'tablist': true,
|
|
296
296
|
'wrap-tabs': this.wrap,
|
|
297
297
|
[`overflow-${this.overflow}`]: true,
|
|
@@ -300,7 +300,7 @@ export class LeTabs {
|
|
|
300
300
|
const tabId = `tab-${config.value}`;
|
|
301
301
|
const panelId = `panel-${config.value}`;
|
|
302
302
|
return (h("le-tab", { key: config.value, id: tabId, class: "tab", mode: "default", variant: this.variant, selected: isSelected, disabled: config.disabled, size: this.size, position: tabPosition, align: this.orientation === 'vertical' ? 'start' : 'center', role: "tab", part: isSelected ? 'tab tab-active' : 'tab', "aria-selected": isSelected ? 'true' : 'false', "aria-controls": panelId, "aria-disabled": config.disabled ? 'true' : undefined, focusable: false, onClick: () => this.handleTabClick(config), iconStart: config.iconStart, iconEnd: config.iconEnd }, h("span", { class: "tab-label" }, config.label)));
|
|
303
|
-
})), h("div", { key: '
|
|
303
|
+
})), h("div", { key: '0b34e9ab8ce8f0e31ad9392bc3a6a60c92a0aa00', class: "panels", part: "panels" }, isDeclarativeMode ? (
|
|
304
304
|
// Declarative mode - render slot for le-tab-panel children
|
|
305
305
|
h("le-slot", { name: "", description: "Tab panels", type: "slot", allowedComponents: "le-tab-panel" }, h("slot", null))) : (
|
|
306
306
|
// Programmatic mode - render named slots
|
|
@@ -89,7 +89,7 @@ export class LeTag {
|
|
|
89
89
|
return h("span", { class: "tag-icon" }, this.icon);
|
|
90
90
|
}
|
|
91
91
|
render() {
|
|
92
|
-
return (h("le-component", { key: '
|
|
92
|
+
return (h("le-component", { key: '8c76ae38877bbb3ba35588adadee0cf61b76ffed', component: "le-tag" }, h("span", { key: 'a2dd1709505e58baada6fb9b40312e207435e8a6', class: "tag" }, this.renderIcon(), h("span", { key: '99bac5f6df170af17de5550b9f0489538e9760bc', class: "tag-label" }, h("le-slot", { key: '41740e400b168986980e8ff93187af9828cca5f9', name: "", tag: "span", type: "text" }, h("slot", { key: 'd823f3dc74c1e49b89fe5fff2df9d7e244d7d591' }, this.label))), this.dismissible && (h("button", { key: '96a058e3cab2d7fb091e1e6ec77404f8cf80358c', type: "button", class: "tag-dismiss", onClick: this.handleDismiss, disabled: this.disabled, "aria-label": "Remove" }, h("svg", { key: 'bfbb3f7c73aef6f06f5c45e98d4047d2aa629f2c', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '16a68b9458ccd806415d5ef8bda7fa1513cdf46d', d: "M4 4l8 8M12 4l-8 8" })))))));
|
|
93
93
|
}
|
|
94
94
|
static get is() { return "le-tag"; }
|
|
95
95
|
static get encapsulation() { return "shadow"; }
|
|
@@ -120,7 +120,7 @@ export class LeTurntable {
|
|
|
120
120
|
this.el.style.transform = `rotate(${angle}deg)`;
|
|
121
121
|
}
|
|
122
122
|
render() {
|
|
123
|
-
return (h("div", { key: '
|
|
123
|
+
return (h("div", { key: '50d1e3a01db9e77a3c391e04af74b70f39c23f8f', class: "turntable", onMouseDown: this.handleMouseDown.bind(this) }, h("slot", { key: 'a4c5d3cc2a99edf860ff7aa5318fa76443cdd2fd' })));
|
|
124
124
|
}
|
|
125
125
|
static get is() { return "le-turntable"; }
|
|
126
126
|
static get encapsulation() { return "shadow"; }
|