@cognivo/components 0.8.0 → 0.8.2

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

@@ -1,177 +0,0 @@
-import { css as _, LitElement as m, html as v } from "lit";
-import { property as p, state as b, customElement as w } from "lit/decorators.js";
-import { h as y, r as E } from "../../chunks/premium.css-9I4kHrsl.js";
-var x = Object.defineProperty, I = Object.getOwnPropertyDescriptor, c = (t, e, i, n) => {
-  for (var s = n > 1 ? void 0 : n ? I(e, i) : e, a = t.length - 1, r; a >= 0; a--)
-    (r = t[a]) && (s = (n ? r(e, i, s) : r(s)) || s);
-  return n && s && x(e, i, s), s;
-};
-let h = class extends m {
-  constructor() {
-    super(...arguments), this.handleSelector = "", this.disabled = !1, this.direction = "vertical", this.swapThreshold = 0.5, this._announcement = "", this._draggingEl = null, this._startIndex = -1, this._pointerId = null, this._startPointer = { x: 0, y: 0 }, this._startRect = null, this._onPointerDown = (t) => {
-      if (this.disabled || t.button !== void 0 && t.button !== 0) return;
-      const e = this._findItemFromTarget(t.target);
-      e && (this._draggingEl = e, this._startIndex = this._items().indexOf(e), this._pointerId = t.pointerId, this._startPointer = { x: t.clientX, y: t.clientY }, this._startRect = e.getBoundingClientRect(), e.setPointerCapture(t.pointerId), e.classList.add("cg-sortable-dragging"), this.dispatchEvent(new CustomEvent("cg-sort-start", {
-        detail: { index: this._startIndex, item: e },
-        bubbles: !0,
-        composed: !0
-      })));
-    }, this._onPointerMove = (t) => {
-      if (!this._draggingEl || t.pointerId !== this._pointerId || !this._startRect) return;
-      const e = t.clientX - this._startPointer.x, i = t.clientY - this._startPointer.y;
-      this.direction === "vertical" ? this._draggingEl.style.transform = `translateY(${i}px)` : this._draggingEl.style.transform = `translateX(${e}px)`;
-      const n = this._items(), s = n.indexOf(this._draggingEl);
-      if (s === -1) return;
-      const a = this._startRect.left + this._startRect.width / 2 + e, r = this._startRect.top + this._startRect.height / 2 + i;
-      for (let o = 0; o < n.length; o++) {
-        if (o === s) continue;
-        const u = n[o];
-        if (!u) continue;
-        const l = u.getBoundingClientRect();
-        let g = !1;
-        if (this.direction === "vertical") {
-          const d = l.top + l.height * this.swapThreshold, f = l.top + l.height * (1 - this.swapThreshold);
-          (o < s && r < d || o > s && r > f) && (g = !0);
-        } else {
-          const d = l.left + l.width * this.swapThreshold, f = l.left + l.width * (1 - this.swapThreshold);
-          (o < s && a < d || o > s && a > f) && (g = !0);
-        }
-        if (g) {
-          o < s ? this.insertBefore(this._draggingEl, u) : this.insertBefore(this._draggingEl, u.nextSibling);
-          const d = this._draggingEl.getBoundingClientRect();
-          this._startPointer = {
-            x: this._startPointer.x + (d.left - this._startRect.left),
-            y: this._startPointer.y + (d.top - this._startRect.top)
-          }, this._startRect = d, this._draggingEl.style.transform = "";
-          return;
-        }
-      }
-    }, this._onPointerUp = (t) => {
-      !this._draggingEl || t.pointerId !== this._pointerId || this._finishDrag();
-    }, this._onPointerCancel = (t) => {
-      !this._draggingEl || t.pointerId !== this._pointerId || this._finishDrag();
-    }, this._onKeyDown = (t) => {
-      if (this.disabled) return;
-      const e = this._findItemFromTarget(t.target);
-      if (!e) return;
-      const i = this._items(), n = i.indexOf(e);
-      if (n === -1) return;
-      const s = this.direction === "vertical" ? "ArrowUp" : "ArrowLeft", a = this.direction === "vertical" ? "ArrowDown" : "ArrowRight";
-      let r = -1;
-      if (t.key === s && n > 0) r = n - 1;
-      else if (t.key === a && n < i.length - 1) r = n + 1;
-      else if (t.key === "Home" && n > 0) r = 0;
-      else if (t.key === "End" && n < i.length - 1) r = i.length - 1;
-      else return;
-      t.preventDefault();
-      const o = i[r];
-      o && (r < n ? this.insertBefore(e, o) : this.insertBefore(e, o.nextSibling), e.classList.add("cg-sortable-keyboard-active"), setTimeout(() => e.classList.remove("cg-sortable-keyboard-active"), 600), e.tabIndex < 0 && (e.tabIndex = 0), e.focus(), this.dispatchEvent(new CustomEvent("cg-sort", {
-        detail: { from: n, to: r, items: this._items() },
-        bubbles: !0,
-        composed: !0
-      })), this._announce(`Moved to position ${r + 1} of ${i.length}`));
-    };
-  }
-  _items() {
-    return Array.from(this.children).filter((t) => t instanceof HTMLElement);
-  }
-  _findItemFromTarget(t) {
-    if (!(t instanceof Element) || this.handleSelector && !t.closest(this.handleSelector))
-      return null;
-    const e = this._items();
-    for (const i of e)
-      if (i.contains(t)) return i;
-    return null;
-  }
-  _finishDrag() {
-    const t = this._draggingEl;
-    if (!t) return;
-    if (t.classList.remove("cg-sortable-dragging"), t.style.transform = "", this._pointerId !== null)
-      try {
-        t.releasePointerCapture(this._pointerId);
-      } catch {
-      }
-    const e = this._items(), i = e.indexOf(t);
-    this.dispatchEvent(new CustomEvent("cg-sort-end", {
-      detail: { index: i, item: t },
-      bubbles: !0,
-      composed: !0
-    })), i !== this._startIndex && this._startIndex !== -1 && (this.dispatchEvent(new CustomEvent("cg-sort", {
-      detail: { from: this._startIndex, to: i, items: e },
-      bubbles: !0,
-      composed: !0
-    })), this._announce(`Moved to position ${i + 1} of ${e.length}`)), this._draggingEl = null, this._pointerId = null, this._startIndex = -1, this._startRect = null;
-  }
-  _announce(t) {
-    this._announcement = "", requestAnimationFrame(() => {
-      this._announcement = t;
-    });
-  }
-  connectedCallback() {
-    super.connectedCallback(), this.addEventListener("pointerdown", this._onPointerDown), this.addEventListener("pointermove", this._onPointerMove), this.addEventListener("pointerup", this._onPointerUp), this.addEventListener("pointercancel", this._onPointerCancel), this.addEventListener("keydown", this._onKeyDown);
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener("pointerdown", this._onPointerDown), this.removeEventListener("pointermove", this._onPointerMove), this.removeEventListener("pointerup", this._onPointerUp), this.removeEventListener("pointercancel", this._onPointerCancel), this.removeEventListener("keydown", this._onKeyDown);
-  }
-  render() {
-    return v`
-      <slot></slot>
-      <div class="live" role="status" aria-live="polite" aria-atomic="true">${this._announcement}</div>
-    `;
-  }
-};
-h.styles = [y, E, _`
-    :host { display: block; }
-
-    ::slotted(*) {
-      touch-action: none;
-      cursor: grab;
-      transition: transform var(--cg-transition-duration-fast) var(--cg-transition-easing-default);
-    }
-
-    :host([disabled]) ::slotted(*) {
-      cursor: default;
-      touch-action: auto;
-    }
-
-    ::slotted(.cg-sortable-dragging) {
-      opacity: var(--cg-component-sortable-dragging-opacity, 0.6);
-      cursor: grabbing;
-      z-index: 1;
-      transition: none;
-    }
-
-    ::slotted(.cg-sortable-keyboard-active) {
-      outline: var(--cg-border-width-100) solid var(--cg-color-focus-ring);
-      outline-offset: var(--cg-spacing-2);
-    }
-
-    .live {
-      position: absolute;
-      width: 1px; height: 1px;
-      padding: 0; margin: -1px; overflow: hidden;
-      clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
-    }
-  `];
-c([
-  p({ attribute: "handle-selector" })
-], h.prototype, "handleSelector", 2);
-c([
-  p({ type: Boolean, reflect: !0 })
-], h.prototype, "disabled", 2);
-c([
-  p({ reflect: !0 })
-], h.prototype, "direction", 2);
-c([
-  p({ type: Number, attribute: "swap-threshold" })
-], h.prototype, "swapThreshold", 2);
-c([
-  b()
-], h.prototype, "_announcement", 2);
-h = c([
-  w("cg-sortable")
-], h);
-export {
-  h as CgSortable
-};
-//# sourceMappingURL=cg-sortable.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"cg-sortable.js","sources":["../../../src/components/cg-sortable/cg-sortable.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/**\n * @element cg-sortable\n * Reorderable list. Slot in any elements as direct children — drag them with\n * a pointer (mouse/touch/pen) or move them with the keyboard to reorder.\n * Fires `cg-sort` with the new order when a reorder commits.\n *\n * Pointer drag uses pointer capture, so it works on mouse, touch, and stylus\n * without separate code paths. Keyboard reorder: focus an item, then\n * ArrowUp/ArrowDown (or ArrowLeft/ArrowRight in horizontal mode) to move\n * it. Home/End jump to first/last position.\n *\n * @example\n * ```html\n * <cg-sortable @cg-sort=${onSort}>\n *   <div data-id=\"a\">Item A</div>\n *   <div data-id=\"b\">Item B</div>\n *   <div data-id=\"c\">Item C</div>\n * </cg-sortable>\n * ```\n *\n * @example With drag handles only\n * ```html\n * <cg-sortable handle-selector=\".handle\">\n *   <div data-id=\"a\"><span class=\"handle\">⋮</span> Item A</div>\n *   <div data-id=\"b\"><span class=\"handle\">⋮</span> Item B</div>\n * </cg-sortable>\n * ```\n *\n * @slot - Direct children become the sortable items.\n *\n * @fires {CustomEvent<{from: number, to: number, items: HTMLElement[]}>} cg-sort - Reorder committed\n * @fires {CustomEvent<{index: number, item: HTMLElement}>} cg-sort-start - Drag/move started\n * @fires {CustomEvent<{index: number, item: HTMLElement}>} cg-sort-end - Drag/move ended (no commit if cancelled)\n *\n * @cssprop --cg-component-sortable-dragging-opacity - Opacity of the dragged item (default 0.6)\n */\n@customElement('cg-sortable')\nexport class CgSortable extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host { display: block; }\n\n    ::slotted(*) {\n      touch-action: none;\n      cursor: grab;\n      transition: transform var(--cg-transition-duration-fast) var(--cg-transition-easing-default);\n    }\n\n    :host([disabled]) ::slotted(*) {\n      cursor: default;\n      touch-action: auto;\n    }\n\n    ::slotted(.cg-sortable-dragging) {\n      opacity: var(--cg-component-sortable-dragging-opacity, 0.6);\n      cursor: grabbing;\n      z-index: 1;\n      transition: none;\n    }\n\n    ::slotted(.cg-sortable-keyboard-active) {\n      outline: var(--cg-border-width-100) solid var(--cg-color-focus-ring);\n      outline-offset: var(--cg-spacing-2);\n    }\n\n    .live {\n      position: absolute;\n      width: 1px; height: 1px;\n      padding: 0; margin: -1px; overflow: hidden;\n      clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;\n    }\n  `];\n\n  /** CSS selector inside each item that initiates drag. Empty = whole item is the handle. */\n  @property({ attribute: 'handle-selector' }) handleSelector = '';\n\n  /** Disable both pointer and keyboard reordering. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** Layout axis. `vertical` listens to ArrowUp/Down; `horizontal` listens to ArrowLeft/Right. */\n  @property({ reflect: true }) direction: 'vertical' | 'horizontal' = 'vertical';\n\n  /** Threshold (0..1) of an item's height/width that the pointer must cross to swap. Default 0.5. */\n  @property({ type: Number, attribute: 'swap-threshold' }) swapThreshold = 0.5;\n\n  @state() private _announcement = '';\n\n  private _draggingEl: HTMLElement | null = null;\n  private _startIndex = -1;\n  private _pointerId: number | null = null;\n  private _startPointer: { x: number; y: number } = { x: 0, y: 0 };\n  private _startRect: DOMRect | null = null;\n\n  private _items(): HTMLElement[] {\n    return Array.from(this.children).filter(c => c instanceof HTMLElement) as HTMLElement[];\n  }\n\n  private _findItemFromTarget(target: EventTarget | null): HTMLElement | null {\n    if (!(target instanceof Element)) return null;\n    if (this.handleSelector) {\n      const handle = target.closest(this.handleSelector);\n      if (!handle) return null;\n    }\n    const items = this._items();\n    for (const el of items) {\n      if (el.contains(target as Node)) return el;\n    }\n    return null;\n  }\n\n  private _onPointerDown = (e: PointerEvent): void => {\n    if (this.disabled) return;\n    if (e.button !== undefined && e.button !== 0) return;\n    const item = this._findItemFromTarget(e.target);\n    if (!item) return;\n\n    this._draggingEl = item;\n    this._startIndex = this._items().indexOf(item);\n    this._pointerId = e.pointerId;\n    this._startPointer = { x: e.clientX, y: e.clientY };\n    this._startRect = item.getBoundingClientRect();\n\n    item.setPointerCapture(e.pointerId);\n    item.classList.add('cg-sortable-dragging');\n\n    this.dispatchEvent(new CustomEvent('cg-sort-start', {\n      detail: { index: this._startIndex, item },\n      bubbles: true, composed: true,\n    }));\n  };\n\n  private _onPointerMove = (e: PointerEvent): void => {\n    if (!this._draggingEl || e.pointerId !== this._pointerId || !this._startRect) return;\n\n    const deltaX = e.clientX - this._startPointer.x;\n    const deltaY = e.clientY - this._startPointer.y;\n    if (this.direction === 'vertical') {\n      this._draggingEl.style.transform = `translateY(${deltaY}px)`;\n    } else {\n      this._draggingEl.style.transform = `translateX(${deltaX}px)`;\n    }\n\n    const items = this._items();\n    const dragIdx = items.indexOf(this._draggingEl);\n    if (dragIdx === -1) return;\n\n    const dragCenterX = this._startRect.left + this._startRect.width / 2 + deltaX;\n    const dragCenterY = this._startRect.top + this._startRect.height / 2 + deltaY;\n\n    for (let i = 0; i < items.length; i++) {\n      if (i === dragIdx) continue;\n      const other = items[i];\n      if (!other) continue;\n      const r = other.getBoundingClientRect();\n\n      let crossed = false;\n      if (this.direction === 'vertical') {\n        const threshold = r.top + r.height * this.swapThreshold;\n        const oppositeThreshold = r.top + r.height * (1 - this.swapThreshold);\n        if (i < dragIdx && dragCenterY < threshold) crossed = true;\n        else if (i > dragIdx && dragCenterY > oppositeThreshold) crossed = true;\n      } else {\n        const threshold = r.left + r.width * this.swapThreshold;\n        const oppositeThreshold = r.left + r.width * (1 - this.swapThreshold);\n        if (i < dragIdx && dragCenterX < threshold) crossed = true;\n        else if (i > dragIdx && dragCenterX > oppositeThreshold) crossed = true;\n      }\n\n      if (crossed) {\n        if (i < dragIdx) {\n          this.insertBefore(this._draggingEl, other);\n        } else {\n          this.insertBefore(this._draggingEl, other.nextSibling);\n        }\n        const newRect = this._draggingEl.getBoundingClientRect();\n        this._startPointer = {\n          x: this._startPointer.x + (newRect.left - this._startRect.left),\n          y: this._startPointer.y + (newRect.top - this._startRect.top),\n        };\n        this._startRect = newRect;\n        this._draggingEl.style.transform = '';\n        return;\n      }\n    }\n  };\n\n  private _onPointerUp = (e: PointerEvent): void => {\n    if (!this._draggingEl || e.pointerId !== this._pointerId) return;\n    this._finishDrag();\n  };\n\n  private _onPointerCancel = (e: PointerEvent): void => {\n    if (!this._draggingEl || e.pointerId !== this._pointerId) return;\n    this._finishDrag();\n  };\n\n  private _finishDrag(): void {\n    const item = this._draggingEl;\n    if (!item) return;\n\n    item.classList.remove('cg-sortable-dragging');\n    item.style.transform = '';\n\n    if (this._pointerId !== null) {\n      try { item.releasePointerCapture(this._pointerId); } catch { /* ignore */ }\n    }\n\n    const items = this._items();\n    const finalIndex = items.indexOf(item);\n\n    this.dispatchEvent(new CustomEvent('cg-sort-end', {\n      detail: { index: finalIndex, item },\n      bubbles: true, composed: true,\n    }));\n\n    if (finalIndex !== this._startIndex && this._startIndex !== -1) {\n      this.dispatchEvent(new CustomEvent('cg-sort', {\n        detail: { from: this._startIndex, to: finalIndex, items },\n        bubbles: true, composed: true,\n      }));\n      this._announce(`Moved to position ${finalIndex + 1} of ${items.length}`);\n    }\n\n    this._draggingEl = null;\n    this._pointerId = null;\n    this._startIndex = -1;\n    this._startRect = null;\n  }\n\n  private _onKeyDown = (e: KeyboardEvent): void => {\n    if (this.disabled) return;\n    const item = this._findItemFromTarget(e.target);\n    if (!item) return;\n\n    const items = this._items();\n    const idx = items.indexOf(item);\n    if (idx === -1) return;\n\n    const prevKey = this.direction === 'vertical' ? 'ArrowUp' : 'ArrowLeft';\n    const nextKey = this.direction === 'vertical' ? 'ArrowDown' : 'ArrowRight';\n\n    let target = -1;\n    if (e.key === prevKey && idx > 0) target = idx - 1;\n    else if (e.key === nextKey && idx < items.length - 1) target = idx + 1;\n    else if (e.key === 'Home' && idx > 0) target = 0;\n    else if (e.key === 'End' && idx < items.length - 1) target = items.length - 1;\n    else return;\n\n    e.preventDefault();\n\n    const ref = items[target];\n    if (!ref) return;\n    if (target < idx) {\n      this.insertBefore(item, ref);\n    } else {\n      this.insertBefore(item, ref.nextSibling);\n    }\n\n    item.classList.add('cg-sortable-keyboard-active');\n    setTimeout(() => item.classList.remove('cg-sortable-keyboard-active'), 600);\n\n    if (item.tabIndex < 0) item.tabIndex = 0;\n    item.focus();\n\n    this.dispatchEvent(new CustomEvent('cg-sort', {\n      detail: { from: idx, to: target, items: this._items() },\n      bubbles: true, composed: true,\n    }));\n\n    this._announce(`Moved to position ${target + 1} of ${items.length}`);\n  };\n\n  private _announce(message: string): void {\n    this._announcement = '';\n    requestAnimationFrame(() => { this._announcement = message; });\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.addEventListener('pointerdown', this._onPointerDown);\n    this.addEventListener('pointermove', this._onPointerMove);\n    this.addEventListener('pointerup', this._onPointerUp);\n    this.addEventListener('pointercancel', this._onPointerCancel);\n    this.addEventListener('keydown', this._onKeyDown);\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener('pointerdown', this._onPointerDown);\n    this.removeEventListener('pointermove', this._onPointerMove);\n    this.removeEventListener('pointerup', this._onPointerUp);\n    this.removeEventListener('pointercancel', this._onPointerCancel);\n    this.removeEventListener('keydown', this._onKeyDown);\n  }\n\n  override render() {\n    return html`\n      <slot></slot>\n      <div class=\"live\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">${this._announcement}</div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-sortable': CgSortable;\n  }\n}\n"],"names":["CgSortable","LitElement","e","item","deltaX","deltaY","items","dragIdx","dragCenterX","dragCenterY","i","other","r","crossed","threshold","oppositeThreshold","newRect","idx","prevKey","nextKey","target","ref","c","el","finalIndex","message","html","hostBlock","reducedMotion","css","__decorateClass","property","state","customElement"],"mappings":"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"}

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

