le-kit 0.1.18 → 0.2.0

package/dist/components/le-card.js

@@ -25,7 +25,7 @@ const LeCard$1 = /*@__PURE__*/ proxyCustomElement(class LeCard extends HTMLEleme
      */
     interactive = false;
     render() {
-        return (h("le-component", { key: '3878b21dafb24349fd9c178c784028302fb95214', component: "le-card", hostClass: classnames(`variant-${this.variant}`, { 'interactive': this.interactive }) }, h("div", { key: '41470ad363928c5a5f70947a1fc859db03cf7619', class: "card", part: "card" }, h("div", { key: '9e0d85016f98ee15eba90bbd4db004f9210b1bf3', class: "card-header", part: "header" }, h("le-slot", { key: 'dcd23b7da86e4026f2cc7fb62b410d7317ab2e2b', name: "header", label: "Header", description: "Card title", type: "text", tag: "h3" }, h("slot", { key: '0f2f616c950d7548484bd8c87befa7ecff6d374f', name: "header" }))), h("div", { key: '1d77598852e8755e477a505d29c77643cea446d4', class: "card-content", part: "content" }, h("le-slot", { key: 'fd94892b8489f727a3e951f1771cab53b0667799', name: "", label: "Content", description: "Card content", type: "textarea", tag: "p", required: true }, h("slot", { key: 'dc1c2deff9405fd838aee733bc6e4394f60fefd7' }))), h("div", { key: '2944fa4515119b1868567545fa131fe178d7a3cf', class: "card-footer", part: "footer" }, h("le-slot", { key: 'bdd9b5a1baf2ebf487120afa458ae85285b05fcf', name: "footer", label: "Footer", description: "Card footer with actions", "allowed-components": "le-button,le-link" }, h("slot", { key: '8a79b1baaf6720f1397c0bacf5f71dc97dff2777', name: "footer" }))))));
+        return (h("le-component", { key: 'b7eb138d4df55f27716d53c41ff7e1035e058cbe', component: "le-card", hostClass: classnames(`variant-${this.variant}`, { 'interactive': this.interactive }) }, h("div", { key: 'db58aceaf332727671c73f121bd7c7b7c00c798e', class: "card", part: "card" }, h("div", { key: '1eb45033cee8e18dc9edfaba3341b1c8df8c737c', class: "card-header", part: "header" }, h("le-slot", { key: 'e77e29b0cf5965063554a50936fa0e9026fbc73a', name: "header", label: "Header", description: "Card title", type: "text", tag: "h3" }, h("slot", { key: 'b67e02c52fbfa2a7b1ed58e0c1537355af9a125e', name: "header" }))), h("div", { key: 'bcdbdc7c2e7addaaa4892d41cf5af2e43260c876', class: "card-content", part: "content" }, h("le-slot", { key: 'e4dc82322cbcb0ca884ac55c7805fa860fdaf588', name: "", label: "Content", description: "Card content", type: "textarea", tag: "p", required: true }, h("slot", { key: 'e9576903dfc9c04c01614207078ee02a03d9f4b8' }))), h("div", { key: '6f684335dfc5acd55cbd832e2cd6f8a468df7a9a', class: "card-footer", part: "footer" }, h("le-slot", { key: 'b4013edc8431ba54f44cabd4763916c6e83bc6a8', name: "footer", label: "Footer", description: "Card footer with actions", "allowed-components": "le-button,le-link" }, h("slot", { key: '9e9d1c9d99beb2d877a9b8d59b13659e0c9c6459', name: "footer" }))))));
     }
     static get style() { return leCardDefaultCss(); }
 }, [769, "le-card", {

package/dist/components/le-collapse.js

@@ -1,140 +1,4 @@
-import { proxyCustomElement, HTMLElement, h, Host, transformTag } from '@stencil/core/internal/client';
-import { d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$4, c as defineCustomElement$5, e as defineCustomElement$8, f as defineCustomElement$9, g as defineCustomElement$a } from './le-button2.js';
-import { d as defineCustomElement$7 } from './le-dropdown-base2.js';
-import { d as defineCustomElement$6 } from './le-popover2.js';
-
-const leCollapseCss = () => `:host{--le-collapse-duration:var(--le-transition-normal);display:grid;grid-template-rows:1fr;opacity:1;transition:grid-template-rows var(--le-collapse-duration),
-    opacity var(--le-collapse-duration)}:host([data-open="false"]),:host([open="false"]){grid-template-rows:0fr;opacity:0}:host([no-fading][data-open="false"]),:host([no-fading][open="false"]){opacity:1}.region{display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}:host([scroll-down]) .region{justify-content:flex-start}`;
-
-const LeCollapse$1 = /*@__PURE__*/ proxyCustomElement(class LeCollapse extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-    }
-    get el() { return this; }
-    /** Whether the content should be shown. */
-    open = true;
-    /** Whether the content should scroll down from the top when open. */
-    scrollDown = false;
-    /** Stop fading the content when collapsing/expanding. */
-    noFading = false;
-    /** If true, collapse/expand based on the nearest header shrink event. */
-    collapseOnHeaderShrink = false;
-    /**
-     * Handles `leHeaderShrinkChange` events from the `le-header`.
-     * In case multiple headers are present, only the nearest one in the DOM tree is used.
-     */
-    handleHeaderShrink(ev) {
-        const e = ev;
-        this.headerShrunk = !!e.detail?.shrunk;
-    }
-    headerShrunk = false;
-    componentWillLoad() {
-        // Stencil boolean props default to `false` when the attribute is missing.
-        // For this component, the desired default is open=true.
-        if (!this.el.hasAttribute('open')) {
-            this.open = true;
-        }
-    }
-    componentDidLoad() {
-        this.applyOpenState();
-    }
-    onOpenChange() {
-        this.applyOpenState();
-    }
-    onDrivenStateChange() {
-        this.applyOpenState();
-    }
-    shouldBeOpen() {
-        if (!this.open)
-            return false;
-        if (this.collapseOnHeaderShrink && this.headerShrunk)
-            return false;
-        return true;
-    }
-    applyOpenState() {
-        const nextOpen = this.shouldBeOpen();
-        this.el.toggleAttribute('data-open', nextOpen);
-    }
-    render() {
-        return (h(Host, { key: '30fe288583bae1645ce00714de95c40ed92b7af0', "data-open": this.shouldBeOpen() ? 'true' : 'false' }, h("le-component", { key: '5fdc1e83caaff73fedb61d7286fc56f03fa8127a', component: "le-collapse" }, h("div", { key: '185df372a5039be23abf42ff262ef2d3eaa1602f', class: "region", part: "region" }, h("slot", { key: '1790f5457264342d71aecb94a67ce4ee11149af2' })))));
-    }
-    static get watchers() { return {
-        "open": ["onOpenChange"],
-        "headerShrunk": ["onDrivenStateChange"]
-    }; }
-    static get style() { return leCollapseCss(); }
-}, [769, "le-collapse", {
-        "open": [1540],
-        "scrollDown": [516, "scroll-down"],
-        "noFading": [516, "no-fading"],
-        "collapseOnHeaderShrink": [516, "collapse-on-header-shrink"],
-        "headerShrunk": [32]
-    }, [[8, "leHeaderShrinkChange", "handleHeaderShrink"]], {
-        "open": ["onOpenChange"],
-        "headerShrunk": ["onDrivenStateChange"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["le-collapse", "le-button", "le-checkbox", "le-component", "le-dropdown-base", "le-popover", "le-popup", "le-select", "le-slot", "le-string-input"];
-    components.forEach(tagName => { switch (tagName) {
-        case "le-collapse":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), LeCollapse$1);
-            }
-            break;
-        case "le-button":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$a();
-            }
-            break;
-        case "le-checkbox":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$9();
-            }
-            break;
-        case "le-component":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$8();
-            }
-            break;
-        case "le-dropdown-base":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$7();
-            }
-            break;
-        case "le-popover":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$6();
-            }
-            break;
-        case "le-popup":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$5();
-            }
-            break;
-        case "le-select":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$4();
-            }
-            break;
-        case "le-slot":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$3();
-            }
-            break;
-        case "le-string-input":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
+import { L as LeCollapse$1, d as defineCustomElement$1 } from './le-collapse2.js';
 
 const LeCollapse = LeCollapse$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/le-collapse.js.map

