@paro.io/expert-shared-components 1.14.42 → 1.14.45

package/lib/tax-axis/components/dashboard/StrategyDetailPanel.js

@@ -0,0 +1,139 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StrategyDetailPanel = StrategyDetailPanel;
+const react_1 = __importDefault(require("react"));
+const data_1 = require("../../lib/data");
+const TaxAxisBadge_1 = require("../shared/TaxAxisBadge");
+function Sec({ title, children }) {
+    return (react_1.default.createElement("div", { className: "mb-6" },
+        react_1.default.createElement("div", { className: "text-[11px] font-bold text-tax-axis-teal-light uppercase tracking-widest mb-2.5 font-tax-axis-mono" }, title),
+        children));
+}
+const fmtK = (n) => `$${(n / 1000).toFixed(n % 1000 ? 1 : 0)}K`;
+function StrategyDetailPanel({ s, profile, computed, onClose }) {
+    var _a, _b, _c, _d, _e, _f;
+    const narr = data_1.STRATEGY_NARRATIVE[s.rank];
+    const c = computed === null || computed === void 0 ? void 0 : computed.get(s.rank);
+    const lo = (_a = c === null || c === void 0 ? void 0 : c.lo) !== null && _a !== void 0 ? _a : s.lo;
+    const hi = (_b = c === null || c === void 0 ? void 0 : c.hi) !== null && _b !== void 0 ? _b : s.hi;
+    const sources = (_d = (_c = c === null || c === void 0 ? void 0 : c.sources) !== null && _c !== void 0 ? _c : s.sources) !== null && _d !== void 0 ? _d : [];
+    const trace = (_f = (_e = c === null || c === void 0 ? void 0 : c.trace) !== null && _e !== void 0 ? _e : s.trace) !== null && _f !== void 0 ? _f : [];
+    const whyText = narr ? narr.whyMatters(profile) : data_1.NARRATIVE_FALLBACK.whyMatters(s);
+    const breakdownText = narr ? narr.breakdown(profile, c) : data_1.NARRATIVE_FALLBACK.breakdown(s, c);
+    const specialistText = (narr === null || narr === void 0 ? void 0 : narr.whySpecialist) || data_1.NARRATIVE_FALLBACK.whySpecialist(s);
+    const nextText = narr ? narr.nextSteps : data_1.NARRATIVE_FALLBACK.nextSteps(s);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { onClick: onClose, className: "fixed inset-0 z-[200]", style: { background: "rgba(6,8,33,0.7)", backdropFilter: "blur(4px)" } }),
+        react_1.default.createElement("div", { className: "fixed top-0 right-0 bottom-0 z-[201] flex flex-col", style: {
+                width: 520,
+                maxWidth: "calc(100vw - 24px)",
+                background: "#0E1132",
+                borderLeft: "1px solid rgba(36,131,132,0.12)",
+                boxShadow: "-8px 0 40px rgba(6,8,33,0.6)",
+            } },
+            react_1.default.createElement("div", { className: "px-6 py-5 flex-shrink-0", style: { borderBottom: "1px solid rgba(36,131,132,0.12)" } },
+                react_1.default.createElement("div", { className: "flex justify-between items-start mb-3" },
+                    react_1.default.createElement("div", null,
+                        react_1.default.createElement("div", { className: "flex items-center gap-2 mb-1.5" },
+                            react_1.default.createElement("span", { className: "text-xl font-bold text-tax-axis-text font-tax-axis-head" }, s.name),
+                            react_1.default.createElement("span", { className: "text-[11px] font-tax-axis-mono text-tax-axis-teal-light bg-tax-axis-teal-bg px-2 py-0.5 rounded" }, s.code)),
+                        react_1.default.createElement("div", { className: "flex gap-2" },
+                            react_1.default.createElement(TaxAxisBadge_1.TaxAxisBadge, null, s.priority),
+                            react_1.default.createElement(TaxAxisBadge_1.TaxAxisBadge, { color: "neutral" }, s.timeline),
+                            s.cost && s.cost !== "$0" && (react_1.default.createElement(TaxAxisBadge_1.TaxAxisBadge, { color: "orange" }, s.cost)))),
+                    react_1.default.createElement("button", { onClick: onClose, className: "flex items-center justify-center w-8 h-8 rounded-lg", style: { background: "#1A1D3A", border: "1px solid rgba(36,131,132,0.12)" } },
+                        react_1.default.createElement("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none" },
+                            react_1.default.createElement("path", { d: "M2.5 2.5l7 7M9.5 2.5l-7 7", stroke: "#9498B8", strokeWidth: "1.5", strokeLinecap: "round" })))),
+                react_1.default.createElement("div", { className: "font-tax-axis-head", style: { fontSize: 34, fontWeight: 900, color: "#A1E5E6", letterSpacing: "-1.5px" } },
+                    fmtK(lo),
+                    "\u2013",
+                    fmtK(hi),
+                    react_1.default.createElement("span", { className: "text-[13px] text-tax-axis-text-3 font-normal font-tax-axis-body ml-2" }, "est. annual savings"))),
+            react_1.default.createElement("div", { className: "flex-1 overflow-y-auto p-6" },
+                s.warning && (react_1.default.createElement("div", { className: "p-3 rounded-lg mb-6 text-xs leading-relaxed", style: {
+                        background: "rgba(251,154,29,0.06)",
+                        border: "1px solid rgba(251,154,29,0.25)",
+                        color: "#FB9A1D",
+                    } },
+                    react_1.default.createElement("strong", null, "Flag: "),
+                    s.warning)),
+                react_1.default.createElement("div", { className: "mb-6" },
+                    react_1.default.createElement("div", { className: "text-[11px] font-bold uppercase tracking-widest text-tax-axis-text-4 mb-2 font-tax-axis-mono" }, "WHY THIS MATTERS"),
+                    react_1.default.createElement("div", { className: "text-[13px] text-tax-axis-text-2 leading-[1.75] font-tax-axis-body" }, whyText)),
+                react_1.default.createElement("div", { className: "mb-6" },
+                    react_1.default.createElement("div", { className: "text-[11px] font-bold uppercase tracking-widest text-tax-axis-text-4 mb-2 font-tax-axis-mono" }, "HOW SAVINGS BREAK DOWN"),
+                    react_1.default.createElement("div", { className: "text-[13px] text-tax-axis-text-2 leading-[1.75] font-tax-axis-body" }, breakdownText)),
+                react_1.default.createElement("div", { className: "mb-6 pl-3.5 py-0.5", style: { borderLeft: "3px solid #FB9A1D" } },
+                    react_1.default.createElement("div", { className: "text-[11px] font-bold uppercase tracking-widest mb-2 font-tax-axis-mono", style: { color: "#FB9A1D" } }, "WHY YOU NEED A SPECIALIST"),
+                    react_1.default.createElement("div", { className: "text-[13px] text-tax-axis-text-2 leading-[1.75] font-tax-axis-body" }, specialistText)),
+                react_1.default.createElement("div", { className: "rounded-lg p-3 mb-6", style: { background: "rgba(36,131,132,0.06)", border: "1px solid rgba(36,131,132,0.2)" } },
+                    react_1.default.createElement("div", { className: "text-[11px] font-bold uppercase tracking-widest text-tax-axis-teal-light mb-1.5 font-tax-axis-mono" }, "WHAT WE'D DO NEXT"),
+                    react_1.default.createElement("div", { className: "text-[13px] text-tax-axis-text leading-[1.7] font-tax-axis-body" }, typeof nextText === "string" ? nextText : "Provide documents so we can calculate exact savings.")),
+                react_1.default.createElement(Sec, { title: "Summary" },
+                    react_1.default.createElement("p", { className: "text-sm text-tax-axis-text leading-[1.8] font-tax-axis-body" }, s.abstract)),
+                react_1.default.createElement(Sec, { title: "Plain Language" },
+                    react_1.default.createElement("div", { className: "p-3.5 rounded-[10px]", style: { background: "rgba(36,131,132,0.06)", border: "1px solid rgba(36,131,132,0.2)" } },
+                        react_1.default.createElement("p", { className: "text-sm text-tax-axis-teal-light leading-[1.7] font-tax-axis-body italic" },
+                            "\u201C",
+                            s.clientBrief,
+                            "\u201D"))),
+                react_1.default.createElement(Sec, { title: "Source Documents" },
+                    react_1.default.createElement("div", { className: "rounded-[10px] overflow-hidden", style: { border: "1px solid rgba(36,131,132,0.12)" } },
+                        react_1.default.createElement("div", { className: "grid grid-cols-[1.2fr_1fr_.8fr_.8fr] px-3.5 py-2.5", style: { background: "#161938" } }, ["Field", "Document", "Line", "Value"].map((h) => (react_1.default.createElement("span", { key: h, className: "text-[10px] font-semibold text-tax-axis-text-3 uppercase tracking-wider font-tax-axis-mono" }, h)))),
+                        sources.map((src, i) => (react_1.default.createElement("div", { key: i, className: "grid grid-cols-[1.2fr_1fr_.8fr_.8fr] px-3.5 py-2.5", style: { borderTop: "1px solid rgba(36,131,132,0.12)" } },
+                            react_1.default.createElement("span", { className: "text-xs text-tax-axis-text" }, src.field),
+                            react_1.default.createElement("span", { className: "text-[11px] font-tax-axis-mono text-tax-axis-text-2" }, src.doc),
+                            react_1.default.createElement("span", { className: "text-[11px] font-tax-axis-mono text-tax-axis-text-2" }, src.line),
+                            react_1.default.createElement("span", { className: "text-[13px] font-semibold text-tax-axis-teal-light font-tax-axis-mono" }, src.value)))))),
+                react_1.default.createElement(Sec, { title: "Calculation Trace" },
+                    react_1.default.createElement("div", { className: "rounded-[10px] overflow-hidden", style: { border: "1px solid rgba(36,131,132,0.12)" } },
+                        trace.map((t, i) => (react_1.default.createElement("div", { key: i, className: "p-3 flex gap-3 items-start", style: { borderTop: i ? "1px solid rgba(36,131,132,0.12)" : "none" } },
+                            react_1.default.createElement("span", { className: "text-[11px] font-bold text-tax-axis-teal font-tax-axis-mono w-5 flex-shrink-0" }, t.n),
+                            react_1.default.createElement("div", { className: "flex-1" },
+                                react_1.default.createElement("div", { className: "text-[13px] font-medium text-tax-axis-text font-tax-axis-body mb-0.5" }, t.step),
+                                react_1.default.createElement("div", { className: "text-[11px] font-tax-axis-mono text-tax-axis-text-2" }, t.formula)),
+                            react_1.default.createElement("div", { className: "text-right flex-shrink-0" },
+                                react_1.default.createElement("div", { className: "text-[13px] font-bold text-tax-axis-teal-light font-tax-axis-mono" }, t.result),
+                                react_1.default.createElement("div", { className: "text-[9px] text-tax-axis-text-3 font-tax-axis-mono mt-0.5" }, t.src))))),
+                        react_1.default.createElement("div", { className: "p-3.5", style: { borderTop: "1px solid rgba(36,131,132,0.12)", background: "#161938" } },
+                            react_1.default.createElement("div", { className: "text-[10px] font-bold text-tax-axis-teal-light uppercase tracking-widest mb-2 font-tax-axis-mono" }, "Derivation"),
+                            react_1.default.createElement("div", { className: "flex items-center gap-2 flex-wrap" }, trace.map((t, i) => (react_1.default.createElement("span", { key: i, className: "flex items-center gap-1.5" },
+                                react_1.default.createElement("span", { className: "text-xs font-tax-axis-mono text-tax-axis-text px-2 py-0.5 rounded", style: { background: "#1A1D3A", border: "1px solid rgba(36,131,132,0.12)" } }, t.result),
+                                i < trace.length - 1 && (react_1.default.createElement("span", { className: "text-[11px] text-tax-axis-text-3 font-tax-axis-mono" }, "\u2192")))))),
+                            trace.length > 1 && (react_1.default.createElement("div", { className: "mt-2 text-xs font-tax-axis-mono p-2 rounded-md leading-relaxed", style: { background: "#1A1D3A", border: "1px solid rgba(36,131,132,0.12)" } },
+                                react_1.default.createElement("span", { className: "text-tax-axis-text-2" }, "Result: "),
+                                react_1.default.createElement("span", { className: "font-semibold text-tax-axis-teal-light" }, trace[trace.length - 1].result),
+                                react_1.default.createElement("span", { className: "text-tax-axis-text-2" }, " via "),
+                                react_1.default.createElement("span", { className: "text-tax-axis-text" }, trace[trace.length - 1].formula)))))),
+                react_1.default.createElement(Sec, { title: "IRS Authority" },
+                    react_1.default.createElement("div", { className: "p-3.5 rounded-[10px] mb-3", style: { background: "#1A1D3A", border: "1px solid rgba(36,131,132,0.12)" } },
+                        react_1.default.createElement("div", { className: "text-[13px] font-tax-axis-mono text-tax-axis-text mb-1" }, s.authority),
+                        react_1.default.createElement("div", { className: "text-[11px] text-tax-axis-text-2" },
+                            "Forms: ",
+                            react_1.default.createElement("span", { className: "font-tax-axis-mono text-tax-axis-text" }, s.forms))),
+                    react_1.default.createElement("div", { className: "rounded-[10px] overflow-hidden", style: { background: "rgba(36,131,132,0.06)", border: "1px solid rgba(36,131,132,0.2)" } },
+                        react_1.default.createElement("div", { className: "p-3 flex gap-3 items-center", style: { borderBottom: "1px solid rgba(36,131,132,0.15)" } },
+                            react_1.default.createElement("div", { className: "flex gap-[3px]" }, [1, 2, 3, 4, 5].map((i) => (react_1.default.createElement("div", { key: i, className: "w-2 h-2 rounded-sm", style: { background: i <= 4 ? "#248384" : "rgba(36,131,132,0.2)" } })))),
+                            react_1.default.createElement("span", { className: "text-[13px] font-semibold text-tax-axis-teal-light font-tax-axis-head" }, "Substantial Authority \u00B7 Low \u00A76694 Risk")),
+                        react_1.default.createElement("div", { className: "p-3" },
+                            react_1.default.createElement("p", { className: "text-xs text-tax-axis-text leading-[1.7] font-tax-axis-body mb-2" }, "IRC \u00A76694 imposes penalties on preparers who sign off on positions that lack sufficient legal support. There are two tiers:"),
+                            react_1.default.createElement("div", { className: "grid gap-1.5 mb-2.5" },
+                                react_1.default.createElement("div", { className: "p-2 rounded-md", style: { background: "#1A1D3A", border: "1px solid rgba(36,131,132,0.12)" } },
+                                    react_1.default.createElement("div", { className: "text-[11px] font-semibold text-tax-axis-text font-tax-axis-head mb-0.5" }, "Tier 1 \u2014 Unreasonable Position"),
+                                    react_1.default.createElement("div", { className: "text-[11px] text-tax-axis-text-2 leading-relaxed font-tax-axis-body" }, "If a position lacks \u201Csubstantial authority\u201D (~40% chance of being sustained), the preparer faces the greater of $1,000 or 50% of the fee earned from that return.")),
+                                react_1.default.createElement("div", { className: "p-2 rounded-md", style: { background: "#1A1D3A", border: "1px solid rgba(36,131,132,0.12)" } },
+                                    react_1.default.createElement("div", { className: "text-[11px] font-semibold text-tax-axis-text font-tax-axis-head mb-0.5" }, "Tier 2 \u2014 Willful or Reckless Conduct"),
+                                    react_1.default.createElement("div", { className: "text-[11px] text-tax-axis-text-2 leading-relaxed font-tax-axis-body" }, "If the preparer knowingly disregards rules or regulations, the penalty is the greater of $5,000 or 75% of the fee earned."))),
+                            react_1.default.createElement("div", { className: "p-2 rounded-md flex gap-2 items-start", style: { background: "rgba(15,110,86,0.06)", border: "1px solid rgba(15,110,86,0.15)" } },
+                                react_1.default.createElement("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", className: "flex-shrink-0 mt-0.5" },
+                                    react_1.default.createElement("path", { d: "M2.5 7l3.5 3.5 5.5-6", stroke: "#0F6E56", strokeWidth: "1.5", strokeLinecap: "round" })),
+                                react_1.default.createElement("div", { className: "text-[11px] text-tax-axis-text leading-relaxed font-tax-axis-body" },
+                                    react_1.default.createElement("strong", { style: { color: "#0F6E56" } }, "This strategy holds Substantial Authority"),
+                                    " \u2014 established IRS guidance, published revenue rulings, or settled case law support this position. Signing off on this carries low preparer penalty exposure under \u00A76694(a).")))))),
+            react_1.default.createElement("div", { className: "px-6 py-4 flex-shrink-0", style: { borderTop: "1px solid rgba(36,131,132,0.12)", background: "#0E1132" } },
+                react_1.default.createElement("div", { className: "text-[11px] text-tax-axis-text-3 mb-2" }, "Recommended action:"),
+                react_1.default.createElement("div", { className: "text-sm font-medium text-tax-axis-text" }, s.action)))));
+}

