@sonordev/agency-site-kit 0.3.0 → 0.4.0

package/dist/portfolio/primitives/GlassCard.d.cts

@@ -0,0 +1,11 @@
+import React from 'react';
+
+interface GlassCardProps {
+    children: React.ReactNode;
+    className?: string;
+    hover?: boolean;
+    padding?: 'sm' | 'md' | 'lg';
+}
+declare function GlassCard({ children, className, hover, padding, }: GlassCardProps): React.JSX.Element;
+
+export { GlassCard as default };

package/dist/portfolio/primitives/GlassCard.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+
+interface GlassCardProps {
+    children: React.ReactNode;
+    className?: string;
+    hover?: boolean;
+    padding?: 'sm' | 'md' | 'lg';
+}
+declare function GlassCard({ children, className, hover, padding, }: GlassCardProps): React.JSX.Element;
+
+export { GlassCard as default };

package/dist/portfolio/primitives/GlassCard.js

@@ -0,0 +1,43 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/portfolio/components/primitives/GlassCard.tsx
+var paddingMap = {
+  sm: "16px",
+  md: "24px",
+  lg: "32px"
+};
+var HOVER_CSS = `
+.sk-glass-card{transition:transform .3s cubic-bezier(.25,.46,.45,.94),box-shadow .3s cubic-bezier(.25,.46,.45,.94)}
+.sk-glass-card--hover:hover{transform:translateY(-6px) scale(1.015);box-shadow:0 20px 40px -12px rgba(0,0,0,.25),0 0 0 1px var(--sk-primary,#6366f1)}
+@media (prefers-reduced-motion:reduce){.sk-glass-card{transition:none}.sk-glass-card--hover:hover{transform:none}}
+`;
+function GlassCard({
+  children,
+  className = "",
+  hover = true,
+  padding = "md"
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `sk-glass-card ${hover ? "sk-glass-card--hover" : ""} ${className}`,
+      style: {
+        padding: paddingMap[padding],
+        background: "var(--sk-surface, rgba(255,255,255,0.05))",
+        backdropFilter: "blur(16px)",
+        WebkitBackdropFilter: "blur(16px)",
+        border: "1px solid var(--sk-border, rgba(255,255,255,0.1))",
+        borderRadius: "16px",
+        boxShadow: "0 4px 16px -4px rgba(0,0,0,0.1), 0 0 0 1px var(--sk-border, rgba(255,255,255,0.1))"
+      },
+      children: [
+        /* @__PURE__ */ jsx("style", { href: "sk-glass-card", precedence: "default", children: HOVER_CSS }),
+        children
+      ]
+    }
+  );
+}
+
+export { GlassCard as default };
+//# sourceMappingURL=GlassCard.js.map
+//# sourceMappingURL=GlassCard.js.map

package/dist/portfolio/primitives/GlassCard.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/primitives/GlassCard.tsx"],"names":[],"mappings":";;;AAeA,IAAM,UAAA,GAAa;AAAA,EACjB,EAAA,EAAI,MAAA;AAAA,EACJ,EAAA,EAAI,MAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEA,IAAM,SAAA,GAAY;AAAA;AAAA;AAAA;AAAA,CAAA;AAMH,SAAR,SAAA,CAA2B;AAAA,EAChC,QAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,KAAA,GAAQ,IAAA;AAAA,EACR,OAAA,GAAU;AACZ,CAAA,EAAmB;AACjB,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAW,CAAA,cAAA,EAAiB,KAAA,GAAQ,sBAAA,GAAyB,EAAE,IAAI,SAAS,CAAA,CAAA;AAAA,MAC5E,KAAA,EAAO;AAAA,QACL,OAAA,EAAS,WAAW,OAAO,CAAA;AAAA,QAC3B,UAAA,EAAY,2CAAA;AAAA,QACZ,cAAA,EAAgB,YAAA;AAAA,QAChB,oBAAA,EAAsB,YAAA;AAAA,QACtB,MAAA,EAAQ,mDAAA;AAAA,QACR,YAAA,EAAc,MAAA;AAAA,QACd,SAAA,EAAW;AAAA,OACb;AAAA,MAIA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,OAAA,EAAA,EAAM,IAAA,EAAK,eAAA,EAAgB,UAAA,EAAW,WACpC,QAAA,EAAA,SAAA,EACH,CAAA;AAAA,QACC;AAAA;AAAA;AAAA,GACH;AAEJ","file":"GlassCard.js","sourcesContent":["// Shared component — NO 'use client' directive on purpose: GlassCard has no\n// hooks, handlers, or browser APIs, so it renders in BOTH graphs. Server\n// sections use it server-side (zero JS); client sections pull it into their\n// graph. The hover lift is pure CSS. Keep it dependency-free — adding a hook\n// here would force every server section that uses it back to the client.\n\nimport React from 'react';\n\ninterface GlassCardProps {\n  children: React.ReactNode;\n  className?: string;\n  hover?: boolean;\n  padding?: 'sm' | 'md' | 'lg';\n}\n\nconst paddingMap = {\n  sm: '16px',\n  md: '24px',\n  lg: '32px',\n} as const;\n\nconst HOVER_CSS = `\n.sk-glass-card{transition:transform .3s cubic-bezier(.25,.46,.45,.94),box-shadow .3s cubic-bezier(.25,.46,.45,.94)}\n.sk-glass-card--hover:hover{transform:translateY(-6px) scale(1.015);box-shadow:0 20px 40px -12px rgba(0,0,0,.25),0 0 0 1px var(--sk-primary,#6366f1)}\n@media (prefers-reduced-motion:reduce){.sk-glass-card{transition:none}.sk-glass-card--hover:hover{transform:none}}\n`;\n\nexport default function GlassCard({\n  children,\n  className = '',\n  hover = true,\n  padding = 'md',\n}: GlassCardProps) {\n  return (\n    <div\n      className={`sk-glass-card ${hover ? 'sk-glass-card--hover' : ''} ${className}`}\n      style={{\n        padding: paddingMap[padding],\n        background: 'var(--sk-surface, rgba(255,255,255,0.05))',\n        backdropFilter: 'blur(16px)',\n        WebkitBackdropFilter: 'blur(16px)',\n        border: '1px solid var(--sk-border, rgba(255,255,255,0.1))',\n        borderRadius: '16px',\n        boxShadow: '0 4px 16px -4px rgba(0,0,0,0.1), 0 0 0 1px var(--sk-border, rgba(255,255,255,0.1))',\n      }}\n    >\n      {/* React 19 hoists + dedupes via href/precedence; React 18 renders it\n          inline per card (harmless duplication). */}\n      <style href=\"sk-glass-card\" precedence=\"default\">\n        {HOVER_CSS}\n      </style>\n      {children}\n    </div>\n  );\n}\n"]}

