@cogentic-co/ds 0.5.3 → 0.6.0

package/dist/animations/animation-jira-ticket.js

@@ -1,6 +1,117 @@
 "use client";
-export { AnimationJiraTicket as default } from '../chunk-BTZB4JRC.js';
-import '../chunk-TAPJEVUA.js';
-import '../chunk-GZNLQE3I.js';
+import { EASE_OUT } from '../chunk-TAPJEVUA.js';
+import { cn } from '../chunk-GZNLQE3I.js';
+import { motion } from 'motion/react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function AnimationJiraTicket({ className }) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col bg-white p-4", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-[10px] text-gray-400", children: [
+      /* @__PURE__ */ jsx("span", { children: "COGENTIC" }),
+      /* @__PURE__ */ jsx("span", { children: "/" }),
+      /* @__PURE__ */ jsx("span", { children: "Compliance Reviews" }),
+      /* @__PURE__ */ jsx("span", { children: "/" }),
+      /* @__PURE__ */ jsx("span", { className: "text-gray-600", children: "COG-847" })
+    ] }),
+    /* @__PURE__ */ jsxs(
+      motion.div,
+      {
+        initial: { opacity: 0, y: 8 },
+        animate: { opacity: 1, y: 0 },
+        transition: { duration: 0.5, ease: EASE_OUT, delay: 0.2 },
+        children: [
+          /* @__PURE__ */ jsx("h4", { className: "mt-2 font-semibold text-[14px] text-gray-900 leading-snug", children: "Review: TXN-0847 \u2014 High risk corridor" }),
+          /* @__PURE__ */ jsxs(
+            motion.div,
+            {
+              initial: { opacity: 0 },
+              animate: { opacity: 1 },
+              transition: { duration: 0.3, delay: 0.5 },
+              className: "mt-2.5 flex flex-wrap items-center gap-2",
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "rounded bg-blue-100 px-2 py-0.5 font-bold text-[10px] text-blue-700", children: "IN REVIEW" }),
+                /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 text-[10px] text-gray-500", children: [
+                  /* @__PURE__ */ jsxs("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", children: [
+                    /* @__PURE__ */ jsx("path", { d: "M5 2V5L7 6.5", stroke: "currentColor", strokeWidth: "1", strokeLinecap: "round" }),
+                    /* @__PURE__ */ jsx("circle", { cx: "5", cy: "5", r: "4", stroke: "currentColor", strokeWidth: "1" })
+                  ] }),
+                  "Created 2 min ago"
+                ] }),
+                /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 text-[10px] text-gray-500", children: [
+                  /* @__PURE__ */ jsx("span", { className: "inline-flex size-4 items-center justify-center rounded-full bg-emerald-100 font-bold text-[7px] text-emerald-700", children: "JC" }),
+                  "J. Chen"
+                ] }),
+                /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 rounded bg-red-50 px-1.5 py-0.5 font-semibold text-[10px] text-red-600", children: [
+                  /* @__PURE__ */ jsx("svg", { width: "8", height: "8", viewBox: "0 0 8 8", fill: "none", children: /* @__PURE__ */ jsx(
+                    "path",
+                    {
+                      d: "M4 1V5M4 6.5V7",
+                      stroke: "currentColor",
+                      strokeWidth: "1.2",
+                      strokeLinecap: "round"
+                    }
+                  ) }),
+                  "High"
+                ] })
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      motion.div,
+      {
+        initial: { opacity: 0, y: 6 },
+        animate: { opacity: 1, y: 0 },
+        transition: { duration: 0.4, ease: EASE_OUT, delay: 0.7 },
+        className: "mt-3 rounded border border-gray-100 bg-gray-50 p-3",
+        children: [
+          /* @__PURE__ */ jsx("p", { className: "font-semibold text-[10px] text-gray-400 uppercase tracking-wider", children: "Cogentic compliance brief" }),
+          /* @__PURE__ */ jsx("div", { className: "mt-2 space-y-1.5", children: [
+            { label: "Corridor", value: "AU \u2192 SG" },
+            { label: "Risk score", value: "72 / 100" },
+            { label: "Trigger", value: "PEP screening match, threshold exceeded" },
+            { label: "Recommendation", value: "Verify beneficiary identity before clearing" }
+          ].map((row, i) => /* @__PURE__ */ jsxs(
+            motion.div,
+            {
+              initial: { opacity: 0, x: -4 },
+              animate: { opacity: 1, x: 0 },
+              transition: { duration: 0.25, delay: 0.9 + i * 0.1 },
+              className: "flex gap-2",
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "w-[80px] shrink-0 font-medium text-[10px] text-gray-400", children: row.label }),
+                /* @__PURE__ */ jsx("span", { className: "font-medium text-[10px] text-gray-700", children: row.value })
+              ]
+            },
+            row.label
+          )) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      motion.div,
+      {
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        transition: { duration: 0.3, delay: 1.4 },
+        className: "mt-3",
+        children: [
+          /* @__PURE__ */ jsx("p", { className: "font-semibold text-[10px] text-gray-400 uppercase tracking-wider", children: "Activity" }),
+          /* @__PURE__ */ jsxs("div", { className: "mt-1.5 flex items-start gap-2", children: [
+            /* @__PURE__ */ jsx("div", { className: "mt-0.5 size-1.5 shrink-0 rounded-full bg-blue-400" }),
+            /* @__PURE__ */ jsxs("p", { className: "text-[10px] text-gray-500", children: [
+              /* @__PURE__ */ jsx("span", { className: "font-medium text-gray-700", children: "Cogentic" }),
+              " created this issue from flagged transfer TXN-0847"
+            ] })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+
+export { AnimationJiraTicket as default };
 //# sourceMappingURL=animation-jira-ticket.js.map
 //# sourceMappingURL=animation-jira-ticket.js.map

package/dist/animations/animation-jira-ticket.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"animation-jira-ticket.js"}
+{"version":3,"sources":["../../src/animations/animation-jira-ticket.tsx"],"names":[],"mappings":"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","file":"animation-jira-ticket.js","sourcesContent":["\"use client\"\n\nimport { motion } from \"motion/react\"\n\nimport { EASE_OUT } from \"../lib/animation\"\nimport { cn } from \"../lib/utils\"\n\nexport default function AnimationJiraTicket({ className }: { className?: string }) {\n  return (\n    <div className={cn(\"flex flex-col bg-white p-4\", className)}>\n      {/* Breadcrumb */}\n      <div className=\"flex items-center gap-1.5 text-[10px] text-gray-400\">\n        <span>COGENTIC</span>\n        <span>/</span>\n        <span>Compliance Reviews</span>\n        <span>/</span>\n        <span className=\"text-gray-600\">COG-847</span>\n      </div>\n\n      {/* Issue header */}\n      <motion.div\n        initial={{ opacity: 0, y: 8 }}\n        animate={{ opacity: 1, y: 0 }}\n        transition={{ duration: 0.5, ease: EASE_OUT, delay: 0.2 }}\n      >\n        <h4 className=\"mt-2 font-semibold text-[14px] text-gray-900 leading-snug\">\n          Review: TXN-0847 — High risk corridor\n        </h4>\n\n        {/* Status & meta row */}\n        <motion.div\n          initial={{ opacity: 0 }}\n          animate={{ opacity: 1 }}\n          transition={{ duration: 0.3, delay: 0.5 }}\n          className=\"mt-2.5 flex flex-wrap items-center gap-2\"\n        >\n          <span className=\"rounded bg-blue-100 px-2 py-0.5 font-bold text-[10px] text-blue-700\">\n            IN REVIEW\n          </span>\n          <span className=\"flex items-center gap-1 text-[10px] text-gray-500\">\n            <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\">\n              <path d=\"M5 2V5L7 6.5\" stroke=\"currentColor\" strokeWidth=\"1\" strokeLinecap=\"round\" />\n              <circle cx=\"5\" cy=\"5\" r=\"4\" stroke=\"currentColor\" strokeWidth=\"1\" />\n            </svg>\n            Created 2 min ago\n          </span>\n          <span className=\"flex items-center gap-1 text-[10px] text-gray-500\">\n            <span className=\"inline-flex size-4 items-center justify-center rounded-full bg-emerald-100 font-bold text-[7px] text-emerald-700\">\n              JC\n            </span>\n            J. Chen\n          </span>\n          <span className=\"flex items-center gap-1 rounded bg-red-50 px-1.5 py-0.5 font-semibold text-[10px] text-red-600\">\n            <svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" fill=\"none\">\n              <path\n                d=\"M4 1V5M4 6.5V7\"\n                stroke=\"currentColor\"\n                strokeWidth=\"1.2\"\n                strokeLinecap=\"round\"\n              />\n            </svg>\n            High\n          </span>\n        </motion.div>\n      </motion.div>\n\n      {/* Description — Cogentic compliance brief */}\n      <motion.div\n        initial={{ opacity: 0, y: 6 }}\n        animate={{ opacity: 1, y: 0 }}\n        transition={{ duration: 0.4, ease: EASE_OUT, delay: 0.7 }}\n        className=\"mt-3 rounded border border-gray-100 bg-gray-50 p-3\"\n      >\n        <p className=\"font-semibold text-[10px] text-gray-400 uppercase tracking-wider\">\n          Cogentic compliance brief\n        </p>\n        <div className=\"mt-2 space-y-1.5\">\n          {[\n            { label: \"Corridor\", value: \"AU \\u2192 SG\" },\n            { label: \"Risk score\", value: \"72 / 100\" },\n            { label: \"Trigger\", value: \"PEP screening match, threshold exceeded\" },\n            { label: \"Recommendation\", value: \"Verify beneficiary identity before clearing\" },\n          ].map((row, i) => (\n            <motion.div\n              key={row.label}\n              initial={{ opacity: 0, x: -4 }}\n              animate={{ opacity: 1, x: 0 }}\n              transition={{ duration: 0.25, delay: 0.9 + i * 0.1 }}\n              className=\"flex gap-2\"\n            >\n              <span className=\"w-[80px] shrink-0 font-medium text-[10px] text-gray-400\">\n                {row.label}\n              </span>\n              <span className=\"font-medium text-[10px] text-gray-700\">{row.value}</span>\n            </motion.div>\n          ))}\n        </div>\n      </motion.div>\n\n      {/* Activity section */}\n      <motion.div\n        initial={{ opacity: 0 }}\n        animate={{ opacity: 1 }}\n        transition={{ duration: 0.3, delay: 1.4 }}\n        className=\"mt-3\"\n      >\n        <p className=\"font-semibold text-[10px] text-gray-400 uppercase tracking-wider\">Activity</p>\n        <div className=\"mt-1.5 flex items-start gap-2\">\n          <div className=\"mt-0.5 size-1.5 shrink-0 rounded-full bg-blue-400\" />\n          <p className=\"text-[10px] text-gray-500\">\n            <span className=\"font-medium text-gray-700\">Cogentic</span> created this issue from\n            flagged transfer TXN-0847\n          </p>\n        </div>\n      </motion.div>\n    </div>\n  )\n}\n"]}

package/dist/animations/animation-jurisdiction-detection.js

@@ -1,7 +1,126 @@
 "use client";
-export { AnimationJurisdictionDetection as default } from '../chunk-5JLZ42JT.js';
-import '../chunk-6RWCZUAD.js';
+import { useCycleIndex } from '../chunk-6RWCZUAD.js';
 import '../chunk-RXV2XUDZ.js';
-import '../chunk-GZNLQE3I.js';
+import { cn } from '../chunk-GZNLQE3I.js';
+import { LazyMotion, domAnimation, m } from 'motion/react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var CORRIDORS = [
+  {
+    from: { code: "AU", flag: "\u{1F1E6}\u{1F1FA}", jurisdiction: "AUSTRAC" },
+    to: { code: "SG", flag: "\u{1F1F8}\u{1F1EC}", jurisdiction: "MAS" },
+    requirement: "Full Travel Rule \u2014 IVMS101",
+    threshold: "AUD 10,000 / SGD 20,000",
+    status: "Resolved"
+  },
+  {
+    from: { code: "HK", flag: "\u{1F1ED}\u{1F1F0}", jurisdiction: "SFC" },
+    to: { code: "GB", flag: "\u{1F1EC}\u{1F1E7}", jurisdiction: "FCA" },
+    requirement: "Enhanced Due Diligence",
+    threshold: "No de minimis",
+    status: "Resolved"
+  },
+  {
+    from: { code: "AE", flag: "\u{1F1E6}\u{1F1EA}", jurisdiction: "VARA" },
+    to: { code: "NL", flag: "\u{1F1F3}\u{1F1F1}", jurisdiction: "DNB" },
+    requirement: "MiCA \u2014 Travel Rule",
+    threshold: "EUR 1,000",
+    status: "Pending"
+  }
+];
+var CYCLE_MS = 3500;
+function AnimationJurisdictionDetection({ className }) {
+  const [containerRef, index] = useCycleIndex(CORRIDORS.length, CYCLE_MS);
+  const c = CORRIDORS[index];
+  return /* @__PURE__ */ jsx(LazyMotion, { features: domAnimation, children: /* @__PURE__ */ jsxs("div", { ref: containerRef, className: cn("flex flex-col p-5", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("p", { className: "font-semibold text-[15px] text-foreground", children: "Jurisdiction Detection" }),
+        /* @__PURE__ */ jsx("p", { className: "text-[12px] text-gray-400", children: "Automatic corridor mapping" })
+      ] }),
+      /* @__PURE__ */ jsx(
+        m.span,
+        {
+          initial: { opacity: 0, scale: 0.9 },
+          animate: { opacity: 1, scale: 1 },
+          className: cn(
+            "rounded-full px-2.5 py-1 font-semibold text-[11px]",
+            c.status === "Resolved" ? "bg-emerald-50 text-emerald-700" : "bg-amber-50 text-amber-700"
+          ),
+          children: c.status
+        },
+        index
+      )
+    ] }),
+    /* @__PURE__ */ jsxs(
+      m.div,
+      {
+        initial: { opacity: 0, y: 6 },
+        animate: { opacity: 1, y: 0 },
+        transition: { duration: 0.3 },
+        className: "mt-4 flex items-center justify-between rounded-lg border border-gray-100 bg-gray-50 px-4 py-3",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-2xl", children: c.from.flag }),
+            /* @__PURE__ */ jsx("p", { className: "mt-1 font-bold font-mono text-[12px] text-gray-900", children: c.from.code }),
+            /* @__PURE__ */ jsx("p", { className: "text-[10px] text-gray-400", children: c.from.jurisdiction })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "mx-3 flex flex-1 flex-col items-center gap-1", children: [
+            /* @__PURE__ */ jsx("div", { className: "h-px w-full bg-gradient-to-r from-transparent via-[#00D4FF] to-transparent" }),
+            /* @__PURE__ */ jsx("span", { className: "font-medium text-[#0099BB] text-[10px]", children: "Travel Rule" }),
+            /* @__PURE__ */ jsx("div", { className: "h-px w-full bg-gradient-to-r from-transparent via-[#00D4FF] to-transparent" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-2xl", children: c.to.flag }),
+            /* @__PURE__ */ jsx("p", { className: "mt-1 font-bold font-mono text-[12px] text-gray-900", children: c.to.code }),
+            /* @__PURE__ */ jsx("p", { className: "text-[10px] text-gray-400", children: c.to.jurisdiction })
+          ] })
+        ]
+      },
+      `corridor-${index}`
+    ),
+    /* @__PURE__ */ jsxs(
+      m.div,
+      {
+        initial: { opacity: 0, y: 4 },
+        animate: { opacity: 1, y: 0 },
+        transition: { duration: 0.25, delay: 0.15 },
+        className: "mt-3 grid grid-cols-2 gap-2",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-gray-100 bg-white px-3 py-2.5", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-medium text-[10px] text-gray-400", children: "Requirement" }),
+            /* @__PURE__ */ jsx("p", { className: "mt-0.5 font-semibold text-[12px] text-gray-800", children: c.requirement })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-gray-100 bg-white px-3 py-2.5", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-medium text-[10px] text-gray-400", children: "Threshold" }),
+            /* @__PURE__ */ jsx("p", { className: "mt-0.5 font-semibold text-[12px] text-gray-800", children: c.threshold })
+          ] })
+        ]
+      },
+      `detail-${index}`
+    ),
+    /* @__PURE__ */ jsx(
+      m.div,
+      {
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        transition: { delay: 0.3 },
+        className: "mt-3 space-y-1 rounded-lg border border-gray-100 bg-white px-3 py-2",
+        children: [
+          `Originator jurisdiction: ${c.from.jurisdiction}`,
+          `Beneficiary jurisdiction: ${c.to.jurisdiction}`,
+          `Applicable requirement: ${c.requirement}`
+        ].map((line, i) => /* @__PURE__ */ jsxs("p", { className: "font-mono text-[10px] text-gray-500", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-emerald-500", children: "\u2713" }),
+          " ",
+          line
+        ] }, i))
+      },
+      `log-${index}`
+    )
+  ] }) });
+}
+
+export { AnimationJurisdictionDetection as default };
 //# sourceMappingURL=animation-jurisdiction-detection.js.map
 //# sourceMappingURL=animation-jurisdiction-detection.js.map

