@sonordev/agency-site-kit 0.3.1 → 0.4.1

package/dist/portfolio/sections/DesignSystemSection.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/sections/DesignSystemSection.tsx"],"names":["jsx","jsxs","ScrollReveal","GlassCard"],"mappings":"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","file":"DesignSystemSection.cjs","sourcesContent":["// Server component — renders on the server; the client primitives below cross the\n// RSC boundary via package subpaths (never import them relatively here).\nimport React from 'react';\nimport ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';\nimport GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';\n\ninterface ColorEntry {\n  hex: string;\n  usageCount?: number;\n  context?: string;\n}\n\ninterface FontEntry {\n  family: string;\n  weights?: number[];\n  usage?: string; // 'heading' | 'body' | 'accent'\n}\n\nexport interface DesignSystemData {\n  colors: ColorEntry[];\n  fonts: FontEntry[];\n  headingStyles?: { font?: string; size?: string; weight?: string | number };\n  bodyStyles?: { font?: string; size?: string; lineHeight?: string };\n}\n\ninterface DesignSystemSectionProps {\n  data: DesignSystemData;\n}\n\n/** Determine if a hex color is light (needs dark text label) */\nfunction isLightColor(hex: string): boolean {\n  const c = hex.replace('#', '');\n  const r = parseInt(c.substring(0, 2), 16);\n  const g = parseInt(c.substring(2, 4), 16);\n  const b = parseInt(c.substring(4, 6), 16);\n  return (r * 299 + g * 587 + b * 114) / 1000 > 140;\n}\n\nexport default function DesignSystemSection({ data }: DesignSystemSectionProps) {\n  const { colors, fonts } = data;\n  const headingFont = fonts.find((f) => f.usage === 'heading') || fonts[0];\n  const bodyFont = fonts.find((f) => f.usage === 'body') || fonts[1] || fonts[0];\n\n  if (!colors.length && !fonts.length) return null;\n\n  return (\n    <section\n      className=\"w-full py-20 md:py-28\"\n      style={{ background: 'var(--sk-bg, #0a0a0a)' }}\n    >\n      <div className=\"max-w-5xl mx-auto px-6\">\n        <ScrollReveal y={30}>\n          <h2\n            className=\"text-3xl md:text-4xl font-bold mb-4\"\n            style={{\n              color: 'var(--sk-text-primary, #ffffff)',\n              fontFamily: 'var(--sk-font-heading, inherit)',\n            }}\n          >\n            Design System\n          </h2>\n          <p\n            className=\"text-lg mb-12 max-w-2xl\"\n            style={{ color: 'var(--sk-text-secondary, #a1a1aa)' }}\n          >\n            The visual language we crafted for this project.\n          </p>\n        </ScrollReveal>\n\n        <div className=\"grid grid-cols-1 md:grid-cols-2 gap-8\">\n          {/* Color Palette */}\n          {colors.length > 0 && (\n            <ScrollReveal y={20}>\n              <GlassCard padding=\"lg\" hover={false}>\n                <h3\n                  className=\"text-base font-semibold mb-4\"\n                  style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n                >\n                  Color Palette\n                </h3>\n                <div className=\"grid grid-cols-3 gap-3\">\n                  {colors.map((color, ci) => (\n                    <div key={ci} className=\"flex flex-col items-center gap-2\">\n                      <div\n                        className=\"w-full aspect-square rounded-lg border flex items-end justify-center pb-2\"\n                        style={{\n                          background: color.hex,\n                          borderColor: 'color-mix(in srgb, var(--sk-text-tertiary, #71717a) 20%, transparent)',\n                        }}\n                      >\n                        <span\n                          className=\"text-[10px] font-mono font-medium px-1.5 py-0.5 rounded\"\n                          style={{\n                            color: isLightColor(color.hex) ? '#000' : '#fff',\n                            background: isLightColor(color.hex) ? 'rgba(0,0,0,0.15)' : 'rgba(255,255,255,0.15)',\n                          }}\n                        >\n                          {color.hex}\n                        </span>\n                      </div>\n                      {color.context && (\n                        <span\n                          className=\"text-[10px] capitalize\"\n                          style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                        >\n                          {color.context}\n                        </span>\n                      )}\n                    </div>\n                  ))}\n                </div>\n              </GlassCard>\n            </ScrollReveal>\n          )}\n\n          {/* Typography */}\n          {fonts.length > 0 && (\n            <ScrollReveal y={20} delay={0.1}>\n              <GlassCard padding=\"lg\" hover={false}>\n                <h3\n                  className=\"text-base font-semibold mb-4\"\n                  style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n                >\n                  Typography\n                </h3>\n                <div className=\"flex flex-col gap-6\">\n                  {headingFont && (\n                    <div>\n                      <span\n                        className=\"text-[10px] font-medium uppercase tracking-wider block mb-2\"\n                        style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                      >\n                        Headings\n                      </span>\n                      <p\n                        className=\"text-2xl font-bold\"\n                        style={{\n                          color: 'var(--sk-text-primary, #ffffff)',\n                          fontFamily: headingFont.family,\n                        }}\n                      >\n                        {headingFont.family}\n                      </p>\n                      {headingFont.weights && headingFont.weights.length > 0 && (\n                        <div className=\"flex gap-2 mt-2\">\n                          {headingFont.weights.map((w) => (\n                            <span\n                              key={w}\n                              className=\"text-xs px-2 py-0.5 rounded\"\n                              style={{\n                                background: 'color-mix(in srgb, var(--sk-text-tertiary, #71717a) 15%, transparent)',\n                                color: 'var(--sk-text-tertiary, #71717a)',\n                                fontWeight: w,\n                              }}\n                            >\n                              {w}\n                            </span>\n                          ))}\n                        </div>\n                      )}\n                    </div>\n                  )}\n                  {bodyFont && bodyFont.family !== headingFont?.family && (\n                    <div>\n                      <span\n                        className=\"text-[10px] font-medium uppercase tracking-wider block mb-2\"\n                        style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                      >\n                        Body\n                      </span>\n                      <p\n                        className=\"text-lg\"\n                        style={{\n                          color: 'var(--sk-text-primary, #ffffff)',\n                          fontFamily: bodyFont.family,\n                        }}\n                      >\n                        {bodyFont.family}\n                      </p>\n                      <p\n                        className=\"text-sm mt-2 leading-relaxed\"\n                        style={{\n                          color: 'var(--sk-text-tertiary, #71717a)',\n                          fontFamily: bodyFont.family,\n                        }}\n                      >\n                        The quick brown fox jumps over the lazy dog. Clean, readable type that puts content first.\n                      </p>\n                    </div>\n                  )}\n                </div>\n              </GlassCard>\n            </ScrollReveal>\n          )}\n        </div>\n      </div>\n    </section>\n  );\n}\n"]}

