@cognivo/components 0.8.0 → 0.8.2

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

@@ -1 +0,0 @@
-{"version":3,"file":"cg-droppable.d.ts","sourceRoot":"","sources":["../../../src/components/cg-droppable/cg-droppable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAK5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,OAAgB,MAAM,4BAiBnB;IAEH,4EAA4E;IAChE,OAAO,SAAM;IAEzB,+DAA+D;IACnB,QAAQ,UAAS;IAE7D,0CAA0C;IACE,IAAI,UAAS;IAEzD,iDAAiD;IACsB,WAAW,UAAS;IAElF,OAAO,CAAC,QAAQ,CAAS;IAElC,OAAO,CAAC,YAAY,CAIlB;IAEF,OAAO,CAAC,WAAW,CAGjB;IAEF,OAAO,CAAC,UAAU,CA+BhB;IAEF,OAAO,CAAC,cAAc;IAwCtB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,QAAQ;IAMP,iBAAiB,IAAI,IAAI;IAOzB,oBAAoB,IAAI,IAAI;IAO5B,MAAM;CAGhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}

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

@@ -1,114 +0,0 @@
-import { css as l, LitElement as p, html as v } from "lit";
-import { property as n, state as u, customElement as h } from "lit/decorators.js";
-import { h as g, r as f } from "../../chunks/premium.css-9I4kHrsl.js";
-var b = Object.defineProperty, m = Object.getOwnPropertyDescriptor, i = (t, e, r, a) => {
-  for (var o = a > 1 ? void 0 : a ? m(e, r) : e, c = t.length - 1, d; c >= 0; c--)
-    (d = t[c]) && (o = (a ? d(e, r, o) : d(o)) || o);
-  return a && o && b(e, r, o), o;
-};
-let s = class extends p {
-  constructor() {
-    super(...arguments), this.accepts = "", this.disabled = !1, this.over = !1, this.invalidOver = !1, this._wasOver = !1, this._onDragStart = (t) => {
-      this._wasOver = !1;
-      const e = t.detail;
-      this._evaluateHover(e);
-    }, this._onDragMove = (t) => {
-      const e = t.detail;
-      this._evaluateHover(e);
-    }, this._onDragEnd = (t) => {
-      const e = t.detail, r = this._accepts(e.type), a = this._pointInside(e.clientX, e.clientY);
-      this._wasOver && this.dispatchEvent(new CustomEvent("cg-drop-leave", {
-        detail: { type: e.type, payload: e.payload },
-        bubbles: !0,
-        composed: !0
-      })), this.over = !1, this.invalidOver = !1, this._wasOver = !1, !this.disabled && r && a && !e.dropped && (this.dispatchEvent(new CustomEvent("cg-drop", {
-        detail: {
-          type: e.type,
-          payload: e.payload,
-          clientX: e.clientX,
-          clientY: e.clientY,
-          source: e.source
-        },
-        bubbles: !0,
-        composed: !0
-      })), document.dispatchEvent(new Event("cg-drop")));
-    };
-  }
-  _evaluateHover(t) {
-    if (this.disabled) {
-      this.over = !1, this.invalidOver = !1;
-      return;
-    }
-    const e = this._pointInside(t.clientX, t.clientY), r = this._accepts(t.type);
-    e && r ? (this.over || (this.dispatchEvent(new CustomEvent("cg-drop-enter", {
-      detail: { type: t.type, payload: t.payload },
-      bubbles: !0,
-      composed: !0
-    })), this._wasOver = !0), this.over = !0, this.invalidOver = !1) : e && !r ? (this.over && this.dispatchEvent(new CustomEvent("cg-drop-leave", {
-      detail: { type: t.type, payload: t.payload },
-      bubbles: !0,
-      composed: !0
-    })), this.over = !1, this.invalidOver = !0) : (this.over && this.dispatchEvent(new CustomEvent("cg-drop-leave", {
-      detail: { type: t.type, payload: t.payload },
-      bubbles: !0,
-      composed: !0
-    })), this.over = !1, this.invalidOver = !1);
-  }
-  _pointInside(t, e) {
-    if (t < 0 && e < 0) return !1;
-    const r = this.getBoundingClientRect();
-    return t >= r.left && t <= r.right && e >= r.top && e <= r.bottom;
-  }
-  _accepts(t) {
-    return this.accepts ? this.accepts.trim().split(/\s+/).includes(t) : !0;
-  }
-  connectedCallback() {
-    super.connectedCallback(), document.addEventListener("cg-drag-start", this._onDragStart), document.addEventListener("cg-drag-move", this._onDragMove), document.addEventListener("cg-drag-end", this._onDragEnd);
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback(), document.removeEventListener("cg-drag-start", this._onDragStart), document.removeEventListener("cg-drag-move", this._onDragMove), document.removeEventListener("cg-drag-end", this._onDragEnd);
-  }
-  render() {
-    return v`<slot></slot>`;
-  }
-};
-s.styles = [g, f, l`
-    :host {
-      display: block;
-      transition: background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default), outline-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
-    }
-    :host([over]) {
-      background: var(--cg-color-action-tertiary-background-hover);
-      outline: var(--cg-border-width-100) dashed var(--cg-color-action-primary-border-default);
-      outline-offset: calc(-1 * var(--cg-border-width-100));
-    }
-    :host([invalid-over]) {
-      outline: var(--cg-border-width-100) dashed var(--cg-color-status-error-border-default);
-      outline-offset: calc(-1 * var(--cg-border-width-100));
-    }
-    :host([disabled]) {
-      pointer-events: none;
-    }
-  `];
-i([
-  n()
-], s.prototype, "accepts", 2);
-i([
-  n({ type: Boolean, reflect: !0 })
-], s.prototype, "disabled", 2);
-i([
-  n({ type: Boolean, reflect: !0 })
-], s.prototype, "over", 2);
-i([
-  n({ type: Boolean, reflect: !0, attribute: "invalid-over" })
-], s.prototype, "invalidOver", 2);
-i([
-  u()
-], s.prototype, "_wasOver", 2);
-s = i([
-  h("cg-droppable")
-], s);
-export {
-  s as CgDroppable
-};
-//# sourceMappingURL=cg-droppable.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"cg-droppable.js","sources":["../../../src/components/cg-droppable/cg-droppable.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\nimport type { DragMoveDetail, DragEndDetail } from '../../utils/drag-manager.js';\n\n/**\n * @element cg-droppable\n * Drop zone that pairs with `<cg-draggable>`. Listens to the active drag\n * session (broadcast on `document` by the drag-manager) and fires\n * `cg-drop` when a draggable of an accepted type is released over its\n * bounding box.\n *\n * The `over` boolean attribute reflects while a valid drag hovers, so\n * consumers can style the hover state via attribute selectors. The\n * `invalid-over` attribute reflects when an out-of-type drag hovers.\n *\n * @example\n * ```html\n * <cg-droppable accepts=\"card\" @cg-drop=${onDrop}>\n *   <div class=\"column\">Drop cards here</div>\n * </cg-droppable>\n * ```\n *\n * @example Multiple accepted types\n * ```html\n * <cg-droppable accepts=\"card task\" @cg-drop=${onDrop}>…</cg-droppable>\n * ```\n *\n * @slot - The drop-zone content.\n *\n * @fires {CustomEvent<{type: string, payload: unknown, clientX: number, clientY: number}>} cg-drop - A draggable of an accepted type was dropped over this zone.\n * @fires {CustomEvent<{type: string, payload: unknown}>} cg-drop-enter - A valid drag entered the zone\n * @fires {CustomEvent<{type: string, payload: unknown}>} cg-drop-leave - A valid drag left the zone\n */\n@customElement('cg-droppable')\nexport class CgDroppable extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host {\n      display: block;\n      transition: background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default), outline-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    :host([over]) {\n      background: var(--cg-color-action-tertiary-background-hover);\n      outline: var(--cg-border-width-100) dashed var(--cg-color-action-primary-border-default);\n      outline-offset: calc(-1 * var(--cg-border-width-100));\n    }\n    :host([invalid-over]) {\n      outline: var(--cg-border-width-100) dashed var(--cg-color-status-error-border-default);\n      outline-offset: calc(-1 * var(--cg-border-width-100));\n    }\n    :host([disabled]) {\n      pointer-events: none;\n    }\n  `];\n\n  /** Space-separated list of accepted draggable types. Empty = accept any. */\n  @property() accepts = '';\n\n  /** Disable the drop zone (still listens but never accepts). */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** Reflects while a valid drag hovers. */\n  @property({ type: Boolean, reflect: true }) over = false;\n\n  /** Reflects while an out-of-type drag hovers. */\n  @property({ type: Boolean, reflect: true, attribute: 'invalid-over' }) invalidOver = false;\n\n  @state() private _wasOver = false;\n\n  private _onDragStart = (e: Event): void => {\n    this._wasOver = false;\n    const detail = (e as CustomEvent<DragMoveDetail>).detail;\n    this._evaluateHover(detail);\n  };\n\n  private _onDragMove = (e: Event): void => {\n    const detail = (e as CustomEvent<DragMoveDetail>).detail;\n    this._evaluateHover(detail);\n  };\n\n  private _onDragEnd = (e: Event): void => {\n    const detail = (e as CustomEvent<DragEndDetail>).detail;\n    const accepts = this._accepts(detail.type);\n    const inside = this._pointInside(detail.clientX, detail.clientY);\n\n    if (this._wasOver) {\n      this.dispatchEvent(new CustomEvent('cg-drop-leave', {\n        detail: { type: detail.type, payload: detail.payload },\n        bubbles: true, composed: true,\n      }));\n    }\n\n    this.over = false;\n    this.invalidOver = false;\n    this._wasOver = false;\n\n    if (!this.disabled && accepts && inside && !detail.dropped) {\n      this.dispatchEvent(new CustomEvent('cg-drop', {\n        detail: {\n          type: detail.type,\n          payload: detail.payload,\n          clientX: detail.clientX,\n          clientY: detail.clientY,\n          source: detail.source,\n        },\n        bubbles: true, composed: true,\n      }));\n      // Broadcast on document so the originating cg-draggable can mark its\n      // session as `dropped: true`.\n      document.dispatchEvent(new Event('cg-drop'));\n    }\n  };\n\n  private _evaluateHover(detail: DragMoveDetail): void {\n    if (this.disabled) {\n      this.over = false;\n      this.invalidOver = false;\n      return;\n    }\n    const inside = this._pointInside(detail.clientX, detail.clientY);\n    const accepts = this._accepts(detail.type);\n\n    if (inside && accepts) {\n      if (!this.over) {\n        this.dispatchEvent(new CustomEvent('cg-drop-enter', {\n          detail: { type: detail.type, payload: detail.payload },\n          bubbles: true, composed: true,\n        }));\n        this._wasOver = true;\n      }\n      this.over = true;\n      this.invalidOver = false;\n    } else if (inside && !accepts) {\n      if (this.over) {\n        this.dispatchEvent(new CustomEvent('cg-drop-leave', {\n          detail: { type: detail.type, payload: detail.payload },\n          bubbles: true, composed: true,\n        }));\n      }\n      this.over = false;\n      this.invalidOver = true;\n    } else {\n      if (this.over) {\n        this.dispatchEvent(new CustomEvent('cg-drop-leave', {\n          detail: { type: detail.type, payload: detail.payload },\n          bubbles: true, composed: true,\n        }));\n      }\n      this.over = false;\n      this.invalidOver = false;\n    }\n  }\n\n  private _pointInside(x: number, y: number): boolean {\n    if (x < 0 && y < 0) return false; // sentinel for cancelled drags\n    const r = this.getBoundingClientRect();\n    return x >= r.left && x <= r.right && y >= r.top && y <= r.bottom;\n  }\n\n  private _accepts(type: string): boolean {\n    if (!this.accepts) return true;\n    const allowed = this.accepts.trim().split(/\\s+/);\n    return allowed.includes(type);\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    document.addEventListener('cg-drag-start', this._onDragStart);\n    document.addEventListener('cg-drag-move', this._onDragMove);\n    document.addEventListener('cg-drag-end', this._onDragEnd);\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    document.removeEventListener('cg-drag-start', this._onDragStart);\n    document.removeEventListener('cg-drag-move', this._onDragMove);\n    document.removeEventListener('cg-drag-end', this._onDragEnd);\n  }\n\n  override render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-droppable': CgDroppable;\n  }\n}\n"],"names":["CgDroppable","LitElement","e","detail","accepts","inside","x","y","type","html","hostBlock","reducedMotion","css","__decorateClass","property","state","customElement"],"mappings":"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"}

package/dist/components/cg-filter-bar/cg-filter-bar.d.ts

@@ -1,50 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * @element cg-filter-bar
- * Horizontal toolbar that groups a search input, applied filter chips, an
- * "add filter" trigger, and a "clear all" affordance — the canonical
- * composition for filtered list/table views. The bar wraps onto multiple
- * rows when chips overflow.
- *
- * The component is layout-only: it does not own filter state. Consumers
- * slot in `<cg-search-input>`, render their own `<cg-filter-chip>`
- * elements (one per applied filter), and wire the trigger and clear
- * actions to their own filter store.
- *
- * @example
- * ```html
- * <cg-filter-bar @cg-filter-clear-all=${onClearAll}>
- *   <cg-search-input slot="search" placeholder="Search…" @cg-search=${onSearch}></cg-search-input>
- *   <cg-filter-chip filter-key="status" label="Status" value="Active"></cg-filter-chip>
- *   <cg-filter-chip filter-key="role" label="Role" value="Doctor"></cg-filter-chip>
- *   <cg-button slot="trigger" variant="tertiary" @click=${onAddFilter}>+ Add filter</cg-button>
- * </cg-filter-bar>
- * ```
- *
- * @slot search - The search input (shown left)
- * @slot - Default slot for cg-filter-chip elements (between search and trigger)
- * @slot trigger - "Add filter" button or trigger
- *
- * @fires {CustomEvent} cg-filter-clear-all - "Clear all" button clicked. Consumer should remove all filters.
- *
- * @cssprop --cg-component-filter-bar-gap - Gap between bar regions (default 8px)
- */
-export declare class CgFilterBar extends LitElement {
-    static styles: import('lit').CSSResult[];
-    /** When the chip slot is empty, hide the "Clear all" button. */
-    hideEmptyClear: boolean;
-    /** Override the "Clear all" label. */
-    clearLabel: string;
-    /** Don't reserve a min-width for the search slot (useful inside narrow containers). */
-    noSearchGrow: boolean;
-    private _hasChips;
-    private _onChipSlotChange;
-    private _onClearAll;
-    render(): import('lit').TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'cg-filter-bar': CgFilterBar;
-    }
-}
-//# sourceMappingURL=cg-filter-bar.d.ts.map

package/dist/components/cg-filter-bar/cg-filter-bar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-filter-bar.d.ts","sourceRoot":"","sources":["../../../src/components/cg-filter-bar/cg-filter-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAIrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,OAAgB,MAAM,4BAuDnB;IAEH,gEAAgE;IACW,cAAc,UAAQ;IAEjG,sCAAsC;IACE,UAAU,SAAe;IAEjE,uFAAuF;IACd,YAAY,UAAS;IAErF,OAAO,CAAC,SAAS,CAAS;IAEnC,OAAO,CAAC,iBAAiB,CAIvB;IAEF,OAAO,CAAC,WAAW,CAMjB;IAEO,MAAM;CAmBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}

