@cognivo/components 0.8.0 → 0.8.2

package/dist/components/cg-empty-state/cg-empty-state.js

@@ -1,26 +1,29 @@
-import { css as g, LitElement as v, svg as a, nothing as l, html as h } from "lit";
-import { property as i, customElement as u } from "lit/decorators.js";
-import { h as f, r as b } from "../../chunks/premium.css-9I4kHrsl.js";
-var y = Object.defineProperty, m = Object.getOwnPropertyDescriptor, n = (c, e, o, s) => {
-  for (var t = s > 1 ? void 0 : s ? m(e, o) : e, d = c.length - 1, p; d >= 0; d--)
-    (p = c[d]) && (t = (s ? p(e, o, t) : p(t)) || t);
-  return s && t && y(e, o, t), t;
+import { css as h, LitElement as v, svg as n, nothing as c, html as g } from "lit";
+import { property as l, state as u, customElement as f } from "lit/decorators.js";
+import { h as y, r as m } from "../../chunks/premium.css-DHekUEUt.js";
+var x = Object.defineProperty, w = Object.getOwnPropertyDescriptor, s = (r, e, i, a) => {
+  for (var o = a > 1 ? void 0 : a ? w(e, i) : e, d = r.length - 1, p; d >= 0; d--)
+    (p = r[d]) && (o = (a ? p(e, i, o) : p(o)) || o);
+  return a && o && x(e, i, o), o;
 };
-let r = class extends v {
+let t = class extends v {
   constructor() {
-    super(...arguments), this.variant = "default", this.container = "none", this.title = "", this.description = "", this.icon = "";
+    super(...arguments), this.variant = "default", this.title = "", this.description = "", this.icon = "", this._hasActions = !1;
+  }
+  _onActionsSlotChange(r) {
+    this._hasActions = r.target.assignedNodes({ flatten: !0 }).length > 0;
   }
   _defaultIcon() {
     switch (this.variant) {
       case "search":
-        return a`
+        return n`
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
             <circle cx="11" cy="11" r="8"></circle>
             <path d="m21 21-4.3-4.3"></path>
           </svg>
         `;
       case "error":
-        return a`
+        return n`
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
             <circle cx="12" cy="12" r="10"></circle>
             <line x1="12" y1="8" x2="12" y2="12"></line>
@@ -28,14 +31,14 @@ let r = class extends v {
           </svg>
         `;
       case "success":
-        return a`
+        return n`
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
             <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path>
             <polyline points="22 4 12 14.01 9 11.01"></polyline>
           </svg>
         `;
       case "info":
-        return a`
+        return n`
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
             <circle cx="12" cy="12" r="10"></circle>
             <line x1="12" y1="16" x2="12" y2="12"></line>
@@ -43,14 +46,14 @@ let r = class extends v {
           </svg>
         `;
       case "ai":
-        return a`
+        return n`
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
             <path d="M12 3l1.9 4.6L18.5 9.5l-4.6 1.9L12 16l-1.9-4.6L5.5 9.5l4.6-1.9z"></path>
             <path d="M19 14l.9 2.2L22 17l-2.1.8L19 20l-.9-2.2L16 17l2.1-.8z"></path>
           </svg>
         `;
       default:
-        return a`
+        return n`
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
             <polyline points="22 12 16 12 14 15 10 15 8 12 2 12"></polyline>
             <path d="M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z"></path>
@@ -59,28 +62,28 @@ let r = class extends v {
     }
   }
   render() {
-    const c = this.variant === "error" ? "alert" : "status", e = this.title ? "es-title" : void 0, o = this.description ? "es-desc" : void 0;
-    return h`
+    const r = this.variant === "error" ? "alert" : "status", e = this.title ? "es-title" : void 0, i = this.description ? "es-desc" : void 0;
+    return g`
       <div
         class="root"
-        role=${c}
-        aria-labelledby=${e ?? l}
-        aria-describedby=${o ?? l}
+        role=${r}
+        aria-labelledby=${e ?? c}
+        aria-describedby=${i ?? c}
       >
         <div class="icon-wrap" aria-hidden="true">
           <slot name="icon">${this._defaultIcon()}</slot>
         </div>
-        ${this.title ? h`<h3 id=${e} class="title">${this.title}</h3>` : l}
-        ${this.description ? h`<p id=${o} class="description">${this.description}</p>` : l}
+        ${this.title ? g`<h3 id=${e} class="title">${this.title}</h3>` : c}
+        ${this.description ? g`<p id=${i} class="description">${this.description}</p>` : c}
         <slot></slot>
-        <div class="actions">
-          <slot name="actions"></slot>
+        <div class="actions" ?hidden=${!this._hasActions}>
+          <slot name="actions" @slotchange=${this._onActionsSlotChange}></slot>
         </div>
       </div>
     `;
   }
 };
-r.styles = [f, b, g`
+t.styles = [y, m, h`
     :host {
       width: 100%;
     }
@@ -97,39 +100,13 @@ r.styles = [f, b, g`
       font-family: var(--cg-font-family-primary);
     }
 
-    /* Container variants — wrap the content in a card-like or
-       dashed-placeholder shell. Default container="none" keeps the bare
-       centered layout (current behaviour). */
-
-    /* Card: solid bg + 1px border + radius. Matches cg-card variant=
-       "elevated" treatment so empty states inside dashboards read as
-       proper sections rather than floaty centred text. */
-    :host([container="card"]) .root {
-      background: var(--cg-color-surface-cards-background);
-      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
-      border-radius: var(--cg-component-card-radius);
-    }
-
-    /* Dashed: drop-zone / "click to add" placeholder feel. Transparent
-       bg, dashed border, slightly stronger border on hover so the zone
-       reads as actionable when wrapped in a clickable parent. */
-    :host([container="dashed"]) .root {
-      background: transparent;
-      border: var(--cg-border-width-100) dashed var(--cg-color-surface-cards-border);
-      border-radius: var(--cg-component-card-radius);
-      transition: border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
-    }
-    :host([container="dashed"]) .root:hover {
-      border-color: var(--cg-color-surface-cards-hover-border);
-    }
-
     .icon-wrap {
       display: flex;
       align-items: center;
       justify-content: center;
       width: var(--cg-component-empty-state-icon-size);
       height: var(--cg-component-empty-state-icon-size);
-      color: var(--cg-color-surface-container-outlined);
+      color: var(--cg-color-empty-state-icon);
       margin-bottom: var(--cg-spacing-4);
     }
     .icon-wrap svg {
@@ -154,14 +131,14 @@ r.styles = [f, b, g`
     .title {
       font-size: var(--cg-font-size-md);
       font-weight: var(--cg-font-weight-semibold);
-      color: var(--cg-color-surface-base-text);
+      color: var(--cg-color-empty-state-text-primary);
       line-height: var(--cg-line-height-snug);
       margin: 0;
     }
 
     .description {
       font-size: var(--cg-font-size-sm);
-      color: var(--cg-color-surface-container-outlined);
+      color: var(--cg-color-empty-state-text-secondary);
       line-height: var(--cg-line-height-relaxed);
       margin: 0;
       max-width: 52ch;
@@ -175,27 +152,27 @@ r.styles = [f, b, g`
       gap: var(--cg-spacing-12);
       margin-top: var(--cg-spacing-8);
     }
-    .actions:empty { display: none; }
+    .actions[hidden] { display: none; }
   `];
-n([
-  i({ reflect: !0 })
-], r.prototype, "variant", 2);
-n([
-  i({ reflect: !0 })
-], r.prototype, "container", 2);
-n([
-  i()
-], r.prototype, "title", 2);
-n([
-  i()
-], r.prototype, "description", 2);
-n([
-  i()
-], r.prototype, "icon", 2);
-r = n([
-  u("cg-empty-state")
-], r);
+s([
+  l({ reflect: !0 })
+], t.prototype, "variant", 2);
+s([
+  l()
+], t.prototype, "title", 2);
+s([
+  l()
+], t.prototype, "description", 2);
+s([
+  l()
+], t.prototype, "icon", 2);
+s([
+  u()
+], t.prototype, "_hasActions", 2);
+t = s([
+  f("cg-empty-state")
+], t);
 export {
-  r as CgEmptyState
+  t as CgEmptyState
 };
 //# sourceMappingURL=cg-empty-state.js.map

package/dist/components/cg-empty-state/cg-empty-state.js.map

@@ -1 +1 @@
-{"version":3,"file":"cg-empty-state.js","sources":["../../../src/components/cg-empty-state/cg-empty-state.ts"],"sourcesContent":["import { LitElement, html, css, nothing, svg } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/**\n * @element cg-empty-state\n * Empty / no-results / error state with icon, title, description, and\n * actions slot. Use `container` to wrap the content in a card or dashed\n * placeholder zone — useful when the empty state sits inside a panel\n * where bare centered text would feel floaty.\n *\n * @example\n * ```html\n * <!-- bare (default) — centered content, no container -->\n * <cg-empty-state variant=\"search\" title=\"No results\" description=\"Try a different query\">\n *   <cg-button slot=\"actions\">Clear filters</cg-button>\n * </cg-empty-state>\n *\n * <!-- card-wrapped — solid bg + border, like cg-card variant=\"elevated\" -->\n * <cg-empty-state container=\"card\" title=\"No customers yet\"\n *   description=\"When you add your first customer, they will appear here.\">\n *   <cg-button slot=\"actions\" variant=\"primary\">Add customer</cg-button>\n * </cg-empty-state>\n *\n * <!-- dashed placeholder — drop-zone / \"click to add\" feel -->\n * <cg-empty-state container=\"dashed\" variant=\"ai\" title=\"Drop a file or paste text\"\n *   description=\"The AI will summarize it for you.\">\n *   <cg-button slot=\"actions\" variant=\"tertiary\">Browse files</cg-button>\n * </cg-empty-state>\n * ```\n *\n * @slot icon - Override the default icon\n * @slot - Extra body content below description\n * @slot actions - Buttons row at the bottom\n */\n@customElement('cg-empty-state')\nexport class CgEmptyState extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host {\n      width: 100%;\n    }\n\n    .root {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      text-align: center;\n      gap: var(--cg-spacing-12);\n      padding: var(--cg-component-empty-state-padding);\n      color: var(--cg-color-surface-container-text);\n      font-family: var(--cg-font-family-primary);\n    }\n\n    /* Container variants — wrap the content in a card-like or\n       dashed-placeholder shell. Default container=\"none\" keeps the bare\n       centered layout (current behaviour). */\n\n    /* Card: solid bg + 1px border + radius. Matches cg-card variant=\n       \"elevated\" treatment so empty states inside dashboards read as\n       proper sections rather than floaty centred text. */\n    :host([container=\"card\"]) .root {\n      background: var(--cg-color-surface-cards-background);\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-component-card-radius);\n    }\n\n    /* Dashed: drop-zone / \"click to add\" placeholder feel. Transparent\n       bg, dashed border, slightly stronger border on hover so the zone\n       reads as actionable when wrapped in a clickable parent. */\n    :host([container=\"dashed\"]) .root {\n      background: transparent;\n      border: var(--cg-border-width-100) dashed var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-component-card-radius);\n      transition: border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    :host([container=\"dashed\"]) .root:hover {\n      border-color: var(--cg-color-surface-cards-hover-border);\n    }\n\n    .icon-wrap {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: var(--cg-component-empty-state-icon-size);\n      height: var(--cg-component-empty-state-icon-size);\n      color: var(--cg-color-surface-container-outlined);\n      margin-bottom: var(--cg-spacing-4);\n    }\n    .icon-wrap svg {\n      width: 100%;\n      height: 100%;\n    }\n\n    :host([variant=\"error\"]) .icon-wrap { color: var(--cg-color-status-error-text-default); }\n    :host([variant=\"success\"]) .icon-wrap { color: var(--cg-color-status-success-text-default); }\n    :host([variant=\"info\"]) .icon-wrap { color: var(--cg-color-status-info-text-default); }\n\n    /* AI variant — accent bubble around the icon, AI brand color */\n    :host([variant=\"ai\"]) .icon-wrap {\n      background: var(--cg-overlay-accent-subtle);\n      border: var(--cg-border-width-50) solid var(--cg-overlay-accent-strong);\n      border-radius: var(--cg-border-radius-full);\n      color: var(--cg-color-accent-text);\n      padding: var(--cg-spacing-12);\n      box-sizing: border-box;\n    }\n\n    .title {\n      font-size: var(--cg-font-size-md);\n      font-weight: var(--cg-font-weight-semibold);\n      color: var(--cg-color-surface-base-text);\n      line-height: var(--cg-line-height-snug);\n      margin: 0;\n    }\n\n    .description {\n      font-size: var(--cg-font-size-sm);\n      color: var(--cg-color-surface-container-outlined);\n      line-height: var(--cg-line-height-relaxed);\n      margin: 0;\n      max-width: 52ch;\n    }\n\n    .actions {\n      display: flex;\n      flex-wrap: wrap;\n      align-items: center;\n      justify-content: center;\n      gap: var(--cg-spacing-12);\n      margin-top: var(--cg-spacing-8);\n    }\n    .actions:empty { display: none; }\n  `];\n\n  @property({ reflect: true }) variant: 'default' | 'search' | 'error' | 'success' | 'info' | 'ai' = 'default';\n  /**\n   * Wrap the empty state in a container shell:\n   *   none   (default) — centered content with padding only (current behaviour)\n   *   card             — solid bg + 1px border + radius (like cg-card)\n   *   dashed           — dashed border + transparent bg (drop-zone / \"click to add\")\n   */\n  @property({ reflect: true }) container: 'none' | 'card' | 'dashed' = 'none';\n  @property() override title = '';\n  @property() description = '';\n  @property() icon = '';\n\n  private _defaultIcon() {\n    switch (this.variant) {\n      case 'search':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <circle cx=\"11\" cy=\"11\" r=\"8\"></circle>\n            <path d=\"m21 21-4.3-4.3\"></path>\n          </svg>\n        `;\n      case 'error':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n            <line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\"></line>\n            <line x1=\"12\" y1=\"16\" x2=\"12.01\" y2=\"16\"></line>\n          </svg>\n        `;\n      case 'success':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\"></path>\n            <polyline points=\"22 4 12 14.01 9 11.01\"></polyline>\n          </svg>\n        `;\n      case 'info':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n            <line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\"></line>\n            <line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\"></line>\n          </svg>\n        `;\n      case 'ai':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <path d=\"M12 3l1.9 4.6L18.5 9.5l-4.6 1.9L12 16l-1.9-4.6L5.5 9.5l4.6-1.9z\"></path>\n            <path d=\"M19 14l.9 2.2L22 17l-2.1.8L19 20l-.9-2.2L16 17l2.1-.8z\"></path>\n          </svg>\n        `;\n      default:\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <polyline points=\"22 12 16 12 14 15 10 15 8 12 2 12\"></polyline>\n            <path d=\"M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z\"></path>\n          </svg>\n        `;\n    }\n  }\n\n  override render() {\n    const role = this.variant === 'error' ? 'alert' : 'status';\n    const titleId = this.title ? 'es-title' : undefined;\n    const descId = this.description ? 'es-desc' : undefined;\n    return html`\n      <div\n        class=\"root\"\n        role=${role}\n        aria-labelledby=${titleId ?? nothing}\n        aria-describedby=${descId ?? nothing}\n      >\n        <div class=\"icon-wrap\" aria-hidden=\"true\">\n          <slot name=\"icon\">${this._defaultIcon()}</slot>\n        </div>\n        ${this.title ? html`<h3 id=${titleId!} class=\"title\">${this.title}</h3>` : nothing}\n        ${this.description ? html`<p id=${descId!} class=\"description\">${this.description}</p>` : nothing}\n        <slot></slot>\n        <div class=\"actions\">\n          <slot name=\"actions\"></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-empty-state': CgEmptyState;\n  }\n}\n"],"names":["CgEmptyState","LitElement","svg","role","titleId","descId","html","nothing","hostBlock","reducedMotion","css","__decorateClass","property","customElement"],"mappings":";;;;;;;;AAoCO,IAAMA,IAAN,cAA2BC,EAAW;AAAA,EAAtC,cAAA;AAAA,UAAA,GAAA,SAAA,GAmGwB,KAAA,UAAsE,WAOtE,KAAA,YAAwC,QACzD,KAAS,QAAQ,IACjB,KAAA,cAAc,IACd,KAAA,OAAO;AAAA,EAAA;AAAA,EAEX,eAAe;AACrB,YAAQ,KAAK,SAAA;AAAA,MACX,KAAK;AACH,eAAOC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAMT,KAAK;AACH,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAOT,KAAK;AACH,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAMT,KAAK;AACH,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAOT,KAAK;AACH,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAMT;AACE,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,EAOb;AAAA,EAES,SAAS;AAChB,UAAMC,IAAO,KAAK,YAAY,UAAU,UAAU,UAC5CC,IAAU,KAAK,QAAQ,aAAa,QACpCC,IAAS,KAAK,cAAc,YAAY;AAC9C,WAAOC;AAAA;AAAA;AAAA,eAGIH,CAAI;AAAA,0BACOC,KAAWG,CAAO;AAAA,2BACjBF,KAAUE,CAAO;AAAA;AAAA;AAAA,8BAGd,KAAK,cAAc;AAAA;AAAA,UAEvC,KAAK,QAAQD,WAAcF,CAAQ,kBAAkB,KAAK,KAAK,UAAUG,CAAO;AAAA,UAChF,KAAK,cAAcD,UAAaD,CAAO,wBAAwB,KAAK,WAAW,SAASE,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOvG;AACF;AAvLaP,EACK,SAAS,CAACQ,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,GAgGnD;AAE4BC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAnGhBZ,EAmGkB,WAAA,WAAA,CAAA;AAOAW,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA1GhBZ,EA0GkB,WAAA,aAAA,CAAA;AACRW,EAAA;AAAA,EAApBC,EAAA;AAAS,GA3GCZ,EA2GU,WAAA,SAAA,CAAA;AACTW,EAAA;AAAA,EAAXC,EAAA;AAAS,GA5GCZ,EA4GC,WAAA,eAAA,CAAA;AACAW,EAAA;AAAA,EAAXC,EAAA;AAAS,GA7GCZ,EA6GC,WAAA,QAAA,CAAA;AA7GDA,IAANW,EAAA;AAAA,EADNE,EAAc,gBAAgB;AAAA,GAClBb,CAAA;"}
+{"version":3,"file":"cg-empty-state.js","sources":["../../../src/components/cg-empty-state/cg-empty-state.ts"],"sourcesContent":["import { LitElement, html, css, nothing, svg } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/**\n * @element cg-empty-state\n * Empty / no-results / error state with icon, title, description, and actions slot.\n *\n * @example\n * ```html\n * <cg-empty-state variant=\"search\" title=\"No results\" description=\"Try a different query\">\n *   <cg-button slot=\"actions\">Clear filters</cg-button>\n * </cg-empty-state>\n * ```\n *\n * @slot icon - Override the default icon\n * @slot - Extra body content below description\n * @slot actions - Buttons row at the bottom\n */\n@customElement('cg-empty-state')\nexport class CgEmptyState extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host {\n      width: 100%;\n    }\n\n    .root {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      text-align: center;\n      gap: var(--cg-spacing-12);\n      padding: var(--cg-component-empty-state-padding);\n      color: var(--cg-color-surface-container-text);\n      font-family: var(--cg-font-family-primary);\n    }\n\n    .icon-wrap {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: var(--cg-component-empty-state-icon-size);\n      height: var(--cg-component-empty-state-icon-size);\n      color: var(--cg-color-empty-state-icon);\n      margin-bottom: var(--cg-spacing-4);\n    }\n    .icon-wrap svg {\n      width: 100%;\n      height: 100%;\n    }\n\n    :host([variant=\"error\"]) .icon-wrap { color: var(--cg-color-status-error-text-default); }\n    :host([variant=\"success\"]) .icon-wrap { color: var(--cg-color-status-success-text-default); }\n    :host([variant=\"info\"]) .icon-wrap { color: var(--cg-color-status-info-text-default); }\n\n    /* AI variant — accent bubble around the icon, AI brand color */\n    :host([variant=\"ai\"]) .icon-wrap {\n      background: var(--cg-overlay-accent-subtle);\n      border: var(--cg-border-width-50) solid var(--cg-overlay-accent-strong);\n      border-radius: var(--cg-border-radius-full);\n      color: var(--cg-color-accent-text);\n      padding: var(--cg-spacing-12);\n      box-sizing: border-box;\n    }\n\n    .title {\n      font-size: var(--cg-font-size-md);\n      font-weight: var(--cg-font-weight-semibold);\n      color: var(--cg-color-empty-state-text-primary);\n      line-height: var(--cg-line-height-snug);\n      margin: 0;\n    }\n\n    .description {\n      font-size: var(--cg-font-size-sm);\n      color: var(--cg-color-empty-state-text-secondary);\n      line-height: var(--cg-line-height-relaxed);\n      margin: 0;\n      max-width: 52ch;\n    }\n\n    .actions {\n      display: flex;\n      flex-wrap: wrap;\n      align-items: center;\n      justify-content: center;\n      gap: var(--cg-spacing-12);\n      margin-top: var(--cg-spacing-8);\n    }\n    .actions[hidden] { display: none; }\n  `];\n\n  @property({ reflect: true }) variant: 'default' | 'search' | 'error' | 'success' | 'info' | 'ai' = 'default';\n  @property() override title = '';\n  @property() description = '';\n  @property() icon = '';\n\n  // The .actions wrapper always contains a <slot>, so `.actions:empty` never\n  // matched — leaving stray margin when no actions are slotted. Track real\n  // slotted content and hide the row when there is none.\n  @state() private _hasActions = false;\n\n  private _onActionsSlotChange(e: Event) {\n    this._hasActions =\n      (e.target as HTMLSlotElement).assignedNodes({ flatten: true }).length > 0;\n  }\n\n  private _defaultIcon() {\n    switch (this.variant) {\n      case 'search':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <circle cx=\"11\" cy=\"11\" r=\"8\"></circle>\n            <path d=\"m21 21-4.3-4.3\"></path>\n          </svg>\n        `;\n      case 'error':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n            <line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\"></line>\n            <line x1=\"12\" y1=\"16\" x2=\"12.01\" y2=\"16\"></line>\n          </svg>\n        `;\n      case 'success':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\"></path>\n            <polyline points=\"22 4 12 14.01 9 11.01\"></polyline>\n          </svg>\n        `;\n      case 'info':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n            <line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\"></line>\n            <line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\"></line>\n          </svg>\n        `;\n      case 'ai':\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <path d=\"M12 3l1.9 4.6L18.5 9.5l-4.6 1.9L12 16l-1.9-4.6L5.5 9.5l4.6-1.9z\"></path>\n            <path d=\"M19 14l.9 2.2L22 17l-2.1.8L19 20l-.9-2.2L16 17l2.1-.8z\"></path>\n          </svg>\n        `;\n      default:\n        return svg`\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <polyline points=\"22 12 16 12 14 15 10 15 8 12 2 12\"></polyline>\n            <path d=\"M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z\"></path>\n          </svg>\n        `;\n    }\n  }\n\n  override render() {\n    const role = this.variant === 'error' ? 'alert' : 'status';\n    const titleId = this.title ? 'es-title' : undefined;\n    const descId = this.description ? 'es-desc' : undefined;\n    return html`\n      <div\n        class=\"root\"\n        role=${role}\n        aria-labelledby=${titleId ?? nothing}\n        aria-describedby=${descId ?? nothing}\n      >\n        <div class=\"icon-wrap\" aria-hidden=\"true\">\n          <slot name=\"icon\">${this._defaultIcon()}</slot>\n        </div>\n        ${this.title ? html`<h3 id=${titleId!} class=\"title\">${this.title}</h3>` : nothing}\n        ${this.description ? html`<p id=${descId!} class=\"description\">${this.description}</p>` : nothing}\n        <slot></slot>\n        <div class=\"actions\" ?hidden=${!this._hasActions}>\n          <slot name=\"actions\" @slotchange=${this._onActionsSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-empty-state': CgEmptyState;\n  }\n}\n"],"names":["CgEmptyState","LitElement","e","svg","role","titleId","descId","html","nothing","hostBlock","reducedMotion","css","__decorateClass","property","state","customElement"],"mappings":";;;;;;;;AAoBO,IAAMA,IAAN,cAA2BC,EAAW;AAAA,EAAtC,cAAA;AAAA,UAAA,GAAA,SAAA,GAyEwB,KAAA,UAAsE,WACvF,KAAS,QAAQ,IACjB,KAAA,cAAc,IACd,KAAA,OAAO,IAKV,KAAQ,cAAc;AAAA,EAAA;AAAA,EAEvB,qBAAqBC,GAAU;AACrC,SAAK,cACFA,EAAE,OAA2B,cAAc,EAAE,SAAS,GAAA,CAAM,EAAE,SAAS;AAAA,EAC5E;AAAA,EAEQ,eAAe;AACrB,YAAQ,KAAK,SAAA;AAAA,MACX,KAAK;AACH,eAAOC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAMT,KAAK;AACH,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAOT,KAAK;AACH,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAMT,KAAK;AACH,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAOT,KAAK;AACH,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAMT;AACE,eAAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,EAOb;AAAA,EAES,SAAS;AAChB,UAAMC,IAAO,KAAK,YAAY,UAAU,UAAU,UAC5CC,IAAU,KAAK,QAAQ,aAAa,QACpCC,IAAS,KAAK,cAAc,YAAY;AAC9C,WAAOC;AAAA;AAAA;AAAA,eAGIH,CAAI;AAAA,0BACOC,KAAWG,CAAO;AAAA,2BACjBF,KAAUE,CAAO;AAAA;AAAA;AAAA,8BAGd,KAAK,cAAc;AAAA;AAAA,UAEvC,KAAK,QAAQD,WAAcF,CAAQ,kBAAkB,KAAK,KAAK,UAAUG,CAAO;AAAA,UAChF,KAAK,cAAcD,UAAaD,CAAO,wBAAwB,KAAK,WAAW,SAASE,CAAO;AAAA;AAAA,uCAElE,CAAC,KAAK,WAAW;AAAA,6CACX,KAAK,oBAAoB;AAAA;AAAA;AAAA;AAAA,EAIpE;AACF;AAhKaR,EACK,SAAS,CAACS,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,GAsEnD;AAE4BC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAzEhBb,EAyEkB,WAAA,WAAA,CAAA;AACRY,EAAA;AAAA,EAApBC,EAAA;AAAS,GA1ECb,EA0EU,WAAA,SAAA,CAAA;AACTY,EAAA;AAAA,EAAXC,EAAA;AAAS,GA3ECb,EA2EC,WAAA,eAAA,CAAA;AACAY,EAAA;AAAA,EAAXC,EAAA;AAAS,GA5ECb,EA4EC,WAAA,QAAA,CAAA;AAKKY,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAjFId,EAiFM,WAAA,eAAA,CAAA;AAjFNA,IAANY,EAAA;AAAA,EADNG,EAAc,gBAAgB;AAAA,GAClBf,CAAA;"}

package/dist/components/cg-file-input/cg-file-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cg-file-input.d.ts","sourceRoot":"","sources":["../../../src/components/cg-file-input/cg-file-input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAA2B,MAAM,KAAK,CAAC;AAI1D,2EAA2E;AAC3E,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,GAAG,OAAO,CAAC;AACjE,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,UAAU,CAAC;IAClB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,OAAgB,MAAM,4BAuTnB;IAEH,MAAM,CAAC,cAAc,UAAQ;IAC7B,OAAO,CAAC,UAAU,CAAC,CAAmB;;IAS1B,KAAK,SAAM;IACX,WAAW,SAAwC;IACnD,MAAM,SAAM;IACZ,MAAM,SAAM;IACZ,IAAI,SAAM;IACO,QAAQ,UAAS;IACK,OAAO,SAAK;IACX,QAAQ,SAAK;IACrB,QAAQ,UAAS;IACjB,KAAK,UAAS;IACd,OAAO,UAAS;IAC/B,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAChC,OAAO,EAAE,UAAU,GAAG,SAAS,CAAc;IAC1E,8FAA8F;IAClF,OAAO,EAAE,EAAE,GAAG,MAAM,GAAG,aAAa,CAAM;IACtD,+FAA+F;IAClE,KAAK,UAAS;IAElC,OAAO,CAAC,MAAM,CAAc;IAC5B,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,aAAa,CAAM;IAEP,OAAO,CAAC,QAAQ,CAAoB;IAEjE,OAAO,CAAC,SAAS,CAA2B;IAC5C,OAAO,CAAC,UAAU,CAAmC;IAErD,OAAO,CAAC,WAAW;IAMnB,wGAAwG;IACxG,OAAO,CAAC,SAAS;IAejB,OAAO,CAAC,WAAW;IAUnB,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,cAAc;IAqBtB,OAAO,CAAC,SAAS;IA+BjB,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,WAAW;IAgCnB,oFAAoF;IACpF,QAAQ,IAAI,IAAI;IAmBhB;;;;OAIG;IACH,aAAa,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,GAAG,IAAI;IAQrD,OAAO,CAAC,SAAS;IAMjB,OAAO,CAAC,YAAY,CAkBlB;IAEO,iBAAiB,IAAI,IAAI;IAKzB,oBAAoB,IAAI,IAAI;IAQrC,OAAO,CAAC,aAAa;IAIrB,OAAO,CAAC,YAAY,CAAK;IAEzB,OAAO,CAAC,WAAW;IAQnB,OAAO,CAAC,gBAAgB;IAOxB,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,gBAAgB;IAKxB,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,cAAc;IAQtB,6DAA6D;IAC7D,OAAO,CAAC,eAAe;IA6BvB,OAAO,CAAC,cAAc;IAsDb,MAAM;CAoFhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}
+{"version":3,"file":"cg-file-input.d.ts","sourceRoot":"","sources":["../../../src/components/cg-file-input/cg-file-input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAA2B,MAAM,KAAK,CAAC;AAI1D,2EAA2E;AAC3E,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,GAAG,OAAO,CAAC;AACjE,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,UAAU,CAAC;IAClB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,OAAgB,MAAM,4BAsTnB;IAEH,MAAM,CAAC,cAAc,UAAQ;IAC7B,OAAO,CAAC,UAAU,CAAC,CAAmB;;IAS1B,KAAK,SAAM;IACX,WAAW,SAAwC;IACnD,MAAM,SAAM;IACZ,MAAM,SAAM;IACZ,IAAI,SAAM;IACO,QAAQ,UAAS;IACK,OAAO,SAAK;IACX,QAAQ,SAAK;IACrB,QAAQ,UAAS;IACjB,KAAK,UAAS;IACd,OAAO,UAAS;IAC/B,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAChC,OAAO,EAAE,UAAU,GAAG,SAAS,CAAc;IAC1E,8FAA8F;IAClF,OAAO,EAAE,EAAE,GAAG,MAAM,GAAG,aAAa,CAAM;IACtD,+FAA+F;IAClE,KAAK,UAAS;IAElC,OAAO,CAAC,MAAM,CAAc;IAC5B,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,aAAa,CAAM;IAEP,OAAO,CAAC,QAAQ,CAAoB;IAEjE,OAAO,CAAC,SAAS,CAA2B;IAC5C,OAAO,CAAC,UAAU,CAAmC;IAErD,OAAO,CAAC,WAAW;IAMnB,wGAAwG;IACxG,OAAO,CAAC,SAAS;IAejB,OAAO,CAAC,WAAW;IAUnB,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,cAAc;IAqBtB,OAAO,CAAC,SAAS;IA+BjB,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,WAAW;IAgCnB,oFAAoF;IACpF,QAAQ,IAAI,IAAI;IAmBhB;;;;OAIG;IACH,aAAa,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,GAAG,IAAI;IAQrD,OAAO,CAAC,SAAS;IAMjB,OAAO,CAAC,YAAY,CAkBlB;IAEO,iBAAiB,IAAI,IAAI;IAKzB,oBAAoB,IAAI,IAAI;IAQrC,OAAO,CAAC,aAAa;IAIrB,OAAO,CAAC,YAAY,CAAK;IAEzB,OAAO,CAAC,WAAW;IAQnB,OAAO,CAAC,gBAAgB;IAOxB,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,gBAAgB;IAKxB,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,cAAc;IAQtB,6DAA6D;IAC7D,OAAO,CAAC,eAAe;IA6BvB,OAAO,CAAC,cAAc;IAsDb,MAAM;CAoFhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}

package/dist/components/cg-file-input/cg-file-input.js

@@ -1,12 +1,12 @@
-import { css as p, LitElement as v, svg as g, nothing as d, html as c } from "lit";
-import { property as l, state as h, query as f, customElement as b } from "lit/decorators.js";
-import { h as m, r as _ } from "../../chunks/premium.css-9I4kHrsl.js";
-var w = Object.defineProperty, y = Object.getOwnPropertyDescriptor, n = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? y(t, a) : t, i = e.length - 1, u; i >= 0; i--)
+import { css as p, LitElement as f, svg as g, nothing as d, html as c } from "lit";
+import { property as l, state as h, query as v, customElement as b } from "lit/decorators.js";
+import { h as m, r as _, g as w } from "../../chunks/premium.css-DHekUEUt.js";
+var y = Object.defineProperty, x = Object.getOwnPropertyDescriptor, n = (e, t, a, s) => {
+  for (var r = s > 1 ? void 0 : s ? x(t, a) : t, i = e.length - 1, u; i >= 0; i--)
     (u = e[i]) && (r = (s ? u(t, a, r) : u(r)) || r);
-  return s && r && w(t, a, r), r;
+  return s && r && y(t, a, r), r;
 };
-let o = class extends v {
+let o = class extends f {
   constructor() {
     super(), this.label = "", this.placeholder = "Drop files here or click to browse", this.helper = "", this.accept = "", this.name = "", this.multiple = !1, this.maxSize = 0, this.maxFiles = 0, this.disabled = !1, this.error = !1, this.success = !1, this.size = "md", this.variant = "dropzone", this.capture = "", this.paste = !1, this._files = [], this._dragging = !1, this._announcement = "", this._previews = /* @__PURE__ */ new Map(), this._statusMap = /* @__PURE__ */ new Map(), this._handlePaste = (e) => {
       if (!this.paste || this.disabled) return;
@@ -412,9 +412,8 @@ o.styles = [m, _, p`
       background: var(--cg-color-action-tertiary-background-hover);
     }
     .compact:focus-visible {
-      outline: none;
       border-color: var(--cg-color-input-border-focus);
-      box-shadow: 0 0 0 3px var(--cg-overlay-accent-strong);
+      ${w}
     }
     .compact.dragging {
       border-style: dashed;
@@ -673,7 +672,7 @@ n([
   h()
 ], o.prototype, "_announcement", 2);
 n([
-  f('input[type="file"]')
+  v('input[type="file"]')
 ], o.prototype, "_inputEl", 2);
 o = n([
   b("cg-file-input")

package/dist/components/cg-file-input/cg-file-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"cg-file-input.js","sources":["../../../src/components/cg-file-input/cg-file-input.ts"],"sourcesContent":["import { LitElement, html, css, nothing, svg } from 'lit';\nimport { customElement, property, state, query } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/** Per-file upload status driven by the consumer via `setFileStatus()`. */\nexport type FileStatus = 'idle' | 'uploading' | 'done' | 'error';\nexport interface FileStatusInfo {\n  state: FileStatus;\n  /** 0–100 — only used when state === 'uploading' */\n  progress?: number;\n  /** Optional error message, surfaced when state === 'error' */\n  error?: string;\n}\n\n/**\n * @element cg-file-input\n * File picker with drag-and-drop, paste-from-clipboard, image thumbnail\n * previews, file-type-aware icons, three sizes (sm | md | lg) plus a compact\n * button-style variant. Live-region announcements + focus management included.\n *\n * Consumers drive per-file upload state via `setFileStatus(file, info)`; the\n * component renders a status pill + progress bar accordingly. The component\n * itself does not perform uploads — it's a UI primitive.\n *\n * @example\n * ```html\n * <cg-file-input label=\"Upload files\" accept=\".pdf,.png,.jpg\" multiple max-size=\"5242880\"></cg-file-input>\n * <cg-file-input variant=\"compact\" multiple></cg-file-input>\n * <cg-file-input size=\"lg\" accept=\"image/*\" multiple paste></cg-file-input>\n * <cg-file-input capture=\"environment\" accept=\"image/*\"></cg-file-input>\n * ```\n *\n * @fires {CustomEvent<{files: File[]}>} cg-file-change\n * @fires {CustomEvent<{files: File[], reason: string}>} cg-file-reject\n * @fires {CustomEvent<{file: File}>} cg-file-remove\n * @fires {CustomEvent<{}>} cg-file-clear - All files cleared via the bulk action\n */\n@customElement('cg-file-input')\nexport class CgFileInput extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host { display: block; }\n\n    label {\n      display: block;\n      margin-bottom: var(--cg-spacing-6);\n      font-size: var(--cg-font-size-sm);\n      font-weight: var(--cg-font-weight-medium);\n      color: var(--cg-color-surface-base-text);\n    }\n\n    /* ── Dropzone variant (default) ── */\n    .dropzone {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      gap: var(--cg-spacing-12);\n      padding: var(--cg-spacing-32) var(--cg-spacing-24);\n      background: var(--cg-color-input-background-default);\n      border: var(--cg-border-width-100) dashed var(--cg-color-input-border-default);\n      border-radius: var(--cg-component-file-input-radius);\n      color: var(--cg-color-surface-container-outlined);\n      cursor: pointer;\n      text-align: center;\n      transition:\n        border-color var(--cg-transition-duration-default) var(--cg-transition-easing-default),\n        background var(--cg-transition-duration-default) var(--cg-transition-easing-default),\n        box-shadow var(--cg-transition-duration-default) var(--cg-transition-easing-default);\n    }\n    :host([size=\"sm\"]) .dropzone { min-height: var(--cg-component-file-input-min-height-sm); padding: var(--cg-spacing-20) var(--cg-spacing-16); gap: var(--cg-spacing-8); }\n    :host([size=\"md\"]) .dropzone { min-height: var(--cg-component-file-input-min-height-md); }\n    :host([size=\"lg\"]) .dropzone { min-height: var(--cg-component-file-input-min-height-lg); padding: var(--cg-spacing-40) var(--cg-spacing-32); gap: var(--cg-spacing-16); }\n\n    .dropzone:hover:not(.disabled) {\n      border-color: var(--cg-color-action-primary-border-default);\n      background: var(--cg-overlay-accent-subtle);\n    }\n    .dropzone.dragging {\n      border-style: solid;\n      border-color: var(--cg-color-action-primary-border-default);\n      background: var(--cg-overlay-accent-light);\n      color: var(--cg-color-surface-base-text);\n      box-shadow: 0 0 0 var(--cg-spacing-4) var(--cg-overlay-accent-subtle);\n    }\n    .dropzone:focus-visible {\n      outline: none;\n      box-shadow:\n        0 0 0 var(--cg-focus-ring-offset) var(--cg-color-focus-ring-offset),\n        0 0 0 calc(var(--cg-focus-ring-offset) + var(--cg-focus-ring-width)) var(--cg-color-focus-ring);\n    }\n    .dropzone.disabled { opacity: 0.5; cursor: not-allowed; }\n\n    :host([error]) .dropzone { border-color: var(--cg-color-status-error-border-default); }\n    :host([success]) .dropzone { border-color: var(--cg-color-status-success-border-default); }\n\n    .icon {\n      color: var(--cg-color-accent-text);\n      transition: transform var(--cg-transition-duration-default) var(--cg-transition-easing-spring);\n    }\n    .dropzone:hover:not(.disabled) .icon {\n      transform: translateY(calc(var(--cg-spacing-4) * -1));\n    }\n    .dropzone.dragging .icon {\n      transform: scale(1.15) translateY(calc(var(--cg-spacing-2) * -1));\n    }\n    .icon svg { width: var(--cg-icon-size-300); height: var(--cg-icon-size-300); }\n    :host([size=\"sm\"]) .icon svg { width: var(--cg-icon-size-200); height: var(--cg-icon-size-200); }\n    :host([size=\"lg\"]) .icon svg { width: var(--cg-icon-size-400); height: var(--cg-icon-size-400); }\n\n    .title {\n      font-size: var(--cg-font-size-sm);\n      font-weight: var(--cg-font-weight-medium);\n      color: var(--cg-color-surface-base-text);\n    }\n    :host([size=\"lg\"]) .title { font-size: var(--cg-font-size-base); }\n    .subtitle {\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n    }\n    .subtitles { display: flex; flex-direction: column; gap: var(--cg-spacing-2); }\n\n    /* ── Compact variant — button-style with drag overlay ── */\n    .compact {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-8);\n      padding: 0 var(--cg-spacing-16);\n      height: var(--cg-component-input-height-md);\n      background: var(--cg-color-input-background-default);\n      border: var(--cg-border-width-50) solid var(--cg-color-input-border-default);\n      border-radius: var(--cg-component-input-radius);\n      color: var(--cg-color-surface-base-text);\n      font-size: var(--cg-font-size-sm);\n      font-weight: var(--cg-font-weight-medium);\n      font-family: inherit;\n      cursor: pointer;\n      transition:\n        border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        background var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        box-shadow var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .compact:hover:not(.disabled) {\n      border-color: var(--cg-color-input-border-hover);\n      background: var(--cg-color-action-tertiary-background-hover);\n    }\n    .compact:focus-visible {\n      outline: none;\n      border-color: var(--cg-color-input-border-focus);\n      box-shadow: 0 0 0 3px var(--cg-overlay-accent-strong);\n    }\n    .compact.dragging {\n      border-style: dashed;\n      border-color: var(--cg-color-action-primary-border-default);\n      background: var(--cg-overlay-accent-light);\n    }\n    .compact.disabled { opacity: 0.5; cursor: not-allowed; }\n    .compact-icon { color: var(--cg-color-input-icon-default); display: flex; flex-shrink: 0; }\n    .compact-icon svg { width: var(--cg-icon-size-100); height: var(--cg-icon-size-100); }\n    .compact-count {\n      margin-left: auto;\n      padding: var(--cg-spacing-2) var(--cg-spacing-8);\n      background: var(--cg-color-action-tertiary-background-hover);\n      border-radius: var(--cg-border-radius-full);\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-text);\n    }\n\n    /* ── Hidden native input ── */\n    input[type=\"file\"] {\n      position: absolute;\n      opacity: 0;\n      width: 0;\n      height: 0;\n      pointer-events: none;\n    }\n\n    /* ── File chip list ── */\n    .files {\n      display: flex;\n      flex-direction: column;\n      gap: var(--cg-spacing-8);\n      margin-top: var(--cg-spacing-16);\n    }\n    @keyframes fileChipIn {\n      from { opacity: 0; transform: translateY(calc(var(--cg-spacing-4) * -1)); }\n      to { opacity: 1; transform: translateY(0); }\n    }\n    .file {\n      display: flex;\n      align-items: center;\n      gap: var(--cg-spacing-12);\n      padding: var(--cg-spacing-8) var(--cg-spacing-12);\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-border-radius-100);\n      animation: fileChipIn var(--cg-transition-duration-default) var(--cg-transition-easing-ease-out);\n      transition: border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .file:hover {\n      border-color: var(--cg-color-input-border-hover);\n    }\n    .file-thumb {\n      flex-shrink: 0;\n      width: var(--cg-spacing-32);\n      height: var(--cg-spacing-32);\n      border-radius: var(--cg-border-radius-50);\n      overflow: hidden;\n      background: var(--cg-color-surface-cards-background);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n    .file-thumb.preview { padding: 0; }\n    .file-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }\n    .file-thumb svg { width: var(--cg-icon-size-150); height: var(--cg-icon-size-150); color: var(--cg-color-surface-container-outlined); }\n    .file-thumb.image svg { color: var(--cg-color-accent-text); }\n    .file-thumb.pdf svg { color: var(--cg-color-status-error-text-default); }\n    .file-thumb.doc svg { color: var(--cg-color-status-info-text-default); }\n    .file-thumb.media svg { color: var(--cg-color-status-success-text-default); }\n    .file-thumb.archive svg { color: var(--cg-color-status-warning-text-default); }\n    .file-info { flex: 1; min-width: 0; }\n    .file-name {\n      display: block;\n      font-size: var(--cg-font-size-sm);\n      color: var(--cg-color-surface-base-text);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      font-weight: var(--cg-font-weight-medium);\n    }\n    .file-size {\n      display: block;\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n    }\n    .file-remove {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: var(--cg-spacing-32);\n      height: var(--cg-spacing-32);\n      border: none;\n      background: none;\n      color: var(--cg-color-surface-container-outlined);\n      cursor: pointer;\n      border-radius: var(--cg-border-radius-full);\n      transition:\n        background var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        transform var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .file-remove:hover {\n      background: var(--cg-color-status-error-background-default);\n      color: var(--cg-color-status-error-text-default);\n    }\n    .file-remove:active {\n      transform: scale(var(--cg-interaction-press-scale));\n    }\n\n    .helper {\n      margin-top: var(--cg-spacing-6);\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n    }\n    :host([error]) .helper { color: var(--cg-color-status-error-text-default); }\n\n    /* ── Bulk actions toolbar ── */\n    .bulk-actions {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      margin-top: var(--cg-spacing-12);\n      margin-bottom: calc(var(--cg-spacing-8) * -1);\n    }\n    .bulk-count {\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n    }\n    .bulk-clear {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-4);\n      padding: var(--cg-spacing-4) var(--cg-spacing-8);\n      border: none;\n      background: transparent;\n      color: var(--cg-color-status-error-text-default);\n      font-size: var(--cg-font-size-xs);\n      font-weight: var(--cg-font-weight-medium);\n      font-family: inherit;\n      cursor: pointer;\n      border-radius: var(--cg-border-radius-50);\n      transition: background var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .bulk-clear:hover { background: var(--cg-color-status-error-background-default); }\n    .bulk-clear:focus-visible {\n      outline: none;\n      box-shadow:\n        0 0 0 var(--cg-focus-ring-offset) var(--cg-color-focus-ring-offset),\n        0 0 0 calc(var(--cg-focus-ring-offset) + var(--cg-focus-ring-width)) var(--cg-color-focus-ring);\n    }\n\n    /* ── Per-file status pill + progress bar ── */\n    .status-pill {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-4);\n      padding: var(--cg-spacing-2) var(--cg-spacing-8);\n      border-radius: var(--cg-border-radius-full);\n      font-size: var(--cg-font-size-xs);\n      font-weight: var(--cg-font-weight-medium);\n      flex-shrink: 0;\n    }\n    .status-pill.uploading {\n      background: var(--cg-overlay-accent-light);\n      color: var(--cg-color-accent-text);\n    }\n    .status-pill.done {\n      background: var(--cg-color-status-success-background-default);\n      color: var(--cg-color-status-success-text-default);\n    }\n    .status-pill.error {\n      background: var(--cg-color-status-error-background-default);\n      color: var(--cg-color-status-error-text-default);\n    }\n    .progress-track {\n      height: var(--cg-spacing-2);\n      margin-top: var(--cg-spacing-4);\n      background: var(--cg-color-surface-container-background);\n      border-radius: var(--cg-border-radius-full);\n      overflow: hidden;\n    }\n    .progress-fill {\n      height: 100%;\n      background: var(--cg-color-accent-text);\n      border-radius: var(--cg-border-radius-full);\n      transition: width var(--cg-transition-duration-default) var(--cg-transition-easing-ease-out);\n    }\n\n    /* ── Visually-hidden live region for screen readers ── */\n    .sr-only {\n      position: absolute;\n      width: 1px;\n      height: 1px;\n      padding: 0;\n      margin: -1px;\n      overflow: hidden;\n      clip: rect(0, 0, 0, 0);\n      white-space: nowrap;\n      border: 0;\n    }\n  `];\n\n  static formAssociated = true;\n  private _internals?: ElementInternals;\n\n  constructor() {\n    super();\n    if (typeof this.attachInternals === 'function') {\n      this._internals = this.attachInternals();\n    }\n  }\n\n  @property() label = '';\n  @property() placeholder = 'Drop files here or click to browse';\n  @property() helper = '';\n  @property() accept = '';\n  @property() name = '';\n  @property({ type: Boolean }) multiple = false;\n  @property({ type: Number, attribute: 'max-size' }) maxSize = 0;\n  @property({ type: Number, attribute: 'max-files' }) maxFiles = 0;\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  @property({ type: Boolean, reflect: true }) error = false;\n  @property({ type: Boolean, reflect: true }) success = false;\n  @property({ reflect: true }) size: 'sm' | 'md' | 'lg' = 'md';\n  @property({ reflect: true }) variant: 'dropzone' | 'compact' = 'dropzone';\n  /** Mobile camera capture: 'user' (front) or 'environment' (rear). Pass-through to <input>. */\n  @property() capture: '' | 'user' | 'environment' = '';\n  /** Accept files pasted from the clipboard (Ctrl/Cmd+V) when no editable element is focused. */\n  @property({ type: Boolean }) paste = false;\n\n  @state() private _files: File[] = [];\n  @state() private _dragging = false;\n  @state() private _announcement = '';\n\n  @query('input[type=\"file\"]') private _inputEl!: HTMLInputElement;\n\n  private _previews = new Map<File, string>();\n  private _statusMap = new Map<File, FileStatusInfo>();\n\n  private _formatSize(bytes: number): string {\n    if (bytes < 1024) return `${bytes} B`;\n    if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;\n    return `${(bytes / (1024 * 1024)).toFixed(2)} MB`;\n  }\n\n  /** Categorize a file by MIME / extension into one of: image | pdf | doc | media | archive | default. */\n  private _fileKind(file: File): 'image' | 'pdf' | 'doc' | 'media' | 'archive' | 'default' {\n    const type = file.type;\n    const name = file.name.toLowerCase();\n    if (type.startsWith('image/')) return 'image';\n    if (type === 'application/pdf' || name.endsWith('.pdf')) return 'pdf';\n    if (type.startsWith('video/') || type.startsWith('audio/')) return 'media';\n    if (/\\.(zip|rar|7z|tar|gz|bz2)$/i.test(name)) return 'archive';\n    if (/\\.(doc|docx|xls|xlsx|ppt|pptx|txt|md|rtf|csv)$/i.test(name) ||\n        type.startsWith('text/') ||\n        type.includes('word') ||\n        type.includes('sheet') ||\n        type.includes('presentation')) return 'doc';\n    return 'default';\n  }\n\n  private _previewFor(file: File): string | null {\n    if (!file.type.startsWith('image/')) return null;\n    let url = this._previews.get(file);\n    if (!url) {\n      url = URL.createObjectURL(file);\n      this._previews.set(file, url);\n    }\n    return url;\n  }\n\n  private _revokePreview(file: File): void {\n    const url = this._previews.get(file);\n    if (url) {\n      URL.revokeObjectURL(url);\n      this._previews.delete(file);\n    }\n  }\n\n  private _validateFiles(files: File[]): { valid: File[]; rejected: File[]; reason: string } {\n    const valid: File[] = [];\n    const rejected: File[] = [];\n    let reason = '';\n    for (const file of files) {\n      if (this.maxSize > 0 && file.size > this.maxSize) {\n        rejected.push(file);\n        reason = `File exceeds ${this._formatSize(this.maxSize)}`;\n        continue;\n      }\n      valid.push(file);\n    }\n    if (this.maxFiles > 0 && this._files.length + valid.length > this.maxFiles) {\n      const allowed = this.maxFiles - this._files.length;\n      rejected.push(...valid.slice(allowed));\n      valid.splice(allowed);\n      reason = `Maximum ${this.maxFiles} files allowed`;\n    }\n    return { valid, rejected, reason };\n  }\n\n  private _addFiles(incomingFiles: FileList | null): void {\n    if (!incomingFiles) return;\n    const arr = Array.from(incomingFiles);\n    const { valid, rejected, reason } = this._validateFiles(arr);\n\n    if (rejected.length > 0) {\n      this._announce(`${rejected.length} file${rejected.length === 1 ? '' : 's'} rejected: ${reason}`);\n      this.dispatchEvent(new CustomEvent('cg-file-reject', {\n        detail: { files: rejected, reason },\n        bubbles: true,\n        composed: true,\n      }));\n    }\n\n    if (valid.length > 0) {\n      if (this.multiple) {\n        this._files = [...this._files, ...valid];\n      } else {\n        this._files.forEach(f => { this._revokePreview(f); this._statusMap.delete(f); });\n        this._files = valid.slice(0, 1);\n      }\n      this._announce(`${valid.length} file${valid.length === 1 ? '' : 's'} added: ${valid.map(f => f.name).join(', ')}`);\n      this._updateFormValue();\n      this.dispatchEvent(new CustomEvent('cg-file-change', {\n        detail: { files: this._files },\n        bubbles: true,\n        composed: true,\n      }));\n    }\n  }\n\n  private _updateFormValue(): void {\n    if (!this._internals) return;\n    const formData = new FormData();\n    for (const file of this._files) {\n      formData.append(this.name || 'files', file);\n    }\n    this._internals.setFormValue(formData);\n  }\n\n  private _removeFile(idx: number): void {\n    const file = this._files[idx];\n    if (!file) return;\n    this._revokePreview(file);\n    this._statusMap.delete(file);\n    const wasLast = this._files.length === 1;\n    const nextIdx = idx >= this._files.length - 1 ? idx - 1 : idx;\n    this._files = this._files.filter((_, i) => i !== idx);\n    this._announce(`Removed ${file.name}`);\n    this._updateFormValue();\n    this.dispatchEvent(new CustomEvent('cg-file-remove', {\n      detail: { file },\n      bubbles: true,\n      composed: true,\n    }));\n    this.dispatchEvent(new CustomEvent('cg-file-change', {\n      detail: { files: this._files },\n      bubbles: true,\n      composed: true,\n    }));\n    // Focus management: move focus to the next remove button, or back to the trigger.\n    this.updateComplete.then(() => {\n      if (wasLast) {\n        const trigger = this.shadowRoot?.querySelector<HTMLElement>('.dropzone, .compact');\n        trigger?.focus();\n      } else {\n        const buttons = this.shadowRoot?.querySelectorAll<HTMLButtonElement>('.file-remove');\n        buttons?.[Math.max(0, nextIdx)]?.focus();\n      }\n    });\n  }\n\n  /** Public: clear all selected files. Fires `cg-file-clear` and `cg-file-change`. */\n  clearAll(): void {\n    if (this._files.length === 0) return;\n    this._files.forEach(f => { this._revokePreview(f); this._statusMap.delete(f); });\n    const cleared = this._files.length;\n    this._files = [];\n    this._announce(`Cleared ${cleared} file${cleared === 1 ? '' : 's'}`);\n    this._updateFormValue();\n    this.dispatchEvent(new CustomEvent('cg-file-clear', { bubbles: true, composed: true, detail: {} }));\n    this.dispatchEvent(new CustomEvent('cg-file-change', {\n      detail: { files: this._files },\n      bubbles: true,\n      composed: true,\n    }));\n    this.updateComplete.then(() => {\n      const trigger = this.shadowRoot?.querySelector<HTMLElement>('.dropzone, .compact');\n      trigger?.focus();\n    });\n  }\n\n  /**\n   * Public: set the upload status for a given file. Renders a status pill +\n   * progress bar inside the corresponding chip. The component does not perform\n   * uploads — call this from your upload pipeline.\n   */\n  setFileStatus(file: File, info: FileStatusInfo): void {\n    if (!this._files.includes(file)) return;\n    this._statusMap.set(file, info);\n    this.requestUpdate();\n    if (info.state === 'done') this._announce(`${file.name} uploaded`);\n    else if (info.state === 'error') this._announce(`${file.name} failed: ${info.error ?? 'upload error'}`);\n  }\n\n  private _announce(message: string): void {\n    // Force change so AT re-reads even when same message repeats.\n    this._announcement = '';\n    requestAnimationFrame(() => { this._announcement = message; });\n  }\n\n  private _handlePaste = (e: ClipboardEvent) => {\n    if (!this.paste || this.disabled) return;\n    // Don't hijack paste when the user is typing in an editable element.\n    const active = document.activeElement as HTMLElement | null;\n    const inEditable =\n      !!active && (\n        active.tagName === 'INPUT' ||\n        active.tagName === 'TEXTAREA' ||\n        active.isContentEditable ||\n        // shadow DOM: check the deepest active element\n        active.shadowRoot?.activeElement instanceof HTMLElement\n      );\n    if (inEditable && active !== this) return;\n    const files = e.clipboardData?.files;\n    if (files && files.length > 0) {\n      e.preventDefault();\n      this._addFiles(files);\n    }\n  };\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    window.addEventListener('paste', this._handlePaste);\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    window.removeEventListener('paste', this._handlePaste);\n    this._previews.forEach(url => URL.revokeObjectURL(url));\n    this._previews.clear();\n    this._statusMap.clear();\n  }\n\n  private _handleChange(e: Event): void {\n    this._addFiles((e.target as HTMLInputElement).files);\n  }\n\n  private _dragCounter = 0;\n\n  private _handleDrop(e: DragEvent): void {\n    e.preventDefault();\n    this._dragging = false;\n    this._dragCounter = 0;\n    if (this.disabled) return;\n    this._addFiles(e.dataTransfer?.files ?? null);\n  }\n\n  private _handleDragEnter(e: DragEvent): void {\n    e.preventDefault();\n    if (this.disabled) return;\n    this._dragCounter++;\n    this._dragging = true;\n  }\n\n  private _handleDragOver(e: DragEvent): void {\n    e.preventDefault();\n  }\n\n  private _handleDragLeave(): void {\n    this._dragCounter = Math.max(0, this._dragCounter - 1);\n    if (this._dragCounter === 0) this._dragging = false;\n  }\n\n  private _handleClick(): void {\n    if (this.disabled) return;\n    this._inputEl?.click();\n  }\n\n  private _handleKeydown(e: KeyboardEvent): void {\n    if (this.disabled) return;\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      this._inputEl?.click();\n    }\n  }\n\n  /** Render a category-aware SVG icon for a chip thumbnail. */\n  private _renderKindIcon(kind: 'image' | 'pdf' | 'doc' | 'media' | 'archive' | 'default') {\n    return svg`\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.75\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n        ${kind === 'image' ? svg`\n          <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/>\n          <circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\"/>\n          <path d=\"M21 15l-5-5L5 21\"/>\n        ` : kind === 'pdf' ? svg`\n          <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>\n          <polyline points=\"14 2 14 8 20 8\"/>\n          <text x=\"8\" y=\"17\" font-size=\"6\" font-family=\"sans-serif\" font-weight=\"700\" fill=\"currentColor\" stroke=\"none\">PDF</text>\n        ` : kind === 'doc' ? svg`\n          <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>\n          <polyline points=\"14 2 14 8 20 8\"/>\n          <line x1=\"8\" y1=\"13\" x2=\"16\" y2=\"13\"/>\n          <line x1=\"8\" y1=\"17\" x2=\"14\" y2=\"17\"/>\n        ` : kind === 'media' ? svg`\n          <polygon points=\"5 3 19 12 5 21 5 3\" fill=\"currentColor\"/>\n        ` : kind === 'archive' ? svg`\n          <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/>\n          <line x1=\"12\" y1=\"3\" x2=\"12\" y2=\"21\" stroke-dasharray=\"2 2\"/>\n        ` : svg`\n          <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>\n          <polyline points=\"14 2 14 8 20 8\"/>\n        `}\n      </svg>\n    `;\n  }\n\n  private _renderTrigger() {\n    if (this.variant === 'compact') {\n      const count = this._files.length;\n      return html`\n        <button\n          type=\"button\"\n          class=\"compact ${this._dragging ? 'dragging' : ''} ${this.disabled ? 'disabled' : ''}\"\n          ?disabled=${this.disabled}\n          @click=${this._handleClick}\n          @drop=${this._handleDrop}\n          @dragenter=${this._handleDragEnter}\n          @dragover=${this._handleDragOver}\n          @dragleave=${this._handleDragLeave}\n        >\n          <span class=\"compact-icon\" aria-hidden=\"true\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.75\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n              <path d=\"M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48\"/>\n            </svg>\n          </span>\n          <span>${this._dragging ? 'Drop to attach' : (count > 0 ? 'Add more files' : 'Attach files')}</span>\n          ${count > 0 ? html`<span class=\"compact-count\">${count}</span>` : nothing}\n        </button>\n      `;\n    }\n    return html`\n      <div\n        class=\"dropzone ${this._dragging ? 'dragging' : ''} ${this.disabled ? 'disabled' : ''}\"\n        role=\"button\"\n        tabindex=${this.disabled ? '-1' : '0'}\n        aria-label=${this.label || 'File upload'}\n        aria-disabled=${this.disabled ? 'true' : 'false'}\n        @click=${this._handleClick}\n        @keydown=${this._handleKeydown}\n        @drop=${this._handleDrop}\n        @dragenter=${this._handleDragEnter}\n        @dragover=${this._handleDragOver}\n        @dragleave=${this._handleDragLeave}\n      >\n        <div class=\"icon\">\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/>\n            <polyline points=\"17 8 12 3 7 8\"/>\n            <line x1=\"12\" y1=\"3\" x2=\"12\" y2=\"15\"/>\n          </svg>\n        </div>\n        <div class=\"title\">${this.placeholder}</div>\n        <div class=\"subtitles\">\n          ${this.accept ? html`<div class=\"subtitle\">Accepted: ${this.accept}</div>` : nothing}\n          ${this.maxSize > 0 ? html`<div class=\"subtitle\">Max size: ${this._formatSize(this.maxSize)}</div>` : nothing}\n        </div>\n      </div>\n    `;\n  }\n\n  override render() {\n    const fileCount = this._files.length;\n    return html`\n      ${this.label ? html`<label>${this.label}</label>` : nothing}\n      ${this._renderTrigger()}\n      <input\n        type=\"file\"\n        accept=${this.accept}\n        capture=${this.capture || nothing}\n        ?multiple=${this.multiple}\n        ?disabled=${this.disabled}\n        @change=${this._handleChange}\n      />\n      ${fileCount >= 2 ? html`\n        <div class=\"bulk-actions\">\n          <span class=\"bulk-count\">${fileCount} files</span>\n          <button\n            type=\"button\"\n            class=\"bulk-clear\"\n            @click=${() => this.clearAll()}\n          >\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\">\n              <path d=\"M10.5 3.5l-7 7M3.5 3.5l7 7\"/>\n            </svg>\n            Clear all\n          </button>\n        </div>\n      ` : nothing}\n      ${fileCount > 0 ? html`\n        <div class=\"files\">\n          ${this._files.map((file, idx) => {\n            const kind = this._fileKind(file);\n            const previewUrl = this._previewFor(file);\n            const status = this._statusMap.get(file);\n            return html`\n              <div class=\"file\">\n                <div class=\"file-thumb ${kind} ${previewUrl ? 'preview' : ''}\">\n                  ${previewUrl\n                    ? html`<img src=${previewUrl} alt=\"\" />`\n                    : this._renderKindIcon(kind)}\n                </div>\n                <div class=\"file-info\">\n                  <span class=\"file-name\">${file.name}</span>\n                  <span class=\"file-size\">\n                    ${this._formatSize(file.size)}\n                    ${status?.state === 'error' && status.error ? html` · ${status.error}` : nothing}\n                  </span>\n                  ${status?.state === 'uploading' ? html`\n                    <div class=\"progress-track\" role=\"progressbar\"\n                      aria-valuenow=${status.progress ?? 0}\n                      aria-valuemin=\"0\"\n                      aria-valuemax=\"100\"\n                      aria-label=${`Uploading ${file.name}`}\n                    >\n                      <div class=\"progress-fill\" style=\"width: ${Math.max(0, Math.min(100, status.progress ?? 0))}%\"></div>\n                    </div>\n                  ` : nothing}\n                </div>\n                ${status && status.state !== 'idle' ? html`\n                  <span class=\"status-pill ${status.state}\">\n                    ${status.state === 'uploading'\n                      ? `${Math.round(status.progress ?? 0)}%`\n                      : status.state === 'done' ? 'Done' : 'Failed'}\n                  </span>\n                ` : nothing}\n                <button\n                  type=\"button\"\n                  class=\"file-remove\"\n                  aria-label=${`Remove ${file.name}`}\n                  @click=${() => this._removeFile(idx)}\n                >\n                  <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.75\" stroke-linecap=\"round\">\n                    <path d=\"M10.5 3.5l-7 7M3.5 3.5l7 7\"/>\n                  </svg>\n                </button>\n              </div>\n            `;\n          })}\n        </div>\n      ` : nothing}\n      ${this.helper ? html`<div class=\"helper\">${this.helper}</div>` : nothing}\n      <div class=\"sr-only\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">${this._announcement}</div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-file-input': CgFileInput;\n  }\n}\n"],"names":["CgFileInput","LitElement","active","files","bytes","file","type","name","url","valid","rejected","reason","allowed","incomingFiles","arr","f","formData","idx","wasLast","nextIdx","_","cleared","info","message","kind","svg","count","html","nothing","fileCount","previewUrl","status","hostBlock","reducedMotion","css","__decorateClass","property","state","query","customElement"],"mappings":"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EjG;AACF;AA/vBa5B,EACK,SAAS,CAACgC,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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAuTnD;AAxTUlC,EA0TJ,iBAAiB;AAUZmC,EAAA;AAAA,EAAXC,EAAA;AAAS,GApUCpC,EAoUC,WAAA,SAAA,CAAA;AACAmC,EAAA;AAAA,EAAXC,EAAA;AAAS,GArUCpC,EAqUC,WAAA,eAAA,CAAA;AACAmC,EAAA;AAAA,EAAXC,EAAA;AAAS,GAtUCpC,EAsUC,WAAA,UAAA,CAAA;AACAmC,EAAA;AAAA,EAAXC,EAAA;AAAS,GAvUCpC,EAuUC,WAAA,UAAA,CAAA;AACAmC,EAAA;AAAA,EAAXC,EAAA;AAAS,GAxUCpC,EAwUC,WAAA,QAAA,CAAA;AACiBmC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GAzUhBpC,EAyUkB,WAAA,YAAA,CAAA;AACsBmC,EAAA;AAAA,EAAlDC,EAAS,EAAE,MAAM,QAAQ,WAAW,YAAY;AAAA,GA1UtCpC,EA0UwC,WAAA,WAAA,CAAA;AACCmC,EAAA;AAAA,EAAnDC,EAAS,EAAE,MAAM,QAAQ,WAAW,aAAa;AAAA,GA3UvCpC,EA2UyC,WAAA,YAAA,CAAA;AACRmC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA5U/BpC,EA4UiC,WAAA,YAAA,CAAA;AACAmC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA7U/BpC,EA6UiC,WAAA,SAAA,CAAA;AACAmC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA9U/BpC,EA8UiC,WAAA,WAAA,CAAA;AACfmC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA/UhBpC,EA+UkB,WAAA,QAAA,CAAA;AACAmC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAhVhBpC,EAgVkB,WAAA,WAAA,CAAA;AAEjBmC,EAAA;AAAA,EAAXC,EAAA;AAAS,GAlVCpC,EAkVC,WAAA,WAAA,CAAA;AAEiBmC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GApVhBpC,EAoVkB,WAAA,SAAA,CAAA;AAEZmC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAtVIrC,EAsVM,WAAA,UAAA,CAAA;AACAmC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAvVIrC,EAuVM,WAAA,aAAA,CAAA;AACAmC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAxVIrC,EAwVM,WAAA,iBAAA,CAAA;AAEoBmC,EAAA;AAAA,EAApCG,EAAM,oBAAoB;AAAA,GA1VhBtC,EA0V0B,WAAA,YAAA,CAAA;AA1V1BA,IAANmC,EAAA;AAAA,EADNI,EAAc,eAAe;AAAA,GACjBvC,CAAA;"}
+{"version":3,"file":"cg-file-input.js","sources":["../../../src/components/cg-file-input/cg-file-input.ts"],"sourcesContent":["import { LitElement, html, css, nothing, svg } from 'lit';\nimport { customElement, property, state, query } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion, focusRingSingle } from '../../styles/index.js';\n\n/** Per-file upload status driven by the consumer via `setFileStatus()`. */\nexport type FileStatus = 'idle' | 'uploading' | 'done' | 'error';\nexport interface FileStatusInfo {\n  state: FileStatus;\n  /** 0–100 — only used when state === 'uploading' */\n  progress?: number;\n  /** Optional error message, surfaced when state === 'error' */\n  error?: string;\n}\n\n/**\n * @element cg-file-input\n * File picker with drag-and-drop, paste-from-clipboard, image thumbnail\n * previews, file-type-aware icons, three sizes (sm | md | lg) plus a compact\n * button-style variant. Live-region announcements + focus management included.\n *\n * Consumers drive per-file upload state via `setFileStatus(file, info)`; the\n * component renders a status pill + progress bar accordingly. The component\n * itself does not perform uploads — it's a UI primitive.\n *\n * @example\n * ```html\n * <cg-file-input label=\"Upload files\" accept=\".pdf,.png,.jpg\" multiple max-size=\"5242880\"></cg-file-input>\n * <cg-file-input variant=\"compact\" multiple></cg-file-input>\n * <cg-file-input size=\"lg\" accept=\"image/*\" multiple paste></cg-file-input>\n * <cg-file-input capture=\"environment\" accept=\"image/*\"></cg-file-input>\n * ```\n *\n * @fires {CustomEvent<{files: File[]}>} cg-file-change\n * @fires {CustomEvent<{files: File[], reason: string}>} cg-file-reject\n * @fires {CustomEvent<{file: File}>} cg-file-remove\n * @fires {CustomEvent<{}>} cg-file-clear - All files cleared via the bulk action\n */\n@customElement('cg-file-input')\nexport class CgFileInput extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host { display: block; }\n\n    label {\n      display: block;\n      margin-bottom: var(--cg-spacing-6);\n      font-size: var(--cg-font-size-sm);\n      font-weight: var(--cg-font-weight-medium);\n      color: var(--cg-color-surface-base-text);\n    }\n\n    /* ── Dropzone variant (default) ── */\n    .dropzone {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      gap: var(--cg-spacing-12);\n      padding: var(--cg-spacing-32) var(--cg-spacing-24);\n      background: var(--cg-color-input-background-default);\n      border: var(--cg-border-width-100) dashed var(--cg-color-input-border-default);\n      border-radius: var(--cg-component-file-input-radius);\n      color: var(--cg-color-surface-container-outlined);\n      cursor: pointer;\n      text-align: center;\n      transition:\n        border-color var(--cg-transition-duration-default) var(--cg-transition-easing-default),\n        background var(--cg-transition-duration-default) var(--cg-transition-easing-default),\n        box-shadow var(--cg-transition-duration-default) var(--cg-transition-easing-default);\n    }\n    :host([size=\"sm\"]) .dropzone { min-height: var(--cg-component-file-input-min-height-sm); padding: var(--cg-spacing-20) var(--cg-spacing-16); gap: var(--cg-spacing-8); }\n    :host([size=\"md\"]) .dropzone { min-height: var(--cg-component-file-input-min-height-md); }\n    :host([size=\"lg\"]) .dropzone { min-height: var(--cg-component-file-input-min-height-lg); padding: var(--cg-spacing-40) var(--cg-spacing-32); gap: var(--cg-spacing-16); }\n\n    .dropzone:hover:not(.disabled) {\n      border-color: var(--cg-color-action-primary-border-default);\n      background: var(--cg-overlay-accent-subtle);\n    }\n    .dropzone.dragging {\n      border-style: solid;\n      border-color: var(--cg-color-action-primary-border-default);\n      background: var(--cg-overlay-accent-light);\n      color: var(--cg-color-surface-base-text);\n      box-shadow: 0 0 0 var(--cg-spacing-4) var(--cg-overlay-accent-subtle);\n    }\n    .dropzone:focus-visible {\n      outline: none;\n      box-shadow:\n        0 0 0 var(--cg-focus-ring-offset) var(--cg-color-focus-ring-offset),\n        0 0 0 calc(var(--cg-focus-ring-offset) + var(--cg-focus-ring-width)) var(--cg-color-focus-ring);\n    }\n    .dropzone.disabled { opacity: 0.5; cursor: not-allowed; }\n\n    :host([error]) .dropzone { border-color: var(--cg-color-status-error-border-default); }\n    :host([success]) .dropzone { border-color: var(--cg-color-status-success-border-default); }\n\n    .icon {\n      color: var(--cg-color-accent-text);\n      transition: transform var(--cg-transition-duration-default) var(--cg-transition-easing-spring);\n    }\n    .dropzone:hover:not(.disabled) .icon {\n      transform: translateY(calc(var(--cg-spacing-4) * -1));\n    }\n    .dropzone.dragging .icon {\n      transform: scale(1.15) translateY(calc(var(--cg-spacing-2) * -1));\n    }\n    .icon svg { width: var(--cg-icon-size-300); height: var(--cg-icon-size-300); }\n    :host([size=\"sm\"]) .icon svg { width: var(--cg-icon-size-200); height: var(--cg-icon-size-200); }\n    :host([size=\"lg\"]) .icon svg { width: var(--cg-icon-size-400); height: var(--cg-icon-size-400); }\n\n    .title {\n      font-size: var(--cg-font-size-sm);\n      font-weight: var(--cg-font-weight-medium);\n      color: var(--cg-color-surface-base-text);\n    }\n    :host([size=\"lg\"]) .title { font-size: var(--cg-font-size-base); }\n    .subtitle {\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n    }\n    .subtitles { display: flex; flex-direction: column; gap: var(--cg-spacing-2); }\n\n    /* ── Compact variant — button-style with drag overlay ── */\n    .compact {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-8);\n      padding: 0 var(--cg-spacing-16);\n      height: var(--cg-component-input-height-md);\n      background: var(--cg-color-input-background-default);\n      border: var(--cg-border-width-50) solid var(--cg-color-input-border-default);\n      border-radius: var(--cg-component-input-radius);\n      color: var(--cg-color-surface-base-text);\n      font-size: var(--cg-font-size-sm);\n      font-weight: var(--cg-font-weight-medium);\n      font-family: inherit;\n      cursor: pointer;\n      transition:\n        border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        background var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        box-shadow var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .compact:hover:not(.disabled) {\n      border-color: var(--cg-color-input-border-hover);\n      background: var(--cg-color-action-tertiary-background-hover);\n    }\n    .compact:focus-visible {\n      border-color: var(--cg-color-input-border-focus);\n      ${focusRingSingle}\n    }\n    .compact.dragging {\n      border-style: dashed;\n      border-color: var(--cg-color-action-primary-border-default);\n      background: var(--cg-overlay-accent-light);\n    }\n    .compact.disabled { opacity: 0.5; cursor: not-allowed; }\n    .compact-icon { color: var(--cg-color-input-icon-default); display: flex; flex-shrink: 0; }\n    .compact-icon svg { width: var(--cg-icon-size-100); height: var(--cg-icon-size-100); }\n    .compact-count {\n      margin-left: auto;\n      padding: var(--cg-spacing-2) var(--cg-spacing-8);\n      background: var(--cg-color-action-tertiary-background-hover);\n      border-radius: var(--cg-border-radius-full);\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-text);\n    }\n\n    /* ── Hidden native input ── */\n    input[type=\"file\"] {\n      position: absolute;\n      opacity: 0;\n      width: 0;\n      height: 0;\n      pointer-events: none;\n    }\n\n    /* ── File chip list ── */\n    .files {\n      display: flex;\n      flex-direction: column;\n      gap: var(--cg-spacing-8);\n      margin-top: var(--cg-spacing-16);\n    }\n    @keyframes fileChipIn {\n      from { opacity: 0; transform: translateY(calc(var(--cg-spacing-4) * -1)); }\n      to { opacity: 1; transform: translateY(0); }\n    }\n    .file {\n      display: flex;\n      align-items: center;\n      gap: var(--cg-spacing-12);\n      padding: var(--cg-spacing-8) var(--cg-spacing-12);\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-border-radius-100);\n      animation: fileChipIn var(--cg-transition-duration-default) var(--cg-transition-easing-ease-out);\n      transition: border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .file:hover {\n      border-color: var(--cg-color-input-border-hover);\n    }\n    .file-thumb {\n      flex-shrink: 0;\n      width: var(--cg-spacing-32);\n      height: var(--cg-spacing-32);\n      border-radius: var(--cg-border-radius-50);\n      overflow: hidden;\n      background: var(--cg-color-surface-cards-background);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n    .file-thumb.preview { padding: 0; }\n    .file-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }\n    .file-thumb svg { width: var(--cg-icon-size-150); height: var(--cg-icon-size-150); color: var(--cg-color-surface-container-outlined); }\n    .file-thumb.image svg { color: var(--cg-color-accent-text); }\n    .file-thumb.pdf svg { color: var(--cg-color-status-error-text-default); }\n    .file-thumb.doc svg { color: var(--cg-color-status-info-text-default); }\n    .file-thumb.media svg { color: var(--cg-color-status-success-text-default); }\n    .file-thumb.archive svg { color: var(--cg-color-status-warning-text-default); }\n    .file-info { flex: 1; min-width: 0; }\n    .file-name {\n      display: block;\n      font-size: var(--cg-font-size-sm);\n      color: var(--cg-color-surface-base-text);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      font-weight: var(--cg-font-weight-medium);\n    }\n    .file-size {\n      display: block;\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n    }\n    .file-remove {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: var(--cg-spacing-32);\n      height: var(--cg-spacing-32);\n      border: none;\n      background: none;\n      color: var(--cg-color-surface-container-outlined);\n      cursor: pointer;\n      border-radius: var(--cg-border-radius-full);\n      transition:\n        background var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        transform var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .file-remove:hover {\n      background: var(--cg-color-status-error-background-default);\n      color: var(--cg-color-status-error-text-default);\n    }\n    .file-remove:active {\n      transform: scale(var(--cg-interaction-press-scale));\n    }\n\n    .helper {\n      margin-top: var(--cg-spacing-6);\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n    }\n    :host([error]) .helper { color: var(--cg-color-status-error-text-default); }\n\n    /* ── Bulk actions toolbar ── */\n    .bulk-actions {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      margin-top: var(--cg-spacing-12);\n      margin-bottom: calc(var(--cg-spacing-8) * -1);\n    }\n    .bulk-count {\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n    }\n    .bulk-clear {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-4);\n      padding: var(--cg-spacing-4) var(--cg-spacing-8);\n      border: none;\n      background: transparent;\n      color: var(--cg-color-status-error-text-default);\n      font-size: var(--cg-font-size-xs);\n      font-weight: var(--cg-font-weight-medium);\n      font-family: inherit;\n      cursor: pointer;\n      border-radius: var(--cg-border-radius-50);\n      transition: background var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .bulk-clear:hover { background: var(--cg-color-status-error-background-default); }\n    .bulk-clear:focus-visible {\n      outline: none;\n      box-shadow:\n        0 0 0 var(--cg-focus-ring-offset) var(--cg-color-focus-ring-offset),\n        0 0 0 calc(var(--cg-focus-ring-offset) + var(--cg-focus-ring-width)) var(--cg-color-focus-ring);\n    }\n\n    /* ── Per-file status pill + progress bar ── */\n    .status-pill {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-4);\n      padding: var(--cg-spacing-2) var(--cg-spacing-8);\n      border-radius: var(--cg-border-radius-full);\n      font-size: var(--cg-font-size-xs);\n      font-weight: var(--cg-font-weight-medium);\n      flex-shrink: 0;\n    }\n    .status-pill.uploading {\n      background: var(--cg-overlay-accent-light);\n      color: var(--cg-color-accent-text);\n    }\n    .status-pill.done {\n      background: var(--cg-color-status-success-background-default);\n      color: var(--cg-color-status-success-text-default);\n    }\n    .status-pill.error {\n      background: var(--cg-color-status-error-background-default);\n      color: var(--cg-color-status-error-text-default);\n    }\n    .progress-track {\n      height: var(--cg-spacing-2);\n      margin-top: var(--cg-spacing-4);\n      background: var(--cg-color-surface-container-background);\n      border-radius: var(--cg-border-radius-full);\n      overflow: hidden;\n    }\n    .progress-fill {\n      height: 100%;\n      background: var(--cg-color-accent-text);\n      border-radius: var(--cg-border-radius-full);\n      transition: width var(--cg-transition-duration-default) var(--cg-transition-easing-ease-out);\n    }\n\n    /* ── Visually-hidden live region for screen readers ── */\n    .sr-only {\n      position: absolute;\n      width: 1px;\n      height: 1px;\n      padding: 0;\n      margin: -1px;\n      overflow: hidden;\n      clip: rect(0, 0, 0, 0);\n      white-space: nowrap;\n      border: 0;\n    }\n  `];\n\n  static formAssociated = true;\n  private _internals?: ElementInternals;\n\n  constructor() {\n    super();\n    if (typeof this.attachInternals === 'function') {\n      this._internals = this.attachInternals();\n    }\n  }\n\n  @property() label = '';\n  @property() placeholder = 'Drop files here or click to browse';\n  @property() helper = '';\n  @property() accept = '';\n  @property() name = '';\n  @property({ type: Boolean }) multiple = false;\n  @property({ type: Number, attribute: 'max-size' }) maxSize = 0;\n  @property({ type: Number, attribute: 'max-files' }) maxFiles = 0;\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  @property({ type: Boolean, reflect: true }) error = false;\n  @property({ type: Boolean, reflect: true }) success = false;\n  @property({ reflect: true }) size: 'sm' | 'md' | 'lg' = 'md';\n  @property({ reflect: true }) variant: 'dropzone' | 'compact' = 'dropzone';\n  /** Mobile camera capture: 'user' (front) or 'environment' (rear). Pass-through to <input>. */\n  @property() capture: '' | 'user' | 'environment' = '';\n  /** Accept files pasted from the clipboard (Ctrl/Cmd+V) when no editable element is focused. */\n  @property({ type: Boolean }) paste = false;\n\n  @state() private _files: File[] = [];\n  @state() private _dragging = false;\n  @state() private _announcement = '';\n\n  @query('input[type=\"file\"]') private _inputEl!: HTMLInputElement;\n\n  private _previews = new Map<File, string>();\n  private _statusMap = new Map<File, FileStatusInfo>();\n\n  private _formatSize(bytes: number): string {\n    if (bytes < 1024) return `${bytes} B`;\n    if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;\n    return `${(bytes / (1024 * 1024)).toFixed(2)} MB`;\n  }\n\n  /** Categorize a file by MIME / extension into one of: image | pdf | doc | media | archive | default. */\n  private _fileKind(file: File): 'image' | 'pdf' | 'doc' | 'media' | 'archive' | 'default' {\n    const type = file.type;\n    const name = file.name.toLowerCase();\n    if (type.startsWith('image/')) return 'image';\n    if (type === 'application/pdf' || name.endsWith('.pdf')) return 'pdf';\n    if (type.startsWith('video/') || type.startsWith('audio/')) return 'media';\n    if (/\\.(zip|rar|7z|tar|gz|bz2)$/i.test(name)) return 'archive';\n    if (/\\.(doc|docx|xls|xlsx|ppt|pptx|txt|md|rtf|csv)$/i.test(name) ||\n        type.startsWith('text/') ||\n        type.includes('word') ||\n        type.includes('sheet') ||\n        type.includes('presentation')) return 'doc';\n    return 'default';\n  }\n\n  private _previewFor(file: File): string | null {\n    if (!file.type.startsWith('image/')) return null;\n    let url = this._previews.get(file);\n    if (!url) {\n      url = URL.createObjectURL(file);\n      this._previews.set(file, url);\n    }\n    return url;\n  }\n\n  private _revokePreview(file: File): void {\n    const url = this._previews.get(file);\n    if (url) {\n      URL.revokeObjectURL(url);\n      this._previews.delete(file);\n    }\n  }\n\n  private _validateFiles(files: File[]): { valid: File[]; rejected: File[]; reason: string } {\n    const valid: File[] = [];\n    const rejected: File[] = [];\n    let reason = '';\n    for (const file of files) {\n      if (this.maxSize > 0 && file.size > this.maxSize) {\n        rejected.push(file);\n        reason = `File exceeds ${this._formatSize(this.maxSize)}`;\n        continue;\n      }\n      valid.push(file);\n    }\n    if (this.maxFiles > 0 && this._files.length + valid.length > this.maxFiles) {\n      const allowed = this.maxFiles - this._files.length;\n      rejected.push(...valid.slice(allowed));\n      valid.splice(allowed);\n      reason = `Maximum ${this.maxFiles} files allowed`;\n    }\n    return { valid, rejected, reason };\n  }\n\n  private _addFiles(incomingFiles: FileList | null): void {\n    if (!incomingFiles) return;\n    const arr = Array.from(incomingFiles);\n    const { valid, rejected, reason } = this._validateFiles(arr);\n\n    if (rejected.length > 0) {\n      this._announce(`${rejected.length} file${rejected.length === 1 ? '' : 's'} rejected: ${reason}`);\n      this.dispatchEvent(new CustomEvent('cg-file-reject', {\n        detail: { files: rejected, reason },\n        bubbles: true,\n        composed: true,\n      }));\n    }\n\n    if (valid.length > 0) {\n      if (this.multiple) {\n        this._files = [...this._files, ...valid];\n      } else {\n        this._files.forEach(f => { this._revokePreview(f); this._statusMap.delete(f); });\n        this._files = valid.slice(0, 1);\n      }\n      this._announce(`${valid.length} file${valid.length === 1 ? '' : 's'} added: ${valid.map(f => f.name).join(', ')}`);\n      this._updateFormValue();\n      this.dispatchEvent(new CustomEvent('cg-file-change', {\n        detail: { files: this._files },\n        bubbles: true,\n        composed: true,\n      }));\n    }\n  }\n\n  private _updateFormValue(): void {\n    if (!this._internals) return;\n    const formData = new FormData();\n    for (const file of this._files) {\n      formData.append(this.name || 'files', file);\n    }\n    this._internals.setFormValue(formData);\n  }\n\n  private _removeFile(idx: number): void {\n    const file = this._files[idx];\n    if (!file) return;\n    this._revokePreview(file);\n    this._statusMap.delete(file);\n    const wasLast = this._files.length === 1;\n    const nextIdx = idx >= this._files.length - 1 ? idx - 1 : idx;\n    this._files = this._files.filter((_, i) => i !== idx);\n    this._announce(`Removed ${file.name}`);\n    this._updateFormValue();\n    this.dispatchEvent(new CustomEvent('cg-file-remove', {\n      detail: { file },\n      bubbles: true,\n      composed: true,\n    }));\n    this.dispatchEvent(new CustomEvent('cg-file-change', {\n      detail: { files: this._files },\n      bubbles: true,\n      composed: true,\n    }));\n    // Focus management: move focus to the next remove button, or back to the trigger.\n    this.updateComplete.then(() => {\n      if (wasLast) {\n        const trigger = this.shadowRoot?.querySelector<HTMLElement>('.dropzone, .compact');\n        trigger?.focus();\n      } else {\n        const buttons = this.shadowRoot?.querySelectorAll<HTMLButtonElement>('.file-remove');\n        buttons?.[Math.max(0, nextIdx)]?.focus();\n      }\n    });\n  }\n\n  /** Public: clear all selected files. Fires `cg-file-clear` and `cg-file-change`. */\n  clearAll(): void {\n    if (this._files.length === 0) return;\n    this._files.forEach(f => { this._revokePreview(f); this._statusMap.delete(f); });\n    const cleared = this._files.length;\n    this._files = [];\n    this._announce(`Cleared ${cleared} file${cleared === 1 ? '' : 's'}`);\n    this._updateFormValue();\n    this.dispatchEvent(new CustomEvent('cg-file-clear', { bubbles: true, composed: true, detail: {} }));\n    this.dispatchEvent(new CustomEvent('cg-file-change', {\n      detail: { files: this._files },\n      bubbles: true,\n      composed: true,\n    }));\n    this.updateComplete.then(() => {\n      const trigger = this.shadowRoot?.querySelector<HTMLElement>('.dropzone, .compact');\n      trigger?.focus();\n    });\n  }\n\n  /**\n   * Public: set the upload status for a given file. Renders a status pill +\n   * progress bar inside the corresponding chip. The component does not perform\n   * uploads — call this from your upload pipeline.\n   */\n  setFileStatus(file: File, info: FileStatusInfo): void {\n    if (!this._files.includes(file)) return;\n    this._statusMap.set(file, info);\n    this.requestUpdate();\n    if (info.state === 'done') this._announce(`${file.name} uploaded`);\n    else if (info.state === 'error') this._announce(`${file.name} failed: ${info.error ?? 'upload error'}`);\n  }\n\n  private _announce(message: string): void {\n    // Force change so AT re-reads even when same message repeats.\n    this._announcement = '';\n    requestAnimationFrame(() => { this._announcement = message; });\n  }\n\n  private _handlePaste = (e: ClipboardEvent) => {\n    if (!this.paste || this.disabled) return;\n    // Don't hijack paste when the user is typing in an editable element.\n    const active = document.activeElement as HTMLElement | null;\n    const inEditable =\n      !!active && (\n        active.tagName === 'INPUT' ||\n        active.tagName === 'TEXTAREA' ||\n        active.isContentEditable ||\n        // shadow DOM: check the deepest active element\n        active.shadowRoot?.activeElement instanceof HTMLElement\n      );\n    if (inEditable && active !== this) return;\n    const files = e.clipboardData?.files;\n    if (files && files.length > 0) {\n      e.preventDefault();\n      this._addFiles(files);\n    }\n  };\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    window.addEventListener('paste', this._handlePaste);\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    window.removeEventListener('paste', this._handlePaste);\n    this._previews.forEach(url => URL.revokeObjectURL(url));\n    this._previews.clear();\n    this._statusMap.clear();\n  }\n\n  private _handleChange(e: Event): void {\n    this._addFiles((e.target as HTMLInputElement).files);\n  }\n\n  private _dragCounter = 0;\n\n  private _handleDrop(e: DragEvent): void {\n    e.preventDefault();\n    this._dragging = false;\n    this._dragCounter = 0;\n    if (this.disabled) return;\n    this._addFiles(e.dataTransfer?.files ?? null);\n  }\n\n  private _handleDragEnter(e: DragEvent): void {\n    e.preventDefault();\n    if (this.disabled) return;\n    this._dragCounter++;\n    this._dragging = true;\n  }\n\n  private _handleDragOver(e: DragEvent): void {\n    e.preventDefault();\n  }\n\n  private _handleDragLeave(): void {\n    this._dragCounter = Math.max(0, this._dragCounter - 1);\n    if (this._dragCounter === 0) this._dragging = false;\n  }\n\n  private _handleClick(): void {\n    if (this.disabled) return;\n    this._inputEl?.click();\n  }\n\n  private _handleKeydown(e: KeyboardEvent): void {\n    if (this.disabled) return;\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      this._inputEl?.click();\n    }\n  }\n\n  /** Render a category-aware SVG icon for a chip thumbnail. */\n  private _renderKindIcon(kind: 'image' | 'pdf' | 'doc' | 'media' | 'archive' | 'default') {\n    return svg`\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.75\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n        ${kind === 'image' ? svg`\n          <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/>\n          <circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\"/>\n          <path d=\"M21 15l-5-5L5 21\"/>\n        ` : kind === 'pdf' ? svg`\n          <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>\n          <polyline points=\"14 2 14 8 20 8\"/>\n          <text x=\"8\" y=\"17\" font-size=\"6\" font-family=\"sans-serif\" font-weight=\"700\" fill=\"currentColor\" stroke=\"none\">PDF</text>\n        ` : kind === 'doc' ? svg`\n          <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>\n          <polyline points=\"14 2 14 8 20 8\"/>\n          <line x1=\"8\" y1=\"13\" x2=\"16\" y2=\"13\"/>\n          <line x1=\"8\" y1=\"17\" x2=\"14\" y2=\"17\"/>\n        ` : kind === 'media' ? svg`\n          <polygon points=\"5 3 19 12 5 21 5 3\" fill=\"currentColor\"/>\n        ` : kind === 'archive' ? svg`\n          <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/>\n          <line x1=\"12\" y1=\"3\" x2=\"12\" y2=\"21\" stroke-dasharray=\"2 2\"/>\n        ` : svg`\n          <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>\n          <polyline points=\"14 2 14 8 20 8\"/>\n        `}\n      </svg>\n    `;\n  }\n\n  private _renderTrigger() {\n    if (this.variant === 'compact') {\n      const count = this._files.length;\n      return html`\n        <button\n          type=\"button\"\n          class=\"compact ${this._dragging ? 'dragging' : ''} ${this.disabled ? 'disabled' : ''}\"\n          ?disabled=${this.disabled}\n          @click=${this._handleClick}\n          @drop=${this._handleDrop}\n          @dragenter=${this._handleDragEnter}\n          @dragover=${this._handleDragOver}\n          @dragleave=${this._handleDragLeave}\n        >\n          <span class=\"compact-icon\" aria-hidden=\"true\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.75\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n              <path d=\"M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48\"/>\n            </svg>\n          </span>\n          <span>${this._dragging ? 'Drop to attach' : (count > 0 ? 'Add more files' : 'Attach files')}</span>\n          ${count > 0 ? html`<span class=\"compact-count\">${count}</span>` : nothing}\n        </button>\n      `;\n    }\n    return html`\n      <div\n        class=\"dropzone ${this._dragging ? 'dragging' : ''} ${this.disabled ? 'disabled' : ''}\"\n        role=\"button\"\n        tabindex=${this.disabled ? '-1' : '0'}\n        aria-label=${this.label || 'File upload'}\n        aria-disabled=${this.disabled ? 'true' : 'false'}\n        @click=${this._handleClick}\n        @keydown=${this._handleKeydown}\n        @drop=${this._handleDrop}\n        @dragenter=${this._handleDragEnter}\n        @dragover=${this._handleDragOver}\n        @dragleave=${this._handleDragLeave}\n      >\n        <div class=\"icon\">\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/>\n            <polyline points=\"17 8 12 3 7 8\"/>\n            <line x1=\"12\" y1=\"3\" x2=\"12\" y2=\"15\"/>\n          </svg>\n        </div>\n        <div class=\"title\">${this.placeholder}</div>\n        <div class=\"subtitles\">\n          ${this.accept ? html`<div class=\"subtitle\">Accepted: ${this.accept}</div>` : nothing}\n          ${this.maxSize > 0 ? html`<div class=\"subtitle\">Max size: ${this._formatSize(this.maxSize)}</div>` : nothing}\n        </div>\n      </div>\n    `;\n  }\n\n  override render() {\n    const fileCount = this._files.length;\n    return html`\n      ${this.label ? html`<label>${this.label}</label>` : nothing}\n      ${this._renderTrigger()}\n      <input\n        type=\"file\"\n        accept=${this.accept}\n        capture=${this.capture || nothing}\n        ?multiple=${this.multiple}\n        ?disabled=${this.disabled}\n        @change=${this._handleChange}\n      />\n      ${fileCount >= 2 ? html`\n        <div class=\"bulk-actions\">\n          <span class=\"bulk-count\">${fileCount} files</span>\n          <button\n            type=\"button\"\n            class=\"bulk-clear\"\n            @click=${() => this.clearAll()}\n          >\n            <svg width=\"12\" height=\"12\" viewBox=\"0 0 14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\">\n              <path d=\"M10.5 3.5l-7 7M3.5 3.5l7 7\"/>\n            </svg>\n            Clear all\n          </button>\n        </div>\n      ` : nothing}\n      ${fileCount > 0 ? html`\n        <div class=\"files\">\n          ${this._files.map((file, idx) => {\n            const kind = this._fileKind(file);\n            const previewUrl = this._previewFor(file);\n            const status = this._statusMap.get(file);\n            return html`\n              <div class=\"file\">\n                <div class=\"file-thumb ${kind} ${previewUrl ? 'preview' : ''}\">\n                  ${previewUrl\n                    ? html`<img src=${previewUrl} alt=\"\" />`\n                    : this._renderKindIcon(kind)}\n                </div>\n                <div class=\"file-info\">\n                  <span class=\"file-name\">${file.name}</span>\n                  <span class=\"file-size\">\n                    ${this._formatSize(file.size)}\n                    ${status?.state === 'error' && status.error ? html` · ${status.error}` : nothing}\n                  </span>\n                  ${status?.state === 'uploading' ? html`\n                    <div class=\"progress-track\" role=\"progressbar\"\n                      aria-valuenow=${status.progress ?? 0}\n                      aria-valuemin=\"0\"\n                      aria-valuemax=\"100\"\n                      aria-label=${`Uploading ${file.name}`}\n                    >\n                      <div class=\"progress-fill\" style=\"width: ${Math.max(0, Math.min(100, status.progress ?? 0))}%\"></div>\n                    </div>\n                  ` : nothing}\n                </div>\n                ${status && status.state !== 'idle' ? html`\n                  <span class=\"status-pill ${status.state}\">\n                    ${status.state === 'uploading'\n                      ? `${Math.round(status.progress ?? 0)}%`\n                      : status.state === 'done' ? 'Done' : 'Failed'}\n                  </span>\n                ` : nothing}\n                <button\n                  type=\"button\"\n                  class=\"file-remove\"\n                  aria-label=${`Remove ${file.name}`}\n                  @click=${() => this._removeFile(idx)}\n                >\n                  <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.75\" stroke-linecap=\"round\">\n                    <path d=\"M10.5 3.5l-7 7M3.5 3.5l7 7\"/>\n                  </svg>\n                </button>\n              </div>\n            `;\n          })}\n        </div>\n      ` : nothing}\n      ${this.helper ? html`<div class=\"helper\">${this.helper}</div>` : nothing}\n      <div class=\"sr-only\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">${this._announcement}</div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-file-input': CgFileInput;\n  }\n}\n"],"names":["CgFileInput","LitElement","active","files","bytes","file","type","name","url","valid","rejected","reason","allowed","incomingFiles","arr","f","formData","idx","wasLast","nextIdx","_","cleared","info","message","kind","svg","count","html","nothing","fileCount","previewUrl","status","hostBlock","reducedMotion","css","focusRingSingle","__decorateClass","property","state","query","customElement"],"mappings":";;;;;;;;AAsCO,IAAMA,IAAN,cAA0BC,EAAW;AAAA,EA4T1C,cAAc;AACZ,UAAA,GAMU,KAAA,QAAQ,IACR,KAAA,cAAc,sCACd,KAAA,SAAS,IACT,KAAA,SAAS,IACT,KAAA,OAAO,IACU,KAAA,WAAW,IACW,KAAA,UAAU,GACT,KAAA,WAAW,GACnB,KAAA,WAAW,IACX,KAAA,QAAQ,IACR,KAAA,UAAU,IACzB,KAAA,OAA2B,MAC3B,KAAA,UAAkC,YAEnD,KAAA,UAAuC,IAEtB,KAAA,QAAQ,IAE5B,KAAQ,SAAiB,CAAA,GACzB,KAAQ,YAAY,IACpB,KAAQ,gBAAgB,IAIjC,KAAQ,gCAAgB,IAAA,GACxB,KAAQ,iCAAiB,IAAA,GA8KzB,KAAQ,eAAe,CAAC,MAAsB;AAC5C,UAAI,CAAC,KAAK,SAAS,KAAK,SAAU;AAElC,YAAMC,IAAS,SAAS;AASxB,UAPE,CAAC,CAACA,MACAA,EAAO,YAAY,WACnBA,EAAO,YAAY,cACnBA,EAAO;AAAA,MAEPA,EAAO,YAAY,yBAAyB,gBAE9BA,MAAW,KAAM;AACnC,YAAMC,IAAQ,EAAE,eAAe;AAC/B,MAAIA,KAASA,EAAM,SAAS,MAC1B,EAAE,eAAA,GACF,KAAK,UAAUA,CAAK;AAAA,IAExB,GAmBA,KAAQ,eAAe,GAjPjB,OAAO,KAAK,mBAAoB,eAClC,KAAK,aAAa,KAAK,gBAAA;AAAA,EAE3B;AAAA,EA6BQ,YAAYC,GAAuB;AACzC,WAAIA,IAAQ,OAAa,GAAGA,CAAK,OAC7BA,IAAQ,OAAO,OAAa,IAAIA,IAAQ,MAAM,QAAQ,CAAC,CAAC,QACrD,IAAIA,KAAS,OAAO,OAAO,QAAQ,CAAC,CAAC;AAAA,EAC9C;AAAA;AAAA,EAGQ,UAAUC,GAAuE;AACvF,UAAMC,IAAOD,EAAK,MACZE,IAAOF,EAAK,KAAK,YAAA;AACvB,WAAIC,EAAK,WAAW,QAAQ,IAAU,UAClCA,MAAS,qBAAqBC,EAAK,SAAS,MAAM,IAAU,QAC5DD,EAAK,WAAW,QAAQ,KAAKA,EAAK,WAAW,QAAQ,IAAU,UAC/D,8BAA8B,KAAKC,CAAI,IAAU,YACjD,kDAAkD,KAAKA,CAAI,KAC3DD,EAAK,WAAW,OAAO,KACvBA,EAAK,SAAS,MAAM,KACpBA,EAAK,SAAS,OAAO,KACrBA,EAAK,SAAS,cAAc,IAAU,QACnC;AAAA,EACT;AAAA,EAEQ,YAAYD,GAA2B;AAC7C,QAAI,CAACA,EAAK,KAAK,WAAW,QAAQ,EAAG,QAAO;AAC5C,QAAIG,IAAM,KAAK,UAAU,IAAIH,CAAI;AACjC,WAAKG,MACHA,IAAM,IAAI,gBAAgBH,CAAI,GAC9B,KAAK,UAAU,IAAIA,GAAMG,CAAG,IAEvBA;AAAA,EACT;AAAA,EAEQ,eAAeH,GAAkB;AACvC,UAAMG,IAAM,KAAK,UAAU,IAAIH,CAAI;AACnC,IAAIG,MACF,IAAI,gBAAgBA,CAAG,GACvB,KAAK,UAAU,OAAOH,CAAI;AAAA,EAE9B;AAAA,EAEQ,eAAeF,GAAoE;AACzF,UAAMM,IAAgB,CAAA,GAChBC,IAAmB,CAAA;AACzB,QAAIC,IAAS;AACb,eAAWN,KAAQF,GAAO;AACxB,UAAI,KAAK,UAAU,KAAKE,EAAK,OAAO,KAAK,SAAS;AAChD,QAAAK,EAAS,KAAKL,CAAI,GAClBM,IAAS,gBAAgB,KAAK,YAAY,KAAK,OAAO,CAAC;AACvD;AAAA,MACF;AACA,MAAAF,EAAM,KAAKJ,CAAI;AAAA,IACjB;AACA,QAAI,KAAK,WAAW,KAAK,KAAK,OAAO,SAASI,EAAM,SAAS,KAAK,UAAU;AAC1E,YAAMG,IAAU,KAAK,WAAW,KAAK,OAAO;AAC5C,MAAAF,EAAS,KAAK,GAAGD,EAAM,MAAMG,CAAO,CAAC,GACrCH,EAAM,OAAOG,CAAO,GACpBD,IAAS,WAAW,KAAK,QAAQ;AAAA,IACnC;AACA,WAAO,EAAE,OAAAF,GAAO,UAAAC,GAAU,QAAAC,EAAA;AAAA,EAC5B;AAAA,EAEQ,UAAUE,GAAsC;AACtD,QAAI,CAACA,EAAe;AACpB,UAAMC,IAAM,MAAM,KAAKD,CAAa,GAC9B,EAAE,OAAAJ,GAAO,UAAAC,GAAU,QAAAC,MAAW,KAAK,eAAeG,CAAG;AAE3D,IAAIJ,EAAS,SAAS,MACpB,KAAK,UAAU,GAAGA,EAAS,MAAM,QAAQA,EAAS,WAAW,IAAI,KAAK,GAAG,cAAcC,CAAM,EAAE,GAC/F,KAAK,cAAc,IAAI,YAAY,kBAAkB;AAAA,MACnD,QAAQ,EAAE,OAAOD,GAAU,QAAAC,EAAA;AAAA,MAC3B,SAAS;AAAA,MACT,UAAU;AAAA,IAAA,CACX,CAAC,IAGAF,EAAM,SAAS,MACb,KAAK,WACP,KAAK,SAAS,CAAC,GAAG,KAAK,QAAQ,GAAGA,CAAK,KAEvC,KAAK,OAAO,QAAQ,CAAAM,MAAK;AAAE,WAAK,eAAeA,CAAC,GAAG,KAAK,WAAW,OAAOA,CAAC;AAAA,IAAG,CAAC,GAC/E,KAAK,SAASN,EAAM,MAAM,GAAG,CAAC,IAEhC,KAAK,UAAU,GAAGA,EAAM,MAAM,QAAQA,EAAM,WAAW,IAAI,KAAK,GAAG,WAAWA,EAAM,IAAI,OAAKM,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC,EAAE,GACjH,KAAK,iBAAA,GACL,KAAK,cAAc,IAAI,YAAY,kBAAkB;AAAA,MACnD,QAAQ,EAAE,OAAO,KAAK,OAAA;AAAA,MACtB,SAAS;AAAA,MACT,UAAU;AAAA,IAAA,CACX,CAAC;AAAA,EAEN;AAAA,EAEQ,mBAAyB;AAC/B,QAAI,CAAC,KAAK,WAAY;AACtB,UAAMC,IAAW,IAAI,SAAA;AACrB,eAAWX,KAAQ,KAAK;AACtB,MAAAW,EAAS,OAAO,KAAK,QAAQ,SAASX,CAAI;AAE5C,SAAK,WAAW,aAAaW,CAAQ;AAAA,EACvC;AAAA,EAEQ,YAAYC,GAAmB;AACrC,UAAMZ,IAAO,KAAK,OAAOY,CAAG;AAC5B,QAAI,CAACZ,EAAM;AACX,SAAK,eAAeA,CAAI,GACxB,KAAK,WAAW,OAAOA,CAAI;AAC3B,UAAMa,IAAU,KAAK,OAAO,WAAW,GACjCC,IAAUF,KAAO,KAAK,OAAO,SAAS,IAAIA,IAAM,IAAIA;AAC1D,SAAK,SAAS,KAAK,OAAO,OAAO,CAACG,GAAG,MAAM,MAAMH,CAAG,GACpD,KAAK,UAAU,WAAWZ,EAAK,IAAI,EAAE,GACrC,KAAK,iBAAA,GACL,KAAK,cAAc,IAAI,YAAY,kBAAkB;AAAA,MACnD,QAAQ,EAAE,MAAAA,EAAA;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,IAAA,CACX,CAAC,GACF,KAAK,cAAc,IAAI,YAAY,kBAAkB;AAAA,MACnD,QAAQ,EAAE,OAAO,KAAK,OAAA;AAAA,MACtB,SAAS;AAAA,MACT,UAAU;AAAA,IAAA,CACX,CAAC,GAEF,KAAK,eAAe,KAAK,MAAM;AAC7B,MAAIa,IACc,KAAK,YAAY,cAA2B,qBAAqB,GACxE,MAAA,IAEO,KAAK,YAAY,iBAAoC,cAAc,IACzE,KAAK,IAAI,GAAGC,CAAO,CAAC,GAAG,MAAA;AAAA,IAErC,CAAC;AAAA,EACH;AAAA;AAAA,EAGA,WAAiB;AACf,QAAI,KAAK,OAAO,WAAW,EAAG;AAC9B,SAAK,OAAO,QAAQ,CAAAJ,MAAK;AAAE,WAAK,eAAeA,CAAC,GAAG,KAAK,WAAW,OAAOA,CAAC;AAAA,IAAG,CAAC;AAC/E,UAAMM,IAAU,KAAK,OAAO;AAC5B,SAAK,SAAS,CAAA,GACd,KAAK,UAAU,WAAWA,CAAO,QAAQA,MAAY,IAAI,KAAK,GAAG,EAAE,GACnE,KAAK,iBAAA,GACL,KAAK,cAAc,IAAI,YAAY,iBAAiB,EAAE,SAAS,IAAM,UAAU,IAAM,QAAQ,CAAA,EAAC,CAAG,CAAC,GAClG,KAAK,cAAc,IAAI,YAAY,kBAAkB;AAAA,MACnD,QAAQ,EAAE,OAAO,KAAK,OAAA;AAAA,MACtB,SAAS;AAAA,MACT,UAAU;AAAA,IAAA,CACX,CAAC,GACF,KAAK,eAAe,KAAK,MAAM;AAE7B,MADgB,KAAK,YAAY,cAA2B,qBAAqB,GACxE,MAAA;AAAA,IACX,CAAC;AAAA,EACH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,cAAchB,GAAYiB,GAA4B;AACpD,IAAK,KAAK,OAAO,SAASjB,CAAI,MAC9B,KAAK,WAAW,IAAIA,GAAMiB,CAAI,GAC9B,KAAK,cAAA,GACDA,EAAK,UAAU,SAAQ,KAAK,UAAU,GAAGjB,EAAK,IAAI,WAAW,IACxDiB,EAAK,UAAU,WAAS,KAAK,UAAU,GAAGjB,EAAK,IAAI,YAAYiB,EAAK,SAAS,cAAc,EAAE;AAAA,EACxG;AAAA,EAEQ,UAAUC,GAAuB;AAEvC,SAAK,gBAAgB,IACrB,sBAAsB,MAAM;AAAE,WAAK,gBAAgBA;AAAA,IAAS,CAAC;AAAA,EAC/D;AAAA,EAsBS,oBAA0B;AACjC,UAAM,kBAAA,GACN,OAAO,iBAAiB,SAAS,KAAK,YAAY;AAAA,EACpD;AAAA,EAES,uBAA6B;AACpC,UAAM,qBAAA,GACN,OAAO,oBAAoB,SAAS,KAAK,YAAY,GACrD,KAAK,UAAU,QAAQ,CAAAf,MAAO,IAAI,gBAAgBA,CAAG,CAAC,GACtD,KAAK,UAAU,MAAA,GACf,KAAK,WAAW,MAAA;AAAA,EAClB;AAAA,EAEQ,cAAc,GAAgB;AACpC,SAAK,UAAW,EAAE,OAA4B,KAAK;AAAA,EACrD;AAAA,EAIQ,YAAY,GAAoB;AAItC,IAHA,EAAE,eAAA,GACF,KAAK,YAAY,IACjB,KAAK,eAAe,GAChB,MAAK,YACT,KAAK,UAAU,EAAE,cAAc,SAAS,IAAI;AAAA,EAC9C;AAAA,EAEQ,iBAAiB,GAAoB;AAE3C,IADA,EAAE,eAAA,GACE,MAAK,aACT,KAAK,gBACL,KAAK,YAAY;AAAA,EACnB;AAAA,EAEQ,gBAAgB,GAAoB;AAC1C,MAAE,eAAA;AAAA,EACJ;AAAA,EAEQ,mBAAyB;AAC/B,SAAK,eAAe,KAAK,IAAI,GAAG,KAAK,eAAe,CAAC,GACjD,KAAK,iBAAiB,MAAG,KAAK,YAAY;AAAA,EAChD;AAAA,EAEQ,eAAqB;AAC3B,IAAI,KAAK,YACT,KAAK,UAAU,MAAA;AAAA,EACjB;AAAA,EAEQ,eAAe,GAAwB;AAC7C,IAAI,KAAK,aACL,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,eAAA,GACF,KAAK,UAAU,MAAA;AAAA,EAEnB;AAAA;AAAA,EAGQ,gBAAgBgB,GAAiE;AACvF,WAAOC;AAAA;AAAA,UAEDD,MAAS,UAAUC;AAAA;AAAA;AAAA;AAAA,YAIjBD,MAAS,QAAQC;AAAA;AAAA;AAAA;AAAA,YAIjBD,MAAS,QAAQC;AAAA;AAAA;AAAA;AAAA;AAAA,YAKjBD,MAAS,UAAUC;AAAA;AAAA,YAEnBD,MAAS,YAAYC;AAAA;AAAA;AAAA,YAGrBA;AAAA;AAAA;AAAA,SAGH;AAAA;AAAA;AAAA,EAGP;AAAA,EAEQ,iBAAiB;AACvB,QAAI,KAAK,YAAY,WAAW;AAC9B,YAAMC,IAAQ,KAAK,OAAO;AAC1B,aAAOC;AAAA;AAAA;AAAA,2BAGc,KAAK,YAAY,aAAa,EAAE,IAAI,KAAK,WAAW,aAAa,EAAE;AAAA,sBACxE,KAAK,QAAQ;AAAA,mBAChB,KAAK,YAAY;AAAA,kBAClB,KAAK,WAAW;AAAA,uBACX,KAAK,gBAAgB;AAAA,sBACtB,KAAK,eAAe;AAAA,uBACnB,KAAK,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAO1B,KAAK,YAAY,mBAAoBD,IAAQ,IAAI,mBAAmB,cAAe;AAAA,YACzFA,IAAQ,IAAIC,gCAAmCD,CAAK,YAAYE,CAAO;AAAA;AAAA;AAAA,IAG/E;AACA,WAAOD;AAAA;AAAA,0BAEe,KAAK,YAAY,aAAa,EAAE,IAAI,KAAK,WAAW,aAAa,EAAE;AAAA;AAAA,mBAE1E,KAAK,WAAW,OAAO,GAAG;AAAA,qBACxB,KAAK,SAAS,aAAa;AAAA,wBACxB,KAAK,WAAW,SAAS,OAAO;AAAA,iBACvC,KAAK,YAAY;AAAA,mBACf,KAAK,cAAc;AAAA,gBACtB,KAAK,WAAW;AAAA,qBACX,KAAK,gBAAgB;AAAA,oBACtB,KAAK,eAAe;AAAA,qBACnB,KAAK,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BASb,KAAK,WAAW;AAAA;AAAA,YAEjC,KAAK,SAASA,oCAAuC,KAAK,MAAM,WAAWC,CAAO;AAAA,YAClF,KAAK,UAAU,IAAID,oCAAuC,KAAK,YAAY,KAAK,OAAO,CAAC,WAAWC,CAAO;AAAA;AAAA;AAAA;AAAA,EAIpH;AAAA,EAES,SAAS;AAChB,UAAMC,IAAY,KAAK,OAAO;AAC9B,WAAOF;AAAA,QACH,KAAK,QAAQA,WAAc,KAAK,KAAK,aAAaC,CAAO;AAAA,QACzD,KAAK,gBAAgB;AAAA;AAAA;AAAA,iBAGZ,KAAK,MAAM;AAAA,kBACV,KAAK,WAAWA,CAAO;AAAA,oBACrB,KAAK,QAAQ;AAAA,oBACb,KAAK,QAAQ;AAAA,kBACf,KAAK,aAAa;AAAA;AAAA,QAE5BC,KAAa,IAAIF;AAAA;AAAA,qCAEYE,CAAS;AAAA;AAAA;AAAA;AAAA,qBAIzB,MAAM,KAAK,SAAA,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQhCD,CAAO;AAAA,QACTC,IAAY,IAAIF;AAAA;AAAA,YAEZ,KAAK,OAAO,IAAI,CAACtB,GAAMY,MAAQ;AAC/B,YAAMO,IAAO,KAAK,UAAUnB,CAAI,GAC1ByB,IAAa,KAAK,YAAYzB,CAAI,GAClC0B,IAAS,KAAK,WAAW,IAAI1B,CAAI;AACvC,aAAOsB;AAAA;AAAA,yCAEsBH,CAAI,IAAIM,IAAa,YAAY,EAAE;AAAA,oBACxDA,IACEH,aAAgBG,CAAU,eAC1B,KAAK,gBAAgBN,CAAI,CAAC;AAAA;AAAA;AAAA,4CAGJnB,EAAK,IAAI;AAAA;AAAA,sBAE/B,KAAK,YAAYA,EAAK,IAAI,CAAC;AAAA,sBAC3B0B,GAAQ,UAAU,WAAWA,EAAO,QAAQJ,OAAUI,EAAO,KAAK,KAAKH,CAAO;AAAA;AAAA,oBAEhFG,GAAQ,UAAU,cAAcJ;AAAA;AAAA,sCAEdI,EAAO,YAAY,CAAC;AAAA;AAAA;AAAA,mCAGvB,aAAa1B,EAAK,IAAI,EAAE;AAAA;AAAA,iEAEM,KAAK,IAAI,GAAG,KAAK,IAAI,KAAK0B,EAAO,YAAY,CAAC,CAAC,CAAC;AAAA;AAAA,sBAE3FH,CAAO;AAAA;AAAA,kBAEXG,KAAUA,EAAO,UAAU,SAASJ;AAAA,6CACTI,EAAO,KAAK;AAAA,sBACnCA,EAAO,UAAU,cACf,GAAG,KAAK,MAAMA,EAAO,YAAY,CAAC,CAAC,MACnCA,EAAO,UAAU,SAAS,SAAS,QAAQ;AAAA;AAAA,oBAE/CH,CAAO;AAAA;AAAA;AAAA;AAAA,+BAII,UAAUvB,EAAK,IAAI,EAAE;AAAA,2BACzB,MAAM,KAAK,YAAYY,CAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQ5C,CAAC,CAAC;AAAA;AAAA,UAEFW,CAAO;AAAA,QACT,KAAK,SAASD,wBAA2B,KAAK,MAAM,WAAWC,CAAO;AAAA,iFACG,KAAK,aAAa;AAAA;AAAA,EAEjG;AACF;AA9vBa5B,EACK,SAAS,CAACgC,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,QA4G9CC,CAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA0MpB;AAvTUnC,EAyTJ,iBAAiB;AAUZoC,EAAA;AAAA,EAAXC,EAAA;AAAS,GAnUCrC,EAmUC,WAAA,SAAA,CAAA;AACAoC,EAAA;AAAA,EAAXC,EAAA;AAAS,GApUCrC,EAoUC,WAAA,eAAA,CAAA;AACAoC,EAAA;AAAA,EAAXC,EAAA;AAAS,GArUCrC,EAqUC,WAAA,UAAA,CAAA;AACAoC,EAAA;AAAA,EAAXC,EAAA;AAAS,GAtUCrC,EAsUC,WAAA,UAAA,CAAA;AACAoC,EAAA;AAAA,EAAXC,EAAA;AAAS,GAvUCrC,EAuUC,WAAA,QAAA,CAAA;AACiBoC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GAxUhBrC,EAwUkB,WAAA,YAAA,CAAA;AACsBoC,EAAA;AAAA,EAAlDC,EAAS,EAAE,MAAM,QAAQ,WAAW,YAAY;AAAA,GAzUtCrC,EAyUwC,WAAA,WAAA,CAAA;AACCoC,EAAA;AAAA,EAAnDC,EAAS,EAAE,MAAM,QAAQ,WAAW,aAAa;AAAA,GA1UvCrC,EA0UyC,WAAA,YAAA,CAAA;AACRoC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA3U/BrC,EA2UiC,WAAA,YAAA,CAAA;AACAoC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA5U/BrC,EA4UiC,WAAA,SAAA,CAAA;AACAoC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GA7U/BrC,EA6UiC,WAAA,WAAA,CAAA;AACfoC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA9UhBrC,EA8UkB,WAAA,QAAA,CAAA;AACAoC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA/UhBrC,EA+UkB,WAAA,WAAA,CAAA;AAEjBoC,EAAA;AAAA,EAAXC,EAAA;AAAS,GAjVCrC,EAiVC,WAAA,WAAA,CAAA;AAEiBoC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GAnVhBrC,EAmVkB,WAAA,SAAA,CAAA;AAEZoC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GArVItC,EAqVM,WAAA,UAAA,CAAA;AACAoC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAtVItC,EAsVM,WAAA,aAAA,CAAA;AACAoC,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAvVItC,EAuVM,WAAA,iBAAA,CAAA;AAEoBoC,EAAA;AAAA,EAApCG,EAAM,oBAAoB;AAAA,GAzVhBvC,EAyV0B,WAAA,YAAA,CAAA;AAzV1BA,IAANoC,EAAA;AAAA,EADNI,EAAc,eAAe;AAAA,GACjBxC,CAAA;"}

package/dist/components/cg-focus-scope/cg-focus-scope.js

@@ -1,6 +1,6 @@
 import { css as u, LitElement as l, html as h } from "lit";
 import { property as n, customElement as f } from "lit/decorators.js";
-import { F as v } from "../../chunks/focus-trap-BdRNhSPD.js";
+import { F as v } from "../../chunks/focus-trap-vlQwKK-3.js";
 var d = Object.defineProperty, m = Object.getOwnPropertyDescriptor, p = (s, r, a, c) => {
   for (var t = c > 1 ? void 0 : c ? m(r, a) : r, o = s.length - 1, i; o >= 0; o--)
     (i = s[o]) && (t = (c ? i(r, a, t) : i(t)) || t);

package/dist/components/cg-follow-up/cg-follow-up.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cg-follow-up.d.ts","sourceRoot":"","sources":["../../../src/components/cg-follow-up/cg-follow-up.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAIrD;;;;GAIG;AAEH,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,qBACa,UAAW,SAAQ,UAAU;IACxC,OAAgB,MAAM,4BAuInB;IAEwB,KAAK,EAAE,CAAC,MAAM,GAAG,YAAY,CAAC,EAAE,CAAM;IACrD,KAAK,SAAe;IACH,QAAQ,UAAS;IACjB,OAAO,UAAS;IAChB,SAAS,UAAS;IACJ,OAAO,EAAE,OAAO,GAAG,OAAO,GAAG,SAAS,CAAW;IAChE,UAAU,EAAE,MAAM,CAAK;IAE1C,OAAO,CAAC,QAAQ,CAAS;IAElC,OAAO,CAAC,QAAQ;IAIhB,OAAO,CAAC,QAAQ;IAIhB,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,cAAc;IAIb,MAAM;CAiDhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAAG,cAAc,EAAE,UAAU,CAAC;KAAE;CAChE"}
+{"version":3,"file":"cg-follow-up.d.ts","sourceRoot":"","sources":["../../../src/components/cg-follow-up/cg-follow-up.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAIrD;;;;GAIG;AAEH,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,qBACa,UAAW,SAAQ,UAAU;IACxC,OAAgB,MAAM,4BAsInB;IAEwB,KAAK,EAAE,CAAC,MAAM,GAAG,YAAY,CAAC,EAAE,CAAM;IACrD,KAAK,SAAe;IACH,QAAQ,UAAS;IACjB,OAAO,UAAS;IAChB,SAAS,UAAS;IACJ,OAAO,EAAE,OAAO,GAAG,OAAO,GAAG,SAAS,CAAW;IAChE,UAAU,EAAE,MAAM,CAAK;IAE1C,OAAO,CAAC,QAAQ,CAAS;IAElC,OAAO,CAAC,QAAQ;IAIhB,OAAO,CAAC,QAAQ;IAIhB,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,cAAc;IAIb,MAAM;CAiDhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAAG,cAAc,EAAE,UAAU,CAAC;KAAE;CAChE"}

package/dist/components/cg-follow-up/cg-follow-up.js

@@ -1,10 +1,10 @@
 import { css as u, LitElement as p, nothing as d, html as n } from "lit";
 import { property as s, state as h, customElement as b } from "lit/decorators.js";
-import { h as v, r as f, b as m } from "../../chunks/premium.css-9I4kHrsl.js";
-var y = Object.defineProperty, w = Object.getOwnPropertyDescriptor, i = (r, e, g, t) => {
-  for (var o = t > 1 ? void 0 : t ? w(e, g) : e, c = r.length - 1, l; c >= 0; c--)
+import { h as v, r as f, b as m, g as y } from "../../chunks/premium.css-DHekUEUt.js";
+var w = Object.defineProperty, x = Object.getOwnPropertyDescriptor, i = (r, e, g, t) => {
+  for (var o = t > 1 ? void 0 : t ? x(e, g) : e, c = r.length - 1, l; c >= 0; c--)
     (l = r[c]) && (o = (t ? l(e, g, o) : l(o)) || o);
-  return t && o && y(e, g, o), o;
+  return t && o && w(e, g, o), o;
 };
 let a = class extends p {
   constructor() {
@@ -36,7 +36,7 @@ let a = class extends p {
         </div>
       `}
 
-      <div class="chips" role="group" aria-label=${this.label}>
+      <div class="chips" role="group" aria-label=${this.label} aria-busy=${this.loading}>
         ${this.loading ? g.slice(0, this.maxVisible || 3).map((t) => n`
               <div class="shimmer" style="width: ${t}px"></div>
             `) : n`
@@ -130,8 +130,7 @@ a.styles = [v, f, m, u`
     }
     button:active:not(:disabled) { transform: scale(var(--cg-interaction-press-scale)); }
     button:focus-visible {
-      outline: none;
-      box-shadow: 0 0 0 3px var(--cg-overlay-accent-strong);
+      ${y}
     }
     button:disabled { opacity: 0.4; cursor: not-allowed; }