@cogentic-co/ds 0.5.3 → 0.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/animations/animation-ai-analysis.js +99 -4
- package/dist/animations/animation-ai-analysis.js.map +1 -1
- package/dist/animations/animation-audit-trail.js +194 -2
- package/dist/animations/animation-audit-trail.js.map +1 -1
- package/dist/animations/animation-compliance-reports.js +108 -3
- package/dist/animations/animation-compliance-reports.js.map +1 -1
- package/dist/animations/animation-custom-rules.js +107 -3
- package/dist/animations/animation-custom-rules.js.map +1 -1
- package/dist/animations/animation-jira-ticket.js +114 -3
- package/dist/animations/animation-jira-ticket.js.map +1 -1
- package/dist/animations/animation-jurisdiction-detection.js +122 -3
- package/dist/animations/animation-jurisdiction-detection.js.map +1 -1
- package/dist/animations/animation-multi-protocol.js +63 -2
- package/dist/animations/animation-multi-protocol.js.map +1 -1
- package/dist/animations/animation-pricing-preview.js +169 -3
- package/dist/animations/animation-pricing-preview.js.map +1 -1
- package/dist/animations/animation-realtime-updates.js +140 -4
- package/dist/animations/animation-realtime-updates.js.map +1 -1
- package/dist/animations/animation-rest-api.js +121 -2
- package/dist/animations/animation-rest-api.js.map +1 -1
- package/dist/animations/animation-risk-scoring.js +158 -4
- package/dist/animations/animation-risk-scoring.js.map +1 -1
- package/dist/animations/animation-sandbox.js +107 -2
- package/dist/animations/animation-sandbox.js.map +1 -1
- package/dist/animations/animation-scheduled-reports.js +107 -3
- package/dist/animations/animation-scheduled-reports.js.map +1 -1
- package/dist/animations/animation-secure-messaging.js +99 -3
- package/dist/animations/animation-secure-messaging.js.map +1 -1
- package/dist/animations/animation-slack-notification.js +90 -3
- package/dist/animations/animation-slack-notification.js.map +1 -1
- package/dist/animations/animation-sop-mapping.js +158 -2
- package/dist/animations/animation-sop-mapping.js.map +1 -1
- package/dist/animations/animation-team-routing.js +118 -4
- package/dist/animations/animation-team-routing.js.map +1 -1
- package/dist/animations/animation-teams-notification.js +89 -3
- package/dist/animations/animation-teams-notification.js.map +1 -1
- package/dist/animations/animation-vasp-identification.js +142 -3
- package/dist/animations/animation-vasp-identification.js.map +1 -1
- package/dist/animations/animation-webhooks.js +105 -3
- package/dist/animations/animation-webhooks.js.map +1 -1
- package/dist/blocks/auth-form.js +0 -1
- package/dist/blocks/feature-section.js +0 -1
- package/dist/blocks/hero-section.js +0 -1
- package/dist/blocks/pricing-table.js +0 -1
- package/dist/blocks/stat-card.js +0 -1
- package/dist/chart-DkwdRX-i.d.ts +50 -0
- package/dist/charts.d.ts +73 -3
- package/dist/charts.js +287 -2
- package/dist/charts.js.map +1 -1
- package/dist/chunk-6RWCZUAD.js +0 -1
- package/dist/chunk-GJAWCIGE.js +237 -0
- package/dist/chunk-GJAWCIGE.js.map +1 -0
- package/dist/chunk-GZNLQE3I.js +0 -1
- package/dist/chunk-TAPJEVUA.js +0 -1
- package/dist/index.d.ts +34 -52
- package/dist/index.js +109 -168
- package/dist/index.js.map +1 -1
- package/package.json +6 -3
- package/dist/chunk-4YD3YS4B.js +0 -110
- package/dist/chunk-4YD3YS4B.js.map +0 -1
- package/dist/chunk-5JLZ42JT.js +0 -125
- package/dist/chunk-5JLZ42JT.js.map +0 -1
- package/dist/chunk-5OOO6TRA.js +0 -111
- package/dist/chunk-5OOO6TRA.js.map +0 -1
- package/dist/chunk-65Z2VEKG.js +0 -161
- package/dist/chunk-65Z2VEKG.js.map +0 -1
- package/dist/chunk-BTFYV3TI.js +0 -102
- package/dist/chunk-BTFYV3TI.js.map +0 -1
- package/dist/chunk-BTZB4JRC.js +0 -117
- package/dist/chunk-BTZB4JRC.js.map +0 -1
- package/dist/chunk-BZSA47MS.js +0 -121
- package/dist/chunk-BZSA47MS.js.map +0 -1
- package/dist/chunk-EFLWU2JP.js +0 -145
- package/dist/chunk-EFLWU2JP.js.map +0 -1
- package/dist/chunk-F7REPQOA.js +0 -93
- package/dist/chunk-F7REPQOA.js.map +0 -1
- package/dist/chunk-FKPK3CB7.js +0 -143
- package/dist/chunk-FKPK3CB7.js.map +0 -1
- package/dist/chunk-H7VUIMEL.js +0 -172
- package/dist/chunk-H7VUIMEL.js.map +0 -1
- package/dist/chunk-HTYR73ON.js +0 -161
- package/dist/chunk-HTYR73ON.js.map +0 -1
- package/dist/chunk-I26ZXVSY.js +0 -124
- package/dist/chunk-I26ZXVSY.js.map +0 -1
- package/dist/chunk-IKATDPHG.js +0 -92
- package/dist/chunk-IKATDPHG.js.map +0 -1
- package/dist/chunk-KUOF3XRZ.js +0 -108
- package/dist/chunk-KUOF3XRZ.js.map +0 -1
- package/dist/chunk-N7PBUY7G.js +0 -110
- package/dist/chunk-N7PBUY7G.js.map +0 -1
- package/dist/chunk-NAPDFVBI.js +0 -102
- package/dist/chunk-NAPDFVBI.js.map +0 -1
- package/dist/chunk-RTK7R4KZ.js +0 -66
- package/dist/chunk-RTK7R4KZ.js.map +0 -1
- package/dist/chunk-RZZTDJHG.js +0 -110
- package/dist/chunk-RZZTDJHG.js.map +0 -1
- package/dist/chunk-SNOJLZP4.js +0 -197
- package/dist/chunk-SNOJLZP4.js.map +0 -1
- package/dist/chunk-U4EPKN7G.js +0 -518
- package/dist/chunk-U4EPKN7G.js.map +0 -1
- package/dist/index-CcPuHWa-.d.ts +0 -118
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"animation-sandbox.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/animations/animation-sandbox.tsx"],"names":[],"mappings":";;;;;;AAaA,IAAM,MAAA,GAAwB;AAAA,EAC5B,EAAE,IAAA,EAAM,SAAA,EAAW,IAAA,EAAM,8DAAA,EAA+D;AAAA,EACxF,EAAE,IAAA,EAAM,MAAA,EAAQ,IAAA,EAAM,8CAAA,EAA+C;AAAA,EACrE,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,yCAAA,EAA0C;AAAA,EAClE,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,sCAAA,EAAuC;AAAA,EAC/D,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,oCAAA,EAAqC;AAAA,EAC7D,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,wCAAA,EAAyC;AAAA,EACjE,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,iCAAA,EAAkC;AAAA,EAC1D,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,4BAAA,EAA6B;AAAA,EACrD,EAAE,IAAA,EAAM,SAAA,EAAW,IAAA,EAAM,qCAAA,EAAsC;AAAA,EAC/D,EAAE,IAAA,EAAM,MAAA,EAAQ,IAAA,EAAM,+CAAA,EAAgD;AAAA,EACtE,EAAE,IAAA,EAAM,MAAA,EAAQ,IAAA,EAAM,oCAAA,EAAqC;AAAA,EAC3D,EAAE,IAAA,EAAM,SAAA,EAAW,IAAA,EAAM,EAAA,EAAG;AAAA,EAC5B,EAAE,IAAA,EAAM,SAAA,EAAW,IAAA,EAAM,+DAAA,EAAgE;AAAA,EACzF,EAAE,IAAA,EAAM,MAAA,EAAQ,IAAA,EAAM,8CAAA,EAA+C;AAAA,EACrE,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,yCAAA,EAA0C;AAAA,EAClE,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,sCAAA,EAAuC;AAAA,EAC/D,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,gCAAA,EAAiC;AAAA,EACzD,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,+BAAA,EAAgC;AAAA,EACxD,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,oCAAA,EAAqC;AAAA,EAC7D,EAAE,IAAA,EAAM,QAAA,EAAU,IAAA,EAAM,6BAAA,EAA8B;AAAA,EACtD,EAAE,IAAA,EAAM,SAAA,EAAW,IAAA,EAAM,iEAAA;AAC3B,CAAA;AAEA,IAAM,UAAA,GAAkD;AAAA,EACtD,OAAA,EAAS,eAAA;AAAA,EACT,MAAA,EAAQ,eAAA;AAAA,EACR,OAAA,EAAS,kBAAA;AAAA,EACT,IAAA,EAAM;AACR,CAAA;AAEe,SAAR,gBAAA,CAAkC,EAAE,SAAA,EAAU,EAA2B;AAC9E,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,SAAS,CAAC,CAAA;AAClD,EAAA,MAAM,SAAA,GAAY,OAAuB,IAAI,CAAA;AAE7C,EAAA,MAAM,KAAA,GAAQ,YAAY,MAAM;AAC9B,IAAA,eAAA,CAAgB,CAAC,CAAA;AAAA,EACnB,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,YAAA,GAAe,OAAO,MAAA,EAAQ;AAChC,MAAA,MAAM,IAAA,GAAO,OAAO,YAAY,CAAA;AAChC,MAAA,MAAM,KAAA,GAAQ,KAAK,IAAA,KAAS,SAAA,GAAY,MAAM,IAAA,CAAK,IAAA,KAAS,KAAK,GAAA,GAAM,GAAA;AACvE,MAAA,MAAM,EAAA,GAAK,WAAW,MAAM,eAAA,CAAgB,CAAC,CAAA,KAAM,CAAA,GAAI,CAAC,CAAA,EAAG,KAAK,CAAA;AAChE,MAAA,OAAO,MAAM,aAAa,EAAE,CAAA;AAAA,IAC9B,CAAA,MAAO;AACL,MAAA,MAAM,EAAA,GAAK,UAAA,CAAW,KAAA,EAAO,GAAI,CAAA;AACjC,MAAA,OAAO,MAAM,aAAa,EAAE,CAAA;AAAA,IAC9B;AAAA,EACF,CAAA,EAAG,CAAC,YAAA,EAAc,KAAK,CAAC,CAAA;AAExB,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,KAAK,SAAA,CAAU,OAAA;AACrB,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,qBAAA,CAAsB,MAAM;AAC1B,MAAA,EAAA,CAAG,YAAY,EAAA,CAAG,YAAA;AAAA,IACpB,CAAC,CAAA;AAAA,EACH,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,uBACE,GAAA,CAAC,UAAA,EAAA,EAAW,QAAA,EAAU,YAAA,EACpB,QAAA,kBAAA,IAAA,CAAC,SAAI,SAAA,EAAW,EAAA,CAAG,4BAAA,EAA8B,SAAS,CAAA,EAExD,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,4DAAA,EACb,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,cAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,WAAU,qCAAA,EAAsC,CAAA;AAAA,wBACtD,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uCAAA,EAAwC,CAAA;AAAA,wBACxD,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yCAAA,EAA0C;AAAA,OAAA,EAC5D,CAAA;AAAA,sBACA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,0CAAA,EAA2C,QAAA,EAAA,kBAAA,EAAgB,CAAA;AAAA,sBAC3E,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iCAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,wFAAA,EAAyF,QAAA,EAAA,SAAA,EAEzG,CAAA;AAAA,wBACA,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAS,KAAA;AAAA,YACT,SAAA,EAAU,qDAAA;AAAA,YACV,YAAA,EAAW,SAAA;AAAA,YAEX,QAAA,kBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,SAAA,EAAU,QAAA,EAAS;AAAA;AAAA;AAChC,OAAA,EACF;AAAA,KAAA,EACF,CAAA;AAAA,oBAGA,GAAA,CAAC,SAAI,GAAA,EAAK,SAAA,EAAW,WAAU,iDAAA,EAC7B,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,aAAA,EACZ,QAAA,EAAA;AAAA,MAAA,MAAA,CAAO,MAAM,CAAA,EAAG,YAAY,EAAE,GAAA,CAAI,CAAC,MAAM,CAAA,qBACxC,GAAA;AAAA,QAAC,CAAA,CAAE,CAAA;AAAA,QAAF;AAAA,UAEC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAE;AAAA,UACtB,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAE;AAAA,UACtB,WAAW,EAAA,CAAG,uCAAA,EAAyC,UAAA,CAAW,IAAA,CAAK,IAAI,CAAC,CAAA;AAAA,UAE3E,eAAK,IAAA,IAAQ;AAAA,SAAA;AAAA,QALT;AAAA,OAOR,CAAA;AAAA,MACA,eAAe,MAAA,CAAO,MAAA,wBACpB,GAAA,EAAA,EAAE,SAAA,EAAU,qDAAqD,QAAA,EAAA,QAAA,EAAS;AAAA,KAAA,EAE/E,CAAA,EACF,CAAA;AAAA,oBAGA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,8DAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,WAAU,yBAAA,EAA0B,CAAA;AAAA,sBAC1C,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,oCAAA,EAAqC,QAAA,EAAA;AAAA,QAAA,UAAA;AAAA,QAC1C,QAAA;AAAA,QAAS,sBAAA;AAAA,QAAqB,QAAA;AAAA,QAAS;AAAA,OAAA,EAClD;AAAA,KAAA,EACF;AAAA,GAAA,EACF,CAAA,EACF,CAAA;AAEJ","file":"animation-sandbox.js","sourcesContent":["\"use client\"\n\nimport { Play, RotateCcw } from \"lucide-react\"\nimport { domAnimation, LazyMotion, m } from \"motion/react\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\n\nimport { cn } from \"../lib/utils\"\n\ntype ConsoleLine = {\n type: \"command\" | \"output\" | \"success\" | \"info\"\n text: string\n}\n\nconst SCRIPT: ConsoleLine[] = [\n { type: \"command\", text: \"$ cogentic-cli test transfer --corridor AU:SG --amount 45000\" },\n { type: \"info\", text: \"\\u2192 Using sandbox environment (test mode)\" },\n { type: \"output\", text: \"Creating test transfer TXN-TEST-0001...\" },\n { type: \"output\", text: \"Screening against sandbox ruleset...\" },\n { type: \"output\", text: \" Jurisdiction: AUSTRAC \\u2192 MAS\" },\n { type: \"output\", text: \" Threshold check: AUD 10,000 exceeded\" },\n { type: \"output\", text: \" Travel Rule: IVMS101 required\" },\n { type: \"output\", text: \" Risk score: 18/100 (Low)\" },\n { type: \"success\", text: \"\\u2713 Transfer screened: COMPLIANT\" },\n { type: \"info\", text: \"\\u2192 Sandbox report: SR-TEST-0001 generated\" },\n { type: \"info\", text: \"\\u2192 No production data affected\" },\n { type: \"command\", text: \"\" },\n { type: \"command\", text: \"$ cogentic-cli test transfer --corridor HK:GB --amount 120000\" },\n { type: \"info\", text: \"\\u2192 Using sandbox environment (test mode)\" },\n { type: \"output\", text: \"Creating test transfer TXN-TEST-0002...\" },\n { type: \"output\", text: \"Screening against sandbox ruleset...\" },\n { type: \"output\", text: \" Jurisdiction: SFC \\u2192 FCA\" },\n { type: \"output\", text: \" High-risk corridor detected\" },\n { type: \"output\", text: \" Enhanced due diligence triggered\" },\n { type: \"output\", text: \" Risk score: 72/100 (High)\" },\n { type: \"success\", text: \"\\u26A0 Transfer screened: FLAGGED \\u2014 manual review required\" },\n]\n\nconst lineColour: Record<ConsoleLine[\"type\"], string> = {\n command: \"text-white/90\",\n output: \"text-white/50\",\n success: \"text-emerald-400\",\n info: \"text-[#00D4FF]/80\",\n}\n\nexport default function AnimationSandbox({ className }: { className?: string }) {\n const [visibleLines, setVisibleLines] = useState(0)\n const scrollRef = useRef<HTMLDivElement>(null)\n\n const reset = useCallback(() => {\n setVisibleLines(0)\n }, [])\n\n useEffect(() => {\n if (visibleLines < SCRIPT.length) {\n const line = SCRIPT[visibleLines]\n const delay = line.type === \"command\" ? 400 : line.text === \"\" ? 200 : 120\n const id = setTimeout(() => setVisibleLines((v) => v + 1), delay)\n return () => clearTimeout(id)\n } else {\n const id = setTimeout(reset, 4000)\n return () => clearTimeout(id)\n }\n }, [visibleLines, reset])\n\n useEffect(() => {\n const el = scrollRef.current\n if (!el) return\n requestAnimationFrame(() => {\n el.scrollTop = el.scrollHeight\n })\n }, [])\n\n return (\n <LazyMotion features={domAnimation}>\n <div className={cn(\"flex flex-col bg-[#1a1a2e]\", className)}>\n {/* Terminal bar */}\n <div className=\"flex items-center gap-3 border-white/10 border-b px-4 py-2\">\n <div className=\"flex gap-1.5\">\n <span className=\"size-2.5 rounded-full bg-red-400/80\" />\n <span className=\"size-2.5 rounded-full bg-amber-400/80\" />\n <span className=\"size-2.5 rounded-full bg-emerald-400/80\" />\n </div>\n <span className=\"ml-2 font-mono text-[10px] text-white/40\">cogentic-sandbox</span>\n <div className=\"ml-auto flex items-center gap-2\">\n <span className=\"rounded-full bg-amber-500/20 px-2 py-0.5 font-bold font-mono text-[9px] text-amber-300\">\n SANDBOX\n </span>\n <button\n onClick={reset}\n className=\"text-white/30 transition-colors hover:text-white/60\"\n aria-label=\"Restart\"\n >\n <RotateCcw className=\"size-3\" />\n </button>\n </div>\n </div>\n\n {/* Console output */}\n <div ref={scrollRef} className=\"scrollbar-none flex-1 overflow-y-auto px-4 py-3\">\n <div className=\"space-y-0.5\">\n {SCRIPT.slice(0, visibleLines).map((line, i) => (\n <m.p\n key={i}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n className={cn(\"font-mono text-[11px] leading-relaxed\", lineColour[line.type])}\n >\n {line.text || \"\\u00A0\"}\n </m.p>\n ))}\n {visibleLines < SCRIPT.length && (\n <p className=\"animate-pulse font-mono text-[11px] text-white/30\">{\"\\u2588\"}</p>\n )}\n </div>\n </div>\n\n {/* Footer */}\n <div className=\"flex items-center gap-2 border-white/10 border-t px-4 py-1.5\">\n <Play className=\"size-3 text-emerald-400\" />\n <span className=\"font-mono text-[9px] text-white/30\">\n Sandbox {\"\\u2022\"} No production data {\"\\u2022\"} Realistic responses\n </span>\n </div>\n </div>\n </LazyMotion>\n )\n}\n"]}
|
|
@@ -1,7 +1,111 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
import '../chunk-6RWCZUAD.js';
|
|
2
|
+
import { useCycleIndex } from '../chunk-6RWCZUAD.js';
|
|
4
3
|
import '../chunk-RXV2XUDZ.js';
|
|
5
|
-
import '../chunk-GZNLQE3I.js';
|
|
4
|
+
import { cn } from '../chunk-GZNLQE3I.js';
|
|
5
|
+
import { Mail, Clock, CheckCircle2 } from 'lucide-react';
|
|
6
|
+
import { LazyMotion, domAnimation, m } from 'motion/react';
|
|
7
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
8
|
+
|
|
9
|
+
var REPORTS = [
|
|
10
|
+
{
|
|
11
|
+
name: "Weekly compliance summary",
|
|
12
|
+
frequency: "Every Monday 09:00",
|
|
13
|
+
recipients: "compliance-team@",
|
|
14
|
+
lastSent: "Today, 09:00",
|
|
15
|
+
nextDue: "Next Monday",
|
|
16
|
+
status: "sent"
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
name: "Monthly STR filing digest",
|
|
20
|
+
frequency: "1st of each month",
|
|
21
|
+
recipients: "cco@, legal@",
|
|
22
|
+
lastSent: "1 Feb 2025",
|
|
23
|
+
nextDue: "1 Mar 2025",
|
|
24
|
+
status: "scheduled"
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
name: "Quarterly board report",
|
|
28
|
+
frequency: "Quarterly",
|
|
29
|
+
recipients: "board@, cco@",
|
|
30
|
+
lastSent: "1 Jan 2025",
|
|
31
|
+
nextDue: "1 Apr 2025",
|
|
32
|
+
status: "scheduled"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
name: "Daily high-risk alerts",
|
|
36
|
+
frequency: "Daily 08:00",
|
|
37
|
+
recipients: "senior-analysts@",
|
|
38
|
+
lastSent: "Today, 08:00",
|
|
39
|
+
nextDue: "Tomorrow, 08:00",
|
|
40
|
+
status: "sent"
|
|
41
|
+
}
|
|
42
|
+
];
|
|
43
|
+
var statusConfig = {
|
|
44
|
+
sent: { icon: CheckCircle2, colour: "text-emerald-500", label: "Sent" },
|
|
45
|
+
scheduled: { icon: Clock, colour: "text-[#00D4FF]", label: "Scheduled" },
|
|
46
|
+
overdue: { icon: Clock, colour: "text-red-500", label: "Overdue" }
|
|
47
|
+
};
|
|
48
|
+
function AnimationScheduledReports({ className }) {
|
|
49
|
+
const [containerRef, activeIdx] = useCycleIndex(REPORTS.length, 3e3);
|
|
50
|
+
return /* @__PURE__ */ jsx(LazyMotion, { features: domAnimation, children: /* @__PURE__ */ jsxs("div", { ref: containerRef, className: cn("flex flex-col p-5", className), children: [
|
|
51
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
|
|
52
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
53
|
+
/* @__PURE__ */ jsx("p", { className: "font-semibold text-[15px] text-foreground", children: "Scheduled Reports" }),
|
|
54
|
+
/* @__PURE__ */ jsxs("p", { className: "text-[12px] text-gray-400", children: [
|
|
55
|
+
REPORTS.length,
|
|
56
|
+
" active schedules"
|
|
57
|
+
] })
|
|
58
|
+
] }),
|
|
59
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 rounded-full bg-[#00D4FF]/10 px-2.5 py-1", children: [
|
|
60
|
+
/* @__PURE__ */ jsx(Mail, { className: "size-3 text-[#00D4FF]" }),
|
|
61
|
+
/* @__PURE__ */ jsx("span", { className: "font-semibold text-[#0099BB] text-[11px]", children: "Auto" })
|
|
62
|
+
] })
|
|
63
|
+
] }),
|
|
64
|
+
/* @__PURE__ */ jsx("div", { className: "mt-4 space-y-2", children: REPORTS.map((r, i) => {
|
|
65
|
+
const st = statusConfig[r.status];
|
|
66
|
+
const Icon = st.icon;
|
|
67
|
+
const isActive = i === activeIdx;
|
|
68
|
+
return /* @__PURE__ */ jsxs(
|
|
69
|
+
m.div,
|
|
70
|
+
{
|
|
71
|
+
animate: {
|
|
72
|
+
borderColor: isActive ? "#00D4FF" : "#f3f4f6"
|
|
73
|
+
},
|
|
74
|
+
transition: { duration: 0.3 },
|
|
75
|
+
className: "rounded-lg border bg-white px-3 py-2.5",
|
|
76
|
+
children: [
|
|
77
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
|
|
78
|
+
/* @__PURE__ */ jsx(Icon, { className: cn("size-3.5 shrink-0", st.colour) }),
|
|
79
|
+
/* @__PURE__ */ jsx("span", { className: "flex-1 truncate font-semibold text-[12px] text-gray-800", children: r.name }),
|
|
80
|
+
/* @__PURE__ */ jsx("span", { className: "text-[10px] text-gray-400", children: r.frequency })
|
|
81
|
+
] }),
|
|
82
|
+
isActive && /* @__PURE__ */ jsxs(
|
|
83
|
+
m.div,
|
|
84
|
+
{
|
|
85
|
+
initial: { opacity: 0, height: 0 },
|
|
86
|
+
animate: { opacity: 1, height: "auto" },
|
|
87
|
+
transition: { duration: 0.25 },
|
|
88
|
+
className: "mt-2 grid grid-cols-2 gap-2 border-gray-100 border-t pt-2",
|
|
89
|
+
children: [
|
|
90
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
91
|
+
/* @__PURE__ */ jsx("p", { className: "text-[9px] text-gray-400", children: "Recipients" }),
|
|
92
|
+
/* @__PURE__ */ jsx("p", { className: "font-mono text-[10px] text-gray-600", children: r.recipients })
|
|
93
|
+
] }),
|
|
94
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
95
|
+
/* @__PURE__ */ jsx("p", { className: "text-[9px] text-gray-400", children: "Last sent" }),
|
|
96
|
+
/* @__PURE__ */ jsx("p", { className: "font-medium text-[10px] text-gray-700", children: r.lastSent })
|
|
97
|
+
] })
|
|
98
|
+
]
|
|
99
|
+
}
|
|
100
|
+
)
|
|
101
|
+
]
|
|
102
|
+
},
|
|
103
|
+
r.name
|
|
104
|
+
);
|
|
105
|
+
}) })
|
|
106
|
+
] }) });
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
export { AnimationScheduledReports as default };
|
|
6
110
|
//# sourceMappingURL=animation-scheduled-reports.js.map
|
|
7
111
|
//# sourceMappingURL=animation-scheduled-reports.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"animation-scheduled-reports.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/animations/animation-scheduled-reports.tsx"],"names":[],"mappings":";;;;;;;AAkBA,IAAM,OAAA,GAA6B;AAAA,EACjC;AAAA,IACE,IAAA,EAAM,2BAAA;AAAA,IACN,SAAA,EAAW,oBAAA;AAAA,IACX,UAAA,EAAY,kBAAA;AAAA,IACZ,QAAA,EAAU,cAAA;AAAA,IACV,OAAA,EAAS,aAAA;AAAA,IACT,MAAA,EAAQ;AAAA,GACV;AAAA,EACA;AAAA,IACE,IAAA,EAAM,2BAAA;AAAA,IACN,SAAA,EAAW,mBAAA;AAAA,IACX,UAAA,EAAY,cAAA;AAAA,IACZ,QAAA,EAAU,YAAA;AAAA,IACV,OAAA,EAAS,YAAA;AAAA,IACT,MAAA,EAAQ;AAAA,GACV;AAAA,EACA;AAAA,IACE,IAAA,EAAM,wBAAA;AAAA,IACN,SAAA,EAAW,WAAA;AAAA,IACX,UAAA,EAAY,cAAA;AAAA,IACZ,QAAA,EAAU,YAAA;AAAA,IACV,OAAA,EAAS,YAAA;AAAA,IACT,MAAA,EAAQ;AAAA,GACV;AAAA,EACA;AAAA,IACE,IAAA,EAAM,wBAAA;AAAA,IACN,SAAA,EAAW,aAAA;AAAA,IACX,UAAA,EAAY,kBAAA;AAAA,IACZ,QAAA,EAAU,cAAA;AAAA,IACV,OAAA,EAAS,iBAAA;AAAA,IACT,MAAA,EAAQ;AAAA;AAEZ,CAAA;AAEA,IAAM,YAAA,GAAsF;AAAA,EAC1F,MAAM,EAAE,IAAA,EAAM,cAAc,MAAA,EAAQ,kBAAA,EAAoB,OAAO,MAAA,EAAO;AAAA,EACtE,WAAW,EAAE,IAAA,EAAM,OAAO,MAAA,EAAQ,gBAAA,EAAkB,OAAO,WAAA,EAAY;AAAA,EACvE,SAAS,EAAE,IAAA,EAAM,OAAO,MAAA,EAAQ,cAAA,EAAgB,OAAO,SAAA;AACzD,CAAA;AAEe,SAAR,yBAAA,CAA2C,EAAE,SAAA,EAAU,EAA2B;AACvF,EAAA,MAAM,CAAC,YAAA,EAAc,SAAS,IAAI,aAAA,CAAc,OAAA,CAAQ,QAAQ,GAAI,CAAA;AAEpE,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,mBAAA,EAAiB,CAAA;AAAA,wBAC1E,IAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,2BAAA,EAA6B,QAAA,EAAA;AAAA,UAAA,OAAA,CAAQ,MAAA;AAAA,UAAO;AAAA,SAAA,EAAiB;AAAA,OAAA,EAC5E,CAAA;AAAA,sBACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,oEAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,WAAU,uBAAA,EAAwB,CAAA;AAAA,wBACxC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,0CAAA,EAA2C,QAAA,EAAA,MAAA,EAAI;AAAA,OAAA,EACjE;AAAA,KAAA,EACF,CAAA;AAAA,oBAGA,GAAA,CAAC,SAAI,SAAA,EAAU,gBAAA,EACZ,kBAAQ,GAAA,CAAI,CAAC,GAAG,CAAA,KAAM;AACrB,MAAA,MAAM,EAAA,GAAK,YAAA,CAAa,CAAA,CAAE,MAAM,CAAA;AAChC,MAAA,MAAM,OAAO,EAAA,CAAG,IAAA;AAChB,MAAA,MAAM,WAAW,CAAA,KAAM,SAAA;AACvB,MAAA,uBACE,IAAA;AAAA,QAAC,CAAA,CAAE,GAAA;AAAA,QAAF;AAAA,UAEC,OAAA,EAAS;AAAA,YACP,WAAA,EAAa,WAAW,SAAA,GAAY;AAAA,WACtC;AAAA,UACA,UAAA,EAAY,EAAE,QAAA,EAAU,GAAA,EAAI;AAAA,UAC5B,SAAA,EAAU,wCAAA;AAAA,UAEV,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yBAAA,EACb,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,QAAK,SAAA,EAAW,EAAA,CAAG,mBAAA,EAAqB,EAAA,CAAG,MAAM,CAAA,EAAG,CAAA;AAAA,8BACrD,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yDAAA,EACb,YAAE,IAAA,EACL,CAAA;AAAA,8BACA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2BAAA,EAA6B,YAAE,SAAA,EAAU;AAAA,aAAA,EAC3D,CAAA;AAAA,YAEC,QAAA,oBACC,IAAA;AAAA,cAAC,CAAA,CAAE,GAAA;AAAA,cAAF;AAAA,gBACC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,gBACjC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,QAAQ,MAAA,EAAO;AAAA,gBACtC,UAAA,EAAY,EAAE,QAAA,EAAU,IAAA,EAAK;AAAA,gBAC7B,SAAA,EAAU,2DAAA;AAAA,gBAEV,QAAA,EAAA;AAAA,kCAAA,IAAA,CAAC,KAAA,EAAA,EACC,QAAA,EAAA;AAAA,oCAAA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,0BAAA,EAA2B,QAAA,EAAA,YAAA,EAAU,CAAA;AAAA,oCAClD,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,qCAAA,EAAuC,YAAE,UAAA,EAAW;AAAA,mBAAA,EACnE,CAAA;AAAA,uCACC,KAAA,EAAA,EACC,QAAA,EAAA;AAAA,oCAAA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,0BAAA,EAA2B,QAAA,EAAA,WAAA,EAAS,CAAA;AAAA,oCACjD,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,uCAAA,EAAyC,YAAE,QAAA,EAAS;AAAA,mBAAA,EACnE;AAAA;AAAA;AAAA;AACF;AAAA,SAAA;AAAA,QA9BG,CAAA,CAAE;AAAA,OAgCT;AAAA,IAEJ,CAAC,CAAA,EACH;AAAA,GAAA,EACF,CAAA,EACF,CAAA;AAEJ","file":"animation-scheduled-reports.js","sourcesContent":["\"use client\"\n\nimport { CheckCircle2, Clock, Mail } from \"lucide-react\"\nimport { domAnimation, LazyMotion, m } from \"motion/react\"\n\nimport { useCycleIndex } from \"../hooks/use-cycle-index\"\n\nimport { cn } from \"../lib/utils\"\n\ntype ScheduledReport = {\n name: string\n frequency: string\n recipients: string\n lastSent: string\n nextDue: string\n status: \"sent\" | \"scheduled\" | \"overdue\"\n}\n\nconst REPORTS: ScheduledReport[] = [\n {\n name: \"Weekly compliance summary\",\n frequency: \"Every Monday 09:00\",\n recipients: \"compliance-team@\",\n lastSent: \"Today, 09:00\",\n nextDue: \"Next Monday\",\n status: \"sent\",\n },\n {\n name: \"Monthly STR filing digest\",\n frequency: \"1st of each month\",\n recipients: \"cco@, legal@\",\n lastSent: \"1 Feb 2025\",\n nextDue: \"1 Mar 2025\",\n status: \"scheduled\",\n },\n {\n name: \"Quarterly board report\",\n frequency: \"Quarterly\",\n recipients: \"board@, cco@\",\n lastSent: \"1 Jan 2025\",\n nextDue: \"1 Apr 2025\",\n status: \"scheduled\",\n },\n {\n name: \"Daily high-risk alerts\",\n frequency: \"Daily 08:00\",\n recipients: \"senior-analysts@\",\n lastSent: \"Today, 08:00\",\n nextDue: \"Tomorrow, 08:00\",\n status: \"sent\",\n },\n]\n\nconst statusConfig: Record<string, { icon: typeof Clock; colour: string; label: string }> = {\n sent: { icon: CheckCircle2, colour: \"text-emerald-500\", label: \"Sent\" },\n scheduled: { icon: Clock, colour: \"text-[#00D4FF]\", label: \"Scheduled\" },\n overdue: { icon: Clock, colour: \"text-red-500\", label: \"Overdue\" },\n}\n\nexport default function AnimationScheduledReports({ className }: { className?: string }) {\n const [containerRef, activeIdx] = useCycleIndex(REPORTS.length, 3000)\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\">Scheduled Reports</p>\n <p className=\"text-[12px] text-gray-400\">{REPORTS.length} active schedules</p>\n </div>\n <div className=\"flex items-center gap-1.5 rounded-full bg-[#00D4FF]/10 px-2.5 py-1\">\n <Mail className=\"size-3 text-[#00D4FF]\" />\n <span className=\"font-semibold text-[#0099BB] text-[11px]\">Auto</span>\n </div>\n </div>\n\n {/* Report list */}\n <div className=\"mt-4 space-y-2\">\n {REPORTS.map((r, i) => {\n const st = statusConfig[r.status]\n const Icon = st.icon\n const isActive = i === activeIdx\n return (\n <m.div\n key={r.name}\n animate={{\n borderColor: isActive ? \"#00D4FF\" : \"#f3f4f6\",\n }}\n transition={{ duration: 0.3 }}\n className=\"rounded-lg border bg-white px-3 py-2.5\"\n >\n <div className=\"flex items-center gap-2\">\n <Icon className={cn(\"size-3.5 shrink-0\", st.colour)} />\n <span className=\"flex-1 truncate font-semibold text-[12px] text-gray-800\">\n {r.name}\n </span>\n <span className=\"text-[10px] text-gray-400\">{r.frequency}</span>\n </div>\n\n {isActive && (\n <m.div\n initial={{ opacity: 0, height: 0 }}\n animate={{ opacity: 1, height: \"auto\" }}\n transition={{ duration: 0.25 }}\n className=\"mt-2 grid grid-cols-2 gap-2 border-gray-100 border-t pt-2\"\n >\n <div>\n <p className=\"text-[9px] text-gray-400\">Recipients</p>\n <p className=\"font-mono text-[10px] text-gray-600\">{r.recipients}</p>\n </div>\n <div>\n <p className=\"text-[9px] text-gray-400\">Last sent</p>\n <p className=\"font-medium text-[10px] text-gray-700\">{r.lastSent}</p>\n </div>\n </m.div>\n )}\n </m.div>\n )\n })}\n </div>\n </div>\n </LazyMotion>\n )\n}\n"]}
|
|
@@ -1,6 +1,102 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
import '../chunk-
|
|
4
|
-
import '
|
|
2
|
+
import { useAnimationTimer } from '../chunk-RXV2XUDZ.js';
|
|
3
|
+
import { cn } from '../chunk-GZNLQE3I.js';
|
|
4
|
+
import { Lock, ShieldCheck } from 'lucide-react';
|
|
5
|
+
import { LazyMotion, domAnimation, m } from 'motion/react';
|
|
6
|
+
import { useRef, useEffect } from 'react';
|
|
7
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
8
|
+
|
|
9
|
+
var MESSAGES = [
|
|
10
|
+
{
|
|
11
|
+
direction: "sent",
|
|
12
|
+
label: "Originator data sent",
|
|
13
|
+
fields: [
|
|
14
|
+
{ key: "Name", value: "J\u2022\u2022\u2022\u2022\u2022\u2022 S\u2022\u2022\u2022h" },
|
|
15
|
+
{ key: "Account", value: "\u2022\u2022\u2022\u2022\u2022\u20227a4f" },
|
|
16
|
+
{ key: "Institution", value: "Aqua Exchange" }
|
|
17
|
+
],
|
|
18
|
+
encrypted: true
|
|
19
|
+
},
|
|
20
|
+
{
|
|
21
|
+
direction: "received",
|
|
22
|
+
label: "Beneficiary data received",
|
|
23
|
+
fields: [
|
|
24
|
+
{ key: "Name", value: "L\u2022\u2022 C\u2022\u2022n" },
|
|
25
|
+
{ key: "Account", value: "\u2022\u2022\u2022\u2022\u2022\u2022e81b" },
|
|
26
|
+
{ key: "Institution", value: "Atlas Digital" }
|
|
27
|
+
],
|
|
28
|
+
encrypted: true
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
direction: "sent",
|
|
32
|
+
label: "Verification complete",
|
|
33
|
+
fields: [
|
|
34
|
+
{ key: "Status", value: "Both parties verified" },
|
|
35
|
+
{ key: "Protocol", value: "TRP v2.0" },
|
|
36
|
+
{ key: "Ref", value: "TR-2024-0847" }
|
|
37
|
+
],
|
|
38
|
+
encrypted: true
|
|
39
|
+
}
|
|
40
|
+
];
|
|
41
|
+
function AnimationSecureMessaging({ className }) {
|
|
42
|
+
const [timerRef, tick] = useAnimationTimer(2800);
|
|
43
|
+
const cyclePos = tick % (MESSAGES.length + 1);
|
|
44
|
+
const visible = cyclePos === 0 ? [0] : Array.from(
|
|
45
|
+
{ length: Math.min(cyclePos + 1, MESSAGES.length) },
|
|
46
|
+
(_, i) => i % MESSAGES.length
|
|
47
|
+
);
|
|
48
|
+
const scrollRef = useRef(null);
|
|
49
|
+
useEffect(() => {
|
|
50
|
+
if (scrollRef.current) {
|
|
51
|
+
scrollRef.current.scrollTo({ top: scrollRef.current.scrollHeight, behavior: "smooth" });
|
|
52
|
+
}
|
|
53
|
+
}, []);
|
|
54
|
+
return /* @__PURE__ */ jsx(LazyMotion, { features: domAnimation, children: /* @__PURE__ */ jsxs("div", { ref: timerRef, className: cn("flex flex-col", className), children: [
|
|
55
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-gray-100 border-b bg-gray-50/80 px-4 py-2", children: [
|
|
56
|
+
/* @__PURE__ */ jsx(Lock, { className: "size-3 text-[#00D4FF]" }),
|
|
57
|
+
/* @__PURE__ */ jsx("span", { className: "font-semibold text-[11px] text-gray-700", children: "Encrypted Channel" }),
|
|
58
|
+
/* @__PURE__ */ jsxs("span", { className: "ml-auto flex items-center gap-1 text-[10px] text-emerald-600", children: [
|
|
59
|
+
/* @__PURE__ */ jsx(ShieldCheck, { className: "size-3" }),
|
|
60
|
+
"TLS 1.3"
|
|
61
|
+
] })
|
|
62
|
+
] }),
|
|
63
|
+
/* @__PURE__ */ jsx("div", { ref: scrollRef, className: "scrollbar-none flex-1 space-y-3 overflow-y-auto px-4 py-3", children: visible.map((msgIdx, i) => {
|
|
64
|
+
const msg = MESSAGES[msgIdx];
|
|
65
|
+
const isLatest = i === visible.length - 1;
|
|
66
|
+
return /* @__PURE__ */ jsxs(
|
|
67
|
+
m.div,
|
|
68
|
+
{
|
|
69
|
+
initial: { opacity: 0, y: 10 },
|
|
70
|
+
animate: { opacity: isLatest ? 1 : 0.5, y: 0 },
|
|
71
|
+
transition: { duration: 0.35 },
|
|
72
|
+
className: cn(
|
|
73
|
+
"max-w-[85%] rounded-lg border bg-white p-3",
|
|
74
|
+
msg.direction === "sent" ? "ml-auto border-[#00D4FF]/20" : "border-gray-100"
|
|
75
|
+
),
|
|
76
|
+
children: [
|
|
77
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
|
|
78
|
+
/* @__PURE__ */ jsx(Lock, { className: "size-2.5 text-[#00D4FF]" }),
|
|
79
|
+
/* @__PURE__ */ jsx("span", { className: "font-semibold text-[10px] text-gray-600", children: msg.label })
|
|
80
|
+
] }),
|
|
81
|
+
/* @__PURE__ */ jsx("div", { className: "mt-2 space-y-1", children: msg.fields.map((f) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
|
|
82
|
+
/* @__PURE__ */ jsx("span", { className: "text-[10px] text-gray-400", children: f.key }),
|
|
83
|
+
/* @__PURE__ */ jsx("span", { className: "font-medium font-mono text-[10px] text-gray-700", children: f.value })
|
|
84
|
+
] }, f.key)) })
|
|
85
|
+
]
|
|
86
|
+
},
|
|
87
|
+
`${i}-${msgIdx}`
|
|
88
|
+
);
|
|
89
|
+
}) }),
|
|
90
|
+
/* @__PURE__ */ jsx("div", { className: "border-gray-100 border-t bg-gray-50/60 px-4 py-2", children: /* @__PURE__ */ jsxs("p", { className: "text-center text-[9px] text-gray-400", children: [
|
|
91
|
+
"AES-256 at rest ",
|
|
92
|
+
"\u2022",
|
|
93
|
+
" TLS 1.3 in transit ",
|
|
94
|
+
"\u2022",
|
|
95
|
+
" End-to-end encrypted"
|
|
96
|
+
] }) })
|
|
97
|
+
] }) });
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
export { AnimationSecureMessaging as default };
|
|
5
101
|
//# sourceMappingURL=animation-secure-messaging.js.map
|
|
6
102
|
//# sourceMappingURL=animation-secure-messaging.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"animation-secure-messaging.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/animations/animation-secure-messaging.tsx"],"names":[],"mappings":"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","file":"animation-secure-messaging.js","sourcesContent":["\"use client\"\n\nimport { Lock, ShieldCheck } from \"lucide-react\"\nimport { domAnimation, LazyMotion, m } from \"motion/react\"\nimport { useEffect, useRef } from \"react\"\n\nimport { useAnimationTimer } from \"../hooks/use-animation-timer\"\n\nimport { cn } from \"../lib/utils\"\n\ntype Message = {\n direction: \"sent\" | \"received\"\n label: string\n fields: { key: string; value: string }[]\n encrypted: boolean\n}\n\nconst MESSAGES: Message[] = [\n {\n direction: \"sent\",\n label: \"Originator data sent\",\n fields: [\n { key: \"Name\", value: \"J\\u2022\\u2022\\u2022\\u2022\\u2022\\u2022 S\\u2022\\u2022\\u2022h\" },\n { key: \"Account\", value: \"\\u2022\\u2022\\u2022\\u2022\\u2022\\u20227a4f\" },\n { key: \"Institution\", value: \"Aqua Exchange\" },\n ],\n encrypted: true,\n },\n {\n direction: \"received\",\n label: \"Beneficiary data received\",\n fields: [\n { key: \"Name\", value: \"L\\u2022\\u2022 C\\u2022\\u2022n\" },\n { key: \"Account\", value: \"\\u2022\\u2022\\u2022\\u2022\\u2022\\u2022e81b\" },\n { key: \"Institution\", value: \"Atlas Digital\" },\n ],\n encrypted: true,\n },\n {\n direction: \"sent\",\n label: \"Verification complete\",\n fields: [\n { key: \"Status\", value: \"Both parties verified\" },\n { key: \"Protocol\", value: \"TRP v2.0\" },\n { key: \"Ref\", value: \"TR-2024-0847\" },\n ],\n encrypted: true,\n },\n]\n\nexport default function AnimationSecureMessaging({ className }: { className?: string }) {\n const [timerRef, tick] = useAnimationTimer(2800)\n // Reset to [0] after showing all messages, then accumulate again\n const cyclePos = tick % (MESSAGES.length + 1)\n const visible =\n cyclePos === 0\n ? [0]\n : Array.from(\n { length: Math.min(cyclePos + 1, MESSAGES.length) },\n (_, i) => i % MESSAGES.length,\n )\n const scrollRef = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n if (scrollRef.current) {\n scrollRef.current.scrollTo({ top: scrollRef.current.scrollHeight, behavior: \"smooth\" })\n }\n }, [])\n\n return (\n <LazyMotion features={domAnimation}>\n <div ref={timerRef} className={cn(\"flex flex-col\", className)}>\n {/* Header */}\n <div className=\"flex items-center gap-2 border-gray-100 border-b bg-gray-50/80 px-4 py-2\">\n <Lock className=\"size-3 text-[#00D4FF]\" />\n <span className=\"font-semibold text-[11px] text-gray-700\">Encrypted Channel</span>\n <span className=\"ml-auto flex items-center gap-1 text-[10px] text-emerald-600\">\n <ShieldCheck className=\"size-3\" />\n TLS 1.3\n </span>\n </div>\n\n {/* Messages */}\n <div ref={scrollRef} className=\"scrollbar-none flex-1 space-y-3 overflow-y-auto px-4 py-3\">\n {visible.map((msgIdx, i) => {\n const msg = MESSAGES[msgIdx]\n const isLatest = i === visible.length - 1\n return (\n <m.div\n key={`${i}-${msgIdx}`}\n initial={{ opacity: 0, y: 10 }}\n animate={{ opacity: isLatest ? 1 : 0.5, y: 0 }}\n transition={{ duration: 0.35 }}\n className={cn(\n \"max-w-[85%] rounded-lg border bg-white p-3\",\n msg.direction === \"sent\" ? \"ml-auto border-[#00D4FF]/20\" : \"border-gray-100\",\n )}\n >\n <div className=\"flex items-center gap-1.5\">\n <Lock className=\"size-2.5 text-[#00D4FF]\" />\n <span className=\"font-semibold text-[10px] text-gray-600\">{msg.label}</span>\n </div>\n <div className=\"mt-2 space-y-1\">\n {msg.fields.map((f) => (\n <div key={f.key} className=\"flex items-center justify-between\">\n <span className=\"text-[10px] text-gray-400\">{f.key}</span>\n <span className=\"font-medium font-mono text-[10px] text-gray-700\">\n {f.value}\n </span>\n </div>\n ))}\n </div>\n </m.div>\n )\n })}\n </div>\n\n {/* Footer */}\n <div className=\"border-gray-100 border-t bg-gray-50/60 px-4 py-2\">\n <p className=\"text-center text-[9px] text-gray-400\">\n AES-256 at rest {\"\\u2022\"} TLS 1.3 in transit {\"\\u2022\"} End-to-end encrypted\n </p>\n </div>\n </div>\n </LazyMotion>\n )\n}\n"]}
|
|
@@ -1,6 +1,93 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
import '../chunk-
|
|
4
|
-
import '
|
|
2
|
+
import { EASE_OUT } from '../chunk-TAPJEVUA.js';
|
|
3
|
+
import { cn } from '../chunk-GZNLQE3I.js';
|
|
4
|
+
import { motion } from 'motion/react';
|
|
5
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
6
|
+
|
|
7
|
+
function AnimationSlackNotification({ className }) {
|
|
8
|
+
return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col bg-white p-4", className), children: [
|
|
9
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-gray-100 border-b pb-2.5", children: [
|
|
10
|
+
/* @__PURE__ */ jsx("span", { className: "font-bold text-[13px] text-gray-900", children: "# compliance-alerts" }),
|
|
11
|
+
/* @__PURE__ */ jsx("span", { className: "rounded bg-red-100 px-1.5 py-0.5 font-bold text-[9px] text-red-600", children: "3 new" })
|
|
12
|
+
] }),
|
|
13
|
+
/* @__PURE__ */ jsxs(
|
|
14
|
+
motion.div,
|
|
15
|
+
{
|
|
16
|
+
initial: { opacity: 0, y: 10 },
|
|
17
|
+
animate: { opacity: 1, y: 0 },
|
|
18
|
+
transition: { duration: 0.5, ease: EASE_OUT, delay: 0.3 },
|
|
19
|
+
className: "mt-3 flex gap-2.5",
|
|
20
|
+
children: [
|
|
21
|
+
/* @__PURE__ */ jsx("div", { className: "flex size-8 shrink-0 items-center justify-center rounded-md bg-gray-900", children: /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsx("path", { d: "M7 1L12 4V10L7 13L2 10V4L7 1Z", stroke: "#00D4FF", strokeWidth: "1.2" }) }) }),
|
|
22
|
+
/* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
|
|
23
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-2", children: [
|
|
24
|
+
/* @__PURE__ */ jsx("span", { className: "font-bold text-[13px] text-gray-900", children: "Cogentic" }),
|
|
25
|
+
/* @__PURE__ */ jsx("span", { className: "text-[10px] text-gray-400", children: "APP 10:42 AM" })
|
|
26
|
+
] }),
|
|
27
|
+
/* @__PURE__ */ jsxs(
|
|
28
|
+
motion.div,
|
|
29
|
+
{
|
|
30
|
+
initial: { opacity: 0, x: -8 },
|
|
31
|
+
animate: { opacity: 1, x: 0 },
|
|
32
|
+
transition: { duration: 0.4, ease: EASE_OUT, delay: 0.6 },
|
|
33
|
+
className: "mt-1.5 rounded-md border-red-400 border-l-[3px] bg-gray-50 px-3 py-2.5",
|
|
34
|
+
children: [
|
|
35
|
+
/* @__PURE__ */ jsx("p", { className: "font-semibold text-[12px] text-gray-900", children: "Transfer flagged \u2014 manual review required" }),
|
|
36
|
+
/* @__PURE__ */ jsxs("div", { className: "mt-1.5 flex flex-wrap gap-x-4 gap-y-1", children: [
|
|
37
|
+
/* @__PURE__ */ jsxs("span", { className: "text-[11px] text-gray-500", children: [
|
|
38
|
+
/* @__PURE__ */ jsx("span", { className: "font-medium text-gray-700", children: "TXN-0847" }),
|
|
39
|
+
" \xB7 AU \u2192 SG"
|
|
40
|
+
] }),
|
|
41
|
+
/* @__PURE__ */ jsxs("span", { className: "text-[11px] text-gray-500", children: [
|
|
42
|
+
"Risk: ",
|
|
43
|
+
/* @__PURE__ */ jsx("span", { className: "font-semibold text-red-500", children: "High (72)" })
|
|
44
|
+
] })
|
|
45
|
+
] }),
|
|
46
|
+
/* @__PURE__ */ jsx("p", { className: "mt-1.5 text-[11px] text-gray-500 leading-relaxed", children: "PEP screening match detected. Beneficiary threshold exceeded for SG corridor." })
|
|
47
|
+
]
|
|
48
|
+
}
|
|
49
|
+
),
|
|
50
|
+
/* @__PURE__ */ jsx(
|
|
51
|
+
motion.div,
|
|
52
|
+
{
|
|
53
|
+
initial: { opacity: 0 },
|
|
54
|
+
animate: { opacity: 1 },
|
|
55
|
+
transition: { duration: 0.3, delay: 0.9 },
|
|
56
|
+
className: "mt-2 flex gap-1.5",
|
|
57
|
+
children: ["Review", "Approve", "Escalate"].map((label) => /* @__PURE__ */ jsx(
|
|
58
|
+
"span",
|
|
59
|
+
{
|
|
60
|
+
className: "rounded border border-gray-200 bg-white px-2.5 py-1 font-medium text-[11px] text-gray-700",
|
|
61
|
+
children: label
|
|
62
|
+
},
|
|
63
|
+
label
|
|
64
|
+
))
|
|
65
|
+
}
|
|
66
|
+
),
|
|
67
|
+
/* @__PURE__ */ jsxs(
|
|
68
|
+
motion.div,
|
|
69
|
+
{
|
|
70
|
+
initial: { opacity: 0, y: 6 },
|
|
71
|
+
animate: { opacity: 1, y: 0 },
|
|
72
|
+
transition: { duration: 0.4, ease: EASE_OUT, delay: 1.3 },
|
|
73
|
+
className: "mt-3 flex items-start gap-2 border-gray-100 border-t pt-2.5",
|
|
74
|
+
children: [
|
|
75
|
+
/* @__PURE__ */ jsx("div", { className: "flex size-5 shrink-0 items-center justify-center rounded-full bg-emerald-100 font-bold text-[9px] text-emerald-700", children: "JC" }),
|
|
76
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
77
|
+
/* @__PURE__ */ jsx("span", { className: "font-semibold text-[11px] text-gray-900", children: "J. Chen" }),
|
|
78
|
+
/* @__PURE__ */ jsx("span", { className: "ml-1.5 text-[10px] text-gray-400", children: "10:44 AM" }),
|
|
79
|
+
/* @__PURE__ */ jsx("p", { className: "mt-0.5 text-[11px] text-gray-600", children: "Reviewed. PEP match is a false positive \u2014 approved." })
|
|
80
|
+
] })
|
|
81
|
+
]
|
|
82
|
+
}
|
|
83
|
+
)
|
|
84
|
+
] })
|
|
85
|
+
]
|
|
86
|
+
}
|
|
87
|
+
)
|
|
88
|
+
] });
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
export { AnimationSlackNotification as default };
|
|
5
92
|
//# sourceMappingURL=animation-slack-notification.js.map
|
|
6
93
|
//# sourceMappingURL=animation-slack-notification.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"animation-slack-notification.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/animations/animation-slack-notification.tsx"],"names":[],"mappings":"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","file":"animation-slack-notification.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 AnimationSlackNotification({ className }: { className?: string }) {\n return (\n <div className={cn(\"flex flex-col bg-white p-4\", className)}>\n {/* Channel header */}\n <div className=\"flex items-center gap-2 border-gray-100 border-b pb-2.5\">\n <span className=\"font-bold text-[13px] text-gray-900\"># compliance-alerts</span>\n <span className=\"rounded bg-red-100 px-1.5 py-0.5 font-bold text-[9px] text-red-600\">\n 3 new\n </span>\n </div>\n\n {/* Bot message */}\n <motion.div\n initial={{ opacity: 0, y: 10 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.5, ease: EASE_OUT, delay: 0.3 }}\n className=\"mt-3 flex gap-2.5\"\n >\n {/* Bot avatar */}\n <div className=\"flex size-8 shrink-0 items-center justify-center rounded-md bg-gray-900\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M7 1L12 4V10L7 13L2 10V4L7 1Z\" stroke=\"#00D4FF\" strokeWidth=\"1.2\" />\n </svg>\n </div>\n\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex items-baseline gap-2\">\n <span className=\"font-bold text-[13px] text-gray-900\">Cogentic</span>\n <span className=\"text-[10px] text-gray-400\">APP 10:42 AM</span>\n </div>\n\n {/* Attachment card */}\n <motion.div\n initial={{ opacity: 0, x: -8 }}\n animate={{ opacity: 1, x: 0 }}\n transition={{ duration: 0.4, ease: EASE_OUT, delay: 0.6 }}\n className=\"mt-1.5 rounded-md border-red-400 border-l-[3px] bg-gray-50 px-3 py-2.5\"\n >\n <p className=\"font-semibold text-[12px] text-gray-900\">\n Transfer flagged — manual review required\n </p>\n <div className=\"mt-1.5 flex flex-wrap gap-x-4 gap-y-1\">\n <span className=\"text-[11px] text-gray-500\">\n <span className=\"font-medium text-gray-700\">TXN-0847</span> · AU → SG\n </span>\n <span className=\"text-[11px] text-gray-500\">\n Risk: <span className=\"font-semibold text-red-500\">High (72)</span>\n </span>\n </div>\n <p className=\"mt-1.5 text-[11px] text-gray-500 leading-relaxed\">\n PEP screening match detected. Beneficiary threshold exceeded for SG corridor.\n </p>\n </motion.div>\n\n {/* Action buttons */}\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.3, delay: 0.9 }}\n className=\"mt-2 flex gap-1.5\"\n >\n {[\"Review\", \"Approve\", \"Escalate\"].map((label) => (\n <span\n key={label}\n className=\"rounded border border-gray-200 bg-white px-2.5 py-1 font-medium text-[11px] text-gray-700\"\n >\n {label}\n </span>\n ))}\n </motion.div>\n\n {/* Thread reply */}\n <motion.div\n initial={{ opacity: 0, y: 6 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.4, ease: EASE_OUT, delay: 1.3 }}\n className=\"mt-3 flex items-start gap-2 border-gray-100 border-t pt-2.5\"\n >\n <div className=\"flex size-5 shrink-0 items-center justify-center rounded-full bg-emerald-100 font-bold text-[9px] text-emerald-700\">\n JC\n </div>\n <div>\n <span className=\"font-semibold text-[11px] text-gray-900\">J. Chen</span>\n <span className=\"ml-1.5 text-[10px] text-gray-400\">10:44 AM</span>\n <p className=\"mt-0.5 text-[11px] text-gray-600\">\n Reviewed. PEP match is a false positive — approved.\n </p>\n </div>\n </motion.div>\n </div>\n </motion.div>\n </div>\n )\n}\n"]}
|
|
@@ -1,5 +1,161 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
import '
|
|
2
|
+
import { cn } from '../chunk-GZNLQE3I.js';
|
|
3
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
4
|
+
|
|
5
|
+
var ITEMS = [
|
|
6
|
+
{
|
|
7
|
+
code: "SOP-001",
|
|
8
|
+
regulation: "AML/CFT Policy",
|
|
9
|
+
jurisdiction: "AUSTRAC",
|
|
10
|
+
flag: "\u{1F1E6}\u{1F1FA}",
|
|
11
|
+
version: "v3.2",
|
|
12
|
+
coverage: "14 controls mapped",
|
|
13
|
+
lastReview: "Reviewed 3 days ago",
|
|
14
|
+
status: "mapped"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
code: "SOP-014",
|
|
18
|
+
regulation: "Travel Rule \u2014 IVMS101",
|
|
19
|
+
jurisdiction: "MAS",
|
|
20
|
+
flag: "\u{1F1F8}\u{1F1EC}",
|
|
21
|
+
version: "v2.1",
|
|
22
|
+
coverage: "8 controls mapped",
|
|
23
|
+
lastReview: "Updated 12 hours ago",
|
|
24
|
+
status: "updated"
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
code: "SOP-007",
|
|
28
|
+
regulation: "Enhanced Due Diligence",
|
|
29
|
+
jurisdiction: "FCA",
|
|
30
|
+
flag: "\u{1F1EC}\u{1F1E7}",
|
|
31
|
+
version: "v1.8",
|
|
32
|
+
coverage: "11 controls mapped",
|
|
33
|
+
lastReview: "Review due in 2 days",
|
|
34
|
+
status: "review"
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
code: "SOP-023",
|
|
38
|
+
regulation: "Sanctions Screening",
|
|
39
|
+
jurisdiction: "OFAC",
|
|
40
|
+
flag: "\u{1F1FA}\u{1F1F8}",
|
|
41
|
+
version: "v4.0",
|
|
42
|
+
coverage: "6 controls mapped",
|
|
43
|
+
lastReview: "Reviewed 1 week ago",
|
|
44
|
+
status: "mapped"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
code: "SOP-009",
|
|
48
|
+
regulation: "MiCA Compliance",
|
|
49
|
+
jurisdiction: "EU",
|
|
50
|
+
flag: "\u{1F1EA}\u{1F1FA}",
|
|
51
|
+
version: "v1.4",
|
|
52
|
+
coverage: "19 controls mapped",
|
|
53
|
+
lastReview: "Updated 2 days ago",
|
|
54
|
+
status: "updated"
|
|
55
|
+
},
|
|
56
|
+
{
|
|
57
|
+
code: "SOP-031",
|
|
58
|
+
regulation: "VA Licensing Framework",
|
|
59
|
+
jurisdiction: "SFC",
|
|
60
|
+
flag: "\u{1F1ED}\u{1F1F0}",
|
|
61
|
+
version: "v2.0",
|
|
62
|
+
coverage: "9 controls mapped",
|
|
63
|
+
lastReview: "Reviewed 5 days ago",
|
|
64
|
+
status: "mapped"
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
code: "SOP-018",
|
|
68
|
+
regulation: "Threshold Reporting",
|
|
69
|
+
jurisdiction: "FINTRAC",
|
|
70
|
+
flag: "\u{1F1E8}\u{1F1E6}",
|
|
71
|
+
version: "v3.1",
|
|
72
|
+
coverage: "7 controls mapped",
|
|
73
|
+
lastReview: "Review due tomorrow",
|
|
74
|
+
status: "review"
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
code: "SOP-042",
|
|
78
|
+
regulation: "VASP Obligations",
|
|
79
|
+
jurisdiction: "VARA",
|
|
80
|
+
flag: "\u{1F1E6}\u{1F1EA}",
|
|
81
|
+
version: "v1.1",
|
|
82
|
+
coverage: "12 controls mapped",
|
|
83
|
+
lastReview: "Reviewed 2 weeks ago",
|
|
84
|
+
status: "mapped"
|
|
85
|
+
}
|
|
86
|
+
];
|
|
87
|
+
var statusStyle = {
|
|
88
|
+
mapped: { dot: "bg-emerald-400", label: "Mapped", bg: "bg-emerald-50 text-emerald-700" },
|
|
89
|
+
review: { dot: "bg-amber-400", label: "Review", bg: "bg-amber-50 text-amber-700" },
|
|
90
|
+
updated: { dot: "bg-[#00D4FF]", label: "Updated", bg: "bg-sky-50 text-sky-700" }
|
|
91
|
+
};
|
|
92
|
+
function AnimationSopMapping({ className }) {
|
|
93
|
+
const doubled = [...ITEMS, ...ITEMS];
|
|
94
|
+
return /* @__PURE__ */ jsxs("div", { className: cn("relative flex items-center overflow-hidden", className), children: [
|
|
95
|
+
/* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-y-0 left-0 z-10 w-16 bg-gradient-to-r from-card/40 to-transparent" }),
|
|
96
|
+
/* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-y-0 right-0 z-10 w-16 bg-gradient-to-l from-card/40 to-transparent" }),
|
|
97
|
+
/* @__PURE__ */ jsx(
|
|
98
|
+
"div",
|
|
99
|
+
{
|
|
100
|
+
className: "flex w-max animate-marquee-left gap-4 px-4",
|
|
101
|
+
style: { animationDuration: "55s" },
|
|
102
|
+
children: doubled.map((item, i) => {
|
|
103
|
+
const st = statusStyle[item.status];
|
|
104
|
+
return /* @__PURE__ */ jsxs(
|
|
105
|
+
"div",
|
|
106
|
+
{
|
|
107
|
+
className: "flex shrink-0 flex-col rounded-xl border border-gray-200 bg-white shadow-sm",
|
|
108
|
+
style: { width: 260 },
|
|
109
|
+
children: [
|
|
110
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-gray-100 border-b px-4 py-3", children: [
|
|
111
|
+
/* @__PURE__ */ jsx("span", { className: "font-bold font-mono text-[11px] text-gray-400", children: item.code }),
|
|
112
|
+
/* @__PURE__ */ jsx("span", { className: "text-[10px] text-gray-300", children: item.version }),
|
|
113
|
+
/* @__PURE__ */ jsx(
|
|
114
|
+
"span",
|
|
115
|
+
{
|
|
116
|
+
className: cn(
|
|
117
|
+
"ml-auto rounded-full px-2 py-0.5 font-semibold text-[10px]",
|
|
118
|
+
st.bg
|
|
119
|
+
),
|
|
120
|
+
children: st.label
|
|
121
|
+
}
|
|
122
|
+
)
|
|
123
|
+
] }),
|
|
124
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2.5 px-4 py-3", children: [
|
|
125
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
126
|
+
/* @__PURE__ */ jsx("p", { className: "font-semibold text-[13px] text-gray-900 leading-snug", children: item.regulation }),
|
|
127
|
+
/* @__PURE__ */ jsxs("div", { className: "mt-1 flex items-center gap-1.5", children: [
|
|
128
|
+
/* @__PURE__ */ jsx("span", { className: "text-sm", children: item.flag }),
|
|
129
|
+
/* @__PURE__ */ jsx("span", { className: "text-[11px] text-gray-500", children: item.jurisdiction })
|
|
130
|
+
] })
|
|
131
|
+
] }),
|
|
132
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
133
|
+
/* @__PURE__ */ jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsx("span", { className: "font-medium text-[10px] text-gray-500", children: item.coverage }) }),
|
|
134
|
+
/* @__PURE__ */ jsx("div", { className: "mt-1 h-1.5 overflow-hidden rounded-full bg-gray-100", children: /* @__PURE__ */ jsx(
|
|
135
|
+
"div",
|
|
136
|
+
{
|
|
137
|
+
className: cn(
|
|
138
|
+
"h-full rounded-full",
|
|
139
|
+
item.status === "mapped" ? "bg-emerald-400" : item.status === "updated" ? "bg-[#00D4FF]" : "bg-amber-400"
|
|
140
|
+
),
|
|
141
|
+
style: {
|
|
142
|
+
width: item.status === "mapped" ? "100%" : item.status === "updated" ? "85%" : "60%"
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
) })
|
|
146
|
+
] }),
|
|
147
|
+
/* @__PURE__ */ jsx("p", { className: "text-[10px] text-gray-400", children: item.lastReview })
|
|
148
|
+
] })
|
|
149
|
+
]
|
|
150
|
+
},
|
|
151
|
+
`${item.code}-${i}`
|
|
152
|
+
);
|
|
153
|
+
})
|
|
154
|
+
}
|
|
155
|
+
)
|
|
156
|
+
] });
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
export { AnimationSopMapping as default };
|
|
4
160
|
//# sourceMappingURL=animation-sop-mapping.js.map
|
|
5
161
|
//# sourceMappingURL=animation-sop-mapping.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"animation-sop-mapping.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/animations/animation-sop-mapping.tsx"],"names":[],"mappings":"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","file":"animation-sop-mapping.js","sourcesContent":["\"use client\"\n\nimport { cn } from \"../lib/utils\"\n\ntype SopItem = {\n code: string\n regulation: string\n jurisdiction: string\n flag: string\n version: string\n coverage: string\n lastReview: string\n status: \"mapped\" | \"review\" | \"updated\"\n}\n\nconst ITEMS: SopItem[] = [\n {\n code: \"SOP-001\",\n regulation: \"AML/CFT Policy\",\n jurisdiction: \"AUSTRAC\",\n flag: \"\\u{1F1E6}\\u{1F1FA}\",\n version: \"v3.2\",\n coverage: \"14 controls mapped\",\n lastReview: \"Reviewed 3 days ago\",\n status: \"mapped\",\n },\n {\n code: \"SOP-014\",\n regulation: \"Travel Rule — IVMS101\",\n jurisdiction: \"MAS\",\n flag: \"\\u{1F1F8}\\u{1F1EC}\",\n version: \"v2.1\",\n coverage: \"8 controls mapped\",\n lastReview: \"Updated 12 hours ago\",\n status: \"updated\",\n },\n {\n code: \"SOP-007\",\n regulation: \"Enhanced Due Diligence\",\n jurisdiction: \"FCA\",\n flag: \"\\u{1F1EC}\\u{1F1E7}\",\n version: \"v1.8\",\n coverage: \"11 controls mapped\",\n lastReview: \"Review due in 2 days\",\n status: \"review\",\n },\n {\n code: \"SOP-023\",\n regulation: \"Sanctions Screening\",\n jurisdiction: \"OFAC\",\n flag: \"\\u{1F1FA}\\u{1F1F8}\",\n version: \"v4.0\",\n coverage: \"6 controls mapped\",\n lastReview: \"Reviewed 1 week ago\",\n status: \"mapped\",\n },\n {\n code: \"SOP-009\",\n regulation: \"MiCA Compliance\",\n jurisdiction: \"EU\",\n flag: \"\\u{1F1EA}\\u{1F1FA}\",\n version: \"v1.4\",\n coverage: \"19 controls mapped\",\n lastReview: \"Updated 2 days ago\",\n status: \"updated\",\n },\n {\n code: \"SOP-031\",\n regulation: \"VA Licensing Framework\",\n jurisdiction: \"SFC\",\n flag: \"\\u{1F1ED}\\u{1F1F0}\",\n version: \"v2.0\",\n coverage: \"9 controls mapped\",\n lastReview: \"Reviewed 5 days ago\",\n status: \"mapped\",\n },\n {\n code: \"SOP-018\",\n regulation: \"Threshold Reporting\",\n jurisdiction: \"FINTRAC\",\n flag: \"\\u{1F1E8}\\u{1F1E6}\",\n version: \"v3.1\",\n coverage: \"7 controls mapped\",\n lastReview: \"Review due tomorrow\",\n status: \"review\",\n },\n {\n code: \"SOP-042\",\n regulation: \"VASP Obligations\",\n jurisdiction: \"VARA\",\n flag: \"\\u{1F1E6}\\u{1F1EA}\",\n version: \"v1.1\",\n coverage: \"12 controls mapped\",\n lastReview: \"Reviewed 2 weeks ago\",\n status: \"mapped\",\n },\n]\n\nconst statusStyle: Record<SopItem[\"status\"], { dot: string; label: string; bg: string }> = {\n mapped: { dot: \"bg-emerald-400\", label: \"Mapped\", bg: \"bg-emerald-50 text-emerald-700\" },\n review: { dot: \"bg-amber-400\", label: \"Review\", bg: \"bg-amber-50 text-amber-700\" },\n updated: { dot: \"bg-[#00D4FF]\", label: \"Updated\", bg: \"bg-sky-50 text-sky-700\" },\n}\n\nexport default function AnimationSopMapping({ className }: { className?: string }) {\n const doubled = [...ITEMS, ...ITEMS]\n\n return (\n <div className={cn(\"relative flex items-center overflow-hidden\", className)}>\n {/* Fade edges */}\n <div className=\"pointer-events-none absolute inset-y-0 left-0 z-10 w-16 bg-gradient-to-r from-card/40 to-transparent\" />\n <div className=\"pointer-events-none absolute inset-y-0 right-0 z-10 w-16 bg-gradient-to-l from-card/40 to-transparent\" />\n\n {/* Scrolling row */}\n <div\n className=\"flex w-max animate-marquee-left gap-4 px-4\"\n style={{ animationDuration: \"55s\" }}\n >\n {doubled.map((item, i) => {\n const st = statusStyle[item.status]\n return (\n <div\n key={`${item.code}-${i}`}\n className=\"flex shrink-0 flex-col rounded-xl border border-gray-200 bg-white shadow-sm\"\n style={{ width: 260 }}\n >\n {/* Header */}\n <div className=\"flex items-center gap-2 border-gray-100 border-b px-4 py-3\">\n <span className=\"font-bold font-mono text-[11px] text-gray-400\">{item.code}</span>\n <span className=\"text-[10px] text-gray-300\">{item.version}</span>\n <span\n className={cn(\n \"ml-auto rounded-full px-2 py-0.5 font-semibold text-[10px]\",\n st.bg,\n )}\n >\n {st.label}\n </span>\n </div>\n\n {/* Body */}\n <div className=\"flex flex-col gap-2.5 px-4 py-3\">\n <div>\n <p className=\"font-semibold text-[13px] text-gray-900 leading-snug\">\n {item.regulation}\n </p>\n <div className=\"mt-1 flex items-center gap-1.5\">\n <span className=\"text-sm\">{item.flag}</span>\n <span className=\"text-[11px] text-gray-500\">{item.jurisdiction}</span>\n </div>\n </div>\n\n {/* Progress bar */}\n <div>\n <div className=\"flex items-center justify-between\">\n <span className=\"font-medium text-[10px] text-gray-500\">{item.coverage}</span>\n </div>\n <div className=\"mt-1 h-1.5 overflow-hidden rounded-full bg-gray-100\">\n <div\n className={cn(\n \"h-full rounded-full\",\n item.status === \"mapped\"\n ? \"bg-emerald-400\"\n : item.status === \"updated\"\n ? \"bg-[#00D4FF]\"\n : \"bg-amber-400\",\n )}\n style={{\n width:\n item.status === \"mapped\"\n ? \"100%\"\n : item.status === \"updated\"\n ? \"85%\"\n : \"60%\",\n }}\n />\n </div>\n </div>\n\n <p className=\"text-[10px] text-gray-400\">{item.lastReview}</p>\n </div>\n </div>\n )\n })}\n </div>\n </div>\n )\n}\n"]}
|