@cognivo/components 0.8.0 → 0.8.2

package/dist/chunks/focus-trap-BdRNhSPD.js

@@ -1,53 +0,0 @@
-const a = 'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]), audio[controls], video[controls], summary, details, iframe, object, embed';
-function c(i) {
-  const t = i instanceof HTMLElement && i.shadowRoot ? [...i.shadowRoot.querySelectorAll(a)] : i instanceof ShadowRoot ? [...i.querySelectorAll(a)] : [], e = i instanceof HTMLElement ? [...i.querySelectorAll(a)] : [];
-  return [...t, ...e].filter((s) => !(s.closest("[hidden]") || s.offsetParent === null && s.tagName !== "INPUT"));
-}
-class r {
-  constructor() {
-    this._root = null, this._previousFocus = null, this._options = {}, this._active = !1, this._handleKeydown = (t) => {
-      if (!this._active || !this._root) return;
-      if (t.key === "Escape" && this._options.handleEscape) {
-        t.preventDefault(), this._options.onEscape?.();
-        return;
-      }
-      if (t.key !== "Tab") return;
-      const e = c(this._root);
-      if (e.length === 0) {
-        t.preventDefault();
-        return;
-      }
-      const s = e[0], o = e[e.length - 1], n = this._root.shadowRoot?.activeElement || document.activeElement;
-      t.shiftKey ? (n === s || !e.includes(n)) && (t.preventDefault(), o.focus()) : n === o && (t.preventDefault(), s.focus());
-    };
-  }
-  activate(t, e = {}) {
-    this._active && this.deactivate(), this._root = t, this._options = { returnFocus: !0, handleEscape: !0, ...e }, this._previousFocus = document.activeElement, this._active = !0, t.addEventListener("keydown", this._handleKeydown), requestAnimationFrame(() => {
-      if (!this._active || !this._root) return;
-      const s = this._options.initialFocus;
-      if (s)
-        s.focus();
-      else {
-        const o = c(this._root);
-        o.length > 0 && o[0].focus();
-      }
-    });
-  }
-  deactivate() {
-    if (!(!this._active || !this._root)) {
-      if (this._root.removeEventListener("keydown", this._handleKeydown), this._active = !1, this._options.returnFocus && this._previousFocus)
-        try {
-          this._previousFocus.focus();
-        } catch {
-        }
-      this._root = null, this._previousFocus = null;
-    }
-  }
-  isActive() {
-    return this._active;
-  }
-}
-export {
-  r as F
-};
-//# sourceMappingURL=focus-trap-BdRNhSPD.js.map