package/dist/components/cg-filter-bar/cg-filter-bar.js

@@ -1,115 +0,0 @@
-import { css as g, LitElement as h, nothing as d, html as p } from "lit";
-import { property as c, state as u, customElement as v } from "lit/decorators.js";
-import { h as f, r as b } from "../../chunks/premium.css-9I4kHrsl.js";
-var m = Object.defineProperty, y = Object.getOwnPropertyDescriptor, o = (t, e, s, i) => {
-  for (var r = i > 1 ? void 0 : i ? y(e, s) : e, l = t.length - 1, n; l >= 0; l--)
-    (n = t[l]) && (r = (i ? n(e, s, r) : n(r)) || r);
-  return i && r && m(e, s, r), r;
-};
-let a = class extends h {
-  constructor() {
-    super(...arguments), this.hideEmptyClear = !0, this.clearLabel = "Clear all", this.noSearchGrow = !1, this._hasChips = !1, this._onChipSlotChange = (t) => {
-      const s = t.target.assignedElements({ flatten: !0 });
-      this._hasChips = s.length > 0;
-    }, this._onClearAll = (t) => {
-      t.stopPropagation(), this.dispatchEvent(new CustomEvent("cg-filter-clear-all", {
-        bubbles: !0,
-        composed: !0
-      }));
-    };
-  }
-  render() {
-    const t = this._hasChips || !this.hideEmptyClear;
-    return p`
-      <div class="bar" role="toolbar" aria-label="Filters">
-        <div class="search">
-          <slot name="search"></slot>
-        </div>
-        <div class="chips">
-          <slot @slotchange=${this._onChipSlotChange}></slot>
-        </div>
-        <div class="actions">
-          <slot name="trigger"></slot>
-          ${t ? p`
-            <button type="button" class="clear-all" @click=${this._onClearAll}>${this.clearLabel}</button>
-          ` : d}
-        </div>
-      </div>
-    `;
-  }
-};
-a.styles = [f, b, g`
-    :host { display: block; }
-
-    .bar {
-      display: flex;
-      flex-wrap: wrap;
-      align-items: center;
-      gap: var(--cg-component-filter-bar-gap, var(--cg-spacing-8));
-      padding: var(--cg-spacing-8) 0;
-    }
-
-    .search ::slotted(*) {
-      min-width: var(--cg-spacing-200, 200px);
-    }
-    :host([no-search-grow]) .search ::slotted(*) {
-      min-width: 0;
-    }
-
-    .chips {
-      display: inline-flex;
-      flex-wrap: wrap;
-      align-items: center;
-      gap: var(--cg-spacing-8);
-      flex: 1 1 auto;
-      min-width: 0;
-    }
-
-    .actions {
-      display: inline-flex;
-      align-items: center;
-      gap: var(--cg-spacing-4);
-      margin-left: auto;
-    }
-
-    .clear-all {
-      background: transparent;
-      border: 0;
-      padding: var(--cg-spacing-4) var(--cg-spacing-8);
-      font: inherit;
-      font-size: var(--cg-font-size-xs);
-      color: var(--cg-color-surface-container-outlined);
-      cursor: pointer;
-      border-radius: var(--cg-border-radius-100);
-      transition:
-        color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),
-        background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
-    }
-    .clear-all:hover {
-      color: var(--cg-color-surface-base-text);
-      background: var(--cg-color-action-tertiary-background-hover);
-    }
-    .clear-all:focus-visible {
-      outline: none;
-      box-shadow: 0 0 0 var(--cg-spacing-2) var(--cg-color-focus-ring);
-    }
-  `];
-o([
-  c({ type: Boolean, attribute: "hide-empty-clear", reflect: !0 })
-], a.prototype, "hideEmptyClear", 2);
-o([
-  c({ attribute: "clear-label" })
-], a.prototype, "clearLabel", 2);
-o([
-  c({ type: Boolean, attribute: "no-search-grow", reflect: !0 })
-], a.prototype, "noSearchGrow", 2);
-o([
-  u()
-], a.prototype, "_hasChips", 2);
-a = o([
-  v("cg-filter-bar")
-], a);
-export {
-  a as CgFilterBar
-};
-//# sourceMappingURL=cg-filter-bar.js.map