package/lib/tax-axis/components/dashboard/StrategyTile.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { Strategy } from "../../lib/types";
+interface StrategyTileProps {
+    s: Strategy;
+    delay: number;
+    onClick: () => void;
+    maxSavings: number;
+}
+export declare function StrategyTile({ s, delay, onClick, maxSavings }: StrategyTileProps): React.JSX.Element;
+export {};

package/lib/tax-axis/components/dashboard/StrategyTile.js

@@ -0,0 +1,82 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StrategyTile = StrategyTile;
+const react_1 = __importStar(require("react"));
+const TaxAxisBadge_1 = require("../shared/TaxAxisBadge");
+const ConfidenceArc_1 = require("./ConfidenceArc");
+const fmt = (n) => `$${(n / 1000).toFixed(n % 1000 ? 1 : 0)}K`;
+function StrategyTile({ s, delay, onClick, maxSavings }) {
+    var _a, _b, _c, _d;
+    const [hov, setHov] = (0, react_1.useState)(false);
+    const w = (((_a = s.hi) !== null && _a !== void 0 ? _a : 0) / maxSavings) * 100;
+    return (react_1.default.createElement("button", { onClick: onClick, onMouseEnter: () => setHov(true), onMouseLeave: () => setHov(false), className: "w-full text-left overflow-hidden p-0", style: {
+            background: "#0E1132",
+            border: `1px solid ${hov ? "rgba(36,131,132,0.35)" : "rgba(36,131,132,0.12)"}`,
+            borderRadius: 14,
+            boxShadow: hov
+                ? "0 0 30px rgba(36,131,132,0.12), 0 4px 20px rgba(6,8,33,0.3)"
+                : "0 2px 8px rgba(6,8,33,0.3)",
+            transition: "all .25s",
+            transform: hov ? "translateY(-2px)" : "none",
+            animationDelay: `${delay}s`,
+        } },
+        react_1.default.createElement("div", { className: "px-5 pt-[18px] pb-3.5" },
+            react_1.default.createElement("div", { className: "flex items-start justify-between gap-3 mb-3" },
+                react_1.default.createElement("div", { className: "flex-1" },
+                    react_1.default.createElement("div", { className: "flex items-center gap-2 mb-1.5 flex-wrap" },
+                        react_1.default.createElement("span", { className: "text-[15px] font-bold text-tax-axis-text font-tax-axis-head" }, s.name),
+                        react_1.default.createElement("span", { className: "text-[10px] font-tax-axis-mono text-tax-axis-teal-light bg-tax-axis-teal-bg px-1.5 py-0.5 rounded-sm" }, s.code),
+                        s.priority === "QUICK WIN" && (react_1.default.createElement(TaxAxisBadge_1.TaxAxisBadge, { color: "orange", size: "xs" }, "Quick Win")),
+                        s.cat === "obbba_new" && (react_1.default.createElement(TaxAxisBadge_1.TaxAxisBadge, { color: "orange", size: "xs" }, "OBBBA"))),
+                    react_1.default.createElement("div", { className: "flex items-center gap-2" },
+                        react_1.default.createElement("span", { className: "inline-block w-1.5 h-1.5 rounded-full", style: {
+                                background: s.timelineBucket === "now"
+                                    ? "#248384"
+                                    : s.timelineBucket === "30d"
+                                        ? "#FB9A1D"
+                                        : "#8B5CF6",
+                            } }),
+                        react_1.default.createElement("span", { className: "text-[11px] text-tax-axis-text-3 font-tax-axis-body" }, s.timeline))),
+                react_1.default.createElement(ConfidenceArc_1.ConfidenceArc, { score: s.score, size: 40 })),
+            react_1.default.createElement("div", { className: "mb-2.5" },
+                react_1.default.createElement("span", { className: "text-[26px] font-bold text-tax-axis-teal-light font-tax-axis-head tracking-tight" },
+                    fmt(s.lo),
+                    "\u2013",
+                    fmt(s.hi)),
+                react_1.default.createElement("span", { className: "text-[11px] text-tax-axis-text-3 ml-2" }, "est. savings")),
+            react_1.default.createElement("div", { className: "h-1 bg-tax-axis-surface-2 rounded-sm overflow-hidden" },
+                react_1.default.createElement("div", { className: "h-full rounded-sm", style: {
+                        width: `${w}%`,
+                        background: "linear-gradient(90deg, #248384, #A1E5E6)",
+                        transition: "width 0.8s cubic-bezier(.16,1,.3,1)",
+                    } }))),
+        react_1.default.createElement("div", { className: "px-5 py-2.5 flex justify-between items-center", style: { borderTop: "1px solid rgba(36,131,132,0.12)" } },
+            react_1.default.createElement("span", { className: "text-[11px] text-tax-axis-text-2 font-tax-axis-body truncate max-w-[200px]" }, (_b = s.action) === null || _b === void 0 ? void 0 :
+                _b.substring(0, 50),
+                ((_d = (_c = s.action) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) > 50 ? "..." : ""),
+            react_1.default.createElement("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", style: { opacity: 0.4 } },
+                react_1.default.createElement("path", { d: "M5 3l4 4-4 4", stroke: "#C5C9E0", strokeWidth: "1.5", strokeLinecap: "round" })))));
+}

