@sonordev/agency-site-kit 0.1.0 → 0.1.2

package/dist/{chunk-XMC4DN6G.js → chunk-APG2QSMB.js}

@@ -4,13 +4,13 @@ import Image from 'next/image';
 import Link from 'next/link';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-function PortfolioCard({ item, className = "" }) {
-  const thumbnailSrc = item.hero_screenshots?.desktop || item.hero_image;
+function PortfolioCard({ item, className = "", basePath = "/work" }) {
+  const thumbnailSrc = item.hero_screenshots?.desktop || item.hero_image || (item.project_id ? `/portfolio-previews/${item.slug}.png` : void 0);
   const kpis = Array.isArray(item.kpis) ? item.kpis : [];
   const services = Array.isArray(item.services) ? item.services : [];
   const kpiPreview = kpis.slice(0, 3);
   const servicePreview = services.slice(0, 3);
-  return /* @__PURE__ */ jsx(Link, { href: `/portfolio/${item.slug}`, className: `block group ${className}`, children: /* @__PURE__ */ jsx(GlassCard, { padding: "sm", hover: true, children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+  return /* @__PURE__ */ jsx(Link, { href: `${basePath}/${item.slug}`, className: `block group ${className}`, children: /* @__PURE__ */ jsx(GlassCard, { padding: "sm", hover: true, children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
     thumbnailSrc && /* @__PURE__ */ jsxs(
       "div",
       {
@@ -36,7 +36,7 @@ function PortfolioCard({ item, className = "" }) {
                 color: "#ffffff",
                 backdropFilter: "blur(8px)"
               },
-              children: item.category
+              children: item.category?.replace(/[-_]/g, " ").replace(/\b\w/g, (c) => c.toUpperCase())
             }
           )
         ]
@@ -113,7 +113,7 @@ function PortfolioCard({ item, className = "" }) {
     ] })
   ] }) }) });
 }
