@sonordev/agency-site-kit 0.3.1 → 0.4.1

package/dist/{TestimonialSection-XPTFUQIN.cjs → portfolio/sections/TestimonialSection.cjs}

@@ -1,40 +1,57 @@
 'use strict';
 
-var chunkKEOHORIH_cjs = require('./chunk-KEOHORIH.cjs');
-var chunkIKBK7HYX_cjs = require('./chunk-IKBK7HYX.cjs');
+var chunkNI4FVCLS_cjs = require('../../chunk-NI4FVCLS.cjs');
+var Image = require('next/image');
+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 Image__default = /*#__PURE__*/_interopDefault(Image);
+var ScrollReveal__default = /*#__PURE__*/_interopDefault(ScrollReveal);
+var GlassCard__default = /*#__PURE__*/_interopDefault(GlassCard);
+
 function StarRating({ rating }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
-    "svg",
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
     {
-      width: "20",
-      height: "20",
-      viewBox: "0 0 20 20",
-      fill: i < rating ? "var(--sk-primary, #6366f1)" : "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        "path",
+      className: "flex items-center gap-1",
+      role: "img",
+      "aria-label": `Rated ${rating} out of 5 stars`,
+      children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+        "svg",
         {
-          d: "M10 1.667l2.575 5.216 5.758.84-4.166 4.06.983 5.734L10 14.808l-5.15 2.709.983-5.734-4.166-4.06 5.758-.84L10 1.667z",
-          stroke: i < rating ? "var(--sk-primary, #6366f1)" : "var(--sk-text-tertiary, #71717a)",
-          strokeWidth: "1.5",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      )
-    },
-    i
-  )) });
+          "aria-hidden": "true",
+          width: "20",
+          height: "20",
+          viewBox: "0 0 20 20",
+          fill: i < rating ? "var(--sk-primary, #6366f1)" : "none",
+          xmlns: "http://www.w3.org/2000/svg",
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M10 1.667l2.575 5.216 5.758.84-4.166 4.06.983 5.734L10 14.808l-5.15 2.709.983-5.734-4.166-4.06 5.758-.84L10 1.667z",
+              stroke: i < rating ? "var(--sk-primary, #6366f1)" : "var(--sk-text-tertiary, #71717a)",
+              strokeWidth: "1.5",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          )
+        },
+        i
+      ))
+    }
+  );
 }
 function TestimonialSection({ data }) {
-  const avatarUrl = data.avatar?.asset?._ref;
+  const avatar = chunkNI4FVCLS_cjs.resolvePortfolioImage(data.avatar);
   return /* @__PURE__ */ jsxRuntime.jsx(
     "section",
     {
       className: "w-full py-20 md:py-28",
       style: { background: "var(--sk-bg, #0a0a0a)" },
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-4xl mx-auto px-6", children: /* @__PURE__ */ jsxRuntime.jsx(chunkIKBK7HYX_cjs.ScrollReveal, { y: 30, duration: 1, children: /* @__PURE__ */ jsxRuntime.jsx(chunkKEOHORIH_cjs.GlassCard, { padding: "lg", hover: false, className: "text-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-6 py-8 px-4 md:px-12", children: [
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-4xl mx-auto px-6", children: /* @__PURE__ */ jsxRuntime.jsx(ScrollReveal__default.default, { y: 30, duration: 1, children: /* @__PURE__ */ jsxRuntime.jsx(GlassCard__default.default, { padding: "lg", hover: false, className: "text-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-6 py-8 px-4 md:px-12", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "svg",
           {
@@ -70,11 +87,13 @@ function TestimonialSection({ data }) {
         ),
         data.rating !== void 0 && data.rating > 0 && /* @__PURE__ */ jsxRuntime.jsx(StarRating, { rating: data.rating }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 mt-2", children: [
-          avatarUrl ? /* @__PURE__ */ jsxRuntime.jsx(
-            "img",
+          avatar ? /* @__PURE__ */ jsxRuntime.jsx(
+            Image__default.default,
             {
-              src: avatarUrl,
+              src: avatar.url,
               alt: data.author,
+              width: 48,
+              height: 48,
               className: "w-12 h-12 rounded-full object-cover",
               style: {
                 border: "2px solid var(--sk-border, rgba(255,255,255,0.1))"
@@ -120,5 +139,5 @@ function TestimonialSection({ data }) {
 }
 
 module.exports = TestimonialSection;
-//# sourceMappingURL=TestimonialSection-XPTFUQIN.cjs.map
-//# sourceMappingURL=TestimonialSection-XPTFUQIN.cjs.map
+//# sourceMappingURL=TestimonialSection.cjs.map
+//# sourceMappingURL=TestimonialSection.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/sections/TestimonialSection.tsx"],"names":["jsx","resolvePortfolioImage","ScrollReveal","GlassCard","jsxs","Image"],"mappings":"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","file":"TestimonialSection.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 Image from 'next/image';\nimport type { PortfolioTestimonialData } from '../../../types';\nimport { resolvePortfolioImage } from '../../../shared/images';\nimport ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';\nimport GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';\n\ninterface TestimonialSectionProps {\n  data: PortfolioTestimonialData;\n}\n\nfunction StarRating({ rating }: { rating: number }) {\n  return (\n    <div\n      className=\"flex items-center gap-1\"\n      role=\"img\"\n      aria-label={`Rated ${rating} out of 5 stars`}\n    >\n      {Array.from({ length: 5 }).map((_, i) => (\n        <svg\n          key={i}\n          aria-hidden=\"true\"\n          width=\"20\"\n          height=\"20\"\n          viewBox=\"0 0 20 20\"\n          fill={i < rating ? 'var(--sk-primary, #6366f1)' : 'none'}\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path\n            d=\"M10 1.667l2.575 5.216 5.758.84-4.166 4.06.983 5.734L10 14.808l-5.15 2.709.983-5.734-4.166-4.06 5.758-.84L10 1.667z\"\n            stroke={i < rating ? 'var(--sk-primary, #6366f1)' : 'var(--sk-text-tertiary, #71717a)'}\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n      ))}\n    </div>\n  );\n}\n\nexport default function TestimonialSection({ data }: TestimonialSectionProps) {\n  const avatar = resolvePortfolioImage(data.avatar);\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} duration={1}>\n          <GlassCard padding=\"lg\" hover={false} className=\"text-center\">\n            <div className=\"flex flex-col items-center gap-6 py-8 px-4 md:px-12\">\n              {/* Quote icon */}\n              <svg\n                width=\"48\"\n                height=\"48\"\n                viewBox=\"0 0 48 48\"\n                fill=\"none\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                style={{ color: 'var(--sk-primary, #6366f1)', opacity: 0.4 }}\n              >\n                <path\n                  d=\"M14 28c-3.314 0-6-2.686-6-6 0-6.627 5.373-12 12-12v4c-4.418 0-8 3.582-8 8h2c3.314 0 6 2.686 6 6s-2.686 6-6 6zm20 0c-3.314 0-6-2.686-6-6 0-6.627 5.373-12 12-12v4c-4.418 0-8 3.582-8 8h2c3.314 0 6 2.686 6 6s-2.686 6-6 6z\"\n                  fill=\"currentColor\"\n                />\n              </svg>\n\n              {/* Quote text */}\n              <blockquote\n                className=\"text-xl md:text-2xl lg:text-3xl font-medium leading-relaxed italic\"\n                style={{\n                  color: 'var(--sk-text-primary, #ffffff)',\n                  fontFamily: 'var(--sk-font-heading, inherit)',\n                }}\n              >\n                &ldquo;{data.quote}&rdquo;\n              </blockquote>\n\n              {/* Rating */}\n              {data.rating !== undefined && data.rating > 0 && (\n                <StarRating rating={data.rating} />\n              )}\n\n              {/* Author */}\n              <div className=\"flex items-center gap-4 mt-2\">\n                {avatar ? (\n                  <Image\n                    src={avatar.url}\n                    alt={data.author}\n                    width={48}\n                    height={48}\n                    className=\"w-12 h-12 rounded-full object-cover\"\n                    style={{\n                      border: '2px solid var(--sk-border, rgba(255,255,255,0.1))',\n                    }}\n                  />\n                ) : (\n                  <div\n                    className=\"flex items-center justify-center w-12 h-12 rounded-full text-sm font-bold\"\n                    style={{\n                      background: 'color-mix(in srgb, var(--sk-primary, #6366f1) 20%, transparent)',\n                      color: 'var(--sk-primary, #6366f1)',\n                    }}\n                  >\n                    {data.author\n                      .split(' ')\n                      .map((w) => w[0])\n                      .join('')\n                      .slice(0, 2)\n                      .toUpperCase()}\n                  </div>\n                )}\n                <div className=\"text-left\">\n                  <div\n                    className=\"font-semibold\"\n                    style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n                  >\n                    {data.author}\n                  </div>\n                  <div\n                    className=\"text-sm\"\n                    style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                  >\n                    {data.title}, {data.company}\n                  </div>\n                </div>\n              </div>\n            </div>\n          </GlassCard>\n        </ScrollReveal>\n      </div>\n    </section>\n  );\n}\n"]}

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

@@ -0,0 +1,9 @@
+import React from 'react';
+import { i as PortfolioTestimonialData } from '../../types-0tVPy4pU.cjs';
+
+interface TestimonialSectionProps {
+    data: PortfolioTestimonialData;
+}
+declare function TestimonialSection({ data }: TestimonialSectionProps): React.JSX.Element;
+
+export { TestimonialSection as default };

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

@@ -0,0 +1,9 @@
+import React from 'react';
+import { i as PortfolioTestimonialData } from '../../types-0tVPy4pU.js';
+
+interface TestimonialSectionProps {
+    data: PortfolioTestimonialData;
+}
+declare function TestimonialSection({ data }: TestimonialSectionProps): React.JSX.Element;
+
+export { TestimonialSection as default };

package/dist/{TestimonialSection-6RGSMXQB.js → portfolio/sections/TestimonialSection.js}

@@ -1,32 +1,43 @@
-import { GlassCard } from './chunk-YB4B3OMC.js';
-import { ScrollReveal } from './chunk-7CFFAKDM.js';
+import { resolvePortfolioImage } from '../../chunk-XJ434N7I.js';
+import Image from 'next/image';
+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';
 
 function StarRating({ rating }) {
-  return /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx(
-    "svg",
+  return /* @__PURE__ */ jsx(
+    "div",
     {
-      width: "20",
-      height: "20",
-      viewBox: "0 0 20 20",
-      fill: i < rating ? "var(--sk-primary, #6366f1)" : "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: /* @__PURE__ */ jsx(
-        "path",
+      className: "flex items-center gap-1",
+      role: "img",
+      "aria-label": `Rated ${rating} out of 5 stars`,
+      children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx(
+        "svg",
         {
-          d: "M10 1.667l2.575 5.216 5.758.84-4.166 4.06.983 5.734L10 14.808l-5.15 2.709.983-5.734-4.166-4.06 5.758-.84L10 1.667z",
-          stroke: i < rating ? "var(--sk-primary, #6366f1)" : "var(--sk-text-tertiary, #71717a)",
-          strokeWidth: "1.5",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      )
-    },
-    i
-  )) });
+          "aria-hidden": "true",
+          width: "20",
+          height: "20",
+          viewBox: "0 0 20 20",
+          fill: i < rating ? "var(--sk-primary, #6366f1)" : "none",
+          xmlns: "http://www.w3.org/2000/svg",
+          children: /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: "M10 1.667l2.575 5.216 5.758.84-4.166 4.06.983 5.734L10 14.808l-5.15 2.709.983-5.734-4.166-4.06 5.758-.84L10 1.667z",
+              stroke: i < rating ? "var(--sk-primary, #6366f1)" : "var(--sk-text-tertiary, #71717a)",
+              strokeWidth: "1.5",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          )
+        },
+        i
+      ))
+    }
+  );
 }
 function TestimonialSection({ data }) {
-  const avatarUrl = data.avatar?.asset?._ref;
+  const avatar = resolvePortfolioImage(data.avatar);
   return /* @__PURE__ */ jsx(
     "section",
     {
@@ -68,11 +79,13 @@ function TestimonialSection({ data }) {
         ),
         data.rating !== void 0 && data.rating > 0 && /* @__PURE__ */ jsx(StarRating, { rating: data.rating }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 mt-2", children: [
-          avatarUrl ? /* @__PURE__ */ jsx(
-            "img",
+          avatar ? /* @__PURE__ */ jsx(
+            Image,
             {
-              src: avatarUrl,
+              src: avatar.url,
               alt: data.author,
+              width: 48,
+              height: 48,
               className: "w-12 h-12 rounded-full object-cover",
               style: {
                 border: "2px solid var(--sk-border, rgba(255,255,255,0.1))"
@@ -118,5 +131,5 @@ function TestimonialSection({ data }) {
 }
 
 export { TestimonialSection as default };
-//# sourceMappingURL=TestimonialSection-6RGSMXQB.js.map
-//# sourceMappingURL=TestimonialSection-6RGSMXQB.js.map
+//# sourceMappingURL=TestimonialSection.js.map
+//# sourceMappingURL=TestimonialSection.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/sections/TestimonialSection.tsx"],"names":[],"mappings":"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","file":"TestimonialSection.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 Image from 'next/image';\nimport type { PortfolioTestimonialData } from '../../../types';\nimport { resolvePortfolioImage } from '../../../shared/images';\nimport ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';\nimport GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';\n\ninterface TestimonialSectionProps {\n  data: PortfolioTestimonialData;\n}\n\nfunction StarRating({ rating }: { rating: number }) {\n  return (\n    <div\n      className=\"flex items-center gap-1\"\n      role=\"img\"\n      aria-label={`Rated ${rating} out of 5 stars`}\n    >\n      {Array.from({ length: 5 }).map((_, i) => (\n        <svg\n          key={i}\n          aria-hidden=\"true\"\n          width=\"20\"\n          height=\"20\"\n          viewBox=\"0 0 20 20\"\n          fill={i < rating ? 'var(--sk-primary, #6366f1)' : 'none'}\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path\n            d=\"M10 1.667l2.575 5.216 5.758.84-4.166 4.06.983 5.734L10 14.808l-5.15 2.709.983-5.734-4.166-4.06 5.758-.84L10 1.667z\"\n            stroke={i < rating ? 'var(--sk-primary, #6366f1)' : 'var(--sk-text-tertiary, #71717a)'}\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n      ))}\n    </div>\n  );\n}\n\nexport default function TestimonialSection({ data }: TestimonialSectionProps) {\n  const avatar = resolvePortfolioImage(data.avatar);\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} duration={1}>\n          <GlassCard padding=\"lg\" hover={false} className=\"text-center\">\n            <div className=\"flex flex-col items-center gap-6 py-8 px-4 md:px-12\">\n              {/* Quote icon */}\n              <svg\n                width=\"48\"\n                height=\"48\"\n                viewBox=\"0 0 48 48\"\n                fill=\"none\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                style={{ color: 'var(--sk-primary, #6366f1)', opacity: 0.4 }}\n              >\n                <path\n                  d=\"M14 28c-3.314 0-6-2.686-6-6 0-6.627 5.373-12 12-12v4c-4.418 0-8 3.582-8 8h2c3.314 0 6 2.686 6 6s-2.686 6-6 6zm20 0c-3.314 0-6-2.686-6-6 0-6.627 5.373-12 12-12v4c-4.418 0-8 3.582-8 8h2c3.314 0 6 2.686 6 6s-2.686 6-6 6z\"\n                  fill=\"currentColor\"\n                />\n              </svg>\n\n              {/* Quote text */}\n              <blockquote\n                className=\"text-xl md:text-2xl lg:text-3xl font-medium leading-relaxed italic\"\n                style={{\n                  color: 'var(--sk-text-primary, #ffffff)',\n                  fontFamily: 'var(--sk-font-heading, inherit)',\n                }}\n              >\n                &ldquo;{data.quote}&rdquo;\n              </blockquote>\n\n              {/* Rating */}\n              {data.rating !== undefined && data.rating > 0 && (\n                <StarRating rating={data.rating} />\n              )}\n\n              {/* Author */}\n              <div className=\"flex items-center gap-4 mt-2\">\n                {avatar ? (\n                  <Image\n                    src={avatar.url}\n                    alt={data.author}\n                    width={48}\n                    height={48}\n                    className=\"w-12 h-12 rounded-full object-cover\"\n                    style={{\n                      border: '2px solid var(--sk-border, rgba(255,255,255,0.1))',\n                    }}\n                  />\n                ) : (\n                  <div\n                    className=\"flex items-center justify-center w-12 h-12 rounded-full text-sm font-bold\"\n                    style={{\n                      background: 'color-mix(in srgb, var(--sk-primary, #6366f1) 20%, transparent)',\n                      color: 'var(--sk-primary, #6366f1)',\n                    }}\n                  >\n                    {data.author\n                      .split(' ')\n                      .map((w) => w[0])\n                      .join('')\n                      .slice(0, 2)\n                      .toUpperCase()}\n                  </div>\n                )}\n                <div className=\"text-left\">\n                  <div\n                    className=\"font-semibold\"\n                    style={{ color: 'var(--sk-text-primary, #ffffff)' }}\n                  >\n                    {data.author}\n                  </div>\n                  <div\n                    className=\"text-sm\"\n                    style={{ color: 'var(--sk-text-tertiary, #71717a)' }}\n                  >\n                    {data.title}, {data.company}\n                  </div>\n                </div>\n              </div>\n            </div>\n          </GlassCard>\n        </ScrollReveal>\n      </div>\n    </section>\n  );\n}\n"]}

package/dist/portfolio/sections/VideoSection.cjs

@@ -0,0 +1,181 @@
+'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/VideoSection.tsx
+var VideoSection_exports = {};
+__export(VideoSection_exports, {
+  default: () => VideoSection
+});
+module.exports = __toCommonJS(VideoSection_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/VideoSection.tsx
+var import_ScrollReveal = __toESM(require("@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal"), 1);
+var import_GlassCard = __toESM(require("@sonordev/agency-site-kit/portfolio/primitives/GlassCard"), 1);
+var import_jsx_runtime = require("react/jsx-runtime");
+function getEmbedUrl(data) {
+  if (data.embedUrl) return data.embedUrl;
+  if (!data.url) return "";
+  const ytMatch = data.url.match(
+    /(?:youtube\.com\/(?:watch\?v=|embed\/)|youtu\.be\/)([a-zA-Z0-9_-]{11})/
+  );
+  if (ytMatch) return `https://www.youtube.com/embed/${ytMatch[1]}?autoplay=1`;
+  const vimeoMatch = data.url.match(/vimeo\.com\/(\d+)/);
+  if (vimeoMatch) return `https://player.vimeo.com/video/${vimeoMatch[1]}?autoplay=1`;
+  return data.url;
+}
+function VideoSection({ data }) {
+  const [playing, setPlaying] = (0, import_react.useState)(false);
+  const thumbnail = resolvePortfolioImage(data.thumbnail);
+  const embedUrl = getEmbedUrl(data);
+  const handlePlay = (0, import_react.useCallback)(() => {
+    if (embedUrl) setPlaying(true);
+  }, [embedUrl]);
+  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.jsxs)("div", { className: "max-w-5xl mx-auto px-6", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ScrollReveal.default, { y: 30, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "h2",
+          {
+            className: "text-3xl md:text-4xl font-bold mb-4",
+            style: {
+              color: "var(--sk-text-primary, #ffffff)",
+              fontFamily: "var(--sk-font-heading, inherit)"
+            },
+            children: data.title
+          }
+        ) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ScrollReveal.default, { y: 40, delay: 0.15, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_GlassCard.default, { padding: "sm", hover: false, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative w-full overflow-hidden rounded-xl", style: { aspectRatio: "16/9" }, children: playing ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "iframe",
+          {
+            src: embedUrl,
+            className: "absolute inset-0 w-full h-full",
+            allow: "autoplay; fullscreen; picture-in-picture",
+            allowFullScreen: true,
+            title: data.title,
+            style: { border: "none" }
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "button",
+          {
+            onClick: handlePlay,
+            className: "absolute inset-0 w-full h-full group cursor-pointer",
+            "aria-label": `Play ${data.title}`,
+            children: [
+              thumbnail && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_image.default,
+                {
+                  src: thumbnail.url,
+                  alt: data.title,
+                  fill: true,
+                  sizes: "(max-width: 1024px) 100vw, 976px",
+                  className: "object-cover"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "div",
+                {
+                  className: "absolute inset-0 transition-opacity duration-300 group-hover:opacity-60",
+                  style: { background: "rgba(0,0,0,0.4)", opacity: 0.5 }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "div",
+                {
+                  className: "flex items-center justify-center w-20 h-20 rounded-full transition-transform duration-300 group-hover:scale-110",
+                  style: {
+                    background: "var(--sk-primary, #6366f1)",
+                    boxShadow: "0 8px 32px color-mix(in srgb, var(--sk-primary, #6366f1) 40%, transparent)"
+                  },
+                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    "svg",
+                    {
+                      width: "32",
+                      height: "32",
+                      viewBox: "0 0 32 32",
+                      fill: "none",
+                      xmlns: "http://www.w3.org/2000/svg",
+                      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 8l14 8-14 8V8z", fill: "#ffffff" })
+                    }
+                  )
+                }
+              ) }),
+              data.duration && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "span",
+                {
+                  className: "absolute bottom-4 right-4 px-3 py-1 rounded-lg text-xs font-medium",
+                  style: {
+                    background: "rgba(0,0,0,0.6)",
+                    color: "#ffffff",
+                    backdropFilter: "blur(4px)"
+                  },
+                  children: data.duration
+                }
+              )
+            ]
+          }
+        ) }) }) })
+      ] })
+    }
+  );
+}
+//# sourceMappingURL=VideoSection.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/sections/VideoSection.tsx","../../../src/shared/images.ts"],"sourcesContent":["'use client';\n\nimport React, { useState, useCallback } from 'react';\nimport Image from 'next/image';\nimport type { PortfolioVideoData } from '../../../types';\nimport { resolvePortfolioImage } from '../../../shared/images';\nimport ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';\nimport GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';\n\ninterface VideoSectionProps {\n  data: PortfolioVideoData;\n}\n\nfunction getEmbedUrl(data: PortfolioVideoData): string {\n  if (data.embedUrl) return data.embedUrl;\n  if (!data.url) return '';\n\n  // Parse YouTube URLs\n  const ytMatch = data.url.match(\n    /(?:youtube\\.com\\/(?:watch\\?v=|embed\\/)|youtu\\.be\\/)([a-zA-Z0-9_-]{11})/,\n  );\n  if (ytMatch) return `https://www.youtube.com/embed/${ytMatch[1]}?autoplay=1`;\n\n  // Parse Vimeo URLs\n  const vimeoMatch = data.url.match(/vimeo\\.com\\/(\\d+)/);\n  if (vimeoMatch) return `https://player.vimeo.com/video/${vimeoMatch[1]}?autoplay=1`;\n\n  return data.url;\n}\n\nexport default function VideoSection({ data }: VideoSectionProps) {\n  const [playing, setPlaying] = useState(false);\n\n  const thumbnail = resolvePortfolioImage(data.thumbnail);\n  const embedUrl = getEmbedUrl(data);\n\n  const handlePlay = useCallback(() => {\n    if (embedUrl) setPlaying(true);\n  }, [embedUrl]);\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            {data.title}\n          </h2>\n        </ScrollReveal>\n\n        <ScrollReveal y={40} delay={0.15}>\n          <GlassCard padding=\"sm\" hover={false}>\n            <div className=\"relative w-full overflow-hidden rounded-xl\" style={{ aspectRatio: '16/9' }}>\n              {playing ? (\n                <iframe\n                  src={embedUrl}\n                  className=\"absolute inset-0 w-full h-full\"\n                  allow=\"autoplay; fullscreen; picture-in-picture\"\n                  allowFullScreen\n                  title={data.title}\n                  style={{ border: 'none' }}\n                />\n              ) : (\n                <button\n                  onClick={handlePlay}\n                  className=\"absolute inset-0 w-full h-full group cursor-pointer\"\n                  aria-label={`Play ${data.title}`}\n                >\n                  {/* Thumbnail */}\n                  {thumbnail && (\n                    <Image\n                      src={thumbnail.url}\n                      alt={data.title}\n                      fill\n                      sizes=\"(max-width: 1024px) 100vw, 976px\"\n                      className=\"object-cover\"\n                    />\n                  )}\n\n                  {/* Dark overlay */}\n                  <div\n                    className=\"absolute inset-0 transition-opacity duration-300 group-hover:opacity-60\"\n                    style={{ background: 'rgba(0,0,0,0.4)', opacity: 0.5 }}\n                  />\n\n                  {/* Play button */}\n                  <div className=\"absolute inset-0 flex items-center justify-center\">\n                    <div\n                      className=\"flex items-center justify-center w-20 h-20 rounded-full transition-transform duration-300 group-hover:scale-110\"\n                      style={{\n                        background: 'var(--sk-primary, #6366f1)',\n                        boxShadow: '0 8px 32px color-mix(in srgb, var(--sk-primary, #6366f1) 40%, transparent)',\n                      }}\n                    >\n                      <svg\n                        width=\"32\"\n                        height=\"32\"\n                        viewBox=\"0 0 32 32\"\n                        fill=\"none\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                      >\n                        <path d=\"M12 8l14 8-14 8V8z\" fill=\"#ffffff\" />\n                      </svg>\n                    </div>\n                  </div>\n\n                  {/* Duration badge */}\n                  {data.duration && (\n                    <span\n                      className=\"absolute bottom-4 right-4 px-3 py-1 rounded-lg text-xs font-medium\"\n                      style={{\n                        background: 'rgba(0,0,0,0.6)',\n                        color: '#ffffff',\n                        backdropFilter: 'blur(4px)',\n                      }}\n                    >\n                      {data.duration}\n                    </span>\n                  )}\n                </button>\n              )}\n            </div>\n          </GlassCard>\n        </ScrollReveal>\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":["ScrollReveal","GlassCard","Image"]}

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

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

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

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