@@ -1,82 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * @element cg-theme
- * Scoping element that applies design-token overrides to its descendants.
- * Wraps any subtree to retheme just that part of the page — without
- * touching the global `:root` declarations.
- *
- * Three runtime preference axes (density, motion, contrast) are exposed
- * as first-class attributes that map to predefined token override sets,
- * so consumers can flip them at runtime without writing CSS:
- *
- *   - density: compact | cozy | comfortable
- *   - motion:  full | reduced | none
- *   - contrast: normal | high
- *
- * Plus a `tokens` prop accepting an arbitrary `Record<string, string>` of
- * `--cg-*` overrides for ad-hoc theming (org/workspace/user layers).
- *
- * Nest cg-theme to layer overrides — inner wins. The classic three-tier
- * inheritance pattern (org -> workspace -> user) is just three nested
- * cg-theme elements.
- *
- * @example Brand override
- * ```html
- * <cg-theme .tokens=${{
- *   '--cg-color-action-primary-background-default': '#ff00aa',
- *   '--cg-color-action-primary-text-default': '#ffffff',
- * }}>
- *   <cg-button variant="primary">On-brand button</cg-button>
- * </cg-theme>
- * ```
- *
- * @example Density + motion preference
- * ```html
- * <cg-theme density="compact" motion="reduced">
- *   <cg-table .columns=${cols} .rows=${rows}></cg-table>
- * </cg-theme>
- * ```
- *
- * @example Layered inheritance
- * ```html
- * <cg-theme .tokens=${orgPalette}>            <!-- org defaults -->
- *   <cg-theme .tokens=${workspacePalette}>    <!-- workspace overrides -->
- *     <cg-theme density=${userDensity}>        <!-- user prefs -->
- *       <App />
- *     </cg-theme>
- *   </cg-theme>
- * </cg-theme>
- * ```
- *
- * @slot - The content to retheme.
- *
- * @cssprop --cg-component-theme-density-compact-spacing-step
- * @cssprop --cg-component-theme-density-cozy-spacing-step
- */
-export declare class CgTheme extends LitElement {
-    static styles: import('lit').CSSResult[];
-    /** Density preset. Maps to spacing + component height overrides. */
-    density: 'compact' | 'cozy' | 'comfortable';
-    /** Motion preset. Maps to transition-duration overrides. */
-    motion: 'full' | 'reduced' | 'none';
-    /** Contrast preset. Maps to surface/border tokens. */
-    contrast: 'normal' | 'high';
-    /**
-     * Arbitrary `--cg-*` overrides applied to the descendant tree.
-     * Provide as an object whose keys are CSS custom property names
-     * (e.g. `--cg-color-action-primary-background-default`) and whose
-     * values are valid CSS values (`#hex`, `rgb(...)`, `var(--ref)`).
-     *
-     * Set to a new object reference to update — mutating in place will
-     * not trigger a re-render. Pass null to clear.
-     */
-    tokens: Record<string, string> | null;
-    private _tokensInlineStyle;
-    render(): import('lit').TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'cg-theme': CgTheme;
-    }
-}
-//# sourceMappingURL=cg-theme.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"cg-theme.d.ts","sourceRoot":"","sources":["../../../src/components/cg-theme/cg-theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAI5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,qBACa,OAAQ,SAAQ,UAAU;IACrC,OAAgB,MAAM,4BA+CnB;IAEH,oEAAoE;IACvC,OAAO,EAAE,SAAS,GAAG,MAAM,GAAG,aAAa,CAAU;IAElF,4DAA4D;IAC/B,MAAM,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,CAAU;IAE1E,sDAAsD;IACzB,QAAQ,EAAE,QAAQ,GAAG,MAAM,CAAY;IAEpE;;;;;;;;OAQG;IAC6B,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAQ;IAE7E,OAAO,CAAC,kBAAkB;IAMjB,MAAM;CAQhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}

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