package/dist/components/cg-filter-bar/cg-filter-bar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-filter-bar.js","sources":["../../../src/components/cg-filter-bar/cg-filter-bar.ts"],"sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/**\n * @element cg-filter-bar\n * Horizontal toolbar that groups a search input, applied filter chips, an\n * \"add filter\" trigger, and a \"clear all\" affordance — the canonical\n * composition for filtered list/table views. The bar wraps onto multiple\n * rows when chips overflow.\n *\n * The component is layout-only: it does not own filter state. Consumers\n * slot in `<cg-search-input>`, render their own `<cg-filter-chip>`\n * elements (one per applied filter), and wire the trigger and clear\n * actions to their own filter store.\n *\n * @example\n * ```html\n * <cg-filter-bar @cg-filter-clear-all=${onClearAll}>\n *   <cg-search-input slot=\"search\" placeholder=\"Search…\" @cg-search=${onSearch}></cg-search-input>\n *   <cg-filter-chip filter-key=\"status\" label=\"Status\" value=\"Active\"></cg-filter-chip>\n *   <cg-filter-chip filter-key=\"role\" label=\"Role\" value=\"Doctor\"></cg-filter-chip>\n *   <cg-button slot=\"trigger\" variant=\"tertiary\" @click=${onAddFilter}>+ Add filter</cg-button>\n * </cg-filter-bar>\n * ```\n *\n * @slot search - The search input (shown left)\n * @slot - Default slot for cg-filter-chip elements (between search and trigger)\n * @slot trigger - \"Add filter\" button or trigger\n *\n * @fires {CustomEvent} cg-filter-clear-all - \"Clear all\" button clicked. Consumer should remove all filters.\n *\n * @cssprop --cg-component-filter-bar-gap - Gap between bar regions (default 8px)\n */\n@customElement('cg-filter-bar')\nexport class CgFilterBar extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host { display: block; }\n\n    .bar {\n      display: flex;\n      flex-wrap: wrap;\n      align-items: center;\n      gap: var(--cg-component-filter-bar-gap, var(--cg-spacing-8));\n      padding: var(--cg-spacing-8) 0;\n    }\n\n    .search ::slotted(*) {\n      min-width: var(--cg-spacing-200, 200px);\n    }\n    :host([no-search-grow]) .search ::slotted(*) {\n      min-width: 0;\n    }\n\n    .chips {\n      display: inline-flex;\n      flex-wrap: wrap;\n      align-items: center;\n      gap: var(--cg-spacing-8);\n      flex: 1 1 auto;\n      min-width: 0;\n    }\n\n    .actions {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-4);\n      margin-left: auto;\n    }\n\n    .clear-all {\n      background: transparent;\n      border: 0;\n      padding: var(--cg-spacing-4) var(--cg-spacing-8);\n      font: inherit;\n      font-size: var(--cg-font-size-xs);\n      color: var(--cg-color-surface-container-outlined);\n      cursor: pointer;\n      border-radius: var(--cg-border-radius-100);\n      transition:\n        color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n    .clear-all:hover {\n      color: var(--cg-color-surface-base-text);\n      background: var(--cg-color-action-tertiary-background-hover);\n    }\n    .clear-all:focus-visible {\n      outline: none;\n      box-shadow: 0 0 0 var(--cg-spacing-2) var(--cg-color-focus-ring);\n    }\n  `];\n\n  /** When the chip slot is empty, hide the \"Clear all\" button. */\n  @property({ type: Boolean, attribute: 'hide-empty-clear', reflect: true }) hideEmptyClear = true;\n\n  /** Override the \"Clear all\" label. */\n  @property({ attribute: 'clear-label' }) clearLabel = 'Clear all';\n\n  /** Don't reserve a min-width for the search slot (useful inside narrow containers). */\n  @property({ type: Boolean, attribute: 'no-search-grow', reflect: true }) noSearchGrow = false;\n\n  @state() private _hasChips = false;\n\n  private _onChipSlotChange = (e: Event): void => {\n    const slot = e.target as HTMLSlotElement;\n    const assigned = slot.assignedElements({ flatten: true });\n    this._hasChips = assigned.length > 0;\n  };\n\n  private _onClearAll = (e: Event): void => {\n    e.stopPropagation();\n    this.dispatchEvent(new CustomEvent('cg-filter-clear-all', {\n      bubbles: true,\n      composed: true,\n    }));\n  };\n\n  override render() {\n    const showClear = this._hasChips || !this.hideEmptyClear;\n    return html`\n      <div class=\"bar\" role=\"toolbar\" aria-label=\"Filters\">\n        <div class=\"search\">\n          <slot name=\"search\"></slot>\n        </div>\n        <div class=\"chips\">\n          <slot @slotchange=${this._onChipSlotChange}></slot>\n        </div>\n        <div class=\"actions\">\n          <slot name=\"trigger\"></slot>\n          ${showClear ? html`\n            <button type=\"button\" class=\"clear-all\" @click=${this._onClearAll}>${this.clearLabel}</button>\n          ` : nothing}\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-filter-bar': CgFilterBar;\n  }\n}\n"],"names":["CgFilterBar","LitElement","e","assigned","showClear","html","nothing","hostBlock","reducedMotion","css","__decorateClass","property","state","customElement"],"mappings":";;;;;;;;AAmCO,IAAMA,IAAN,cAA0BC,EAAW;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GA2DsE,KAAA,iBAAiB,IAGpD,KAAA,aAAa,aAGoB,KAAA,eAAe,IAE/E,KAAQ,YAAY,IAE7B,KAAQ,oBAAoB,CAACC,MAAmB;AAE9C,YAAMC,IADOD,EAAE,OACO,iBAAiB,EAAE,SAAS,IAAM;AACxD,WAAK,YAAYC,EAAS,SAAS;AAAA,IACrC,GAEA,KAAQ,cAAc,CAACD,MAAmB;AACxC,MAAAA,EAAE,gBAAA,GACF,KAAK,cAAc,IAAI,YAAY,uBAAuB;AAAA,QACxD,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX,CAAC;AAAA,IACJ;AAAA,EAAA;AAAA,EAES,SAAS;AAChB,UAAME,IAAY,KAAK,aAAa,CAAC,KAAK;AAC1C,WAAOC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BAMmB,KAAK,iBAAiB;AAAA;AAAA;AAAA;AAAA,YAIxCD,IAAYC;AAAA,6DACqC,KAAK,WAAW,IAAI,KAAK,UAAU;AAAA,cAClFC,CAAO;AAAA;AAAA;AAAA;AAAA,EAInB;AACF;AAtGaN,EACK,SAAS,CAACO,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,GAuDnD;AAG0EC,EAAA;AAAA,EAA1EC,EAAS,EAAE,MAAM,SAAS,WAAW,oBAAoB,SAAS,IAAM;AAAA,GA3D9DX,EA2DgE,WAAA,kBAAA,CAAA;AAGnCU,EAAA;AAAA,EAAvCC,EAAS,EAAE,WAAW,cAAA,CAAe;AAAA,GA9D3BX,EA8D6B,WAAA,cAAA,CAAA;AAGiCU,EAAA;AAAA,EAAxEC,EAAS,EAAE,MAAM,SAAS,WAAW,kBAAkB,SAAS,IAAM;AAAA,GAjE5DX,EAiE8D,WAAA,gBAAA,CAAA;AAExDU,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAnEIZ,EAmEM,WAAA,aAAA,CAAA;AAnENA,IAANU,EAAA;AAAA,EADNG,EAAc,eAAe;AAAA,GACjBb,CAAA;"}