package/dist/animations/animation-jurisdiction-detection.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"animation-jurisdiction-detection.js"}
+{"version":3,"sources":["../../src/animations/animation-jurisdiction-detection.tsx"],"names":[],"mappings":";;;;;;AAgBA,IAAM,SAAA,GAAwB;AAAA,EAC5B;AAAA,IACE,MAAM,EAAE,IAAA,EAAM,MAAM,IAAA,EAAM,oBAAA,EAAsB,cAAc,SAAA,EAAU;AAAA,IACxE,IAAI,EAAE,IAAA,EAAM,MAAM,IAAA,EAAM,oBAAA,EAAsB,cAAc,KAAA,EAAM;AAAA,IAClE,WAAA,EAAa,iCAAA;AAAA,IACb,SAAA,EAAW,yBAAA;AAAA,IACX,MAAA,EAAQ;AAAA,GACV;AAAA,EACA;AAAA,IACE,MAAM,EAAE,IAAA,EAAM,MAAM,IAAA,EAAM,oBAAA,EAAsB,cAAc,KAAA,EAAM;AAAA,IACpE,IAAI,EAAE,IAAA,EAAM,MAAM,IAAA,EAAM,oBAAA,EAAsB,cAAc,KAAA,EAAM;AAAA,IAClE,WAAA,EAAa,wBAAA;AAAA,IACb,SAAA,EAAW,eAAA;AAAA,IACX,MAAA,EAAQ;AAAA,GACV;AAAA,EACA;AAAA,IACE,MAAM,EAAE,IAAA,EAAM,MAAM,IAAA,EAAM,oBAAA,EAAsB,cAAc,MAAA,EAAO;AAAA,IACrE,IAAI,EAAE,IAAA,EAAM,MAAM,IAAA,EAAM,oBAAA,EAAsB,cAAc,KAAA,EAAM;AAAA,IAClE,WAAA,EAAa,yBAAA;AAAA,IACb,SAAA,EAAW,WAAA;AAAA,IACX,MAAA,EAAQ;AAAA;AAEZ,CAAA;AAEA,IAAM,QAAA,GAAW,IAAA;AAEF,SAAR,8BAAA,CAAgD,EAAE,SAAA,EAAU,EAA2B;AAC5F,EAAA,MAAM,CAAC,YAAA,EAAc,KAAK,IAAI,aAAA,CAAc,SAAA,CAAU,QAAQ,QAAQ,CAAA;AACtE,EAAA,MAAM,CAAA,GAAI,UAAU,KAAK,CAAA;AAEzB,EAAA,uBACE,GAAA,CAAC,UAAA,EAAA,EAAW,QAAA,EAAU,YAAA,EACpB,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAK,YAAA,EAAc,SAAA,EAAW,EAAA,CAAG,mBAAA,EAAqB,SAAS,CAAA,EAElE,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,mCAAA,EACb,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,KAAA,EAAA,EACC,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,2CAAA,EAA4C,QAAA,EAAA,wBAAA,EAAsB,CAAA;AAAA,wBAC/E,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,2BAAA,EAA4B,QAAA,EAAA,4BAAA,EAA0B;AAAA,OAAA,EACrE,CAAA;AAAA,sBACA,GAAA;AAAA,QAAC,CAAA,CAAE,IAAA;AAAA,QAAF;AAAA,UAEC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,OAAO,GAAA,EAAI;AAAA,UAClC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,OAAO,CAAA,EAAE;AAAA,UAChC,SAAA,EAAW,EAAA;AAAA,YACT,oDAAA;AAAA,YACA,CAAA,CAAE,MAAA,KAAW,UAAA,GACT,gCAAA,GACA;AAAA,WACN;AAAA,UAEC,QAAA,EAAA,CAAA,CAAE;AAAA,SAAA;AAAA,QAVE;AAAA;AAWP,KAAA,EACF,CAAA;AAAA,oBAGA,IAAA;AAAA,MAAC,CAAA,CAAE,GAAA;AAAA,MAAF;AAAA,QAEC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,GAAG,CAAA,EAAE;AAAA,QAC5B,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,GAAG,CAAA,EAAE;AAAA,QAC5B,UAAA,EAAY,EAAE,QAAA,EAAU,GAAA,EAAI;AAAA,QAC5B,SAAA,EAAU,+FAAA;AAAA,QAGV,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,aAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,UAAA,EAAY,QAAA,EAAA,CAAA,CAAE,KAAK,IAAA,EAAK,CAAA;AAAA,gCACvC,GAAA,EAAA,EAAE,SAAA,EAAU,oDAAA,EAAsD,QAAA,EAAA,CAAA,CAAE,KAAK,IAAA,EAAK,CAAA;AAAA,gCAC9E,GAAA,EAAA,EAAE,SAAA,EAAU,2BAAA,EAA6B,QAAA,EAAA,CAAA,CAAE,KAAK,YAAA,EAAa;AAAA,WAAA,EAChE,CAAA;AAAA,0BAGA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,8CAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,KAAA,EAAA,EAAI,WAAU,4EAAA,EAA6E,CAAA;AAAA,4BAC5F,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,wCAAA,EAAyC,QAAA,EAAA,aAAA,EAAW,CAAA;AAAA,4BACpE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,4EAAA,EAA6E;AAAA,WAAA,EAC9F,CAAA;AAAA,0BAGA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,aAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,UAAA,EAAY,QAAA,EAAA,CAAA,CAAE,GAAG,IAAA,EAAK,CAAA;AAAA,gCACrC,GAAA,EAAA,EAAE,SAAA,EAAU,oDAAA,EAAsD,QAAA,EAAA,CAAA,CAAE,GAAG,IAAA,EAAK,CAAA;AAAA,gCAC5E,GAAA,EAAA,EAAE,SAAA,EAAU,2BAAA,EAA6B,QAAA,EAAA,CAAA,CAAE,GAAG,YAAA,EAAa;AAAA,WAAA,EAC9D;AAAA;AAAA,OAAA;AAAA,MAzBK,YAAY,KAAK,CAAA;AAAA,KA0BxB;AAAA,oBAGA,IAAA;AAAA,MAAC,CAAA,CAAE,GAAA;AAAA,MAAF;AAAA,QAEC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,GAAG,CAAA,EAAE;AAAA,QAC5B,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,GAAG,CAAA,EAAE;AAAA,QAC5B,UAAA,EAAY,EAAE,QAAA,EAAU,IAAA,EAAM,OAAO,IAAA,EAAK;AAAA,QAC1C,SAAA,EAAU,6BAAA;AAAA,QAEV,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,wDAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uCAAA,EAAwC,QAAA,EAAA,aAAA,EAAW,CAAA;AAAA,4BACnE,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,gDAAA,EAAkD,YAAE,WAAA,EAAY;AAAA,WAAA,EAC/E,CAAA;AAAA,0BACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,wDAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uCAAA,EAAwC,QAAA,EAAA,WAAA,EAAS,CAAA;AAAA,4BACjE,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,gDAAA,EAAkD,YAAE,SAAA,EAAU;AAAA,WAAA,EAC7E;AAAA;AAAA,OAAA;AAAA,MAbK,UAAU,KAAK,CAAA;AAAA,KActB;AAAA,oBAGA,GAAA;AAAA,MAAC,CAAA,CAAE,GAAA;AAAA,MAAF;AAAA,QAEC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAE;AAAA,QACtB,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAE;AAAA,QACtB,UAAA,EAAY,EAAE,KAAA,EAAO,GAAA,EAAI;AAAA,QACzB,SAAA,EAAU,qEAAA;AAAA,QAET,QAAA,EAAA;AAAA,UACC,CAAA,yBAAA,EAA4B,CAAA,CAAE,IAAA,CAAK,YAAY,CAAA,CAAA;AAAA,UAC/C,CAAA,0BAAA,EAA6B,CAAA,CAAE,EAAA,CAAG,YAAY,CAAA,CAAA;AAAA,UAC9C,CAAA,wBAAA,EAA2B,EAAE,WAAW,CAAA;AAAA,SAC1C,CAAE,IAAI,CAAC,IAAA,EAAM,sBACX,IAAA,CAAC,GAAA,EAAA,EAAU,WAAU,qCAAA,EACnB,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,kBAAA,EAAoB,QAAA,EAAA,QAAA,EAAS,CAAA;AAAA,UAAO,GAAA;AAAA,UAAE;AAAA,SAAA,EAAA,EADhD,CAER,CACD;AAAA,OAAA;AAAA,MAdI,OAAO,KAAK,CAAA;AAAA;AAenB,GAAA,EACF,CAAA,EACF,CAAA;AAEJ","file":"animation-jurisdiction-detection.js","sourcesContent":["\"use client\"\n\nimport { domAnimation, LazyMotion, m } from \"motion/react\"\n\nimport { useCycleIndex } from \"../hooks/use-cycle-index\"\n\nimport { cn } from \"../lib/utils\"\n\ntype Corridor = {\n  from: { code: string; flag: string; jurisdiction: string }\n  to: { code: string; flag: string; jurisdiction: string }\n  requirement: string\n  threshold: string\n  status: \"Resolved\" | \"Pending\"\n}\n\nconst CORRIDORS: Corridor[] = [\n  {\n    from: { code: \"AU\", flag: \"\\u{1F1E6}\\u{1F1FA}\", jurisdiction: \"AUSTRAC\" },\n    to: { code: \"SG\", flag: \"\\u{1F1F8}\\u{1F1EC}\", jurisdiction: \"MAS\" },\n    requirement: \"Full Travel Rule — IVMS101\",\n    threshold: \"AUD 10,000 / SGD 20,000\",\n    status: \"Resolved\",\n  },\n  {\n    from: { code: \"HK\", flag: \"\\u{1F1ED}\\u{1F1F0}\", jurisdiction: \"SFC\" },\n    to: { code: \"GB\", flag: \"\\u{1F1EC}\\u{1F1E7}\", jurisdiction: \"FCA\" },\n    requirement: \"Enhanced Due Diligence\",\n    threshold: \"No de minimis\",\n    status: \"Resolved\",\n  },\n  {\n    from: { code: \"AE\", flag: \"\\u{1F1E6}\\u{1F1EA}\", jurisdiction: \"VARA\" },\n    to: { code: \"NL\", flag: \"\\u{1F1F3}\\u{1F1F1}\", jurisdiction: \"DNB\" },\n    requirement: \"MiCA — Travel Rule\",\n    threshold: \"EUR 1,000\",\n    status: \"Pending\",\n  },\n]\n\nconst CYCLE_MS = 3500\n\nexport default function AnimationJurisdictionDetection({ className }: { className?: string }) {\n  const [containerRef, index] = useCycleIndex(CORRIDORS.length, CYCLE_MS)\n  const c = CORRIDORS[index]\n\n  return (\n    <LazyMotion features={domAnimation}>\n      <div ref={containerRef} className={cn(\"flex flex-col p-5\", className)}>\n        {/* Header */}\n        <div className=\"flex items-center justify-between\">\n          <div>\n            <p className=\"font-semibold text-[15px] text-foreground\">Jurisdiction Detection</p>\n            <p className=\"text-[12px] text-gray-400\">Automatic corridor mapping</p>\n          </div>\n          <m.span\n            key={index}\n            initial={{ opacity: 0, scale: 0.9 }}\n            animate={{ opacity: 1, scale: 1 }}\n            className={cn(\n              \"rounded-full px-2.5 py-1 font-semibold text-[11px]\",\n              c.status === \"Resolved\"\n                ? \"bg-emerald-50 text-emerald-700\"\n                : \"bg-amber-50 text-amber-700\",\n            )}\n          >\n            {c.status}\n          </m.span>\n        </div>\n\n        {/* Corridor visualisation */}\n        <m.div\n          key={`corridor-${index}`}\n          initial={{ opacity: 0, y: 6 }}\n          animate={{ opacity: 1, y: 0 }}\n          transition={{ duration: 0.3 }}\n          className=\"mt-4 flex items-center justify-between rounded-lg border border-gray-100 bg-gray-50 px-4 py-3\"\n        >\n          {/* From */}\n          <div className=\"text-center\">\n            <span className=\"text-2xl\">{c.from.flag}</span>\n            <p className=\"mt-1 font-bold font-mono text-[12px] text-gray-900\">{c.from.code}</p>\n            <p className=\"text-[10px] text-gray-400\">{c.from.jurisdiction}</p>\n          </div>\n\n          {/* Arrow */}\n          <div className=\"mx-3 flex flex-1 flex-col items-center gap-1\">\n            <div className=\"h-px w-full bg-gradient-to-r from-transparent via-[#00D4FF] to-transparent\" />\n            <span className=\"font-medium text-[#0099BB] text-[10px]\">Travel Rule</span>\n            <div className=\"h-px w-full bg-gradient-to-r from-transparent via-[#00D4FF] to-transparent\" />\n          </div>\n\n          {/* To */}\n          <div className=\"text-center\">\n            <span className=\"text-2xl\">{c.to.flag}</span>\n            <p className=\"mt-1 font-bold font-mono text-[12px] text-gray-900\">{c.to.code}</p>\n            <p className=\"text-[10px] text-gray-400\">{c.to.jurisdiction}</p>\n          </div>\n        </m.div>\n\n        {/* Details */}\n        <m.div\n          key={`detail-${index}`}\n          initial={{ opacity: 0, y: 4 }}\n          animate={{ opacity: 1, y: 0 }}\n          transition={{ duration: 0.25, delay: 0.15 }}\n          className=\"mt-3 grid grid-cols-2 gap-2\"\n        >\n          <div className=\"rounded-lg border border-gray-100 bg-white px-3 py-2.5\">\n            <span className=\"font-medium text-[10px] text-gray-400\">Requirement</span>\n            <p className=\"mt-0.5 font-semibold text-[12px] text-gray-800\">{c.requirement}</p>\n          </div>\n          <div className=\"rounded-lg border border-gray-100 bg-white px-3 py-2.5\">\n            <span className=\"font-medium text-[10px] text-gray-400\">Threshold</span>\n            <p className=\"mt-0.5 font-semibold text-[12px] text-gray-800\">{c.threshold}</p>\n          </div>\n        </m.div>\n\n        {/* Mini log */}\n        <m.div\n          key={`log-${index}`}\n          initial={{ opacity: 0 }}\n          animate={{ opacity: 1 }}\n          transition={{ delay: 0.3 }}\n          className=\"mt-3 space-y-1 rounded-lg border border-gray-100 bg-white px-3 py-2\"\n        >\n          {[\n            `Originator jurisdiction: ${c.from.jurisdiction}`,\n            `Beneficiary jurisdiction: ${c.to.jurisdiction}`,\n            `Applicable requirement: ${c.requirement}`,\n          ].map((line, i) => (\n            <p key={i} className=\"font-mono text-[10px] text-gray-500\">\n              <span className=\"text-emerald-500\">{\"\\u2713\"}</span> {line}\n            </p>\n          ))}\n        </m.div>\n      </div>\n    </LazyMotion>\n  )\n}\n"]}