-function PortfolioGrid({ items, className = "" }) {
+function PortfolioGrid({ items, className = "", basePath = "/work" }) {
   return /* @__PURE__ */ jsx(ScrollReveal, { stagger: 0.1, children: /* @__PURE__ */ jsx(
     "div",
     {
@@ -121,11 +121,11 @@ function PortfolioGrid({ items, className = "" }) {
       style: {
         gap: "var(--sk-grid-gap, 24px)"
       },
-      children: items.map((item) => /* @__PURE__ */ jsx(PortfolioCard, { item }, item.id))
+      children: items.map((item) => /* @__PURE__ */ jsx(PortfolioCard, { item, basePath }, item.id))
     }
   ) });
 }
 
 export { PortfolioCard, PortfolioGrid };
-//# sourceMappingURL=chunk-XMC4DN6G.js.map
-//# sourceMappingURL=chunk-XMC4DN6G.js.map
+//# sourceMappingURL=chunk-APG2QSMB.js.map
+//# sourceMappingURL=chunk-APG2QSMB.js.map

package/dist/chunk-APG2QSMB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/portfolio/components/PortfolioCard.tsx","../src/portfolio/components/PortfolioGrid.tsx"],"names":["jsx"],"mappings":";;;;;;AAee,SAAR,cAA+B,EAAE,IAAA,EAAM,YAAY,EAAA,EAAI,QAAA,GAAW,SAAQ,EAAuB;AAEtG,EAAA,MAAM,YAAA,GACJ,IAAA,CAAK,gBAAA,EAAkB,OAAA,IACvB,IAAA,CAAK,UAAA,KACJ,IAAA,CAAK,UAAA,GAAa,CAAA,oBAAA,EAAuB,IAAA,CAAK,IAAI,CAAA,IAAA,CAAA,GAAS,MAAA,CAAA;AAC9D,EAAA,MAAM,IAAA,GAAO,MAAM,OAAA,CAAQ,IAAA,CAAK,IAAI,CAAA,GAAI,IAAA,CAAK,OAAO,EAAC;AACrD,EAAA,MAAM,QAAA,GAAW,MAAM,OAAA,CAAQ,IAAA,CAAK,QAAQ,CAAA,GAAI,IAAA,CAAK,WAAW,EAAC;AACjE,EAAA,MAAM,UAAA,GAAa,IAAA,CAAK,KAAA,CAAM,CAAA,EAAG,CAAC,CAAA;AAClC,EAAA,MAAM,cAAA,GAAiB,QAAA,CAAS,KAAA,CAAM,CAAA,EAAG,CAAC,CAAA;AAE1C,EAAA,uBACE,GAAA,CAAC,QAAK,IAAA,EAAM,CAAA,EAAG,QAAQ,CAAA,CAAA,EAAI,IAAA,CAAK,IAAI,CAAA,CAAA,EAAI,SAAA,EAAW,CAAA,YAAA,EAAe,SAAS,CAAA,CAAA,EACzE,QAAA,kBAAA,GAAA,CAAC,aAAU,OAAA,EAAQ,IAAA,EAAK,OAAK,IAAA,EAC3B,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EAEZ,QAAA,EAAA;AAAA,IAAA,YAAA,oBACC,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAU,4CAAA;AAAA,QACV,KAAA,EAAO,EAAE,WAAA,EAAa,OAAA,EAAQ;AAAA,QAE9B,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,GAAA,EAAK,YAAA;AAAA,cACL,GAAA,EAAK,IAAA,CAAK,cAAA,IAAkB,IAAA,CAAK,KAAA;AAAA,cACjC,IAAA,EAAI,IAAA;AAAA,cACJ,KAAA,EAAM,0DAAA;AAAA,cACN,SAAA,EAAU;AAAA;AAAA,WACZ;AAAA,0BAEA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAU,iGAAA;AAAA,cACV,KAAA,EAAO;AAAA,gBACL,UAAA,EAAY,iEAAA;AAAA,gBACZ,KAAA,EAAO,SAAA;AAAA,gBACP,cAAA,EAAgB;AAAA,eAClB;AAAA,cAEC,QAAA,EAAA,IAAA,CAAK,QAAA,EAAU,OAAA,CAAQ,OAAA,EAAS,GAAG,CAAA,CAAE,OAAA,CAAQ,OAAA,EAAS,CAAC,CAAA,KAAc,CAAA,CAAE,WAAA,EAAa;AAAA;AAAA;AACvF;AAAA;AAAA,KACF;AAAA,oBAIF,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,+BAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAU,oCAAA;AAAA,UACV,KAAA,EAAO,EAAE,KAAA,EAAO,iCAAA,EAAkC;AAAA,UAEjD,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA,OACR;AAAA,MAEC,KAAK,QAAA,oBACJ,GAAA;AAAA,QAAC,GAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAU,sBAAA;AAAA,UACV,KAAA,EAAO,EAAE,KAAA,EAAO,kCAAA,EAAmC;AAAA,UAElD,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA,OACR;AAAA,MAID,UAAA,CAAW,MAAA,GAAS,CAAA,oBACnB,GAAA,CAAC,SAAI,SAAA,EAAU,8BAAA,EACZ,QAAA,EAAA,UAAA,CAAW,GAAA,CAAI,CAAC,GAAA,EAAK,CAAA,qBACpB,IAAA,CAAC,KAAA,EAAA,EAAY,WAAU,eAAA,EACrB,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAU,qBAAA;AAAA,YACV,KAAA,EAAO,EAAE,KAAA,EAAO,4BAAA,EAA6B;AAAA,YAE5C,QAAA,EAAA;AAAA,cAAA,GAAA,CAAI,MAAA,IAAU,EAAA;AAAA,cACd,GAAA,CAAI,MAAM,cAAA,EAAe;AAAA,cACzB,GAAA,CAAI;AAAA;AAAA;AAAA,SACP;AAAA,wBACA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAU,kDAAA;AAAA,YACV,KAAA,EAAO,EAAE,KAAA,EAAO,kCAAA,EAAmC;AAAA,YAElD,QAAA,EAAA,GAAA,CAAI;AAAA;AAAA;AACP,OAAA,EAAA,EAdQ,CAeV,CACD,CAAA,EACH,CAAA;AAAA,MAID,eAAe,MAAA,GAAS,CAAA,oBACvB,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,6BAAA,EACZ,QAAA,EAAA;AAAA,QAAA,cAAA,CAAe,GAAA,CAAI,CAAC,OAAA,qBACnB,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YAEC,SAAA,EAAU,oDAAA;AAAA,YACV,KAAA,EAAO;AAAA,cACL,UAAA,EAAY,2CAAA;AAAA,cACZ,KAAA,EAAO,mCAAA;AAAA,cACP,MAAA,EAAQ;AAAA,aACV;AAAA,YAEC,QAAA,EAAA;AAAA,WAAA;AAAA,UARI;AAAA,SAUR,CAAA;AAAA,QACA,QAAA,CAAS,SAAS,CAAA,oBACjB,IAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAU,oDAAA;AAAA,YACV,KAAA,EAAO;AAAA,cACL,UAAA,EAAY,2CAAA;AAAA,cACZ,KAAA,EAAO;AAAA,aACT;AAAA,YACD,QAAA,EAAA;AAAA,cAAA,GAAA;AAAA,cACG,IAAA,CAAK,SAAS,MAAA,GAAS;AAAA;AAAA;AAAA;AAC3B,OAAA,EAEJ;AAAA,KAAA,EAEJ;AAAA,GAAA,EACF,GACF,CAAA,EACF,CAAA;AAEJ;ACvHe,SAAR,cAA+B,EAAE,KAAA,EAAO,YAAY,EAAA,EAAI,QAAA,GAAW,SAAQ,EAAuB;AACvG,EAAA,uBACEA,GAAAA,CAAC,YAAA,EAAA,EAAa,OAAA,EAAS,KACrB,QAAA,kBAAAA,GAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,kDAAkD,SAAS,CAAA,CAAA;AAAA,MACtE,KAAA,EAAO;AAAA,QACL,GAAA,EAAK;AAAA,OACP;AAAA,MAEC,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,qBACVA,GAAAA,CAAC,aAAA,EAAA,EAA4B,IAAA,EAAY,QAAA,EAAA,EAArB,IAAA,CAAK,EAAoC,CAC9D;AAAA;AAAA,GACH,EACF,CAAA;AAEJ","file":"chunk-APG2QSMB.js","sourcesContent":["'use client';\n\nimport React from 'react';\nimport Image from 'next/image';\nimport Link from 'next/link';\nimport type { PortfolioItem } from '../../types';\nimport GlassCard from './primitives/GlassCard';\n\ninterface PortfolioCardProps {\n  item: PortfolioItem;\n  className?: string;\n  /** Base path for portfolio detail links (default: '/work') */\n  basePath?: string;\n}\n\nexport default function PortfolioCard({ item, className = '', basePath = '/work' }: PortfolioCardProps) {\n  // Use hero_screenshots desktop → hero_image → trifolio screenshot convention\n  const thumbnailSrc =\n    item.hero_screenshots?.desktop ||\n    item.hero_image ||\n    (item.project_id ? `/portfolio-previews/${item.slug}.png` : undefined);\n  const kpis = Array.isArray(item.kpis) ? item.kpis : [];\n  const services = Array.isArray(item.services) ? item.services : [];\n  const kpiPreview = kpis.slice(0, 3);\n  const servicePreview = services.slice(0, 3);\n\n  return (\n    <Link href={`${basePath}/${item.slug}`} className={`block group ${className}`}>\n      <GlassCard padding=\"sm\" hover>\n        <div className=\"flex flex-col gap-4\">\n          {/* Thumbnail */}\n          {thumbnailSrc && (\n            <div\n              className=\"relative w-full overflow-hidden rounded-xl\"\n              style={{ aspectRatio: '16/10' }}\n            >\n              <Image\n                src={thumbnailSrc}\n                alt={item.hero_image_alt || item.title}\n                fill\n                sizes=\"(max-width: 768px) 100vw, (max-width: 1024px) 50vw, 33vw\"\n                className=\"object-cover object-top transition-transform duration-500 group-hover:scale-105\"\n              />\n              {/* Category badge */}\n              <span\n                className=\"absolute top-3 left-3 px-3 py-1 rounded-full text-[11px] uppercase tracking-wider font-semibold\"\n                style={{\n                  background: 'color-mix(in srgb, var(--sk-primary, #6366f1) 80%, transparent)',\n                  color: '#ffffff',\n                  backdropFilter: 'blur(8px)',\n                }}\n              >\n                {item.category?.replace(/[-_]/g, ' ').replace(/\\b\\w/g, (c: string) => c.toUpperCase())}\n              </span>\n            </div>\n          )}\n\n          {/* Text content */}\n          <div className=\"flex flex-col gap-2 px-2 pb-2\">\n            <h3\n              className=\"text-lg font-semibold line-clamp-1\"\n              style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n            >\n              {item.title}\n            </h3>\n\n            {item.subtitle && (\n              <p\n                className=\"text-sm line-clamp-2\"\n                style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n              >\n                {item.subtitle}\n              </p>\n            )}\n\n            {/* KPI preview */}\n            {kpiPreview.length > 0 && (\n              <div className=\"flex items-center gap-4 mt-1\">\n                {kpiPreview.map((kpi, i) => (\n                  <div key={i} className=\"flex flex-col\">\n                    <span\n                      className=\"text-base font-bold\"\n                      style={{ color: 'var(--sk-primary, #6366f1)' }}\n                    >\n                      {kpi.prefix || ''}\n                      {kpi.value.toLocaleString()}\n                      {kpi.suffix}\n                    </span>\n                    <span\n                      className=\"text-[10px] uppercase tracking-wider font-medium\"\n                      style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                    >\n                      {kpi.label}\n                    </span>\n                  </div>\n                ))}\n              </div>\n            )}\n\n            {/* Services tags */}\n            {servicePreview.length > 0 && (\n              <div className=\"flex flex-wrap gap-1.5 mt-2\">\n                {servicePreview.map((service) => (\n                  <span\n                    key={service}\n                    className=\"px-2.5 py-0.5 rounded-full text-[11px] font-medium\"\n                    style={{\n                      background: 'var(--sk-surface, rgba(255,255,255,0.05))',\n                      color: 'var(--sk-text-secondary, #a1a1aa)',\n                      border: '1px solid var(--sk-border, rgba(255,255,255,0.1))',\n                    }}\n                  >\n                    {service}\n                  </span>\n                ))}\n                {services.length > 3 && (\n                  <span\n                    className=\"px-2.5 py-0.5 rounded-full text-[11px] font-medium\"\n                    style={{\n                      background: 'var(--sk-surface, rgba(255,255,255,0.05))',\n                      color: 'var(--sk-text-tertiary, #71717a)',\n                    }}\n                  >\n                    +{item.services.length - 3}\n                  </span>\n                )}\n              </div>\n            )}\n          </div>\n        </div>\n      </GlassCard>\n    </Link>\n  );\n}\n","'use client';\n\nimport React from 'react';\nimport type { PortfolioItem } from '../../types';\nimport ScrollReveal from './primitives/ScrollReveal';\nimport PortfolioCard from './PortfolioCard';\n\ninterface PortfolioGridProps {\n  items: PortfolioItem[];\n  className?: string;\n  /** Base path for portfolio detail links (default: '/work') */\n  basePath?: string;\n}\n\nexport default function PortfolioGrid({ items, className = '', basePath = '/work' }: PortfolioGridProps) {\n  return (\n    <ScrollReveal stagger={0.1}>\n      <div\n        className={`grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 ${className}`}\n        style={{\n          gap: 'var(--sk-grid-gap, 24px)',\n        }}\n      >\n        {items.map((item) => (\n          <PortfolioCard key={item.id} item={item} basePath={basePath} />\n        ))}\n      </div>\n    </ScrollReveal>\n  );\n}\n"]}