@paro.io/expert-shared-components 1.14.66 → 1.14.68

package/lib/tax-axis/components/documents/DocumentCard.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DocumentCard = DocumentCard;
 const react_1 = __importDefault(require("react"));
 const TaxAxisBadge_1 = require("../shared/TaxAxisBadge");
-// Inline style values per status — mock T hex values for SVG strokes and
-// rgba borders that don't have direct Tailwind token equivalents.
 const STATUS_STYLES = {
     empty: {
         iconBg: "#171B44",
@@ -19,44 +17,79 @@ const STATUS_STYLES = {
         iconBorder: "rgba(251,154,29,0.25)",
         cardBorder: "rgba(251,154,29,0.25)",
     },
+    parsing: {
+        iconBg: "rgba(36,131,132,0.08)",
+        iconBorder: "rgba(36,131,132,0.25)",
+        cardBorder: "rgba(36,131,132,0.25)",
+    },
+    failed: {
+        iconBg: "rgba(197,48,48,0.08)",
+        iconBorder: "rgba(197,48,48,0.25)",
+        cardBorder: "rgba(197,48,48,0.25)",
+    },
     valid: {
         iconBg: "rgba(15,110,86,0.08)",
         iconBorder: "rgba(15,110,86,0.25)",
         cardBorder: "rgba(15,110,86,0.25)",
     },
 };
-function DocumentCard({ doc, tierBorderColor, tierBadgeColor, tierBadgeText, helpOverride, fieldCount, onUpload, onClear, onReview, }) {
-    var _a;
+function DocumentCard({ doc, tierBorderColor, tierBadgeColor, tierBadgeText, helpOverride, fieldCount, onUpload, onClear, onRemove, onReview, }) {
+    var _a, _b, _c;
     const ss = STATUS_STYLES[doc.status];
     const leftBorder = doc.status === "valid" ? "rgba(15,110,86,0.6)" : tierBorderColor;
+    const fileInputId = `tax-axis-upload-${doc.id}`;
+    const reuploadInputId = `tax-axis-reupload-${doc.id}`;
     return (react_1.default.createElement("div", { className: "bg-tax-axis-surface overflow-hidden", style: {
             border: `1px solid ${ss.cardBorder}`,
             borderLeft: `3px solid ${leftBorder}`,
             borderRadius: "0 10px 10px 0",
             boxShadow: "0 2px 12px rgba(6,8,33,0.5)",
         } },
-        react_1.default.createElement("div", { className: "px-4 py-3 flex gap-3 items-center" },
+        react_1.default.createElement("div", { className: "px-4 py-3 flex flex-col sm:flex-row gap-3 items-start sm:items-center" },
             react_1.default.createElement("div", { className: "w-9 h-9 rounded-lg flex items-center justify-center flex-shrink-0", style: {
                     background: ss.iconBg,
                     border: `1px solid ${ss.iconBorder}`,
                 } }, doc.status === "validating" ? (react_1.default.createElement("div", { className: "w-3.5 h-3.5 rounded-full animate-spin", style: {
                     border: "2px solid transparent",
                     borderTopColor: "#FB9A1D",
-                } })) : doc.status === "valid" ? (react_1.default.createElement("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" },
+                } })) : doc.status === "parsing" ? (react_1.default.createElement("div", { className: "w-3.5 h-3.5 rounded-full animate-spin", style: {
+                    border: "2px solid transparent",
+                    borderTopColor: "#248384",
+                } })) : doc.status === "failed" ? (react_1.default.createElement("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" },
+                react_1.default.createElement("path", { d: "M4 4l6 6M10 4L4 10", stroke: "#C53030", strokeWidth: "2", strokeLinecap: "round" }))) : doc.status === "valid" ? (react_1.default.createElement("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" },
                 react_1.default.createElement("path", { d: "M2.5 7l3.5 3.5 5.5-6", stroke: "#0F6E56", strokeWidth: "2", strokeLinecap: "round" }))) : (react_1.default.createElement("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" },
                 react_1.default.createElement("circle", { cx: "7", cy: "7", r: "5", stroke: "#9498B8", strokeWidth: "1.5", strokeDasharray: "3 3" })))),
             react_1.default.createElement("div", { className: "flex-1 min-w-0" },
                 react_1.default.createElement("div", { className: "flex items-center gap-1.5" },
                     react_1.default.createElement("span", { className: "text-[13px] font-medium text-white font-tax-axis-body" }, doc.name),
-                    doc.status === "empty" && (react_1.default.createElement(TaxAxisBadge_1.TaxAxisBadge, { color: tierBadgeColor, size: "xs" }, tierBadgeText))),
+                    doc.status === "empty" && (react_1.default.createElement(TaxAxisBadge_1.TaxAxisBadge, { color: tierBadgeColor, size: "xs" }, tierBadgeText)),
+                    doc.status === "failed" && (react_1.default.createElement(TaxAxisBadge_1.TaxAxisBadge, { color: "red", size: "xs" }, "FAILED")),
+                    doc.status === "valid" && doc.qboSource && (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement("span", { style: {
+                                fontSize: 9,
+                                fontWeight: 700,
+                                letterSpacing: "0.05em",
+                                padding: "1px 6px",
+                                borderRadius: 3,
+                                background: "rgba(44,160,28,0.1)",
+                                border: "1px solid rgba(44,160,28,0.2)",
+                                color: "#2CA01C",
+                            } }, "QUICKBOOKS"),
+                        react_1.default.createElement("span", { style: {
+                                fontSize: 9,
+                                fontWeight: 600,
+                                color: "#2CA01C",
+                            } }, "Synced")))),
                 react_1.default.createElement("div", { className: "text-[11px] text-tax-axis-text-3 font-tax-axis-body mt-0.5" }, doc.status === "valid" && doc.fileName
                     ? `${doc.fileName}${fieldCount ? ` \u00b7 ${fieldCount} fields extracted` : ""}`
-                    : ((_a = doc.fileName) !== null && _a !== void 0 ? _a : (helpOverride !== null && helpOverride !== void 0 ? helpOverride : doc.help)))),
-            react_1.default.createElement("div", { className: "flex items-center gap-2 flex-shrink-0" },
+                    : doc.status === "failed" && doc.parseError
+                        ? doc.parseError
+                        : ((_a = doc.fileName) !== null && _a !== void 0 ? _a : (helpOverride !== null && helpOverride !== void 0 ? helpOverride : doc.help)))),
+            react_1.default.createElement("div", { className: "flex items-center gap-2 flex-shrink-0 w-full sm:w-auto" },
                 doc.status === "valid" && (react_1.default.createElement(react_1.default.Fragment, null,
                     react_1.default.createElement("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" },
                         react_1.default.createElement("path", { d: "M2.5 7l3.5 3.5 5.5-6", stroke: "#0F6E56", strokeWidth: "2", strokeLinecap: "round" })),
-                    react_1.default.createElement("button", { onClick: onReview, className: "rounded-md px-3 py-1 text-[11px] font-semibold font-tax-axis-mono cursor-pointer flex items-center gap-1.5", style: {
+                    onReview && (react_1.default.createElement("button", { onClick: onReview, className: "rounded-md px-3 py-1 text-[11px] font-semibold font-tax-axis-mono cursor-pointer flex items-center gap-1.5", style: {
                             background: "rgba(99,102,241,0.12)",
                             border: "1px solid rgba(99,102,241,0.30)",
                             color: "#a5b4fc",
@@ -64,10 +97,34 @@ function DocumentCard({ doc, tierBorderColor, tierBadgeColor, tierBadgeText, hel
                         react_1.default.createElement("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none" },
                             react_1.default.createElement("rect", { x: "2", y: "1.5", width: "8", height: "9", rx: "1.5", stroke: "#a5b4fc", strokeWidth: "1.2" }),
                             react_1.default.createElement("path", { d: "M4 4.5h4M4 6.5h4M4 8.5h2", stroke: "#a5b4fc", strokeWidth: "0.9", strokeLinecap: "round" })),
-                        "Review"),
+                        "Review")),
                     react_1.default.createElement("button", { onClick: onClear, className: "bg-transparent border-none p-1 text-tax-axis-text-4 text-sm cursor-pointer" }, "\u00D7"))),
-                doc.status === "empty" && (react_1.default.createElement("button", { onClick: onUpload, className: "rounded-md px-3.5 py-1.5 text-[11px] font-semibold text-tax-axis-teal-light font-tax-axis-mono cursor-pointer", style: {
-                        background: "rgba(36,131,132,0.10)",
-                        border: "1px solid rgba(36,131,132,0.2)",
-                    } }, "Upload"))))));
+                (doc.status === "parsing" || doc.status === "validating") && (react_1.default.createElement("span", { className: "text-[10px] font-semibold font-tax-axis-mono", style: { color: doc.status === "parsing" ? "#248384" : "#FB9A1D" } }, doc.status === "parsing" ? "Parsing…" : "Uploading…")),
+                doc.status === "failed" && (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("input", { id: reuploadInputId, type: "file", className: "hidden", accept: (_b = doc.accept) === null || _b === void 0 ? void 0 : _b.join(","), onChange: (event) => {
+                            var _a;
+                            const file = (_a = event.target.files) === null || _a === void 0 ? void 0 : _a[0];
+                            if (file) {
+                                onUpload(file);
+                            }
+                            event.currentTarget.value = "";
+                        } }),
+                    react_1.default.createElement("label", { htmlFor: reuploadInputId, className: "rounded-md px-2.5 py-1 text-[10px] font-semibold text-tax-axis-teal-light font-tax-axis-mono cursor-pointer", style: {
+                            background: "rgba(36,131,132,0.10)",
+                            border: "1px solid rgba(36,131,132,0.2)",
+                        } }, "Re-upload"),
+                    react_1.default.createElement("button", { onClick: onRemove || onClear, className: "bg-transparent border-none p-1 text-tax-axis-text-4 text-sm cursor-pointer", title: "Remove document" }, "\u00D7"))),
+                doc.status === "empty" && (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("input", { id: fileInputId, type: "file", className: "hidden", accept: (_c = doc.accept) === null || _c === void 0 ? void 0 : _c.join(","), onChange: (event) => {
+                            var _a;
+                            const file = (_a = event.target.files) === null || _a === void 0 ? void 0 : _a[0];
+                            if (file) {
+                                onUpload(file);
+                            }
+                            event.currentTarget.value = "";
+                        } }),
+                    react_1.default.createElement("label", { htmlFor: fileInputId, className: "rounded-md px-3.5 py-1.5 text-[11px] font-semibold text-tax-axis-teal-light font-tax-axis-mono cursor-pointer", style: {
+                            background: "rgba(36,131,132,0.10)",
+                            border: "1px solid rgba(36,131,132,0.2)",
+                        } }, "Upload")))))));
 }

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

@@ -6,7 +6,8 @@ export interface DocumentReviewModalProps {
     documentName: string;
     fileName: string;
     jobId: string;
-    onClose: () => void;
     parsedData?: Record<string, unknown> | null;
+    onSaveReviewedData?: (fields: Record<string, string>) => Promise<void>;
+    onClose: () => void;
 }
-export declare function DocumentReviewModal({ documentId, documentName, fileName, jobId: _jobId, onClose, parsedData, }: DocumentReviewModalProps): React.JSX.Element;
+export declare function DocumentReviewModal({ documentId, documentName, fileName, jobId: _jobId, parsedData, onSaveReviewedData, onClose, }: DocumentReviewModalProps): React.JSX.Element;