package/dist/portfolio/primitives/MetricBadge.cjs

@@ -0,0 +1,74 @@
+'use client';
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/portfolio/components/primitives/MetricBadge.tsx
+var MetricBadge_exports = {};
+__export(MetricBadge_exports, {
+  default: () => MetricBadge
+});
+module.exports = __toCommonJS(MetricBadge_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+function MetricBadge({ source, className = "" }) {
+  const isMeasured = source === "measured";
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "span",
+    {
+      className,
+      style: {
+        display: "inline-flex",
+        alignItems: "center",
+        gap: "5px",
+        padding: "3px 10px",
+        borderRadius: "9999px",
+        fontSize: "12px",
+        fontWeight: 600,
+        lineHeight: "1.4",
+        background: isMeasured ? "rgba(34,197,94,0.1)" : "rgba(245,158,11,0.1)",
+        color: isMeasured ? "#22c55e" : "#f59e0b",
+        border: `1px solid ${isMeasured ? "rgba(34,197,94,0.2)" : "rgba(245,158,11,0.2)"}`
+      },
+      children: [
+        isMeasured ? (
+          // Check icon
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "path",
+            {
+              d: "M10 3L4.5 8.5L2 6",
+              stroke: "currentColor",
+              strokeWidth: "1.5",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          ) })
+        ) : (
+          // Info icon
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "6", cy: "6", r: "4.5", stroke: "currentColor", strokeWidth: "1" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M6 5.5V8", stroke: "currentColor", strokeWidth: "1", strokeLinecap: "round" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "6", cy: "4", r: "0.5", fill: "currentColor" })
+          ] })
+        ),
+        isMeasured ? "Verified" : "Estimated"
+      ]
+    }
+  );
+}
+//# sourceMappingURL=MetricBadge.cjs.map