package/dist/components/cg-filter-chip/cg-filter-chip.d.ts

@@ -1,55 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * @element cg-filter-chip
- * Removable key/value pill for filter bars — renders as
- * "{label}: {value}" with a click-to-edit body and an explicit close
- * button. Use one chip per applied filter.
- *
- * Distinct from `cg-chip`: filter-chip is always two-part (label +
- * value), always removable, and the body click fires an
- * `cg-filter-edit` event so consumers can pop a value editor; clicking
- * the close button fires a separate `cg-filter-remove` event.
- *
- * @example
- * ```html
- * <cg-filter-chip
- *   filter-key="status"
- *   label="Status"
- *   value="Active"
- *   @cg-filter-edit=${onEdit}
- *   @cg-filter-remove=${onRemove}
- * ></cg-filter-chip>
- * ```
- *
- * @example With count badge
- * ```html
- * <cg-filter-chip label="Tags" value="UI, Design" count="2"></cg-filter-chip>
- * ```
- *
- * @fires {CustomEvent<{filterKey: string, value: string}>} cg-filter-edit - Body clicked
- * @fires {CustomEvent<{filterKey: string}>} cg-filter-remove - Close button clicked
- */
-export declare class CgFilterChip extends LitElement {
-    static styles: import('lit').CSSResult[];
-    /** Stable identifier for the filter dimension (e.g., "status"). Emitted in events. */
-    filterKey: string;
-    /** Display label for the filter dimension (e.g., "Status"). */
-    label: string;
-    /** Currently applied value display (e.g., "Active"). */
-    value: string;
-    /** Optional small badge — useful when the filter has multiple values. */
-    count: number;
-    /** Visually mark the chip as applied (slightly stronger background/border). */
-    applied: boolean;
-    size: 'sm' | 'md';
-    disabled: boolean;
-    private _onBodyClick;
-    private _onRemoveClick;
-    render(): import('lit').TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'cg-filter-chip': CgFilterChip;
-    }
-}
-//# sourceMappingURL=cg-filter-chip.d.ts.map