package/lib/tax-axis/components/dashboard/TaxAxisDashboard.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import type { ClientProfile, TaxAxisScreenProps } from "../../lib/types";
+export interface TaxAxisDashboardProps extends TaxAxisScreenProps {
+    profile: ClientProfile;
+    onDownloadClient: () => void;
+    onDownloadPreparer: () => void;
+    onPresent: () => void;
+    onSend: () => void;
+    onReset: () => void;
+    onReviewData?: () => void;
+}
+export declare function TaxAxisDashboard({ profile, onDownloadClient, onDownloadPreparer, onPresent, onSend, onReset, onReviewData, userContext: _userContext, }: TaxAxisDashboardProps): React.JSX.Element;

package/lib/tax-axis/components/dashboard/TaxAxisDashboard.js

@@ -0,0 +1,284 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TaxAxisDashboard = TaxAxisDashboard;
+const react_1 = __importStar(require("react"));
+const data_1 = require("../../lib/data");
+const compute_1 = require("../../lib/compute");
+const TaxAxisButton_1 = require("../shared/TaxAxisButton");
+const TaxAxisBadge_1 = require("../shared/TaxAxisBadge");
+const DashboardSummary_1 = require("./DashboardSummary");
+const DashboardTopBar_1 = require("./DashboardTopBar");
+const DashboardActions_1 = require("./DashboardActions");
+const StrategyTile_1 = require("./StrategyTile");
+const StrategyDetailPanel_1 = require("./StrategyDetailPanel");
+// ─── Formatting helper ──────────────────────────────────────────
+const fmtK = (n) => `$${(n / 1000).toFixed(n % 1000 ? 1 : 0)}K`;
+// ─── Timeline buckets for Client Summary ────────────────────────
+const BUCKETS = [
+    { key: "now", label: "Act Now", desc: "Claim on your return or adjust this pay period" },
+    { key: "30d", label: "Within 30 Days", desc: "Documentation or payroll changes" },
+    { key: "90d", label: "Within 90 Days", desc: "Structural changes — new accounts or plan setup" },
+];
+function TaxAxisDashboard({ profile, onDownloadClient, onDownloadPreparer, onPresent, onSend, onReset, onReviewData, userContext: _userContext = "expert", }) {
+    // ─── Derived data ──────────────────────────────────────────────
+    const computed = (0, react_1.useMemo)(() => (0, compute_1.computeAllStrategies)(profile), [profile]);
+    const dashEligible = (0, react_1.useMemo)(() => (0, compute_1.filterEligibleStrategies)(profile), [profile]);
+    const maxSavings = Math.max(...dashEligible.map((s) => { var _a, _b; return (_b = (_a = computed.get(s.rank)) === null || _a === void 0 ? void 0 : _a.hi) !== null && _b !== void 0 ? _b : s.hi; }), 1);
+    // ─── State ─────────────────────────────────────────────────────
+    const [topTab, setTopTab] = (0, react_1.useState)("extraction");
+    const [reportTab, setReportTab] = (0, react_1.useState)("report");
+    const [chartExpanded, setChartExpanded] = (0, react_1.useState)(false);
+    const [selected, setSelected] = (0, react_1.useState)(null);
+    const [dataConfirmed, setDataConfirmed] = (0, react_1.useState)(false);
+    const [reviewStatus, setReviewStatus] = (0, react_1.useState)({
+        unreviewed: data_1.EXTRACTED_DATA.reduce((a, d) => a + d.flagCount, 0),
+        edits: 0,
+    });
+    // Restore confirmed state on mount — flag persists until session reset
+    (0, react_1.useEffect)(() => {
+        if (typeof window !== "undefined" && sessionStorage.getItem("taxAxisDataConfirmed") === "true") {
+            setDataConfirmed(true);
+            setTopTab("report");
+        }
+    }, []);
+    const handleConfirm = () => {
+        sessionStorage.setItem("taxAxisDataConfirmed", "true");
+        setDataConfirmed(true);
+        setTopTab("report");
+    };
+    // Enrich selected strategy with computed values for the detail panel
+    const enrichedSelected = (0, react_1.useMemo)(() => {
+        var _a, _b, _c, _d;
+        if (!selected)
+            return null;
+        const c = computed.get(selected.rank);
+        return Object.assign(Object.assign({}, selected), { lo: (_a = c === null || c === void 0 ? void 0 : c.lo) !== null && _a !== void 0 ? _a : selected.lo, hi: (_b = c === null || c === void 0 ? void 0 : c.hi) !== null && _b !== void 0 ? _b : selected.hi, sources: (_c = c === null || c === void 0 ? void 0 : c.sources) !== null && _c !== void 0 ? _c : selected.sources, trace: (_d = c === null || c === void 0 ? void 0 : c.trace) !== null && _d !== void 0 ? _d : selected.trace });
+    }, [selected, computed]);
+    // Sorted strategies for impact distribution
+    const sortedByImpact = (0, react_1.useMemo)(() => [...dashEligible].sort((a, b) => { var _a, _b, _c, _d; return ((_b = (_a = computed.get(b.rank)) === null || _a === void 0 ? void 0 : _a.hi) !== null && _b !== void 0 ? _b : b.hi) - ((_d = (_c = computed.get(a.rank)) === null || _c === void 0 ? void 0 : _c.hi) !== null && _d !== void 0 ? _d : a.hi); }), [dashEligible, computed]);
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(DashboardSummary_1.DashboardSummary, { profile: profile, dashEligible: dashEligible, computed: computed, dataConfirmed: dataConfirmed, reviewUnreviewed: reviewStatus.unreviewed }),
+        react_1.default.createElement(DashboardTopBar_1.DashboardTopBar, { topTab: topTab, setTopTab: setTopTab, dataConfirmed: dataConfirmed, reviewUnreviewed: reviewStatus.unreviewed }),
+        topTab === "extraction" && (react_1.default.createElement("div", null,
+            react_1.default.createElement("div", { className: "rounded-[14px] mb-4", style: { background: "#0E1132", border: "1px solid rgba(36,131,132,0.12)", padding: "20px 24px" } },
+                react_1.default.createElement("div", { className: "text-[13px] font-bold text-white uppercase tracking-widest font-tax-axis-head mb-3" }, "Document Extraction Summary"),
+                data_1.EXTRACTED_DATA.map((doc) => (react_1.default.createElement("div", { key: doc.docId, className: "flex items-center justify-between py-2.5", style: { borderTop: "1px solid rgba(36,131,132,0.08)" } },
+                    react_1.default.createElement("div", { className: "flex items-center gap-3" },
+                        react_1.default.createElement("span", { className: "text-[11px] font-tax-axis-mono text-tax-axis-teal-light bg-tax-axis-teal-bg px-2 py-0.5 rounded" }, doc.code),
+                        react_1.default.createElement("span", { className: "text-[13px] text-tax-axis-text font-tax-axis-body" }, doc.docName)),
+                    react_1.default.createElement("div", { className: "flex items-center gap-2" },
+                        react_1.default.createElement("span", { className: "text-[11px] font-tax-axis-mono text-tax-axis-text-3" },
+                            doc.fields.length,
+                            " fields"),
+                        doc.flagCount > 0 && (react_1.default.createElement("span", { className: "text-[10px] font-semibold font-tax-axis-mono rounded-full min-w-[18px] text-center px-1.5 py-0.5", style: { color: "#FB9A1D", background: "rgba(251,154,29,0.06)" } }, doc.flagCount)),
+                        doc.flagCount === 0 && (react_1.default.createElement("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none" },
+                            react_1.default.createElement("path", { d: "M2.5 6l3 3 4.5-5", stroke: "#0F6E56", strokeWidth: "1.5", strokeLinecap: "round" })))))))),
+            !dataConfirmed ? (react_1.default.createElement("div", { className: "rounded-[14px]", style: {
+                    background: "linear-gradient(135deg, rgba(36,131,132,0.12), rgba(36,131,132,0.06))",
+                    border: "1px solid rgba(36,131,132,0.3)",
+                    padding: 24,
+                } },
+                react_1.default.createElement("div", { className: "flex items-center gap-4" },
+                    react_1.default.createElement("div", { className: "flex-1" },
+                        react_1.default.createElement("div", { className: "text-[15px] font-bold text-white font-tax-axis-head mb-1" }, "Ready to view your report?"),
+                        react_1.default.createElement("div", { className: "text-[13px] text-tax-axis-text leading-relaxed font-tax-axis-body" }, reviewStatus.unreviewed > 0
+                            ? `${reviewStatus.unreviewed} value${reviewStatus.unreviewed > 1 ? "s" : ""} still flagged. You can confirm now or correct values first.`
+                            : "All extracted values look good. Confirm to unlock the Intelligence Report.")),
+                    react_1.default.createElement("div", { className: "flex gap-2.5" },
+                        reviewStatus.unreviewed > 0 && onReviewData && (react_1.default.createElement(TaxAxisButton_1.TaxAxisButton, { variant: "secondary", onClick: onReviewData }, "Review & Correct Data")),
+                        react_1.default.createElement(TaxAxisButton_1.TaxAxisButton, { onClick: handleConfirm }, reviewStatus.unreviewed > 0 ? "Confirm & Unlock" : "Confirm Data"))),
+                reviewStatus.unreviewed > 0 && (react_1.default.createElement("div", { className: "mt-3 pt-3 text-[11px] text-tax-axis-text-2 font-tax-axis-body flex items-center gap-1.5", style: { borderTop: "1px solid rgba(36,131,132,0.15)" } },
+                    react_1.default.createElement("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none" },
+                        react_1.default.createElement("circle", { cx: "5", cy: "5", r: "4", stroke: "#9498B8", strokeWidth: "1" }),
+                        react_1.default.createElement("path", { d: "M5 3v2.5M5 7h.003", stroke: "#9498B8", strokeWidth: "1", strokeLinecap: "round" })),
+                    "You can return to this tab to review and re-run after confirming.")))) : (react_1.default.createElement("div", { className: "rounded-xl flex items-center gap-3", style: {
+                    background: "rgba(15,110,86,0.06)",
+                    border: "1px solid rgba(15,110,86,0.25)",
+                    padding: "14px 20px",
+                } },
+                react_1.default.createElement("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" },
+                    react_1.default.createElement("path", { d: "M3 8l4 4 6-7", stroke: "#0F6E56", strokeWidth: "2", strokeLinecap: "round" })),
+                react_1.default.createElement("span", { className: "text-[13px] font-semibold font-tax-axis-head", style: { color: "#0F6E56" } }, "Data confirmed \u2014 Intelligence Report unlocked"),
+                react_1.default.createElement("button", { onClick: () => setTopTab("report"), className: "ml-auto px-3.5 py-1.5 rounded-md text-xs font-semibold font-tax-axis-mono", style: {
+                        background: "rgba(15,110,86,0.12)",
+                        border: "1px solid rgba(15,110,86,0.25)",
+                        color: "#0F6E56",
+                    } }, "View Report"))))),
+        topTab === "report" && dataConfirmed && (react_1.default.createElement("div", null,
+            react_1.default.createElement("div", { className: "flex gap-0 mb-5", style: { borderBottom: "1px solid rgba(36,131,132,0.12)" } }, [["report", "Preparer Report"], ["client", "Client Summary"]].map(([id, lbl]) => (react_1.default.createElement("button", { key: id, onClick: () => setReportTab(id), className: "bg-transparent border-0 font-tax-axis-body mr-6", style: {
+                    padding: "10px 0",
+                    fontSize: 14,
+                    fontWeight: reportTab === id ? 600 : 400,
+                    color: reportTab === id ? "#A1E5E6" : "#9498B8",
+                    borderBottom: reportTab === id
+                        ? "2px solid #248384"
+                        : "2px solid transparent",
+                    marginBottom: "-1px",
+                } }, lbl)))),
+            reportTab === "report" ? (react_1.default.createElement("div", null,
+                react_1.default.createElement("div", { className: "rounded-[14px] mb-4", style: {
+                        background: "#0E1132",
+                        border: "1px solid rgba(36,131,132,0.12)",
+                        padding: chartExpanded ? "24px 28px" : "20px 24px",
+                        boxShadow: "0 2px 8px rgba(6,8,33,0.3)",
+                        transition: "all .3s",
+                    } },
+                    react_1.default.createElement("div", { className: "flex justify-between items-center mb-3.5" },
+                        react_1.default.createElement("div", { className: "font-bold text-white uppercase tracking-widest font-tax-axis-head", style: { fontSize: chartExpanded ? 15 : 13 } }, "Impact Distribution"),
+                        react_1.default.createElement("button", { onClick: () => setChartExpanded((p) => !p), className: "px-3 py-1.5 rounded-md text-[11px] font-semibold font-tax-axis-mono transition-colors", style: {
+                                background: "#1A1D3A",
+                                border: "1px solid rgba(36,131,132,0.12)",
+                                color: "#9498B8",
+                            } }, chartExpanded ? "Collapse \u2191" : "Expand \u2193")),
+                    sortedByImpact
+                        .slice(0, chartExpanded ? dashEligible.length : 12)
+                        .map((s, i) => {
+                        var _a, _b, _c, _d;
+                        const chi = (_b = (_a = computed.get(s.rank)) === null || _a === void 0 ? void 0 : _a.hi) !== null && _b !== void 0 ? _b : s.hi;
+                        const clo = (_d = (_c = computed.get(s.rank)) === null || _c === void 0 ? void 0 : _c.lo) !== null && _d !== void 0 ? _d : s.lo;
+                        const w = (chi / maxSavings) * 100;
+                        return (react_1.default.createElement("div", { key: s.rank, className: "flex items-center gap-3 cursor-pointer", style: { marginBottom: chartExpanded ? 14 : 10 }, onClick: () => setSelected(s) },
+                            react_1.default.createElement("span", { className: "text-tax-axis-text font-tax-axis-body flex-shrink-0 overflow-hidden text-ellipsis whitespace-nowrap", style: {
+                                    fontSize: chartExpanded ? 13 : 12,
+                                    width: chartExpanded ? 180 : 140,
+                                } }, s.name),
+                            react_1.default.createElement("div", { className: "flex-1 bg-tax-axis-surface-2 rounded-sm overflow-hidden", style: { height: chartExpanded ? 10 : 6 } },
+                                react_1.default.createElement("div", { className: "h-full rounded-sm", style: {
+                                        width: `${w}%`,
+                                        background: "linear-gradient(90deg, #248384, #A1E5E6)",
+                                        transition: "width 0.8s cubic-bezier(.16,1,.3,1)",
+                                    } })),
+                            react_1.default.createElement("span", { className: "font-semibold text-tax-axis-teal-light font-tax-axis-mono flex-shrink-0 text-right", style: {
+                                    fontSize: chartExpanded ? 13 : 12,
+                                    width: chartExpanded ? 100 : 80,
+                                } },
+                                fmtK(clo),
+                                "\u2013",
+                                fmtK(chi))));
+                    }),
+                    !chartExpanded && dashEligible.length > 12 && (react_1.default.createElement("div", { onClick: () => setChartExpanded(true), className: "text-[11px] text-tax-axis-teal-light font-tax-axis-mono mt-1 cursor-pointer hover:underline" },
+                        "+ ",
+                        dashEligible.length - 12,
+                        " more strategies \u2014 click to view all")),
+                    chartExpanded && (react_1.default.createElement("div", { onClick: () => setChartExpanded(false), className: "text-[11px] text-tax-axis-text-3 font-tax-axis-mono mt-1 cursor-pointer hover:text-tax-axis-teal" },
+                        "Showing all ",
+                        dashEligible.length,
+                        " strategies \u2014 click to collapse"))),
+                react_1.default.createElement("div", { className: "text-[13px] font-bold text-white uppercase tracking-widest mb-2.5 font-tax-axis-head flex justify-between items-center" },
+                    react_1.default.createElement("span", null,
+                        dashEligible.length,
+                        " Strategies"),
+                    react_1.default.createElement("span", { className: "font-normal normal-case tracking-normal text-tax-axis-text-2 text-xs font-tax-axis-body" }, "Click to explore")),
+                react_1.default.createElement("div", { className: "grid grid-cols-2 gap-2.5 mb-4" }, dashEligible.map((s, i) => {
+                    var _a, _b;
+                    const c = computed.get(s.rank);
+                    return (react_1.default.createElement(StrategyTile_1.StrategyTile, { key: s.rank, s: Object.assign(Object.assign({}, s), { lo: (_a = c === null || c === void 0 ? void 0 : c.lo) !== null && _a !== void 0 ? _a : s.lo, hi: (_b = c === null || c === void 0 ? void 0 : c.hi) !== null && _b !== void 0 ? _b : s.hi }), delay: 0.2 + i * 0.06, onClick: () => setSelected(s), maxSavings: maxSavings }));
+                })),
+                react_1.default.createElement("div", { className: "rounded-[14px] overflow-hidden mb-4", style: {
+                        background: "#0E1132",
+                        border: "1px solid rgba(36,131,132,0.12)",
+                        boxShadow: "0 2px 8px rgba(6,8,33,0.3)",
+                    } },
+                    react_1.default.createElement("div", { className: "px-5 py-3.5", style: { borderBottom: "1px solid rgba(36,131,132,0.12)" } },
+                        react_1.default.createElement("span", { className: "text-[13px] font-bold text-white uppercase tracking-widest font-tax-axis-head" }, "Additional Opportunities")),
+                    data_1.ADDITIONAL.map((a, i, arr) => (react_1.default.createElement("div", { key: i, className: "px-5 py-3 flex justify-between items-center", style: {
+                            borderBottom: i < arr.length - 1 ? "1px solid rgba(36,131,132,0.12)" : "none",
+                        } },
+                        react_1.default.createElement("span", { className: "text-[13px] text-tax-axis-text" }, a.name),
+                        react_1.default.createElement("div", { className: "flex items-center gap-2.5" },
+                            react_1.default.createElement("span", { className: "text-[11px] font-tax-axis-mono text-tax-axis-text-2" }, a.savings),
+                            react_1.default.createElement(TaxAxisBadge_1.TaxAxisBadge, { color: a.priority === "MEDIUM" ? "orange" : "neutral", size: "xs" }, a.priority)))))),
+                react_1.default.createElement("div", { className: "rounded-[10px] mb-4 text-xs text-tax-axis-text leading-[1.7] font-tax-axis-body", style: {
+                        padding: "14px 18px",
+                        background: "#0E1132",
+                        border: "1px solid rgba(36,131,132,0.12)",
+                    } },
+                    react_1.default.createElement("strong", null, "\u00A76694 Preparer Compliance \u2014 "),
+                    "All HIGH priority strategies hold Substantial Authority (established IRS guidance supporting the position). No elevated preparer penalty exposure for positions taken on these strategies. OBBBA strategies default to Reasonable Basis pending IRS guidance \u2014 CPA verification required before filing."),
+                react_1.default.createElement(TaxAxisButton_1.TaxAxisButton, { onClick: onDownloadPreparer, className: "w-full" }, "Download Full Preparer Report"))) : (
+            /* ═══ CLIENT SUMMARY — Timeline View ═══ */
+            react_1.default.createElement("div", null,
+                react_1.default.createElement("p", { className: "text-sm text-tax-axis-text leading-[1.7] mb-6 font-tax-axis-body" },
+                    profile.bizName || "Client",
+                    ", here's your action plan organized by urgency.",
+                    " ",
+                    react_1.default.createElement("strong", { className: "text-tax-axis-teal-light" },
+                        dashEligible.length,
+                        " strategies"),
+                    " ",
+                    "identified."),
+                BUCKETS.map(({ key, label, desc }) => {
+                    const items = dashEligible.filter((s) => s.timelineBucket === key);
+                    if (!items.length)
+                        return null;
+                    const bucketTotal = items.reduce((a, s) => { var _a, _b; return a + ((_b = (_a = computed.get(s.rank)) === null || _a === void 0 ? void 0 : _a.lo) !== null && _b !== void 0 ? _b : s.lo); }, 0);
+                    const dotColor = key === "now" ? "#248384" : key === "30d" ? "#FB9A1D" : "#8B5CF6";
+                    const gradientFrom = key === "now"
+                        ? "linear-gradient(135deg, #248384, #1A6B6C)"
+                        : key === "30d"
+                            ? "linear-gradient(135deg, #FB9A1D, #D07A00)"
+                            : "linear-gradient(135deg, #8B5CF6, #6D28D9)";
+                    return (react_1.default.createElement("div", { key: key, className: "mb-5" },
+                        react_1.default.createElement("div", { className: "flex items-center gap-2.5 mb-2.5" },
+                            react_1.default.createElement("div", { className: "w-2.5 h-2.5 rounded-full", style: { background: dotColor } }),
+                            react_1.default.createElement("span", { className: "text-[15px] font-bold text-white font-tax-axis-head" }, label),
+                            react_1.default.createElement("span", { className: "text-xs text-tax-axis-text-3 font-tax-axis-body" },
+                                "\u2014 ",
+                                desc),
+                            react_1.default.createElement("span", { className: "ml-auto text-[13px] font-semibold text-tax-axis-teal-light font-tax-axis-mono" },
+                                "$",
+                                Math.round(bucketTotal / 1000),
+                                "K+")),
+                        items.map((s, i) => {
+                            var _a, _b;
+                            const c = computed.get(s.rank);
+                            const clo = (_a = c === null || c === void 0 ? void 0 : c.lo) !== null && _a !== void 0 ? _a : s.lo;
+                            const chi = (_b = c === null || c === void 0 ? void 0 : c.hi) !== null && _b !== void 0 ? _b : s.hi;
+                            return (react_1.default.createElement("div", { key: i, onClick: () => setSelected(s), className: "rounded-[14px] overflow-hidden mb-2 cursor-pointer transition-all", style: {
+                                    background: "#0E1132",
+                                    border: "1px solid rgba(36,131,132,0.12)",
+                                    boxShadow: "0 2px 8px rgba(6,8,33,0.3)",
+                                } },
+                                react_1.default.createElement("div", { className: "px-5 py-3.5 flex items-center gap-3.5", style: { borderBottom: "1px solid rgba(36,131,132,0.12)" } },
+                                    react_1.default.createElement("div", { className: "w-8 h-8 rounded-lg flex items-center justify-center text-[13px] font-bold text-white flex-shrink-0", style: { background: gradientFrom } },
+                                        "#",
+                                        s.rank),
+                                    react_1.default.createElement("span", { className: "text-[15px] font-bold text-tax-axis-text font-tax-axis-head flex-1" }, s.name),
+                                    react_1.default.createElement("span", { className: "text-xl font-bold text-tax-axis-teal-light font-tax-axis-head" },
+                                        fmtK(clo),
+                                        "\u2013",
+                                        fmtK(chi))),
+                                react_1.default.createElement("div", { className: "px-5 py-3" },
+                                    react_1.default.createElement("p", { className: "text-[13px] text-tax-axis-text leading-[1.7] font-tax-axis-body" }, s.clientBrief)),
+                                react_1.default.createElement("div", { className: "px-5 py-2.5 flex justify-between items-center", style: { background: "rgba(36,131,132,0.06)" } },
+                                    react_1.default.createElement("span", { className: "text-xs text-tax-axis-teal-light font-tax-axis-body" }, s.action),
+                                    s.cost && s.cost !== "$0" && (react_1.default.createElement("span", { className: "text-[11px] font-semibold font-tax-axis-mono", style: { color: "#FB9A1D" } }, s.cost)))));
+                        })));
+                }),
+                react_1.default.createElement(TaxAxisButton_1.TaxAxisButton, { onClick: onDownloadClient, className: "w-full mt-1.5" }, "Download Client Summary"))),
+            react_1.default.createElement(DashboardActions_1.DashboardActions, { profile: profile, dashEligible: dashEligible, computed: computed, onDownloadPreparer: onDownloadPreparer, onPresent: onPresent, onSend: onSend, onReset: onReset }))),
+        enrichedSelected && (react_1.default.createElement(StrategyDetailPanel_1.StrategyDetailPanel, { s: enrichedSelected, profile: profile, computed: computed, onClose: () => setSelected(null) }))));
+}