package/dist/portfolio/primitives/MetricBadge.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/primitives/MetricBadge.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\n\ninterface MetricBadgeProps {\n  source: 'measured' | 'estimated';\n  className?: string;\n}\n\nexport default function MetricBadge({ source, className = '' }: MetricBadgeProps) {\n  const isMeasured = source === 'measured';\n\n  return (\n    <span\n      className={className}\n      style={{\n        display: 'inline-flex',\n        alignItems: 'center',\n        gap: '5px',\n        padding: '3px 10px',\n        borderRadius: '9999px',\n        fontSize: '12px',\n        fontWeight: 600,\n        lineHeight: '1.4',\n        background: isMeasured ? 'rgba(34,197,94,0.1)' : 'rgba(245,158,11,0.1)',\n        color: isMeasured ? '#22c55e' : '#f59e0b',\n        border: `1px solid ${isMeasured ? 'rgba(34,197,94,0.2)' : 'rgba(245,158,11,0.2)'}`,\n      }}\n    >\n      {isMeasured ? (\n        // Check icon\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\n          <path\n            d=\"M10 3L4.5 8.5L2 6\"\n            stroke=\"currentColor\"\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n      ) : (\n        // Info icon\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\n          <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"currentColor\" strokeWidth=\"1\" />\n          <path d=\"M6 5.5V8\" stroke=\"currentColor\" strokeWidth=\"1\" strokeLinecap=\"round\" />\n          <circle cx=\"6\" cy=\"4\" r=\"0.5\" fill=\"currentColor\" />\n        </svg>\n      )}\n      {isMeasured ? 'Verified' : 'Estimated'}\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgCU;AAvBK,SAAR,YAA6B,EAAE,QAAQ,YAAY,GAAG,GAAqB;AAChF,QAAM,aAAa,WAAW;AAE9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO;AAAA,QACL,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,KAAK;AAAA,QACL,SAAS;AAAA,QACT,cAAc;AAAA,QACd,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,YAAY;AAAA,QACZ,YAAY,aAAa,wBAAwB;AAAA,QACjD,OAAO,aAAa,YAAY;AAAA,QAChC,QAAQ,aAAa,aAAa,wBAAwB,sBAAsB;AAAA,MAClF;AAAA,MAEC;AAAA;AAAA;AAAA,UAEC,4CAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QACnD;AAAA,YAAC;AAAA;AAAA,cACC,GAAE;AAAA,cACF,QAAO;AAAA,cACP,aAAY;AAAA,cACZ,eAAc;AAAA,cACd,gBAAe;AAAA;AAAA,UACjB,GACF;AAAA;AAAA;AAAA,UAGA,6CAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QACnD;AAAA,wDAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,OAAM,QAAO,gBAAe,aAAY,KAAI;AAAA,YACpE,4CAAC,UAAK,GAAE,YAAW,QAAO,gBAAe,aAAY,KAAI,eAAc,SAAQ;AAAA,YAC/E,4CAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,OAAM,MAAK,gBAAe;AAAA,aACpD;AAAA;AAAA,QAED,aAAa,aAAa;AAAA;AAAA;AAAA,EAC7B;AAEJ;","names":[]}

package/dist/portfolio/primitives/MetricBadge.d.cts

@@ -0,0 +1,9 @@
+import React from 'react';
+
+interface MetricBadgeProps {
+    source: 'measured' | 'estimated';
+    className?: string;
+}
+declare function MetricBadge({ source, className }: MetricBadgeProps): React.JSX.Element;
+
+export { MetricBadge as default };

package/dist/portfolio/primitives/MetricBadge.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+
+interface MetricBadgeProps {
+    source: 'measured' | 'estimated';
+    className?: string;
+}
+declare function MetricBadge({ source, className }: MetricBadgeProps): React.JSX.Element;
+
+export { MetricBadge as default };

package/dist/portfolio/primitives/MetricBadge.js

@@ -0,0 +1,54 @@
+'use client';
+"use client";
+
+// src/portfolio/components/primitives/MetricBadge.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function MetricBadge({ source, className = "" }) {
+  const isMeasured = source === "measured";
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className,
+      style: {
+        display: "inline-flex",
+        alignItems: "center",
+        gap: "5px",
+        padding: "3px 10px",
+        borderRadius: "9999px",
+        fontSize: "12px",
+        fontWeight: 600,
+        lineHeight: "1.4",
+        background: isMeasured ? "rgba(34,197,94,0.1)" : "rgba(245,158,11,0.1)",
+        color: isMeasured ? "#22c55e" : "#f59e0b",
+        border: `1px solid ${isMeasured ? "rgba(34,197,94,0.2)" : "rgba(245,158,11,0.2)"}`
+      },
+      children: [
+        isMeasured ? (
+          // Check icon
+          /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: "M10 3L4.5 8.5L2 6",
+              stroke: "currentColor",
+              strokeWidth: "1.5",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          ) })
+        ) : (
+          // Info icon
+          /* @__PURE__ */ jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: [
+            /* @__PURE__ */ jsx("circle", { cx: "6", cy: "6", r: "4.5", stroke: "currentColor", strokeWidth: "1" }),
+            /* @__PURE__ */ jsx("path", { d: "M6 5.5V8", stroke: "currentColor", strokeWidth: "1", strokeLinecap: "round" }),
+            /* @__PURE__ */ jsx("circle", { cx: "6", cy: "4", r: "0.5", fill: "currentColor" })
+          ] })
+        ),
+        isMeasured ? "Verified" : "Estimated"
+      ]
+    }
+  );
+}
+export {
+  MetricBadge as default
+};
+//# sourceMappingURL=MetricBadge.js.map