package/dist/animations/animation-multi-protocol.js

@@ -1,5 +1,66 @@
 "use client";
-export { AnimationMultiProtocol as default } from '../chunk-RTK7R4KZ.js';
-import '../chunk-GZNLQE3I.js';
+import { cn } from '../chunk-GZNLQE3I.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ROW_1 = [
+  { name: "TRP", icon: "T" },
+  { name: "TRISA", icon: "R" },
+  { name: "OpenVASP", icon: "O" },
+  { name: "Sygna", icon: "S" },
+  { name: "Notabene", icon: "N" },
+  { name: "Sumsub", icon: "Su" },
+  { name: "Chainalysis", icon: "C" },
+  { name: "Elliptic", icon: "E" }
+];
+var ROW_2 = [
+  { name: "Shyft", icon: "Sh" },
+  { name: "Coinfirm", icon: "Co" },
+  { name: "CipherTrace", icon: "Ci" },
+  { name: "VerifyVASP", icon: "V" },
+  { name: "Crystal", icon: "Cr" },
+  { name: "TRM Labs", icon: "TL" },
+  { name: "Merkle", icon: "M" },
+  { name: "Scorechain", icon: "Sc" }
+];
+function MarqueeRow({
+  items,
+  direction = "left",
+  duration = 25
+}) {
+  const doubled = [...items, ...items];
+  return /* @__PURE__ */ jsxs("div", { className: "relative overflow-hidden", children: [
+    /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-y-0 left-0 z-10 w-10 bg-gradient-to-r from-card/40 to-transparent" }),
+    /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-y-0 right-0 z-10 w-10 bg-gradient-to-l from-card/40 to-transparent" }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "flex w-max gap-3",
+          direction === "left" ? "animate-marquee-left" : "animate-marquee-right"
+        ),
+        style: { animationDuration: `${duration}s` },
+        children: doubled.map((item, i) => /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex shrink-0 items-center gap-2 rounded-full border border-gray-200 bg-white px-3.5 py-2 shadow-sm",
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "flex size-6 items-center justify-center rounded-full bg-gray-100 font-bold text-[10px] text-gray-500", children: item.icon }),
+              /* @__PURE__ */ jsx("span", { className: "font-medium text-[12px] text-gray-700", children: item.name })
+            ]
+          },
+          `${item.name}-${i}`
+        ))
+      }
+    )
+  ] });
+}
+function AnimationMultiProtocol({ className }) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col justify-center gap-3", className), children: [
+    /* @__PURE__ */ jsx(MarqueeRow, { items: ROW_1, direction: "left", duration: 30 }),
+    /* @__PURE__ */ jsx(MarqueeRow, { items: ROW_2, direction: "right", duration: 28 })
+  ] });
+}
+
+export { AnimationMultiProtocol as default };
 //# sourceMappingURL=animation-multi-protocol.js.map
 //# sourceMappingURL=animation-multi-protocol.js.map

