le-kit 0.5.2 → 0.5.4

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

@@ -1,130 +0,0 @@
-import { h, Host } from "@stencil/core";
-/**
- * Shows a "smart" header title based on what has scrolled out of view.
- *
- * When `selector` matches multiple elements, the title becomes the last element
- * (top-to-bottom) that has fully scrolled out above the viewport.
- *
- * @slot - Optional fallback content if no watched title is active
- *
- * @csspart title - The rendered title
- *
- * @cmsEditable true
- * @cmsCategory Layout
- */
-export class LeCurrentHeading {
-    el;
-    /** CSS selector for page title/headings to watch (e.g. `.page-title`, `main h2`). */
-    selector = '';
-    activeText = null;
-    componentWillLoad() {
-        this.updateActiveTitle();
-    }
-    onSelectorChange() {
-        this.updateActiveTitle();
-    }
-    onScroll() {
-        this.updateActiveTitle();
-    }
-    onResize() {
-        this.updateActiveTitle();
-    }
-    updateActiveTitle() {
-        if (typeof window === 'undefined')
-            return;
-        const selector = (this.selector ?? '').trim();
-        if (!selector) {
-            this.activeText = null;
-            return;
-        }
-        let elements = [];
-        try {
-            elements = Array.from(document.querySelectorAll(selector));
-        }
-        catch {
-            this.activeText = null;
-            return;
-        }
-        // Pick the last element that is fully above the viewport.
-        let nextText = null;
-        for (const element of elements) {
-            const rect = element.getBoundingClientRect();
-            if (rect.height > 0 && rect.bottom <= 0) {
-                const t = (element.textContent ?? '').trim();
-                if (t)
-                    nextText = t;
-            }
-        }
-        // Do not create oscillations: update only when the computed title changes.
-        if (nextText !== this.activeText) {
-            this.activeText = nextText;
-        }
-    }
-    render() {
-        return (h(Host, { key: 'c8d94a695a402039000210914b6780264a034a89' }, this.activeText ? (h("span", { class: "title", part: "title" }, this.activeText)) : (h("slot", null))));
-    }
-    static get is() { return "le-current-heading"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["le-current-heading.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["le-current-heading.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "selector": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "CSS selector for page title/headings to watch (e.g. `.page-title`, `main h2`)."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "selector",
-                "defaultValue": "''"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "activeText": {}
-        };
-    }
-    static get elementRef() { return "el"; }
-    static get watchers() {
-        return [{
-                "propName": "selector",
-                "methodName": "onSelectorChange"
-            }];
-    }
-    static get listeners() {
-        return [{
-                "name": "scroll",
-                "method": "onScroll",
-                "target": "window",
-                "capture": false,
-                "passive": true
-            }, {
-                "name": "resize",
-                "method": "onResize",
-                "target": "window",
-                "capture": false,
-                "passive": true
-            }];
-    }
-}
-//# sourceMappingURL=le-current-heading.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"le-current-heading.js","sourceRoot":"","sources":["../../../src/components/le-current-heading/le-current-heading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAExF;;;;;;;;;;;;GAYG;AAMH,MAAM,OAAO,gBAAgB;IAChB,EAAE,CAAc;IAE3B,qFAAqF;IACpD,QAAQ,GAAW,EAAE,CAAC;IAEtC,UAAU,GAAkB,IAAI,CAAC;IAElD,iBAAiB;QACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAGS,gBAAgB;QACxB,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAGS,QAAQ;QAChB,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAGS,QAAQ;QAChB,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAEO,iBAAiB;QACvB,IAAI,OAAO,MAAM,KAAK,WAAW;YAAE,OAAO;QAC1C,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;QAC9C,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,OAAO;QACT,CAAC;QAED,IAAI,QAAQ,GAAc,EAAE,CAAC;QAC7B,IAAI,CAAC;YACH,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;QAC7D,CAAC;QAAC,MAAM,CAAC;YACP,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,OAAO;QACT,CAAC;QAED,0DAA0D;QAC1D,IAAI,QAAQ,GAAkB,IAAI,CAAC;QACnC,KAAK,MAAM,OAAO,IAAI,QAAQ,EAAE,CAAC;YAC/B,MAAM,IAAI,GAAI,OAAuB,CAAC,qBAAqB,EAAE,CAAC;YAC9D,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC;gBACxC,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;gBAC7C,IAAI,CAAC;oBAAE,QAAQ,GAAG,CAAC,CAAC;YACtB,CAAC;QACH,CAAC;QAED,2EAA2E;QAC3E,IAAI,QAAQ,KAAK,IAAI,CAAC,UAAU,EAAE,CAAC;YACjC,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC;QAC7B,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,uDACF,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CACjB,YAAM,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,IAC7B,IAAI,CAAC,UAAU,CACX,CACR,CAAC,CAAC,CAAC,CACF,eAAa,CACd,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, Listen, Prop, State, Watch } from '@stencil/core';\n\n/**\n * Shows a \"smart\" header title based on what has scrolled out of view.\n *\n * When `selector` matches multiple elements, the title becomes the last element\n * (top-to-bottom) that has fully scrolled out above the viewport.\n *\n * @slot - Optional fallback content if no watched title is active\n *\n * @csspart title - The rendered title\n *\n * @cmsEditable true\n * @cmsCategory Layout\n */\n@Component({\n  tag: 'le-current-heading',\n  styleUrl: 'le-current-heading.css',\n  shadow: true,\n})\nexport class LeCurrentHeading {\n  @Element() el: HTMLElement;\n\n  /** CSS selector for page title/headings to watch (e.g. `.page-title`, `main h2`). */\n  @Prop({ attribute: 'selector' }) selector: string = '';\n\n  @State() private activeText: string | null = null;\n\n  componentWillLoad() {\n    this.updateActiveTitle();\n  }\n\n  @Watch('selector')\n  protected onSelectorChange() {\n    this.updateActiveTitle();\n  }\n\n  @Listen('scroll', { target: 'window', passive: true })\n  protected onScroll() {\n    this.updateActiveTitle();\n  }\n\n  @Listen('resize', { target: 'window', passive: true })\n  protected onResize() {\n    this.updateActiveTitle();\n  }\n\n  private updateActiveTitle() {\n    if (typeof window === 'undefined') return;\n    const selector = (this.selector ?? '').trim();\n    if (!selector) {\n      this.activeText = null;\n      return;\n    }\n\n    let elements: Element[] = [];\n    try {\n      elements = Array.from(document.querySelectorAll(selector));\n    } catch {\n      this.activeText = null;\n      return;\n    }\n\n    // Pick the last element that is fully above the viewport.\n    let nextText: string | null = null;\n    for (const element of elements) {\n      const rect = (element as HTMLElement).getBoundingClientRect();\n      if (rect.height > 0 && rect.bottom <= 0) {\n        const t = (element.textContent ?? '').trim();\n        if (t) nextText = t;\n      }\n    }\n\n    // Do not create oscillations: update only when the computed title changes.\n    if (nextText !== this.activeText) {\n      this.activeText = nextText;\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.activeText ? (\n          <span class=\"title\" part=\"title\">\n            {this.activeText}\n          </span>\n        ) : (\n          <slot></slot>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/le-dropdown-base/le-dropdown-base.css