@@ -1,91 +0,0 @@
-import { css as g, LitElement as l, html as m } from "lit";
-import { property as p, customElement as h } from "lit/decorators.js";
-import { h as u, r as d } from "../../chunks/premium.css-9I4kHrsl.js";
-var x = Object.defineProperty, y = Object.getOwnPropertyDescriptor, c = (e, n, s, i) => {
-  for (var t = i > 1 ? void 0 : i ? y(n, s) : n, r = e.length - 1, a; r >= 0; r--)
-    (a = e[r]) && (t = (i ? a(n, s, t) : a(t)) || t);
-  return i && t && x(n, s, t), t;
-};
-let o = class extends l {
-  constructor() {
-    super(...arguments), this.density = "cozy", this.motion = "full", this.contrast = "normal", this.tokens = null;
-  }
-  _tokensInlineStyle() {
-    return this.tokens ? Object.entries(this.tokens).map(([n, s]) => `${n}: ${s};`).join(" ") : "";
-  }
-  render() {
-    const e = this._tokensInlineStyle();
-    return m`
-      <div class="scope" style=${e || ""}>
-        <slot></slot>
-      </div>
-    `;
-  }
-};
-o.styles = [u, d, g`
-    :host { display: contents; }
-    .scope { display: contents; }
-
-    /* ── Density bands (token override layers) ──
-       Each density rescales only spacing and component sizing. Type and
-       color stay constant so density doesn't smuggle in surprise contrast. */
-    :host([density="compact"]) .scope {
-      --cg-spacing-2: 1px; --cg-spacing-4: 2px; --cg-spacing-6: 4px;
-      --cg-spacing-8: 6px; --cg-spacing-12: 8px; --cg-spacing-16: 12px;
-      --cg-spacing-24: 16px; --cg-spacing-32: 20px; --cg-spacing-48: 32px;
-      --cg-component-input-height-md: 36px;
-      --cg-component-input-height-lg: 44px;
-      --cg-component-button-height-sm: 28px;
-      --cg-component-button-height-md: 36px;
-      --cg-component-button-height-lg: 44px;
-    }
-    :host([density="comfortable"]) .scope {
-      --cg-spacing-2: 3px; --cg-spacing-4: 5px; --cg-spacing-6: 7px;
-      --cg-spacing-8: 10px; --cg-spacing-12: 14px; --cg-spacing-16: 20px;
-      --cg-spacing-24: 28px; --cg-spacing-32: 36px; --cg-spacing-48: 56px;
-      --cg-component-input-height-md: 52px;
-      --cg-component-input-height-lg: 60px;
-      --cg-component-button-height-sm: 40px;
-      --cg-component-button-height-md: 56px;
-      --cg-component-button-height-lg: 64px;
-    }
-    /* density="cozy" is the default — no overrides */
-
-    /* ── Motion bands ── */
-    :host([motion="reduced"]) .scope {
-      --cg-transition-duration-fast: 80ms;
-      --cg-transition-duration-default: 120ms;
-      --cg-transition-duration-slow: 180ms;
-    }
-    :host([motion="none"]) .scope,
-    :host([motion="none"]) .scope * {
-      animation-duration: 0.001ms !important;
-      transition-duration: 0.001ms !important;
-    }
-
-    /* ── Contrast bands ── */
-    :host([contrast="high"]) .scope {
-      --cg-color-surface-cards-border: var(--cg-color-surface-base-text);
-      --cg-color-surface-cards-border-strong: var(--cg-color-surface-base-text);
-      --cg-color-input-border-default: var(--cg-color-surface-base-text);
-    }
-  `];
-c([
-  p({ reflect: !0 })
-], o.prototype, "density", 2);
-c([
-  p({ reflect: !0 })
-], o.prototype, "motion", 2);
-c([
-  p({ reflect: !0 })
-], o.prototype, "contrast", 2);
-c([
-  p({ attribute: !1 })
-], o.prototype, "tokens", 2);
-o = c([
-  h("cg-theme")
-], o);
-export {
-  o as CgTheme
-};
-//# sourceMappingURL=cg-theme.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"cg-theme.js","sources":["../../../src/components/cg-theme/cg-theme.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { hostBlock, reducedMotion } from '../../styles/index.js';\n\n/**\n * @element cg-theme\n * Scoping element that applies design-token overrides to its descendants.\n * Wraps any subtree to retheme just that part of the page — without\n * touching the global `:root` declarations.\n *\n * Three runtime preference axes (density, motion, contrast) are exposed\n * as first-class attributes that map to predefined token override sets,\n * so consumers can flip them at runtime without writing CSS:\n *\n *   - density: compact | cozy | comfortable\n *   - motion:  full | reduced | none\n *   - contrast: normal | high\n *\n * Plus a `tokens` prop accepting an arbitrary `Record<string, string>` of\n * `--cg-*` overrides for ad-hoc theming (org/workspace/user layers).\n *\n * Nest cg-theme to layer overrides — inner wins. The classic three-tier\n * inheritance pattern (org -> workspace -> user) is just three nested\n * cg-theme elements.\n *\n * @example Brand override\n * ```html\n * <cg-theme .tokens=${{\n *   '--cg-color-action-primary-background-default': '#ff00aa',\n *   '--cg-color-action-primary-text-default': '#ffffff',\n * }}>\n *   <cg-button variant=\"primary\">On-brand button</cg-button>\n * </cg-theme>\n * ```\n *\n * @example Density + motion preference\n * ```html\n * <cg-theme density=\"compact\" motion=\"reduced\">\n *   <cg-table .columns=${cols} .rows=${rows}></cg-table>\n * </cg-theme>\n * ```\n *\n * @example Layered inheritance\n * ```html\n * <cg-theme .tokens=${orgPalette}>            <!-- org defaults -->\n *   <cg-theme .tokens=${workspacePalette}>    <!-- workspace overrides -->\n *     <cg-theme density=${userDensity}>        <!-- user prefs -->\n *       <App />\n *     </cg-theme>\n *   </cg-theme>\n * </cg-theme>\n * ```\n *\n * @slot - The content to retheme.\n *\n * @cssprop --cg-component-theme-density-compact-spacing-step\n * @cssprop --cg-component-theme-density-cozy-spacing-step\n */\n@customElement('cg-theme')\nexport class CgTheme extends LitElement {\n  static override styles = [hostBlock, reducedMotion, css`\n    :host { display: contents; }\n    .scope { display: contents; }\n\n    /* ── Density bands (token override layers) ──\n       Each density rescales only spacing and component sizing. Type and\n       color stay constant so density doesn't smuggle in surprise contrast. */\n    :host([density=\"compact\"]) .scope {\n      --cg-spacing-2: 1px; --cg-spacing-4: 2px; --cg-spacing-6: 4px;\n      --cg-spacing-8: 6px; --cg-spacing-12: 8px; --cg-spacing-16: 12px;\n      --cg-spacing-24: 16px; --cg-spacing-32: 20px; --cg-spacing-48: 32px;\n      --cg-component-input-height-md: 36px;\n      --cg-component-input-height-lg: 44px;\n      --cg-component-button-height-sm: 28px;\n      --cg-component-button-height-md: 36px;\n      --cg-component-button-height-lg: 44px;\n    }\n    :host([density=\"comfortable\"]) .scope {\n      --cg-spacing-2: 3px; --cg-spacing-4: 5px; --cg-spacing-6: 7px;\n      --cg-spacing-8: 10px; --cg-spacing-12: 14px; --cg-spacing-16: 20px;\n      --cg-spacing-24: 28px; --cg-spacing-32: 36px; --cg-spacing-48: 56px;\n      --cg-component-input-height-md: 52px;\n      --cg-component-input-height-lg: 60px;\n      --cg-component-button-height-sm: 40px;\n      --cg-component-button-height-md: 56px;\n      --cg-component-button-height-lg: 64px;\n    }\n    /* density=\"cozy\" is the default — no overrides */\n\n    /* ── Motion bands ── */\n    :host([motion=\"reduced\"]) .scope {\n      --cg-transition-duration-fast: 80ms;\n      --cg-transition-duration-default: 120ms;\n      --cg-transition-duration-slow: 180ms;\n    }\n    :host([motion=\"none\"]) .scope,\n    :host([motion=\"none\"]) .scope * {\n      animation-duration: 0.001ms !important;\n      transition-duration: 0.001ms !important;\n    }\n\n    /* ── Contrast bands ── */\n    :host([contrast=\"high\"]) .scope {\n      --cg-color-surface-cards-border: var(--cg-color-surface-base-text);\n      --cg-color-surface-cards-border-strong: var(--cg-color-surface-base-text);\n      --cg-color-input-border-default: var(--cg-color-surface-base-text);\n    }\n  `];\n\n  /** Density preset. Maps to spacing + component height overrides. */\n  @property({ reflect: true }) density: 'compact' | 'cozy' | 'comfortable' = 'cozy';\n\n  /** Motion preset. Maps to transition-duration overrides. */\n  @property({ reflect: true }) motion: 'full' | 'reduced' | 'none' = 'full';\n\n  /** Contrast preset. Maps to surface/border tokens. */\n  @property({ reflect: true }) contrast: 'normal' | 'high' = 'normal';\n\n  /**\n   * Arbitrary `--cg-*` overrides applied to the descendant tree.\n   * Provide as an object whose keys are CSS custom property names\n   * (e.g. `--cg-color-action-primary-background-default`) and whose\n   * values are valid CSS values (`#hex`, `rgb(...)`, `var(--ref)`).\n   *\n   * Set to a new object reference to update — mutating in place will\n   * not trigger a re-render. Pass null to clear.\n   */\n  @property({ attribute: false }) tokens: Record<string, string> | null = null;\n\n  private _tokensInlineStyle(): string {\n    if (!this.tokens) return '';\n    const entries = Object.entries(this.tokens);\n    return entries.map(([k, v]) => `${k}: ${v};`).join(' ');\n  }\n\n  override render() {\n    const inline = this._tokensInlineStyle();\n    return html`\n      <div class=\"scope\" style=${inline || ''}>\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cg-theme': CgTheme;\n  }\n}\n"],"names":["CgTheme","LitElement","k","v","inline","html","hostBlock","reducedMotion","css","__decorateClass","property","customElement"],"mappings":";;;;;;;;AA2DO,IAAMA,IAAN,cAAsBC,EAAW;AAAA,EAAjC,cAAA;AAAA,UAAA,GAAA,SAAA,GAmDwB,KAAA,UAA8C,QAG9C,KAAA,SAAsC,QAGtC,KAAA,WAA8B,UAW3B,KAAA,SAAwC;AAAA,EAAA;AAAA,EAEhE,qBAA6B;AACnC,WAAK,KAAK,SACM,OAAO,QAAQ,KAAK,MAAM,EAC3B,IAAI,CAAC,CAACC,GAAGC,CAAC,MAAM,GAAGD,CAAC,KAAKC,CAAC,GAAG,EAAE,KAAK,GAAG,IAF7B;AAAA,EAG3B;AAAA,EAES,SAAS;AAChB,UAAMC,IAAS,KAAK,mBAAA;AACpB,WAAOC;AAAA,iCACsBD,KAAU,EAAE;AAAA;AAAA;AAAA;AAAA,EAI3C;AACF;AApFaJ,EACK,SAAS,CAACM,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,GA+CnD;AAG4BC,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAnDhBV,EAmDkB,WAAA,WAAA,CAAA;AAGAS,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAtDhBV,EAsDkB,WAAA,UAAA,CAAA;AAGAS,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAzDhBV,EAyDkB,WAAA,YAAA,CAAA;AAWGS,EAAA;AAAA,EAA/BC,EAAS,EAAE,WAAW,GAAA,CAAO;AAAA,GApEnBV,EAoEqB,WAAA,UAAA,CAAA;AApErBA,IAANS,EAAA;AAAA,EADNE,EAAc,UAAU;AAAA,GACZX,CAAA;"}