package/dist/chunks/focus-trap-BdRNhSPD.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"focus-trap-BdRNhSPD.js","sources":["../../src/utils/focus-trap.ts"],"sourcesContent":["/**\n * Focus trap utility — shared by cg-modal, cg-popover, cg-alert-dialog, cg-command, cg-context-menu.\n * Extracted from the focus trap logic in cg-modal._handleKeydown.\n */\n\nconst FOCUSABLE_SELECTOR =\n  'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), ' +\n  'textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"]), audio[controls], video[controls], ' +\n  'summary, details, iframe, object, embed';\n\n/**\n * Returns all visible, non-disabled, focusable elements within a root.\n * Walks both shadow DOM and light DOM.\n */\nexport function getFocusableElements(root: HTMLElement | ShadowRoot): HTMLElement[] {\n  const shadowFocusable = root instanceof HTMLElement && root.shadowRoot\n    ? [...root.shadowRoot.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR)]\n    : root instanceof ShadowRoot\n      ? [...root.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR)]\n      : [];\n\n  const lightFocusable = root instanceof HTMLElement\n    ? [...root.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR)]\n    : [];\n\n  return [...shadowFocusable, ...lightFocusable].filter(el => {\n    if (el.closest('[hidden]')) return false;\n    if (el.offsetParent === null && el.tagName !== 'INPUT') return false;\n    return true;\n  });\n}\n\nexport interface FocusTrapOptions {\n  /** Element to focus first when activated. Defaults to first focusable element. */\n  initialFocus?: HTMLElement | null | undefined;\n  /** Return focus to the previously active element on deactivate. Default: true */\n  returnFocus?: boolean | undefined;\n  /** Called when Escape key is pressed. */\n  onEscape?: (() => void) | undefined;\n  /** Whether to handle Escape key. Default: true */\n  handleEscape?: boolean | undefined;\n}\n\n/**\n * Manages focus trapping within a root element.\n * - Activates: captures prior focus, focuses initial element, binds keydown.\n * - Deactivates: unbinds keydown, optionally returns focus to prior element.\n * - Handles Tab/Shift+Tab cycling within the trap.\n * - Optionally handles Escape.\n */\nexport class FocusTrap {\n  private _root: HTMLElement | null = null;\n  private _previousFocus: HTMLElement | null = null;\n  private _options: FocusTrapOptions = {};\n  private _active = false;\n\n  activate(root: HTMLElement, options: FocusTrapOptions = {}): void {\n    if (this._active) this.deactivate();\n\n    this._root = root;\n    this._options = { returnFocus: true, handleEscape: true, ...options };\n    this._previousFocus = document.activeElement as HTMLElement | null;\n    this._active = true;\n\n    root.addEventListener('keydown', this._handleKeydown);\n\n    // Focus initial element on next frame to allow render\n    requestAnimationFrame(() => {\n      if (!this._active || !this._root) return;\n      const initial = this._options.initialFocus;\n      if (initial) {\n        initial.focus();\n      } else {\n        const focusable = getFocusableElements(this._root);\n        if (focusable.length > 0) focusable[0]!.focus();\n      }\n    });\n  }\n\n  deactivate(): void {\n    if (!this._active || !this._root) return;\n\n    this._root.removeEventListener('keydown', this._handleKeydown);\n    this._active = false;\n\n    if (this._options.returnFocus && this._previousFocus) {\n      try { this._previousFocus.focus(); } catch {}\n    }\n\n    this._root = null;\n    this._previousFocus = null;\n  }\n\n  isActive(): boolean {\n    return this._active;\n  }\n\n  private _handleKeydown = (e: KeyboardEvent): void => {\n    if (!this._active || !this._root) return;\n\n    if (e.key === 'Escape' && this._options.handleEscape) {\n      e.preventDefault();\n      this._options.onEscape?.();\n      return;\n    }\n\n    if (e.key !== 'Tab') return;\n\n    const focusable = getFocusableElements(this._root);\n    if (focusable.length === 0) {\n      e.preventDefault();\n      return;\n    }\n\n    const first = focusable[0]!;\n    const last = focusable[focusable.length - 1]!;\n    const active = (this._root.shadowRoot?.activeElement as HTMLElement) || (document.activeElement as HTMLElement);\n\n    if (e.shiftKey) {\n      if (active === first || !focusable.includes(active)) {\n        e.preventDefault();\n        last.focus();\n      }\n    } else {\n      if (active === last) {\n        e.preventDefault();\n        first.focus();\n      }\n    }\n  };\n}\n"],"names":["FOCUSABLE_SELECTOR","getFocusableElements","root","shadowFocusable","lightFocusable","el","FocusTrap","e","focusable","first","last","active","options","initial"],"mappings":"AAKA,MAAMA,IACJ;AAQK,SAASC,EAAqBC,GAA+C;AAClF,QAAMC,IAAkBD,aAAgB,eAAeA,EAAK,aACxD,CAAC,GAAGA,EAAK,WAAW,iBAA8BF,CAAkB,CAAC,IACrEE,aAAgB,aACd,CAAC,GAAGA,EAAK,iBAA8BF,CAAkB,CAAC,IAC1D,CAAA,GAEAI,IAAiBF,aAAgB,cACnC,CAAC,GAAGA,EAAK,iBAA8BF,CAAkB,CAAC,IAC1D,CAAA;AAEJ,SAAO,CAAC,GAAGG,GAAiB,GAAGC,CAAc,EAAE,OAAO,CAAAC,MAChD,EAAAA,EAAG,QAAQ,UAAU,KACrBA,EAAG,iBAAiB,QAAQA,EAAG,YAAY,QAEhD;AACH;AAoBO,MAAMC,EAAU;AAAA,EAAhB,cAAA;AACL,SAAQ,QAA4B,MACpC,KAAQ,iBAAqC,MAC7C,KAAQ,WAA6B,CAAA,GACrC,KAAQ,UAAU,IA2ClB,KAAQ,iBAAiB,CAACC,MAA2B;AACnD,UAAI,CAAC,KAAK,WAAW,CAAC,KAAK,MAAO;AAElC,UAAIA,EAAE,QAAQ,YAAY,KAAK,SAAS,cAAc;AACpD,QAAAA,EAAE,eAAA,GACF,KAAK,SAAS,WAAA;AACd;AAAA,MACF;AAEA,UAAIA,EAAE,QAAQ,MAAO;AAErB,YAAMC,IAAYP,EAAqB,KAAK,KAAK;AACjD,UAAIO,EAAU,WAAW,GAAG;AAC1B,QAAAD,EAAE,eAAA;AACF;AAAA,MACF;AAEA,YAAME,IAAQD,EAAU,CAAC,GACnBE,IAAOF,EAAUA,EAAU,SAAS,CAAC,GACrCG,IAAU,KAAK,MAAM,YAAY,iBAAkC,SAAS;AAElF,MAAIJ,EAAE,YACAI,MAAWF,KAAS,CAACD,EAAU,SAASG,CAAM,OAChDJ,EAAE,eAAA,GACFG,EAAK,MAAA,KAGHC,MAAWD,MACbH,EAAE,eAAA,GACFE,EAAM,MAAA;AAAA,IAGZ;AAAA,EAAA;AAAA,EAzEA,SAASP,GAAmBU,IAA4B,IAAU;AAChE,IAAI,KAAK,WAAS,KAAK,WAAA,GAEvB,KAAK,QAAQV,GACb,KAAK,WAAW,EAAE,aAAa,IAAM,cAAc,IAAM,GAAGU,EAAA,GAC5D,KAAK,iBAAiB,SAAS,eAC/B,KAAK,UAAU,IAEfV,EAAK,iBAAiB,WAAW,KAAK,cAAc,GAGpD,sBAAsB,MAAM;AAC1B,UAAI,CAAC,KAAK,WAAW,CAAC,KAAK,MAAO;AAClC,YAAMW,IAAU,KAAK,SAAS;AAC9B,UAAIA;AACF,QAAAA,EAAQ,MAAA;AAAA,WACH;AACL,cAAML,IAAYP,EAAqB,KAAK,KAAK;AACjD,QAAIO,EAAU,SAAS,KAAGA,EAAU,CAAC,EAAG,MAAA;AAAA,MAC1C;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EAEA,aAAmB;AACjB,QAAI,GAAC,KAAK,WAAW,CAAC,KAAK,QAK3B;AAAA,UAHA,KAAK,MAAM,oBAAoB,WAAW,KAAK,cAAc,GAC7D,KAAK,UAAU,IAEX,KAAK,SAAS,eAAe,KAAK;AACpC,YAAI;AAAE,eAAK,eAAe,MAAA;AAAA,QAAS,QAAQ;AAAA,QAAC;AAG9C,WAAK,QAAQ,MACb,KAAK,iBAAiB;AAAA;AAAA,EACxB;AAAA,EAEA,WAAoB;AAClB,WAAO,KAAK;AAAA,EACd;AAmCF;"}

package/dist/components/cg-app-shell/cg-app-shell.d.ts