package/dist/components/cg-filter-chip/cg-filter-chip.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-filter-chip.d.ts","sourceRoot":"","sources":["../../../src/components/cg-filter-chip/cg-filter-chip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAIrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,qBACa,YAAa,SAAQ,UAAU;IAC1C,OAAgB,MAAM,4BAkInB;IAEH,sFAAsF;IAC/C,SAAS,SAAM;IAEtD,+DAA+D;IACnD,KAAK,SAAM;IAEvB,wDAAwD;IAC5C,KAAK,SAAM;IAEvB,yEAAyE;IAC7C,KAAK,SAAK;IAEtC,+EAA+E;IACnC,OAAO,UAAQ;IAE9B,IAAI,EAAE,IAAI,GAAG,IAAI,CAAQ;IAEV,QAAQ,UAAS;IAE7D,OAAO,CAAC,YAAY,CAQlB;IAEF,OAAO,CAAC,cAAc,CAQpB;IAEO,MAAM;CA6BhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}

package/dist/components/cg-filter-chip/cg-filter-chip.js

@@ -1,213 +0,0 @@
-import { css as p, LitElement as u, nothing as g, html as d } from "lit";
-import { property as o, customElement as h } from "lit/decorators.js";
-import { a as v, r as b } from "../../chunks/premium.css-9I4kHrsl.js";
-var f = Object.defineProperty, m = Object.getOwnPropertyDescriptor, t = (r, i, c, s) => {
-  for (var a = s > 1 ? void 0 : s ? m(i, c) : i, n = r.length - 1, l; n >= 0; n--)
-    (l = r[n]) && (a = (s ? l(i, c, a) : l(a)) || a);
-  return s && a && f(i, c, a), a;
-};
-let e = class extends u {
-  constructor() {
-    super(...arguments), this.filterKey = "", this.label = "", this.value = "", this.count = 0, this.applied = !0, this.size = "md", this.disabled = !1, this._onBodyClick = (r) => {
-      r.stopPropagation(), !this.disabled && this.dispatchEvent(new CustomEvent("cg-filter-edit", {
-        detail: { filterKey: this.filterKey, value: this.value },
-        bubbles: !0,
-        composed: !0
-      }));
-    }, this._onRemoveClick = (r) => {
-      r.stopPropagation(), !this.disabled && this.dispatchEvent(new CustomEvent("cg-filter-remove", {
-        detail: { filterKey: this.filterKey },
-        bubbles: !0,
-        composed: !0
-      }));
-    };
-  }
-  render() {
-    const r = `chip ${this.applied ? "applied" : ""}`;
-    return d`
-      <span class=${r}>
-        <button
-          type="button"
-          class="body"
-          ?disabled=${this.disabled}
-          @click=${this._onBodyClick}
-          aria-label=${`Edit ${this.label} filter`}
-        >
-          ${this.label ? d`<span class="label">${this.label}</span>` : g}
-          <span class="value">${this.value}</span>
-          ${this.count > 0 ? d`<span class="count">${this.count}</span>` : g}
-        </button>
-        <button
-          type="button"
-          class="remove"
-          ?disabled=${this.disabled}
-          @click=${this._onRemoveClick}
-          aria-label=${`Remove ${this.label} filter`}
-        >
-          <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-            <path d="M4 4l8 8M12 4l-8 8"/>
-          </svg>
-        </button>
-      </span>
-    `;
-  }
-};
-e.styles = [v, b, p`
-    :host { display: inline-flex; }
-
-    .chip {
-      display: inline-flex;
-      align-items: center;
-      gap: 0;
-      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
-      border-radius: var(--cg-border-radius-full);
-      background: var(--cg-color-surface-cards-background);
-      color: var(--cg-color-surface-base-text);
-      font-family: inherit;
-      font-weight: var(--cg-font-weight-medium);
-      line-height: 1;
-      white-space: nowrap;
-      user-select: none;
-      transition:
-        background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),
-        border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),
-        box-shadow var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
-      padding: 0;
-      height: var(--cg-spacing-32);
-      font-size: var(--cg-font-size-sm);
-    }
-
-    :host([size="sm"]) .chip {
-      height: var(--cg-spacing-24);
-      font-size: var(--cg-font-size-xs);
-    }
-
-    /* Applied — accent-tinted bg signals "this filter is in effect"
-       (semantically distinct from hover's neutral gray). Both
-       --cg-color-surface-cards-hover-background and
-       --cg-color-action-tertiary-background-hover resolve to the same
-       gray tone, so we'd previously had .applied + hover collide.
-       overlay-accent-light is rgba accent (8/12% in light/dark), and
-       hover on applied chips deepens it to overlay-accent-medium —
-       ensures every state transition has visible feedback. */
-    .chip.applied {
-      background: var(--cg-overlay-accent-light);
-      border-color: var(--cg-color-surface-cards-border-strong);
-    }
-
-    .body {
-      display: inline-flex;
-      align-items: center;
-      gap: var(--cg-spacing-4);
-      padding: 0 var(--cg-spacing-12);
-      height: 100%;
-      cursor: pointer;
-      background: transparent;
-      border: 0;
-      color: inherit;
-      font: inherit;
-    }
-    :host([size="sm"]) .body { padding: 0 var(--cg-spacing-8); }
-
-    .body:hover { background: var(--cg-color-action-tertiary-background-hover); }
-    /* Hover on an already-applied chip deepens the accent rather than
-       collapsing back to neutral gray, keeping the "in effect" cue. */
-    .chip.applied .body:hover { background: var(--cg-overlay-accent-medium); }
-    .body:active { transform: scale(var(--cg-interaction-press-scale)); }
-    .body:focus-visible {
-      outline: none;
-      box-shadow: inset 0 0 0 var(--cg-border-width-100) var(--cg-color-focus-ring);
-    }
-
-    .label {
-      color: var(--cg-color-input-text-placeholder);
-    }
-    .label::after {
-      content: ":";
-      margin-right: var(--cg-spacing-4);
-    }
-    .value {
-      color: var(--cg-color-surface-base-text);
-    }
-    .count {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      min-width: var(--cg-spacing-16);
-      height: var(--cg-spacing-16);
-      padding: 0 var(--cg-spacing-4);
-      border-radius: var(--cg-border-radius-full);
-      /* Neutral counter pill — surface-cards-emphasis is the project's
-         "subtle fill on a card" token. Skipped the badge-* tokens
-         because their default resolves to info-blue, which would tint
-         the count badge for a non-info filter. */
-      background: var(--cg-color-surface-cards-emphasis);
-      color: var(--cg-color-surface-cards-text);
-      font-size: var(--cg-font-size-xs);
-      font-weight: var(--cg-font-weight-medium);
-      line-height: 1;
-    }
-
-    .remove {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      width: var(--cg-spacing-32);
-      height: 100%;
-      cursor: pointer;
-      background: transparent;
-      border: 0;
-      border-left: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);
-      color: var(--cg-color-input-text-placeholder);
-      transition: color var(--cg-transition-duration-fast) var(--cg-transition-easing-default), background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
-      border-radius: 0 var(--cg-border-radius-full) var(--cg-border-radius-full) 0;
-    }
-    :host([size="sm"]) .remove { width: var(--cg-spacing-24); }
-
-    .remove:hover {
-      color: var(--cg-color-status-error-text-default);
-      background: var(--cg-color-status-error-background-default);
-    }
-    .remove:active { transform: scale(var(--cg-interaction-press-scale)); }
-    .remove:focus-visible {
-      outline: none;
-      box-shadow: inset 0 0 0 var(--cg-border-width-100) var(--cg-color-focus-ring);
-    }
-    .remove svg {
-      width: var(--cg-spacing-12);
-      height: var(--cg-spacing-12);
-    }
-
-    :host([disabled]) .chip {
-      opacity: 0.5;
-      pointer-events: none;
-    }
-  `];
-t([
-  o({ attribute: "filter-key" })
-], e.prototype, "filterKey", 2);
-t([
-  o()
-], e.prototype, "label", 2);
-t([
-  o()
-], e.prototype, "value", 2);
-t([
-  o({ type: Number })
-], e.prototype, "count", 2);
-t([
-  o({ type: Boolean, reflect: !0 })
-], e.prototype, "applied", 2);
-t([
-  o({ reflect: !0 })
-], e.prototype, "size", 2);
-t([
-  o({ type: Boolean, reflect: !0 })
-], e.prototype, "disabled", 2);
-e = t([
-  h("cg-filter-chip")
-], e);
-export {
-  e as CgFilterChip
-};
-//# sourceMappingURL=cg-filter-chip.js.map