@@ -1 +1 @@
-{"file":"le-collapse.js","mappings":";;;;;AAAA,MAAM,aAAa,GAAG,MAAM,CAAC;AAC7B,uVAAuV,CAAC;;MCwB3UA,YAAU,iBAAAC,kBAAA,CAAA,MAAA,UAAA,SAAA,WAAA,CAAA;;;;;;;;;;IAImB,IAAI,GAAY,IAAI;;IAGT,UAAU,GAAY,KAAK;;IAG7B,QAAQ,GAAY,KAAK;;IAGT,sBAAsB,GACrF,KAAK;AAEP;;;AAGG;AAEH,IAAA,kBAAkB,CAAC,EAAS,EAAA;QAC1B,MAAM,CAAC,GAAG,EAAsC;QAChD,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,MAAM;;IAGvB,YAAY,GAAY,KAAK;IAE9C,iBAAiB,GAAA;;;QAGf,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE;AACjC,YAAA,IAAI,CAAC,IAAI,GAAG,IAAI;;;IAIpB,gBAAgB,GAAA;QACd,IAAI,CAAC,cAAc,EAAE;;IAIb,YAAY,GAAA;QACpB,IAAI,CAAC,cAAc,EAAE;;IAIb,mBAAmB,GAAA;QAC3B,IAAI,CAAC,cAAc,EAAE;;IAGf,YAAY,GAAA;QAClB,IAAI,CAAC,IAAI,CAAC,IAAI;AAAE,YAAA,OAAO,KAAK;AAC5B,QAAA,IAAI,IAAI,CAAC,sBAAsB,IAAI,IAAI,CAAC,YAAY;AAAE,YAAA,OAAO,KAAK;AAClE,QAAA,OAAO,IAAI;;IAGL,cAAc,GAAA;AACpB,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,EAAE;QACpC,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,WAAW,EAAE,QAAQ,CAAC;;IAGhD,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAA,EAAY,IAAI,CAAC,YAAY,EAAE,GAAG,MAAM,GAAG,OAAO,EAAA,EACrD,CAAc,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,SAAS,EAAC,aAAa,EAAA,EACnC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAA,EAC/B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACO,CACV;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["LeCollapse","__stencil_proxyCustomElement"],"sources":["src/components/le-collapse/le-collapse.css?tag=le-collapse&encapsulation=shadow","src/components/le-collapse/le-collapse.tsx"],"sourcesContent":[":host {\n  --le-collapse-duration: var(--le-transition-normal);\n\n  display: grid;\n  grid-template-rows: 1fr;\n  opacity: 1;\n  transition:\n    grid-template-rows var(--le-collapse-duration),\n    opacity var(--le-collapse-duration);\n}\n\n:host([data-open=\"false\"]),\n:host([open=\"false\"]) {\n  grid-template-rows: 0fr;\n  opacity: 0;\n}\n:host([no-fading][data-open=\"false\"]),\n:host([no-fading][open=\"false\"]) {\n  opacity: 1;\n}\n\n.region {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-end;\n  overflow: hidden;\n}\n\n:host([scroll-down]) .region {\n  justify-content: flex-start;\n}\n","import { Component, Element, h, Host, Listen, Prop, State, Watch } from '@stencil/core';\n\nexport type LeCollapseAnimation = 'fade' | 'collapse' | 'fade-collapse';\n\n/**\n * Animated show/hide wrapper.\n *\n * Supports height collapse (auto->0) and/or fading.\n * Can optionally listen to the nearest `le-header` shrink events.\n *\n * @slot - Content to animate\n *\n * @cssprop --le-collapse-duration - Transition duration\n *\n * @csspart region - Collapsible region\n * @csspart content - Inner content\n *\n * @cmsEditable true\n * @cmsCategory Layout\n */\n@Component({\n  tag: 'le-collapse',\n  styleUrl: 'le-collapse.css',\n  shadow: true,\n})\nexport class LeCollapse {\n  @Element() el: HTMLElement;\n\n  /** Whether the content should be shown. */\n  @Prop({ mutable: true, reflect: true }) open: boolean = true;\n\n  /** Whether the content should scroll down from the top when open. */\n  @Prop({ attribute: 'scroll-down', reflect: true }) scrollDown: boolean = false;\n\n  /** Stop fading the content when collapsing/expanding. */\n  @Prop({ attribute: 'no-fading', reflect: true }) noFading: boolean = false;\n\n  /** If true, collapse/expand based on the nearest header shrink event. */\n  @Prop({ attribute: 'collapse-on-header-shrink', reflect: true }) collapseOnHeaderShrink: boolean =\n    false;\n\n  /**\n   * Handles `leHeaderShrinkChange` events from the `le-header`.\n   * In case multiple headers are present, only the nearest one in the DOM tree is used.\n   */\n  @Listen('leHeaderShrinkChange', { target: 'window' })\n  handleHeaderShrink(ev: Event) {\n    const e = ev as CustomEvent<{ shrunk: boolean }>;\n    this.headerShrunk = !!e.detail?.shrunk;\n  }\n\n  @State() private headerShrunk: boolean = false;\n\n  componentWillLoad() {\n    // Stencil boolean props default to `false` when the attribute is missing.\n    // For this component, the desired default is open=true.\n    if (!this.el.hasAttribute('open')) {\n      this.open = true;\n    }\n  }\n\n  componentDidLoad() {\n    this.applyOpenState();\n  }\n\n  @Watch('open')\n  protected onOpenChange() {\n    this.applyOpenState();\n  }\n\n  @Watch('headerShrunk')\n  protected onDrivenStateChange() {\n    this.applyOpenState();\n  }\n\n  private shouldBeOpen() {\n    if (!this.open) return false;\n    if (this.collapseOnHeaderShrink && this.headerShrunk) return false;\n    return true;\n  }\n\n  private applyOpenState() {\n    const nextOpen = this.shouldBeOpen();\n    this.el.toggleAttribute('data-open', nextOpen);\n  }\n\n  render() {\n    return (\n      <Host data-open={this.shouldBeOpen() ? 'true' : 'false'}>\n        <le-component component=\"le-collapse\">\n          <div class=\"region\" part=\"region\">\n            <slot></slot>\n          </div>\n        </le-component>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"le-collapse.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/le-collapse2.js

@@ -0,0 +1,138 @@
+import { proxyCustomElement, HTMLElement, h, Host, transformTag } from '@stencil/core/internal/client';
+import { d as defineCustomElement$1, a as defineCustomElement$2, b as defineCustomElement$3, c as defineCustomElement$4, e as defineCustomElement$7, f as defineCustomElement$8, g as defineCustomElement$9 } from './le-button2.js';
+import { d as defineCustomElement$6 } from './le-dropdown-base2.js';
+import { d as defineCustomElement$5 } from './le-popover2.js';
+
+const leCollapseCss = () => `:host{--le-collapse-duration:var(--le-transition-normal);display:grid;grid-template-rows:1fr;opacity:1;transition:grid-template-rows var(--le-collapse-duration),
+    opacity var(--le-collapse-duration)}:host([data-open="false"]),:host([closed]){grid-template-rows:0fr;opacity:0}:host([no-fading][data-open="false"]),:host([no-fading][closed]){opacity:1}.region{display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}.region.scroll-down{justify-content:flex-start}`;
+
+const LeCollapse = /*@__PURE__*/ proxyCustomElement(class LeCollapse extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+    }
+    get el() { return this; }
+    /**
+     * Since Stencil boolean props default to `false` when the attribute is missing.
+     * instead of `open` defaulting to `true`, using a `closed` prop.
+     */
+    closed = false;
+    /** Whether the content should scroll down from the top when open. */
+    scrollDown = false;
+    /** Stop fading the content when collapsing/expanding. */
+    noFading = false;
+    /** If true, collapse/expand based on the nearest header shrink event. */
+    collapseOnHeaderShrink = false;
+    /**
+     * Handles `leHeaderShrinkChange` events from the `le-header`.
+     * In case multiple headers are present, only the nearest one in the DOM tree is used.
+     */
+    handleHeaderShrink(ev) {
+        const e = ev;
+        this.headerShrunk = !!e.detail?.shrunk;
+    }
+    headerShrunk = false;
+    componentDidLoad() {
+        this.applyOpenState();
+    }
+    onOpenChange() {
+        this.applyOpenState();
+    }
+    onDrivenStateChange() {
+        this.applyOpenState();
+    }
+    shouldBeOpen() {
+        if (this.closed)
+            return false;
+        if (this.collapseOnHeaderShrink && this.headerShrunk)
+            return false;
+        return true;
+    }
+    applyOpenState() {
+        const nextOpen = this.shouldBeOpen();
+        this.el.toggleAttribute('data-open', nextOpen);
+    }
+    render() {
+        return (h(Host, { key: '946501d440fa391cfea13283072c387fd1e98b65', "data-open": this.shouldBeOpen() ? 'true' : 'false' }, h("le-component", { key: 'fb5c7e9f9e15dc3ef440f9703977ee7f09ffe676', component: "le-collapse" }, h("div", { key: '83ec865adb8a11cc9de7a6a173b85245414360e8', class: { 'region': true, 'scroll-down': this.scrollDown }, part: "region" }, h("slot", { key: '6b402e2beac8bde188da48719f47e5f9fc12581d' })))));
+    }
+    static get watchers() { return {
+        "open": ["onOpenChange"],
+        "headerShrunk": ["onDrivenStateChange"]
+    }; }
+    static get style() { return leCollapseCss(); }
+}, [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"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["le-collapse", "le-button", "le-checkbox", "le-component", "le-dropdown-base", "le-popover", "le-popup", "le-select", "le-slot", "le-string-input"];
+    components.forEach(tagName => { switch (tagName) {
+        case "le-collapse":
+            if (!customElements.get(transformTag(tagName))) {
+                customElements.define(transformTag(tagName), LeCollapse);
+            }
+            break;
+        case "le-button":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$9();
+            }
+            break;
+        case "le-checkbox":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$8();
+            }
+            break;
+        case "le-component":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$7();
+            }
+            break;
+        case "le-dropdown-base":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$6();
+            }
+            break;
+        case "le-popover":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$5();
+            }
+            break;
+        case "le-popup":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$4();
+            }
+            break;
+        case "le-select":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$3();
+            }
+            break;
+        case "le-slot":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$2();
+            }
+            break;
+        case "le-string-input":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { LeCollapse as L, defineCustomElement as d };
+//# sourceMappingURL=le-collapse2.js.map
+
+//# sourceMappingURL=le-collapse2.js.map