package/dist/portfolio/sections/DesignSystemSection.d.cts

@@ -0,0 +1,32 @@
+import React from 'react';
+
+interface ColorEntry {
+    hex: string;
+    usageCount?: number;
+    context?: string;
+}
+interface FontEntry {
+    family: string;
+    weights?: number[];
+    usage?: string;
+}
+interface DesignSystemData {
+    colors: ColorEntry[];
+    fonts: FontEntry[];
+    headingStyles?: {
+        font?: string;
+        size?: string;
+        weight?: string | number;
+    };
+    bodyStyles?: {
+        font?: string;
+        size?: string;
+        lineHeight?: string;
+    };
+}
+interface DesignSystemSectionProps {
+    data: DesignSystemData;
+}
+declare function DesignSystemSection({ data }: DesignSystemSectionProps): React.JSX.Element | null;
+
+export { type DesignSystemData, DesignSystemSection as default };

package/dist/portfolio/sections/DesignSystemSection.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+
+interface ColorEntry {
+    hex: string;
+    usageCount?: number;
+    context?: string;
+}
+interface FontEntry {
+    family: string;
+    weights?: number[];
+    usage?: string;
+}
+interface DesignSystemData {
+    colors: ColorEntry[];
+    fonts: FontEntry[];
+    headingStyles?: {
+        font?: string;
+        size?: string;
+        weight?: string | number;
+    };
+    bodyStyles?: {
+        font?: string;
+        size?: string;
+        lineHeight?: string;
+    };
+}
+interface DesignSystemSectionProps {
+    data: DesignSystemData;
+}
+declare function DesignSystemSection({ data }: DesignSystemSectionProps): React.JSX.Element | null;
+
+export { type DesignSystemData, DesignSystemSection as default };

package/dist/{DesignSystemSection-2R5BRBGO.js → portfolio/sections/DesignSystemSection.js}