@@ -1,54 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * @element cg-app-shell
- * Composed application shell — a sticky top navbar, an optional sidebar, and
- * an independently scrolling main region. Handles the layout most apps
- * hand-roll on top of `cg-navbar` + `cg-sidebar`.
- *
- * The shell takes the full viewport height by default. The main region is the
- * only scrollable surface; the navbar and sidebar are pinned. Below
- * `--cg-component-app-shell-breakpoint` (768px), the sidebar collapses out
- * of the layout — consumers should provide a drawer trigger inside the
- * navbar slot for narrow viewports.
- *
- * @example
- * ```html
- * <cg-app-shell>
- *   <cg-navbar slot="navbar">…</cg-navbar>
- *   <cg-sidebar slot="sidebar">…</cg-sidebar>
- *   <article>…page content…</article>
- * </cg-app-shell>
- * ```
- *
- * @example Right sidebar, no navbar
- * ```html
- * <cg-app-shell sidebar-position="right" no-navbar>
- *   <cg-sidebar slot="sidebar">…</cg-sidebar>
- *   <article>…</article>
- * </cg-app-shell>
- * ```
- *
- * @slot navbar - Top navigation bar (sticky)
- * @slot sidebar - Side navigation (sticky, hidden on narrow viewports)
- * @slot - Main content (scrollable)
- *
- * @cssprop --cg-component-app-shell-navbar-height - Navbar fixed height (default 64px)
- * @cssprop --cg-component-app-shell-sidebar-width - Sidebar fixed width (default 240px)
- * @cssprop --cg-component-app-shell-breakpoint - Width below which sidebar collapses (default 768px)
- */
-export declare class CgAppShell extends LitElement {
-    static styles: import('lit').CSSResult[];
-    /** Position of the sidebar slot, or "overlay" to keep it visible on narrow viewports. */
-    sidebarPosition: 'left' | 'right' | 'overlay';
-    /** Hide the navbar slot entirely. */
-    noNavbar: boolean;
-    /** Hide the sidebar slot entirely. */
-    noSidebar: boolean;
-    render(): import('lit').TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'cg-app-shell': CgAppShell;
-    }
-}
-//# sourceMappingURL=cg-app-shell.d.ts.map

package/dist/components/cg-app-shell/cg-app-shell.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-app-shell.d.ts","sourceRoot":"","sources":["../../../src/components/cg-app-shell/cg-app-shell.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAI5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,OAAgB,MAAM,4BAkGnB;IAEH,yFAAyF;IAEzF,eAAe,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAU;IAEvD,qCAAqC;IAErC,QAAQ,UAAS;IAEjB,sCAAsC;IAEtC,SAAS,UAAS;IAET,MAAM;CAOhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,UAAU,CAAC;KAC5B;CACF"}

package/dist/components/cg-app-shell/cg-app-shell.js

@@ -1,135 +0,0 @@
-import { css as p, LitElement as c, html as d } from "lit";
-import { property as l, customElement as m } from "lit/decorators.js";
-import { h, r as g } from "../../chunks/premium.css-9I4kHrsl.js";
-var v = Object.defineProperty, f = Object.getOwnPropertyDescriptor, t = (b, e, i, o) => {
-  for (var r = o > 1 ? void 0 : o ? f(e, i) : e, s = b.length - 1, n; s >= 0; s--)
-    (n = b[s]) && (r = (o ? n(e, i, r) : n(r)) || r);
-  return o && r && v(e, i, r), r;
-};
-let a = class extends c {
-  constructor() {
-    super(...arguments), this.sidebarPosition = "left", this.noNavbar = !1, this.noSidebar = !1;
-  }
-  render() {
-    return d`
-      ${this.noNavbar ? "" : d`<header class="navbar"><slot name="navbar"></slot></header>`}
-      ${this.noSidebar ? "" : d`<aside class="sidebar"><slot name="sidebar"></slot></aside>`}
-      <main class="main"><slot></slot></main>
-    `;
-  }
-};
-a.styles = [h, g, p`
-    :host {
-      display: grid;
-      width: 100%;
-      height: 100vh;
-      grid-template-rows: var(--cg-component-app-shell-navbar-height, 64px) 1fr;
-      grid-template-columns: var(--cg-component-app-shell-sidebar-width, 240px) 1fr;
-      grid-template-areas:
-        "navbar navbar"
-        "sidebar main";
-      background: var(--cg-color-surface-base-background);
-      color: var(--cg-color-surface-base-text);
-      overflow: hidden;
-    }
-
-    :host([sidebar-position="right"]) {
-      grid-template-columns: 1fr var(--cg-component-app-shell-sidebar-width, 240px);
-      grid-template-areas:
-        "navbar navbar"
-        "main sidebar";
-    }
-
-    :host([no-sidebar]) {
-      grid-template-columns: 1fr;
-      grid-template-areas:
-        "navbar"
-        "main";
-    }
-
-    :host([no-navbar]) {
-      grid-template-rows: 1fr;
-      grid-template-areas: "sidebar main";
-    }
-
-    :host([no-navbar][sidebar-position="right"]) {
-      grid-template-areas: "main sidebar";
-    }
-
-    :host([no-navbar][no-sidebar]) {
-      grid-template-rows: 1fr;
-      grid-template-columns: 1fr;
-      grid-template-areas: "main";
-    }
-
-    .navbar {
-      grid-area: navbar;
-      display: flex;
-      align-items: stretch;
-      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
-      background: var(--cg-color-surface-container-background);
-      z-index: 2;
-      min-width: 0;
-    }
-
-    .sidebar {
-      grid-area: sidebar;
-      display: flex;
-      flex-direction: column;
-      border-right: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
-      background: var(--cg-color-surface-container-background);
-      overflow-y: auto;
-      min-height: 0;
-    }
-
-    :host([sidebar-position="right"]) .sidebar {
-      border-right: none;
-      border-left: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
-    }
-
-    .main {
-      grid-area: main;
-      overflow-y: auto;
-      overflow-x: hidden;
-      min-width: 0;
-      min-height: 0;
-    }
-
-    /* Hide sidebar on narrow viewports — consumers slot a drawer trigger
-       into the navbar instead. */
-    @media (max-width: 768px) {
-      :host(:not([sidebar-position="overlay"])) {
-        grid-template-columns: 1fr;
-      }
-      :host(:not([sidebar-position="overlay"])) {
-        grid-template-areas:
-          "navbar"
-          "main";
-      }
-      :host(:not([no-navbar]):not([sidebar-position="overlay"])) .sidebar {
-        display: none;
-      }
-      :host([no-navbar]:not([sidebar-position="overlay"])) {
-        grid-template-areas: "main";
-      }
-      :host([no-navbar]:not([sidebar-position="overlay"])) .sidebar {
-        display: none;
-      }
-    }
-  `];
-t([
-  l({ attribute: "sidebar-position", reflect: !0 })
-], a.prototype, "sidebarPosition", 2);
-t([
-  l({ type: Boolean, attribute: "no-navbar", reflect: !0 })
-], a.prototype, "noNavbar", 2);
-t([
-  l({ type: Boolean, attribute: "no-sidebar", reflect: !0 })
-], a.prototype, "noSidebar", 2);
-a = t([
-  m("cg-app-shell")
-], a);
-export {
-  a as CgAppShell
-};
-//# sourceMappingURL=cg-app-shell.js.map