package/dist/portfolio/primitives/MetricBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/primitives/MetricBadge.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\n\ninterface MetricBadgeProps {\n  source: 'measured' | 'estimated';\n  className?: string;\n}\n\nexport default function MetricBadge({ source, className = '' }: MetricBadgeProps) {\n  const isMeasured = source === 'measured';\n\n  return (\n    <span\n      className={className}\n      style={{\n        display: 'inline-flex',\n        alignItems: 'center',\n        gap: '5px',\n        padding: '3px 10px',\n        borderRadius: '9999px',\n        fontSize: '12px',\n        fontWeight: 600,\n        lineHeight: '1.4',\n        background: isMeasured ? 'rgba(34,197,94,0.1)' : 'rgba(245,158,11,0.1)',\n        color: isMeasured ? '#22c55e' : '#f59e0b',\n        border: `1px solid ${isMeasured ? 'rgba(34,197,94,0.2)' : 'rgba(245,158,11,0.2)'}`,\n      }}\n    >\n      {isMeasured ? (\n        // Check icon\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\n          <path\n            d=\"M10 3L4.5 8.5L2 6\"\n            stroke=\"currentColor\"\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n      ) : (\n        // Info icon\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\n          <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"currentColor\" strokeWidth=\"1\" />\n          <path d=\"M6 5.5V8\" stroke=\"currentColor\" strokeWidth=\"1\" strokeLinecap=\"round\" />\n          <circle cx=\"6\" cy=\"4\" r=\"0.5\" fill=\"currentColor\" />\n        </svg>\n      )}\n      {isMeasured ? 'Verified' : 'Estimated'}\n    </span>\n  );\n}\n"],"mappings":";;;;AAgCU,cAUF,YAVE;AAvBK,SAAR,YAA6B,EAAE,QAAQ,YAAY,GAAG,GAAqB;AAChF,QAAM,aAAa,WAAW;AAE9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO;AAAA,QACL,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,KAAK;AAAA,QACL,SAAS;AAAA,QACT,cAAc;AAAA,QACd,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,YAAY;AAAA,QACZ,YAAY,aAAa,wBAAwB;AAAA,QACjD,OAAO,aAAa,YAAY;AAAA,QAChC,QAAQ,aAAa,aAAa,wBAAwB,sBAAsB;AAAA,MAClF;AAAA,MAEC;AAAA;AAAA;AAAA,UAEC,oBAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QACnD;AAAA,YAAC;AAAA;AAAA,cACC,GAAE;AAAA,cACF,QAAO;AAAA,cACP,aAAY;AAAA,cACZ,eAAc;AAAA,cACd,gBAAe;AAAA;AAAA,UACjB,GACF;AAAA;AAAA;AAAA,UAGA,qBAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QACnD;AAAA,gCAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,OAAM,QAAO,gBAAe,aAAY,KAAI;AAAA,YACpE,oBAAC,UAAK,GAAE,YAAW,QAAO,gBAAe,aAAY,KAAI,eAAc,SAAQ;AAAA,YAC/E,oBAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,OAAM,MAAK,gBAAe;AAAA,aACpD;AAAA;AAAA,QAED,aAAa,aAAa;AAAA;AAAA;AAAA,EAC7B;AAEJ;","names":[]}

package/dist/portfolio/primitives/SVGChart.cjs

@@ -0,0 +1,316 @@
+'use client';
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/portfolio/components/primitives/SVGChart.tsx
+var SVGChart_exports = {};
+__export(SVGChart_exports, {
+  default: () => SVGChart
+});
+module.exports = __toCommonJS(SVGChart_exports);
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var EASE_IN_OUT = "cubic-bezier(0.455, 0.03, 0.515, 0.955)";
+var EASE_BACK = "cubic-bezier(0.34, 1.56, 0.64, 1)";
+function buildPath(points, close, plotHeight, plotBottom) {
+  if (points.length < 2) return "";
+  let d = `M ${points[0].x} ${points[0].y}`;
+  for (let i = 0; i < points.length - 1; i++) {
+    const p0 = points[Math.max(i - 1, 0)];
+    const p1 = points[i];
+    const p2 = points[i + 1];
+    const p3 = points[Math.min(i + 2, points.length - 1)];
+    const cp1x = p1.x + (p2.x - p0.x) / 6;
+    const cp1y = p1.y + (p2.y - p0.y) / 6;
+    const cp2x = p2.x - (p3.x - p1.x) / 6;
+    const cp2y = p2.y - (p3.y - p1.y) / 6;
+    d += ` C ${cp1x} ${cp1y}, ${cp2x} ${cp2y}, ${p2.x} ${p2.y}`;
+  }
+  if (close) {
+    const lastX = points[points.length - 1].x;
+    const firstX = points[0].x;
+    d += ` L ${lastX} ${plotBottom} L ${firstX} ${plotBottom} Z`;
+  }
+  return d;
+}
+function SVGChart({
+  dataPoints,
+  width: propWidth,
+  height: propHeight,
+  className = "",
+  color = "var(--sk-primary, #6366f1)",
+  showArea = true,
+  animateOnScroll = true
+}) {
+  const containerRef = (0, import_react.useRef)(null);
+  const pathRef = (0, import_react.useRef)(null);
+  const areaRef = (0, import_react.useRef)(null);
+  const dotsRef = (0, import_react.useRef)(null);
+  const [dimensions, setDimensions] = (0, import_react.useState)({ width: propWidth || 600, height: propHeight || 300 });
+  const [tooltip, setTooltip] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    if (propWidth && propHeight) return;
+    const container = containerRef.current;
+    if (!container) return;
+    const update = () => {
+      const rect = container.getBoundingClientRect();
+      setDimensions({
+        width: propWidth || Math.round(rect.width),
+        height: propHeight || Math.round(rect.width * 0.5)
+      });
+    };
+    update();
+    const ro = new ResizeObserver(update);
+    ro.observe(container);
+    return () => ro.disconnect();
+  }, [propWidth, propHeight]);
+  const { width, height } = dimensions;
+  const padding = { top: 20, right: 20, bottom: 40, left: 50 };
+  const plotWidth = width - padding.left - padding.right;
+  const plotHeight = height - padding.top - padding.bottom;
+  const { points, yMin, yMax, yGridLines } = (0, import_react.useMemo)(() => {
+    if (dataPoints.length === 0) return { points: [], yMin: 0, yMax: 100, yGridLines: [] };
+    const values = dataPoints.map((d) => d.value);
+    const rawMin = Math.min(...values);
+    const rawMax = Math.max(...values);
+    const range = rawMax - rawMin || 1;
+    const yMin2 = rawMin - range * 0.1;
+    const yMax2 = rawMax + range * 0.1;
+    const pts = dataPoints.map((d, i) => ({
+      x: padding.left + i / (dataPoints.length - 1) * plotWidth,
+      y: padding.top + plotHeight - (d.value - yMin2) / (yMax2 - yMin2) * plotHeight
+    }));
+    const gridCount = 5;
+    const yGridLines2 = Array.from({ length: gridCount }, (_, i) => {
+      const val = yMin2 + (yMax2 - yMin2) / (gridCount - 1) * i;
+      const y = padding.top + plotHeight - (val - yMin2) / (yMax2 - yMin2) * plotHeight;
+      return { val, y };
+    });
+    return { points: pts, yMin: yMin2, yMax: yMax2, yGridLines: yGridLines2 };
+  }, [dataPoints, plotWidth, plotHeight, padding.left, padding.top]);
+  const linePath = (0, import_react.useMemo)(
+    () => buildPath(points, false, plotHeight, padding.top + plotHeight),
+    [points, plotHeight, padding.top]
+  );
+  const areaPath = (0, import_react.useMemo)(
+    () => buildPath(points, true, plotHeight, padding.top + plotHeight),
+    [points, plotHeight, padding.top]
+  );
+  (0, import_react.useEffect)(() => {
+    const container = containerRef.current;
+    const path = pathRef.current;
+    const area = areaRef.current;
+    const dotsGroup = dotsRef.current;
+    if (!container || !path) return;
+    const dots = dotsGroup ? Array.from(dotsGroup.children) : [];
+    const showFinal = () => {
+      path.style.strokeDashoffset = "0";
+      if (area) area.style.opacity = "1";
+      for (const dot of dots) {
+        dot.style.transform = "scale(1)";
+        dot.style.opacity = "1";
+      }
+    };
+    const prefersReducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+    if (prefersReducedMotion || !animateOnScroll) {
+      showFinal();
+      return;
+    }
+    const rect = container.getBoundingClientRect();
+    if (rect.top < window.innerHeight && rect.bottom > 0) {
+      showFinal();
+      return;
+    }
+    const pathLength = path.getTotalLength();
+    path.style.strokeDasharray = `${pathLength}`;
+    path.style.strokeDashoffset = `${pathLength}`;
+    if (area) area.style.opacity = "0";
+    for (const dot of dots) {
+      dot.style.transformBox = "fill-box";
+      dot.style.transformOrigin = "center";
+      dot.style.transform = "scale(0)";
+      dot.style.opacity = "0";
+    }
+    const io = new IntersectionObserver(
+      ([entry]) => {
+        if (!entry.isIntersecting) return;
+        path.style.transition = `stroke-dashoffset 1.2s ${EASE_IN_OUT}`;
+        path.style.strokeDashoffset = "0";
+        if (area) {
+          area.style.transition = "opacity 0.6s ease-in 0.6s";
+          area.style.opacity = "1";
+        }
+        dots.forEach((dot, i) => {
+          const dotDelay = 0.8 + i * 0.06;
+          dot.style.transition = `transform 0.3s ${EASE_BACK} ${dotDelay}s, opacity 0.3s ${EASE_BACK} ${dotDelay}s`;
+          dot.style.transform = "scale(1)";
+          dot.style.opacity = "1";
+        });
+        io.disconnect();
+      },
+      { rootMargin: "0px 0px -20% 0px" }
+      // ≈ 'top 80%' trigger start
+    );
+    io.observe(container);
+    return () => {
+      io.disconnect();
+      path.style.strokeDasharray = "";
+      path.style.strokeDashoffset = "";
+      path.style.transition = "";
+      if (area) {
+        area.style.transition = "";
+        area.style.opacity = "";
+      }
+      for (const dot of dots) {
+        dot.style.transformBox = "";
+        dot.style.transformOrigin = "";
+        dot.style.transition = "";
+        dot.style.transform = "";
+        dot.style.opacity = "";
+      }
+    };
+  }, [linePath, animateOnScroll]);
+  const handleDotEnter = (0, import_react.useCallback)(
+    (i) => {
+      setTooltip({
+        x: points[i].x,
+        y: points[i].y,
+        value: dataPoints[i].value,
+        label: dataPoints[i].label
+      });
+    },
+    [points, dataPoints]
+  );
+  const handleDotLeave = (0, import_react.useCallback)(() => setTooltip(null), []);
+  const gradientId = `area-gradient-${Math.random().toString(36).slice(2, 8)}`;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: containerRef, className, style: { width: propWidth || "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { width, height, viewBox: `0 0 ${width} ${height}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("linearGradient", { id: gradientId, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "0%", stopColor: color, stopOpacity: 0.15 }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "100%", stopColor: color, stopOpacity: 0 })
+    ] }) }),
+    yGridLines.map((line, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "line",
+        {
+          x1: padding.left,
+          y1: line.y,
+          x2: width - padding.right,
+          y2: line.y,
+          stroke: "rgba(255,255,255,0.08)",
+          strokeWidth: 1
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "text",
+        {
+          x: padding.left - 8,
+          y: line.y + 4,
+          textAnchor: "end",
+          fill: "rgba(255,255,255,0.4)",
+          fontSize: 11,
+          children: Math.round(line.val)
+        }
+      )
+    ] }, i)),
+    dataPoints.map((d, i) => {
+      const x = padding.left + i / (dataPoints.length - 1) * plotWidth;
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "text",
+        {
+          x,
+          y: height - 8,
+          textAnchor: "middle",
+          fill: "rgba(255,255,255,0.4)",
+          fontSize: 11,
+          children: d.label
+        },
+        i
+      );
+    }),
+    showArea && areaPath && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "path",
+      {
+        ref: areaRef,
+        d: areaPath,
+        fill: `url(#${gradientId})`,
+        opacity: 0
+      }
+    ),
+    linePath && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "path",
+      {
+        ref: pathRef,
+        d: linePath,
+        fill: "none",
+        stroke: color,
+        strokeWidth: 2.5,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("g", { ref: dotsRef, children: points.map((pt, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "circle",
+      {
+        cx: pt.x,
+        cy: pt.y,
+        r: 5,
+        fill: color,
+        stroke: "white",
+        strokeWidth: 2,
+        style: { cursor: "pointer", opacity: 0 },
+        onMouseEnter: () => handleDotEnter(i),
+        onMouseLeave: handleDotLeave
+      },
+      i
+    )) }),
+    tooltip && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "rect",
+        {
+          x: tooltip.x - 40,
+          y: tooltip.y - 42,
+          width: 80,
+          height: 28,
+          rx: 6,
+          fill: "rgba(0,0,0,0.85)",
+          stroke: "rgba(255,255,255,0.15)",
+          strokeWidth: 1
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "text",
+        {
+          x: tooltip.x,
+          y: tooltip.y - 24,
+          textAnchor: "middle",
+          fill: "white",
+          fontSize: 12,
+          fontWeight: 600,
+          children: [
+            tooltip.label,
+            ": ",
+            tooltip.value
+          ]
+        }
+      )
+    ] })
+  ] }) });
+}
+//# sourceMappingURL=SVGChart.cjs.map