package/dist/components/le-collapse2.js.map

@@ -0,0 +1 @@
+{"file":"le-collapse2.js","mappings":";;;;;AAAA,MAAM,aAAa,GAAG,MAAM,CAAC;AAC7B,kUAAkU,CAAC;;MCwBtT,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAA,WAAA,CAAA;;;;;;;;;AAGrB;;;AAGG;IACqC,MAAM,GAAY,KAAK;;IAGZ,UAAU,GAAY,KAAK;;IAG7B,QAAQ,GAAY,KAAK;;IAGT,sBAAsB,GACrF,KAAK;AAEP;;;AAGG;AAEH,IAAA,kBAAkB,CAAC,EAAS,EAAA;QAC1B,MAAM,CAAC,GAAG,EAAsC;QAChD,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,MAAM;;IAGvB,YAAY,GAAY,KAAK;IAE9C,gBAAgB,GAAA;QACd,IAAI,CAAC,cAAc,EAAE;;IAIb,YAAY,GAAA;QACpB,IAAI,CAAC,cAAc,EAAE;;IAIb,mBAAmB,GAAA;QAC3B,IAAI,CAAC,cAAc,EAAE;;IAGf,YAAY,GAAA;QAClB,IAAI,IAAI,CAAC,MAAM;AAAE,YAAA,OAAO,KAAK;AAC7B,QAAA,IAAI,IAAI,CAAC,sBAAsB,IAAI,IAAI,CAAC,YAAY;AAAE,YAAA,OAAO,KAAK;AAClE,QAAA,OAAO,IAAI;;IAGL,cAAc,GAAA;AACpB,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,EAAE;QACpC,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,WAAW,EAAE,QAAQ,CAAC;;IAGhD,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAA,EAAY,IAAI,CAAC,YAAY,EAAE,GAAG,MAAM,GAAG,OAAO,EAAA,EACrD,CAAc,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,SAAS,EAAC,aAAa,EAAA,EACnC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,IAAI,EAAC,QAAQ,EAAA,EAC3E,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACO,CACV;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement"],"sources":["src/components/le-collapse/le-collapse.css?tag=le-collapse&encapsulation=shadow","src/components/le-collapse/le-collapse.tsx"],"sourcesContent":[":host {\n  --le-collapse-duration: var(--le-transition-normal);\n\n  display: grid;\n  grid-template-rows: 1fr;\n  opacity: 1;\n  transition:\n    grid-template-rows var(--le-collapse-duration),\n    opacity var(--le-collapse-duration);\n}\n\n:host([data-open=\"false\"]),\n:host([closed]) {\n  grid-template-rows: 0fr;\n  opacity: 0;\n}\n:host([no-fading][data-open=\"false\"]),\n:host([no-fading][closed]) {\n  opacity: 1;\n}\n\n.region {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-end;\n  overflow: hidden;\n}\n\n.region.scroll-down {\n  justify-content: flex-start;\n}\n","import { Component, Element, h, Host, Listen, Prop, State, Watch } from '@stencil/core';\n\nexport type LeCollapseAnimation = 'fade' | 'collapse' | 'fade-collapse';\n\n/**\n * Animated show/hide wrapper.\n *\n * Supports height collapse (auto->0) and/or fading.\n * Can optionally listen to the nearest `le-header` shrink events.\n *\n * @slot - Content to animate\n *\n * @cssprop --le-collapse-duration - Transition duration\n *\n * @csspart region - Collapsible region\n * @csspart content - Inner content\n *\n * @cmsEditable true\n * @cmsCategory Layout\n */\n@Component({\n  tag: 'le-collapse',\n  styleUrl: 'le-collapse.css',\n  shadow: true,\n})\nexport class LeCollapse {\n  @Element() el: HTMLElement;\n\n  /**\n   * Since Stencil boolean props default to `false` when the attribute is missing.\n   * instead of `open` defaulting to `true`, using a `closed` prop.\n   */\n  @Prop({ mutable: true, reflect: true }) closed: boolean = false;\n\n  /** Whether the content should scroll down from the top when open. */\n  @Prop({ attribute: 'scroll-down', reflect: true }) scrollDown: boolean = false;\n\n  /** Stop fading the content when collapsing/expanding. */\n  @Prop({ attribute: 'no-fading', reflect: true }) noFading: boolean = false;\n\n  /** If true, collapse/expand based on the nearest header shrink event. */\n  @Prop({ attribute: 'collapse-on-header-shrink', reflect: true }) collapseOnHeaderShrink: boolean =\n    false;\n\n  /**\n   * Handles `leHeaderShrinkChange` events from the `le-header`.\n   * In case multiple headers are present, only the nearest one in the DOM tree is used.\n   */\n  @Listen('leHeaderShrinkChange', { target: 'window' })\n  handleHeaderShrink(ev: Event) {\n    const e = ev as CustomEvent<{ shrunk: boolean }>;\n    this.headerShrunk = !!e.detail?.shrunk;\n  }\n\n  @State() private headerShrunk: boolean = false;\n\n  componentDidLoad() {\n    this.applyOpenState();\n  }\n\n  @Watch('open')\n  protected onOpenChange() {\n    this.applyOpenState();\n  }\n\n  @Watch('headerShrunk')\n  protected onDrivenStateChange() {\n    this.applyOpenState();\n  }\n\n  private shouldBeOpen() {\n    if (this.closed) return false;\n    if (this.collapseOnHeaderShrink && this.headerShrunk) return false;\n    return true;\n  }\n\n  private applyOpenState() {\n    const nextOpen = this.shouldBeOpen();\n    this.el.toggleAttribute('data-open', nextOpen);\n  }\n\n  render() {\n    return (\n      <Host data-open={this.shouldBeOpen() ? 'true' : 'false'}>\n        <le-component component=\"le-collapse\">\n          <div class={{ 'region': true, 'scroll-down': this.scrollDown }} part=\"region\">\n            <slot></slot>\n          </div>\n        </le-component>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/le-combobox.js

@@ -229,7 +229,7 @@ const LeCombobox$1 = /*@__PURE__*/ proxyCustomElement(class LeCombobox extends H
     }
     render() {
         const hasValue = this.inputValue.length > 0;
-        return (h("le-component", { key: '465108f53d7f7f4952288894d9e8fe7963d37275', component: "le-combobox" }, h("le-dropdown-base", { key: '202960374cb445e5b45856dd50f973ebfbdc9b8d', 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: 'a45f5c63e4b4f854b076a59b89b2002ae4ad7647', slot: "trigger", class: { 'combobox-trigger': true, 'is-open': this.open } }, h("le-string-input", { key: '1b4ba18526eb55434dec28d6a033bdb8a2db6d79', 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: '950b1a1ba5b8060b373c8fb0f25f64d29b38d5b9', type: "button", class: "combobox-clear", onClick: this.handleClear, "aria-label": "Clear", tabIndex: -1 }, h("svg", { key: '43c975d5797cf669c298d96e4fcd85d85fcf5780', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: 'b3ab58b014abac2cc509447b940d3f95d713f2c2', d: "M4 4l8 8M12 4l-8 8" })))), h("span", { key: '32723ec3ebcd615c8fdd3f8e29bc7e418efdfd17', class: "combobox-arrow" }, h("svg", { key: '9cb0e39189b7cffb6723185a7800d93c367e8557', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '80f4010bce48ab71a31b9681c18c9d2f6041b763', d: "M4 6l4 4 4-4" }))))), this.name && h("input", { key: 'b1ae25e4537e3fed0d3a9f43ececb85f39e8c57a', type: "hidden", name: this.name, value: this.value?.toString() ?? '' })));
+        return (h("le-component", { key: '5d1aae34a01c8e9d4744dee3921ad07733961158', component: "le-combobox" }, h("le-dropdown-base", { key: '449d64f2b8744828709c32051d4c6528621e7c4d', 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: '5d4c616f2c55fba8ca5836a27af445123ef0755d', slot: "trigger", class: { 'combobox-trigger': true, 'is-open': this.open } }, h("le-string-input", { key: '70f876a2a8842ce3fd20994e11501bc7766e6570', 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: 'ca5e8bdd951650f63c2284bf4d4634964462838c', type: "button", class: "combobox-clear", onClick: this.handleClear, "aria-label": "Clear", tabIndex: -1 }, h("svg", { key: '49b3e50b68a9c5f8a6c0708a43a60be559f6cdd8', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '33b347862ce2321bcc38823a3b25774f06e625f3', d: "M4 4l8 8M12 4l-8 8" })))), h("span", { key: 'aa4080873acd15706757f33c032ad4c0caa03f01', class: "combobox-arrow" }, h("svg", { key: '86782ee6405d553baecac64d6a780a79dd5deda0', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '93cc4e3a3898c7f9b4149c2bd54934f7d9d4519b', d: "M4 6l4 4 4-4" }))))), this.name && h("input", { key: 'b0766761f5e8f48428af5e1a360cb2a51a9bf316', type: "hidden", name: this.name, value: this.value?.toString() ?? '' })));
     }
     static get watchers() { return {
         "value": ["handleValueChange"],

package/dist/components/le-current-heading.js

@@ -58,7 +58,7 @@ const LeCurrentHeading$1 = /*@__PURE__*/ proxyCustomElement(class LeCurrentHeadi
         }
     }
     render() {
-        return (h(Host, { key: 'e6b473d3633eb8f194edf19e88850390f4319929' }, this.activeText ? (h("span", { class: "title", part: "title" }, this.activeText)) : (h("slot", null))));
+        return (h(Host, { key: 'd6773c072799d0337b7d2bade9de2c169e35d3c8' }, this.activeText ? (h("span", { class: "title", part: "title" }, this.activeText)) : (h("slot", null))));
     }
     static get watchers() { return {
         "selector": ["onSelectorChange"]

package/dist/components/le-dropdown-base2.js

@@ -338,7 +338,7 @@ const LeDropdownBase = /*@__PURE__*/ proxyCustomElement(class LeDropdownBase ext
     }
     render() {
         const dropdownWidth = this.width || (this.triggerWidth ? `${this.triggerWidth}px` : undefined);
-        return (h(Host, { key: '838bef3556e494770fbb34cbff69c782ca717fe4' }, h("le-popover", { key: 'd72576e799c6cc065d3b0f3f1b918e84a7c5f690', 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: 'fbe84a553a126ad34f3ea159b182f825a065d1f6', name: "trigger", slot: "trigger" }), h("slot", { key: '957ac9208cdfe8be96a15979853e0b5cfdfc756f', name: "header" }), h("div", { key: '8c15f620b55035191979aca56514771c860051e3', class: "dropdown-list", role: "listbox", "aria-multiselectable": this.multiple ? 'true' : undefined, ref: el => (this.listEl = el), style: { maxHeight: this.maxHeight } }, this.renderOptions()))));
+        return (h(Host, { key: 'eeb6316ffb006adb8d53f3c2f81cadde32d261ae' }, h("le-popover", { key: '703c57bf2185590df226787778ad67cd423ce943', 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: 'bc401b4af80c9e6d15c4f5fe2a5ff2687b9ae582', name: "trigger", slot: "trigger" }), h("slot", { key: '3414d6eb1d4fecfe642b31e2a1abd271c83ab2df', name: "header" }), h("div", { key: '685d0aa6e15b6a191d517e194ae96302cfb4a191', class: "dropdown-list", role: "listbox", "aria-multiselectable": this.multiple ? 'true' : undefined, ref: el => (this.listEl = el), style: { maxHeight: this.maxHeight } }, this.renderOptions()))));
     }
     static get watchers() { return {
         "options": ["handleOptionsChange"],

package/dist/components/le-header-placeholder.js

@@ -8,7 +8,7 @@ const LeHeaderPlaceholder$1 = /*@__PURE__*/ proxyCustomElement(class LeHeaderPla
         }
     }
     render() {
-        return (h(Host, { key: '759dfba2a50f5d3240b78c46526f9d246098e4c3', "aria-hidden": "true", style: {
+        return (h(Host, { key: '53a4cd451e1b53a4be3b6b20c82e12f53a982a17', "aria-hidden": "true", style: {
                 display: 'block',
                 height: 'var(--le-header-height, 64px)',
             } }));

package/dist/components/le-header.js

@@ -243,7 +243,7 @@ const LeHeader$1 = /*@__PURE__*/ proxyCustomElement(class LeHeader extends HTMLE
             'is-hidden': !this.revealed,
             'is-shrunk': this.shrunk,
         });
-        return (h(Host, { key: '3fc823975a0ebcae3cb799bf94e35a289813cd35', class: hostClass, onMouseEnter: () => {
+        return (h(Host, { key: '564328055a69a1646c7f9030ac274a30c3baad0a', class: hostClass, onMouseEnter: () => {
                 if (!this.expandOnHover)
                     return;
                 this.hoverActive = true;
@@ -253,7 +253,7 @@ const LeHeader$1 = /*@__PURE__*/ proxyCustomElement(class LeHeader extends HTMLE
                     return;
                 this.hoverActive = false;
                 this.scheduleUpdate(true);
-            } }, h("le-component", { key: 'bb8e3c5717112e427fd86a6af4231b33147769e7', component: "le-header" }, h("header", { key: 'da96d6a1eb91a85ea8050870895fcd13bdb28391', class: "header", part: "header", role: "banner", ref: el => (this.headerEl = el) }, h("div", { key: '04386a3d535189012655ee352822812349d386d7', class: "inner", part: "inner" }, h("div", { key: '4b1fc43ca08e981f3dc810a23c14e6ed3200a1de', class: "row", part: "row" }, h("div", { key: '8fad255865a0d2e2662f3ad1030d48f8586ae8c7', class: "start", part: "start" }, h("le-slot", { key: '702eeebfe3133dae44e5268848ce5cac81f3b306', name: "start", label: "Start", description: "Logo / back button / nav", "allowed-components": "le-button,le-text,le-tag,le-box,le-stack" }, h("slot", { key: 'bdd3478abbdcd46143ce8a79d096baab84d12588', name: "start" }))), h("div", { key: 'e5b7d3d42e28d80b2df89a3ab365a29b39544f14', class: "title", part: "title" }, h("le-slot", { key: 'b5a68c8baaf05769ea838ca0482fa1db52b03b3a', name: "title", label: "Title", description: "Header title", type: "text", tag: "span" }, h("span", { key: '91763f968886e052a637959253863e583da51b76', class: "title-slot", part: "title" }, h("slot", { key: '060be7c91cca50c26db56cd15ad5d38962c8003f', name: "title" })))), h("div", { key: '938222741cbe15e531ff355185c4f599a3d26147', class: "end", part: "end" }, h("le-slot", { key: '8e1c91426dc87f1bdcb98d33b7da4cc6988781cf', name: "end", label: "End", description: "Actions", "allowed-components": "le-button,le-text,le-tag,le-box,le-stack" }, h("slot", { key: '67e4bda7e7c754dda5a7d9505a9b451f2487f47b', name: "end" })))), h("div", { key: '84dfedd30ec9bd49b668b2e1676ce3712b9d2faf', class: "secondary", part: "secondary" }, h("le-slot", { key: '95c56a8e3dbaaf284b03d72f1d9ec01d24c148d2', 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: '240df8fc23a9bc4e7aa294c52b229c7abf7c427d' }))))))));
+            } }, h("le-component", { key: 'a9feac7b7229ed250b4c2cade7e5dce8bb79e634', component: "le-header" }, h("header", { key: 'acebe4ea5222593e65190a35515c60ee7e15549a', class: "header", part: "header", role: "banner", ref: el => (this.headerEl = el) }, h("div", { key: 'bf37e677a5058e4e9bf74a4f6a3c62112daaea20', class: "inner", part: "inner" }, h("div", { key: 'd6886dba1b0e8003a2080f03f6bfe3fa0ffdca18', class: "row", part: "row" }, h("div", { key: 'd4c328bb74c955fa377a06f1a33783750bd83237', class: "start", part: "start" }, h("le-slot", { key: '1b9d58c81f8a498637eefd7a1310c961b014d1a5', name: "start", label: "Start", description: "Logo / back button / nav", "allowed-components": "le-button,le-text,le-tag,le-box,le-stack" }, h("slot", { key: 'd5c2727c4f427b60cad9575c0e74a18e7b229462', name: "start" }))), h("div", { key: '35831f9dfb3ff584cdc573081ebdeef1968f06c7', class: "title", part: "title" }, h("le-slot", { key: 'bed684a7880dfa79b4b7585dcb3c2bd024e0cc93', name: "title", label: "Title", description: "Header title", type: "text", tag: "span" }, h("span", { key: 'f523ee36ff1f0c6a2793e5d813d6b9a9c632f2bf', class: "title-slot", part: "title" }, h("slot", { key: '39e750e3f4231406552187e961ae7e9a206d240b', name: "title" })))), h("div", { key: 'c99435b41a905b6780c07e7103125d7c439af7cb', class: "end", part: "end" }, h("le-slot", { key: 'efca1aadcf9108add84dbb5a2ea539fb95e795c6', name: "end", label: "End", description: "Actions", "allowed-components": "le-button,le-text,le-tag,le-box,le-stack" }, h("slot", { key: 'd04b78ca1eeb1cbae4b3575f03231b93ed4d9692', name: "end" })))), h("div", { key: 'd83bda303c5fcd63da3e0419bd9276677d8f5cc7', class: "secondary", part: "secondary" }, h("le-slot", { key: '1f5f6d317e969c54d87a6ad516fed071e72f342c', 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: 'fb5a6a434190658f8fb55e3bc21d5f952a559ad5' }))))))));
     }
     static get watchers() { return {
         "revealOnScroll": ["onBehaviorPropsChange"],

package/dist/components/le-icon.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface LeIcon extends Components.LeIcon, HTMLElement {}
+export const LeIcon: {
+    prototype: LeIcon;
+    new (): LeIcon;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/le-icon.js

@@ -0,0 +1,9 @@
+import { L as LeIcon$1, d as defineCustomElement$1 } from './le-icon2.js';
+
+const LeIcon = LeIcon$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LeIcon, defineCustomElement };
+//# sourceMappingURL=le-icon.js.map
+
+//# sourceMappingURL=le-icon.js.map

package/dist/components/le-icon.js.map

@@ -0,0 +1 @@
+{"file":"le-icon.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/le-icon2.js

@@ -0,0 +1,133 @@
+import { proxyCustomElement, HTMLElement, Build, h, transformTag, getAssetPath } from '@stencil/core/internal/client';
+
+const leIconCss = () => `:host{display:inline-block;width:var(--le-icon-size, var(--le-size-4));height:var(--le-icon-size, var(--le-size-4));color:var(--le-icon-color, var(--le-color-text-primary))}:host svg{display:block;fill:currentColor}`;
+
+const iconCache = {};
+const requestCache = {};
+async function fetchIcon({ name }) {
+    if (iconCache[name]) {
+        return iconCache[name];
+    }
+    if (!requestCache[name]) {
+        requestCache[name] = fetch(getAssetPath(`./assets/icons/${name}.json`))
+            .then(resp => resp.json())
+            .catch(() => {
+            console.error(`"${name}" is not a valid name`);
+            return '';
+        });
+    }
+    const path = await requestCache[name];
+    iconCache[name] = path;
+    return path;
+}
+const LeIcon = /*@__PURE__*/ proxyCustomElement(class LeIcon extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+    }
+    get el() { return this; }
+    /**
+     * Name of the icon to display. Corresponds to a JSON file in the assets folder.
+     * For example, "search" will load the "search.json" file.
+     */
+    name = null;
+    /**
+     * Size of the icon in pixels. Default is 16.
+     */
+    size = 16;
+    iconData = null;
+    visible = false;
+    async loadIconData() {
+        const { name, visible } = this;
+        if (!Build.isBrowser || !name || !visible) {
+            return;
+        }
+        this.iconData = await fetchIcon({ name });
+    }
+    intersectionObserver;
+    connectedCallback() {
+        this.waitUntilVisible(() => {
+            this.visible = true;
+            this.loadIconData();
+        });
+    }
+    disconnectedCallback() {
+        if (this.intersectionObserver) {
+            this.intersectionObserver.disconnect();
+            this.intersectionObserver = null;
+        }
+    }
+    async componentWillLoad() {
+        this.loadIconData();
+    }
+    waitUntilVisible(callback) {
+        if (!Build.isBrowser ||
+            typeof window === 'undefined' ||
+            !window.IntersectionObserver) {
+            callback();
+            return;
+        }
+        this.intersectionObserver = new IntersectionObserver(entries => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    this.intersectionObserver.disconnect();
+                    this.intersectionObserver = null;
+                    callback();
+                }
+            });
+        }, { rootMargin: '50px' });
+        this.intersectionObserver.observe(this.el);
+    }
+    /**
+     * Renders the SVG content out of a JSON data in a format:
+     * { "viewBox": "...", children: [{ "tag": "g", ""children": [ ... ], ...attrs }, ...] }
+     *
+     * @returns JSX.Element | null
+     */
+    renderSVGContent(children) {
+        if (!children || children.length === 0) {
+            return null;
+        }
+        const createElement = node => {
+            const { tag, children, ...attrs } = node;
+            return h(tag, attrs, children ? children.map(createElement) : null);
+        };
+        const svgElements = children.map(createElement);
+        return svgElements;
+    }
+    render() {
+        return (h("svg", { key: 'bf1ded84a38f5d8fdb1723476f4709dc58f71def', xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", height: this.size, width: this.size, viewBox: this.iconData?.viewBox || `0 0 ${this.size} ${this.size}` }, this.renderSVGContent(this.iconData?.children)));
+    }
+    static get watchers() { return {
+        "name": ["loadIconData"]
+    }; }
+    static get style() { return leIconCss(); }
+}, [769, "le-icon", {
+        "name": [1],
+        "size": [2],
+        "iconData": [32],
+        "visible": [32]
+    }, undefined, {
+        "name": ["loadIconData"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["le-icon"];
+    components.forEach(tagName => { switch (tagName) {
+        case "le-icon":
+            if (!customElements.get(transformTag(tagName))) {
+                customElements.define(transformTag(tagName), LeIcon);
+            }
+            break;
+    } });
+}
+
+export { LeIcon as L, defineCustomElement as d };
+//# sourceMappingURL=le-icon2.js.map
+
+//# sourceMappingURL=le-icon2.js.map

package/dist/components/le-icon2.js.map

@@ -0,0 +1 @@
+{"file":"le-icon2.js","mappings":"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","names":["__stencil_proxyCustomElement"],"sources":["src/components/le-icon/le-icon.css?tag=le-icon&encapsulation=shadow","src/components/le-icon/le-icon.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n\n  width: var(--le-icon-size, var(--le-size-4));\n  height: var(--le-icon-size, var(--le-size-4));\n\n  color: var(--le-icon-color, var(--le-color-text-primary));\n}\n\n:host svg {\n  display: block;\n  fill: currentColor;\n}\n","/**\n * Based on the script from Paul Andreson's article:\n * https://paulcpederson.com/articles/stencil-icons/\n */\nimport { Build, Component, Element, getAssetPath, h, Prop, State, Watch } from '@stencil/core';\n\nconst iconCache = {};\nconst requestCache = {};\n\nasync function fetchIcon({ name }): Promise<string> {\n  if (iconCache[name]) {\n    return iconCache[name];\n  }\n  if (!requestCache[name]) {\n    requestCache[name] = fetch(getAssetPath(`./assets/icons/${name}.json`))\n      .then(resp => resp.json())\n      .catch(() => {\n        console.error(`\"${name}\" is not a valid name`);\n        return '';\n      });\n  }\n\n  const path = await requestCache[name];\n  iconCache[name] = path;\n\n  return path;\n}\n\n@Component({\n  tag: 'le-icon',\n  styleUrl: 'le-icon.css',\n  shadow: true,\n})\nexport class LeIcon {\n  @Element() el: HTMLElement;\n\n  /**\n   * Name of the icon to display. Corresponds to a JSON file in the assets folder.\n   * For example, \"search\" will load the \"search.json\" file.\n   */\n  @Prop() name: string = null;\n\n  /**\n   * Size of the icon in pixels. Default is 16.\n   */\n  @Prop() size: number = 16;\n\n  @State() private iconData: any = null;\n\n  @State() private visible = false;\n\n  @Watch('name') private async loadIconData(): Promise<void> {\n    const { name, visible } = this;\n\n    if (!Build.isBrowser || !name || !visible) {\n      return;\n    }\n\n    this.iconData = await fetchIcon({ name });\n  }\n\n  private intersectionObserver: IntersectionObserver;\n\n  connectedCallback(): void {\n    this.waitUntilVisible(() => {\n      this.visible = true;\n      this.loadIconData();\n    });\n  }\n\n  disconnectedCallback(): void {\n    if (this.intersectionObserver) {\n      this.intersectionObserver.disconnect();\n      this.intersectionObserver = null;\n    }\n  }\n\n  async componentWillLoad(): Promise<void> {\n    this.loadIconData();\n  }\n\n  private waitUntilVisible(callback: () => void): void {\n    if (\n      !Build.isBrowser ||\n      typeof window === 'undefined' ||\n      !(window as any).IntersectionObserver\n    ) {\n      callback();\n      return;\n    }\n\n    this.intersectionObserver = new IntersectionObserver(\n      entries => {\n        entries.forEach(entry => {\n          if (entry.isIntersecting) {\n            this.intersectionObserver.disconnect();\n            this.intersectionObserver = null;\n            callback();\n          }\n        });\n      },\n      { rootMargin: '50px' },\n    );\n\n    this.intersectionObserver.observe(this.el);\n  }\n\n  /**\n   * Renders the SVG content out of a JSON data in a format:\n   * { \"viewBox\": \"...\", children: [{ \"tag\": \"g\", \"\"children\": [ ... ], ...attrs }, ...] }\n   *\n   * @returns JSX.Element | null\n   */\n  private renderSVGContent(children?: any[]) {\n    if (!children || children.length === 0) {\n      return null;\n    }\n\n    const createElement = node => {\n      const { tag, children, ...attrs } = node;\n      return h(tag, attrs, children ? children.map(createElement) : null);\n    };\n\n    const svgElements = children.map(createElement);\n    return svgElements;\n  }\n\n  render() {\n    return (\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        fill=\"currentColor\"\n        height={this.size}\n        width={this.size}\n        viewBox={this.iconData?.viewBox || `0 0 ${this.size} ${this.size}`}\n      >\n        {this.renderSVGContent(this.iconData?.children)}\n      </svg>\n    );\n  }\n}\n"],"version":3}

package/dist/components/le-multiselect.js

@@ -292,13 +292,13 @@ const LeMultiselect$1 = /*@__PURE__*/ proxyCustomElement(class LeMultiselect ext
     render() {
         const hasSelections = this.selectedOptions.length > 0;
         const atMaxSelections = this.maxSelections && this.value.length >= this.maxSelections;
-        return (h("le-component", { key: '41e4bfe6f961a44cae4cb8de69d836da9dab2a42', component: "le-multiselect" }, h("le-dropdown-base", { key: '74b05d1f6b8930fe97f4f2ae861a12c1749640fe', 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: 'f270977fc98dd71908e63ae6acebaf2d275a8451', slot: "trigger", class: {
+        return (h("le-component", { key: '6fa8274a23f2cc144150442ca9478d405fa9db59', component: "le-multiselect" }, h("le-dropdown-base", { key: 'eccf77b1d40bcc1dbae6d6e73523199dba89c02a', 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: '3c665ad3efc5543a9afcb836c8a996030460723a', slot: "trigger", class: {
                 'multiselect-trigger': true,
                 'has-selections': hasSelections,
                 'is-open': this.open,
                 'is-disabled': this.disabled,
-            }, 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: '9323e791cb4e6e822b493aac81868fc98c10f28f', class: "multiselect-actions" }, hasSelections && !this.disabled && (h("button", { key: '9fcc99acf644977a4f6bb1a54ad47ea1a0521e82', type: "button", class: "multiselect-clear", onClick: this.handleClearAll, "aria-label": "Clear all", tabIndex: -1 }, h("svg", { key: 'd82a6a3b3454854e6357156bed2dcf77fc76309b', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: 'efcd41249ae3166b87b8edd12e85ce6dc44c1ca7', d: "M4 4l8 8M12 4l-8 8" })))), h("span", { key: '07f295dfa81aca548bddeb9b00324ad28be84c0d', class: "multiselect-arrow" }, h("svg", { key: 'ab794b727c4de9af2fd8e1f5bf5fdd4370fc60a5', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '7b5b9628aa0f6cf44a5806cd01fb80ff07e6a05a', d: "M4 6l4 4 4-4" }))))), this.searchable && this.open && (h("div", { key: 'a1da7b5910a7899cf18159e4c1ad9b230eb94ae5', class: "multiselect-search", slot: "header" }, h("le-string-input", { key: '8b2e0876aa7f07e5b35379b2154a2cf548731c26', mode: "default", inputRef: el => (this.inputEl = el), class: "search-input", placeholder: "Search...", value: this.searchQuery, onInput: this.handleSearchInput })))), this.name &&
-            this.value.map(val => (h("input", { type: "hidden", name: this.name, value: val.toString(), key: val.toString() }))), atMaxSelections && (h("span", { key: '5d98fd2daa6a9ddbc90b9be701fda628156dbe62', class: "multiselect-status" }, "Maximum ", this.maxSelections, " selections"))));
+            }, 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: 'a19d6d1dfa9bfb757874bb4e39f75e3dc8e4f101', class: "multiselect-actions" }, hasSelections && !this.disabled && (h("button", { key: 'f639279dd53a1eaff6ff146c57129d598bc55ca5', type: "button", class: "multiselect-clear", onClick: this.handleClearAll, "aria-label": "Clear all", tabIndex: -1 }, h("svg", { key: 'a5458f2d7dae924b7f943df067269beca1d9bfdd', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: 'c2fd9f943f0496e2c0e0ecbb79e1a16993cb796d', d: "M4 4l8 8M12 4l-8 8" })))), h("span", { key: 'bd7fc5ef0af6b937fea089881f3d5fc881219247', class: "multiselect-arrow" }, h("svg", { key: '180c1c3b35713fc5de0aade07ef3524dd674cca5', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '48c1e6e3f2c0c20b52d2ba551d2720e5da5f0bed', d: "M4 6l4 4 4-4" }))))), this.searchable && this.open && (h("div", { key: '3b6dbe407a4d33065ff50496c14a71ebd27e71bb', class: "multiselect-search", slot: "header" }, h("le-string-input", { key: '35ed3a229b0ca6f4e1f9e8732c94a531af2d7fb3', mode: "default", inputRef: el => (this.inputEl = el), class: "search-input", placeholder: "Search...", value: this.searchQuery, onInput: this.handleSearchInput })))), this.name &&
+            this.value.map(val => (h("input", { type: "hidden", name: this.name, value: val.toString(), key: val.toString() }))), atMaxSelections && (h("span", { key: '214ee34c77755375045fce655129736ff4a1ef0f', class: "multiselect-status" }, "Maximum ", this.maxSelections, " selections"))));
     }
     static get watchers() { return {
         "value": ["handleValueChange"],

package/dist/components/le-navigation.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface LeNavigation extends Components.LeNavigation, HTMLElement {}
+export const LeNavigation: {
+    prototype: LeNavigation;
+    new (): LeNavigation;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;