package/dist/animations/animation-multi-protocol.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"animation-multi-protocol.js"}
+{"version":3,"sources":["../../src/animations/animation-multi-protocol.tsx"],"names":[],"mappings":"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","file":"animation-multi-protocol.js","sourcesContent":["\"use client\"\n\nimport { cn } from \"../lib/utils\"\n\ntype ProtocolItem = {\n  name: string\n  icon: string\n}\n\nconst ROW_1: ProtocolItem[] = [\n  { name: \"TRP\", icon: \"T\" },\n  { name: \"TRISA\", icon: \"R\" },\n  { name: \"OpenVASP\", icon: \"O\" },\n  { name: \"Sygna\", icon: \"S\" },\n  { name: \"Notabene\", icon: \"N\" },\n  { name: \"Sumsub\", icon: \"Su\" },\n  { name: \"Chainalysis\", icon: \"C\" },\n  { name: \"Elliptic\", icon: \"E\" },\n]\n\nconst ROW_2: ProtocolItem[] = [\n  { name: \"Shyft\", icon: \"Sh\" },\n  { name: \"Coinfirm\", icon: \"Co\" },\n  { name: \"CipherTrace\", icon: \"Ci\" },\n  { name: \"VerifyVASP\", icon: \"V\" },\n  { name: \"Crystal\", icon: \"Cr\" },\n  { name: \"TRM Labs\", icon: \"TL\" },\n  { name: \"Merkle\", icon: \"M\" },\n  { name: \"Scorechain\", icon: \"Sc\" },\n]\n\nfunction MarqueeRow({\n  items,\n  direction = \"left\",\n  duration = 25,\n}: {\n  items: ProtocolItem[]\n  direction?: \"left\" | \"right\"\n  duration?: number\n}) {\n  const doubled = [...items, ...items]\n\n  return (\n    <div className=\"relative overflow-hidden\">\n      <div className=\"pointer-events-none absolute inset-y-0 left-0 z-10 w-10 bg-gradient-to-r from-card/40 to-transparent\" />\n      <div className=\"pointer-events-none absolute inset-y-0 right-0 z-10 w-10 bg-gradient-to-l from-card/40 to-transparent\" />\n\n      <div\n        className={cn(\n          \"flex w-max gap-3\",\n          direction === \"left\" ? \"animate-marquee-left\" : \"animate-marquee-right\",\n        )}\n        style={{ animationDuration: `${duration}s` }}\n      >\n        {doubled.map((item, i) => (\n          <div\n            key={`${item.name}-${i}`}\n            className=\"flex shrink-0 items-center gap-2 rounded-full border border-gray-200 bg-white px-3.5 py-2 shadow-sm\"\n          >\n            <div className=\"flex size-6 items-center justify-center rounded-full bg-gray-100 font-bold text-[10px] text-gray-500\">\n              {item.icon}\n            </div>\n            <span className=\"font-medium text-[12px] text-gray-700\">{item.name}</span>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default function AnimationMultiProtocol({ className }: { className?: string }) {\n  return (\n    <div className={cn(\"flex flex-col justify-center gap-3\", className)}>\n      <MarqueeRow items={ROW_1} direction=\"left\" duration={30} />\n      <MarqueeRow items={ROW_2} direction=\"right\" duration={28} />\n    </div>\n  )\n}\n"]}