package/dist/components/cg-theme-editor/cg-theme-editor.d.ts

@@ -1,98 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * @element cg-theme-editor
- * Live, in-app token editor that drives the closest ancestor
- * `<cg-theme>` element. Drop into your dev/staging build to retune tier-2
- * tokens without rebuilding — color pickers, sliders, and an image-drop
- * zone that runs `themeFromImage()` to extract a palette from a logo.
- *
- * The editor walks up from the host to find a `<cg-theme>` ancestor and
- * mutates its `tokens` prop on every change. There is no global side
- * effect — clearing the editor (or removing it) leaves the theme as it
- * was on the cg-theme element.
- *
- * Pair with the `themeFromImage()` API exported from
- * `@cognivo/theme-generator` for image-driven palette extraction. The
- * editor accepts a `themeFromImage` callback prop; consumers wire it
- * once at mount time so this package stays free of a workspace-wide
- * dependency on theme-generator.
- *
- * @example
- * ```html
- * <cg-theme>
- *   <App />
- *   <cg-theme-editor></cg-theme-editor>
- * </cg-theme>
- * ```
- *
- * @example With image extraction wired up
- * ```ts
- * import { themeFromImage, paletteToCssVars } from '@cognivo/theme-generator';
- * editor.themeFromImage = (data) => paletteToCssVars(themeFromImage(data));
- * ```
- *
- * @fires {CustomEvent<{tokens: Record<string,string>}>} cg-theme-change - On every token change.
- *
- * @cssprop --cg-component-theme-editor-width - Panel width (default 280px)
- */
-export declare class CgThemeEditor extends LitElement {
-    static styles: import('lit').CSSResult[];
-    /** Where the panel docks. */
-    anchor: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
-    /** Start collapsed. */
-    collapsed: boolean;
-    /**
-     * The set of tokens the editor exposes. Each entry: { name, label, type }.
-     * Type "color" renders an `<input type="color">`. Default is the small
-     * brand-defining set that maps cleanly to most designs.
-     */
-    editableTokens: Array<{
-        name: string;
-        label: string;
-        type: 'color';
-    }>;
-    /**
-     * Optional callback that converts an RGBAImageData into a token override.
-     * Wire `themeFromImage` + `paletteToCssVars` here. When unset, the
-     * image-drop zone is disabled.
-     */
-    themeFromImage: ((image: {
-        data: Uint8ClampedArray | Uint8Array | number[];
-        width: number;
-        height: number;
-    }) => Record<string, string>) | null;
-    private _values;
-    private _showCopied;
-    private _dragover;
-    connectedCallback(): void;
-    /**
-     * Read the current resolved value of each editable token from the page
-     * so the color inputs start populated. Falls back to "#000000" for
-     * unresolvable values; the input still works once the user picks.
-     */
-    private _readInitialValues;
-    /**
-     * Convert any CSS color value into a 6-digit hex form that color inputs
-     * accept. Returns null if the value can't be parsed.
-     */
-    private _normalizeColor;
-    /** Walk up from the host to find a sibling/ancestor `<cg-theme>`. */
-    private _findThemeTarget;
-    private _applyToTheme;
-    private _onColorChange;
-    private _onImagePicked;
-    private _onImageInputChange;
-    private _onDragEnter;
-    private _onDragLeave;
-    private _onDrop;
-    private _onReset;
-    private _onCopy;
-    private _onToggle;
-    render(): import('lit').TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'cg-theme-editor': CgThemeEditor;
-    }
-}
-//# sourceMappingURL=cg-theme-editor.d.ts.map