package/dist/components/cg-app-shell/cg-app-shell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-app-shell.js","sources":["../../../src/components/cg-app-shell/cg-app-shell.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 * @element cg-app-shell\n * Composed application shell — a sticky top navbar, an optional sidebar, and\n * an independently scrolling main region. Handles the layout most apps\n * hand-roll on top of `cg-navbar` + `cg-sidebar`.\n *\n * The shell takes the full viewport height by default. The main region is the\n * only scrollable surface; the navbar and sidebar are pinned. Below\n * `--cg-component-app-shell-breakpoint` (768px), the sidebar collapses out\n * of the layout — consumers should provide a drawer trigger inside the\n * navbar slot for narrow viewports.\n *\n * @example\n * ```html\n * <cg-app-shell>\n *   <cg-navbar slot=\"navbar\">…</cg-navbar>\n *   <cg-sidebar slot=\"sidebar\">…</cg-sidebar>\n *   <article>…page content…</article>\n * </cg-app-shell>\n * ```\n *\n * @example Right sidebar, no navbar\n * ```html\n * <cg-app-shell sidebar-position=\"right\" no-navbar>\n *   <cg-sidebar slot=\"sidebar\">…</cg-sidebar>\n *   <article>…</article>\n * </cg-app-shell>\n * ```\n *\n * @slot navbar - Top navigation bar (sticky)\n * @slot sidebar - Side navigation (sticky, hidden on narrow viewports)\n * @slot - Main content (scrollable)\n *\n * @cssprop --cg-component-app-shell-navbar-height - Navbar fixed height (default 64px)\n * @cssprop --cg-component-app-shell-sidebar-width - Sidebar fixed width (default 240px)\n * @cssprop --cg-component-app-shell-breakpoint - Width below which sidebar collapses (default 768px)\n */\n@customElement('cg-app-shell')\nexport class CgAppShell extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host {\n      display: grid;\n      width: 100%;\n      height: 100vh;\n      grid-template-rows: var(--cg-component-app-shell-navbar-height, 64px) 1fr;\n      grid-template-columns: var(--cg-component-app-shell-sidebar-width, 240px) 1fr;\n      grid-template-areas:\n        \"navbar navbar\"\n        \"sidebar main\";\n      background: var(--cg-color-surface-base-background);\n      color: var(--cg-color-surface-base-text);\n      overflow: hidden;\n    }\n\n    :host([sidebar-position=\"right\"]) {\n      grid-template-columns: 1fr var(--cg-component-app-shell-sidebar-width, 240px);\n      grid-template-areas:\n        \"navbar navbar\"\n        \"main sidebar\";\n    }\n\n    :host([no-sidebar]) {\n      grid-template-columns: 1fr;\n      grid-template-areas:\n        \"navbar\"\n        \"main\";\n    }\n\n    :host([no-navbar]) {\n      grid-template-rows: 1fr;\n      grid-template-areas: \"sidebar main\";\n    }\n\n    :host([no-navbar][sidebar-position=\"right\"]) {\n      grid-template-areas: \"main sidebar\";\n    }\n\n    :host([no-navbar][no-sidebar]) {\n      grid-template-rows: 1fr;\n      grid-template-columns: 1fr;\n      grid-template-areas: \"main\";\n    }\n\n    .navbar {\n      grid-area: navbar;\n      display: flex;\n      align-items: stretch;\n      border-bottom: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      background: var(--cg-color-surface-container-background);\n      z-index: 2;\n      min-width: 0;\n    }\n\n    .sidebar {\n      grid-area: sidebar;\n      display: flex;\n      flex-direction: column;\n      border-right: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      background: var(--cg-color-surface-container-background);\n      overflow-y: auto;\n      min-height: 0;\n    }\n\n    :host([sidebar-position=\"right\"]) .sidebar {\n      border-right: none;\n      border-left: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n    }\n\n    .main {\n      grid-area: main;\n      overflow-y: auto;\n      overflow-x: hidden;\n      min-width: 0;\n      min-height: 0;\n    }\n\n    /* Hide sidebar on narrow viewports — consumers slot a drawer trigger\n       into the navbar instead. */\n    @media (max-width: 768px) {\n      :host(:not([sidebar-position=\"overlay\"])) {\n        grid-template-columns: 1fr;\n      }\n      :host(:not([sidebar-position=\"overlay\"])) {\n        grid-template-areas:\n          \"navbar\"\n          \"main\";\n      }\n      :host(:not([no-navbar]):not([sidebar-position=\"overlay\"])) .sidebar {\n        display: none;\n      }\n      :host([no-navbar]:not([sidebar-position=\"overlay\"])) {\n        grid-template-areas: \"main\";\n      }\n      :host([no-navbar]:not([sidebar-position=\"overlay\"])) .sidebar {\n        display: none;\n      }\n    }\n  `];\n\n  /** Position of the sidebar slot, or \"overlay\" to keep it visible on narrow viewports. */\n  @property({ attribute: 'sidebar-position', reflect: true })\n  sidebarPosition: 'left' | 'right' | 'overlay' = 'left';\n\n  /** Hide the navbar slot entirely. */\n  @property({ type: Boolean, attribute: 'no-navbar', reflect: true })\n  noNavbar = false;\n\n  /** Hide the sidebar slot entirely. */\n  @property({ type: Boolean, attribute: 'no-sidebar', reflect: true })\n  noSidebar = false;\n\n  override render() {\n    return html`\n      ${this.noNavbar ? '' : html`<header class=\"navbar\"><slot name=\"navbar\"></slot></header>`}\n      ${this.noSidebar ? '' : html`<aside class=\"sidebar\"><slot name=\"sidebar\"></slot></aside>`}\n      <main class=\"main\"><slot></slot></main>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-app-shell': CgAppShell;\n  }\n}\n"],"names":["CgAppShell","LitElement","html","hostBlock","reducedMotion","css","__decorateClass","property","customElement"],"mappings":";;;;;;;;AA0CO,IAAMA,IAAN,cAAyBC,EAAW;AAAA,EAApC,cAAA;AAAA,UAAA,GAAA,SAAA,GAuGL,KAAA,kBAAgD,QAIhD,KAAA,WAAW,IAIX,KAAA,YAAY;AAAA,EAAA;AAAA,EAEH,SAAS;AAChB,WAAOC;AAAA,QACH,KAAK,WAAW,KAAKA,8DAAiE;AAAA,QACtF,KAAK,YAAY,KAAKA,8DAAiE;AAAA;AAAA;AAAA,EAG7F;AACF;AAxHaF,EACK,SAAS,CAACG,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,GAkGnD;AAIDC,EAAA;AAAA,EADCC,EAAS,EAAE,WAAW,oBAAoB,SAAS,IAAM;AAAA,GAtG/CP,EAuGX,WAAA,mBAAA,CAAA;AAIAM,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,WAAW,aAAa,SAAS,IAAM;AAAA,GA1GvDP,EA2GX,WAAA,YAAA,CAAA;AAIAM,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,WAAW,cAAc,SAAS,IAAM;AAAA,GA9GxDP,EA+GX,WAAA,aAAA,CAAA;AA/GWA,IAANM,EAAA;AAAA,EADNE,EAAc,cAAc;AAAA,GAChBR,CAAA;"}