package/dist/animations/animation-pricing-preview.js

@@ -1,7 +1,173 @@
 "use client";
-export { AnimationPricingPreview as default } from '../chunk-H7VUIMEL.js';
-import '../chunk-6RWCZUAD.js';
+import { useCycleIndex } from '../chunk-6RWCZUAD.js';
 import '../chunk-RXV2XUDZ.js';
-import '../chunk-GZNLQE3I.js';
+import { __spreadProps, __spreadValues, cn } from '../chunk-GZNLQE3I.js';
+import { CheckCircle2 } from 'lucide-react';
+import { LazyMotion, domAnimation, m, AnimatePresence } from 'motion/react';
+import { useMemo } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var DEFAULT_PLANS = [
+  {
+    name: "Starter",
+    features: ["50 transfers/mo", "5 jurisdictions", "Audit trail"],
+    ctaLabel: "Get started",
+    highlight: false
+  },
+  {
+    name: "Growth",
+    monthlyPrice: "$499",
+    annualPrice: "$399",
+    features: ["1,000 transfers/mo", "25 jurisdictions", "AI investigation"],
+    ctaLabel: "Start trial",
+    highlight: true
+  },
+  {
+    name: "Enterprise",
+    features: ["Unlimited transfers", "45+ jurisdictions", "Custom workflows"],
+    ctaLabel: "Talk to sales",
+    highlight: false
+  }
+];
+var MAX_FEATURES = 3;
+var CYCLE_MS = 4e3;
+function AnimationPricingPreview({
+  className,
+  plans
+}) {
+  const [containerRef, cycleIndex] = useCycleIndex(2, CYCLE_MS);
+  const yearly = cycleIndex === 0;
+  const items = useMemo(() => {
+    if (!(plans == null ? void 0 : plans.length)) return DEFAULT_PLANS;
+    return plans.slice(0, 3).map((p) => __spreadProps(__spreadValues({}, p), {
+      features: p.features.slice(0, MAX_FEATURES)
+    }));
+  }, [plans]);
+  return /* @__PURE__ */ jsx(LazyMotion, { features: domAnimation, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: containerRef,
+      className: cn("flex flex-col items-center justify-center p-5", className),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "font-semibold text-[11px] transition-colors",
+                !yearly ? "text-gray-900" : "text-gray-400"
+              ),
+              children: "Monthly"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: "relative h-5 w-9 rounded-full bg-gray-900 transition-colors",
+              "aria-label": "Toggle billing",
+              children: /* @__PURE__ */ jsx(
+                m.div,
+                {
+                  className: "absolute top-0.5 size-4 rounded-full bg-white",
+                  animate: { left: yearly ? 18 : 2 },
+                  transition: { type: "spring", stiffness: 500, damping: 30 }
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "font-semibold text-[11px] transition-colors",
+                yearly ? "text-gray-900" : "text-gray-400"
+              ),
+              children: "Yearly"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "-mx-[70px] mt-4 flex w-[calc(100%+140px)] gap-2.5 sm:mx-0 sm:w-full", children: items.map((plan, i) => {
+          const rawPrice = yearly ? plan.annualPrice : plan.monthlyPrice;
+          const price = rawPrice || (i === 0 ? "Free" : "Let\u2019s talk");
+          const hasPrice = yearly ? !!plan.annualPrice : !!plan.monthlyPrice;
+          return /* @__PURE__ */ jsxs(
+            m.div,
+            {
+              initial: { opacity: 0, y: 12 },
+              animate: { opacity: 1, y: 0 },
+              transition: { duration: 0.4, delay: 0.1 + i * 0.08 },
+              className: cn(
+                "flex flex-1 flex-col rounded-xl border p-3",
+                plan.highlight ? "border-gray-900 bg-gray-50 shadow-sm" : "border-gray-200 bg-white"
+              ),
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+                  /* @__PURE__ */ jsx("span", { className: "font-bold text-[11px] text-gray-900", children: plan.name }),
+                  plan.highlight && /* @__PURE__ */ jsx("span", { className: "rounded bg-gray-900 px-1.5 py-0.5 font-bold text-[8px] text-white", children: "Popular" })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-baseline gap-0.5", children: [
+                  /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsx(
+                    m.span,
+                    {
+                      initial: { opacity: 0, y: -6 },
+                      animate: { opacity: 1, y: 0 },
+                      exit: { opacity: 0, y: 6 },
+                      transition: { duration: 0.2 },
+                      className: "font-bold text-gray-900 text-lg",
+                      children: price
+                    },
+                    price
+                  ) }),
+                  hasPrice && /* @__PURE__ */ jsx("span", { className: "text-[9px] text-gray-400", children: "/mo" })
+                ] }),
+                /* @__PURE__ */ jsx("div", { className: "mt-2.5 flex flex-col gap-1.5", children: plan.features.map((f) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+                  /* @__PURE__ */ jsx(
+                    CheckCircle2,
+                    {
+                      className: "size-3 shrink-0 text-emerald-500",
+                      strokeWidth: 2.5
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "font-medium text-[9px] text-gray-600 leading-tight", children: f })
+                ] }, f)) }),
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: cn(
+                      "mt-3 rounded-md py-1.5 text-center font-semibold text-[9px]",
+                      plan.highlight ? "bg-gray-900 text-white" : "border border-gray-200 text-gray-700"
+                    ),
+                    children: plan.ctaLabel
+                  }
+                )
+              ]
+            },
+            plan.name
+          );
+        }) }),
+        /* @__PURE__ */ jsx("div", { className: "mt-3 flex w-full gap-2.5", children: [
+          { label: "Avg. savings", value: "42%", sub: "vs manual compliance" },
+          { label: "Setup time", value: "<1hr", sub: "fully operational" },
+          { label: "Uptime SLA", value: "99.9%", sub: "guaranteed" }
+        ].map((metric, i) => /* @__PURE__ */ jsxs(
+          m.div,
+          {
+            initial: { opacity: 0, y: 6 },
+            animate: { opacity: 1, y: 0 },
+            transition: { duration: 0.3, delay: 0.4 + i * 0.08 },
+            className: "flex flex-1 flex-col items-center rounded-lg border border-gray-100 bg-white px-2 py-2",
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "font-bold text-gray-900 text-sm", children: metric.value }),
+              /* @__PURE__ */ jsx("span", { className: "text-[8px] text-gray-400", children: metric.sub })
+            ]
+          },
+          metric.label
+        )) })
+      ]
+    }
+  ) });
+}
+
+export { AnimationPricingPreview as default };
 //# sourceMappingURL=animation-pricing-preview.js.map
 //# sourceMappingURL=animation-pricing-preview.js.map