@@ -1,7 +1,8 @@
-import { GlassCard } from './chunk-YB4B3OMC.js';
-import { ScrollReveal } from './chunk-7CFFAKDM.js';
+import ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';
+import GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
+// src/portfolio/components/sections/DesignSystemSection.tsx
 function isLightColor(hex) {
   const c = hex.replace("#", "");
   const r = parseInt(c.substring(0, 2), 16);
@@ -168,5 +169,5 @@ function DesignSystemSection({ data }) {
 }
 
 export { DesignSystemSection as default };
-//# sourceMappingURL=DesignSystemSection-2R5BRBGO.js.map
-//# sourceMappingURL=DesignSystemSection-2R5BRBGO.js.map
+//# sourceMappingURL=DesignSystemSection.js.map
+//# sourceMappingURL=DesignSystemSection.js.map

package/dist/portfolio/sections/DesignSystemSection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/sections/DesignSystemSection.tsx"],"names":[],"mappings":"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","file":"DesignSystemSection.js","sourcesContent":["// Server component — renders on the server; the client primitives below cross the\n// RSC boundary via package subpaths (never import them relatively here).\nimport React from 'react';\nimport ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';\nimport GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';\n\ninterface ColorEntry {\n  hex: string;\n  usageCount?: number;\n  context?: string;\n}\n\ninterface FontEntry {\n  family: string;\n  weights?: number[];\n  usage?: string; // 'heading' | 'body' | 'accent'\n}\n\nexport interface DesignSystemData {\n  colors: ColorEntry[];\n  fonts: FontEntry[];\n  headingStyles?: { font?: string; size?: string; weight?: string | number };\n  bodyStyles?: { font?: string; size?: string; lineHeight?: string };\n}\n\ninterface DesignSystemSectionProps {\n  data: DesignSystemData;\n}\n\n/** Determine if a hex color is light (needs dark text label) */\nfunction isLightColor(hex: string): boolean {\n  const c = hex.replace('#', '');\n  const r = parseInt(c.substring(0, 2), 16);\n  const g = parseInt(c.substring(2, 4), 16);\n  const b = parseInt(c.substring(4, 6), 16);\n  return (r * 299 + g * 587 + b * 114) / 1000 > 140;\n}\n\nexport default function DesignSystemSection({ data }: DesignSystemSectionProps) {\n  const { colors, fonts } = data;\n  const headingFont = fonts.find((f) => f.usage === 'heading') || fonts[0];\n  const bodyFont = fonts.find((f) => f.usage === 'body') || fonts[1] || fonts[0];\n\n  if (!colors.length && !fonts.length) return null;\n\n  return (\n    <section\n      className=\"w-full py-20 md:py-28\"\n      style={{ background: 'var(--sk-bg, #0a0a0a)' }}\n    >\n      <div className=\"max-w-5xl mx-auto px-6\">\n        <ScrollReveal y={30}>\n          <h2\n            className=\"text-3xl md:text-4xl font-bold mb-4\"\n            style={{\n              color: 'var(--sk-text-primary, #ffffff)',\n              fontFamily: 'var(--sk-font-heading, inherit)',\n            }}\n          >\n            Design System\n          </h2>\n          <p\n            className=\"text-lg mb-12 max-w-2xl\"\n            style={{ color: 'var(--sk-text-secondary, #a1a1aa)' }}\n          >\n            The visual language we crafted for this project.\n          </p>\n        </ScrollReveal>\n\n        <div className=\"grid grid-cols-1 md:grid-cols-2 gap-8\">\n          {/* Color Palette */}\n          {colors.length > 0 && (\n            <ScrollReveal y={20}>\n              <GlassCard padding=\"lg\" hover={false}>\n                <h3\n                  className=\"text-base font-semibold mb-4\"\n                  style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n                >\n                  Color Palette\n                </h3>\n                <div className=\"grid grid-cols-3 gap-3\">\n                  {colors.map((color, ci) => (\n                    <div key={ci} className=\"flex flex-col items-center gap-2\">\n                      <div\n                        className=\"w-full aspect-square rounded-lg border flex items-end justify-center pb-2\"\n                        style={{\n                          background: color.hex,\n                          borderColor: 'color-mix(in srgb, var(--sk-text-tertiary, #71717a) 20%, transparent)',\n                        }}\n                      >\n                        <span\n                          className=\"text-[10px] font-mono font-medium px-1.5 py-0.5 rounded\"\n                          style={{\n                            color: isLightColor(color.hex) ? '#000' : '#fff',\n                            background: isLightColor(color.hex) ? 'rgba(0,0,0,0.15)' : 'rgba(255,255,255,0.15)',\n                          }}\n                        >\n                          {color.hex}\n                        </span>\n                      </div>\n                      {color.context && (\n                        <span\n                          className=\"text-[10px] capitalize\"\n                          style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                        >\n                          {color.context}\n                        </span>\n                      )}\n                    </div>\n                  ))}\n                </div>\n              </GlassCard>\n            </ScrollReveal>\n          )}\n\n          {/* Typography */}\n          {fonts.length > 0 && (\n            <ScrollReveal y={20} delay={0.1}>\n              <GlassCard padding=\"lg\" hover={false}>\n                <h3\n                  className=\"text-base font-semibold mb-4\"\n                  style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n                >\n                  Typography\n                </h3>\n                <div className=\"flex flex-col gap-6\">\n                  {headingFont && (\n                    <div>\n                      <span\n                        className=\"text-[10px] font-medium uppercase tracking-wider block mb-2\"\n                        style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                      >\n                        Headings\n                      </span>\n                      <p\n                        className=\"text-2xl font-bold\"\n                        style={{\n                          color: 'var(--sk-text-primary, #ffffff)',\n                          fontFamily: headingFont.family,\n                        }}\n                      >\n                        {headingFont.family}\n                      </p>\n                      {headingFont.weights && headingFont.weights.length > 0 && (\n                        <div className=\"flex gap-2 mt-2\">\n                          {headingFont.weights.map((w) => (\n                            <span\n                              key={w}\n                              className=\"text-xs px-2 py-0.5 rounded\"\n                              style={{\n                                background: 'color-mix(in srgb, var(--sk-text-tertiary, #71717a) 15%, transparent)',\n                                color: 'var(--sk-text-tertiary, #71717a)',\n                                fontWeight: w,\n                              }}\n                            >\n                              {w}\n                            </span>\n                          ))}\n                        </div>\n                      )}\n                    </div>\n                  )}\n                  {bodyFont && bodyFont.family !== headingFont?.family && (\n                    <div>\n                      <span\n                        className=\"text-[10px] font-medium uppercase tracking-wider block mb-2\"\n                        style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                      >\n                        Body\n                      </span>\n                      <p\n                        className=\"text-lg\"\n                        style={{\n                          color: 'var(--sk-text-primary, #ffffff)',\n                          fontFamily: bodyFont.family,\n                        }}\n                      >\n                        {bodyFont.family}\n                      </p>\n                      <p\n                        className=\"text-sm mt-2 leading-relaxed\"\n                        style={{\n                          color: 'var(--sk-text-tertiary, #71717a)',\n                          fontFamily: bodyFont.family,\n                        }}\n                      >\n                        The quick brown fox jumps over the lazy dog. Clean, readable type that puts content first.\n                      </p>\n                    </div>\n                  )}\n                </div>\n              </GlassCard>\n            </ScrollReveal>\n          )}\n        </div>\n      </div>\n    </section>\n  );\n}\n"]}

package/dist/{DetailsSection-TTUZAPZZ.cjs → portfolio/sections/DetailsSection.cjs}

@@ -1,9 +1,15 @@
 'use strict';
 
-var chunkKEOHORIH_cjs = require('./chunk-KEOHORIH.cjs');
-var chunkIKBK7HYX_cjs = require('./chunk-IKBK7HYX.cjs');
+var ScrollReveal = require('@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal');
+var GlassCard = require('@sonordev/agency-site-kit/portfolio/primitives/GlassCard');
 var jsxRuntime = require('react/jsx-runtime');
 
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var ScrollReveal__default = /*#__PURE__*/_interopDefault(ScrollReveal);
+var GlassCard__default = /*#__PURE__*/_interopDefault(GlassCard);
+
+// src/portfolio/components/sections/DetailsSection.tsx
 function DetailsSection({ data }) {
   const rows = [];
   if (data.industry) {
@@ -76,7 +82,7 @@ function DetailsSection({ data }) {
       className: "w-full py-20 md:py-28",
       style: { background: "var(--sk-bg, #0a0a0a)" },
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-4xl mx-auto px-6", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(chunkIKBK7HYX_cjs.ScrollReveal, { y: 30, children: /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx(ScrollReveal__default.default, { y: 30, children: /* @__PURE__ */ jsxRuntime.jsx(
           "h2",
           {
             className: "text-3xl md:text-4xl font-bold mb-8",
@@ -87,7 +93,7 @@ function DetailsSection({ data }) {
             children: "Project Details"
           }
         ) }),
-        /* @__PURE__ */ jsxRuntime.jsx(chunkIKBK7HYX_cjs.ScrollReveal, { y: 40, delay: 0.1, children: /* @__PURE__ */ jsxRuntime.jsx(chunkKEOHORIH_cjs.GlassCard, { padding: "lg", hover: false, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col divide-y", style: { borderColor: "var(--sk-border, rgba(255,255,255,0.1))" }, children: rows.map((row, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+        /* @__PURE__ */ jsxRuntime.jsx(ScrollReveal__default.default, { y: 40, delay: 0.1, children: /* @__PURE__ */ jsxRuntime.jsx(GlassCard__default.default, { padding: "lg", hover: false, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col divide-y", style: { borderColor: "var(--sk-border, rgba(255,255,255,0.1))" }, children: rows.map((row, index) => /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
             className: "flex items-center gap-4 py-4 first:pt-0 last:pb-0",
@@ -142,5 +148,5 @@ function DetailsSection({ data }) {
 }
 
 module.exports = DetailsSection;
-//# sourceMappingURL=DetailsSection-TTUZAPZZ.cjs.map
-//# sourceMappingURL=DetailsSection-TTUZAPZZ.cjs.map
+//# sourceMappingURL=DetailsSection.cjs.map
+//# sourceMappingURL=DetailsSection.cjs.map

package/dist/portfolio/sections/DetailsSection.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/sections/DetailsSection.tsx"],"names":["jsxs","jsx","ScrollReveal","GlassCard"],"mappings":"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","file":"DetailsSection.cjs","sourcesContent":["// Server component — renders on the server; the client primitives below cross the\n// RSC boundary via package subpaths (never import them relatively here).\nimport React from 'react';\nimport type { PortfolioDetailsData } from '../../../types';\nimport ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';\nimport GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';\n\ninterface DetailsSectionProps {\n  data: PortfolioDetailsData;\n}\n\ninterface DetailRow {\n  icon: React.ReactNode;\n  label: string;\n  value: string;\n}\n\nexport default function DetailsSection({ data }: DetailsSectionProps) {\n  const rows: DetailRow[] = [];\n\n  if (data.industry) {\n    rows.push({\n      label: 'Industry',\n      value: data.industry,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <path d=\"M3 16.5h12M4.5 1.5h9l1.5 6H3l1.5-6zM6 7.5v9M12 7.5v9M9 7.5v9\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.location) {\n    rows.push({\n      label: 'Location',\n      value: data.location,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <path d=\"M15 7.5c0 4.5-6 9-6 9s-6-4.5-6-9a6 6 0 1112 0z\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n          <circle cx=\"9\" cy=\"7.5\" r=\"2\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.website) {\n    // Normalize — strip any double protocol prefix\n    const cleanUrl = data.website.replace(/^https?:\\/\\/https?:\\/\\//, 'https://');\n    rows.push({\n      label: 'Website',\n      value: cleanUrl,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <circle cx=\"9\" cy=\"9\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n          <path d=\"M1.5 9h15M9 1.5a11.25 11.25 0 013 7.5 11.25 11.25 0 01-3 7.5 11.25 11.25 0 01-3-7.5 11.25 11.25 0 013-7.5z\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.timeline) {\n    rows.push({\n      label: 'Delivered In',\n      value: data.timeline,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <circle cx=\"9\" cy=\"9\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n          <path d=\"M9 4.5V9l3 1.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.launchDate) {\n    // Format ISO date to readable string (e.g. \"January 16, 2026\")\n    let formattedDate = data.launchDate;\n    try {\n      const d = new Date(data.launchDate);\n      if (!isNaN(d.getTime())) {\n        formattedDate = d.toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' });\n      }\n    } catch { /* keep raw value */ }\n    rows.push({\n      label: 'Launch Date',\n      value: formattedDate,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <rect x=\"2.25\" y=\"3\" width=\"13.5\" height=\"12.75\" rx=\"2\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n          <path d=\"M12 1.5v3M6 1.5v3M2.25 7.5h13.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.budgetRange) {\n    rows.push({\n      label: 'Budget Range',\n      value: data.budgetRange,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <path d=\"M9 1.5v15M13.5 4.5H6.75a2.625 2.625 0 000 5.25h4.5a2.625 2.625 0 010 5.25H4.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (rows.length === 0) return null;\n\n  return (\n    <section\n      className=\"w-full py-20 md:py-28\"\n      style={{ background: 'var(--sk-bg, #0a0a0a)' }}\n    >\n      <div className=\"max-w-4xl mx-auto px-6\">\n        <ScrollReveal y={30}>\n          <h2\n            className=\"text-3xl md:text-4xl font-bold mb-8\"\n            style={{\n              color: 'var(--sk-text-primary, #ffffff)',\n              fontFamily: 'var(--sk-font-heading, inherit)',\n            }}\n          >\n            Project Details\n          </h2>\n        </ScrollReveal>\n\n        <ScrollReveal y={40} delay={0.1}>\n          <GlassCard padding=\"lg\" hover={false}>\n            <div className=\"flex flex-col divide-y\" style={{ borderColor: 'var(--sk-border, rgba(255,255,255,0.1))' }}>\n              {rows.map((row, index) => (\n                <div\n                  key={index}\n                  className=\"flex items-center gap-4 py-4 first:pt-0 last:pb-0\"\n                  style={{\n                    borderColor: 'var(--sk-border, rgba(255,255,255,0.1))',\n                  }}\n                >\n                  <span\n                    className=\"flex items-center justify-center w-9 h-9 rounded-lg shrink-0\"\n                    style={{\n                      background: 'color-mix(in srgb, var(--sk-primary, #6366f1) 12%, transparent)',\n                      color: 'var(--sk-primary, #6366f1)',\n                    }}\n                  >\n                    {row.icon}\n                  </span>\n                  <span\n                    className=\"text-sm font-medium w-32 shrink-0\"\n                    style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                  >\n                    {row.label}\n                  </span>\n                  {row.label === 'Website' ? (\n                    <a\n                      href={row.value.startsWith('http') ? row.value : `https://${row.value}`}\n                      target=\"_blank\"\n                      rel=\"noopener noreferrer\"\n                      className=\"text-sm font-medium hover:underline\"\n                      style={{ color: 'var(--sk-primary, #6366f1)' }}\n                    >\n                      {row.value}\n                    </a>\n                  ) : (\n                    <span\n                      className=\"text-sm font-medium\"\n                      style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n                    >\n                      {row.value}\n                    </span>\n                  )}\n                </div>\n              ))}\n            </div>\n          </GlassCard>\n        </ScrollReveal>\n      </div>\n    </section>\n  );\n}\n"]}

package/dist/portfolio/sections/DetailsSection.d.cts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { d as PortfolioDetailsData } from '../../types-0tVPy4pU.cjs';
+
+interface DetailsSectionProps {
+    data: PortfolioDetailsData;
+}
+declare function DetailsSection({ data }: DetailsSectionProps): React.JSX.Element | null;
+
+export { DetailsSection as default };

package/dist/portfolio/sections/DetailsSection.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { d as PortfolioDetailsData } from '../../types-0tVPy4pU.js';
+
+interface DetailsSectionProps {
+    data: PortfolioDetailsData;
+}
+declare function DetailsSection({ data }: DetailsSectionProps): React.JSX.Element | null;
+
+export { DetailsSection as default };

package/dist/{DetailsSection-A6PZQUQL.js → portfolio/sections/DetailsSection.js}

@@ -1,7 +1,8 @@
-import { GlassCard } from './chunk-YB4B3OMC.js';
-import { ScrollReveal } from './chunk-7CFFAKDM.js';
+import ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';
+import GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
+// src/portfolio/components/sections/DetailsSection.tsx
 function DetailsSection({ data }) {
   const rows = [];
   if (data.industry) {
@@ -140,5 +141,5 @@ function DetailsSection({ data }) {
 }
 
 export { DetailsSection as default };
-//# sourceMappingURL=DetailsSection-A6PZQUQL.js.map
-//# sourceMappingURL=DetailsSection-A6PZQUQL.js.map
+//# sourceMappingURL=DetailsSection.js.map
+//# sourceMappingURL=DetailsSection.js.map

package/dist/portfolio/sections/DetailsSection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/sections/DetailsSection.tsx"],"names":[],"mappings":"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","file":"DetailsSection.js","sourcesContent":["// Server component — renders on the server; the client primitives below cross the\n// RSC boundary via package subpaths (never import them relatively here).\nimport React from 'react';\nimport type { PortfolioDetailsData } from '../../../types';\nimport ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';\nimport GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';\n\ninterface DetailsSectionProps {\n  data: PortfolioDetailsData;\n}\n\ninterface DetailRow {\n  icon: React.ReactNode;\n  label: string;\n  value: string;\n}\n\nexport default function DetailsSection({ data }: DetailsSectionProps) {\n  const rows: DetailRow[] = [];\n\n  if (data.industry) {\n    rows.push({\n      label: 'Industry',\n      value: data.industry,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <path d=\"M3 16.5h12M4.5 1.5h9l1.5 6H3l1.5-6zM6 7.5v9M12 7.5v9M9 7.5v9\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.location) {\n    rows.push({\n      label: 'Location',\n      value: data.location,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <path d=\"M15 7.5c0 4.5-6 9-6 9s-6-4.5-6-9a6 6 0 1112 0z\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n          <circle cx=\"9\" cy=\"7.5\" r=\"2\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.website) {\n    // Normalize — strip any double protocol prefix\n    const cleanUrl = data.website.replace(/^https?:\\/\\/https?:\\/\\//, 'https://');\n    rows.push({\n      label: 'Website',\n      value: cleanUrl,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <circle cx=\"9\" cy=\"9\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n          <path d=\"M1.5 9h15M9 1.5a11.25 11.25 0 013 7.5 11.25 11.25 0 01-3 7.5 11.25 11.25 0 01-3-7.5 11.25 11.25 0 013-7.5z\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.timeline) {\n    rows.push({\n      label: 'Delivered In',\n      value: data.timeline,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <circle cx=\"9\" cy=\"9\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n          <path d=\"M9 4.5V9l3 1.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.launchDate) {\n    // Format ISO date to readable string (e.g. \"January 16, 2026\")\n    let formattedDate = data.launchDate;\n    try {\n      const d = new Date(data.launchDate);\n      if (!isNaN(d.getTime())) {\n        formattedDate = d.toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' });\n      }\n    } catch { /* keep raw value */ }\n    rows.push({\n      label: 'Launch Date',\n      value: formattedDate,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <rect x=\"2.25\" y=\"3\" width=\"13.5\" height=\"12.75\" rx=\"2\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n          <path d=\"M12 1.5v3M6 1.5v3M2.25 7.5h13.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (data.budgetRange) {\n    rows.push({\n      label: 'Budget Range',\n      value: data.budgetRange,\n      icon: (\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n          <path d=\"M9 1.5v15M13.5 4.5H6.75a2.625 2.625 0 000 5.25h4.5a2.625 2.625 0 010 5.25H4.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n        </svg>\n      ),\n    });\n  }\n\n  if (rows.length === 0) return null;\n\n  return (\n    <section\n      className=\"w-full py-20 md:py-28\"\n      style={{ background: 'var(--sk-bg, #0a0a0a)' }}\n    >\n      <div className=\"max-w-4xl mx-auto px-6\">\n        <ScrollReveal y={30}>\n          <h2\n            className=\"text-3xl md:text-4xl font-bold mb-8\"\n            style={{\n              color: 'var(--sk-text-primary, #ffffff)',\n              fontFamily: 'var(--sk-font-heading, inherit)',\n            }}\n          >\n            Project Details\n          </h2>\n        </ScrollReveal>\n\n        <ScrollReveal y={40} delay={0.1}>\n          <GlassCard padding=\"lg\" hover={false}>\n            <div className=\"flex flex-col divide-y\" style={{ borderColor: 'var(--sk-border, rgba(255,255,255,0.1))' }}>\n              {rows.map((row, index) => (\n                <div\n                  key={index}\n                  className=\"flex items-center gap-4 py-4 first:pt-0 last:pb-0\"\n                  style={{\n                    borderColor: 'var(--sk-border, rgba(255,255,255,0.1))',\n                  }}\n                >\n                  <span\n                    className=\"flex items-center justify-center w-9 h-9 rounded-lg shrink-0\"\n                    style={{\n                      background: 'color-mix(in srgb, var(--sk-primary, #6366f1) 12%, transparent)',\n                      color: 'var(--sk-primary, #6366f1)',\n                    }}\n                  >\n                    {row.icon}\n                  </span>\n                  <span\n                    className=\"text-sm font-medium w-32 shrink-0\"\n                    style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                  >\n                    {row.label}\n                  </span>\n                  {row.label === 'Website' ? (\n                    <a\n                      href={row.value.startsWith('http') ? row.value : `https://${row.value}`}\n                      target=\"_blank\"\n                      rel=\"noopener noreferrer\"\n                      className=\"text-sm font-medium hover:underline\"\n                      style={{ color: 'var(--sk-primary, #6366f1)' }}\n                    >\n                      {row.value}\n                    </a>\n                  ) : (\n                    <span\n                      className=\"text-sm font-medium\"\n                      style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n                    >\n                      {row.value}\n                    </span>\n                  )}\n                </div>\n              ))}\n            </div>\n          </GlassCard>\n        </ScrollReveal>\n      </div>\n    </section>\n  );\n}\n"]}

package/dist/portfolio/sections/FeatureSpotlightSection.cjs

@@ -0,0 +1,267 @@
+'use client';
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/portfolio/components/sections/FeatureSpotlightSection.tsx
+var FeatureSpotlightSection_exports = {};
+__export(FeatureSpotlightSection_exports, {
+  default: () => FeatureSpotlightSection
+});
+module.exports = __toCommonJS(FeatureSpotlightSection_exports);
+var import_react = require("react");
+var import_image = __toESM(require("next/image"), 1);
+
+// src/shared/images.ts
+var SANITY_ASSET_REF = /^image-[A-Za-z0-9]+-\d+x\d+-[a-z0-9]+$/;
+var FILENAME_DIMS = /-(\d{2,5})x(\d{2,5})\.[a-z0-9]+(?:\?.*)?$/i;
+var warnedAboutRefs = false;
+function resolvePortfolioImage(input) {
+  const raw = typeof input === "string" ? input : input?.asset?._ref ?? "";
+  const value = (raw || "").trim();
+  if (!value) return null;
+  if (SANITY_ASSET_REF.test(value)) {
+    if (!warnedAboutRefs && typeof console !== "undefined") {
+      warnedAboutRefs = true;
+      console.warn(
+        "[@sonordev/agency-site-kit] Received a raw Sanity asset ref instead of an image URL \u2014 skipping render. The Sonor API should resolve image refs to cdn.sanity.io URLs before returning portfolio sections."
+      );
+    }
+    return null;
+  }
+  if (!/^https?:\/\//i.test(value) && !value.startsWith("/")) return null;
+  const dims = value.match(FILENAME_DIMS);
+  if (dims) {
+    const width = parseInt(dims[1], 10);
+    const height = parseInt(dims[2], 10);
+    if (width > 0 && height > 0) return { url: value, width, height };
+  }
+  return { url: value };
+}
+
+// src/portfolio/components/sections/FeatureSpotlightSection.tsx
+var import_ScrollReveal = __toESM(require("@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal"), 1);
+var import_jsx_runtime = require("react/jsx-runtime");
+function AnnotationPin({
+  annotation,
+  index,
+  activeIndex,
+  onSelect
+}) {
+  const isActive = activeIndex === index;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "button",
+    {
+      onClick: () => onSelect(isActive ? null : index),
+      className: "absolute z-10 flex items-center justify-center w-8 h-8 rounded-full text-xs font-bold cursor-pointer",
+      style: {
+        left: `${annotation.x}%`,
+        top: `${annotation.y}%`,
+        // Active pop: back.out-style overshoot in (.3s), power2.out-style
+        // settle out (.2s) — CSS applies the post-change transition value,
+        // so each direction keeps its own timing. background-color keeps
+        // the 150ms fade the old transition-colors class provided.
+        transition: isActive ? "transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1)" : "transform 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1)",
+        transform: isActive ? "translate(-50%, -50%) scale(1.2)" : "translate(-50%, -50%) scale(1)",
+        background: isActive ? "var(--sk-primary, #6366f1)" : "color-mix(in srgb, var(--sk-primary, #6366f1) 80%, transparent)",
+        color: "#ffffff",
+        boxShadow: isActive ? "0 0 20px color-mix(in srgb, var(--sk-primary, #6366f1) 50%, transparent)" : "0 4px 12px rgba(0,0,0,0.3)",
+        border: "2px solid rgba(255,255,255,0.3)",
+        willChange: "transform"
+      },
+      "aria-label": annotation.label,
+      children: [
+        index + 1,
+        isActive && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "div",
+          {
+            className: "absolute bottom-full left-1/2 mb-3 w-56 p-3 rounded-xl text-left",
+            style: {
+              transform: "translateX(-50%)",
+              background: "var(--sk-surface, rgba(255,255,255,0.05))",
+              backdropFilter: "blur(16px)",
+              border: "1px solid var(--sk-border, rgba(255,255,255,0.1))",
+              boxShadow: "0 8px 32px rgba(0,0,0,0.3)"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "div",
+                {
+                  className: "text-sm font-semibold mb-1",
+                  style: { color: "var(--sk-text-primary, #ffffff)" },
+                  children: annotation.label
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "div",
+                {
+                  className: "text-xs leading-relaxed",
+                  style: { color: "var(--sk-text-tertiary, #71717a)" },
+                  children: annotation.description
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "div",
+                {
+                  className: "absolute top-full left-1/2 w-0 h-0",
+                  style: {
+                    transform: "translateX(-50%)",
+                    borderLeft: "6px solid transparent",
+                    borderRight: "6px solid transparent",
+                    borderTop: "6px solid var(--sk-border, rgba(255,255,255,0.1))"
+                  }
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function FeatureSpotlightSection({ data }) {
+  const [activeAnnotation, setActiveAnnotation] = (0, import_react.useState)(null);
+  const image = resolvePortfolioImage(data.image);
+  const layout = data.layout || "left";
+  const handleSelect = (0, import_react.useCallback)((index) => {
+    setActiveAnnotation(index);
+  }, []);
+  const imageBlock = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative w-full", children: [
+    image && (image.width && image.height ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_image.default,
+      {
+        src: image.url,
+        alt: data.title,
+        width: image.width,
+        height: image.height,
+        sizes: "(max-width: 1024px) 100vw, 640px",
+        className: "w-full h-auto rounded-xl",
+        style: {
+          border: "1px solid var(--sk-border, rgba(255,255,255,0.1))"
+        }
+      }
+    ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "img",
+      {
+        src: image.url,
+        alt: data.title,
+        className: "w-full h-auto rounded-xl",
+        style: {
+          border: "1px solid var(--sk-border, rgba(255,255,255,0.1))"
+        },
+        loading: "lazy",
+        decoding: "async"
+      }
+    )),
+    data.annotations.map((annotation, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      AnnotationPin,
+      {
+        annotation,
+        index,
+        activeIndex: activeAnnotation,
+        onSelect: handleSelect
+      },
+      index
+    ))
+  ] });
+  const textBlock = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col justify-center gap-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "h2",
+      {
+        className: "text-3xl md:text-4xl font-bold",
+        style: {
+          color: "var(--sk-text-primary, #ffffff)",
+          fontFamily: "var(--sk-font-heading, inherit)"
+        },
+        children: data.title
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "p",
+      {
+        className: "text-base md:text-lg leading-relaxed",
+        style: { color: "var(--sk-text-secondary, #a1a1aa)" },
+        children: data.description
+      }
+    ),
+    data.annotations.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-2 mt-4", children: data.annotations.map((annotation, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "button",
+      {
+        onClick: () => handleSelect(activeAnnotation === index ? null : index),
+        className: "flex items-start gap-3 text-left p-2 rounded-lg transition-colors cursor-pointer",
+        style: {
+          background: activeAnnotation === index ? "color-mix(in srgb, var(--sk-primary, #6366f1) 10%, transparent)" : "transparent"
+        },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "span",
+            {
+              className: "flex items-center justify-center w-6 h-6 rounded-full text-xs font-bold shrink-0",
+              style: {
+                background: "color-mix(in srgb, var(--sk-primary, #6366f1) 20%, transparent)",
+                color: "var(--sk-primary, #6366f1)"
+              },
+              children: index + 1
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "span",
+            {
+              className: "text-sm font-medium",
+              style: { color: "var(--sk-text-primary, #ffffff)" },
+              children: annotation.label
+            }
+          ) })
+        ]
+      },
+      index
+    )) })
+  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "section",
+    {
+      className: "w-full py-20 md:py-28",
+      style: { background: "var(--sk-bg, #0a0a0a)" },
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "max-w-7xl mx-auto px-6", children: layout === "full" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-8", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ScrollReveal.default, { y: 30, children: textBlock }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ScrollReveal.default, { y: 40, delay: 0.15, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative", children: imageBlock }) })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "div",
+        {
+          className: `grid lg:grid-cols-2 gap-12 items-center ${layout === "right" ? "lg:[direction:rtl] lg:[&>*]:![direction:ltr]" : ""}`,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ScrollReveal.default, { y: 40, children: imageBlock }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ScrollReveal.default, { y: 40, delay: 0.15, children: textBlock })
+          ]
+        }
+      ) })
+    }
+  );
+}
+//# sourceMappingURL=FeatureSpotlightSection.cjs.map