package/dist/components/cg-auth-shell/cg-auth-shell.d.ts

@@ -1,61 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * @element cg-auth-shell
- * Layout shell for authentication screens (sign-in, sign-up, magic-link,
- * OTP challenge, password reset, MFA). Provides the canonical structure —
- * brand mark, title, subtitle, form region, primary actions, footer links —
- * with three layouts and consistent typography/spacing.
- *
- * The component is layout-only. Consumers slot in the actual form fields
- * (`<cg-input>`, `<cg-password-input>`, `<cg-otp-input>`, etc.), the
- * primary action button(s), and footer links to alternate flows.
- *
- * @example Sign-in
- * ```html
- * <cg-auth-shell mode="signin">
- *   <cg-icon slot="brand" name="cognivo-logo"></cg-icon>
- *   <span slot="title">Welcome back</span>
- *   <span slot="subtitle">Sign in to your Cognivo account</span>
- *
- *   <cg-input label="Email" type="email" required></cg-input>
- *   <cg-password-input label="Password" required></cg-password-input>
- *
- *   <cg-button slot="actions" variant="primary" submit>Sign in</cg-button>
- *   <cg-link slot="footer" href="/forgot">Forgot password?</cg-link>
- *   <cg-link slot="footer" href="/signup">Create account</cg-link>
- * </cg-auth-shell>
- * ```
- *
- * @example Split layout with marketing panel
- * ```html
- * <cg-auth-shell layout="split">
- *   <div slot="aside">…hero / testimonial / brand visual…</div>
- *   …form contents…
- * </cg-auth-shell>
- * ```
- *
- * @slot brand - Logo or wordmark above the title.
- * @slot title - Page heading. Plain text or rich content.
- * @slot subtitle - Supporting copy below the title.
- * @slot - Form fields (default slot).
- * @slot actions - Primary action button(s).
- * @slot footer - Alternate-flow links and helper text.
- * @slot aside - Marketing panel content (only renders when layout="split").
- *
- * @cssprop --cg-component-auth-shell-card-width - Form card width (default 420px)
- * @cssprop --cg-component-auth-shell-card-radius - Form card radius (default 16px)
- */
-export declare class CgAuthShell extends LitElement {
-    static styles: import('lit').CSSResult[];
-    /** Visual mode tag — does not change behavior, only `data-mode` for consumer styling. */
-    mode: 'signin' | 'signup' | 'otp' | 'magic-link' | 'reset' | 'mfa';
-    /** Layout variant. */
-    layout: 'centered' | 'split' | 'full-bleed';
-    render(): import('lit').TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'cg-auth-shell': CgAuthShell;
-    }
-}
-//# sourceMappingURL=cg-auth-shell.d.ts.map

package/dist/components/cg-auth-shell/cg-auth-shell.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-auth-shell.d.ts","sourceRoot":"","sources":["../../../src/components/cg-auth-shell/cg-auth-shell.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAIrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,OAAgB,MAAM,4BAoHnB;IAEH,yFAAyF;IAC5D,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,KAAK,GAAG,YAAY,GAAG,OAAO,GAAG,KAAK,CAAY;IAE3G,sBAAsB;IACO,MAAM,EAAE,UAAU,GAAG,OAAO,GAAG,YAAY,CAAc;IAE7E,MAAM;CAwBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}

package/dist/components/cg-auth-shell/cg-auth-shell.js