package/lib/tax-axis/components/dashboard/useCountUp.d.ts

@@ -0,0 +1 @@
+export declare function useCountUp(target: number, dur?: number, del?: number): number;

package/lib/tax-axis/components/dashboard/useCountUp.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCountUp = useCountUp;
+const react_1 = require("react");
+// ═══════════════════════════════════════════════════════════════════
+// useCountUp — animated number counter with easeOutCubic
+// Verbatim from mock (App.jsx:771).
+// ═══════════════════════════════════════════════════════════════════
+function useCountUp(target, dur = 1400, del = 300) {
+    const [v, setV] = (0, react_1.useState)(0);
+    (0, react_1.useEffect)(() => {
+        const t = setTimeout(() => {
+            const s = performance.now();
+            const tick = (n) => {
+                const p = Math.min((n - s) / dur, 1);
+                setV(Math.round(target * (1 - Math.pow(1 - p, 3))));
+                if (p < 1)
+                    requestAnimationFrame(tick);
+            };
+            requestAnimationFrame(tick);
+        }, del);
+        return () => clearTimeout(t);
+    }, [target, dur, del]);
+    return v;
+}

package/lib/tax-axis/components/documents/DocumentCard.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { DocSpec } from "../../lib/types";
+export type DocStatus = "empty" | "validating" | "valid";
+export interface DocState extends DocSpec {
+    status: DocStatus;
+    fileName: string | null;
+}
+interface DocumentCardProps {
+    doc: DocState;
+    tierBorderColor: string;
+    tierBadgeColor: "red" | "orange" | "neutral";
+    tierBadgeText: string;
+    helpOverride?: string;
+    onUpload: () => void;
+    onClear: () => void;
+}
+export declare function DocumentCard({ doc, tierBorderColor, tierBadgeColor, tierBadgeText, helpOverride, onUpload, onClear, }: DocumentCardProps): React.JSX.Element;
+export {};