package/dist/portfolio/sections/FeatureSpotlightSection.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/sections/FeatureSpotlightSection.tsx","../../../src/shared/images.ts"],"sourcesContent":["'use client';\n\nimport React, { useState, useCallback } from 'react';\nimport Image from 'next/image';\nimport type { PortfolioFeatureSpotlightData, PortfolioAnnotation } from '../../../types';\nimport { resolvePortfolioImage } from '../../../shared/images';\nimport ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';\n\ninterface FeatureSpotlightSectionProps {\n  data: PortfolioFeatureSpotlightData;\n}\n\nfunction AnnotationPin({\n  annotation,\n  index,\n  activeIndex,\n  onSelect,\n}: {\n  annotation: PortfolioAnnotation;\n  index: number;\n  activeIndex: number | null;\n  onSelect: (index: number | null) => void;\n}) {\n  const isActive = activeIndex === index;\n\n  return (\n    <button\n      onClick={() => onSelect(isActive ? null : index)}\n      className=\"absolute z-10 flex items-center justify-center w-8 h-8 rounded-full text-xs font-bold cursor-pointer\"\n      style={{\n        left: `${annotation.x}%`,\n        top: `${annotation.y}%`,\n        // Active pop: back.out-style overshoot in (.3s), power2.out-style\n        // settle out (.2s) — CSS applies the post-change transition value,\n        // so each direction keeps its own timing. background-color keeps\n        // the 150ms fade the old transition-colors class provided.\n        transition: isActive\n          ? 'transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1)'\n          : 'transform 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1)',\n        transform: isActive\n          ? 'translate(-50%, -50%) scale(1.2)'\n          : 'translate(-50%, -50%) scale(1)',\n        background: isActive\n          ? 'var(--sk-primary, #6366f1)'\n          : 'color-mix(in srgb, var(--sk-primary, #6366f1) 80%, transparent)',\n        color: '#ffffff',\n        boxShadow: isActive\n          ? '0 0 20px color-mix(in srgb, var(--sk-primary, #6366f1) 50%, transparent)'\n          : '0 4px 12px rgba(0,0,0,0.3)',\n        border: '2px solid rgba(255,255,255,0.3)',\n        willChange: 'transform',\n      }}\n      aria-label={annotation.label}\n    >\n      {index + 1}\n\n      {/* Tooltip */}\n      {isActive && (\n        <div\n          className=\"absolute bottom-full left-1/2 mb-3 w-56 p-3 rounded-xl text-left\"\n          style={{\n            transform: 'translateX(-50%)',\n            background: 'var(--sk-surface, rgba(255,255,255,0.05))',\n            backdropFilter: 'blur(16px)',\n            border: '1px solid var(--sk-border, rgba(255,255,255,0.1))',\n            boxShadow: '0 8px 32px rgba(0,0,0,0.3)',\n          }}\n        >\n          <div\n            className=\"text-sm font-semibold mb-1\"\n            style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n          >\n            {annotation.label}\n          </div>\n          <div\n            className=\"text-xs leading-relaxed\"\n            style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n          >\n            {annotation.description}\n          </div>\n          {/* Arrow */}\n          <div\n            className=\"absolute top-full left-1/2 w-0 h-0\"\n            style={{\n              transform: 'translateX(-50%)',\n              borderLeft: '6px solid transparent',\n              borderRight: '6px solid transparent',\n              borderTop: '6px solid var(--sk-border, rgba(255,255,255,0.1))',\n            }}\n          />\n        </div>\n      )}\n    </button>\n  );\n}\n\nexport default function FeatureSpotlightSection({ data }: FeatureSpotlightSectionProps) {\n  const [activeAnnotation, setActiveAnnotation] = useState<number | null>(null);\n\n  const image = resolvePortfolioImage(data.image);\n  const layout = data.layout || 'left';\n\n  const handleSelect = useCallback((index: number | null) => {\n    setActiveAnnotation(index);\n  }, []);\n\n  const imageBlock = (\n    <div className=\"relative w-full\">\n      {image &&\n        (image.width && image.height ? (\n          <Image\n            src={image.url}\n            alt={data.title}\n            width={image.width}\n            height={image.height}\n            sizes=\"(max-width: 1024px) 100vw, 640px\"\n            className=\"w-full h-auto rounded-xl\"\n            style={{\n              border: '1px solid var(--sk-border, rgba(255,255,255,0.1))',\n            }}\n          />\n        ) : (\n          <img\n            src={image.url}\n            alt={data.title}\n            className=\"w-full h-auto rounded-xl\"\n            style={{\n              border: '1px solid var(--sk-border, rgba(255,255,255,0.1))',\n            }}\n            loading=\"lazy\"\n            decoding=\"async\"\n          />\n        ))}\n      {/* Annotation pins */}\n      {data.annotations.map((annotation, index) => (\n        <AnnotationPin\n          key={index}\n          annotation={annotation}\n          index={index}\n          activeIndex={activeAnnotation}\n          onSelect={handleSelect}\n        />\n      ))}\n    </div>\n  );\n\n  const textBlock = (\n    <div className=\"flex flex-col justify-center gap-4\">\n      <h2\n        className=\"text-3xl md:text-4xl font-bold\"\n        style={{\n          color: 'var(--sk-text-primary, #ffffff)',\n          fontFamily: 'var(--sk-font-heading, inherit)',\n        }}\n      >\n        {data.title}\n      </h2>\n      <p\n        className=\"text-base md:text-lg leading-relaxed\"\n        style={{ color: 'var(--sk-text-secondary, #a1a1aa)' }}\n      >\n        {data.description}\n      </p>\n\n      {/* Annotation legend */}\n      {data.annotations.length > 0 && (\n        <div className=\"flex flex-col gap-2 mt-4\">\n          {data.annotations.map((annotation, index) => (\n            <button\n              key={index}\n              onClick={() => handleSelect(activeAnnotation === index ? null : index)}\n              className=\"flex items-start gap-3 text-left p-2 rounded-lg transition-colors cursor-pointer\"\n              style={{\n                background:\n                  activeAnnotation === index\n                    ? 'color-mix(in srgb, var(--sk-primary, #6366f1) 10%, transparent)'\n                    : 'transparent',\n              }}\n            >\n              <span\n                className=\"flex items-center justify-center w-6 h-6 rounded-full text-xs font-bold shrink-0\"\n                style={{\n                  background: 'color-mix(in srgb, var(--sk-primary, #6366f1) 20%, transparent)',\n                  color: 'var(--sk-primary, #6366f1)',\n                }}\n              >\n                {index + 1}\n              </span>\n              <div>\n                <span\n                  className=\"text-sm font-medium\"\n                  style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n                >\n                  {annotation.label}\n                </span>\n              </div>\n            </button>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n\n  return (\n    <section\n      className=\"w-full py-20 md:py-28\"\n      style={{ background: 'var(--sk-bg, #0a0a0a)' }}\n    >\n      <div className=\"max-w-7xl mx-auto px-6\">\n        {layout === 'full' ? (\n          <div className=\"flex flex-col gap-8\">\n            <ScrollReveal y={30}>{textBlock}</ScrollReveal>\n            <ScrollReveal y={40} delay={0.15}>\n              <div className=\"relative\">{imageBlock}</div>\n            </ScrollReveal>\n          </div>\n        ) : (\n          <div\n            className={`grid lg:grid-cols-2 gap-12 items-center ${\n              layout === 'right' ? 'lg:[direction:rtl] lg:[&>*]:![direction:ltr]' : ''\n            }`}\n          >\n            <ScrollReveal y={40}>{imageBlock}</ScrollReveal>\n            <ScrollReveal y={40} delay={0.15}>{textBlock}</ScrollReveal>\n          </div>\n        )}\n      </div>\n    </section>\n  );\n}\n","/**\n * Portfolio image resolution — single source of truth for turning the mixed\n * image shapes the API sends (plain URL strings, Supabase Storage URLs,\n * Sanity image objects) into something safe to render.\n *\n * IMPORTANT: a raw Sanity asset _ref (`image-{id}-{W}x{H}-{fmt}`) is an asset\n * ID, NOT a URL. Rendering it as `src` issues a garbage relative request\n * against the agency site's origin. Resolving refs to cdn.sanity.io URLs is\n * the API's job (it owns the Sanity project config); this helper refuses refs\n * so a broken image can never render, and warns once so the gap is visible.\n *\n * When a URL carries `-{W}x{H}.{ext}` dimensions (Sanity CDN URLs always do),\n * they're parsed out so callers can give next/image exact intrinsic sizes.\n */\n\nexport interface ResolvedPortfolioImage {\n  url: string;\n  width?: number;\n  height?: number;\n}\n\n/** Raw Sanity asset reference — an ID, not a URL. */\nconst SANITY_ASSET_REF = /^image-[A-Za-z0-9]+-\\d+x\\d+-[a-z0-9]+$/;\n\n/** `…-1200x800.png` (optionally with a query string) → intrinsic dimensions. */\nconst FILENAME_DIMS = /-(\\d{2,5})x(\\d{2,5})\\.[a-z0-9]+(?:\\?.*)?$/i;\n\ninterface SanityImageLike {\n  asset?: { _ref?: string };\n}\n\nlet warnedAboutRefs = false;\n\n/**\n * Resolve a portfolio image input into a renderable URL (+ intrinsic\n * dimensions when they can be derived). Returns null for empty values and\n * for unresolved Sanity refs — callers skip rendering in that case.\n */\nexport function resolvePortfolioImage(\n  input: string | SanityImageLike | null | undefined,\n): ResolvedPortfolioImage | null {\n  const raw =\n    typeof input === 'string' ? input : input?.asset?._ref ?? '';\n  const value = (raw || '').trim();\n  if (!value) return null;\n\n  if (SANITY_ASSET_REF.test(value)) {\n    if (!warnedAboutRefs && typeof console !== 'undefined') {\n      warnedAboutRefs = true;\n      console.warn(\n        '[@sonordev/agency-site-kit] Received a raw Sanity asset ref instead of an ' +\n          'image URL — skipping render. The Sonor API should resolve image refs to ' +\n          'cdn.sanity.io URLs before returning portfolio sections.',\n      );\n    }\n    return null;\n  }\n\n  // Only absolute http(s) URLs or site-rooted paths are renderable.\n  if (!/^https?:\\/\\//i.test(value) && !value.startsWith('/')) return null;\n\n  const dims = value.match(FILENAME_DIMS);\n  if (dims) {\n    const width = parseInt(dims[1], 10);\n    const height = parseInt(dims[2], 10);\n    if (width > 0 && height > 0) return { url: value, width, height };\n  }\n\n  return { url: value };\n}\n"],"mappings":"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","names":["Image","ScrollReveal"]}

package/dist/portfolio/sections/FeatureSpotlightSection.d.cts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { c as PortfolioFeatureSpotlightData } from '../../types-D0nb6KAx.cjs';
+
+interface FeatureSpotlightSectionProps {
+    data: PortfolioFeatureSpotlightData;
+}
+declare function FeatureSpotlightSection({ data }: FeatureSpotlightSectionProps): React.JSX.Element;
+
+export { FeatureSpotlightSection as default };

package/dist/portfolio/sections/FeatureSpotlightSection.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { c as PortfolioFeatureSpotlightData } from '../../types-D0nb6KAx.js';
+
+interface FeatureSpotlightSectionProps {
+    data: PortfolioFeatureSpotlightData;
+}
+declare function FeatureSpotlightSection({ data }: FeatureSpotlightSectionProps): React.JSX.Element;
+
+export { FeatureSpotlightSection as default };