package/dist/components/cg-filter-chip/cg-filter-chip.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-filter-chip.js","sources":["../../../src/components/cg-filter-chip/cg-filter-chip.ts"],"sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { hostBase, reducedMotion } from '../../styles/index.js';\n\n/**\n * @element cg-filter-chip\n * Removable key/value pill for filter bars — renders as\n * \"{label}: {value}\" with a click-to-edit body and an explicit close\n * button. Use one chip per applied filter.\n *\n * Distinct from `cg-chip`: filter-chip is always two-part (label +\n * value), always removable, and the body click fires an\n * `cg-filter-edit` event so consumers can pop a value editor; clicking\n * the close button fires a separate `cg-filter-remove` event.\n *\n * @example\n * ```html\n * <cg-filter-chip\n *   filter-key=\"status\"\n *   label=\"Status\"\n *   value=\"Active\"\n *   @cg-filter-edit=${onEdit}\n *   @cg-filter-remove=${onRemove}\n * ></cg-filter-chip>\n * ```\n *\n * @example With count badge\n * ```html\n * <cg-filter-chip label=\"Tags\" value=\"UI, Design\" count=\"2\"></cg-filter-chip>\n * ```\n *\n * @fires {CustomEvent<{filterKey: string, value: string}>} cg-filter-edit - Body clicked\n * @fires {CustomEvent<{filterKey: string}>} cg-filter-remove - Close button clicked\n */\n@customElement('cg-filter-chip')\nexport class CgFilterChip extends LitElement {\n  static override styles = [hostBase, reducedMotion, css`\n    :host { display: inline-flex; }\n\n    .chip {\n      display: inline-flex;\n      align-items: center;\n      gap: 0;\n      border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      border-radius: var(--cg-border-radius-full);\n      background: var(--cg-color-surface-cards-background);\n      color: var(--cg-color-surface-base-text);\n      font-family: inherit;\n      font-weight: var(--cg-font-weight-medium);\n      line-height: 1;\n      white-space: nowrap;\n      user-select: none;\n      transition:\n        background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        border-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default),\n        box-shadow var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n      padding: 0;\n      height: var(--cg-spacing-32);\n      font-size: var(--cg-font-size-sm);\n    }\n\n    :host([size=\"sm\"]) .chip {\n      height: var(--cg-spacing-24);\n      font-size: var(--cg-font-size-xs);\n    }\n\n    /* Applied — accent-tinted bg signals \"this filter is in effect\"\n       (semantically distinct from hover's neutral gray). Both\n       --cg-color-surface-cards-hover-background and\n       --cg-color-action-tertiary-background-hover resolve to the same\n       gray tone, so we'd previously had .applied + hover collide.\n       overlay-accent-light is rgba accent (8/12% in light/dark), and\n       hover on applied chips deepens it to overlay-accent-medium —\n       ensures every state transition has visible feedback. */\n    .chip.applied {\n      background: var(--cg-overlay-accent-light);\n      border-color: var(--cg-color-surface-cards-border-strong);\n    }\n\n    .body {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--cg-spacing-4);\n      padding: 0 var(--cg-spacing-12);\n      height: 100%;\n      cursor: pointer;\n      background: transparent;\n      border: 0;\n      color: inherit;\n      font: inherit;\n    }\n    :host([size=\"sm\"]) .body { padding: 0 var(--cg-spacing-8); }\n\n    .body:hover { background: var(--cg-color-action-tertiary-background-hover); }\n    /* Hover on an already-applied chip deepens the accent rather than\n       collapsing back to neutral gray, keeping the \"in effect\" cue. */\n    .chip.applied .body:hover { background: var(--cg-overlay-accent-medium); }\n    .body:active { transform: scale(var(--cg-interaction-press-scale)); }\n    .body:focus-visible {\n      outline: none;\n      box-shadow: inset 0 0 0 var(--cg-border-width-100) var(--cg-color-focus-ring);\n    }\n\n    .label {\n      color: var(--cg-color-input-text-placeholder);\n    }\n    .label::after {\n      content: \":\";\n      margin-right: var(--cg-spacing-4);\n    }\n    .value {\n      color: var(--cg-color-surface-base-text);\n    }\n    .count {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      min-width: var(--cg-spacing-16);\n      height: var(--cg-spacing-16);\n      padding: 0 var(--cg-spacing-4);\n      border-radius: var(--cg-border-radius-full);\n      /* Neutral counter pill — surface-cards-emphasis is the project's\n         \"subtle fill on a card\" token. Skipped the badge-* tokens\n         because their default resolves to info-blue, which would tint\n         the count badge for a non-info filter. */\n      background: var(--cg-color-surface-cards-emphasis);\n      color: var(--cg-color-surface-cards-text);\n      font-size: var(--cg-font-size-xs);\n      font-weight: var(--cg-font-weight-medium);\n      line-height: 1;\n    }\n\n    .remove {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: var(--cg-spacing-32);\n      height: 100%;\n      cursor: pointer;\n      background: transparent;\n      border: 0;\n      border-left: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n      color: var(--cg-color-input-text-placeholder);\n      transition: color var(--cg-transition-duration-fast) var(--cg-transition-easing-default), background-color var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n      border-radius: 0 var(--cg-border-radius-full) var(--cg-border-radius-full) 0;\n    }\n    :host([size=\"sm\"]) .remove { width: var(--cg-spacing-24); }\n\n    .remove:hover {\n      color: var(--cg-color-status-error-text-default);\n      background: var(--cg-color-status-error-background-default);\n    }\n    .remove:active { transform: scale(var(--cg-interaction-press-scale)); }\n    .remove:focus-visible {\n      outline: none;\n      box-shadow: inset 0 0 0 var(--cg-border-width-100) var(--cg-color-focus-ring);\n    }\n    .remove svg {\n      width: var(--cg-spacing-12);\n      height: var(--cg-spacing-12);\n    }\n\n    :host([disabled]) .chip {\n      opacity: 0.5;\n      pointer-events: none;\n    }\n  `];\n\n  /** Stable identifier for the filter dimension (e.g., \"status\"). Emitted in events. */\n  @property({ attribute: 'filter-key' }) filterKey = '';\n\n  /** Display label for the filter dimension (e.g., \"Status\"). */\n  @property() label = '';\n\n  /** Currently applied value display (e.g., \"Active\"). */\n  @property() value = '';\n\n  /** Optional small badge — useful when the filter has multiple values. */\n  @property({ type: Number }) count = 0;\n\n  /** Visually mark the chip as applied (slightly stronger background/border). */\n  @property({ type: Boolean, reflect: true }) applied = true;\n\n  @property({ reflect: true }) size: 'sm' | 'md' = 'md';\n\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  private _onBodyClick = (e: Event): void => {\n    e.stopPropagation();\n    if (this.disabled) return;\n    this.dispatchEvent(new CustomEvent('cg-filter-edit', {\n      detail: { filterKey: this.filterKey, value: this.value },\n      bubbles: true,\n      composed: true,\n    }));\n  };\n\n  private _onRemoveClick = (e: Event): void => {\n    e.stopPropagation();\n    if (this.disabled) return;\n    this.dispatchEvent(new CustomEvent('cg-filter-remove', {\n      detail: { filterKey: this.filterKey },\n      bubbles: true,\n      composed: true,\n    }));\n  };\n\n  override render() {\n    const cls = `chip ${this.applied ? 'applied' : ''}`;\n    return html`\n      <span class=${cls}>\n        <button\n          type=\"button\"\n          class=\"body\"\n          ?disabled=${this.disabled}\n          @click=${this._onBodyClick}\n          aria-label=${`Edit ${this.label} filter`}\n        >\n          ${this.label ? html`<span class=\"label\">${this.label}</span>` : nothing}\n          <span class=\"value\">${this.value}</span>\n          ${this.count > 0 ? html`<span class=\"count\">${this.count}</span>` : nothing}\n        </button>\n        <button\n          type=\"button\"\n          class=\"remove\"\n          ?disabled=${this.disabled}\n          @click=${this._onRemoveClick}\n          aria-label=${`Remove ${this.label} filter`}\n        >\n          <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <path d=\"M4 4l8 8M12 4l-8 8\"/>\n          </svg>\n        </button>\n      </span>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-filter-chip': CgFilterChip;\n  }\n}\n"],"names":["CgFilterChip","LitElement","e","cls","html","nothing","hostBase","reducedMotion","css","__decorateClass","property","customElement"],"mappings":"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"}