@@ -1,167 +0,0 @@
-/**
- * le-dropdown-base component styles
- *
- * Internal component - minimal styling, meant to be customized
- * by wrapper components (le-select, le-combobox, etc.)
- */
-
-:host {
-  display: block;
-  --le-dropdown-list-padding: var(--le-spacing-1);
-  --le-dropdown-empty-padding: var(--le-spacing-4);
-  --le-dropdown-option-radius: var(--le-radius-md);
-  --le-dropdown-font-size: var(--le-font-size-sm);
-  --le-dropdown-option-padding: var(--le-spacing-1) var(--le-spacing-2);
-  --le-dropdown-group-padding: var(--le-spacing-2) var(--le-spacing-2) var(--le-spacing-1);
-  --le-dropdown-group-font-size: var(--le-font-size-xs);
-}
-
-:host([disabled]) {
-  pointer-events: none;
-  opacity: 0.5;
-}
-
-/* Dropdown list container */
-le-popover::part(content) {
-  overflow-y: auto;
-  overflow-x: hidden;
-  padding: var(--le-dropdown-list-padding, 0.25rem);
-}
-
-/* Empty state */
-.dropdown-empty {
-  padding: var(--le-dropdown-empty-padding);
-  text-align: center;
-  color: var(--le-color-text-secondary, #9ca3af);
-  font-size: var(--le-dropdown-font-size);
-}
-
-/* Group header */
-.dropdown-group-header {
-  padding: var(--le-dropdown-group-padding);
-  font-size: var(--le-dropdown-group-font-size);
-  font-weight: 700;
-  color: var(--le-color-text-secondary, #9ca3af);
-  letter-spacing: 0.05em;
-}
-
-.dropdown-list {
-  text-align: initial;
-}
-
-/* Separator */
-.dropdown-separator {
-  height: 1px;
-  margin: var(--le-dropdown-separator-margin, 0.25rem 0);
-  background: var(--le-color-border, #e5e7eb);
-}
-
-/* Option item */
-.dropdown-option {
-  display: flex;
-  align-items: center;
-  gap: var(--le-dropdown-option-gap, 0.5rem);
-  padding: var(--le-dropdown-option-padding);
-  font-size: var(--le-dropdown-font-size, 0.875rem);
-  line-height: 1.4;
-  color: var(--le-color-text, #1f2937);
-  border: 1px solid transparent;
-  border-radius: var(--le-dropdown-option-radius, 0.25rem);
-  cursor: pointer;
-  user-select: none;
-  transition: background-color 0.1s ease;
-}
-
-.dropdown-option:hover,
-.dropdown-option.is-focused {
-  border-color: var(--le-color-border-hover, #d1d5db);
-}
-
-.dropdown-option.is-disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
-.dropdown-option.is-disabled:hover {
-  background: transparent;
-}
-
-/* Checkbox for multiselect */
-.option-checkbox {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 1rem;
-  height: 1rem;
-  border: 2px solid var(--le-color-border, #d1d5db);
-  border-radius: 0.25rem;
-  background: var(--le-color-surface, #fff);
-  flex-shrink: 0;
-}
-
-.is-selected .option-checkbox {
-  background: var(--le-color-primary, #3b82f6);
-  border-color: var(--le-color-primary, #3b82f6);
-  color: white;
-}
-
-.option-checkbox svg {
-  width: 0.75rem;
-  height: 0.75rem;
-}
-
-/* Icons */
-.option-icon-start,
-.option-icon-end {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-  width: 1.25rem;
-  height: 1.25rem;
-}
-
-.option-icon-start img,
-.option-icon-end img {
-  width: 100%;
-  height: 100%;
-  object-fit: contain;
-}
-
-/* Content */
-.option-content {
-  flex: 1;
-  min-width: 0;
-  display: flex;
-  flex-direction: column;
-}
-
-.option-label {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.option-description {
-  font-size: 0.75rem;
-  color: var(--le-color-text-muted, #6b7280);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-/* Check mark for single select */
-.option-check {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 1rem;
-  height: 1rem;
-  color: var(--le-color-primary, #3b82f6);
-  flex-shrink: 0;
-}
-
-.option-check svg {
-  width: 1rem;
-  height: 1rem;
-}