package/dist/portfolio/primitives/SVGChart.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/primitives/SVGChart.tsx"],"sourcesContent":["'use client';\n\nimport React, { useRef, useEffect, useState, useMemo, useCallback } from 'react';\n\ninterface DataPoint {\n  label: string;\n  value: number;\n}\n\ninterface SVGChartProps {\n  dataPoints: DataPoint[];\n  width?: number;\n  height?: number;\n  className?: string;\n  color?: string;\n  showArea?: boolean;\n  animateOnScroll?: boolean;\n}\n\nconst EASE_IN_OUT = 'cubic-bezier(0.455, 0.03, 0.515, 0.955)'; // ≈ power2.inOut\nconst EASE_BACK = 'cubic-bezier(0.34, 1.56, 0.64, 1)'; // ≈ back.out(2) — overshoot pop\n\n// Build a smooth bezier path through data points\nfunction buildPath(\n  points: Array<{ x: number; y: number }>,\n  close: boolean,\n  plotHeight: number,\n  plotBottom: number,\n): string {\n  if (points.length < 2) return '';\n\n  let d = `M ${points[0].x} ${points[0].y}`;\n\n  for (let i = 0; i < points.length - 1; i++) {\n    const p0 = points[Math.max(i - 1, 0)];\n    const p1 = points[i];\n    const p2 = points[i + 1];\n    const p3 = points[Math.min(i + 2, points.length - 1)];\n\n    const cp1x = p1.x + (p2.x - p0.x) / 6;\n    const cp1y = p1.y + (p2.y - p0.y) / 6;\n    const cp2x = p2.x - (p3.x - p1.x) / 6;\n    const cp2y = p2.y - (p3.y - p1.y) / 6;\n\n    d += ` C ${cp1x} ${cp1y}, ${cp2x} ${cp2y}, ${p2.x} ${p2.y}`;\n  }\n\n  if (close) {\n    const lastX = points[points.length - 1].x;\n    const firstX = points[0].x;\n    d += ` L ${lastX} ${plotBottom} L ${firstX} ${plotBottom} Z`;\n  }\n\n  return d;\n}\n\nexport default function SVGChart({\n  dataPoints,\n  width: propWidth,\n  height: propHeight,\n  className = '',\n  color = 'var(--sk-primary, #6366f1)',\n  showArea = true,\n  animateOnScroll = true,\n}: SVGChartProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const pathRef = useRef<SVGPathElement>(null);\n  const areaRef = useRef<SVGPathElement>(null);\n  const dotsRef = useRef<SVGGElement>(null);\n  const [dimensions, setDimensions] = useState({ width: propWidth || 600, height: propHeight || 300 });\n  const [tooltip, setTooltip] = useState<{ x: number; y: number; value: number; label: string } | null>(null);\n\n  // Responsive resize\n  useEffect(() => {\n    if (propWidth && propHeight) return; // Fixed dimensions\n\n    const container = containerRef.current;\n    if (!container) return;\n\n    const update = () => {\n      const rect = container.getBoundingClientRect();\n      setDimensions({\n        width: propWidth || Math.round(rect.width),\n        height: propHeight || Math.round(rect.width * 0.5),\n      });\n    };\n\n    update();\n    const ro = new ResizeObserver(update);\n    ro.observe(container);\n    return () => ro.disconnect();\n  }, [propWidth, propHeight]);\n\n  const { width, height } = dimensions;\n  const padding = { top: 20, right: 20, bottom: 40, left: 50 };\n  const plotWidth = width - padding.left - padding.right;\n  const plotHeight = height - padding.top - padding.bottom;\n\n  // Compute plotted points and grid\n  const { points, yMin, yMax, yGridLines } = useMemo(() => {\n    if (dataPoints.length === 0) return { points: [], yMin: 0, yMax: 100, yGridLines: [] };\n\n    const values = dataPoints.map((d) => d.value);\n    const rawMin = Math.min(...values);\n    const rawMax = Math.max(...values);\n    const range = rawMax - rawMin || 1;\n    const yMin = rawMin - range * 0.1;\n    const yMax = rawMax + range * 0.1;\n\n    const pts = dataPoints.map((d, i) => ({\n      x: padding.left + (i / (dataPoints.length - 1)) * plotWidth,\n      y: padding.top + plotHeight - ((d.value - yMin) / (yMax - yMin)) * plotHeight,\n    }));\n\n    // Y-axis grid lines (5 lines)\n    const gridCount = 5;\n    const yGridLines = Array.from({ length: gridCount }, (_, i) => {\n      const val = yMin + ((yMax - yMin) / (gridCount - 1)) * i;\n      const y = padding.top + plotHeight - ((val - yMin) / (yMax - yMin)) * plotHeight;\n      return { val, y };\n    });\n\n    return { points: pts, yMin, yMax, yGridLines };\n  }, [dataPoints, plotWidth, plotHeight, padding.left, padding.top]);\n\n  const linePath = useMemo(\n    () => buildPath(points, false, plotHeight, padding.top + plotHeight),\n    [points, plotHeight, padding.top],\n  );\n  const areaPath = useMemo(\n    () => buildPath(points, true, plotHeight, padding.top + plotHeight),\n    [points, plotHeight, padding.top],\n  );\n\n  // Scroll-triggered draw — IntersectionObserver + CSS transitions. The line\n  // retracts via stroke-dashoffset, the area fades in behind it, then the\n  // dots pop with a staggered overshoot (same 1.2s / 0.6s / 0.3s timeline).\n  useEffect(() => {\n    const container = containerRef.current;\n    const path = pathRef.current;\n    const area = areaRef.current;\n    const dotsGroup = dotsRef.current;\n    if (!container || !path) return;\n\n    const dots = dotsGroup ? (Array.from(dotsGroup.children) as SVGElement[]) : [];\n\n    // Final drawn state — the markup ships the area and dots transparent, so\n    // this is what reduced motion, animateOnScroll={false}, and charts already\n    // in the viewport at hydration get immediately (never re-hide, house LCP rule).\n    const showFinal = () => {\n      path.style.strokeDashoffset = '0';\n      if (area) area.style.opacity = '1';\n      for (const dot of dots) {\n        dot.style.transform = 'scale(1)';\n        dot.style.opacity = '1';\n      }\n    };\n\n    const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    if (prefersReducedMotion || !animateOnScroll) {\n      showFinal();\n      return;\n    }\n\n    const rect = container.getBoundingClientRect();\n    if (rect.top < window.innerHeight && rect.bottom > 0) {\n      showFinal();\n      return;\n    }\n\n    // Hidden state: line fully retracted, dots collapsed onto their points.\n    const pathLength = path.getTotalLength();\n    path.style.strokeDasharray = `${pathLength}`;\n    path.style.strokeDashoffset = `${pathLength}`;\n    if (area) area.style.opacity = '0';\n    for (const dot of dots) {\n      // fill-box makes scale() pop each dot from its own center.\n      dot.style.transformBox = 'fill-box';\n      dot.style.transformOrigin = 'center';\n      dot.style.transform = 'scale(0)';\n      dot.style.opacity = '0';\n    }\n\n    const io = new IntersectionObserver(\n      ([entry]) => {\n        if (!entry.isIntersecting) return;\n        path.style.transition = `stroke-dashoffset 1.2s ${EASE_IN_OUT}`;\n        path.style.strokeDashoffset = '0';\n        if (area) {\n          area.style.transition = 'opacity 0.6s ease-in 0.6s'; // ≈ power1.in\n          area.style.opacity = '1';\n        }\n        dots.forEach((dot, i) => {\n          const dotDelay = 0.8 + i * 0.06;\n          dot.style.transition = `transform 0.3s ${EASE_BACK} ${dotDelay}s, opacity 0.3s ${EASE_BACK} ${dotDelay}s`;\n          dot.style.transform = 'scale(1)';\n          dot.style.opacity = '1';\n        });\n        io.disconnect();\n      },\n      { rootMargin: '0px 0px -20% 0px' }, // ≈ 'top 80%' trigger start\n    );\n    io.observe(container);\n\n    return () => {\n      io.disconnect();\n      path.style.strokeDasharray = '';\n      path.style.strokeDashoffset = '';\n      path.style.transition = '';\n      if (area) {\n        area.style.transition = '';\n        area.style.opacity = '';\n      }\n      for (const dot of dots) {\n        dot.style.transformBox = '';\n        dot.style.transformOrigin = '';\n        dot.style.transition = '';\n        dot.style.transform = '';\n        dot.style.opacity = '';\n      }\n    };\n  }, [linePath, animateOnScroll]);\n\n  const handleDotEnter = useCallback(\n    (i: number) => {\n      setTooltip({\n        x: points[i].x,\n        y: points[i].y,\n        value: dataPoints[i].value,\n        label: dataPoints[i].label,\n      });\n    },\n    [points, dataPoints],\n  );\n\n  const handleDotLeave = useCallback(() => setTooltip(null), []);\n\n  const gradientId = `area-gradient-${Math.random().toString(36).slice(2, 8)}`;\n\n  return (\n    <div ref={containerRef} className={className} style={{ width: propWidth || '100%' }}>\n      <svg width={width} height={height} viewBox={`0 0 ${width} ${height}`}>\n        <defs>\n          <linearGradient id={gradientId} x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n            <stop offset=\"0%\" stopColor={color} stopOpacity={0.15} />\n            <stop offset=\"100%\" stopColor={color} stopOpacity={0} />\n          </linearGradient>\n        </defs>\n\n        {/* Y-axis grid lines */}\n        {yGridLines.map((line, i) => (\n          <g key={i}>\n            <line\n              x1={padding.left}\n              y1={line.y}\n              x2={width - padding.right}\n              y2={line.y}\n              stroke=\"rgba(255,255,255,0.08)\"\n              strokeWidth={1}\n            />\n            <text\n              x={padding.left - 8}\n              y={line.y + 4}\n              textAnchor=\"end\"\n              fill=\"rgba(255,255,255,0.4)\"\n              fontSize={11}\n            >\n              {Math.round(line.val)}\n            </text>\n          </g>\n        ))}\n\n        {/* X-axis labels */}\n        {dataPoints.map((d, i) => {\n          const x = padding.left + (i / (dataPoints.length - 1)) * plotWidth;\n          return (\n            <text\n              key={i}\n              x={x}\n              y={height - 8}\n              textAnchor=\"middle\"\n              fill=\"rgba(255,255,255,0.4)\"\n              fontSize={11}\n            >\n              {d.label}\n            </text>\n          );\n        })}\n\n        {/* Area fill */}\n        {showArea && areaPath && (\n          <path\n            ref={areaRef}\n            d={areaPath}\n            fill={`url(#${gradientId})`}\n            opacity={0}\n          />\n        )}\n\n        {/* Line path */}\n        {linePath && (\n          <path\n            ref={pathRef}\n            d={linePath}\n            fill=\"none\"\n            stroke={color}\n            strokeWidth={2.5}\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        )}\n\n        {/* Data point dots */}\n        <g ref={dotsRef}>\n          {points.map((pt, i) => (\n            <circle\n              key={i}\n              cx={pt.x}\n              cy={pt.y}\n              r={5}\n              fill={color}\n              stroke=\"white\"\n              strokeWidth={2}\n              style={{ cursor: 'pointer', opacity: 0 }}\n              onMouseEnter={() => handleDotEnter(i)}\n              onMouseLeave={handleDotLeave}\n            />\n          ))}\n        </g>\n\n        {/* Tooltip */}\n        {tooltip && (\n          <g>\n            <rect\n              x={tooltip.x - 40}\n              y={tooltip.y - 42}\n              width={80}\n              height={28}\n              rx={6}\n              fill=\"rgba(0,0,0,0.85)\"\n              stroke=\"rgba(255,255,255,0.15)\"\n              strokeWidth={1}\n            />\n            <text\n              x={tooltip.x}\n              y={tooltip.y - 24}\n              textAnchor=\"middle\"\n              fill=\"white\"\n              fontSize={12}\n              fontWeight={600}\n            >\n              {tooltip.label}: {tooltip.value}\n            </text>\n          </g>\n        )}\n      </svg>\n    </div>\n  );\n}\n"],"mappings":"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","names":["yMin","yMax","yGridLines"]}

package/dist/portfolio/primitives/SVGChart.d.cts

@@ -0,0 +1,18 @@
+import React from 'react';
+
+interface DataPoint {
+    label: string;
+    value: number;
+}
+interface SVGChartProps {
+    dataPoints: DataPoint[];
+    width?: number;
+    height?: number;
+    className?: string;
+    color?: string;
+    showArea?: boolean;
+    animateOnScroll?: boolean;
+}
+declare function SVGChart({ dataPoints, width: propWidth, height: propHeight, className, color, showArea, animateOnScroll, }: SVGChartProps): React.JSX.Element;
+
+export { SVGChart as default };

package/dist/portfolio/primitives/SVGChart.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+
+interface DataPoint {
+    label: string;
+    value: number;
+}
+interface SVGChartProps {
+    dataPoints: DataPoint[];
+    width?: number;
+    height?: number;
+    className?: string;
+    color?: string;
+    showArea?: boolean;
+    animateOnScroll?: boolean;
+}
+declare function SVGChart({ dataPoints, width: propWidth, height: propHeight, className, color, showArea, animateOnScroll, }: SVGChartProps): React.JSX.Element;
+
+export { SVGChart as default };