package/dist/components/cg-theme-editor/cg-theme-editor.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"cg-theme-editor.d.ts","sourceRoot":"","sources":["../../../src/components/cg-theme-editor/cg-theme-editor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAIrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,qBACa,aAAc,SAAQ,UAAU;IAC3C,OAAgB,MAAM,4BA+InB;IAEH,6BAA6B;IACA,MAAM,EAAE,cAAc,GAAG,aAAa,GAAG,WAAW,GAAG,UAAU,CAAkB;IAEhH,uBAAuB;IACqB,SAAS,UAAS;IAE9D;;;;OAIG;IAC6B,cAAc,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,OAAO,CAAA;KAAE,CAAC,CASnG;IAEF;;;;OAIG;IAEH,cAAc,EACV,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,iBAAiB,GAAG,UAAU,GAAG,MAAM,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,GACvH,IAAI,CAAQ;IAEP,OAAO,CAAC,OAAO,CAA8B;IAC7C,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,SAAS,CAAS;IAE1B,iBAAiB,IAAI,IAAI;IAKlC;;;;OAIG;IACH,OAAO,CAAC,kBAAkB;IAY1B;;;OAGG;IACH,OAAO,CAAC,eAAe;IAgBvB,qEAAqE;IACrE,OAAO,CAAC,gBAAgB;IAWxB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,cAAc;IAUtB,OAAO,CAAC,cAAc,CA0BpB;IAEF,OAAO,CAAC,mBAAmB,CAIzB;IAEF,OAAO,CAAC,YAAY,CAGlB;IAEF,OAAO,CAAC,YAAY,CAElB;IAEF,OAAO,CAAC,OAAO,CAKb;IAEF,OAAO,CAAC,QAAQ,CASd;IAEF,OAAO,CAAC,OAAO,CAOb;IAEF,OAAO,CAAC,SAAS,CAEf;IAEO,MAAM;CAoDhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,aAAa,CAAC;KAClC;CACF"}