npm - @cognivo/components - Versions diffs - 0.8.0 → 0.8.2 - Mend

@cognivo/components 0.8.0 → 0.8.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (543) hide show

package/dist/components/cg-chart/cg-chart.js CHANGED Viewed

@@ -1,10 +1,10 @@
-import { css as N, LitElement as I, nothing as v, svg as x, html as b } from "lit";
-import { property as _, state as z, customElement as E } from "lit/decorators.js";
-import { h as W, r as Y } from "../../chunks/premium.css-9I4kHrsl.js";
-var q = Object.defineProperty, C = Object.getOwnPropertyDescriptor, f = (t, a, r, s) => {
-  for (var e = s > 1 ? void 0 : s ? C(a, r) : a, n = t.length - 1, o; n >= 0; n--)
+import { css as N, LitElement as I, nothing as v, svg as f, html as _ } from "lit";
+import { property as b, state as z, customElement as C } from "lit/decorators.js";
+import { h as E, r as W } from "../../chunks/premium.css-DHekUEUt.js";
+var Y = Object.defineProperty, q = Object.getOwnPropertyDescriptor, x = (t, a, r, s) => {
+  for (var e = s > 1 ? void 0 : s ? q(a, r) : a, n = t.length - 1, o; n >= 0; n--)
     (o = t[n]) && (e = (s ? o(a, r, e) : o(e)) || e);
-  return s && e && q(a, r, e), e;
+  return s && e && Y(a, r, e), e;
 };
 const P = [
   "#dfff61",
@@ -23,7 +23,7 @@ let u = class extends I {
   _resolve() {
     if (this._resolved) return;
     const t = getComputedStyle(this);
-    this._grid = t.getPropertyValue("--cg-color-chart-grid").trim() || t.getPropertyValue("--cg-color-border-default").trim(), this._axis = t.getPropertyValue("--cg-color-chart-axis").trim() || t.getPropertyValue("--cg-color-text-muted").trim(), this._text = t.getPropertyValue("--cg-color-surface-base-text").trim() || t.getPropertyValue("--cg-color-text-default").trim(), this._bg = t.getPropertyValue("--cg-color-surface-container-background").trim() || t.getPropertyValue("--cg-color-surface-base").trim();
+    this._grid = t.getPropertyValue("--cg-color-chart-grid").trim() || t.getPropertyValue("--cg-color-surface-cards-border").trim(), this._axis = t.getPropertyValue("--cg-color-chart-axis").trim() || t.getPropertyValue("--cg-color-input-text-placeholder").trim(), this._text = t.getPropertyValue("--cg-color-surface-base-text").trim() || t.getPropertyValue("--cg-color-surface-base-text").trim(), this._bg = t.getPropertyValue("--cg-color-surface-container-background").trim() || t.getPropertyValue("--cg-color-surface-base-background").trim();
     for (let a = 0; a < 8; a++) {
       const r = t.getPropertyValue(`--cg-color-chart-${a + 1}`).trim();
       r && (P[a] = r);
@@ -84,22 +84,22 @@ let u = class extends I {
   // ═══ BAR ═══
   _bar() {
     const { data: t, height: a } = this, r = 400, s = 20, e = 16, n = 28, o = 44, l = r - o - e, m = a - s - n, i = Math.max(...t.map((h) => h.value), 1), c = t.length, p = l / c * 0.6, $ = l / c;
-    return x`
+    return f`
       ${this.showGrid ? [0.25, 0.5, 0.75, 1].map((h) => {
       const y = s + m - m * h;
-      return x`
+      return f`
           <line x1="${o}" y1="${y}" x2="${r - e}" y2="${y}" stroke="${this._grid}" stroke-width="0.5" stroke-dasharray="3,3" />
           <text x="${o - 6}" y="${y + 4}" text-anchor="end" fill="${this._axis}" font-size="10">${this._fmt(i * h)}</text>
         `;
     }) : v}
       ${t.map((h, y) => {
       const g = h.value / i * m, d = o + y * $ + ($ - p) / 2, w = s + m - g, F = s + m, k = this._color(y, h);
-      return x`
+      return f`
           <rect class="bar-anim" x="${d}" y="${F}" width="${p}" height="0" rx="4" fill="${k}" style="cursor:pointer"
             data-y="${w}" data-h="${g}" data-delay="${y * 50}"
             @mouseenter=${(M) => this._tip(M, h.label, h.value)}
             @mouseleave=${this._untip} />
-          ${this.showValues ? x`<text class="val-anim" x="${d + p / 2}" y="${w - 6}" text-anchor="middle" fill="${this._text}" font-size="10" font-weight="600" opacity="0" data-delay="${y * 50 + 300}">${this._fmt(h.value)}</text>` : v}
+          ${this.showValues ? f`<text class="val-anim" x="${d + p / 2}" y="${w - 6}" text-anchor="middle" fill="${this._text}" font-size="10" font-weight="600" opacity="0" data-delay="${y * 50 + 300}">${this._fmt(h.value)}</text>` : v}
           <text x="${d + p / 2}" y="${a - 6}" text-anchor="middle" fill="${this._axis}" font-size="10">${h.label}</text>
         `;
     })}
@@ -110,10 +110,10 @@ let u = class extends I {
     const { data: t } = this, a = 400, r = 72, s = 8, e = 28;
     t.length * (e + s);
     const n = Math.max(...t.map((o) => o.value), 1);
-    return x`
+    return f`
       ${t.map((o, l) => {
       const m = l * (e + s), i = o.value / n * (a - r - 60), c = this._color(l, o);
-      return x`
+      return f`
           <text x="${r - 6}" y="${m + e / 2 + 4}" text-anchor="end" fill="${this._axis}" font-size="11">${o.label}</text>
           <rect class="hbar-anim" x="${r}" y="${m}" width="0" height="${e}" rx="4" fill="${c}" style="cursor:pointer"
             data-w="${i}" data-delay="${l * 50}"
@@ -130,22 +130,22 @@ let u = class extends I {
       x: l + d / Math.max(a.length - 1, 1) * m,
       y: e + i - g.value / c * i
     })), h = $.map((g, d) => `${d ? "L" : "M"}${g.x.toFixed(1)},${g.y.toFixed(1)}`).join(" "), y = `${h} L${$.at(-1).x.toFixed(1)},${(e + i).toFixed(1)} L${$[0].x.toFixed(1)},${(e + i).toFixed(1)} Z`;
-    return x`
+    return f`
       ${this.showGrid ? [0.25, 0.5, 0.75, 1].map((g) => {
       const d = e + i - i * g;
-      return x`
+      return f`
           <line x1="${l}" y1="${d}" x2="${s - n}" y2="${d}" stroke="${this._grid}" stroke-width="0.5" stroke-dasharray="3,3" />
           <text x="${l - 6}" y="${d + 4}" text-anchor="end" fill="${this._axis}" font-size="10">${this._fmt(c * g)}</text>
         `;
     }) : v}
-      ${t ? x`<path d="${y}" fill="${p}" opacity="0.2" />` : v}
+      ${t ? f`<path d="${y}" fill="${p}" opacity="0.2" />` : v}
       <path class="anim-line" d="${h}" fill="none" stroke="${p}" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="--dash:2000" />
-      ${$.map((g, d) => x`
+      ${$.map((g, d) => f`
         <circle class="anim-dot" cx="${g.x}" cy="${g.y}" r="4" fill="${p}" stroke="${this._bg}" stroke-width="2" style="cursor:pointer; animation-delay:${400 + d * 50}ms"
           @mouseenter=${(w) => this._tip(w, a[d].label, a[d].value)}
           @mouseleave=${this._untip} />
       `)}
-      ${a.map((g, d) => x`
+      ${a.map((g, d) => f`
         <text x="${$[d].x}" y="${r - 6}" text-anchor="middle" fill="${this._axis}" font-size="10">${g.label}</text>
       `)}
     `;
@@ -156,16 +156,16 @@ let u = class extends I {
     let m = -90;
     const i = a.map((c, p) => {
       const $ = c.value / r * 360, h = m + $, y = $ > 180 ? 1 : 0, g = n + e * Math.cos(l(m)), d = o + e * Math.sin(l(m)), w = n + e * Math.cos(l(h)), F = o + e * Math.sin(l(h)), k = m + $ / 2, M = e * (t ? 1.2 : 0.6), A = n + M * Math.cos(l(k)), S = o + M * Math.sin(l(k)), T = Math.round(c.value / r * 100), B = this._color(p, c), L = `M${n},${o} L${g.toFixed(1)},${d.toFixed(1)} A${e},${e} 0 ${y} 1 ${w.toFixed(1)},${F.toFixed(1)} Z`;
-      return m = h, x`
+      return m = h, f`
         <path class="anim-slice" d="${L}" fill="${B}" style="cursor:pointer; animation-delay:${p * 60}ms"
           @mouseenter=${(V) => this._tip(V, c.label, c.value)}
           @mouseleave=${this._untip} />
-        ${T >= 5 ? x`<text x="${A}" y="${S}" text-anchor="middle" dominant-baseline="central" fill="${t ? this._axis : this._text}" font-size="10" font-weight="600">${T}%</text>` : v}
+        ${T >= 5 ? f`<text x="${A}" y="${S}" text-anchor="middle" dominant-baseline="central" fill="${t ? this._axis : this._text}" font-size="10" font-weight="600">${T}%</text>` : v}
       `;
     });
-    return x`
+    return f`
       ${i}
-      ${t ? x`
+      ${t ? f`
         <circle cx="${n}" cy="${o}" r="${e * 0.55}" fill="${this._bg}" />
         <text x="${n}" y="${o - 4}" text-anchor="middle" fill="${this._text}" font-size="16" font-weight="700">${this._fmt(r)}</text>
         <text x="${n}" y="${o + 12}" text-anchor="middle" fill="${this._axis}" font-size="9">Total</text>
@@ -179,7 +179,7 @@ let u = class extends I {
     return this.type === "pie" || this.type === "donut" ? Math.min(this.height, 240) : 400;
   }
   render() {
-    if (!this.data.length) return b`<div class="wrap ${this.contained ? "contained" : ""}"><div class="empty">${this.emptyText}</div></div>`;
+    if (!this.data.length) return _`<div class="wrap ${this.contained ? "contained" : ""}"><div class="empty">${this.emptyText}</div></div>`;
     const t = this._svgWidth(), a = this._svgHeight(), r = this.type === "pie" || this.type === "donut";
     let s;
     switch (this.type) {
@@ -202,17 +202,22 @@ let u = class extends I {
         s = this._pie(!0);
         break;
     }
-    return b`
+    return _`
       <div class="wrap ${this.contained ? "contained" : ""}">
-        ${this.title || this.subtitle ? b`
+        ${this.title || this.subtitle ? _`
           <div class="header">
-            ${this.title ? b`<div class="title">${this.title}</div>` : v}
-            ${this.subtitle ? b`<div class="subtitle">${this.subtitle}</div>` : v}
+            ${this.title ? _`<div class="title">${this.title}</div>` : v}
+            ${this.subtitle ? _`<div class="subtitle">${this.subtitle}</div>` : v}
           </div>
         ` : v}
         <div class="svg-wrap">
-          <svg viewBox="0 0 ${t} ${a}" style="${r ? `max-width:${t}px; margin:0 auto;` : ""}">
+          <svg
+            role="img"
+            aria-label=${`${this.title || "Chart"}: ${this.data.map((e) => `${e.label} ${this._fmt(e.value)}`).join(", ")}`}
+            viewBox="0 0 ${t} ${a}"
+            style="${r ? `max-width:${t}px; margin:0 auto;` : ""}"
+          >
             ${s}
           </svg>
           <div class="tip ${this._tipShow ? "show" : ""}" style="left:${this._tipX}px;top:${this._tipY}px;">
@@ -220,9 +225,9 @@ let u = class extends I {
           </div>
         </div>
-        ${this.showLegend ? b`
+        ${this.showLegend ? _`
           <div class="legend">
-            ${this.data.map((e, n) => b`
+            ${this.data.map((e, n) => _`
               <span class="legend-item anim-legend" style="animation-delay:${300 + n * 40}ms">
                 <span class="legend-dot" style="background:${this._color(n, e)}"></span>
                 <span>${e.label}</span>
@@ -235,7 +240,7 @@ let u = class extends I {
     `;
   }
 };
-u.styles = [W, Y, N`
+u.styles = [E, W, N`
     :host { display: block; }
     .wrap { position: relative; }
@@ -299,7 +304,7 @@ u.styles = [W, Y, N`
       pointer-events: none;
       white-space: nowrap;
       transform: translate(-50%, -100%);
-      margin-top: -8px;
+      margin-top: calc(var(--cg-spacing-8) * -1);
       z-index: 10;
       display: none;
     }
@@ -330,50 +335,50 @@ u.styles = [W, Y, N`
       font-size: var(--cg-font-size-sm); min-height: 120px;
     }
   `];
-f([
-  _({ type: Array })
+x([
+  b({ type: Array })
 ], u.prototype, "data", 2);
-f([
-  _()
+x([
+  b()
 ], u.prototype, "type", 2);
-f([
-  _()
+x([
+  b()
 ], u.prototype, "title", 2);
-f([
-  _()
+x([
+  b()
 ], u.prototype, "subtitle", 2);
-f([
-  _({ type: Number })
+x([
+  b({ type: Number })
 ], u.prototype, "height", 2);
-f([
-  _({ type: Boolean })
+x([
+  b({ type: Boolean })
 ], u.prototype, "showLegend", 2);
-f([
-  _({ type: Boolean })
+x([
+  b({ type: Boolean })
 ], u.prototype, "showValues", 2);
-f([
-  _({ type: Boolean })
+x([
+  b({ type: Boolean })
 ], u.prototype, "contained", 2);
-f([
-  _({ type: Boolean })
+x([
+  b({ type: Boolean })
 ], u.prototype, "showGrid", 2);
-f([
-  _()
+x([
+  b()
 ], u.prototype, "emptyText", 2);
-f([
+x([
   z()
 ], u.prototype, "_tipX", 2);
-f([
+x([
   z()
 ], u.prototype, "_tipY", 2);
-f([
+x([
   z()
 ], u.prototype, "_tipText", 2);
-f([
+x([
   z()
 ], u.prototype, "_tipShow", 2);
-u = f([
-  E("cg-chart")
+u = x([
+  C("cg-chart")
 ], u);
 export {
   u as CgChart

package/dist/components/cg-chart/cg-chart.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cg-chart.js","sources":["../../../src/components/cg-chart/cg-chart.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/** Data point for cg-chart /\nexport interface ChartSeries {\n label: string;\n value: number;\n color?: string;\n}\n\n/* Default palette — hex colors that work directly in SVG fill/stroke attributes /\nconst PALETTE = [\n '#dfff61', '#14b8a6', '#22c55e', '#f59e0b',\n '#f97316', '#ec4899', '#8b5cf6', '#ef4444',\n];\n\n@customElement('cg-chart')\nexport class CgChart extends LitElement {\n static override styles = [hostBlock, reducedMotion, css`\n :host { display: block; }\n\n .wrap { position: relative; }\n .wrap.contained {\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 padding: var(--cg-spacing-20);\n }\n\n .header { margin-bottom: var(--cg-spacing-12); }\n .title {\n font-size: var(--cg-font-size-sm);\n font-weight: var(--cg-font-weight-semibold);\n color: var(--cg-color-surface-base-text);\n }\n .subtitle {\n font-size: var(--cg-font-size-xs);\n color: var(--cg-color-input-text-placeholder);\n margin-top: var(--cg-spacing-2);\n }\n\n .svg-wrap { position: relative; }\n svg { display: block; width: 100%; }\n\n / ── Entrance animations ── /\n @keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n }\n @keyframes lineTrace {\n from { stroke-dashoffset: var(--dash); }\n to { stroke-dashoffset: 0; }\n }\n\n .anim-line {\n stroke-dasharray: var(--dash);\n stroke-dashoffset: var(--dash);\n animation: lineTrace 900ms var(--cg-transition-easing-ease-out) forwards;\n }\n .anim-dot {\n animation: fadeIn 200ms var(--cg-transition-easing-ease-out) both;\n }\n .anim-slice {\n animation: fadeIn 400ms var(--cg-transition-easing-ease-out) both;\n }\n .anim-legend {\n animation: fadeIn 200ms var(--cg-transition-easing-ease-out) both;\n }\n\n / Tooltip /\n .tip {\n position: absolute;\n background: var(--cg-color-surface-container-background);\n color: var(--cg-color-surface-base-text);\n border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n padding: var(--cg-spacing-4) var(--cg-spacing-8);\n border-radius: var(--cg-border-radius-50);\n font-size: var(--cg-font-size-xs);\n font-weight: var(--cg-font-weight-medium);\n pointer-events: none;\n white-space: nowrap;\n transform: translate(-50%, -100%);\n margin-top: -8px;\n z-index: 10;\n display: none;\n }\n .tip.show { display: block; }\n\n / Legend /\n .legend {\n display: flex; flex-wrap: wrap; gap: var(--cg-spacing-12);\n margin-top: var(--cg-spacing-16); padding-top: var(--cg-spacing-12);\n border-top: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n }\n .legend-item {\n display: inline-flex; align-items: center; gap: var(--cg-spacing-4);\n font-size: var(--cg-font-size-xs); color: var(--cg-color-input-text-placeholder);\n }\n .legend-dot {\n width: var(--cg-spacing-8); height: var(--cg-spacing-8);\n border-radius: var(--cg-border-radius-full); flex-shrink: 0;\n }\n .legend-val {\n font-weight: var(--cg-font-weight-semibold);\n color: var(--cg-color-surface-base-text);\n }\n\n .empty {\n display: flex; align-items: center; justify-content: center;\n color: var(--cg-color-input-text-placeholder);\n font-size: var(--cg-font-size-sm); min-height: 120px;\n }\n `];\n\n @property({ type: Array }) data: ChartSeries[] = [];\n @property() type: 'bar' \| 'horizontal-bar' \| 'line' \| 'area' \| 'pie' \| 'donut' = 'bar';\n @property() override title = '';\n @property() subtitle = '';\n @property({ type: Number }) height = 200;\n @property({ type: Boolean }) showLegend = true;\n @property({ type: Boolean }) showValues = true;\n /* Wrap chart in a card container /\n @property({ type: Boolean }) contained = false;\n @property({ type: Boolean }) showGrid = true;\n @property() emptyText = 'No data';\n\n @state() private _tipX = 0;\n @state() private _tipY = 0;\n @state() private _tipText = '';\n @state() private _tipShow = false;\n\n // Resolved theme colors for SVG — pulled from CSS custom properties at runtime\n private _grid = '';\n private _axis = '';\n private _text = '';\n private _bg = '';\n private _resolved = false;\n\n private _resolve() {\n if (this._resolved) return;\n const s = getComputedStyle(this);\n this._grid = s.getPropertyValue('--cg-color-chart-grid').trim() \|\| s.getPropertyValue('--cg-color-border-default').trim();\n this._axis = s.getPropertyValue('--cg-color-chart-axis').trim() \|\| s.getPropertyValue('--cg-color-text-muted').trim();\n this._text = s.getPropertyValue('--cg-color-surface-base-text').trim() \|\| s.getPropertyValue('--cg-color-text-default').trim();\n this._bg = s.getPropertyValue('--cg-color-surface-container-background').trim() \|\| s.getPropertyValue('--cg-color-surface-base').trim();\n for (let i = 0; i < 8; i++) {\n const v = s.getPropertyValue(`--cg-color-chart-${i + 1}`).trim();\n if (v) PALETTE[i] = v;\n }\n this._resolved = true;\n }\n\n override firstUpdated() {\n this._resolve();\n this.requestUpdate();\n }\n\n private _animId = 0;\n private _animated = false;\n\n override updated(changed: Map<string, unknown>) {\n if (!this._animated && this.data.length > 0) {\n this._animated = true;\n this._animateBars();\n }\n if (changed.has('data') \|\| changed.has('type')) {\n this._animated = false;\n cancelAnimationFrame(this._animId);\n // Re-animate on next frame after render\n requestAnimationFrame(() => {\n this._animated = true;\n this._animateBars();\n });\n }\n }\n\n private _easeOut(t: number) { return 1 - (1 - t) (1 - t); }\n\n private _animateBars() {\n const bars = this.shadowRoot?.querySelectorAll<SVGRectElement>('.bar-anim');\n const hbars = this.shadowRoot?.querySelectorAll<SVGRectElement>('.hbar-anim');\n const vals = this.shadowRoot?.querySelectorAll<SVGElement>('.val-anim');\n if (!bars?.length && !hbars?.length) return;\n\n const dur = 500;\n const start = performance.now();\n\n const tick = (now: number) => {\n const elapsed = now - start;\n\n bars?.forEach(rect => {\n const delay = Number(rect.dataset.delay) \|\| 0;\n const t = Math.min(1, Math.max(0, (elapsed - delay) / dur));\n const p = this._easeOut(t);\n const targetH = Number(rect.dataset.h);\n const targetY = Number(rect.dataset.y);\n const baseY = targetY + targetH;\n const h = targetH * p;\n rect.setAttribute('height', String(h));\n rect.setAttribute('y', String(baseY - h));\n });\n\n hbars?.forEach(rect => {\n const delay = Number(rect.dataset.delay) \|\| 0;\n const t = Math.min(1, Math.max(0, (elapsed - delay) / dur));\n const p = this._easeOut(t);\n const targetW = Number(rect.dataset.w);\n rect.setAttribute('width', String(targetW * p));\n });\n\n vals?.forEach(el => {\n const delay = Number(el.dataset.delay) \|\| 0;\n const t = Math.min(1, Math.max(0, (elapsed - delay) / 200));\n el.setAttribute('opacity', String(t));\n });\n\n const maxDelay = Math.max(\n ...[...bars \|\| []].map(r => Number(r.dataset.delay) \|\| 0),\n ...[...hbars \|\| []].map(r => Number(r.dataset.delay) \|\| 0),\n ...[...vals \|\| []].map(r => Number(r.dataset.delay) \|\| 0),\n );\n if (elapsed < maxDelay + dur + 200) {\n this._animId = requestAnimationFrame(tick);\n }\n };\n\n this._animId = requestAnimationFrame(tick);\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n cancelAnimationFrame(this._animId);\n }\n\n private _color(i: number, d: ChartSeries) { return d.color \|\| PALETTE[i % PALETTE.length]!; }\n\n private _fmt(v: number) {\n if (Math.abs(v) >= 1e6) return (v / 1e6).toFixed(1) + 'M';\n if (Math.abs(v) >= 1e3) return (v / 1e3).toFixed(1) + 'K';\n return v % 1 === 0 ? String(v) : v.toFixed(1);\n }\n\n private _tip(e: MouseEvent, label: string, value: number) {\n const r = (e.currentTarget as Element).closest('.svg-wrap')!.getBoundingClientRect();\n this._tipX = e.clientX - r.left;\n this._tipY = e.clientY - r.top;\n this._tipText = `${label}: ${this._fmt(value)}`;\n this._tipShow = true;\n }\n private _untip() { this._tipShow = false; }\n\n // ═══ BAR ═══\n private _bar() {\n const { data, height: H } = this;\n const W = 400, T = 20, R = 16, B = 28, L = 44;\n const pw = W - L - R, ph = H - T - B;\n const max = Math.max(...data.map(d => d.value), 1);\n const n = data.length;\n const bw = (pw / n) * 0.6;\n const step = pw / n;\n\n return svg`\n ${this.showGrid ? [0.25, 0.5, 0.75, 1].map(p => {\n const y = T + ph - ph * p;\n return svg`\n <line x1=\"${L}\" y1=\"${y}\" x2=\"${W - R}\" y2=\"${y}\" stroke=\"${this._grid}\" stroke-width=\"0.5\" stroke-dasharray=\"3,3\" />\n <text x=\"${L - 6}\" y=\"${y + 4}\" text-anchor=\"end\" fill=\"${this._axis}\" font-size=\"10\">${this._fmt(max * p)}</text>\n `;\n }) : nothing}\n ${data.map((d, i) => {\n const bh = (d.value / max) * ph;\n const x = L + i * step + (step - bw) / 2;\n const yFinal = T + ph - bh;\n const yBase = T + ph;\n const c = this._color(i, d);\n return svg`\n <rect class=\"bar-anim\" x=\"${x}\" y=\"${yBase}\" width=\"${bw}\" height=\"0\" rx=\"4\" fill=\"${c}\" style=\"cursor:pointer\"\n data-y=\"${yFinal}\" data-h=\"${bh}\" data-delay=\"${i * 50}\"\n @mouseenter=${(e: MouseEvent) => this._tip(e, d.label, d.value)}\n @mouseleave=${this._untip} />\n ${this.showValues ? svg`<text class=\"val-anim\" x=\"${x + bw / 2}\" y=\"${yFinal - 6}\" text-anchor=\"middle\" fill=\"${this._text}\" font-size=\"10\" font-weight=\"600\" opacity=\"0\" data-delay=\"${i * 50 + 300}\">${this._fmt(d.value)}</text>` : nothing}\n <text x=\"${x + bw / 2}\" y=\"${H - 6}\" text-anchor=\"middle\" fill=\"${this._axis}\" font-size=\"10\">${d.label}</text>\n `;\n })}\n `;\n }\n\n // ═══ HORIZONTAL BAR ═══\n private _hbar() {\n const { data } = this;\n const W = 400, lW = 72, gap = 8, bH = 28;\n const H = data.length * (bH + gap);\n const max = Math.max(...data.map(d => d.value), 1);\n\n return svg`\n ${data.map((d, i) => {\n const y = i * (bH + gap);\n const bW = (d.value / max) * (W - lW - 60);\n const c = this._color(i, d);\n return svg`\n <text x=\"${lW - 6}\" y=\"${y + bH / 2 + 4}\" text-anchor=\"end\" fill=\"${this._axis}\" font-size=\"11\">${d.label}</text>\n <rect class=\"hbar-anim\" x=\"${lW}\" y=\"${y}\" width=\"0\" height=\"${bH}\" rx=\"4\" fill=\"${c}\" style=\"cursor:pointer\"\n data-w=\"${bW}\" data-delay=\"${i * 50}\"\n @mouseenter=${(e: MouseEvent) => this._tip(e, d.label, d.value)}\n @mouseleave=${this._untip} />\n <text class=\"val-anim\" x=\"${lW + bW + 8}\" y=\"${y + bH / 2 + 4}\" fill=\"${this._text}\" font-size=\"11\" font-weight=\"600\" opacity=\"0\" data-delay=\"${i * 50 + 300}\">${this._fmt(d.value)}</text>\n `;\n })}\n `;\n }\n\n // ═══ LINE / AREA ═══\n private _line(area: boolean) {\n const { data, height: H } = this;\n const W = 400, T = 12, R = 16, B = 28, L = 44;\n const pw = W - L - R, ph = H - T - B;\n const max = Math.max(...data.map(d => d.value), 1);\n const c = this._color(0, data[0]!);\n\n const pts = data.map((d, i) => ({\n x: L + (i / Math.max(data.length - 1, 1)) * pw,\n y: T + ph - (d.value / max) * ph,\n }));\n const line = pts.map((p, i) => `${i ? 'L' : 'M'}${p.x.toFixed(1)},${p.y.toFixed(1)}`).join(' ');\n const areaD = `${line} L${pts.at(-1)!.x.toFixed(1)},${(T + ph).toFixed(1)} L${pts[0]!.x.toFixed(1)},${(T + ph).toFixed(1)} Z`;\n\n return svg`\n ${this.showGrid ? [0.25, 0.5, 0.75, 1].map(p => {\n const y = T + ph - ph * p;\n return svg`\n <line x1=\"${L}\" y1=\"${y}\" x2=\"${W - R}\" y2=\"${y}\" stroke=\"${this._grid}\" stroke-width=\"0.5\" stroke-dasharray=\"3,3\" />\n <text x=\"${L - 6}\" y=\"${y + 4}\" text-anchor=\"end\" fill=\"${this._axis}\" font-size=\"10\">${this._fmt(max * p)}</text>\n `;\n }) : nothing}\n ${area ? svg`<path d=\"${areaD}\" fill=\"${c}\" opacity=\"0.2\" />` : nothing}\n <path class=\"anim-line\" d=\"${line}\" fill=\"none\" stroke=\"${c}\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"--dash:2000\" />\n ${pts.map((p, i) => svg`\n <circle class=\"anim-dot\" cx=\"${p.x}\" cy=\"${p.y}\" r=\"4\" fill=\"${c}\" stroke=\"${this._bg}\" stroke-width=\"2\" style=\"cursor:pointer; animation-delay:${400 + i * 50}ms\"\n @mouseenter=${(e: MouseEvent) => this._tip(e, data[i]!.label, data[i]!.value)}\n @mouseleave=${this._untip} />\n `)}\n ${data.map((d, i) => svg`\n <text x=\"${pts[i]!.x}\" y=\"${H - 6}\" text-anchor=\"middle\" fill=\"${this._axis}\" font-size=\"10\">${d.label}</text>\n `)}\n `;\n }\n\n // ═══ PIE / DONUT ═══\n private _pie(donut: boolean) {\n const { data } = this;\n const total = data.reduce((s, d) => s + d.value, 0) \|\| 1;\n const sz = Math.min(this.height, 240);\n const r = sz * 0.4;\n const cx = sz / 2, cy = sz / 2;\n const rad = (a: number) => a * Math.PI / 180;\n let ang = -90;\n\n const slices = data.map((d, i) => {\n const sw = (d.value / total) * 360;\n const end = ang + sw;\n const lg = sw > 180 ? 1 : 0;\n const x1 = cx + r * Math.cos(rad(ang));\n const y1 = cy + r * Math.sin(rad(ang));\n const x2 = cx + r * Math.cos(rad(end));\n const y2 = cy + r * Math.sin(rad(end));\n const mid = ang + sw / 2;\n const lr = r * (donut ? 1.2 : 0.6);\n const lx = cx + lr * Math.cos(rad(mid));\n const ly = cy + lr * Math.sin(rad(mid));\n const pct = Math.round((d.value / total) * 100);\n const c = this._color(i, d);\n const p = `M${cx},${cy} L${x1.toFixed(1)},${y1.toFixed(1)} A${r},${r} 0 ${lg} 1 ${x2.toFixed(1)},${y2.toFixed(1)} Z`;\n ang = end;\n\n return svg`\n <path class=\"anim-slice\" d=\"${p}\" fill=\"${c}\" style=\"cursor:pointer; animation-delay:${i * 60}ms\"\n @mouseenter=${(e: MouseEvent) => this._tip(e, d.label, d.value)}\n @mouseleave=${this._untip} />\n ${pct >= 5 ? svg`<text x=\"${lx}\" y=\"${ly}\" text-anchor=\"middle\" dominant-baseline=\"central\" fill=\"${donut ? this._axis : this._text}\" font-size=\"10\" font-weight=\"600\">${pct}%</text>` : nothing}\n `;\n });\n\n return svg`\n ${slices}\n ${donut ? svg`\n <circle cx=\"${cx}\" cy=\"${cy}\" r=\"${r * 0.55}\" fill=\"${this._bg}\" />\n <text x=\"${cx}\" y=\"${cy - 4}\" text-anchor=\"middle\" fill=\"${this._text}\" font-size=\"16\" font-weight=\"700\">${this._fmt(total)}</text>\n <text x=\"${cx}\" y=\"${cy + 12}\" text-anchor=\"middle\" fill=\"${this._axis}\" font-size=\"9\">Total</text>\n ` : nothing}\n `;\n }\n\n private _svgHeight() {\n if (this.type === 'horizontal-bar') return this.data.length * 36;\n if (this.type === 'pie' \|\| this.type === 'donut') return Math.min(this.height, 240);\n return this.height;\n }\n\n private _svgWidth() {\n if (this.type === 'pie' \|\| this.type === 'donut') return Math.min(this.height, 240);\n return 400;\n }\n\n override render() {\n if (!this.data.length) return html`<div class=\"wrap ${this.contained ? 'contained' : ''}\"><div class=\"empty\">${this.emptyText}</div></div>`;\n\n const vw = this._svgWidth();\n const vh = this._svgHeight();\n const isPie = this.type === 'pie' \|\| this.type === 'donut';\n\n let chartSvg;\n switch (this.type) {\n case 'bar': chartSvg = this._bar(); break;\n case 'horizontal-bar': chartSvg = this._hbar(); break;\n case 'line': chartSvg = this._line(false); break;\n case 'area': chartSvg = this._line(true); break;\n case 'pie': chartSvg = this._pie(false); break;\n case 'donut': chartSvg = this._pie(true); break;\n }\n\n return html`\n <div class=\"wrap ${this.contained ? 'contained' : ''}\">\n ${this.title \|\| this.subtitle ? html`\n <div class=\"header\">\n ${this.title ? html`<div class=\"title\">${this.title}</div>` : nothing}\n ${this.subtitle ? html`<div class=\"subtitle\">${this.subtitle}</div>` : nothing}\n </div>\n ` : nothing}\n\n <div class=\"svg-wrap\">\n <svg viewBox=\"0 0 ${vw} ${vh}\" style=\"${isPie ? `max-width:${vw}px; margin:0 auto;` : ''}\">\n ${chartSvg}\n </svg>\n <div class=\"tip ${this._tipShow ? 'show' : ''}\" style=\"left:${this._tipX}px;top:${this._tipY}px;\">\n ${this._tipText}\n </div>\n </div>\n\n ${this.showLegend ? html`\n <div class=\"legend\">\n ${this.data.map((d, i) => html`\n <span class=\"legend-item anim-legend\" style=\"animation-delay:${300 + i * 40}ms\">\n <span class=\"legend-dot\" style=\"background:${this._color(i, d)}\"></span>\n <span>${d.label}</span>\n <span class=\"legend-val\">${this._fmt(d.value)}</span>\n </span>\n `)}\n </div>\n ` : nothing}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap { 'cg-chart': CgChart; }\n}\n"],"names":["PALETTE","CgChart","LitElement","s","i","v","changed","bars","hbars","vals","dur","start","tick","now","elapsed","rect","delay","t","p","targetH","baseY","h","targetW","el","maxDelay","r","d","e","label","value","data","H","W","T","R","B","L","pw","ph","max","n","bw","step","svg","nothing","bh","x","yFinal","yBase","c","lW","gap","bH","y","bW","area","pts","line","areaD","donut","total","sz","cx","cy","rad","a","ang","slices","sw","end","lg","x1","y1","x2","y2","mid","lr","lx","ly","pct","html","vw","vh","isPie","chartSvg","hostBlock","reducedMotion","css","__decorateClass","property","state","customElement"],"mappings":"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"}
1	+ {"version":3,"file":"cg-chart.js","sources":["../../../src/components/cg-chart/cg-chart.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/** Data point for cg-chart /\nexport interface ChartSeries {\n label: string;\n value: number;\n color?: string;\n}\n\n/* Default palette — hex colors that work directly in SVG fill/stroke attributes /\nconst PALETTE = [\n '#dfff61', '#14b8a6', '#22c55e', '#f59e0b',\n '#f97316', '#ec4899', '#8b5cf6', '#ef4444',\n];\n\n@customElement('cg-chart')\nexport class CgChart extends LitElement {\n static override styles = [hostBlock, reducedMotion, css`\n :host { display: block; }\n\n .wrap { position: relative; }\n .wrap.contained {\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 padding: var(--cg-spacing-20);\n }\n\n .header { margin-bottom: var(--cg-spacing-12); }\n .title {\n font-size: var(--cg-font-size-sm);\n font-weight: var(--cg-font-weight-semibold);\n color: var(--cg-color-surface-base-text);\n }\n .subtitle {\n font-size: var(--cg-font-size-xs);\n color: var(--cg-color-input-text-placeholder);\n margin-top: var(--cg-spacing-2);\n }\n\n .svg-wrap { position: relative; }\n svg { display: block; width: 100%; }\n\n / ── Entrance animations ── /\n @keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n }\n @keyframes lineTrace {\n from { stroke-dashoffset: var(--dash); }\n to { stroke-dashoffset: 0; }\n }\n\n .anim-line {\n stroke-dasharray: var(--dash);\n stroke-dashoffset: var(--dash);\n animation: lineTrace 900ms var(--cg-transition-easing-ease-out) forwards;\n }\n .anim-dot {\n animation: fadeIn 200ms var(--cg-transition-easing-ease-out) both;\n }\n .anim-slice {\n animation: fadeIn 400ms var(--cg-transition-easing-ease-out) both;\n }\n .anim-legend {\n animation: fadeIn 200ms var(--cg-transition-easing-ease-out) both;\n }\n\n / Tooltip /\n .tip {\n position: absolute;\n background: var(--cg-color-surface-container-background);\n color: var(--cg-color-surface-base-text);\n border: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n padding: var(--cg-spacing-4) var(--cg-spacing-8);\n border-radius: var(--cg-border-radius-50);\n font-size: var(--cg-font-size-xs);\n font-weight: var(--cg-font-weight-medium);\n pointer-events: none;\n white-space: nowrap;\n transform: translate(-50%, -100%);\n margin-top: calc(var(--cg-spacing-8) -1);\n z-index: 10;\n display: none;\n }\n .tip.show { display: block; }\n\n /* Legend /\n .legend {\n display: flex; flex-wrap: wrap; gap: var(--cg-spacing-12);\n margin-top: var(--cg-spacing-16); padding-top: var(--cg-spacing-12);\n border-top: var(--cg-border-width-50) solid var(--cg-color-surface-cards-border);\n }\n .legend-item {\n display: inline-flex; align-items: center; gap: var(--cg-spacing-4);\n font-size: var(--cg-font-size-xs); color: var(--cg-color-input-text-placeholder);\n }\n .legend-dot {\n width: var(--cg-spacing-8); height: var(--cg-spacing-8);\n border-radius: var(--cg-border-radius-full); flex-shrink: 0;\n }\n .legend-val {\n font-weight: var(--cg-font-weight-semibold);\n color: var(--cg-color-surface-base-text);\n }\n\n .empty {\n display: flex; align-items: center; justify-content: center;\n color: var(--cg-color-input-text-placeholder);\n font-size: var(--cg-font-size-sm); min-height: 120px;\n }\n `];\n\n @property({ type: Array }) data: ChartSeries[] = [];\n @property() type: 'bar' \| 'horizontal-bar' \| 'line' \| 'area' \| 'pie' \| 'donut' = 'bar';\n @property() override title = '';\n @property() subtitle = '';\n @property({ type: Number }) height = 200;\n @property({ type: Boolean }) showLegend = true;\n @property({ type: Boolean }) showValues = true;\n /* Wrap chart in a card container /\n @property({ type: Boolean }) contained = false;\n @property({ type: Boolean }) showGrid = true;\n @property() emptyText = 'No data';\n\n @state() private _tipX = 0;\n @state() private _tipY = 0;\n @state() private _tipText = '';\n @state() private _tipShow = false;\n\n // Resolved theme colors for SVG — pulled from CSS custom properties at runtime\n private _grid = '';\n private _axis = '';\n private _text = '';\n private _bg = '';\n private _resolved = false;\n\n private _resolve() {\n if (this._resolved) return;\n const s = getComputedStyle(this);\n this._grid = s.getPropertyValue('--cg-color-chart-grid').trim() \|\| s.getPropertyValue('--cg-color-surface-cards-border').trim();\n this._axis = s.getPropertyValue('--cg-color-chart-axis').trim() \|\| s.getPropertyValue('--cg-color-input-text-placeholder').trim();\n this._text = s.getPropertyValue('--cg-color-surface-base-text').trim() \|\| s.getPropertyValue('--cg-color-surface-base-text').trim();\n this._bg = s.getPropertyValue('--cg-color-surface-container-background').trim() \|\| s.getPropertyValue('--cg-color-surface-base-background').trim();\n for (let i = 0; i < 8; i++) {\n const v = s.getPropertyValue(`--cg-color-chart-${i + 1}`).trim();\n if (v) PALETTE[i] = v;\n }\n this._resolved = true;\n }\n\n override firstUpdated() {\n this._resolve();\n this.requestUpdate();\n }\n\n private _animId = 0;\n private _animated = false;\n\n override updated(changed: Map<string, unknown>) {\n if (!this._animated && this.data.length > 0) {\n this._animated = true;\n this._animateBars();\n }\n if (changed.has('data') \|\| changed.has('type')) {\n this._animated = false;\n cancelAnimationFrame(this._animId);\n // Re-animate on next frame after render\n requestAnimationFrame(() => {\n this._animated = true;\n this._animateBars();\n });\n }\n }\n\n private _easeOut(t: number) { return 1 - (1 - t) (1 - t); }\n\n private _animateBars() {\n const bars = this.shadowRoot?.querySelectorAll<SVGRectElement>('.bar-anim');\n const hbars = this.shadowRoot?.querySelectorAll<SVGRectElement>('.hbar-anim');\n const vals = this.shadowRoot?.querySelectorAll<SVGElement>('.val-anim');\n if (!bars?.length && !hbars?.length) return;\n\n const dur = 500;\n const start = performance.now();\n\n const tick = (now: number) => {\n const elapsed = now - start;\n\n bars?.forEach(rect => {\n const delay = Number(rect.dataset.delay) \|\| 0;\n const t = Math.min(1, Math.max(0, (elapsed - delay) / dur));\n const p = this._easeOut(t);\n const targetH = Number(rect.dataset.h);\n const targetY = Number(rect.dataset.y);\n const baseY = targetY + targetH;\n const h = targetH * p;\n rect.setAttribute('height', String(h));\n rect.setAttribute('y', String(baseY - h));\n });\n\n hbars?.forEach(rect => {\n const delay = Number(rect.dataset.delay) \|\| 0;\n const t = Math.min(1, Math.max(0, (elapsed - delay) / dur));\n const p = this._easeOut(t);\n const targetW = Number(rect.dataset.w);\n rect.setAttribute('width', String(targetW * p));\n });\n\n vals?.forEach(el => {\n const delay = Number(el.dataset.delay) \|\| 0;\n const t = Math.min(1, Math.max(0, (elapsed - delay) / 200));\n el.setAttribute('opacity', String(t));\n });\n\n const maxDelay = Math.max(\n ...[...bars \|\| []].map(r => Number(r.dataset.delay) \|\| 0),\n ...[...hbars \|\| []].map(r => Number(r.dataset.delay) \|\| 0),\n ...[...vals \|\| []].map(r => Number(r.dataset.delay) \|\| 0),\n );\n if (elapsed < maxDelay + dur + 200) {\n this._animId = requestAnimationFrame(tick);\n }\n };\n\n this._animId = requestAnimationFrame(tick);\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n cancelAnimationFrame(this._animId);\n }\n\n private _color(i: number, d: ChartSeries) { return d.color \|\| PALETTE[i % PALETTE.length]!; }\n\n private _fmt(v: number) {\n if (Math.abs(v) >= 1e6) return (v / 1e6).toFixed(1) + 'M';\n if (Math.abs(v) >= 1e3) return (v / 1e3).toFixed(1) + 'K';\n return v % 1 === 0 ? String(v) : v.toFixed(1);\n }\n\n private _tip(e: MouseEvent, label: string, value: number) {\n const r = (e.currentTarget as Element).closest('.svg-wrap')!.getBoundingClientRect();\n this._tipX = e.clientX - r.left;\n this._tipY = e.clientY - r.top;\n this._tipText = `${label}: ${this._fmt(value)}`;\n this._tipShow = true;\n }\n private _untip() { this._tipShow = false; }\n\n // ═══ BAR ═══\n private _bar() {\n const { data, height: H } = this;\n const W = 400, T = 20, R = 16, B = 28, L = 44;\n const pw = W - L - R, ph = H - T - B;\n const max = Math.max(...data.map(d => d.value), 1);\n const n = data.length;\n const bw = (pw / n) * 0.6;\n const step = pw / n;\n\n return svg`\n ${this.showGrid ? [0.25, 0.5, 0.75, 1].map(p => {\n const y = T + ph - ph * p;\n return svg`\n <line x1=\"${L}\" y1=\"${y}\" x2=\"${W - R}\" y2=\"${y}\" stroke=\"${this._grid}\" stroke-width=\"0.5\" stroke-dasharray=\"3,3\" />\n <text x=\"${L - 6}\" y=\"${y + 4}\" text-anchor=\"end\" fill=\"${this._axis}\" font-size=\"10\">${this._fmt(max * p)}</text>\n `;\n }) : nothing}\n ${data.map((d, i) => {\n const bh = (d.value / max) * ph;\n const x = L + i * step + (step - bw) / 2;\n const yFinal = T + ph - bh;\n const yBase = T + ph;\n const c = this._color(i, d);\n return svg`\n <rect class=\"bar-anim\" x=\"${x}\" y=\"${yBase}\" width=\"${bw}\" height=\"0\" rx=\"4\" fill=\"${c}\" style=\"cursor:pointer\"\n data-y=\"${yFinal}\" data-h=\"${bh}\" data-delay=\"${i * 50}\"\n @mouseenter=${(e: MouseEvent) => this._tip(e, d.label, d.value)}\n @mouseleave=${this._untip} />\n ${this.showValues ? svg`<text class=\"val-anim\" x=\"${x + bw / 2}\" y=\"${yFinal - 6}\" text-anchor=\"middle\" fill=\"${this._text}\" font-size=\"10\" font-weight=\"600\" opacity=\"0\" data-delay=\"${i * 50 + 300}\">${this._fmt(d.value)}</text>` : nothing}\n <text x=\"${x + bw / 2}\" y=\"${H - 6}\" text-anchor=\"middle\" fill=\"${this._axis}\" font-size=\"10\">${d.label}</text>\n `;\n })}\n `;\n }\n\n // ═══ HORIZONTAL BAR ═══\n private _hbar() {\n const { data } = this;\n const W = 400, lW = 72, gap = 8, bH = 28;\n const H = data.length * (bH + gap);\n const max = Math.max(...data.map(d => d.value), 1);\n\n return svg`\n ${data.map((d, i) => {\n const y = i * (bH + gap);\n const bW = (d.value / max) * (W - lW - 60);\n const c = this._color(i, d);\n return svg`\n <text x=\"${lW - 6}\" y=\"${y + bH / 2 + 4}\" text-anchor=\"end\" fill=\"${this._axis}\" font-size=\"11\">${d.label}</text>\n <rect class=\"hbar-anim\" x=\"${lW}\" y=\"${y}\" width=\"0\" height=\"${bH}\" rx=\"4\" fill=\"${c}\" style=\"cursor:pointer\"\n data-w=\"${bW}\" data-delay=\"${i * 50}\"\n @mouseenter=${(e: MouseEvent) => this._tip(e, d.label, d.value)}\n @mouseleave=${this._untip} />\n <text class=\"val-anim\" x=\"${lW + bW + 8}\" y=\"${y + bH / 2 + 4}\" fill=\"${this._text}\" font-size=\"11\" font-weight=\"600\" opacity=\"0\" data-delay=\"${i * 50 + 300}\">${this._fmt(d.value)}</text>\n `;\n })}\n `;\n }\n\n // ═══ LINE / AREA ═══\n private _line(area: boolean) {\n const { data, height: H } = this;\n const W = 400, T = 12, R = 16, B = 28, L = 44;\n const pw = W - L - R, ph = H - T - B;\n const max = Math.max(...data.map(d => d.value), 1);\n const c = this._color(0, data[0]!);\n\n const pts = data.map((d, i) => ({\n x: L + (i / Math.max(data.length - 1, 1)) * pw,\n y: T + ph - (d.value / max) * ph,\n }));\n const line = pts.map((p, i) => `${i ? 'L' : 'M'}${p.x.toFixed(1)},${p.y.toFixed(1)}`).join(' ');\n const areaD = `${line} L${pts.at(-1)!.x.toFixed(1)},${(T + ph).toFixed(1)} L${pts[0]!.x.toFixed(1)},${(T + ph).toFixed(1)} Z`;\n\n return svg`\n ${this.showGrid ? [0.25, 0.5, 0.75, 1].map(p => {\n const y = T + ph - ph * p;\n return svg`\n <line x1=\"${L}\" y1=\"${y}\" x2=\"${W - R}\" y2=\"${y}\" stroke=\"${this._grid}\" stroke-width=\"0.5\" stroke-dasharray=\"3,3\" />\n <text x=\"${L - 6}\" y=\"${y + 4}\" text-anchor=\"end\" fill=\"${this._axis}\" font-size=\"10\">${this._fmt(max * p)}</text>\n `;\n }) : nothing}\n ${area ? svg`<path d=\"${areaD}\" fill=\"${c}\" opacity=\"0.2\" />` : nothing}\n <path class=\"anim-line\" d=\"${line}\" fill=\"none\" stroke=\"${c}\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"--dash:2000\" />\n ${pts.map((p, i) => svg`\n <circle class=\"anim-dot\" cx=\"${p.x}\" cy=\"${p.y}\" r=\"4\" fill=\"${c}\" stroke=\"${this._bg}\" stroke-width=\"2\" style=\"cursor:pointer; animation-delay:${400 + i * 50}ms\"\n @mouseenter=${(e: MouseEvent) => this._tip(e, data[i]!.label, data[i]!.value)}\n @mouseleave=${this._untip} />\n `)}\n ${data.map((d, i) => svg`\n <text x=\"${pts[i]!.x}\" y=\"${H - 6}\" text-anchor=\"middle\" fill=\"${this._axis}\" font-size=\"10\">${d.label}</text>\n `)}\n `;\n }\n\n // ═══ PIE / DONUT ═══\n private _pie(donut: boolean) {\n const { data } = this;\n const total = data.reduce((s, d) => s + d.value, 0) \|\| 1;\n const sz = Math.min(this.height, 240);\n const r = sz * 0.4;\n const cx = sz / 2, cy = sz / 2;\n const rad = (a: number) => a * Math.PI / 180;\n let ang = -90;\n\n const slices = data.map((d, i) => {\n const sw = (d.value / total) * 360;\n const end = ang + sw;\n const lg = sw > 180 ? 1 : 0;\n const x1 = cx + r * Math.cos(rad(ang));\n const y1 = cy + r * Math.sin(rad(ang));\n const x2 = cx + r * Math.cos(rad(end));\n const y2 = cy + r * Math.sin(rad(end));\n const mid = ang + sw / 2;\n const lr = r * (donut ? 1.2 : 0.6);\n const lx = cx + lr * Math.cos(rad(mid));\n const ly = cy + lr * Math.sin(rad(mid));\n const pct = Math.round((d.value / total) * 100);\n const c = this._color(i, d);\n const p = `M${cx},${cy} L${x1.toFixed(1)},${y1.toFixed(1)} A${r},${r} 0 ${lg} 1 ${x2.toFixed(1)},${y2.toFixed(1)} Z`;\n ang = end;\n\n return svg`\n <path class=\"anim-slice\" d=\"${p}\" fill=\"${c}\" style=\"cursor:pointer; animation-delay:${i * 60}ms\"\n @mouseenter=${(e: MouseEvent) => this._tip(e, d.label, d.value)}\n @mouseleave=${this._untip} />\n ${pct >= 5 ? svg`<text x=\"${lx}\" y=\"${ly}\" text-anchor=\"middle\" dominant-baseline=\"central\" fill=\"${donut ? this._axis : this._text}\" font-size=\"10\" font-weight=\"600\">${pct}%</text>` : nothing}\n `;\n });\n\n return svg`\n ${slices}\n ${donut ? svg`\n <circle cx=\"${cx}\" cy=\"${cy}\" r=\"${r * 0.55}\" fill=\"${this._bg}\" />\n <text x=\"${cx}\" y=\"${cy - 4}\" text-anchor=\"middle\" fill=\"${this._text}\" font-size=\"16\" font-weight=\"700\">${this._fmt(total)}</text>\n <text x=\"${cx}\" y=\"${cy + 12}\" text-anchor=\"middle\" fill=\"${this._axis}\" font-size=\"9\">Total</text>\n ` : nothing}\n `;\n }\n\n private _svgHeight() {\n if (this.type === 'horizontal-bar') return this.data.length * 36;\n if (this.type === 'pie' \|\| this.type === 'donut') return Math.min(this.height, 240);\n return this.height;\n }\n\n private _svgWidth() {\n if (this.type === 'pie' \|\| this.type === 'donut') return Math.min(this.height, 240);\n return 400;\n }\n\n override render() {\n if (!this.data.length) return html`<div class=\"wrap ${this.contained ? 'contained' : ''}\"><div class=\"empty\">${this.emptyText}</div></div>`;\n\n const vw = this._svgWidth();\n const vh = this._svgHeight();\n const isPie = this.type === 'pie' \|\| this.type === 'donut';\n\n let chartSvg;\n switch (this.type) {\n case 'bar': chartSvg = this._bar(); break;\n case 'horizontal-bar': chartSvg = this._hbar(); break;\n case 'line': chartSvg = this._line(false); break;\n case 'area': chartSvg = this._line(true); break;\n case 'pie': chartSvg = this._pie(false); break;\n case 'donut': chartSvg = this._pie(true); break;\n }\n\n return html`\n <div class=\"wrap ${this.contained ? 'contained' : ''}\">\n ${this.title \|\| this.subtitle ? html`\n <div class=\"header\">\n ${this.title ? html`<div class=\"title\">${this.title}</div>` : nothing}\n ${this.subtitle ? html`<div class=\"subtitle\">${this.subtitle}</div>` : nothing}\n </div>\n ` : nothing}\n\n <div class=\"svg-wrap\">\n <svg\n role=\"img\"\n aria-label=${`${this.title \|\| 'Chart'}: ${this.data.map((d) => `${d.label} ${this._fmt(d.value)}`).join(', ')}`}\n viewBox=\"0 0 ${vw} ${vh}\"\n style=\"${isPie ? `max-width:${vw}px; margin:0 auto;` : ''}\"\n >\n ${chartSvg}\n </svg>\n <div class=\"tip ${this._tipShow ? 'show' : ''}\" style=\"left:${this._tipX}px;top:${this._tipY}px;\">\n ${this._tipText}\n </div>\n </div>\n\n ${this.showLegend ? html`\n <div class=\"legend\">\n ${this.data.map((d, i) => html`\n <span class=\"legend-item anim-legend\" style=\"animation-delay:${300 + i * 40}ms\">\n <span class=\"legend-dot\" style=\"background:${this._color(i, d)}\"></span>\n <span>${d.label}</span>\n <span class=\"legend-val\">${this._fmt(d.value)}</span>\n </span>\n `)}\n </div>\n ` : nothing}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap { 'cg-chart': CgChart; }\n}\n"],"names":["PALETTE","CgChart","LitElement","s","i","v","changed","bars","hbars","vals","dur","start","tick","now","elapsed","rect","delay","t","p","targetH","baseY","h","targetW","el","maxDelay","r","d","e","label","value","data","H","W","T","R","B","L","pw","ph","max","n","bw","step","svg","nothing","bh","x","yFinal","yBase","c","lW","gap","bH","y","bW","area","pts","line","areaD","donut","total","sz","cx","cy","rad","a","ang","slices","sw","end","lg","x1","y1","x2","y2","mid","lr","lx","ly","pct","html","vw","vh","isPie","chartSvg","hostBlock","reducedMotion","css","__decorateClass","property","state","customElement"],"mappings":"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"}

package/dist/components/cg-checkbox/cg-checkbox.d.ts CHANGED Viewed

@@ -2,8 +2,6 @@ import { LitElement, PropertyValues } from 'lit';
 /**
  * @element cg-checkbox
  * Checkbox with animated tick draw, spring bounce, and indeterminate state.
- * Supports rich label content via the default slot — links and other
- * interactive elements inside the label do not toggle the checkbox.
  *
  * @example
  * ```html
@@ -11,12 +9,8 @@ import { LitElement, PropertyValues } from 'lit';
  * <cg-checkbox checked label="Notifications"></cg-checkbox>
  * <cg-checkbox indeterminate label="Select all"></cg-checkbox>
  * <cg-checkbox rounded="full" checked label="Round checkbox"></cg-checkbox>
- * <cg-checkbox>I agree to the <a href="/terms">terms</a></cg-checkbox>
  * ```
  *
- * @slot - Default slot for label content (overrides `label` prop)
- * @slot description - Description content (overrides `description` prop)
- *
  * @fires {CustomEvent<{checked: boolean, value: string}>} cg-change - When toggled
  */
 export declare class CgCheckbox extends LitElement {

package/dist/components/cg-checkbox/cg-checkbox.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cg-checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/cg-checkbox/cg-checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1E~~;;;;;;;;;;;;;;;;;;;GAmBG~~;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,MAAM,CAAC,cAAc,UAAQ;IAC7B,OAAO,CAAC,UAAU,CAA+B;;IASjD,OAAgB,MAAM,~~4BA+KnB~~;IAES,KAAK,SAAM;IACX,WAAW,SAAM;IACjB,IAAI,SAAM;IACV,KAAK,SAAM;IACM,OAAO,UAAS;IAChB,aAAa,UAAS;IACP,QAAQ,UAAS;IACjB,KAAK,UAAS;IACd,OAAO,UAAS;IAChB,OAAO,UAAS;IAC/B,QAAQ,UAAS;IACjB,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAQ;IAEzE,OAAO,CAAC,OAAO,EAAE,cAAc;IAcxC,iBAAiB;IAIjB,wBAAwB,CAAC,KAAK,EAAE,MAAM;IAItC,OAAO,CAAC,OAAO;~~IAkBN~~,MAAM;~~CAwChB~~;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAAG,aAAa,EAAE,UAAU,CAAC;KAAE;CAC/D"}
1	+ {"version":3,"file":"cg-checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/cg-checkbox/cg-checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1E;;;;;;;;;;;;;GAaG;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,MAAM,CAAC,cAAc,UAAQ;IAC7B,OAAO,CAAC,UAAU,CAA+B;;IASjD,OAAgB,MAAM,4BAiLnB;IAES,KAAK,SAAM;IACX,WAAW,SAAM;IACjB,IAAI,SAAM;IACV,KAAK,SAAM;IACM,OAAO,UAAS;IAChB,aAAa,UAAS;IACP,QAAQ,UAAS;IACjB,KAAK,UAAS;IACd,OAAO,UAAS;IAChB,OAAO,UAAS;IAC/B,QAAQ,UAAS;IACjB,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAQ;IAEzE,OAAO,CAAC,OAAO,EAAE,cAAc;IAcxC,iBAAiB;IAIjB,wBAAwB,CAAC,KAAK,EAAE,MAAM;IAItC,OAAO,CAAC,OAAO;IAWN,MAAM;CA0ChB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAAG,aAAa,EAAE,UAAU,CAAC;KAAE;CAC/D"}

package/dist/components/cg-checkbox/cg-checkbox.js CHANGED Viewed

@@ -1,10 +1,10 @@
-import { css as u, LitElement as g, html as i, nothing as h } from "lit";
-import { property as a, customElement as b } from "lit/decorators.js";
-import { h as p, r as f } from "../../chunks/premium.css-9I4kHrsl.js";
-var v = Object.defineProperty, k = Object.getOwnPropertyDescriptor, o = (r, t, c, n) => {
-  for (var s = n > 1 ? void 0 : n ? k(t, c) : t, l = r.length - 1, d; l >= 0; l--)
-    (d = r[l]) && (s = (n ? d(t, c, s) : d(s)) || s);
-  return n && s && v(t, c, s), s;
+import { css as u, LitElement as g, nothing as n, html as i } from "lit";
+import { property as o, customElement as b } from "lit/decorators.js";
+import { h as p, r as f } from "../../chunks/premium.css-DHekUEUt.js";
+var v = Object.defineProperty, k = Object.getOwnPropertyDescriptor, t = (r, a, d, c) => {
+  for (var s = c > 1 ? void 0 : c ? k(a, d) : a, l = r.length - 1, h; l >= 0; l--)
+    (h = r[l]) && (s = (c ? h(a, d, s) : h(s)) || s);
+  return c && s && v(a, d, s), s;
 };
 let e = class extends g {
   constructor() {
@@ -20,11 +20,7 @@ let e = class extends g {
     this.checked = r === (this.value || "on");
   }
   _toggle(r) {
-    if (r.preventDefault(), this.disabled || this.loading) return;
-    const t = r.target;
-    t && t !== this && t.closest(
-      'a, button, [role="button"], [role="link"], input:not([type="checkbox"]), select, textarea'
-    ) || (this.checked = !this.checked, this.indeterminate = !1, this.dispatchEvent(new CustomEvent("cg-change", {
+    r.preventDefault(), !(this.disabled || this.loading) && (this.checked = !this.checked, this.indeterminate = !1, this.dispatchEvent(new CustomEvent("cg-change", {
       detail: { checked: this.checked, value: this.value },
       bubbles: !0,
       composed: !0
@@ -42,32 +38,34 @@ let e = class extends g {
         aria-invalid=${this.error ? "true" : "false"}
         aria-busy=${this.loading ? "true" : "false"}
         @click=${this._toggle}
-        @keydown=${(t) => {
-      (t.key === " " || t.key === "Enter") && (t.preventDefault(), this._toggle(t));
+        @keydown=${(a) => {
+      (a.key === " " || a.key === "Enter") && (a.preventDefault(), this._toggle(a));
     }}
       >
         <input type="checkbox" .checked=${this.checked} .indeterminate=${this.indeterminate}
           ?disabled=${this.disabled} name=${this.name} value=${this.value}
           tabindex="-1" aria-hidden="true"
-          @click=${(t) => t.stopPropagation()} />
+          @click=${(a) => a.stopPropagation()} />
         ${this.loading ? i`<span class="loading-spinner" aria-hidden="true"></span>` : i`<span class="box ${r}">
           ${this.checked ? i`
             <svg class="check-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round">
               <path class="tick" d="M4 12L9 17L20 6"></path>
             </svg>
-          ` : h}
+          ` : n}
           ${this.indeterminate ? i`
             <svg class="check-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round">
               <path class="dash" d="M5 12h14"></path>
             </svg>
-          ` : h}
+          ` : n}
         </span>`}
-        <span class="text-group">
-          <span class="label-text"><slot>${this.label}</slot></span>
-          <span class="description"><slot name="description">${this.description}</slot></span>
-        </span>
+        ${this.label ? i`
+          <span class="text-group">
+            <span class="label-text">${this.label}</span>
+            ${this.description ? i`<span class="description">${this.description}</span>` : n}
+          </span>
+        ` : n}
       </label>
     `;
   }
@@ -119,9 +117,10 @@ e.styles = [p, f, u`
     :host([rounded="lg"]) .box { border-radius: var(--cg-border-radius-150); }
     :host([rounded="full"]) .box { border-radius: var(--cg-border-radius-full); }
-    /* Hover */
-    :host(:not([disabled])) label:hover .box {
-      border-color: var(--cg-color-checkbox-background-hover);
+    /* Hover — scoped so it doesn't override the error/success border, and
+       uses the accent BORDER token (not a -background- fill) for the edge. */
+    :host(:not([disabled]):not([error]):not([success])) label:hover .box {
+      border-color: var(--cg-color-checkbox-border-checked);
     }
     /* Pressed */
@@ -132,7 +131,7 @@ e.styles = [p, f, u`
     /* Focus ring */
     label:focus-visible .box {
       border-color: var(--cg-color-checkbox-border-focus);
-      box-shadow: 0 0 0 2px var(--cg-color-focus-ring-offset), 0 0 0 4px var(--cg-color-focus-ring);
+      box-shadow: 0 0 0 var(--cg-border-width-100) var(--cg-color-focus-ring-offset), 0 0 0 calc(var(--cg-border-width-100) * 2) var(--cg-color-focus-ring);
     }
     /* ── Checked state ── */
@@ -142,10 +141,11 @@ e.styles = [p, f, u`
       animation: boxPop var(--cg-transition-duration-slow) var(--cg-transition-easing-ease-out);
     }
-    /* Indeterminate */
+    /* Indeterminate — same spring entry as checked for consistent feedback. */
     .box.indeterminate {
       background: var(--cg-color-checkbox-background-checked);
       border-color: var(--cg-color-checkbox-border-checked);
+      animation: boxPop var(--cg-transition-duration-slow) var(--cg-transition-easing-ease-out);
     }
     /* ── Animated tick — stroke reveal ── */
@@ -249,43 +249,43 @@ e.styles = [p, f, u`
       line-height: var(--cg-line-height-snug);
     }
   `];
-o([
-  a()
+t([
+  o()
 ], e.prototype, "label", 2);
-o([
-  a()
+t([
+  o()
 ], e.prototype, "description", 2);
-o([
-  a()
+t([
+  o()
 ], e.prototype, "name", 2);
-o([
-  a()
+t([
+  o()
 ], e.prototype, "value", 2);
-o([
-  a({ type: Boolean })
+t([
+  o({ type: Boolean })
 ], e.prototype, "checked", 2);
-o([
-  a({ type: Boolean })
+t([
+  o({ type: Boolean })
 ], e.prototype, "indeterminate", 2);
-o([
-  a({ type: Boolean, reflect: !0 })
+t([
+  o({ type: Boolean, reflect: !0 })
 ], e.prototype, "disabled", 2);
-o([
-  a({ type: Boolean, reflect: !0 })
+t([
+  o({ type: Boolean, reflect: !0 })
 ], e.prototype, "error", 2);
-o([
-  a({ type: Boolean, reflect: !0 })
+t([
+  o({ type: Boolean, reflect: !0 })
 ], e.prototype, "success", 2);
-o([
-  a({ type: Boolean, reflect: !0 })
+t([
+  o({ type: Boolean, reflect: !0 })
 ], e.prototype, "loading", 2);
-o([
-  a({ type: Boolean })
+t([
+  o({ type: Boolean })
 ], e.prototype, "required", 2);
-o([
-  a({ reflect: !0 })
+t([
+  o({ reflect: !0 })
 ], e.prototype, "rounded", 2);
-e = o([
+e = t([
   b("cg-checkbox")
 ], e);
 export {