@@ -1,163 +0,0 @@
-import { css as g, LitElement as p, html as c, nothing as h } from "lit";
-import { property as d, customElement as v } from "lit/decorators.js";
-import { h as u, r as f } from "../../chunks/premium.css-9I4kHrsl.js";
-var m = Object.defineProperty, y = Object.getOwnPropertyDescriptor, l = (t, r, o, i) => {
-  for (var e = i > 1 ? void 0 : i ? y(r, o) : r, s = t.length - 1, n; s >= 0; s--)
-    (n = t[s]) && (e = (i ? n(r, o, e) : n(e)) || e);
-  return i && e && m(r, o, e), e;
-};
-let a = class extends p {
-  constructor() {
-    super(...arguments), this.mode = "signin", this.layout = "centered";
-  }
-  render() {
-    const t = () => c`
-      <form class="card" novalidate>
-        <div class="brand"><slot name="brand"></slot></div>
-        <div class="heading">
-          <span class="title"><slot name="title"></slot></span>
-          <span class="subtitle"><slot name="subtitle"></slot></span>
-        </div>
-        <div class="body"><slot></slot></div>
-        <div class="actions"><slot name="actions"></slot></div>
-        <div class="footer"><slot name="footer"></slot></div>
-      </form>
-    `;
-    return this.layout === "split" ? c`
-        <div class="container">
-          <div class="aside"><slot name="aside"></slot></div>
-          <div class="card-region">${t()}</div>
-        </div>
-      ` : c`<div class="container">${t()}</div>${h}`;
-  }
-};
-a.styles = [u, f, g`
-    :host {
-      display: block;
-      width: 100%;
-      min-height: 100vh;
-      background: var(--cg-color-surface-base-background);
-      color: var(--cg-color-surface-base-text);
-    }
-
-    /* ── Centered layout (default) ───────────────────────────────────── */
-    .container {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      min-height: 100vh;
-      padding: var(--cg-spacing-32) var(--cg-spacing-16);
-    }
-
-    .card {
-      width: 100%;
-      max-width: var(--cg-component-auth-shell-card-width, 420px);
-      background: var(--cg-color-surface-container-background);
-      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
-      border-radius: var(--cg-component-auth-shell-card-radius, var(--cg-border-radius-200));
-      padding: var(--cg-spacing-32) var(--cg-spacing-24);
-      display: flex;
-      flex-direction: column;
-      gap: var(--cg-spacing-16);
-    }
-
-    /* ── Full-bleed layout — no card chrome ─────────────────────────── */
-    :host([layout="full-bleed"]) .card {
-      max-width: var(--cg-component-auth-shell-card-width, 420px);
-      background: transparent;
-      border: 0;
-      padding: 0;
-    }
-
-    /* ── Split layout — aside on left, form on right ────────────────── */
-    :host([layout="split"]) .container {
-      align-items: stretch;
-      padding: 0;
-    }
-    :host([layout="split"]) .aside {
-      display: flex;
-      flex: 1 1 0;
-      min-height: 100vh;
-      background: var(--cg-color-action-tertiary-background-hover);
-      align-items: center;
-      justify-content: center;
-      padding: var(--cg-spacing-48);
-    }
-    :host([layout="split"]) .card-region {
-      display: flex;
-      flex: 1 1 0;
-      align-items: center;
-      justify-content: center;
-      padding: var(--cg-spacing-32) var(--cg-spacing-16);
-    }
-    @media (max-width: 768px) {
-      :host([layout="split"]) .aside { display: none; }
-      :host([layout="split"]) .card-region { flex: 1 1 100%; }
-    }
-    :host(:not([layout="split"])) .aside { display: none; }
-
-    /* ── Internal regions ───────────────────────────────────────────── */
-    .brand {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      min-height: var(--cg-spacing-32);
-    }
-    .brand:empty { display: none; }
-
-    .heading {
-      display: flex;
-      flex-direction: column;
-      gap: var(--cg-spacing-4);
-      text-align: center;
-    }
-    .title {
-      font-size: var(--cg-font-size-xl);
-      font-weight: var(--cg-font-weight-semibold);
-      color: var(--cg-color-surface-base-text);
-      line-height: var(--cg-line-height-tight);
-    }
-    .subtitle {
-      font-size: var(--cg-font-size-sm);
-      color: var(--cg-color-surface-container-outlined);
-      line-height: var(--cg-line-height-snug);
-    }
-
-    .body {
-      display: flex;
-      flex-direction: column;
-      gap: var(--cg-spacing-12);
-    }
-    .actions {
-      display: flex;
-      flex-direction: column;
-      gap: var(--cg-spacing-8);
-      margin-top: var(--cg-spacing-8);
-    }
-    .actions ::slotted(*) { width: 100%; }
-
-    .footer {
-      display: flex;
-      flex-wrap: wrap;
-      align-items: center;
-      justify-content: space-between;
-      gap: var(--cg-spacing-8);
-      padding-top: var(--cg-spacing-16);
-      border-top: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
-      font-size: var(--cg-font-size-xs);
-    }
-    .footer:empty { display: none; }
-  `];
-l([
-  d({ reflect: !0 })
-], a.prototype, "mode", 2);
-l([
-  d({ reflect: !0 })
-], a.prototype, "layout", 2);
-a = l([
-  v("cg-auth-shell")
-], a);
-export {
-  a as CgAuthShell
-};
-//# sourceMappingURL=cg-auth-shell.js.map

