@cognivo/components 0.8.0 → 0.8.2

package/dist/components/cg-select/cg-select.js

@@ -1,16 +1,15 @@
-import { css as p, LitElement as u, nothing as g, html as n } from "lit";
-import { property as a, state as h, customElement as v } from "lit/decorators.js";
-import { h as f, r as b } from "../../chunks/premium.css-9I4kHrsl.js";
-var m = Object.defineProperty, y = Object.getOwnPropertyDescriptor, t = (e, i, o, c) => {
-  for (var s = c > 1 ? void 0 : c ? y(i, o) : i, d = e.length - 1, l; d >= 0; d--)
-    (l = e[d]) && (s = (c ? l(i, o, s) : l(s)) || s);
-  return c && s && m(i, o, s), s;
+import { css as p, LitElement as u, nothing as c, html as l } from "lit";
+import { property as s, state as g, customElement as v } from "lit/decorators.js";
+import { h as b, r as f } from "../../chunks/premium.css-DHekUEUt.js";
+import { b as m } from "../../chunks/outside-click-CP1P1fK3.js";
+var _ = Object.defineProperty, y = Object.getOwnPropertyDescriptor, t = (e, i, o, n) => {
+  for (var a = n > 1 ? void 0 : n ? y(i, o) : i, d = e.length - 1, h; d >= 0; d--)
+    (h = e[d]) && (a = (n ? h(i, o, a) : h(a)) || a);
+  return n && a && _(i, o, a), a;
 };
 let r = class extends u {
   constructor() {
-    super(), this.size = "md", this.rounded = "lg", this.options = [], this.value = "", this.label = "", this.placeholder = "Select...", this.name = "", this.disabled = !1, this.error = !1, this.success = !1, this.loading = !1, this.searchable = !1, this.required = !1, this._open = !1, this._search = "", this._highlighted = -1, this._handleClickOutside = (e) => {
-      e.composedPath().includes(this) || this._close();
-    }, typeof this.attachInternals == "function" && (this._internals = this.attachInternals());
+    super(), this.size = "md", this.rounded = "md", this.options = [], this.value = "", this.label = "", this.placeholder = "Select...", this.name = "", this.disabled = !1, this.error = !1, this.success = !1, this.loading = !1, this.searchable = !1, this.required = !1, this._open = !1, this._search = "", this._highlighted = -1, this._disposeOutsideClick = null, typeof this.attachInternals == "function" && (this._internals = this.attachInternals());
   }
   updated(e) {
     super.updated(e), e.has("value") && this._internals?.setFormValue(this.value), (e.has("required") || e.has("value")) && (this.required && !this.value ? this._internals?.setValidity({ valueMissing: !0 }, "This field is required") : this._internals?.setValidity({}));
@@ -21,8 +20,17 @@ let r = class extends u {
   formStateRestoreCallback(e) {
     this.value = e;
   }
+  _openPanel() {
+    this._open = !0, this._search = "", this._highlighted = this.options.findIndex((e) => e.value === this.value);
+  }
   _toggle() {
-    this.disabled || this.loading || (this._open = !this._open, this._search = "", this._highlighted = -1);
+    if (!(this.disabled || this.loading)) {
+      if (this._open) {
+        this._close();
+        return;
+      }
+      this._openPanel(), this.searchable && this.updateComplete.then(() => this.shadowRoot?.querySelector(".search input")?.focus());
+    }
   }
   _close() {
     this._open = !1, this._search = "";
@@ -35,7 +43,13 @@ let r = class extends u {
     const e = this._search.toLowerCase();
     return this.options.filter((i) => i.label.toLowerCase().includes(e));
   }
+  _scrollHighlightedIntoView() {
+    this.updateComplete.then(
+      () => this.shadowRoot?.querySelector(".option.highlighted")?.scrollIntoView({ block: "nearest" })
+    );
+  }
   _handleKeydown(e) {
+    if (e.key === " " && e.target instanceof HTMLInputElement) return;
     const i = this._filteredOptions();
     if (e.key === "Escape") {
       this._close();
@@ -46,35 +60,53 @@ let r = class extends u {
         this._toggle(), e.preventDefault();
         return;
       }
-      this._highlighted >= 0 && this._highlighted < i.length && (this._select(i[this._highlighted]), e.preventDefault());
+      e.preventDefault(), this._highlighted >= 0 && this._highlighted < i.length && this._select(i[this._highlighted]);
       return;
     }
     if (e.key === "ArrowDown") {
       if (e.preventDefault(), !this._open) {
-        this._open = !0;
+        this._openPanel();
         return;
       }
-      this._highlighted = Math.min(this._highlighted + 1, i.length - 1);
+      this._highlighted = Math.min(this._highlighted + 1, i.length - 1), this._scrollHighlightedIntoView();
+      return;
     }
-    e.key === "ArrowUp" && (e.preventDefault(), this._highlighted = Math.max(this._highlighted - 1, 0));
+    if (e.key === "ArrowUp") {
+      if (e.preventDefault(), !this._open) {
+        this._openPanel();
+        return;
+      }
+      this._highlighted = Math.max(this._highlighted - 1, 0), this._scrollHighlightedIntoView();
+      return;
+    }
+    if (e.key === "Home" && this._open) {
+      e.preventDefault(), this._highlighted = 0, this._scrollHighlightedIntoView();
+      return;
+    }
+    e.key === "End" && this._open && (e.preventDefault(), this._highlighted = i.length - 1, this._scrollHighlightedIntoView());
   }
   connectedCallback() {
-    super.connectedCallback(), document.removeEventListener("click", this._handleClickOutside), document.addEventListener("click", this._handleClickOutside);
+    super.connectedCallback(), this._disposeOutsideClick?.(), this._disposeOutsideClick = m(this, () => this._close());
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), document.removeEventListener("click", this._handleClickOutside);
+    super.disconnectedCallback(), this._disposeOutsideClick?.(), this._disposeOutsideClick = null;
   }
   render() {
     const e = this.options.find((o) => o.value === this.value), i = this._filteredOptions();
-    return n`
-      ${this.label ? n`<span class="label">${this.label}</span>` : g}
+    return l`
+      ${this.label ? l`<span class="label" id="select-label">${this.label}</span>` : c}
       <div
         class="trigger ${this._open ? "open" : ""} ${this.disabled ? "disabled" : ""}"
         tabindex=${this.disabled ? "-1" : "0"}
         role="combobox"
         aria-expanded=${this._open}
         aria-haspopup="listbox"
+        aria-controls="select-listbox"
+        aria-labelledby=${this.label ? "select-label" : c}
+        aria-label=${this.label ? c : this.placeholder}
+        aria-activedescendant=${this._open && this._highlighted >= 0 && this._highlighted < i.length ? `select-option-${this._highlighted}` : c}
         aria-required=${this.required ? "true" : "false"}
+        aria-invalid=${this.error ? "true" : "false"}
         aria-busy=${this.loading ? "true" : "false"}
         @click=${this._toggle}
         @keydown=${this._handleKeydown}
@@ -82,33 +114,37 @@ let r = class extends u {
         <span class="trigger-text ${e ? "" : "placeholder"}">
           ${e ? e.label : this.placeholder}
         </span>
-        ${this.loading ? n`<span class="loading-spinner" aria-hidden="true"></span>` : n`
+        ${this.loading ? l`<span class="loading-spinner" aria-hidden="true"></span>` : l`
         <svg class="chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
           <path d="M6 9l6 6 6-6"></path>
         </svg>`}
       </div>
 
-      <div class="dropdown ${this._open ? "open" : ""}" ?hidden=${!this._open} role="listbox">
-        ${this.searchable ? n`
+      <div class="dropdown ${this._open ? "open" : ""}" ?hidden=${!this._open} role="listbox" id="select-listbox">
+        ${this.searchable ? l`
           <div class="search">
             <input
               placeholder="Search..."
+              aria-label="Search options"
               .value=${this._search}
               @input=${(o) => {
       this._search = o.target.value, this._highlighted = 0;
     }}
+              @keydown=${this._handleKeydown}
               @click=${(o) => o.stopPropagation()}
             />
           </div>
-        ` : g}
-        ${i.length === 0 ? n`<div class="empty-msg">No options</div>` : g}
-        ${i.map((o, c) => n`
+        ` : c}
+        ${i.length === 0 ? l`<div class="empty-msg">No options</div>` : c}
+        ${i.map((o, n) => l`
           <div
-            class="option ${o.value === this.value ? "selected" : ""} ${c === this._highlighted ? "highlighted" : ""} ${o.disabled ? "disabled" : ""}"
+            class="option ${o.value === this.value ? "selected" : ""} ${n === this._highlighted ? "highlighted" : ""} ${o.disabled ? "disabled" : ""}"
             role="option"
+            id="select-option-${n}"
             aria-selected=${o.value === this.value}
-            @click=${(s) => {
-      s.stopPropagation(), this._select(o);
+            aria-disabled=${o.disabled ? "true" : "false"}
+            @click=${(a) => {
+      a.stopPropagation(), this._select(o);
     }}
           >
             <span>${o.label}</span>
@@ -120,7 +156,7 @@ let r = class extends u {
   }
 };
 r.formAssociated = !0;
-r.styles = [f, b, p`
+r.styles = [b, f, p`
     :host { position: relative; display: block; }
 
     .trigger {
@@ -173,7 +209,7 @@ r.styles = [f, b, p`
 
     .trigger-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
     .placeholder { color: var(--cg-color-input-text-placeholder); }
-    .chevron { width: var(--cg-icon-size-100); height: var(--cg-icon-size-100); flex-shrink: 0; transition: transform var(--cg-transition-duration-default) var(--cg-transition-easing-default); color: var(--cg-color-surface-container-outlined); }
+    .chevron { width: var(--cg-icon-size-100); height: var(--cg-icon-size-100); flex-shrink: 0; transition: transform var(--cg-transition-duration-default) var(--cg-transition-easing-default); color: var(--cg-color-input-text-placeholder); }
     .trigger.open .chevron { transform: rotate(180deg); }
 
     .dropdown {
@@ -182,30 +218,32 @@ r.styles = [f, b, p`
       background: var(--cg-color-modal-container-background);
       border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
       border-radius: var(--cg-component-card-radius);
-      max-height: 240px; overflow-y: auto;
-      opacity: 0; transform: translateY(calc(-1 * var(--cg-spacing-4))) scale(0.98); pointer-events: none;
-      transition: opacity var(--cg-transition-duration-fast) var(--cg-transition-easing-default), transform var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
+      max-height: var(--cg-component-combobox-listbox-max-height); overflow-y: auto;
     }
     .dropdown.open {
-      opacity: 1; transform: translateY(0) scale(1); pointer-events: auto;
+      animation: cg-select-dropdown-in var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
+    }
+    @keyframes cg-select-dropdown-in {
+      from { opacity: 0; transform: scale(0.96) translateY(calc(var(--cg-spacing-4) * -1)); }
+      to { opacity: 1; transform: scale(1) translateY(0); }
     }
     .dropdown[hidden] { display: none; }
 
     .option {
-      padding: var(--cg-spacing-8) var(--cg-spacing-12); border-radius: var(--cg-border-radius-150); cursor: pointer;
+      padding: var(--cg-spacing-8) var(--cg-spacing-12); border-radius: var(--cg-border-radius-100); cursor: pointer;
       font-size: var(--cg-font-size-sm);
       color: var(--cg-color-surface-base-text);
       transition: background var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
       display: flex; align-items: center; gap: var(--cg-spacing-8);
     }
-    .option:hover { background: var(--cg-overlay-dark-subtle); }
-    .option.highlighted { background: var(--cg-overlay-dark-subtle); }
-    .option.selected { color: var(--cg-color-action-primary-background-default); font-weight: var(--cg-font-weight-medium); }
+    .option:hover { background: var(--cg-color-action-tertiary-background-hover); }
+    .option.highlighted { background: var(--cg-color-action-secondary-background-hover); }
+    .option.selected { color: var(--cg-color-accent-text); font-weight: var(--cg-font-weight-medium); }
     .option.disabled { opacity: 0.5; pointer-events: none; }
     .option .check {
       width: var(--cg-icon-size-100); height: var(--cg-icon-size-100); flex-shrink: 0;
       margin-left: auto; opacity: 0;
-      color: var(--cg-color-action-primary-background-default);
+      color: var(--cg-color-accent-text);
       transition: opacity var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
     }
     .option.selected .check { opacity: 1; }
@@ -214,7 +252,7 @@ r.styles = [f, b, p`
     .search input {
       width: 100%; box-sizing: border-box;
       padding: var(--cg-spacing-8) var(--cg-spacing-12);
-      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-divider);
+      border: var(--cg-border-width-50) solid var(--cg-color-input-border-default);
       border-radius: var(--cg-border-radius-100);
       font: inherit; font-size: var(--cg-font-size-sm); outline: none;
       background: transparent; color: var(--cg-color-input-text-default);
@@ -224,7 +262,7 @@ r.styles = [f, b, p`
 
     .empty-msg { padding: var(--cg-spacing-12); text-align: center; color: var(--cg-color-input-text-placeholder); font-size: var(--cg-font-size-sm); }
 
-    .label { display: block; font-size: var(--cg-font-size-xs); font-weight: var(--cg-font-weight-medium); color: var(--cg-color-surface-container-outlined); margin-bottom: var(--cg-spacing-4); }
+    .label { display: block; font-size: var(--cg-font-size-xs); font-weight: var(--cg-font-weight-medium); color: var(--cg-color-surface-container-text); margin-bottom: var(--cg-spacing-4); }
 
     /* Size variants */
     :host([size="sm"]) .trigger { height: var(--cg-component-input-height-sm); font-size: var(--cg-font-size-xs); padding: 0 var(--cg-spacing-8); border-radius: var(--cg-border-radius-100); }
@@ -243,55 +281,55 @@ r.styles = [f, b, p`
     :host([rounded="lg"]) .trigger { border-radius: var(--cg-border-radius-150); }
     :host([rounded="lg"]) .dropdown { border-radius: var(--cg-border-radius-150); }
     :host([rounded="full"]) .trigger { border-radius: var(--cg-border-radius-full); }
-    :host([rounded="full"]) .dropdown { border-radius: var(--cg-border-radius-full); }
+    :host([rounded="full"]) .dropdown { border-radius: var(--cg-border-radius-150); }
   `];
 t([
-  a({ reflect: !0 })
+  s({ reflect: !0 })
 ], r.prototype, "size", 2);
 t([
-  a({ reflect: !0 })
+  s({ reflect: !0 })
 ], r.prototype, "rounded", 2);
 t([
-  a({ type: Array })
+  s({ type: Array })
 ], r.prototype, "options", 2);
 t([
-  a()
+  s()
 ], r.prototype, "value", 2);
 t([
-  a()
+  s()
 ], r.prototype, "label", 2);
 t([
-  a()
+  s()
 ], r.prototype, "placeholder", 2);
 t([
-  a()
+  s()
 ], r.prototype, "name", 2);
 t([
-  a({ type: Boolean })
+  s({ type: Boolean })
 ], r.prototype, "disabled", 2);
 t([
-  a({ type: Boolean, reflect: !0 })
+  s({ type: Boolean, reflect: !0 })
 ], r.prototype, "error", 2);
 t([
-  a({ type: Boolean, reflect: !0 })
+  s({ type: Boolean, reflect: !0 })
 ], r.prototype, "success", 2);
 t([
-  a({ type: Boolean, reflect: !0 })
+  s({ type: Boolean, reflect: !0 })
 ], r.prototype, "loading", 2);
 t([
-  a({ type: Boolean })
+  s({ type: Boolean })
 ], r.prototype, "searchable", 2);
 t([
-  a({ type: Boolean })
+  s({ type: Boolean })
 ], r.prototype, "required", 2);
 t([
-  h()
+  g()
 ], r.prototype, "_open", 2);
 t([
-  h()
+  g()
 ], r.prototype, "_search", 2);
 t([
-  h()
+  g()
 ], r.prototype, "_highlighted", 2);
 r = t([
   v("cg-select")

package/dist/components/cg-select/cg-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"cg-select.js","sources":["../../../src/components/cg-select/cg-select.ts"],"sourcesContent":["import { LitElement, html, css, nothing, type PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/**\n * @element cg-select\n * Dropdown select with optional search filtering and keyboard navigation.\n *\n * @example\n * ```html\n * <cg-select\n *   placeholder=\"Choose a fruit\"\n *   .options=${[{value:'apple',label:'Apple'},{value:'banana',label:'Banana'}]}\n * ></cg-select>\n * <cg-select searchable error .options=${items}></cg-select>\n * ```\n *\n * @fires {CustomEvent<{value: string, label: string}>} cg-change - When a selection is made\n *\n * @cssprop [--cg-color-input-background-default=#18181b] - Trigger background\n * @cssprop [--cg-color-surface-container-background=#18181b] - Dropdown panel background\n * @cssprop [--cg-color-focus-ring] - Focus/hover border accent\n * @cssprop [--cg-border-radius-150=12px] - Border radius for trigger and dropdown\n */\n\n/** Option entry for cg-select, with value, display label, and optional disabled state. */\nexport interface SelectOption {\n  value: string;\n  label: string;\n  disabled?: boolean;\n}\n\n@customElement('cg-select')\nexport class CgSelect extends LitElement {\n  static formAssociated = true;\n  private _internals: ElementInternals | undefined;\n\n  constructor() {\n    super();\n    if (typeof this.attachInternals === 'function') {\n      this._internals = this.attachInternals();\n    }\n  }\n\n  static override styles = [hostBlock, reducedMotion, css`\n    :host { position: relative; display: block; }\n\n    .trigger {\n      display: flex; align-items: center; justify-content: space-between;\n      width: 100%; box-sizing: border-box;\n      padding: 0 var(--cg-spacing-12); gap: var(--cg-spacing-8);\n      border: var(--cg-border-width-50) solid var(--cg-color-input-border-default);\n      border-radius: var(--cg-component-select-radius);\n      background: var(--cg-color-input-background-default);\n      font: inherit; font-size: var(--cg-font-size-sm);\n      color: var(--cg-color-input-text-default);\n      cursor: pointer; height: var(--cg-component-select-height-md);\n      transition: border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default), box-shadow var(--cg-transition-duration-fast) var(--cg-transition-easing-default), transform var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n      outline: none;\n    }\n    .trigger:hover:not(.disabled) { border-color: var(--cg-color-input-border-hover); }\n    .trigger:active:not(.disabled) {\n      transform: scale(var(--cg-interaction-press-scale));\n    }\n    .trigger:focus-visible { outline: none; border-color: var(--cg-color-input-border-focus); box-shadow: 0 0 0 3px var(--cg-overlay-accent-strong); }\n\n    /* Loading */\n    :host([loading]) .trigger { pointer-events: none; opacity: 0.7; }\n    .loading-spinner {\n      width: var(--cg-spacing-16);\n      height: var(--cg-spacing-16);\n      border: var(--cg-border-width-100) solid var(--cg-color-loading-spinner-secondary);\n      border-top-color: var(--cg-color-loading-spinner-primary);\n      border-radius: var(--cg-border-radius-full);\n      animation: cg-select-spin var(--cg-transition-duration-slow) linear infinite;\n      flex-shrink: 0;\n    }\n    @keyframes cg-select-spin {\n      to { transform: rotate(360deg); }\n    }\n    .trigger.open { border-color: var(--cg-color-input-border-focus); box-shadow: 0 0 0 3px var(--cg-overlay-accent-strong); }\n    .trigger.disabled { opacity: 0.5; pointer-events: none; background: var(--cg-color-input-background-disabled); border-color: var(--cg-color-input-border-disabled); }\n    :host([error]) .trigger { border-color: var(--cg-color-input-border-error); }\n    :host([error]) .trigger:focus-visible,\n    :host([error]) .trigger.open {\n      border-color: var(--cg-color-status-error-text-default);\n      box-shadow: 0 0 0 3px var(--cg-shadow-focus-error);\n    }\n    :host([success]) .trigger { border-color: var(--cg-color-status-success-border-default); }\n    :host([success]) .trigger:focus-visible,\n    :host([success]) .trigger.open {\n      border-color: var(--cg-color-status-success-text-default);\n      box-shadow: 0 0 0 3px var(--cg-shadow-focus-success);\n    }\n\n    .trigger-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n    .placeholder { color: var(--cg-color-input-text-placeholder); }\n    .chevron { width: var(--cg-icon-size-100); height: var(--cg-icon-size-100); flex-shrink: 0; transition: transform var(--cg-transition-duration-default) var(--cg-transition-easing-default); color: var(--cg-color-surface-container-outlined); }\n    .trigger.open .chevron { transform: rotate(180deg); }\n\n    .dropdown {\n      position: absolute; top: 100%; left: 0; right: 0; z-index: var(--cg-z-index-200);\n      margin-top: var(--cg-spacing-4); padding: var(--cg-spacing-6);\n      background: var(--cg-color-modal-container-background);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-component-card-radius);\n      max-height: 240px; overflow-y: auto;\n      opacity: 0; transform: translateY(calc(-1 * var(--cg-spacing-4))) scale(0.98); pointer-events: none;\n      transition: opacity var(--cg-transition-duration-fast) var(--cg-transition-easing-default), transform var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .dropdown.open {\n      opacity: 1; transform: translateY(0) scale(1); pointer-events: auto;\n    }\n    .dropdown[hidden] { display: none; }\n\n    .option {\n      padding: var(--cg-spacing-8) var(--cg-spacing-12); border-radius: var(--cg-border-radius-150); cursor: pointer;\n      font-size: var(--cg-font-size-sm);\n      color: var(--cg-color-surface-base-text);\n      transition: background var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n      display: flex; align-items: center; gap: var(--cg-spacing-8);\n    }\n    .option:hover { background: var(--cg-overlay-dark-subtle); }\n    .option.highlighted { background: var(--cg-overlay-dark-subtle); }\n    .option.selected { color: var(--cg-color-action-primary-background-default); font-weight: var(--cg-font-weight-medium); }\n    .option.disabled { opacity: 0.5; pointer-events: none; }\n    .option .check {\n      width: var(--cg-icon-size-100); height: var(--cg-icon-size-100); flex-shrink: 0;\n      margin-left: auto; opacity: 0;\n      color: var(--cg-color-action-primary-background-default);\n      transition: opacity var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .option.selected .check { opacity: 1; }\n\n    .search { padding: 0; margin-bottom: var(--cg-spacing-4); }\n    .search input {\n      width: 100%; box-sizing: border-box;\n      padding: var(--cg-spacing-8) var(--cg-spacing-12);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-divider);\n      border-radius: var(--cg-border-radius-100);\n      font: inherit; font-size: var(--cg-font-size-sm); outline: none;\n      background: transparent; color: var(--cg-color-input-text-default);\n    }\n    .search input::placeholder { color: var(--cg-color-input-text-placeholder); }\n    .search input:focus { border-color: var(--cg-color-input-border-focus); }\n\n    .empty-msg { padding: var(--cg-spacing-12); text-align: center; color: var(--cg-color-input-text-placeholder); font-size: var(--cg-font-size-sm); }\n\n    .label { display: block; font-size: var(--cg-font-size-xs); font-weight: var(--cg-font-weight-medium); color: var(--cg-color-surface-container-outlined); margin-bottom: var(--cg-spacing-4); }\n\n    /* Size variants */\n    :host([size=\"sm\"]) .trigger { height: var(--cg-component-input-height-sm); font-size: var(--cg-font-size-xs); padding: 0 var(--cg-spacing-8); border-radius: var(--cg-border-radius-100); }\n    :host([size=\"sm\"]) .option { font-size: var(--cg-font-size-xs); }\n\n    :host([size=\"lg\"]) .trigger { height: var(--cg-component-input-height-lg); font-size: var(--cg-font-size-base); padding: 0 var(--cg-spacing-16); border-radius: var(--cg-border-radius-150); }\n    :host([size=\"lg\"]) .option { font-size: var(--cg-font-size-base); }\n\n    /* ── Rounded overrides ── */\n    :host([rounded=\"none\"]) .trigger { border-radius: 0; }\n    :host([rounded=\"none\"]) .dropdown { border-radius: 0; }\n    :host([rounded=\"sm\"]) .trigger { border-radius: var(--cg-border-radius-50); }\n    :host([rounded=\"sm\"]) .dropdown { border-radius: var(--cg-border-radius-50); }\n    :host([rounded=\"md\"]) .trigger { border-radius: var(--cg-component-select-radius); }\n    :host([rounded=\"md\"]) .dropdown { border-radius: var(--cg-component-select-radius); }\n    :host([rounded=\"lg\"]) .trigger { border-radius: var(--cg-border-radius-150); }\n    :host([rounded=\"lg\"]) .dropdown { border-radius: var(--cg-border-radius-150); }\n    :host([rounded=\"full\"]) .trigger { border-radius: var(--cg-border-radius-full); }\n    :host([rounded=\"full\"]) .dropdown { border-radius: var(--cg-border-radius-full); }\n  `];\n\n  @property({ reflect: true }) size: 'sm' | 'md' | 'lg' = 'md';\n  @property({ reflect: true }) rounded: 'none' | 'sm' | 'md' | 'lg' | 'full' = 'lg';\n  @property({ type: Array }) options: SelectOption[] = [];\n  @property() value = '';\n  @property() label = '';\n  @property() placeholder = 'Select...';\n  @property() name = '';\n  @property({ type: Boolean }) disabled = false;\n  @property({ type: Boolean, reflect: true }) error = false;\n  @property({ type: Boolean, reflect: true }) success = false;\n  @property({ type: Boolean, reflect: true }) loading = false;\n  @property({ type: Boolean }) searchable = false;\n  @property({ type: Boolean }) required = false;\n\n  override updated(changed: PropertyValues) {\n    super.updated(changed);\n    if (changed.has('value')) {\n      this._internals?.setFormValue(this.value);\n    }\n    if (changed.has('required') || changed.has('value')) {\n      if (this.required && !this.value) {\n        this._internals?.setValidity({ valueMissing: true }, 'This field is required');\n      } else {\n        this._internals?.setValidity({});\n      }\n    }\n  }\n\n  formResetCallback() {\n    this.value = this.getAttribute('value') ?? '';\n  }\n\n  formStateRestoreCallback(state: string) {\n    this.value = state;\n  }\n\n  @state() private _open = false;\n  @state() private _search = '';\n  @state() private _highlighted = -1;\n\n  private _toggle() {\n    if (this.disabled || this.loading) return;\n    this._open = !this._open;\n    this._search = '';\n    this._highlighted = -1;\n  }\n\n  private _close() { this._open = false; this._search = ''; }\n\n  private _select(opt: SelectOption) {\n    if (opt.disabled) return;\n    this.value = opt.value;\n    this._close();\n    this.dispatchEvent(new CustomEvent('cg-change', { detail: { value: opt.value, label: opt.label }, bubbles: true, composed: true }));\n  }\n\n  private _filteredOptions() {\n    if (!this._search) return this.options;\n    const q = this._search.toLowerCase();\n    return this.options.filter(o => o.label.toLowerCase().includes(q));\n  }\n\n  private _handleKeydown(e: KeyboardEvent) {\n    const filtered = this._filteredOptions();\n    if (e.key === 'Escape') { this._close(); return; }\n    if (e.key === 'Enter' || e.key === ' ') {\n      if (!this._open) { this._toggle(); e.preventDefault(); return; }\n      if (this._highlighted >= 0 && this._highlighted < filtered.length) {\n        this._select(filtered[this._highlighted]!);\n        e.preventDefault();\n      }\n      return;\n    }\n    if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      if (!this._open) { this._open = true; return; }\n      this._highlighted = Math.min(this._highlighted + 1, filtered.length - 1);\n    }\n    if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      this._highlighted = Math.max(this._highlighted - 1, 0);\n    }\n  }\n\n  private _handleClickOutside = (e: Event) => {\n    if (!e.composedPath().includes(this)) this._close();\n  };\n\n  override connectedCallback() { super.connectedCallback(); document.removeEventListener('click', this._handleClickOutside); document.addEventListener('click', this._handleClickOutside); }\n  override disconnectedCallback() { super.disconnectedCallback(); document.removeEventListener('click', this._handleClickOutside); }\n\n  override render() {\n    const selected = this.options.find(o => o.value === this.value);\n    const filtered = this._filteredOptions();\n\n    return html`\n      ${this.label ? html`<span class=\"label\">${this.label}</span>` : nothing}\n      <div\n        class=\"trigger ${this._open ? 'open' : ''} ${this.disabled ? 'disabled' : ''}\"\n        tabindex=${this.disabled ? '-1' : '0'}\n        role=\"combobox\"\n        aria-expanded=${this._open}\n        aria-haspopup=\"listbox\"\n        aria-required=${this.required ? 'true' : 'false'}\n        aria-busy=${this.loading ? 'true' : 'false'}\n        @click=${this._toggle}\n        @keydown=${this._handleKeydown}\n      >\n        <span class=\"trigger-text ${!selected ? 'placeholder' : ''}\">\n          ${selected ? selected.label : this.placeholder}\n        </span>\n        ${this.loading ? html`<span class=\"loading-spinner\" aria-hidden=\"true\"></span>` : html`\n        <svg class=\"chevron\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n          <path d=\"M6 9l6 6 6-6\"></path>\n        </svg>`}\n      </div>\n\n      <div class=\"dropdown ${this._open ? 'open' : ''}\" ?hidden=${!this._open} role=\"listbox\">\n        ${this.searchable ? html`\n          <div class=\"search\">\n            <input\n              placeholder=\"Search...\"\n              .value=${this._search}\n              @input=${(e: Event) => { this._search = (e.target as HTMLInputElement).value; this._highlighted = 0; }}\n              @click=${(e: Event) => e.stopPropagation()}\n            />\n          </div>\n        ` : nothing}\n        ${filtered.length === 0 ? html`<div class=\"empty-msg\">No options</div>` : nothing}\n        ${filtered.map((opt, i) => html`\n          <div\n            class=\"option ${opt.value === this.value ? 'selected' : ''} ${i === this._highlighted ? 'highlighted' : ''} ${opt.disabled ? 'disabled' : ''}\"\n            role=\"option\"\n            aria-selected=${opt.value === this.value}\n            @click=${(e: Event) => { e.stopPropagation(); this._select(opt); }}\n          >\n            <span>${opt.label}</span>\n            <svg class=\"check\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6L9 17l-5-5\"></path></svg>\n          </div>\n        `)}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap { 'cg-select': CgSelect; }\n}\n"],"names":["CgSelect","LitElement","changed","state","opt","q","o","filtered","selected","html","nothing","e","i","hostBlock","reducedMotion","css","__decorateClass","property","customElement"],"mappings":";;;;;;;;AAiCO,IAAMA,IAAN,cAAuBC,EAAW;AAAA,EAIvC,cAAc;AACZ,UAAA,GAoI2B,KAAA,OAA2B,MAC3B,KAAA,UAAgD,MAClD,KAAA,UAA0B,CAAA,GACzC,KAAA,QAAQ,IACR,KAAA,QAAQ,IACR,KAAA,cAAc,aACd,KAAA,OAAO,IACU,KAAA,WAAW,IACI,KAAA,QAAQ,IACR,KAAA,UAAU,IACV,KAAA,UAAU,IACzB,KAAA,aAAa,IACb,KAAA,WAAW,IAwB/B,KAAQ,QAAQ,IAChB,KAAQ,UAAU,IAClB,KAAQ,eAAe,IA8ChC,KAAQ,sBAAsB,CAAC,MAAa;AAC1C,MAAK,EAAE,aAAA,EAAe,SAAS,IAAI,UAAQ,OAAA;AAAA,IAC7C,GAzNM,OAAO,KAAK,mBAAoB,eAClC,KAAK,aAAa,KAAK,gBAAA;AAAA,EAE3B;AAAA,EA8IS,QAAQC,GAAyB;AACxC,UAAM,QAAQA,CAAO,GACjBA,EAAQ,IAAI,OAAO,KACrB,KAAK,YAAY,aAAa,KAAK,KAAK,IAEtCA,EAAQ,IAAI,UAAU,KAAKA,EAAQ,IAAI,OAAO,OAC5C,KAAK,YAAY,CAAC,KAAK,QACzB,KAAK,YAAY,YAAY,EAAE,cAAc,GAAA,GAAQ,wBAAwB,IAE7E,KAAK,YAAY,YAAY,EAAE;AAAA,EAGrC;AAAA,EAEA,oBAAoB;AAClB,SAAK,QAAQ,KAAK,aAAa,OAAO,KAAK;AAAA,EAC7C;AAAA,EAEA,yBAAyBC,GAAe;AACtC,SAAK,QAAQA;AAAAA,EACf;AAAA,EAMQ,UAAU;AAChB,IAAI,KAAK,YAAY,KAAK,YAC1B,KAAK,QAAQ,CAAC,KAAK,OACnB,KAAK,UAAU,IACf,KAAK,eAAe;AAAA,EACtB;AAAA,EAEQ,SAAS;AAAE,SAAK,QAAQ,IAAO,KAAK,UAAU;AAAA,EAAI;AAAA,EAElD,QAAQC,GAAmB;AACjC,IAAIA,EAAI,aACR,KAAK,QAAQA,EAAI,OACjB,KAAK,OAAA,GACL,KAAK,cAAc,IAAI,YAAY,aAAa,EAAE,QAAQ,EAAE,OAAOA,EAAI,OAAO,OAAOA,EAAI,SAAS,SAAS,IAAM,UAAU,GAAA,CAAM,CAAC;AAAA,EACpI;AAAA,EAEQ,mBAAmB;AACzB,QAAI,CAAC,KAAK,QAAS,QAAO,KAAK;AAC/B,UAAMC,IAAI,KAAK,QAAQ,YAAA;AACvB,WAAO,KAAK,QAAQ,OAAO,CAAAC,MAAKA,EAAE,MAAM,YAAA,EAAc,SAASD,CAAC,CAAC;AAAA,EACnE;AAAA,EAEQ,eAAe,GAAkB;AACvC,UAAME,IAAW,KAAK,iBAAA;AACtB,QAAI,EAAE,QAAQ,UAAU;AAAE,WAAK,OAAA;AAAU;AAAA,IAAQ;AACjD,QAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,UAAI,CAAC,KAAK,OAAO;AAAE,aAAK,QAAA,GAAW,EAAE,eAAA;AAAkB;AAAA,MAAQ;AAC/D,MAAI,KAAK,gBAAgB,KAAK,KAAK,eAAeA,EAAS,WACzD,KAAK,QAAQA,EAAS,KAAK,YAAY,CAAE,GACzC,EAAE,eAAA;AAEJ;AAAA,IACF;AACA,QAAI,EAAE,QAAQ,aAAa;AAEzB,UADA,EAAE,eAAA,GACE,CAAC,KAAK,OAAO;AAAE,aAAK,QAAQ;AAAM;AAAA,MAAQ;AAC9C,WAAK,eAAe,KAAK,IAAI,KAAK,eAAe,GAAGA,EAAS,SAAS,CAAC;AAAA,IACzE;AACA,IAAI,EAAE,QAAQ,cACZ,EAAE,eAAA,GACF,KAAK,eAAe,KAAK,IAAI,KAAK,eAAe,GAAG,CAAC;AAAA,EAEzD;AAAA,EAMS,oBAAoB;AAAE,UAAM,kBAAA,GAAqB,SAAS,oBAAoB,SAAS,KAAK,mBAAmB,GAAG,SAAS,iBAAiB,SAAS,KAAK,mBAAmB;AAAA,EAAG;AAAA,EAChL,uBAAuB;AAAE,UAAM,qBAAA,GAAwB,SAAS,oBAAoB,SAAS,KAAK,mBAAmB;AAAA,EAAG;AAAA,EAExH,SAAS;AAChB,UAAMC,IAAW,KAAK,QAAQ,KAAK,OAAK,EAAE,UAAU,KAAK,KAAK,GACxDD,IAAW,KAAK,iBAAA;AAEtB,WAAOE;AAAA,QACH,KAAK,QAAQA,wBAA2B,KAAK,KAAK,YAAYC,CAAO;AAAA;AAAA,yBAEpD,KAAK,QAAQ,SAAS,EAAE,IAAI,KAAK,WAAW,aAAa,EAAE;AAAA,mBACjE,KAAK,WAAW,OAAO,GAAG;AAAA;AAAA,wBAErB,KAAK,KAAK;AAAA;AAAA,wBAEV,KAAK,WAAW,SAAS,OAAO;AAAA,oBACpC,KAAK,UAAU,SAAS,OAAO;AAAA,iBAClC,KAAK,OAAO;AAAA,mBACV,KAAK,cAAc;AAAA;AAAA,oCAEDF,IAA2B,KAAhB,aAAkB;AAAA,YACtDA,IAAWA,EAAS,QAAQ,KAAK,WAAW;AAAA;AAAA,UAE9C,KAAK,UAAUC,8DAAiEA;AAAA;AAAA;AAAA,eAG3E;AAAA;AAAA;AAAA,6BAGc,KAAK,QAAQ,SAAS,EAAE,aAAa,CAAC,KAAK,KAAK;AAAA,UACnE,KAAK,aAAaA;AAAA;AAAA;AAAA;AAAA,uBAIL,KAAK,OAAO;AAAA,uBACZ,CAACE,MAAa;AAAE,WAAK,UAAWA,EAAE,OAA4B,OAAO,KAAK,eAAe;AAAA,IAAG,CAAC;AAAA,uBAC7F,CAACA,MAAaA,EAAE,gBAAA,CAAiB;AAAA;AAAA;AAAA,YAG5CD,CAAO;AAAA,UACTH,EAAS,WAAW,IAAIE,6CAAgDC,CAAO;AAAA,UAC/EH,EAAS,IAAI,CAACH,GAAKQ,MAAMH;AAAA;AAAA,4BAEPL,EAAI,UAAU,KAAK,QAAQ,aAAa,EAAE,IAAIQ,MAAM,KAAK,eAAe,gBAAgB,EAAE,IAAIR,EAAI,WAAW,aAAa,EAAE;AAAA;AAAA,4BAE5HA,EAAI,UAAU,KAAK,KAAK;AAAA,qBAC/B,CAACO,MAAa;AAAE,MAAAA,EAAE,gBAAA,GAAmB,KAAK,QAAQP,CAAG;AAAA,IAAG,CAAC;AAAA;AAAA,oBAE1DA,EAAI,KAAK;AAAA;AAAA;AAAA,SAGpB,CAAC;AAAA;AAAA;AAAA,EAGR;AACF;AAxRaJ,EACJ,iBAAiB;AADbA,EAWK,SAAS,CAACa,GAAWC,GAAeC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA4HnD;AAE4BC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAzIhBjB,EAyIkB,WAAA,QAAA,CAAA;AACAgB,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA1IhBjB,EA0IkB,WAAA,WAAA,CAAA;AACFgB,EAAA;AAAA,EAA1BC,EAAS,EAAE,MAAM,MAAA,CAAO;AAAA,GA3IdjB,EA2IgB,WAAA,WAAA,CAAA;AACfgB,EAAA;AAAA,EAAXC,EAAA;AAAS,GA5ICjB,EA4IC,WAAA,SAAA,CAAA;AACAgB,EAAA;AAAA,EAAXC,EAAA;AAAS,GA7ICjB,EA6IC,WAAA,SAAA,CAAA;AACAgB,EAAA;AAAA,EAAXC,EAAA;AAAS,GA9ICjB,EA8IC,WAAA,eAAA,CAAA;AACAgB,EAAA;AAAA,EAAXC,EAAA;AAAS,GA/ICjB,EA+IC,WAAA,QAAA,CAAA;AACiBgB,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GAhJhBjB,EAgJkB,WAAA,YAAA,CAAA;AACegB,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAjJ/BjB,EAiJiC,WAAA,SAAA,CAAA;AACAgB,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAlJ/BjB,EAkJiC,WAAA,WAAA,CAAA;AACAgB,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAnJ/BjB,EAmJiC,WAAA,WAAA,CAAA;AACfgB,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GApJhBjB,EAoJkB,WAAA,cAAA,CAAA;AACAgB,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GArJhBjB,EAqJkB,WAAA,YAAA,CAAA;AAwBZgB,EAAA;AAAA,EAAhBb,EAAA;AAAM,GA7KIH,EA6KM,WAAA,SAAA,CAAA;AACAgB,EAAA;AAAA,EAAhBb,EAAA;AAAM,GA9KIH,EA8KM,WAAA,WAAA,CAAA;AACAgB,EAAA;AAAA,EAAhBb,EAAA;AAAM,GA/KIH,EA+KM,WAAA,gBAAA,CAAA;AA/KNA,IAANgB,EAAA;AAAA,EADNE,EAAc,WAAW;AAAA,GACblB,CAAA;"}
+{"version":3,"file":"cg-select.js","sources":["../../../src/components/cg-select/cg-select.ts"],"sourcesContent":["import { LitElement, html, css, nothing, type PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\nimport { bindOutsideClick } from '../../utils/outside-click.js';\n\n/**\n * @element cg-select\n * Dropdown select with optional search filtering and keyboard navigation.\n *\n * @example\n * ```html\n * <cg-select\n *   placeholder=\"Choose a fruit\"\n *   .options=${[{value:'apple',label:'Apple'},{value:'banana',label:'Banana'}]}\n * ></cg-select>\n * <cg-select searchable error .options=${items}></cg-select>\n * ```\n *\n * @fires {CustomEvent<{value: string, label: string}>} cg-change - When a selection is made\n *\n * @cssprop [--cg-color-input-background-default=#18181b] - Trigger background\n * @cssprop [--cg-color-surface-container-background=#18181b] - Dropdown panel background\n * @cssprop [--cg-color-focus-ring] - Focus/hover border accent\n * @cssprop [--cg-component-select-radius] - Border radius for trigger and dropdown (default rounded=\"md\")\n */\n\n/** Option entry for cg-select, with value, display label, and optional disabled state. */\nexport interface SelectOption {\n  value: string;\n  label: string;\n  disabled?: boolean;\n}\n\n@customElement('cg-select')\nexport class CgSelect extends LitElement {\n  static formAssociated = true;\n  private _internals: ElementInternals | undefined;\n\n  constructor() {\n    super();\n    if (typeof this.attachInternals === 'function') {\n      this._internals = this.attachInternals();\n    }\n  }\n\n  static override styles = [hostBlock, reducedMotion, css`\n    :host { position: relative; display: block; }\n\n    .trigger {\n      display: flex; align-items: center; justify-content: space-between;\n      width: 100%; box-sizing: border-box;\n      padding: 0 var(--cg-spacing-12); gap: var(--cg-spacing-8);\n      border: var(--cg-border-width-50) solid var(--cg-color-input-border-default);\n      border-radius: var(--cg-component-select-radius);\n      background: var(--cg-color-input-background-default);\n      font: inherit; font-size: var(--cg-font-size-sm);\n      color: var(--cg-color-input-text-default);\n      cursor: pointer; height: var(--cg-component-select-height-md);\n      transition: border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default), box-shadow var(--cg-transition-duration-fast) var(--cg-transition-easing-default), transform var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n      outline: none;\n    }\n    .trigger:hover:not(.disabled) { border-color: var(--cg-color-input-border-hover); }\n    .trigger:active:not(.disabled) {\n      transform: scale(var(--cg-interaction-press-scale));\n    }\n    .trigger:focus-visible { outline: none; border-color: var(--cg-color-input-border-focus); box-shadow: 0 0 0 3px var(--cg-overlay-accent-strong); }\n\n    /* Loading */\n    :host([loading]) .trigger { pointer-events: none; opacity: 0.7; }\n    .loading-spinner {\n      width: var(--cg-spacing-16);\n      height: var(--cg-spacing-16);\n      border: var(--cg-border-width-100) solid var(--cg-color-loading-spinner-secondary);\n      border-top-color: var(--cg-color-loading-spinner-primary);\n      border-radius: var(--cg-border-radius-full);\n      animation: cg-select-spin var(--cg-transition-duration-slow) linear infinite;\n      flex-shrink: 0;\n    }\n    @keyframes cg-select-spin {\n      to { transform: rotate(360deg); }\n    }\n    .trigger.open { border-color: var(--cg-color-input-border-focus); box-shadow: 0 0 0 3px var(--cg-overlay-accent-strong); }\n    .trigger.disabled { opacity: 0.5; pointer-events: none; background: var(--cg-color-input-background-disabled); border-color: var(--cg-color-input-border-disabled); }\n    :host([error]) .trigger { border-color: var(--cg-color-input-border-error); }\n    :host([error]) .trigger:focus-visible,\n    :host([error]) .trigger.open {\n      border-color: var(--cg-color-status-error-text-default);\n      box-shadow: 0 0 0 3px var(--cg-shadow-focus-error);\n    }\n    :host([success]) .trigger { border-color: var(--cg-color-status-success-border-default); }\n    :host([success]) .trigger:focus-visible,\n    :host([success]) .trigger.open {\n      border-color: var(--cg-color-status-success-text-default);\n      box-shadow: 0 0 0 3px var(--cg-shadow-focus-success);\n    }\n\n    .trigger-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n    .placeholder { color: var(--cg-color-input-text-placeholder); }\n    .chevron { width: var(--cg-icon-size-100); height: var(--cg-icon-size-100); flex-shrink: 0; transition: transform var(--cg-transition-duration-default) var(--cg-transition-easing-default); color: var(--cg-color-input-text-placeholder); }\n    .trigger.open .chevron { transform: rotate(180deg); }\n\n    .dropdown {\n      position: absolute; top: 100%; left: 0; right: 0; z-index: var(--cg-z-index-200);\n      margin-top: var(--cg-spacing-4); padding: var(--cg-spacing-6);\n      background: var(--cg-color-modal-container-background);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-component-card-radius);\n      max-height: var(--cg-component-combobox-listbox-max-height); overflow-y: auto;\n    }\n    .dropdown.open {\n      animation: cg-select-dropdown-in var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    @keyframes cg-select-dropdown-in {\n      from { opacity: 0; transform: scale(0.96) translateY(calc(var(--cg-spacing-4) * -1)); }\n      to { opacity: 1; transform: scale(1) translateY(0); }\n    }\n    .dropdown[hidden] { display: none; }\n\n    .option {\n      padding: var(--cg-spacing-8) var(--cg-spacing-12); border-radius: var(--cg-border-radius-100); cursor: pointer;\n      font-size: var(--cg-font-size-sm);\n      color: var(--cg-color-surface-base-text);\n      transition: background var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n      display: flex; align-items: center; gap: var(--cg-spacing-8);\n    }\n    .option:hover { background: var(--cg-color-action-tertiary-background-hover); }\n    .option.highlighted { background: var(--cg-color-action-secondary-background-hover); }\n    .option.selected { color: var(--cg-color-accent-text); font-weight: var(--cg-font-weight-medium); }\n    .option.disabled { opacity: 0.5; pointer-events: none; }\n    .option .check {\n      width: var(--cg-icon-size-100); height: var(--cg-icon-size-100); flex-shrink: 0;\n      margin-left: auto; opacity: 0;\n      color: var(--cg-color-accent-text);\n      transition: opacity var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .option.selected .check { opacity: 1; }\n\n    .search { padding: 0; margin-bottom: var(--cg-spacing-4); }\n    .search input {\n      width: 100%; box-sizing: border-box;\n      padding: var(--cg-spacing-8) var(--cg-spacing-12);\n      border: var(--cg-border-width-50) solid var(--cg-color-input-border-default);\n      border-radius: var(--cg-border-radius-100);\n      font: inherit; font-size: var(--cg-font-size-sm); outline: none;\n      background: transparent; color: var(--cg-color-input-text-default);\n    }\n    .search input::placeholder { color: var(--cg-color-input-text-placeholder); }\n    .search input:focus { border-color: var(--cg-color-input-border-focus); }\n\n    .empty-msg { padding: var(--cg-spacing-12); text-align: center; color: var(--cg-color-input-text-placeholder); font-size: var(--cg-font-size-sm); }\n\n    .label { display: block; font-size: var(--cg-font-size-xs); font-weight: var(--cg-font-weight-medium); color: var(--cg-color-surface-container-text); margin-bottom: var(--cg-spacing-4); }\n\n    /* Size variants */\n    :host([size=\"sm\"]) .trigger { height: var(--cg-component-input-height-sm); font-size: var(--cg-font-size-xs); padding: 0 var(--cg-spacing-8); border-radius: var(--cg-border-radius-100); }\n    :host([size=\"sm\"]) .option { font-size: var(--cg-font-size-xs); }\n\n    :host([size=\"lg\"]) .trigger { height: var(--cg-component-input-height-lg); font-size: var(--cg-font-size-base); padding: 0 var(--cg-spacing-16); border-radius: var(--cg-border-radius-150); }\n    :host([size=\"lg\"]) .option { font-size: var(--cg-font-size-base); }\n\n    /* ── Rounded overrides ── */\n    :host([rounded=\"none\"]) .trigger { border-radius: 0; }\n    :host([rounded=\"none\"]) .dropdown { border-radius: 0; }\n    :host([rounded=\"sm\"]) .trigger { border-radius: var(--cg-border-radius-50); }\n    :host([rounded=\"sm\"]) .dropdown { border-radius: var(--cg-border-radius-50); }\n    :host([rounded=\"md\"]) .trigger { border-radius: var(--cg-component-select-radius); }\n    :host([rounded=\"md\"]) .dropdown { border-radius: var(--cg-component-select-radius); }\n    :host([rounded=\"lg\"]) .trigger { border-radius: var(--cg-border-radius-150); }\n    :host([rounded=\"lg\"]) .dropdown { border-radius: var(--cg-border-radius-150); }\n    :host([rounded=\"full\"]) .trigger { border-radius: var(--cg-border-radius-full); }\n    :host([rounded=\"full\"]) .dropdown { border-radius: var(--cg-border-radius-150); }\n  `];\n\n  @property({ reflect: true }) size: 'sm' | 'md' | 'lg' = 'md';\n  @property({ reflect: true }) rounded: 'none' | 'sm' | 'md' | 'lg' | 'full' = 'md';\n  @property({ type: Array }) options: SelectOption[] = [];\n  @property() value = '';\n  @property() label = '';\n  @property() placeholder = 'Select...';\n  @property() name = '';\n  @property({ type: Boolean }) disabled = false;\n  @property({ type: Boolean, reflect: true }) error = false;\n  @property({ type: Boolean, reflect: true }) success = false;\n  @property({ type: Boolean, reflect: true }) loading = false;\n  @property({ type: Boolean }) searchable = false;\n  @property({ type: Boolean }) required = false;\n\n  override updated(changed: PropertyValues) {\n    super.updated(changed);\n    if (changed.has('value')) {\n      this._internals?.setFormValue(this.value);\n    }\n    if (changed.has('required') || changed.has('value')) {\n      if (this.required && !this.value) {\n        this._internals?.setValidity({ valueMissing: true }, 'This field is required');\n      } else {\n        this._internals?.setValidity({});\n      }\n    }\n  }\n\n  formResetCallback() {\n    this.value = this.getAttribute('value') ?? '';\n  }\n\n  formStateRestoreCallback(state: string) {\n    this.value = state;\n  }\n\n  @state() private _open = false;\n  @state() private _search = '';\n  @state() private _highlighted = -1;\n\n  private _openPanel() {\n    this._open = true;\n    this._search = '';\n    this._highlighted = this.options.findIndex(o => o.value === this.value);\n  }\n\n  private _toggle() {\n    if (this.disabled || this.loading) return;\n    if (this._open) {\n      this._close();\n      return;\n    }\n    this._openPanel();\n    if (this.searchable) {\n      this.updateComplete.then(() => this.shadowRoot?.querySelector<HTMLInputElement>('.search input')?.focus());\n    }\n  }\n\n  private _close() { this._open = false; this._search = ''; }\n\n  private _select(opt: SelectOption) {\n    if (opt.disabled) return;\n    this.value = opt.value;\n    this._close();\n    this.dispatchEvent(new CustomEvent('cg-change', { detail: { value: opt.value, label: opt.label }, bubbles: true, composed: true }));\n  }\n\n  private _filteredOptions() {\n    if (!this._search) return this.options;\n    const q = this._search.toLowerCase();\n    return this.options.filter(o => o.label.toLowerCase().includes(q));\n  }\n\n  private _scrollHighlightedIntoView() {\n    this.updateComplete.then(() =>\n      this.shadowRoot?.querySelector('.option.highlighted')?.scrollIntoView({ block: 'nearest' })\n    );\n  }\n\n  private _handleKeydown(e: KeyboardEvent) {\n    if (e.key === ' ' && e.target instanceof HTMLInputElement) return;\n    const filtered = this._filteredOptions();\n    if (e.key === 'Escape') { this._close(); return; }\n    if (e.key === 'Enter' || e.key === ' ') {\n      if (!this._open) { this._toggle(); e.preventDefault(); return; }\n      e.preventDefault();\n      if (this._highlighted >= 0 && this._highlighted < filtered.length) {\n        this._select(filtered[this._highlighted]!);\n      }\n      return;\n    }\n    if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      if (!this._open) { this._openPanel(); return; }\n      this._highlighted = Math.min(this._highlighted + 1, filtered.length - 1);\n      this._scrollHighlightedIntoView();\n      return;\n    }\n    if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      if (!this._open) { this._openPanel(); return; }\n      this._highlighted = Math.max(this._highlighted - 1, 0);\n      this._scrollHighlightedIntoView();\n      return;\n    }\n    if (e.key === 'Home' && this._open) {\n      e.preventDefault();\n      this._highlighted = 0;\n      this._scrollHighlightedIntoView();\n      return;\n    }\n    if (e.key === 'End' && this._open) {\n      e.preventDefault();\n      this._highlighted = filtered.length - 1;\n      this._scrollHighlightedIntoView();\n    }\n  }\n\n  private _disposeOutsideClick: (() => void) | null = null;\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this._disposeOutsideClick?.();\n    this._disposeOutsideClick = bindOutsideClick(this, () => this._close());\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this._disposeOutsideClick?.();\n    this._disposeOutsideClick = null;\n  }\n\n  override render() {\n    const selected = this.options.find(o => o.value === this.value);\n    const filtered = this._filteredOptions();\n\n    return html`\n      ${this.label ? html`<span class=\"label\" id=\"select-label\">${this.label}</span>` : nothing}\n      <div\n        class=\"trigger ${this._open ? 'open' : ''} ${this.disabled ? 'disabled' : ''}\"\n        tabindex=${this.disabled ? '-1' : '0'}\n        role=\"combobox\"\n        aria-expanded=${this._open}\n        aria-haspopup=\"listbox\"\n        aria-controls=\"select-listbox\"\n        aria-labelledby=${this.label ? 'select-label' : nothing}\n        aria-label=${this.label ? nothing : this.placeholder}\n        aria-activedescendant=${this._open && this._highlighted >= 0 && this._highlighted < filtered.length ? `select-option-${this._highlighted}` : nothing}\n        aria-required=${this.required ? 'true' : 'false'}\n        aria-invalid=${this.error ? 'true' : 'false'}\n        aria-busy=${this.loading ? 'true' : 'false'}\n        @click=${this._toggle}\n        @keydown=${this._handleKeydown}\n      >\n        <span class=\"trigger-text ${!selected ? 'placeholder' : ''}\">\n          ${selected ? selected.label : this.placeholder}\n        </span>\n        ${this.loading ? html`<span class=\"loading-spinner\" aria-hidden=\"true\"></span>` : html`\n        <svg class=\"chevron\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n          <path d=\"M6 9l6 6 6-6\"></path>\n        </svg>`}\n      </div>\n\n      <div class=\"dropdown ${this._open ? 'open' : ''}\" ?hidden=${!this._open} role=\"listbox\" id=\"select-listbox\">\n        ${this.searchable ? html`\n          <div class=\"search\">\n            <input\n              placeholder=\"Search...\"\n              aria-label=\"Search options\"\n              .value=${this._search}\n              @input=${(e: Event) => { this._search = (e.target as HTMLInputElement).value; this._highlighted = 0; }}\n              @keydown=${this._handleKeydown}\n              @click=${(e: Event) => e.stopPropagation()}\n            />\n          </div>\n        ` : nothing}\n        ${filtered.length === 0 ? html`<div class=\"empty-msg\">No options</div>` : nothing}\n        ${filtered.map((opt, i) => html`\n          <div\n            class=\"option ${opt.value === this.value ? 'selected' : ''} ${i === this._highlighted ? 'highlighted' : ''} ${opt.disabled ? 'disabled' : ''}\"\n            role=\"option\"\n            id=\"select-option-${i}\"\n            aria-selected=${opt.value === this.value}\n            aria-disabled=${opt.disabled ? 'true' : 'false'}\n            @click=${(e: Event) => { e.stopPropagation(); this._select(opt); }}\n          >\n            <span>${opt.label}</span>\n            <svg class=\"check\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6L9 17l-5-5\"></path></svg>\n          </div>\n        `)}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap { 'cg-select': CgSelect; }\n}\n"],"names":["CgSelect","LitElement","changed","state","o","opt","q","filtered","bindOutsideClick","selected","html","nothing","e","i","hostBlock","reducedMotion","css","__decorateClass","property","customElement"],"mappings":"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"}

package/dist/components/cg-separator/cg-separator.d.ts

@@ -3,7 +3,7 @@ import { LitElement } from 'lit';
  * <cg-separator> — Visual divider, horizontal or vertical.
  *
  * Features beyond OpenUI's Separator:
- * - Label slot (text in the middle of the line)
+ * - Label attribute (text in the middle of the line)
  * - Vertical orientation
  * - Semantic spacing variants
  */
@@ -14,7 +14,6 @@ export declare class CgSeparator extends LitElement {
     spacing: 'none' | 'sm' | 'md' | 'lg';
     label: string;
     render(): import('lit').TemplateResult<1>;
-    connectedCallback(): void;
     updated(changed: Map<string, unknown>): void;
 }
 declare global {

package/dist/components/cg-separator/cg-separator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cg-separator.d.ts","sourceRoot":"","sources":["../../../src/components/cg-separator/cg-separator.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAI5C;;;;;;;GAOG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,OAAgB,MAAM,4BA2DnB;IAE0B,OAAO,EAAE,OAAO,GAAG,UAAU,CAAW;IACxC,WAAW,EAAE,YAAY,GAAG,UAAU,CAAgB;IACtD,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAU;IAC/D,KAAK,SAAM;IAEd,MAAM;IAWN,iBAAiB;IAQjB,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;CAW/C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}
+{"version":3,"file":"cg-separator.d.ts","sourceRoot":"","sources":["../../../src/components/cg-separator/cg-separator.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAI5C;;;;;;;GAOG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,OAAgB,MAAM,4BA2DnB;IAE0B,OAAO,EAAE,OAAO,GAAG,UAAU,CAAW;IACxC,WAAW,EAAE,YAAY,GAAG,UAAU,CAAgB;IACtD,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAU;IAC/D,KAAK,SAAM;IAEd,MAAM;IAWN,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;CAa/C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}

package/dist/components/cg-separator/cg-separator.js

@@ -1,6 +1,6 @@
 import { css as p, LitElement as h, html as g } from "lit";
-import { property as o, customElement as d } from "lit/decorators.js";
-import { h as v, r as u } from "../../chunks/premium.css-9I4kHrsl.js";
+import { property as o, customElement as v } from "lit/decorators.js";
+import { h as d, r as u } from "../../chunks/premium.css-DHekUEUt.js";
 var m = Object.defineProperty, f = Object.getOwnPropertyDescriptor, i = (e, a, s, n) => {
   for (var t = n > 1 ? void 0 : n ? f(a, s) : a, c = e.length - 1, l; c >= 0; c--)
     (l = e[c]) && (t = (n ? l(a, s, t) : l(t)) || t);
@@ -17,14 +17,11 @@ let r = class extends h {
         <div class="line" role="presentation" aria-hidden="true"></div>
       ` : g`<div class="line" role="separator" aria-orientation="${this.orientation}"></div>`;
   }
-  connectedCallback() {
-    super.connectedCallback(), this.label && (this.setAttribute("role", "separator"), this.setAttribute("aria-orientation", this.orientation));
-  }
   updated(e) {
-    (e.has("label") || e.has("orientation")) && (this.label ? (this.setAttribute("role", "separator"), this.setAttribute("aria-orientation", this.orientation)) : (this.removeAttribute("role"), this.removeAttribute("aria-orientation")));
+    (e.has("label") || e.has("orientation")) && (this.label ? (this.setAttribute("role", "separator"), this.setAttribute("aria-orientation", this.orientation)) : this.getAttribute("role") === "separator" && (this.removeAttribute("role"), this.removeAttribute("aria-orientation")));
   }
 };
-r.styles = [v, u, p`
+r.styles = [d, u, p`
     :host {
       display: flex;
       align-items: center;
@@ -97,7 +94,7 @@ i([
   o()
 ], r.prototype, "label", 2);
 r = i([
-  d("cg-separator")
+  v("cg-separator")
 ], r);
 export {
   r as CgSeparator

package/dist/components/cg-separator/cg-separator.js.map

@@ -1 +1 @@
-{"version":3,"file":"cg-separator.js","sources":["../../../src/components/cg-separator/cg-separator.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/**\n * <cg-separator> — Visual divider, horizontal or vertical.\n *\n * Features beyond OpenUI's Separator:\n * - Label slot (text in the middle of the line)\n * - Vertical orientation\n * - Semantic spacing variants\n */\n@customElement('cg-separator')\nexport class CgSeparator extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host {\n      display: flex;\n      align-items: center;\n      gap: var(--cg-spacing-12);\n    }\n\n    :host([orientation=\"horizontal\"]) {\n      flex-direction: row;\n      width: 100%;\n    }\n\n    :host([orientation=\"vertical\"]) {\n      flex-direction: column;\n      height: 100%;\n      width: auto;\n    }\n\n    .line {\n      flex: 1;\n      background: var(--cg-color-surface-base-divider);\n    }\n\n    /* Gradient variant — fades at edges */\n    :host([variant=\"gradient\"]) .line {\n      background: linear-gradient(to right, transparent, var(--cg-color-surface-base-divider) 20%, var(--cg-color-surface-base-divider) 80%, transparent);\n    }\n\n    :host([orientation=\"horizontal\"]) .line {\n      height: var(--cg-border-width-50);\n      min-width: var(--cg-spacing-16);\n    }\n\n    :host([orientation=\"vertical\"]) .line {\n      width: var(--cg-border-width-50);\n      min-height: var(--cg-spacing-16);\n    }\n    :host([variant=\"gradient\"][orientation=\"vertical\"]) .line {\n      background: linear-gradient(to bottom, transparent, var(--cg-color-surface-base-divider) 20%, var(--cg-color-surface-base-divider) 80%, transparent);\n    }\n\n    /* Spacing variants */\n    :host([spacing=\"none\"]) { margin: 0; }\n    :host([spacing=\"sm\"]) { margin: var(--cg-spacing-8) 0; }\n    :host([spacing=\"md\"]) { margin: var(--cg-spacing-16) 0; }\n    :host([spacing=\"lg\"]) { margin: var(--cg-spacing-24) 0; }\n\n    :host([orientation=\"vertical\"][spacing=\"sm\"]) { margin: 0 var(--cg-spacing-8); }\n    :host([orientation=\"vertical\"][spacing=\"md\"]) { margin: 0 var(--cg-spacing-16); }\n    :host([orientation=\"vertical\"][spacing=\"lg\"]) { margin: 0 var(--cg-spacing-24); }\n\n    .label {\n      font-size: var(--cg-font-size-xs);\n      font-weight: var(--cg-font-weight-medium);\n      color: var(--cg-color-surface-container-outlined);\n      white-space: nowrap;\n      text-transform: uppercase;\n      letter-spacing: var(--cg-letter-spacing-wide);\n    }\n  `];\n\n  @property({ reflect: true }) variant: 'solid' | 'gradient' = 'solid';\n  @property({ reflect: true }) orientation: 'horizontal' | 'vertical' = 'horizontal';\n  @property({ reflect: true }) spacing: 'none' | 'sm' | 'md' | 'lg' = 'none';\n  @property() label = '';\n\n  override render() {\n    if (this.label) {\n      return html`\n        <div class=\"line\" role=\"presentation\" aria-hidden=\"true\"></div>\n        <span class=\"label\">${this.label}</span>\n        <div class=\"line\" role=\"presentation\" aria-hidden=\"true\"></div>\n      `;\n    }\n    return html`<div class=\"line\" role=\"separator\" aria-orientation=\"${this.orientation}\"></div>`;\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    if (this.label) {\n      this.setAttribute('role', 'separator');\n      this.setAttribute('aria-orientation', this.orientation);\n    }\n  }\n\n  override updated(changed: Map<string, unknown>) {\n    if (changed.has('label') || changed.has('orientation')) {\n      if (this.label) {\n        this.setAttribute('role', 'separator');\n        this.setAttribute('aria-orientation', this.orientation);\n      } else {\n        this.removeAttribute('role');\n        this.removeAttribute('aria-orientation');\n      }\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-separator': CgSeparator;\n  }\n}\n"],"names":["CgSeparator","LitElement","html","changed","hostBlock","reducedMotion","css","__decorateClass","property","customElement"],"mappings":";;;;;;;;AAaO,IAAMA,IAAN,cAA0BC,EAAW;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GA8DwB,KAAA,UAAgC,SAChC,KAAA,cAAyC,cACzC,KAAA,UAAuC,QACxD,KAAA,QAAQ;AAAA,EAAA;AAAA,EAEX,SAAS;AAChB,WAAI,KAAK,QACAC;AAAA;AAAA,8BAEiB,KAAK,KAAK;AAAA;AAAA,UAI7BA,yDAA4D,KAAK,WAAW;AAAA,EACrF;AAAA,EAES,oBAAoB;AAC3B,UAAM,kBAAA,GACF,KAAK,UACP,KAAK,aAAa,QAAQ,WAAW,GACrC,KAAK,aAAa,oBAAoB,KAAK,WAAW;AAAA,EAE1D;AAAA,EAES,QAAQC,GAA+B;AAC9C,KAAIA,EAAQ,IAAI,OAAO,KAAKA,EAAQ,IAAI,aAAa,OAC/C,KAAK,SACP,KAAK,aAAa,QAAQ,WAAW,GACrC,KAAK,aAAa,oBAAoB,KAAK,WAAW,MAEtD,KAAK,gBAAgB,MAAM,GAC3B,KAAK,gBAAgB,kBAAkB;AAAA,EAG7C;AACF;AAjGaH,EACK,SAAS,CAACI,GAAWC,GAAeC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA2DnD;AAE4BC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA9DhBR,EA8DkB,WAAA,WAAA,CAAA;AACAO,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA/DhBR,EA+DkB,WAAA,eAAA,CAAA;AACAO,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAhEhBR,EAgEkB,WAAA,WAAA,CAAA;AACjBO,EAAA;AAAA,EAAXC,EAAA;AAAS,GAjECR,EAiEC,WAAA,SAAA,CAAA;AAjEDA,IAANO,EAAA;AAAA,EADNE,EAAc,cAAc;AAAA,GAChBT,CAAA;"}
+{"version":3,"file":"cg-separator.js","sources":["../../../src/components/cg-separator/cg-separator.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/**\n * <cg-separator> — Visual divider, horizontal or vertical.\n *\n * Features beyond OpenUI's Separator:\n * - Label attribute (text in the middle of the line)\n * - Vertical orientation\n * - Semantic spacing variants\n */\n@customElement('cg-separator')\nexport class CgSeparator extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host {\n      display: flex;\n      align-items: center;\n      gap: var(--cg-spacing-12);\n    }\n\n    :host([orientation=\"horizontal\"]) {\n      flex-direction: row;\n      width: 100%;\n    }\n\n    :host([orientation=\"vertical\"]) {\n      flex-direction: column;\n      height: 100%;\n      width: auto;\n    }\n\n    .line {\n      flex: 1;\n      background: var(--cg-color-surface-base-divider);\n    }\n\n    /* Gradient variant — fades at edges */\n    :host([variant=\"gradient\"]) .line {\n      background: linear-gradient(to right, transparent, var(--cg-color-surface-base-divider) 20%, var(--cg-color-surface-base-divider) 80%, transparent);\n    }\n\n    :host([orientation=\"horizontal\"]) .line {\n      height: var(--cg-border-width-50);\n      min-width: var(--cg-spacing-16);\n    }\n\n    :host([orientation=\"vertical\"]) .line {\n      width: var(--cg-border-width-50);\n      min-height: var(--cg-spacing-16);\n    }\n    :host([variant=\"gradient\"][orientation=\"vertical\"]) .line {\n      background: linear-gradient(to bottom, transparent, var(--cg-color-surface-base-divider) 20%, var(--cg-color-surface-base-divider) 80%, transparent);\n    }\n\n    /* Spacing variants */\n    :host([spacing=\"none\"]) { margin: 0; }\n    :host([spacing=\"sm\"]) { margin: var(--cg-spacing-8) 0; }\n    :host([spacing=\"md\"]) { margin: var(--cg-spacing-16) 0; }\n    :host([spacing=\"lg\"]) { margin: var(--cg-spacing-24) 0; }\n\n    :host([orientation=\"vertical\"][spacing=\"sm\"]) { margin: 0 var(--cg-spacing-8); }\n    :host([orientation=\"vertical\"][spacing=\"md\"]) { margin: 0 var(--cg-spacing-16); }\n    :host([orientation=\"vertical\"][spacing=\"lg\"]) { margin: 0 var(--cg-spacing-24); }\n\n    .label {\n      font-size: var(--cg-font-size-xs);\n      font-weight: var(--cg-font-weight-medium);\n      color: var(--cg-color-surface-container-outlined);\n      white-space: nowrap;\n      text-transform: uppercase;\n      letter-spacing: var(--cg-letter-spacing-wide);\n    }\n  `];\n\n  @property({ reflect: true }) variant: 'solid' | 'gradient' = 'solid';\n  @property({ reflect: true }) orientation: 'horizontal' | 'vertical' = 'horizontal';\n  @property({ reflect: true }) spacing: 'none' | 'sm' | 'md' | 'lg' = 'none';\n  @property() label = '';\n\n  override render() {\n    if (this.label) {\n      return html`\n        <div class=\"line\" role=\"presentation\" aria-hidden=\"true\"></div>\n        <span class=\"label\">${this.label}</span>\n        <div class=\"line\" role=\"presentation\" aria-hidden=\"true\"></div>\n      `;\n    }\n    return html`<div class=\"line\" role=\"separator\" aria-orientation=\"${this.orientation}\"></div>`;\n  }\n\n  override updated(changed: Map<string, unknown>) {\n    if (changed.has('label') || changed.has('orientation')) {\n      if (this.label) {\n        this.setAttribute('role', 'separator');\n        this.setAttribute('aria-orientation', this.orientation);\n      } else if (this.getAttribute('role') === 'separator') {\n        // Only remove what this component set — never clobber a\n        // consumer-supplied role on the host.\n        this.removeAttribute('role');\n        this.removeAttribute('aria-orientation');\n      }\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-separator': CgSeparator;\n  }\n}\n"],"names":["CgSeparator","LitElement","html","changed","hostBlock","reducedMotion","css","__decorateClass","property","customElement"],"mappings":";;;;;;;;AAaO,IAAMA,IAAN,cAA0BC,EAAW;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GA8DwB,KAAA,UAAgC,SAChC,KAAA,cAAyC,cACzC,KAAA,UAAuC,QACxD,KAAA,QAAQ;AAAA,EAAA;AAAA,EAEX,SAAS;AAChB,WAAI,KAAK,QACAC;AAAA;AAAA,8BAEiB,KAAK,KAAK;AAAA;AAAA,UAI7BA,yDAA4D,KAAK,WAAW;AAAA,EACrF;AAAA,EAES,QAAQC,GAA+B;AAC9C,KAAIA,EAAQ,IAAI,OAAO,KAAKA,EAAQ,IAAI,aAAa,OAC/C,KAAK,SACP,KAAK,aAAa,QAAQ,WAAW,GACrC,KAAK,aAAa,oBAAoB,KAAK,WAAW,KAC7C,KAAK,aAAa,MAAM,MAAM,gBAGvC,KAAK,gBAAgB,MAAM,GAC3B,KAAK,gBAAgB,kBAAkB;AAAA,EAG7C;AACF;AA3FaH,EACK,SAAS,CAACI,GAAWC,GAAeC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA2DnD;AAE4BC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA9DhBR,EA8DkB,WAAA,WAAA,CAAA;AACAO,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA/DhBR,EA+DkB,WAAA,eAAA,CAAA;AACAO,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAhEhBR,EAgEkB,WAAA,WAAA,CAAA;AACjBO,EAAA;AAAA,EAAXC,EAAA;AAAS,GAjECR,EAiEC,WAAA,SAAA,CAAA;AAjEDA,IAANO,EAAA;AAAA,EADNE,EAAc,cAAc;AAAA,GAChBT,CAAA;"}

package/dist/components/cg-sheet/cg-sheet.d.ts

@@ -23,12 +23,16 @@ export declare class CgSheet extends LitElement {
     private _dragging;
     disconnectedCallback(): void;
     updated(changed: Map<string, unknown>): void;
+    private _previousOverflow;
     private _onOpen;
     private _onClose;
     private _handleBackdrop;
     private _onDragStart;
     private _onDragMove;
     private _onDragEnd;
+    private _emitSnap;
+    /** SHEET-5: keyboard path for snap resizing (slider pattern on the handle). */
+    private _onHandleKeydown;
     render(): import('lit').TemplateResult<1>;
 }
 declare global {

package/dist/components/cg-sheet/cg-sheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cg-sheet.d.ts","sourceRoot":"","sources":["../../../src/components/cg-sheet/cg-sheet.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAKrD;;;;;;;;;GASG;AACH,qBACa,OAAQ,SAAQ,UAAU;IACrC,OAAgB,MAAM,4BA+FnB;IAEyC,IAAI,UAAS;IAC7C,KAAK,SAAW;IACC,IAAI,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,GAAG,KAAK,CAAY;IACvD,UAAU,EAAE,MAAM,EAAE,CAAM;IACzB,UAAU,SAAK;IACd,WAAW,UAAQ;IAEvC,OAAO,CAAC,WAAW,CAAK;IAEjC,OAAO,CAAC,UAAU,CAAmB;IACrC,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,SAAS,CAAS;IAEjB,oBAAoB,IAAI,IAAI;IAK5B,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAOrD,OAAO,CAAC,OAAO;IAYf,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,WAAW;IAQnB,OAAO,CAAC,UAAU;IAcT,MAAM;CA0ChB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
+{"version":3,"file":"cg-sheet.d.ts","sourceRoot":"","sources":["../../../src/components/cg-sheet/cg-sheet.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAKrD;;;;;;;;;GASG;AACH,qBACa,OAAQ,SAAQ,UAAU;IACrC,OAAgB,MAAM,4BAqGnB;IAEyC,IAAI,UAAS;IAC7C,KAAK,SAAW;IACC,IAAI,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,GAAG,KAAK,CAAY;IACvD,UAAU,EAAE,MAAM,EAAE,CAAM;IACzB,UAAU,SAAK;IACd,WAAW,UAAQ;IAEvC,OAAO,CAAC,WAAW,CAAK;IAEjC,OAAO,CAAC,UAAU,CAAmB;IACrC,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,SAAS,CAAS;IAEjB,oBAAoB,IAAI,IAAI;IAO5B,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAUrD,OAAO,CAAC,iBAAiB,CAAM;IAE/B,OAAO,CAAC,OAAO;IAcf,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,WAAW;IAUnB,OAAO,CAAC,UAAU;IAwBlB,OAAO,CAAC,SAAS;IAOjB,+EAA+E;IAC/E,OAAO,CAAC,gBAAgB;IAaf,MAAM;CAkDhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}