package/dist/{VideoSection-4A2HC6K6.js → portfolio/sections/VideoSection.js}

@@ -1,9 +1,15 @@
 'use client';
-import { GlassCard } from './chunk-YB4B3OMC.js';
-import { ScrollReveal } from './chunk-7CFFAKDM.js';
-import { useState, useCallback } from 'react';
-import { jsx, jsxs } from 'react/jsx-runtime';
+"use client";
+import {
+  resolvePortfolioImage
+} from "../../chunk-QDXZ27R7.js";
 
+// src/portfolio/components/sections/VideoSection.tsx
+import { useState, useCallback } from "react";
+import Image from "next/image";
+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";
 function getEmbedUrl(data) {
   if (data.embedUrl) return data.embedUrl;
   if (!data.url) return "";
@@ -17,7 +23,7 @@ function getEmbedUrl(data) {
 }
 function VideoSection({ data }) {
   const [playing, setPlaying] = useState(false);
-  const thumbnailUrl = data.thumbnail?.asset?._ref || "";
+  const thumbnail = resolvePortfolioImage(data.thumbnail);
   const embedUrl = getEmbedUrl(data);
   const handlePlay = useCallback(() => {
     if (embedUrl) setPlaying(true);
@@ -56,12 +62,14 @@ function VideoSection({ data }) {
             className: "absolute inset-0 w-full h-full group cursor-pointer",
             "aria-label": `Play ${data.title}`,
             children: [
-              thumbnailUrl && /* @__PURE__ */ jsx(
-                "img",
+              thumbnail && /* @__PURE__ */ jsx(
+                Image,
                 {
-                  src: thumbnailUrl,
+                  src: thumbnail.url,
                   alt: data.title,
-                  className: "w-full h-full object-cover"
+                  fill: true,
+                  sizes: "(max-width: 1024px) 100vw, 976px",
+                  className: "object-cover"
                 }
               ),
               /* @__PURE__ */ jsx(
@@ -111,7 +119,7 @@ function VideoSection({ data }) {
     }
   );
 }
-
-export { VideoSection as default };
-//# sourceMappingURL=VideoSection-4A2HC6K6.js.map
-//# sourceMappingURL=VideoSection-4A2HC6K6.js.map
+export {
+  VideoSection as default
+};
+//# sourceMappingURL=VideoSection.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/portfolio/components/sections/VideoSection.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, useCallback } from 'react';\nimport Image from 'next/image';\nimport type { PortfolioVideoData } from '../../../types';\nimport { resolvePortfolioImage } from '../../../shared/images';\nimport ScrollReveal from '@sonordev/agency-site-kit/portfolio/primitives/ScrollReveal';\nimport GlassCard from '@sonordev/agency-site-kit/portfolio/primitives/GlassCard';\n\ninterface VideoSectionProps {\n  data: PortfolioVideoData;\n}\n\nfunction getEmbedUrl(data: PortfolioVideoData): string {\n  if (data.embedUrl) return data.embedUrl;\n  if (!data.url) return '';\n\n  // Parse YouTube URLs\n  const ytMatch = data.url.match(\n    /(?:youtube\\.com\\/(?:watch\\?v=|embed\\/)|youtu\\.be\\/)([a-zA-Z0-9_-]{11})/,\n  );\n  if (ytMatch) return `https://www.youtube.com/embed/${ytMatch[1]}?autoplay=1`;\n\n  // Parse Vimeo URLs\n  const vimeoMatch = data.url.match(/vimeo\\.com\\/(\\d+)/);\n  if (vimeoMatch) return `https://player.vimeo.com/video/${vimeoMatch[1]}?autoplay=1`;\n\n  return data.url;\n}\n\nexport default function VideoSection({ data }: VideoSectionProps) {\n  const [playing, setPlaying] = useState(false);\n\n  const thumbnail = resolvePortfolioImage(data.thumbnail);\n  const embedUrl = getEmbedUrl(data);\n\n  const handlePlay = useCallback(() => {\n    if (embedUrl) setPlaying(true);\n  }, [embedUrl]);\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            {data.title}\n          </h2>\n        </ScrollReveal>\n\n        <ScrollReveal y={40} delay={0.15}>\n          <GlassCard padding=\"sm\" hover={false}>\n            <div className=\"relative w-full overflow-hidden rounded-xl\" style={{ aspectRatio: '16/9' }}>\n              {playing ? (\n                <iframe\n                  src={embedUrl}\n                  className=\"absolute inset-0 w-full h-full\"\n                  allow=\"autoplay; fullscreen; picture-in-picture\"\n                  allowFullScreen\n                  title={data.title}\n                  style={{ border: 'none' }}\n                />\n              ) : (\n                <button\n                  onClick={handlePlay}\n                  className=\"absolute inset-0 w-full h-full group cursor-pointer\"\n                  aria-label={`Play ${data.title}`}\n                >\n                  {/* Thumbnail */}\n                  {thumbnail && (\n                    <Image\n                      src={thumbnail.url}\n                      alt={data.title}\n                      fill\n                      sizes=\"(max-width: 1024px) 100vw, 976px\"\n                      className=\"object-cover\"\n                    />\n                  )}\n\n                  {/* Dark overlay */}\n                  <div\n                    className=\"absolute inset-0 transition-opacity duration-300 group-hover:opacity-60\"\n                    style={{ background: 'rgba(0,0,0,0.4)', opacity: 0.5 }}\n                  />\n\n                  {/* Play button */}\n                  <div className=\"absolute inset-0 flex items-center justify-center\">\n                    <div\n                      className=\"flex items-center justify-center w-20 h-20 rounded-full transition-transform duration-300 group-hover:scale-110\"\n                      style={{\n                        background: 'var(--sk-primary, #6366f1)',\n                        boxShadow: '0 8px 32px color-mix(in srgb, var(--sk-primary, #6366f1) 40%, transparent)',\n                      }}\n                    >\n                      <svg\n                        width=\"32\"\n                        height=\"32\"\n                        viewBox=\"0 0 32 32\"\n                        fill=\"none\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                      >\n                        <path d=\"M12 8l14 8-14 8V8z\" fill=\"#ffffff\" />\n                      </svg>\n                    </div>\n                  </div>\n\n                  {/* Duration badge */}\n                  {data.duration && (\n                    <span\n                      className=\"absolute bottom-4 right-4 px-3 py-1 rounded-lg text-xs font-medium\"\n                      style={{\n                        background: 'rgba(0,0,0,0.6)',\n                        color: '#ffffff',\n                        backdropFilter: 'blur(4px)',\n                      }}\n                    >\n                      {data.duration}\n                    </span>\n                  )}\n                </button>\n              )}\n            </div>\n          </GlassCard>\n        </ScrollReveal>\n      </div>\n    </section>\n  );\n}\n"],"mappings":";;;;;;;AAEA,SAAgB,UAAU,mBAAmB;AAC7C,OAAO,WAAW;AAGlB,OAAO,kBAAkB;AACzB,OAAO,eAAe;AAwCZ,cAwBM,YAxBN;AAlCV,SAAS,YAAY,MAAkC;AACrD,MAAI,KAAK,SAAU,QAAO,KAAK;AAC/B,MAAI,CAAC,KAAK,IAAK,QAAO;AAGtB,QAAM,UAAU,KAAK,IAAI;AAAA,IACvB;AAAA,EACF;AACA,MAAI,QAAS,QAAO,iCAAiC,QAAQ,CAAC,CAAC;AAG/D,QAAM,aAAa,KAAK,IAAI,MAAM,mBAAmB;AACrD,MAAI,WAAY,QAAO,kCAAkC,WAAW,CAAC,CAAC;AAEtE,SAAO,KAAK;AACd;AAEe,SAAR,aAA8B,EAAE,KAAK,GAAsB;AAChE,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,QAAM,YAAY,sBAAsB,KAAK,SAAS;AACtD,QAAM,WAAW,YAAY,IAAI;AAEjC,QAAM,aAAa,YAAY,MAAM;AACnC,QAAI,SAAU,YAAW,IAAI;AAAA,EAC/B,GAAG,CAAC,QAAQ,CAAC;AAEb,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,EAAE,YAAY,wBAAwB;AAAA,MAE7C,+BAAC,SAAI,WAAU,0BACb;AAAA,4BAAC,gBAAa,GAAG,IACf;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO;AAAA,cACL,OAAO;AAAA,cACP,YAAY;AAAA,YACd;AAAA,YAEC,eAAK;AAAA;AAAA,QACR,GACF;AAAA,QAEA,oBAAC,gBAAa,GAAG,IAAI,OAAO,MAC1B,8BAAC,aAAU,SAAQ,MAAK,OAAO,OAC7B,8BAAC,SAAI,WAAU,8CAA6C,OAAO,EAAE,aAAa,OAAO,GACtF,oBACC;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,WAAU;AAAA,YACV,OAAM;AAAA,YACN,iBAAe;AAAA,YACf,OAAO,KAAK;AAAA,YACZ,OAAO,EAAE,QAAQ,OAAO;AAAA;AAAA,QAC1B,IAEA;AAAA,UAAC;AAAA;AAAA,YACC,SAAS;AAAA,YACT,WAAU;AAAA,YACV,cAAY,QAAQ,KAAK,KAAK;AAAA,YAG7B;AAAA,2BACC;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAK,UAAU;AAAA,kBACf,KAAK,KAAK;AAAA,kBACV,MAAI;AAAA,kBACJ,OAAM;AAAA,kBACN,WAAU;AAAA;AAAA,cACZ;AAAA,cAIF;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBACV,OAAO,EAAE,YAAY,mBAAmB,SAAS,IAAI;AAAA;AAAA,cACvD;AAAA,cAGA,oBAAC,SAAI,WAAU,qDACb;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBACV,OAAO;AAAA,oBACL,YAAY;AAAA,oBACZ,WAAW;AAAA,kBACb;AAAA,kBAEA;AAAA,oBAAC;AAAA;AAAA,sBACC,OAAM;AAAA,sBACN,QAAO;AAAA,sBACP,SAAQ;AAAA,sBACR,MAAK;AAAA,sBACL,OAAM;AAAA,sBAEN,8BAAC,UAAK,GAAE,sBAAqB,MAAK,WAAU;AAAA;AAAA,kBAC9C;AAAA;AAAA,cACF,GACF;AAAA,cAGC,KAAK,YACJ;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBACV,OAAO;AAAA,oBACL,YAAY;AAAA,oBACZ,OAAO;AAAA,oBACP,gBAAgB;AAAA,kBAClB;AAAA,kBAEC,eAAK;AAAA;AAAA,cACR;AAAA;AAAA;AAAA,QAEJ,GAEJ,GACF,GACF;AAAA,SACF;AAAA;AAAA,EACF;AAEJ;","names":[]}