package/dist/components/cg-auth-shell/cg-auth-shell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-auth-shell.js","sources":["../../../src/components/cg-auth-shell/cg-auth-shell.ts"],"sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/**\n * @element cg-auth-shell\n * Layout shell for authentication screens (sign-in, sign-up, magic-link,\n * OTP challenge, password reset, MFA). Provides the canonical structure —\n * brand mark, title, subtitle, form region, primary actions, footer links —\n * with three layouts and consistent typography/spacing.\n *\n * The component is layout-only. Consumers slot in the actual form fields\n * (`<cg-input>`, `<cg-password-input>`, `<cg-otp-input>`, etc.), the\n * primary action button(s), and footer links to alternate flows.\n *\n * @example Sign-in\n * ```html\n * <cg-auth-shell mode=\"signin\">\n *   <cg-icon slot=\"brand\" name=\"cognivo-logo\"></cg-icon>\n *   <span slot=\"title\">Welcome back</span>\n *   <span slot=\"subtitle\">Sign in to your Cognivo account</span>\n *\n *   <cg-input label=\"Email\" type=\"email\" required></cg-input>\n *   <cg-password-input label=\"Password\" required></cg-password-input>\n *\n *   <cg-button slot=\"actions\" variant=\"primary\" submit>Sign in</cg-button>\n *   <cg-link slot=\"footer\" href=\"/forgot\">Forgot password?</cg-link>\n *   <cg-link slot=\"footer\" href=\"/signup\">Create account</cg-link>\n * </cg-auth-shell>\n * ```\n *\n * @example Split layout with marketing panel\n * ```html\n * <cg-auth-shell layout=\"split\">\n *   <div slot=\"aside\">…hero / testimonial / brand visual…</div>\n *   …form contents…\n * </cg-auth-shell>\n * ```\n *\n * @slot brand - Logo or wordmark above the title.\n * @slot title - Page heading. Plain text or rich content.\n * @slot subtitle - Supporting copy below the title.\n * @slot - Form fields (default slot).\n * @slot actions - Primary action button(s).\n * @slot footer - Alternate-flow links and helper text.\n * @slot aside - Marketing panel content (only renders when layout=\"split\").\n *\n * @cssprop --cg-component-auth-shell-card-width - Form card width (default 420px)\n * @cssprop --cg-component-auth-shell-card-radius - Form card radius (default 16px)\n */\n@customElement('cg-auth-shell')\nexport class CgAuthShell extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host {\n      display: block;\n      width: 100%;\n      min-height: 100vh;\n      background: var(--cg-color-surface-base-background);\n      color: var(--cg-color-surface-base-text);\n    }\n\n    /* ── Centered layout (default) ───────────────────────────────────── */\n    .container {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      min-height: 100vh;\n      padding: var(--cg-spacing-32) var(--cg-spacing-16);\n    }\n\n    .card {\n      width: 100%;\n      max-width: var(--cg-component-auth-shell-card-width, 420px);\n      background: var(--cg-color-surface-container-background);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-component-auth-shell-card-radius, var(--cg-border-radius-200));\n      padding: var(--cg-spacing-32) var(--cg-spacing-24);\n      display: flex;\n      flex-direction: column;\n      gap: var(--cg-spacing-16);\n    }\n\n    /* ── Full-bleed layout — no card chrome ─────────────────────────── */\n    :host([layout=\"full-bleed\"]) .card {\n      max-width: var(--cg-component-auth-shell-card-width, 420px);\n      background: transparent;\n      border: 0;\n      padding: 0;\n    }\n\n    /* ── Split layout — aside on left, form on right ────────────────── */\n    :host([layout=\"split\"]) .container {\n      align-items: stretch;\n      padding: 0;\n    }\n    :host([layout=\"split\"]) .aside {\n      display: flex;\n      flex: 1 1 0;\n      min-height: 100vh;\n      background: var(--cg-color-action-tertiary-background-hover);\n      align-items: center;\n      justify-content: center;\n      padding: var(--cg-spacing-48);\n    }\n    :host([layout=\"split\"]) .card-region {\n      display: flex;\n      flex: 1 1 0;\n      align-items: center;\n      justify-content: center;\n      padding: var(--cg-spacing-32) var(--cg-spacing-16);\n    }\n    @media (max-width: 768px) {\n      :host([layout=\"split\"]) .aside { display: none; }\n      :host([layout=\"split\"]) .card-region { flex: 1 1 100%; }\n    }\n    :host(:not([layout=\"split\"])) .aside { display: none; }\n\n    /* ── Internal regions ───────────────────────────────────────────── */\n    .brand {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      min-height: var(--cg-spacing-32);\n    }\n    .brand:empty { display: none; }\n\n    .heading {\n      display: flex;\n      flex-direction: column;\n      gap: var(--cg-spacing-4);\n      text-align: center;\n    }\n    .title {\n      font-size: var(--cg-font-size-xl);\n      font-weight: var(--cg-font-weight-semibold);\n      color: var(--cg-color-surface-base-text);\n      line-height: var(--cg-line-height-tight);\n    }\n    .subtitle {\n      font-size: var(--cg-font-size-sm);\n      color: var(--cg-color-surface-container-outlined);\n      line-height: var(--cg-line-height-snug);\n    }\n\n    .body {\n      display: flex;\n      flex-direction: column;\n      gap: var(--cg-spacing-12);\n    }\n    .actions {\n      display: flex;\n      flex-direction: column;\n      gap: var(--cg-spacing-8);\n      margin-top: var(--cg-spacing-8);\n    }\n    .actions ::slotted(*) { width: 100%; }\n\n    .footer {\n      display: flex;\n      flex-wrap: wrap;\n      align-items: center;\n      justify-content: space-between;\n      gap: var(--cg-spacing-8);\n      padding-top: var(--cg-spacing-16);\n      border-top: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      font-size: var(--cg-font-size-xs);\n    }\n    .footer:empty { display: none; }\n  `];\n\n  /** Visual mode tag — does not change behavior, only `data-mode` for consumer styling. */\n  @property({ reflect: true }) mode: 'signin' | 'signup' | 'otp' | 'magic-link' | 'reset' | 'mfa' = 'signin';\n\n  /** Layout variant. */\n  @property({ reflect: true }) layout: 'centered' | 'split' | 'full-bleed' = 'centered';\n\n  override render() {\n    const renderCard = () => html`\n      <form class=\"card\" novalidate>\n        <div class=\"brand\"><slot name=\"brand\"></slot></div>\n        <div class=\"heading\">\n          <span class=\"title\"><slot name=\"title\"></slot></span>\n          <span class=\"subtitle\"><slot name=\"subtitle\"></slot></span>\n        </div>\n        <div class=\"body\"><slot></slot></div>\n        <div class=\"actions\"><slot name=\"actions\"></slot></div>\n        <div class=\"footer\"><slot name=\"footer\"></slot></div>\n      </form>\n    `;\n\n    if (this.layout === 'split') {\n      return html`\n        <div class=\"container\">\n          <div class=\"aside\"><slot name=\"aside\"></slot></div>\n          <div class=\"card-region\">${renderCard()}</div>\n        </div>\n      `;\n    }\n    return html`<div class=\"container\">${renderCard()}</div>${nothing}`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-auth-shell': CgAuthShell;\n  }\n}\n"],"names":["CgAuthShell","LitElement","renderCard","html","nothing","hostBlock","reducedMotion","css","__decorateClass","property","customElement"],"mappings":";;;;;;;;AAmDO,IAAMA,IAAN,cAA0BC,EAAW;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GAwHwB,KAAA,OAAqE,UAGrE,KAAA,SAA8C;AAAA,EAAA;AAAA,EAElE,SAAS;AAChB,UAAMC,IAAa,MAAMC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAazB,WAAI,KAAK,WAAW,UACXA;AAAA;AAAA;AAAA,qCAGwBD,GAAY;AAAA;AAAA,UAItCC,2BAA8BD,EAAA,CAAY,SAASE,CAAO;AAAA,EACnE;AACF;AArJaJ,EACK,SAAS,CAACK,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,GAoHnD;AAG4BC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAxHhBT,EAwHkB,WAAA,QAAA,CAAA;AAGAQ,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA3HhBT,EA2HkB,WAAA,UAAA,CAAA;AA3HlBA,IAANQ,EAAA;AAAA,EADNE,EAAc,eAAe;AAAA,GACjBV,CAAA;"}

