le-kit 0.1.4 → 0.1.6

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.
Files changed (75) hide show
  1. package/dist/cjs/{index-CO4npcak.js → index-WzJ78D5H.js} +9 -2
  2. package/dist/cjs/{index-CO4npcak.js.map → index-WzJ78D5H.js.map} +1 -1
  3. package/dist/cjs/index.cjs.js +2 -2
  4. package/dist/cjs/le-box.cjs.entry.js +2 -2
  5. package/dist/cjs/le-button.le-checkbox.le-component.le-popover.le-slot.le-string-input.entry.cjs.js.map +1 -1
  6. package/dist/cjs/le-button_6.cjs.entry.js +25 -22
  7. package/dist/cjs/le-card.cjs.entry.js +2 -2
  8. package/dist/cjs/le-kit.cjs.js +1 -1
  9. package/dist/cjs/le-number-input.cjs.entry.js +2 -2
  10. package/dist/cjs/le-popup.cjs.entry.js +1 -1
  11. package/dist/cjs/le-round-progress.cjs.entry.js +1 -1
  12. package/dist/cjs/le-stack.cjs.entry.js +2 -2
  13. package/dist/cjs/le-text.cjs.entry.js +2 -2
  14. package/dist/cjs/le-turntable.cjs.entry.js +1 -1
  15. package/dist/cjs/loader.cjs.js +1 -1
  16. package/dist/cjs/{utils-BeT0iyCQ.js → utils-CBjH2E8A.js} +3 -3
  17. package/dist/cjs/{utils-BeT0iyCQ.js.map → utils-CBjH2E8A.js.map} +1 -1
  18. package/dist/collection/assets/.gitkeep +1 -0
  19. package/dist/collection/assets/custom-elements.json +4305 -0
  20. package/dist/collection/components/le-component/le-component.js +10 -8
  21. package/dist/collection/components/le-component/le-component.js.map +1 -1
  22. package/dist/collection/components/le-slot/le-slot.js +15 -14
  23. package/dist/collection/components/le-slot/le-slot.js.map +1 -1
  24. package/dist/components/le-button2.js +24 -21
  25. package/dist/components/le-button2.js.map +1 -1
  26. package/dist/docs.json +2 -2
  27. package/dist/esm/{index-D71TXvJa.js → index-CdjJ98OT.js} +9 -3
  28. package/dist/esm/{index-D71TXvJa.js.map → index-CdjJ98OT.js.map} +1 -1
  29. package/dist/esm/index.js +2 -2
  30. package/dist/esm/le-box.entry.js +2 -2
  31. package/dist/esm/le-button.le-checkbox.le-component.le-popover.le-slot.le-string-input.entry.js.map +1 -1
  32. package/dist/esm/le-button_6.entry.js +25 -22
  33. package/dist/esm/le-card.entry.js +2 -2
  34. package/dist/esm/le-kit.js +2 -2
  35. package/dist/esm/le-number-input.entry.js +2 -2
  36. package/dist/esm/le-popup.entry.js +1 -1
  37. package/dist/esm/le-round-progress.entry.js +1 -1
  38. package/dist/esm/le-stack.entry.js +2 -2
  39. package/dist/esm/le-text.entry.js +2 -2
  40. package/dist/esm/le-turntable.entry.js +1 -1
  41. package/dist/esm/loader.js +2 -2
  42. package/dist/esm/{utils-CJLZrrdC.js → utils-CzfSUhYB.js} +3 -3
  43. package/dist/esm/{utils-CJLZrrdC.js.map → utils-CzfSUhYB.js.map} +1 -1
  44. package/dist/le-kit/assets/custom-elements.json +4305 -0
  45. package/dist/le-kit/index.esm.js +1 -1
  46. package/dist/le-kit/le-button.le-checkbox.le-component.le-popover.le-slot.le-string-input.entry.esm.js.map +1 -1
  47. package/dist/le-kit/le-kit.esm.js +1 -1
  48. package/dist/le-kit/{p-cfc35bd3.entry.js → p-0633b3ab.entry.js} +2 -2
  49. package/dist/le-kit/{p-0955b105.entry.js → p-1452a995.entry.js} +2 -2
  50. package/dist/le-kit/{p-18d79ee2.entry.js → p-220528ee.entry.js} +2 -2
  51. package/dist/le-kit/p-32ff3dbe.entry.js +2 -0
  52. package/dist/le-kit/p-32ff3dbe.entry.js.map +1 -0
  53. package/dist/le-kit/{p-d04da1f5.entry.js → p-3551598e.entry.js} +2 -2
  54. package/dist/le-kit/{p-79d179bd.entry.js → p-722899f0.entry.js} +2 -2
  55. package/dist/le-kit/{p-c8a9288e.entry.js → p-95764888.entry.js} +2 -2
  56. package/dist/le-kit/{p-D71TXvJa.js → p-CdjJ98OT.js} +2 -2
  57. package/dist/le-kit/{p-D71TXvJa.js.map → p-CdjJ98OT.js.map} +1 -1
  58. package/dist/le-kit/{p-qIai5-eB.js → p-CvDc0yWN.js} +2 -2
  59. package/dist/le-kit/{p-qIai5-eB.js.map → p-CvDc0yWN.js.map} +1 -1
  60. package/dist/le-kit/{p-024a764e.entry.js → p-bc20e30d.entry.js} +2 -2
  61. package/dist/le-kit/{p-4b1d3b6d.entry.js → p-d32eddad.entry.js} +2 -2
  62. package/dist/types/components.d.ts +4 -4
  63. package/package.json +1 -1
  64. package/dist/le-kit/index-D21JjI31.js.map +0 -1
  65. package/dist/le-kit/p-073cf0b9.entry.js +0 -2
  66. package/dist/le-kit/p-073cf0b9.entry.js.map +0 -1
  67. package/dist/le-kit/utils-apol-Xc_.js.map +0 -1
  68. /package/dist/le-kit/{p-cfc35bd3.entry.js.map → p-0633b3ab.entry.js.map} +0 -0
  69. /package/dist/le-kit/{p-0955b105.entry.js.map → p-1452a995.entry.js.map} +0 -0
  70. /package/dist/le-kit/{p-18d79ee2.entry.js.map → p-220528ee.entry.js.map} +0 -0
  71. /package/dist/le-kit/{p-d04da1f5.entry.js.map → p-3551598e.entry.js.map} +0 -0
  72. /package/dist/le-kit/{p-79d179bd.entry.js.map → p-722899f0.entry.js.map} +0 -0
  73. /package/dist/le-kit/{p-c8a9288e.entry.js.map → p-95764888.entry.js.map} +0 -0
  74. /package/dist/le-kit/{p-024a764e.entry.js.map → p-bc20e30d.entry.js.map} +0 -0
  75. /package/dist/le-kit/{p-4b1d3b6d.entry.js.map → p-d32eddad.entry.js.map} +0 -0
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
4
- var utils = require('./utils-BeT0iyCQ.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
+ var utils = require('./utils-CBjH2E8A.js');
5
5
 
6
6
  const leButtonDefaultCss = ":host{display:inline-block;--le-button-border-radius:var(--le-radius-md);--le-button-padding-x:0.4rem;--le-button-padding-y:0.4rem;--le-button-small-padding:0.25rem;--le-button-font-size:var(--le-font-size-md);--le-button-font-weight:var(--le-font-weight-medium);--le-button-transition:var(--le-transition-fast);--le-button-icon-aspect-ratio:1;--_btn-bg:var(--le-color-primary);--_btn-bg-hover:var(--le-color-primary-dark);--_btn-bg-system:var(--le-color-black);--_btn-color:var(--le-color-primary-contrast);--_btn-border-color:var(--le-color-primary)}:host([full-width]){display:block;width:100%}.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--le-spacing-3);width:100%;padding:var(--le-button-padding-y) var(--le-button-padding-x);border:1px solid var(--_btn-border-color);border-radius:var(--le-button-border-radius);background:var(--_btn-bg);color:var(--_btn-color);font-family:var(--le-font-family-base);font-size:var(--le-button-font-size);font-weight:var(--le-button-font-weight);line-height:var(--le-line-height-tight);text-decoration:none;cursor:pointer;transition:background-color var(--le-button-transition) var(--le-transition-easing),\n border-color var(--le-button-transition) var(--le-transition-easing),\n box-shadow var(--le-button-transition) var(--le-transition-easing),\n transform var(--le-button-transition) var(--le-transition-easing)}.button:hover:not(:disabled){background:var(--_btn-bg-hover);border-color:var(--_btn-bg-hover)}.button:active:not(:disabled){transform:translateY(1px)}.button:focus-visible{outline:2px solid var(--le-color-focus);outline-offset:2px}.button:disabled{opacity:0.5;cursor:not-allowed}:host>le-component.color-primary{--_btn-bg:var(--le-color-primary);--_btn-bg-hover:var(--le-color-primary-dark);--_btn-color:var(--le-color-primary-contrast);--_btn-border-color:var(--le-color-primary)}:host>le-component.color-secondary{--_btn-bg:var(--le-color-secondary);--_btn-bg-hover:var(--le-color-secondary-dark);--_btn-color:var(--le-color-secondary-contrast);--_btn-border-color:var(--le-color-secondary)}:host>le-component.color-success{--_btn-bg:var(--le-color-success);--_btn-bg-hover:var(--le-color-success-dark);--_btn-color:var(--le-color-success-contrast);--_btn-border-color:var(--le-color-success)}:host>le-component.color-warning{--_btn-bg:var(--le-color-warning);--_btn-bg-hover:var(--le-color-warning-dark);--_btn-color:var(--le-color-warning-contrast);--_btn-border-color:var(--le-color-warning)}:host>le-component.color-danger{--_btn-bg:var(--le-color-danger);--_btn-bg-hover:var(--le-color-danger-dark);--_btn-color:var(--le-color-danger-contrast);--_btn-border-color:var(--le-color-danger)}:host>le-component.color-info{--_btn-bg:var(--le-color-info);--_btn-bg-hover:var(--le-color-info-dark);--_btn-color:var(--le-color-info-contrast);--_btn-border-color:var(--le-color-info)}:host>le-component.variant-solid .button{box-shadow:var(--le-shadow-sm)}:host>le-component.variant-solid .button:hover:not(:disabled){box-shadow:var(--le-shadow-md)}:host>le-component.variant-outlined .button{background:transparent;color:var(--_btn-bg);border-color:var(--_btn-border-color)}:host>le-component.variant-outlined .button:hover:not(:disabled){background:var(--_btn-bg);color:var(--_btn-color)}:host>le-component.variant-clear .button{background:transparent;color:var(--_btn-bg);border-color:transparent}:host>le-component.variant-clear .button:hover:not(:disabled){background:var(--le-color-gray-100);border-color:transparent}:host>le-component.variant-system .button{background:transparent;color:var(--_btn-bg-system);border-color:transparent}:host>le-component.size-small .button{--le-button-padding-x:0.4rem;--le-button-padding-y:0.3rem;--le-button-padding-top:0.35rem;--le-button-font-size:var(--le-button-small-font-size, var(--le-font-size-xs))}:host>le-component.size-large .button{--le-button-padding-x:0.9rem;--le-button-padding-y:0.6rem;--le-button-font-size:var(--le-font-size-xl)}:host>le-component.full-width{display:block;width:100%}:host>le-component.selected .button{box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.2)}:host>le-component.variant-outlined.selected .button,:host>le-component.variant-clear.selected .button{background:var(--_btn-bg);color:var(--_btn-color)}:host>le-component.icon-only .button{padding:0.5rem;padding-bottom:0.6rem;aspect-ratio:var(--le-button-icon-aspect-ratio, 1)}:host>le-component.icon-only.size-small .button{padding:var(--le-button-small-padding, 0.25rem)}:host>le-component.icon-only.size-large .button{padding:0.75rem}:host>le-component.icon-only .content{display:none}.content{display:inline}.content:empty{display:none}.icon-start,.icon-only,.icon-end{display:flex;align-items:center;justify-content:center}.icon-start:empty,.icon-only:empty,.icon-end:empty{display:none}::slotted([slot=\"icon-start\"]),::slotted([slot=\"icon-only\"]),::slotted([slot=\"icon-end\"]){display:flex;align-items:center;justify-content:center;width:1.125em;height:1.125em}";
7
7
 
@@ -190,7 +190,7 @@ const LeComponent = class {
190
190
  // Find the host element - le-component is rendered inside the component's shadow DOM,
191
191
  // so we need to find the shadow root's host element
192
192
  this.findHostElement();
193
- this.disconnectModeObserver = utils.observeModeChanges(this.el, (mode) => {
193
+ this.disconnectModeObserver = utils.observeModeChanges(this.el, mode => {
194
194
  this.adminMode = mode === 'admin';
195
195
  // Load metadata and refresh property values only when entering admin mode
196
196
  if (this.adminMode) {
@@ -237,8 +237,9 @@ const LeComponent = class {
237
237
  */
238
238
  async loadComponentMetadata() {
239
239
  try {
240
- // Fetch the manifest - in production this would be bundled or cached
241
- const response = await fetch('/custom-elements.json');
240
+ // Fetch the manifest using getAssetPath for correct bundle path
241
+ const manifestPath = index.getAssetPath('assets/custom-elements.json');
242
+ const response = await fetch(manifestPath);
242
243
  const manifest = await response.json();
243
244
  // Find the component definition
244
245
  for (const module of manifest.modules) {
@@ -342,7 +343,7 @@ const LeComponent = class {
342
343
  */
343
344
  renderPropertyEditor() {
344
345
  const hasProperties = this.componentMeta && this.componentMeta.attributes.length > 0;
345
- return (index.h("div", { class: "property-editor-container" }, hasProperties ? (index.h("form", { class: "property-editor", onSubmit: (e) => e.preventDefault() }, this.componentMeta.attributes.map(attr => this.renderPropertyField(attr)))) : (index.h("p", { class: "no-properties" }, "No editable properties")), index.h("div", { class: "property-editor-actions" }, index.h("le-button", { type: "button", variant: "outlined", color: "danger", "full-width": true, onClick: () => this.deleteComponent() }, index.h("span", { slot: "icon-start" }, "\uD83D\uDDD1\uFE0F"), index.h("span", null, "Delete Component")))));
346
+ return (index.h("div", { class: "property-editor-container" }, hasProperties ? (index.h("form", { class: "property-editor", onSubmit: e => e.preventDefault() }, this.componentMeta.attributes.map(attr => this.renderPropertyField(attr)))) : (index.h("p", { class: "no-properties" }, "No editable properties")), index.h("div", { class: "property-editor-actions" }, index.h("le-button", { type: "button", variant: "outlined", color: "danger", "full-width": true, onClick: () => this.deleteComponent() }, index.h("span", { slot: "icon-start" }, "\uD83D\uDDD1\uFE0F"), index.h("span", null, "Delete Component")))));
346
347
  }
347
348
  /**
348
349
  * Render a single property field based on its type
@@ -354,15 +355,15 @@ const LeComponent = class {
354
355
  const enumMatch = type.match(/^'[^']+'/);
355
356
  if (enumMatch) {
356
357
  const options = type.split('|').map(opt => opt.trim().replace(/'/g, ''));
357
- return (index.h("div", { class: "property-field" }, index.h("label", { htmlFor: `prop-${attr.name}` }, attr.name, attr.description && index.h("span", { class: "property-hint" }, attr.description)), index.h("select", { id: `prop-${attr.name}`, onChange: (e) => this.handlePropertyChange(attr.name, e.target.value, type) }, options.map(opt => (index.h("option", { value: opt, selected: value === opt || (!value && attr.default?.replace(/'/g, '') === opt) }, opt))))));
358
+ return (index.h("div", { class: "property-field" }, index.h("label", { htmlFor: `prop-${attr.name}` }, attr.name, attr.description && index.h("span", { class: "property-hint" }, attr.description)), index.h("select", { id: `prop-${attr.name}`, onChange: e => this.handlePropertyChange(attr.name, e.target.value, type) }, options.map(opt => (index.h("option", { value: opt, selected: value === opt || (!value && attr.default?.replace(/'/g, '') === opt) }, opt))))));
358
359
  }
359
360
  // Boolean type
360
361
  if (type === 'boolean') {
361
- return (index.h("div", { class: "property-field property-field--checkbox" }, index.h("le-checkbox", { name: `prop-${attr.name}`, checked: value === true || value === '', onChange: (e) => this.handlePropertyChange(attr.name, e.target.checked, type) }, attr.name, attr.description && index.h("div", { slot: "description" }, attr.description))));
362
+ return (index.h("div", { class: "property-field property-field--checkbox" }, index.h("le-checkbox", { name: `prop-${attr.name}`, checked: value === true || value === '', onChange: e => this.handlePropertyChange(attr.name, e.target.checked, type) }, attr.name, attr.description && index.h("div", { slot: "description" }, attr.description))));
362
363
  }
363
364
  // Number type
364
365
  if (type === 'number') {
365
- return (index.h("div", { class: "property-field" }, index.h("label", { htmlFor: `prop-${attr.name}` }, attr.name, attr.description && index.h("span", { class: "property-hint" }, attr.description)), index.h("input", { type: "number", id: `prop-${attr.name}`, value: value ?? '', placeholder: attr.default, onChange: (e) => this.handlePropertyChange(attr.name, e.target.value, type) })));
366
+ return (index.h("div", { class: "property-field" }, index.h("label", { htmlFor: `prop-${attr.name}` }, attr.name, attr.description && index.h("span", { class: "property-hint" }, attr.description)), index.h("input", { type: "number", id: `prop-${attr.name}`, value: value ?? '', placeholder: attr.default, onChange: e => this.handlePropertyChange(attr.name, e.target.value, type) })));
366
367
  }
367
368
  // Default: string/text input
368
369
  return (index.h("div", { class: "property-field" }, index.h("le-string-input", { name: `prop-${attr.name}`, label: attr.name, value: value ?? '', placeholder: attr.default?.replace(/'/g, ''), onChange: (e) => this.handlePropertyChange(attr.name, e.detail.value, type) }, index.h("span", { slot: "description" }, attr.description))));
@@ -376,6 +377,7 @@ const LeComponent = class {
376
377
  // In admin mode, show wrapper with header and settings
377
378
  return (index.h(index.Host, { class: utils.classnames(this.component, this.hostClass, 'admin-mode'), style: this.hostStyle }, index.h("div", { class: "le-component-wrapper" }, index.h("div", { class: "le-component-header" }, index.h("span", { class: "le-component-name" }, name), index.h("le-popover", { popoverTitle: `${name} Settings`, position: "right", align: "start", "min-width": "300px", mode: "default" }, index.h("le-button", { type: "button", class: "le-component-button", slot: "trigger", variant: "clear", size: "small", "aria-label": "Edit component properties", "icon-only": true }, index.h("span", { class: "le-component-trigger", slot: "icon-only" }, "\u2699")), this.renderPropertyEditor())), index.h("div", { class: "le-component-content" }, index.h("slot", null)))));
378
379
  }
380
+ static get assetsDirs() { return ["../../assets"]; }
379
381
  };
380
382
  LeComponent.style = leComponentCss;
381
383
 
@@ -819,7 +821,7 @@ const LeSlot = class {
819
821
  leSlotChange;
820
822
  disconnectModeObserver;
821
823
  connectedCallback() {
822
- this.disconnectModeObserver = utils.observeModeChanges(this.el, (mode) => {
824
+ this.disconnectModeObserver = utils.observeModeChanges(this.el, mode => {
823
825
  const wasAdmin = this.adminMode;
824
826
  this.adminMode = mode === 'admin';
825
827
  // When entering admin mode, read content from slotted elements
@@ -923,8 +925,7 @@ const LeSlot = class {
923
925
  if (!this.name && rootNode instanceof ShadowRoot) {
924
926
  const hostComponent = rootNode.host;
925
927
  Array.from(hostComponent.childNodes).forEach(node => {
926
- if (node.nodeType === Node.TEXT_NODE ||
927
- (node.nodeType === Node.ELEMENT_NODE && !node.hasAttribute('slot'))) {
928
+ if (node.nodeType === Node.TEXT_NODE || (node.nodeType === Node.ELEMENT_NODE && !node.hasAttribute('slot'))) {
928
929
  node.remove();
929
930
  }
930
931
  });
@@ -944,7 +945,7 @@ const LeSlot = class {
944
945
  this.leSlotChange.emit({
945
946
  name: this.name,
946
947
  value: this.textValue,
947
- isValid: this.isValidHtml
948
+ isValid: this.isValidHtml,
948
949
  });
949
950
  };
950
951
  /**
@@ -980,7 +981,8 @@ const LeSlot = class {
980
981
  */
981
982
  async loadAvailableComponents() {
982
983
  try {
983
- const response = await fetch('/custom-elements.json');
984
+ const manifestPath = index.getAssetPath('assets/custom-elements.json');
985
+ const response = await fetch(manifestPath);
984
986
  const manifest = await response.json();
985
987
  const components = [];
986
988
  const allowedList = this.allowedComponents?.split(',').map(s => s.trim()) || [];
@@ -1003,7 +1005,7 @@ const LeSlot = class {
1003
1005
  }
1004
1006
  }
1005
1007
  }
1006
- this.availableComponents = components;
1008
+ this.availableComponents = components || [];
1007
1009
  }
1008
1010
  catch (error) {
1009
1011
  console.warn('[le-slot] Failed to load component manifest:', error);
@@ -1055,17 +1057,17 @@ const LeSlot = class {
1055
1057
  render() {
1056
1058
  const displayLabel = this.label || this.name;
1057
1059
  // Always render the same structure, CSS handles visibility via .admin-mode class
1058
- return (index.h(index.Host, { key: 'bae03733e0443c10f1abe8b4c846d3eae0723d3d', class: {
1060
+ return (index.h(index.Host, { key: 'af150a31db62d9c3df9a8c10be34b9bb6756d07f', class: {
1059
1061
  'admin-mode': this.adminMode,
1060
- 'invalid-html': !this.isValidHtml
1062
+ 'invalid-html': !this.isValidHtml,
1061
1063
  }, 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 ? (index.h("div", { class: "le-slot-container" }, index.h("div", { class: utils.classnames('le-slot-header', {
1062
1064
  'le-slot-header-no-label': !displayLabel,
1063
1065
  'le-slot-header-text': this.type === 'text',
1064
- 'le-slot-header-error': !this.isValidHtml
1065
- }) }, displayLabel && (index.h("span", { class: "le-slot-label" }, displayLabel, this.required && index.h("span", { class: "le-slot-required" }, "*"))), !this.isValidHtml && index.h("span", { class: "le-slot-invalid" }, "\u26A0 Invalid HTML"), this.type === 'slot' && this.adminMode && (index.h("le-popover", { mode: "default", showClose: true, align: "start", position: "right", popoverTitle: "Add Component", open: this.pickerOpen, onLePopoverOpen: () => this.pickerOpen = true, onLePopoverClose: () => this.pickerOpen = false }, index.h("le-button", { type: "button", class: "le-slot-button", slot: "trigger", variant: "clear", size: "small", "aria-label": "Add component", "icon-only": true }, index.h("span", { class: "le-slot-add-btn", slot: "icon-only" }, "+")), index.h("div", { class: "le-slot-picker" }, this.availableComponents.length > 0 ? (index.h("ul", { class: "le-slot-picker-list" }, this.availableComponents.map(component => (index.h("li", { key: component.tagName }, index.h("button", { class: "le-slot-picker-item", onClick: () => {
1066
+ 'le-slot-header-error': !this.isValidHtml,
1067
+ }) }, displayLabel && (index.h("span", { class: "le-slot-label" }, displayLabel, this.required && index.h("span", { class: "le-slot-required" }, "*"))), !this.isValidHtml && index.h("span", { class: "le-slot-invalid" }, "\u26A0 Invalid HTML"), this.type === 'slot' && this.adminMode && (index.h("le-popover", { mode: "default", showClose: true, align: "start", position: "right", popoverTitle: "Add Component", open: this.pickerOpen, onLePopoverOpen: () => (this.pickerOpen = true), onLePopoverClose: () => (this.pickerOpen = false) }, index.h("le-button", { type: "button", class: "le-slot-button", slot: "trigger", variant: "clear", size: "small", "aria-label": "Add component", "icon-only": true }, index.h("span", { class: "le-slot-add-btn", slot: "icon-only" }, "+")), index.h("div", { class: "le-slot-picker" }, this.availableComponents.length > 0 ? (index.h("ul", { class: "le-slot-picker-list" }, this.availableComponents.map(component => (index.h("li", { key: component.tagName }, index.h("button", { class: "le-slot-picker-item", onClick: () => {
1066
1068
  this.addComponent(component.tagName);
1067
1069
  this.pickerOpen = false;
1068
- } }, index.h("span", { class: "le-slot-picker-name" }, component.name), component.description && (index.h("span", { class: "le-slot-picker-desc" }, component.description)))))))) : (index.h("div", { class: "le-slot-picker-empty" }, "No components available")))))), this.renderContent())) : (
1070
+ } }, index.h("span", { class: "le-slot-picker-name" }, component.name), component.description && index.h("span", { class: "le-slot-picker-desc" }, component.description))))))) : (index.h("div", { class: "le-slot-picker-empty" }, "No components available")))))), this.renderContent())) : (
1069
1071
  // In default mode, just pass through the slot - slotted content renders naturally
1070
1072
  // Note: We use unnamed slot here because named slots from parent component
1071
1073
  // are passed as le-slot's light DOM children
@@ -1076,7 +1078,7 @@ const LeSlot = class {
1076
1078
  // Wrap in a hidden div since slot elements can't have style prop in Stencil
1077
1079
  // Note: We use unnamed slot here because named slots from parent component
1078
1080
  // are passed as le-slot's light DOM children
1079
- const slotElement = (index.h("div", { class: "hidden-slot" }, index.h("slot", { ref: (el) => this.slotRef = el, onSlotchange: this.handleSlotChange })));
1081
+ const slotElement = (index.h("div", { class: "hidden-slot" }, index.h("slot", { ref: el => (this.slotRef = el), onSlotchange: this.handleSlotChange })));
1080
1082
  switch (this.type) {
1081
1083
  case 'text':
1082
1084
  return (index.h("div", { class: { 'le-slot-input': true, 'has-error': !this.isValidHtml } }, index.h("le-string-input", { mode: "default", value: this.textValue, placeholder: this.placeholder || `Enter ${this.label || this.name || 'text'}...`, onChange: this.handleTextInput }), slotElement));
@@ -1096,9 +1098,10 @@ const LeSlot = class {
1096
1098
  }
1097
1099
  });
1098
1100
  }
1099
- return (index.h("div", { class: "le-slot-dropzone", style: dropzoneStyle }, index.h("slot", { ref: (el) => this.slotRef = el, onSlotchange: this.handleSlotChange })));
1101
+ return (index.h("div", { class: "le-slot-dropzone", style: dropzoneStyle }, index.h("slot", { ref: el => (this.slotRef = el), onSlotchange: this.handleSlotChange })));
1100
1102
  }
1101
1103
  }
1104
+ static get assetsDirs() { return ["../../assets"]; }
1102
1105
  };
1103
1106
  LeSlot.style = leSlotDefaultCss;
1104
1107
 
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
4
- var utils = require('./utils-BeT0iyCQ.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
+ var utils = require('./utils-CBjH2E8A.js');
5
5
 
6
6
  const leCardDefaultCss = ":host{display:block;--le-card-bg:var(--le-color-surface);--le-card-border-radius:var(--le-radius-lg);--le-card-shadow:var(--le-shadow-md);--le-card-shadow-elevated:var(--le-shadow-lg);--le-card-shadow-hover:var(--le-shadow-xl);--le-card-padding:var(--le-space-md);--le-card-border-color:var(--le-color-border);--le-card-transition:var(--le-transition-normal)}.card{background:var(--le-card-bg);border-radius:var(--le-card-border-radius);overflow:hidden;color:var(--le-color-text);box-shadow:var(--le-card-shadow)}:host>le-component.variant-outlined .card{border:1px solid var(--le-card-border-color);box-shadow:none}:host>le-component.variant-elevated .card{box-shadow:var(--le-card-shadow-elevated)}:host>le-component.interactive .card{cursor:pointer;transition:transform var(--le-card-transition), box-shadow var(--le-card-transition)}:host>le-component.interactive .card:hover{transform:translateY(-2px);box-shadow:var(--le-card-shadow-hover)}:host>le-component.interactive .card:focus-visible{outline:2px solid var(--le-color-border-focus);outline-offset:2px}.card-header{padding:var(--le-card-padding);padding-bottom:0}.card-header:empty{display:none}.card-content{padding:var(--le-card-padding)}.card-footer{padding:var(--le-card-padding);padding-top:0}.card-footer:empty{display:none}";
7
7
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
4
 
5
5
  var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
6
6
  /*
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
4
- var utils = require('./utils-BeT0iyCQ.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
+ var utils = require('./utils-CBjH2E8A.js');
5
5
 
6
6
  const leNumberInputCss = ":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-padding:2px 6px;--le-input-height:1.5rem;--le-input-label-color:var(--le-color-text-primary, #333333);--le-input-desc-color:var(--le-color-text-secondary, #666666);--le-input-placeholder-color:#999999;--le-input-border-error:2px solid var(--le-color-danger, #dc3545);--le-input-error-color:var(--le-color-danger, #dc3545)}.le-input-wrapper{display:flex;flex-direction:column;gap:2px}.le-input-label{display:block;font-size:0.9em;font-weight:500;color:var(--le-input-label-color);margin-bottom:2px}.le-input-container{position:relative;display:flex;align-items:center;background:var(--le-input-bg);border:var(--le-input-border);border-radius:var(--le-input-radius);transition:border-color 0.2s}.le-input-container:focus-within{outline:2px solid var(--le-color-focus);outline-offset:2px}.le-input-container.has-error{border:var(--le-input-border-error)}:host([disabled]) .le-input-container{opacity:0.6;background-color:rgba(0,0,0,0.05);cursor:not-allowed}input{flex:1;width:100%;height:calc(var(--le-input-height) - 2px);padding:var(--le-input-padding);border:none;background:transparent;color:var(--le-input-color);font-family:inherit;font-size:inherit;outline:none;text-align:right;-moz-appearance:textfield;}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input::placeholder{color:var(--le-input-placeholder-color)}.icon-start,.icon-end{display:flex;align-items:center;justify-content:center;padding:0 8px;color:var(--le-input-desc-color)}.le-input-controls{display:flex;flex-direction:column;border-left:1px solid var(--le-color-border, #cccccc);height:100%}.le-input-control-btn{--le-button-border-radius:0;--le-button-padding-x:0;--le-button-padding-y:0;--le-button-small-font-size:9.5px;--le-button-small-padding:0 0.2rem;--le-button-icon-aspect-ratio:2;display:flex;align-items:center;justify-content:center;height:50%;cursor:pointer;background:none;border:none;color:var(--le-input-desc-color);font-size:10px;line-height:1}.le-input-control-btn:hover{background-color:rgba(0,0,0,0.05);color:var(--le-color-primary, #007bff)}.le-input-control-btn:active{background-color:rgba(0,0,0,0.1)}.le-input-description{font-size:0.85em;color:var(--le-input-desc-color);margin-top:2px}.le-input-error{font-size:0.85em;color:var(--le-input-error-color);margin-top:2px}";
7
7
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
4
 
5
5
  const lePopupCss = ":host{display:contents}.le-popup-dialog{position:fixed;z-index:100;top:0;right:0;bottom:0;left:0;padding:0;border:none;background:transparent;max-width:none;max-height:none;overflow:visible;--_popup-min-width:var(--le-popup-min-width, 320px);--_popup-max-width:var(--le-popup-max-width, min(500px, 90vw));--_popup-min-height:var(--le-popup-min-height, auto)}.le-popup-dialog::backdrop{background:var(--le-popup-backdrop-color, rgba(0, 0, 0, 0.5));animation:le-popup-backdrop-fade 0.2s ease-out}@keyframes le-popup-backdrop-fade{from{opacity:0}to{opacity:1}}.le-popup-position-center{margin:auto}.le-popup-position-top{margin:var(--le-space-2xl, 48px) auto auto auto}.le-popup-position-top-left{margin:var(--le-space-lg, 24px) auto auto var(--le-space-lg, 24px)}.le-popup-position-top-right{margin:var(--le-space-lg, 24px) var(--le-space-lg, 24px) auto auto}.le-popup-position-bottom{margin:auto auto var(--le-space-2xl, 48px) auto}.le-popup-position-bottom-left{margin:auto auto var(--le-space-lg, 24px) var(--le-space-lg, 24px)}.le-popup-position-bottom-right{margin:auto var(--le-space-lg, 24px) var(--le-space-lg, 24px) auto}.le-popup-container{display:flex;flex-direction:column;min-width:var(--_popup-min-width);max-width:var(--_popup-max-width);min-height:var(--_popup-min-height);max-height:calc(100vh - var(--le-space-2xl, 48px) * 2);background:var(--le-color-surface, #ffffff);border:1px solid var(--le-color-border, #e0e0e0);border-radius:var(--le-radius-lg, 12px);box-shadow:var(--le-shadow-xl, 0 8px 32px rgba(0, 0, 0, 0.15));overflow:hidden;font-family:var(--le-font-family, system-ui, -apple-system, sans-serif);color:var(--le-color-text, #333);animation:le-popup-appear 0.2s ease-out}@keyframes le-popup-appear{from{opacity:0;transform:scale(0.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.le-popup-header{flex-shrink:0;padding:var(--le-space-md, 16px) var(--le-space-lg, 24px);border-bottom:1px solid var(--le-color-border, #e0e0e0);background:var(--le-color-surface-alt, #f9f9f9);font-size:var(--le-font-size-lg, 1.125rem);font-weight:var(--le-font-weight-semibold, 600);color:var(--le-color-text, #333)}.le-popup-body{flex:1;padding:var(--le-space-lg, 24px);overflow-y:auto}.le-popup-message{margin:0;font-size:var(--le-font-size-md, 1rem);line-height:var(--le-line-height-relaxed, 1.6);color:var(--le-color-text, #333)}.le-popup-message+::slotted(*){margin-top:var(--le-space-md, 16px)}.le-popup-input{display:block;width:100%;margin-top:var(--le-space-md, 16px);padding:var(--le-space-sm, 8px) var(--le-space-md, 16px);font-family:inherit;font-size:var(--le-font-size-md, 1rem);color:var(--le-color-text, #333);background:var(--le-color-background, #fff);border:1px solid var(--le-color-border, #e0e0e0);border-radius:var(--le-radius-md, 8px);outline:none;transition:border-color var(--le-transition-fast, 0.15s ease),\n box-shadow var(--le-transition-fast, 0.15s ease);box-sizing:border-box}.le-popup-input:focus{border-color:var(--le-color-primary, #2196f3);box-shadow:0 0 0 3px var(--le-color-primary-light, rgba(33, 150, 243, 0.2))}.le-popup-input::placeholder{color:var(--le-color-text-muted, #999)}.le-popup-footer{flex-shrink:0;display:flex;justify-content:flex-end;gap:var(--le-space-sm, 8px);padding:var(--le-space-md, 16px) var(--le-space-lg, 24px);border-top:1px solid var(--le-color-border, #e0e0e0);background:var(--le-color-surface-alt, #f9f9f9)}.le-popup-btn{min-width:80px}@media (max-width: 480px){.le-popup-container{min-width:calc(100vw - var(--le-space-md, 16px) * 2);max-width:calc(100vw - var(--le-space-md, 16px) * 2)}.le-popup-footer{flex-direction:column-reverse}.le-popup-btn{width:100%}}";
6
6
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
4
 
5
5
  const leRoundProgressCss = ".round-progress--container{position:relative}.round-progress{position:absolute;top:0;left:0;right:0;bottom:0;display:block}.round-progress--progress{filter:drop-shadow(var(--progress-shadow))}.round-progress--circle{fill:none;stroke:var(--progress-color, #999);stroke-width:var(--progress-width, 4);stroke-linecap:var(--progress-linecap, round);animation:progress--circle 0.5s ease-out forwards;transition:stroke-dasharray 0.5s ease-out}@keyframes progress--circle{0%{stroke-dasharray:0 1000}}.round-progress--path{fill:none;stroke-linecap:round}";
6
6
 
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
4
- var utils = require('./utils-BeT0iyCQ.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
+ var utils = require('./utils-CBjH2E8A.js');
5
5
 
6
6
  const leStackDefaultCss = ":host{display:block}:host([hidden]){display:none}.stack{gap:var(--le-stack-gap, var(--le-space-md))}:host(.full-width){width:100%}:host(.full-height){height:100%}:host(.direction-horizontal) .stack{min-height:0}:host(.direction-vertical) .stack{min-width:0}";
7
7
 
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
4
- var utils = require('./utils-BeT0iyCQ.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
+ var utils = require('./utils-CBjH2E8A.js');
5
5
 
6
6
  const leTextDefaultCss = ":host{display:block}:host([hidden]){display:none}.le-text{margin:0;color:var(--le-text-color, var(--le-color-text));font-family:var(--le-font-family);line-height:var(--le-text-line-height, 1.5)}.variant-p{font-size:var(--le-font-size-base, 1rem);font-weight:var(--le-font-weight-normal, 400);color:var(--le-color-text)}.variant-h1{font-size:var(--le-font-size-4xl, 2.5rem);font-weight:var(--le-font-weight-bold, 700);line-height:1.2;color:var(--le-color-text);letter-spacing:-0.02em}.variant-h2{font-size:var(--le-font-size-3xl, 2rem);font-weight:var(--le-font-weight-bold, 700);line-height:1.25;color:var(--le-color-text);letter-spacing:-0.01em}.variant-h3{font-size:var(--le-font-size-2xl, 1.5rem);font-weight:var(--le-font-weight-semibold, 600);line-height:1.3;color:var(--le-color-text)}.variant-h4{font-size:var(--le-font-size-xl, 1.25rem);font-weight:var(--le-font-weight-semibold, 600);line-height:1.35;color:var(--le-color-text)}.variant-h5{font-size:var(--le-font-size-lg, 1.125rem);font-weight:var(--le-font-weight-medium, 500);line-height:1.4;color:var(--le-color-text)}.variant-h6{font-size:var(--le-font-size-base, 1rem);font-weight:var(--le-font-weight-medium, 500);line-height:1.45;color:var(--le-color-text);text-transform:uppercase;letter-spacing:0.05em}.variant-code{font-family:var(--le-font-family-mono, 'SF Mono', 'Fira Code', 'Consolas', monospace);font-size:var(--le-font-size-sm, 0.875rem);background:var(--le-color-surface-alt, #f5f5f5);padding:var(--le-space-md);border-radius:var(--le-radius-md);overflow-x:auto;white-space:pre-wrap;color:var(--le-color-text)}.variant-quote{font-size:var(--le-font-size-lg, 1.125rem);font-style:italic;color:var(--le-color-text-secondary);border-left:4px solid var(--le-color-primary);padding-left:var(--le-space-lg);margin-left:0;margin-right:0}.variant-label{font-size:var(--le-font-size-sm, 0.875rem);font-weight:var(--le-font-weight-medium, 500);color:var(--le-color-text-secondary);text-transform:uppercase;letter-spacing:0.05em}.variant-small{font-size:var(--le-font-size-sm, 0.875rem);color:var(--le-color-text-secondary)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.truncate.max-lines-2,.truncate.max-lines-3,.truncate.max-lines-4,.truncate.max-lines-5{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical}.truncate.max-lines-2{-webkit-line-clamp:2;line-clamp:2}.truncate.max-lines-3{-webkit-line-clamp:3;line-clamp:3}.truncate.max-lines-4{-webkit-line-clamp:4;line-clamp:4}.truncate.max-lines-5{-webkit-line-clamp:5;line-clamp:5}:host([align=\"center\"]) .le-text{text-align:center}:host([align=\"right\"]) .le-text{text-align:right}:host([align=\"justify\"]) .le-text{text-align:justify}.le-text a{color:var(--le-color-primary);text-decoration:underline}.le-text a:hover{color:var(--le-color-primary-dark)}.le-text strong,.le-text b{font-weight:var(--le-font-weight-bold, 700)}.le-text em,.le-text i{font-style:italic}.le-text u{text-decoration:underline}.le-text s,.le-text strike{text-decoration:line-through}";
7
7
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
4
 
5
5
  const leTurntableCss = ":host{display:block;cursor:grab}div.turntable{width:100%;height:100%;padding:1px}";
6
6
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
4
 
5
5
  const defineCustomElements = async (win, options) => {
6
6
  if (typeof window === 'undefined') return undefined;
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-CO4npcak.js');
3
+ var index = require('./index-WzJ78D5H.js');
4
4
 
5
5
  /**
6
6
  * Utility functions for le-kit components
@@ -147,6 +147,6 @@ exports.generateId = generateId;
147
147
  exports.observeModeChanges = observeModeChanges;
148
148
  exports.parseCommaSeparated = parseCommaSeparated;
149
149
  exports.slotHasContent = slotHasContent;
150
- //# sourceMappingURL=utils-BeT0iyCQ.js.map
150
+ //# sourceMappingURL=utils-CBjH2E8A.js.map
151
151
 
152
- //# sourceMappingURL=utils-BeT0iyCQ.js.map
152
+ //# sourceMappingURL=utils-CBjH2E8A.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"utils-BeT0iyCQ.js","sources":["src/utils/utils.ts"],"sourcesContent":["/**\n * Utility functions for le-kit components\n */\n\nimport { getMode } from '../global/app';\n\n/**\n * Generates a unique ID for component instances\n */\nexport function generateId(prefix: string = 'le'): string {\n return `${prefix}-${Math.random().toString(36).substring(2, 9)}`;\n}\n\n/**\n * Parses a comma-separated string into an array\n */\nexport function parseCommaSeparated(value: string | undefined): string[] {\n if (!value) return [];\n return value\n .split(',')\n .map(s => s.trim())\n .filter(Boolean);\n}\n\n/**\n * Checks if a slot has content\n */\nexport function slotHasContent(el: HTMLElement, slotName: string = ''): boolean {\n const selector = slotName ? `[slot=\"${slotName}\"]` : ':not([slot])';\n return el.querySelector(selector) !== null;\n}\n\n/**\n * Sets up a MutationObserver to track mode changes on ancestor elements.\n * Returns a cleanup function to disconnect the observer.\n * \n * If the element or any ancestor has an explicit `mode` attribute, that creates\n * a \"mode boundary\" - the mode is determined from that point, not from further up.\n * This allows components like le-popover to force default mode for their children.\n * \n * @param el - The component's host element\n * @param callback - Function to call when mode changes, receives the new mode\n * @returns Cleanup function to disconnect the observer\n * \n * @example\n * ```tsx\n * export class MyComponent {\n * @Element() el: HTMLElement;\n * @State() adminMode: boolean = false;\n * private disconnectModeObserver?: () => void;\n * \n * connectedCallback() {\n * this.disconnectModeObserver = observeModeChanges(this.el, (mode) => {\n * this.adminMode = mode === 'admin';\n * });\n * }\n * \n * disconnectedCallback() {\n * this.disconnectModeObserver?.();\n * }\n * }\n * ```\n */\nexport function observeModeChanges(\n el: HTMLElement,\n callback: (mode: string) => void\n): () => void {\n // Call immediately with current mode\n callback(getMode(el));\n\n // Set up observer for mode attribute changes\n const observer = new MutationObserver(() => {\n callback(getMode(el));\n });\n\n // Observe the element itself (for mode boundary changes)\n observer.observe(el, {\n attributes: true,\n attributeFilter: ['mode'],\n });\n\n // Observe document root\n observer.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['mode'],\n });\n\n // Traverse up, crossing shadow boundaries, and observe each element\n let current: Node | null = el;\n while (current) {\n if (current instanceof Element && current.parentElement) {\n current = current.parentElement;\n observer.observe(current, {\n attributes: true,\n attributeFilter: ['mode'],\n });\n // If this element has an explicit mode, it's a boundary\n if ((current as Element).hasAttribute('mode')) {\n break;\n }\n } else {\n // Check if we're in a shadow root\n const root = current.getRootNode();\n if (root instanceof ShadowRoot) {\n // Cross the shadow boundary and observe the host\n current = root.host;\n observer.observe(current, {\n attributes: true,\n attributeFilter: ['mode'],\n });\n // If the host has an explicit mode, it's a boundary\n if ((current as Element).hasAttribute('mode')) {\n break;\n }\n } else {\n break;\n }\n }\n }\n\n // Return cleanup function\n return () => observer.disconnect();\n}\n\n/**\n * Combines multiple class names into a single string, filtering out falsy values.\n * \n * @param classes - arguments of class names, undefined, arrays, objects with boolean values and nested combinations of these\n * @returns Combined class names string\n */\nexport function classnames(...classes: any[]): string {\n const result: string[] = [];\n\n classes.forEach(cls => {\n if (!cls) return;\n\n if (typeof cls === 'string') {\n result.push(cls);\n } else if (Array.isArray(cls)) {\n result.push(classnames(...cls));\n } else if (typeof cls === 'object') {\n Object.entries(cls).forEach(([key, value]) => {\n if (value) {\n result.push(key);\n }\n });\n }\n });\n\n return result.join(' ');\n}\n"],"names":["getMode"],"mappings":"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"}
1
+ {"version":3,"file":"utils-CBjH2E8A.js","sources":["src/utils/utils.ts"],"sourcesContent":["/**\n * Utility functions for le-kit components\n */\n\nimport { getMode } from '../global/app';\n\n/**\n * Generates a unique ID for component instances\n */\nexport function generateId(prefix: string = 'le'): string {\n return `${prefix}-${Math.random().toString(36).substring(2, 9)}`;\n}\n\n/**\n * Parses a comma-separated string into an array\n */\nexport function parseCommaSeparated(value: string | undefined): string[] {\n if (!value) return [];\n return value\n .split(',')\n .map(s => s.trim())\n .filter(Boolean);\n}\n\n/**\n * Checks if a slot has content\n */\nexport function slotHasContent(el: HTMLElement, slotName: string = ''): boolean {\n const selector = slotName ? `[slot=\"${slotName}\"]` : ':not([slot])';\n return el.querySelector(selector) !== null;\n}\n\n/**\n * Sets up a MutationObserver to track mode changes on ancestor elements.\n * Returns a cleanup function to disconnect the observer.\n * \n * If the element or any ancestor has an explicit `mode` attribute, that creates\n * a \"mode boundary\" - the mode is determined from that point, not from further up.\n * This allows components like le-popover to force default mode for their children.\n * \n * @param el - The component's host element\n * @param callback - Function to call when mode changes, receives the new mode\n * @returns Cleanup function to disconnect the observer\n * \n * @example\n * ```tsx\n * export class MyComponent {\n * @Element() el: HTMLElement;\n * @State() adminMode: boolean = false;\n * private disconnectModeObserver?: () => void;\n * \n * connectedCallback() {\n * this.disconnectModeObserver = observeModeChanges(this.el, (mode) => {\n * this.adminMode = mode === 'admin';\n * });\n * }\n * \n * disconnectedCallback() {\n * this.disconnectModeObserver?.();\n * }\n * }\n * ```\n */\nexport function observeModeChanges(\n el: HTMLElement,\n callback: (mode: string) => void\n): () => void {\n // Call immediately with current mode\n callback(getMode(el));\n\n // Set up observer for mode attribute changes\n const observer = new MutationObserver(() => {\n callback(getMode(el));\n });\n\n // Observe the element itself (for mode boundary changes)\n observer.observe(el, {\n attributes: true,\n attributeFilter: ['mode'],\n });\n\n // Observe document root\n observer.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['mode'],\n });\n\n // Traverse up, crossing shadow boundaries, and observe each element\n let current: Node | null = el;\n while (current) {\n if (current instanceof Element && current.parentElement) {\n current = current.parentElement;\n observer.observe(current, {\n attributes: true,\n attributeFilter: ['mode'],\n });\n // If this element has an explicit mode, it's a boundary\n if ((current as Element).hasAttribute('mode')) {\n break;\n }\n } else {\n // Check if we're in a shadow root\n const root = current.getRootNode();\n if (root instanceof ShadowRoot) {\n // Cross the shadow boundary and observe the host\n current = root.host;\n observer.observe(current, {\n attributes: true,\n attributeFilter: ['mode'],\n });\n // If the host has an explicit mode, it's a boundary\n if ((current as Element).hasAttribute('mode')) {\n break;\n }\n } else {\n break;\n }\n }\n }\n\n // Return cleanup function\n return () => observer.disconnect();\n}\n\n/**\n * Combines multiple class names into a single string, filtering out falsy values.\n * \n * @param classes - arguments of class names, undefined, arrays, objects with boolean values and nested combinations of these\n * @returns Combined class names string\n */\nexport function classnames(...classes: any[]): string {\n const result: string[] = [];\n\n classes.forEach(cls => {\n if (!cls) return;\n\n if (typeof cls === 'string') {\n result.push(cls);\n } else if (Array.isArray(cls)) {\n result.push(classnames(...cls));\n } else if (typeof cls === 'object') {\n Object.entries(cls).forEach(([key, value]) => {\n if (value) {\n result.push(key);\n }\n });\n }\n });\n\n return result.join(' ');\n}\n"],"names":["getMode"],"mappings":"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"}
@@ -0,0 +1 @@
1
+ Assets directory for le-kit components