package/dist/animations/animation-pricing-preview.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"animation-pricing-preview.js"}
+{"version":3,"sources":["../../src/animations/animation-pricing-preview.tsx"],"names":[],"mappings":"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","file":"animation-pricing-preview.js","sourcesContent":["\"use client\"\n\nimport { CheckCircle2 } from \"lucide-react\"\nimport { AnimatePresence, domAnimation, LazyMotion, m } from \"motion/react\"\nimport { useMemo } from \"react\"\n\nimport { useCycleIndex } from \"../hooks/use-cycle-index\"\n\nimport { cn } from \"../lib/utils\"\n\ninterface Plan {\n  name: string\n  features: string[]\n  ctaLabel: string\n  highlight?: boolean\n  monthlyPrice?: string\n  annualPrice?: string\n}\n\nconst DEFAULT_PLANS: Plan[] = [\n  {\n    name: \"Starter\",\n    features: [\"50 transfers/mo\", \"5 jurisdictions\", \"Audit trail\"],\n    ctaLabel: \"Get started\",\n    highlight: false,\n  },\n  {\n    name: \"Growth\",\n    monthlyPrice: \"$499\",\n    annualPrice: \"$399\",\n    features: [\"1,000 transfers/mo\", \"25 jurisdictions\", \"AI investigation\"],\n    ctaLabel: \"Start trial\",\n    highlight: true,\n  },\n  {\n    name: \"Enterprise\",\n    features: [\"Unlimited transfers\", \"45+ jurisdictions\", \"Custom workflows\"],\n    ctaLabel: \"Talk to sales\",\n    highlight: false,\n  },\n]\n\nconst MAX_FEATURES = 3\nconst CYCLE_MS = 4000\n\nexport default function AnimationPricingPreview({\n  className,\n  plans,\n}: {\n  className?: string\n  plans?: Plan[]\n}) {\n  const [containerRef, cycleIndex] = useCycleIndex(2, CYCLE_MS)\n  const yearly = cycleIndex === 0\n\n  // Use CMS plans if provided (pick first 3), otherwise defaults\n  const items = useMemo(() => {\n    if (!plans?.length) return DEFAULT_PLANS\n    return plans.slice(0, 3).map((p) => ({\n      ...p,\n      features: p.features.slice(0, MAX_FEATURES),\n    }))\n  }, [plans])\n\n  return (\n    <LazyMotion features={domAnimation}>\n      <div\n        ref={containerRef}\n        className={cn(\"flex flex-col items-center justify-center p-5\", className)}\n      >\n        {/* Toggle */}\n        <div className=\"flex items-center gap-3\">\n          <span\n            className={cn(\n              \"font-semibold text-[11px] transition-colors\",\n              !yearly ? \"text-gray-900\" : \"text-gray-400\",\n            )}\n          >\n            Monthly\n          </span>\n          <span\n            className=\"relative h-5 w-9 rounded-full bg-gray-900 transition-colors\"\n            aria-label=\"Toggle billing\"\n          >\n            <m.div\n              className=\"absolute top-0.5 size-4 rounded-full bg-white\"\n              animate={{ left: yearly ? 18 : 2 }}\n              transition={{ type: \"spring\", stiffness: 500, damping: 30 }}\n            />\n          </span>\n          <span\n            className={cn(\n              \"font-semibold text-[11px] transition-colors\",\n              yearly ? \"text-gray-900\" : \"text-gray-400\",\n            )}\n          >\n            Yearly\n          </span>\n        </div>\n\n        {/* Cards */}\n        <div className=\"-mx-[70px] mt-4 flex w-[calc(100%+140px)] gap-2.5 sm:mx-0 sm:w-full\">\n          {items.map((plan, i) => {\n            const rawPrice = yearly ? plan.annualPrice : plan.monthlyPrice\n            const price = rawPrice || (i === 0 ? \"Free\" : \"Let\\u2019s talk\")\n            const hasPrice = yearly ? !!plan.annualPrice : !!plan.monthlyPrice\n            return (\n              <m.div\n                key={plan.name}\n                initial={{ opacity: 0, y: 12 }}\n                animate={{ opacity: 1, y: 0 }}\n                transition={{ duration: 0.4, delay: 0.1 + i * 0.08 }}\n                className={cn(\n                  \"flex flex-1 flex-col rounded-xl border p-3\",\n                  plan.highlight\n                    ? \"border-gray-900 bg-gray-50 shadow-sm\"\n                    : \"border-gray-200 bg-white\",\n                )}\n              >\n                <div className=\"flex items-center gap-1.5\">\n                  <span className=\"font-bold text-[11px] text-gray-900\">{plan.name}</span>\n                  {plan.highlight && (\n                    <span className=\"rounded bg-gray-900 px-1.5 py-0.5 font-bold text-[8px] text-white\">\n                      Popular\n                    </span>\n                  )}\n                </div>\n\n                <div className=\"mt-2 flex items-baseline gap-0.5\">\n                  <AnimatePresence mode=\"wait\">\n                    <m.span\n                      key={price}\n                      initial={{ opacity: 0, y: -6 }}\n                      animate={{ opacity: 1, y: 0 }}\n                      exit={{ opacity: 0, y: 6 }}\n                      transition={{ duration: 0.2 }}\n                      className=\"font-bold text-gray-900 text-lg\"\n                    >\n                      {price}\n                    </m.span>\n                  </AnimatePresence>\n                  {hasPrice && <span className=\"text-[9px] text-gray-400\">/mo</span>}\n                </div>\n\n                <div className=\"mt-2.5 flex flex-col gap-1.5\">\n                  {plan.features.map((f) => (\n                    <div key={f} className=\"flex items-center gap-1\">\n                      <CheckCircle2\n                        className=\"size-3 shrink-0 text-emerald-500\"\n                        strokeWidth={2.5}\n                      />\n                      <span className=\"font-medium text-[9px] text-gray-600 leading-tight\">\n                        {f}\n                      </span>\n                    </div>\n                  ))}\n                </div>\n\n                <div\n                  className={cn(\n                    \"mt-3 rounded-md py-1.5 text-center font-semibold text-[9px]\",\n                    plan.highlight\n                      ? \"bg-gray-900 text-white\"\n                      : \"border border-gray-200 text-gray-700\",\n                  )}\n                >\n                  {plan.ctaLabel}\n                </div>\n              </m.div>\n            )\n          })}\n        </div>\n\n        {/* Bottom metric row */}\n        <div className=\"mt-3 flex w-full gap-2.5\">\n          {[\n            { label: \"Avg. savings\", value: \"42%\", sub: \"vs manual compliance\" },\n            { label: \"Setup time\", value: \"<1hr\", sub: \"fully operational\" },\n            { label: \"Uptime SLA\", value: \"99.9%\", sub: \"guaranteed\" },\n          ].map((metric, i) => (\n            <m.div\n              key={metric.label}\n              initial={{ opacity: 0, y: 6 }}\n              animate={{ opacity: 1, y: 0 }}\n              transition={{ duration: 0.3, delay: 0.4 + i * 0.08 }}\n              className=\"flex flex-1 flex-col items-center rounded-lg border border-gray-100 bg-white px-2 py-2\"\n            >\n              <span className=\"font-bold text-gray-900 text-sm\">{metric.value}</span>\n              <span className=\"text-[8px] text-gray-400\">{metric.sub}</span>\n            </m.div>\n          ))}\n        </div>\n      </div>\n    </LazyMotion>\n  )\n}\n"]}