package/dist/components/cg-definition-list/cg-definition-list.d.ts

@@ -1,99 +0,0 @@
-import { LitElement } from 'lit';
-interface DefinitionItem {
-    /** Term (label) shown on the left / above. */
-    term: string;
-    /** Definition value. Strings render as text; consumers wanting markup should use the slot API instead. */
-    definition?: unknown;
-    /** Show a copy-to-clipboard button next to the value. Visible on row hover. */
-    copyable?: boolean;
-    /** Optional tooltip on the term (helpful for shorthand specs like SLA, MAU). */
-    tooltip?: string;
-}
-/**
- * @element cg-definition-list
- * Semantic key/value list rendered as a real `<dl>` so screen readers
- * expose proper term/definition pairing. Supports two render paths:
- *
- *   1. Slot in `<dt>` and `<dd>` directly (rich values, full control):
- *      ```html
- *      <cg-definition-list bordered>
- *        <dt>Plan</dt>
- *        <dd><cg-badge variant="accent">Pro</cg-badge></dd>
- *        <dt>Status</dt>
- *        <dd><cg-badge variant="success">Active</cg-badge></dd>
- *      </cg-definition-list>
- *      ```
- *
- *   2. Pass `.items=[...]` for quick data-driven render with built-in
- *      copy buttons + label tooltips:
- *      ```html
- *      <cg-definition-list bordered .items=${[
- *        { term: 'Plan',   definition: 'Pro' },
- *        { term: 'Email',  definition: 'alice@example.com', copyable: true },
- *        { term: 'API key', definition: 'sk_live_abc', copyable: true, tooltip: 'Read-write key' },
- *      ]}></cg-definition-list>
- *      ```
- *
- * Two layouts (`direction`):
- *   - `horizontal` (default) — term : value side-by-side (spec sheet)
- *   - `vertical`              — term above value (form / detail view)
- *
- * For tag-chip / metadata-line use cases (e.g. "CPU: 8 cores · RAM: 32 GB"),
- * compose <cg-chip> or <cg-text> directly — they give finer control than
- * a description list pretending to be a chip strip.
- *
- * Two alignments (`align`, horizontal mode only):
- *   - `start` (default) — term and value sit adjacent on the left
- *   - `between`         — term hard-left, value hard-right (price-list)
- *
- * Variants: `bordered` (outer card + 24px padding + row dividers),
- * `striped` (alternating row backgrounds for long lists), `size`
- * (sm/md/lg density).
- *
- * @slot - `<dt>` and `<dd>` pairs.
- *
- * @csspart list - The inner `<dl>` element
- * @csspart term - Each `<dt>` rendered from items[] (slotted dt/dd cannot be parted from outside the shadow boundary; use ::slotted() or wrap them)
- * @csspart value - Each `<dd>` rendered from items[]
- * @csspart copy-button - The copy-to-clipboard button on copyable items
- *
- * @fires {CustomEvent<{term, value}>} cg-definition-copy - Fired when a copyable item is copied.
- *
- * @cssprop --cg-component-definition-list-padding - Wrapper padding when bordered (default 24px)
- * @cssprop --cg-component-definition-list-term-width - Term column width in horizontal mode (default auto)
- */
-export declare class CgDefinitionList extends LitElement {
-    static styles: import('lit').CSSResult[];
-    /** Layout direction. */
-    direction: 'horizontal' | 'vertical';
-    /**
-     * Term/value alignment in horizontal mode:
-     *   start (default) — term and value sit adjacent on the left (spec sheet)
-     *   between         — term on the far left, value pushed to the far right (price-list)
-     * No-op outside horizontal direction.
-     */
-    align: 'start' | 'between';
-    /** Density. */
-    size: 'sm' | 'md' | 'lg';
-    /** Show outer card border + 24px wrapper padding + row dividers. */
-    bordered: boolean;
-    /** Alternating row backgrounds for long lists. */
-    striped: boolean;
-    /** Legacy: tighter gaps. Prefer `size="sm"`. */
-    compact: boolean;
-    /** Accessible label announced on the <dl>. */
-    label: string;
-    /** Optional data-driven items. Slotted dt/dd still render after these. */
-    items: DefinitionItem[];
-    private _copiedIndex;
-    private _copy;
-    private _renderItem;
-    render(): import('lit').TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'cg-definition-list': CgDefinitionList;
-    }
-}
-export {};
-//# sourceMappingURL=cg-definition-list.d.ts.map

package/dist/components/cg-definition-list/cg-definition-list.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-definition-list.d.ts","sourceRoot":"","sources":["../../../src/components/cg-definition-list/cg-definition-list.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAGrD,OAAO,uBAAuB,CAAC;AAC/B,OAAO,6BAA6B,CAAC;AAErC,UAAU,cAAc;IACtB,8CAA8C;IAC9C,IAAI,EAAE,MAAM,CAAC;IACb,0GAA0G;IAC1G,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gFAAgF;IAChF,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,qBACa,gBAAiB,SAAQ,UAAU;IAC9C,OAAgB,MAAM,4BA6OnB;IAEH,wBAAwB;IACK,SAAS,EAAE,YAAY,GAAG,UAAU,CAAgB;IAEjF;;;;;OAKG;IAC0B,KAAK,EAAE,OAAO,GAAG,SAAS,CAAW;IAElE,eAAe;IACc,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAE7D,oEAAoE;IACxB,QAAQ,UAAS;IAE7D,kDAAkD;IACN,OAAO,UAAS;IAE5D,gDAAgD;IACJ,OAAO,UAAS;IAE5D,8CAA8C;IAClC,KAAK,SAAM;IAEvB,0EAA0E;IAC/C,KAAK,EAAE,cAAc,EAAE,CAAM;IAE/C,OAAO,CAAC,YAAY,CAAM;YAErB,KAAK;IAenB,OAAO,CAAC,WAAW;IAiCV,MAAM;CAQhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,gBAAgB,CAAC;KACxC;CACF"}