@adoptai/genui-components 0.1.32

package/dist/composites/amortization-table/resolver.cjs

@@ -0,0 +1,692 @@
+"use client";
+'use strict';
+
+var react = require('react');
+var htmlToImage = require('html-to-image');
+var jsxRuntime = require('react/jsx-runtime');
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/shared/theme.ts
+var BORDER = "#dedede";
+var MUTED = "#777777";
+var PAPER = "#f6f6f6";
+var ACCENT = "#ff5000";
+var ACCENT_SOFT = "#cc4000";
+var SECONDARY = "#0364ff";
+var CHART_PALETTE = [
+  "#ff5000",
+  "#0364ff",
+  "#16a34a",
+  "#dc2626",
+  "#7c3aed",
+  "#0891b2",
+  "#f59e0b",
+  "#6366f1",
+  "#ec4899",
+  "#84cc16",
+  "#e11d48",
+  "#0ea5e9"
+];
+function ColumnSettingsPanel({ columns, hidden, onToggle, onShowAll, onHideAll }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "6px", minWidth: "180px" }, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", paddingBottom: "4px", borderBottom: `1px solid ${BORDER}` }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: onShowAll,
+          style: { background: "none", border: "none", cursor: "pointer", fontSize: "11px", color: ACCENT, fontWeight: 500, padding: 0 },
+          children: "Show all"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: onHideAll,
+          style: { background: "none", border: "none", cursor: "pointer", fontSize: "11px", color: MUTED, fontWeight: 500, padding: 0 },
+          children: "Hide all"
+        }
+      )
+    ] }),
+    columns.map((col) => /* @__PURE__ */ jsxRuntime.jsxs(
+      "label",
+      {
+        style: { display: "flex", alignItems: "center", gap: "8px", cursor: "pointer", fontSize: "12px", color: "var(--foreground)" },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              type: "checkbox",
+              checked: !hidden.has(col.key),
+              onChange: () => onToggle(col.key),
+              style: { accentColor: ACCENT, width: "14px", height: "14px", margin: 0, cursor: "pointer" }
+            }
+          ),
+          col.label
+        ]
+      },
+      col.key
+    ))
+  ] });
+}
+var DOT_COLOR = "#aaaaaa";
+var DOT_HOVER = "#555555";
+function ComponentActions({ children, onDownloadCSV, columnConfig, filename = "component" }) {
+  const [open, setOpen] = react.useState(false);
+  const [view, setView] = react.useState("main");
+  const contentRef = react.useRef(null);
+  const menuRef = react.useRef(null);
+  const btnRef = react.useRef(null);
+  const close = react.useCallback(() => {
+    setOpen(false);
+    setView("main");
+  }, []);
+  react.useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      var _a, _b;
+      if ((_a = menuRef.current) == null ? void 0 : _a.contains(e.target)) return;
+      if ((_b = btnRef.current) == null ? void 0 : _b.contains(e.target)) return;
+      close();
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [open, close]);
+  const handleDownloadPNG = react.useCallback(async () => {
+    if (!contentRef.current) return;
+    try {
+      const url = await htmlToImage.toPng(contentRef.current, { backgroundColor: "white", pixelRatio: 2 });
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = `${filename}.png`;
+      a.click();
+    } catch (e) {
+    }
+    close();
+  }, [filename, close]);
+  const handleCSV = react.useCallback(() => {
+    onDownloadCSV == null ? void 0 : onDownloadCSV();
+    close();
+  }, [onDownloadCSV, close]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { width: "100%", display: "flex", flexDirection: "column" }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { ref: contentRef, style: { width: "100%" }, children }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "flex-end", marginTop: "4px", position: "relative", zIndex: 10, flexShrink: 0 }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          ref: btnRef,
+          onClick: () => {
+            setOpen((o) => !o);
+            setView("main");
+          },
+          "aria-label": "Component actions",
+          style: {
+            background: "none",
+            border: "none",
+            cursor: "pointer",
+            padding: "4px 8px",
+            display: "flex",
+            gap: "3px",
+            alignItems: "center",
+            borderRadius: "6px",
+            transition: "background 0.15s"
+          },
+          onMouseEnter: (e) => {
+            e.currentTarget.style.background = "#f2f2f2";
+            e.currentTarget.querySelectorAll("circle").forEach((c) => c.style.fill = DOT_HOVER);
+          },
+          onMouseLeave: (e) => {
+            e.currentTarget.style.background = "none";
+            e.currentTarget.querySelectorAll("circle").forEach((c) => c.style.fill = DOT_COLOR);
+          },
+          children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "6", viewBox: "0 0 20 6", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "3", cy: "3", r: "2", style: { fill: DOT_COLOR, transition: "fill 0.15s" } }),
+            /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "10", cy: "3", r: "2", style: { fill: DOT_COLOR, transition: "fill 0.15s" } }),
+            /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "17", cy: "3", r: "2", style: { fill: DOT_COLOR, transition: "fill 0.15s" } })
+          ] })
+        }
+      ),
+      open && /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          ref: menuRef,
+          style: {
+            position: "absolute",
+            bottom: "100%",
+            right: 0,
+            marginBottom: "4px",
+            background: "white",
+            border: `1px solid ${BORDER}`,
+            borderRadius: "0.75rem",
+            boxShadow: "0 4px 12px rgba(0,0,0,0.06)",
+            zIndex: 50,
+            padding: view === "columns" ? "10px" : "4px",
+            minWidth: view === "columns" ? "200px" : "160px"
+          },
+          children: view === "main" ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column" }, children: [
+            columnConfig && /* @__PURE__ */ jsxRuntime.jsx(MenuButton, { label: "Customize columns", onClick: () => setView("columns") }),
+            onDownloadCSV && /* @__PURE__ */ jsxRuntime.jsx(MenuButton, { label: "Download CSV", onClick: handleCSV }),
+            /* @__PURE__ */ jsxRuntime.jsx(MenuButton, { label: "Download PNG", onClick: handleDownloadPNG })
+          ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                onClick: () => setView("main"),
+                style: { background: "none", border: "none", cursor: "pointer", fontSize: "11px", color: MUTED, marginBottom: "6px", padding: 0 },
+                children: "\u2190 Back"
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ColumnSettingsPanel,
+              {
+                columns: columnConfig.columns,
+                hidden: columnConfig.hidden,
+                onToggle: columnConfig.onToggle,
+                onShowAll: columnConfig.onShowAll,
+                onHideAll: columnConfig.onHideAll
+              }
+            )
+          ] })
+        }
+      )
+    ] })
+  ] });
+}
+function MenuButton({ label, onClick }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      onClick,
+      style: {
+        background: "none",
+        border: "none",
+        cursor: "pointer",
+        padding: "8px 12px",
+        fontSize: "12.5px",
+        color: "var(--foreground)",
+        textAlign: "left",
+        borderRadius: "8px",
+        transition: "background 0.15s",
+        whiteSpace: "nowrap"
+      },
+      onMouseEnter: (e) => e.currentTarget.style.background = "#f2f2f2",
+      onMouseLeave: (e) => e.currentTarget.style.background = "none",
+      children: label
+    }
+  );
+}
+
+// src/shared/downloadCSV.ts
+function escapeCSV(value) {
+  const str = value == null ? "" : String(value);
+  if (str.includes(",") || str.includes('"') || str.includes("\n")) {
+    return `"${str.replace(/"/g, '""')}"`;
+  }
+  return str;
+}
+function downloadCSV(columns, rows, filename) {
+  const header = columns.map((c) => escapeCSV(c.label)).join(",");
+  const body = rows.map((row) => columns.map((c) => escapeCSV(row[c.key])).join(",")).join("\n");
+  const csv = `${header}
+${body}`;
+  const blob = new Blob([csv], { type: "text/csv;charset=utf-8;" });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = filename.endsWith(".csv") ? filename : `${filename}.csv`;
+  a.click();
+  URL.revokeObjectURL(url);
+}
+var DEFAULT_TOKENS = {
+  BORDER,
+  MUTED,
+  PAPER,
+  ACCENT,
+  ACCENT_SOFT,
+  SECONDARY,
+  CHART_PALETTE: [...CHART_PALETTE]
+};
+var GenUIThemeContext = react.createContext(DEFAULT_TOKENS);
+function useTheme() {
+  return react.useContext(GenUIThemeContext);
+}
+var fmt = (v, currency) => new Intl.NumberFormat("en-US", {
+  style: "currency",
+  currency: currency || "USD",
+  minimumFractionDigits: 2
+}).format(v);
+var thStyle = (align = "left") => ({
+  fontSize: "11px",
+  fontWeight: 500,
+  color: MUTED,
+  padding: "8px 10px",
+  letterSpacing: "0.02em",
+  textTransform: "uppercase",
+  borderBottom: `1px solid ${BORDER}`,
+  background: PAPER,
+  textAlign: align,
+  whiteSpace: "nowrap"
+});
+var tdStyle = (align = "left", last = false) => ({
+  padding: "8px 10px",
+  fontSize: "13px",
+  color: "var(--foreground)",
+  fontVariantNumeric: "tabular-nums",
+  borderBottom: last ? "none" : "1px solid #f2f2f2",
+  textAlign: align,
+  whiteSpace: "nowrap"
+});
+function AmortizationTableResolver(p) {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const { BORDER: BORDER2, MUTED: MUTED2, PAPER: PAPER2 } = useTheme();
+  const currency = (_a = p.currency) != null ? _a : "USD";
+  const payments = (_b = p.payments) != null ? _b : [];
+  const hasDate = payments.some((r) => r.paymentDate);
+  const hasExtra = payments.some((r) => {
+    var _a2;
+    return ((_a2 = r.extra) != null ? _a2 : 0) > 0;
+  });
+  const derivedMonthly = payments.length > 0 ? payments[0].payment : 0;
+  const derivedTotalInterest = payments.reduce((s, r) => s + r.interest, 0);
+  const derivedOriginal = payments.length > 0 ? payments[0].balance + payments[0].principal : 0;
+  const summary = p.summary ? __spreadProps(__spreadValues({}, p.summary), {
+    originalAmount: (_c = p.summary.originalAmount) != null ? _c : derivedOriginal,
+    monthlyPayment: (_d = p.summary.monthlyPayment) != null ? _d : derivedMonthly > 0 ? derivedMonthly : void 0,
+    totalInterest: (_e = p.summary.totalInterest) != null ? _e : derivedTotalInterest > 0 ? derivedTotalInterest : void 0
+  }) : void 0;
+  const originalAmount = (_f = summary == null ? void 0 : summary.originalAmount) != null ? _f : 0;
+  const csvCols = [
+    { key: "period", label: "Period" },
+    ...hasDate ? [{ key: "paymentDate", label: "Date" }] : [],
+    { key: "payment", label: "Payment" },
+    { key: "principal", label: "Principal" },
+    { key: "interest", label: "Interest" },
+    ...hasExtra ? [{ key: "extra", label: "Extra" }] : [],
+    { key: "balance", label: "Balance" }
+  ];
+  const csvRows = payments.map((r) => {
+    var _a2, _b2;
+    return {
+      period: r.period,
+      paymentDate: (_a2 = r.paymentDate) != null ? _a2 : "",
+      payment: r.payment,
+      principal: r.principal,
+      interest: r.interest,
+      extra: (_b2 = r.extra) != null ? _b2 : 0,
+      balance: r.balance
+    };
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ComponentActions,
+    {
+      filename: (_g = p.title) != null ? _g : "amortization-table",
+      onDownloadCSV: () => {
+        var _a2;
+        return downloadCSV(csvCols, csvRows, (_a2 = p.title) != null ? _a2 : "amortization-table");
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          style: {
+            width: "100%",
+            display: "flex",
+            flexDirection: "column",
+            gap: "10px"
+          },
+          children: [
+            p.title && /* @__PURE__ */ jsxRuntime.jsx(
+              "p",
+              {
+                style: {
+                  fontFamily: "var(--font-serif)",
+                  fontSize: "15px",
+                  fontWeight: 400,
+                  color: "var(--foreground)",
+                  letterSpacing: "-0.01em",
+                  margin: 0
+                },
+                children: p.title
+              }
+            ),
+            summary && /* @__PURE__ */ jsxRuntime.jsxs(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  flexDirection: "column",
+                  gap: "8px"
+                },
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs(
+                    "div",
+                    {
+                      style: {
+                        display: "grid",
+                        gridTemplateColumns: "repeat(auto-fit, minmax(130px, 1fr))",
+                        gap: "8px"
+                      },
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsxs(
+                          "div",
+                          {
+                            style: {
+                              background: PAPER2,
+                              borderRadius: "8px",
+                              padding: "10px 14px"
+                            },
+                            children: [
+                              /* @__PURE__ */ jsxRuntime.jsx(
+                                "div",
+                                {
+                                  style: {
+                                    fontSize: "10px",
+                                    fontWeight: 500,
+                                    color: MUTED2,
+                                    textTransform: "uppercase",
+                                    letterSpacing: "0.04em",
+                                    marginBottom: "2px"
+                                  },
+                                  children: "Original Amount"
+                                }
+                              ),
+                              /* @__PURE__ */ jsxRuntime.jsx(
+                                "div",
+                                {
+                                  style: {
+                                    fontSize: "14px",
+                                    fontWeight: 600,
+                                    color: "var(--foreground)",
+                                    fontVariantNumeric: "tabular-nums"
+                                  },
+                                  children: fmt(summary.originalAmount, currency)
+                                }
+                              )
+                            ]
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntime.jsxs(
+                          "div",
+                          {
+                            style: {
+                              background: PAPER2,
+                              borderRadius: "8px",
+                              padding: "10px 14px"
+                            },
+                            children: [
+                              /* @__PURE__ */ jsxRuntime.jsx(
+                                "div",
+                                {
+                                  style: {
+                                    fontSize: "10px",
+                                    fontWeight: 500,
+                                    color: MUTED2,
+                                    textTransform: "uppercase",
+                                    letterSpacing: "0.04em",
+                                    marginBottom: "2px"
+                                  },
+                                  children: "Interest Rate"
+                                }
+                              ),
+                              /* @__PURE__ */ jsxRuntime.jsx(
+                                "div",
+                                {
+                                  style: {
+                                    fontSize: "14px",
+                                    fontWeight: 600,
+                                    color: "var(--foreground)"
+                                  },
+                                  children: summary.interestRate
+                                }
+                              )
+                            ]
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntime.jsxs(
+                          "div",
+                          {
+                            style: {
+                              background: PAPER2,
+                              borderRadius: "8px",
+                              padding: "10px 14px"
+                            },
+                            children: [
+                              /* @__PURE__ */ jsxRuntime.jsx(
+                                "div",
+                                {
+                                  style: {
+                                    fontSize: "10px",
+                                    fontWeight: 500,
+                                    color: MUTED2,
+                                    textTransform: "uppercase",
+                                    letterSpacing: "0.04em",
+                                    marginBottom: "2px"
+                                  },
+                                  children: "Term"
+                                }
+                              ),
+                              /* @__PURE__ */ jsxRuntime.jsx(
+                                "div",
+                                {
+                                  style: {
+                                    fontSize: "14px",
+                                    fontWeight: 600,
+                                    color: "var(--foreground)"
+                                  },
+                                  children: summary.term
+                                }
+                              )
+                            ]
+                          }
+                        ),
+                        summary.monthlyPayment != null && /* @__PURE__ */ jsxRuntime.jsxs(
+                          "div",
+                          {
+                            style: {
+                              background: PAPER2,
+                              borderRadius: "8px",
+                              padding: "10px 14px"
+                            },
+                            children: [
+                              /* @__PURE__ */ jsxRuntime.jsx(
+                                "div",
+                                {
+                                  style: {
+                                    fontSize: "10px",
+                                    fontWeight: 500,
+                                    color: MUTED2,
+                                    textTransform: "uppercase",
+                                    letterSpacing: "0.04em",
+                                    marginBottom: "2px"
+                                  },
+                                  children: "Monthly Payment"
+                                }
+                              ),
+                              /* @__PURE__ */ jsxRuntime.jsx(
+                                "div",
+                                {
+                                  style: {
+                                    fontSize: "14px",
+                                    fontWeight: 600,
+                                    color: "var(--foreground)",
+                                    fontVariantNumeric: "tabular-nums"
+                                  },
+                                  children: fmt(summary.monthlyPayment, currency)
+                                }
+                              )
+                            ]
+                          }
+                        )
+                      ]
+                    }
+                  ),
+                  (summary.totalInterest != null || summary.startDate) && /* @__PURE__ */ jsxRuntime.jsxs(
+                    "div",
+                    {
+                      style: {
+                        display: "flex",
+                        gap: "16px",
+                        fontSize: "11px",
+                        color: MUTED2,
+                        paddingLeft: "2px"
+                      },
+                      children: [
+                        summary.totalInterest != null && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+                          "Total Interest: ",
+                          fmt(summary.totalInterest, currency)
+                        ] }),
+                        summary.startDate && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+                          "Start Date: ",
+                          summary.startDate
+                        ] })
+                      ]
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                style: {
+                  overflowX: "auto",
+                  borderRadius: "0.75rem",
+                  border: `1px solid ${BORDER2}`,
+                  boxShadow: "0 1px 2px rgba(0,0,0,0.03), 0 4px 12px rgba(0,0,0,0.04)"
+                },
+                children: /* @__PURE__ */ jsxRuntime.jsxs("table", { style: { width: "100%", borderCollapse: "collapse" }, children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("th", { style: thStyle("left"), children: "Period" }),
+                    hasDate && /* @__PURE__ */ jsxRuntime.jsx("th", { style: thStyle("left"), children: "Date" }),
+                    /* @__PURE__ */ jsxRuntime.jsx("th", { style: thStyle("right"), children: "Payment" }),
+                    /* @__PURE__ */ jsxRuntime.jsx("th", { style: thStyle("right"), children: "Principal" }),
+                    /* @__PURE__ */ jsxRuntime.jsx("th", { style: thStyle("right"), children: "Interest" }),
+                    hasExtra && /* @__PURE__ */ jsxRuntime.jsx("th", { style: thStyle("right"), children: "Extra" }),
+                    /* @__PURE__ */ jsxRuntime.jsx("th", { style: thStyle("right"), children: "Balance" })
+                  ] }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: payments.map((row, ri) => {
+                    var _a2, _b2, _c2, _d2;
+                    const isLast = ri === payments.length - 1;
+                    const principalPct = row.payment > 0 ? Math.min(row.principal / row.payment * 100, 100) : 0;
+                    const balanceIsZero = originalAmount > 0 && row.balance < originalAmount * 0.01;
+                    return /* @__PURE__ */ jsxRuntime.jsxs(
+                      "tr",
+                      {
+                        style: { background: ri % 2 === 0 ? "white" : "#fafafa" },
+                        children: [
+                          /* @__PURE__ */ jsxRuntime.jsxs("td", { style: tdStyle("left", isLast), children: [
+                            /* @__PURE__ */ jsxRuntime.jsx("div", { children: row.period }),
+                            /* @__PURE__ */ jsxRuntime.jsxs(
+                              "div",
+                              {
+                                style: {
+                                  marginTop: "4px",
+                                  width: "100%",
+                                  height: "4px",
+                                  borderRadius: "2px",
+                                  background: "#e5e5e5",
+                                  overflow: "hidden",
+                                  display: "flex"
+                                },
+                                children: [
+                                  /* @__PURE__ */ jsxRuntime.jsx(
+                                    "div",
+                                    {
+                                      style: {
+                                        width: `${principalPct}%`,
+                                        height: "100%",
+                                        background: "#15803d",
+                                        borderRadius: "2px 0 0 2px"
+                                      }
+                                    }
+                                  ),
+                                  /* @__PURE__ */ jsxRuntime.jsx(
+                                    "div",
+                                    {
+                                      style: {
+                                        width: `${100 - principalPct}%`,
+                                        height: "100%",
+                                        background: "#d4d4d4",
+                                        borderRadius: "0 2px 2px 0"
+                                      }
+                                    }
+                                  )
+                                ]
+                              }
+                            )
+                          ] }),
+                          hasDate && /* @__PURE__ */ jsxRuntime.jsx("td", { style: tdStyle("left", isLast), children: (_a2 = row.paymentDate) != null ? _a2 : "\u2014" }),
+                          /* @__PURE__ */ jsxRuntime.jsx("td", { style: tdStyle("right", isLast), children: fmt(row.payment, currency) }),
+                          /* @__PURE__ */ jsxRuntime.jsx(
+                            "td",
+                            {
+                              style: __spreadProps(__spreadValues({}, tdStyle("right", isLast)), {
+                                color: "var(--foreground)"
+                              }),
+                              children: fmt(row.principal, currency)
+                            }
+                          ),
+                          /* @__PURE__ */ jsxRuntime.jsx(
+                            "td",
+                            {
+                              style: __spreadProps(__spreadValues({}, tdStyle("right", isLast)), {
+                                color: MUTED2
+                              }),
+                              children: fmt(row.interest, currency)
+                            }
+                          ),
+                          hasExtra && /* @__PURE__ */ jsxRuntime.jsx(
+                            "td",
+                            {
+                              style: __spreadProps(__spreadValues({}, tdStyle("right", isLast)), {
+                                color: ((_b2 = row.extra) != null ? _b2 : 0) > 0 ? "#15803d" : MUTED2
+                              }),
+                              children: ((_c2 = row.extra) != null ? _c2 : 0) > 0 ? fmt((_d2 = row.extra) != null ? _d2 : 0, currency) : "\u2014"
+                            }
+                          ),
+                          /* @__PURE__ */ jsxRuntime.jsx(
+                            "td",
+                            {
+                              style: __spreadProps(__spreadValues({}, tdStyle("right", isLast)), {
+                                fontWeight: 600,
+                                fontVariantNumeric: "tabular-nums",
+                                color: balanceIsZero ? "#15803d" : "var(--foreground)"
+                              }),
+                              children: fmt(row.balance, currency)
+                            }
+                          )
+                        ]
+                      },
+                      ri
+                    );
+                  }) })
+                ] })
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+
+exports.AmortizationTableResolver = AmortizationTableResolver;
+//# sourceMappingURL=resolver.cjs.map
+//# sourceMappingURL=resolver.cjs.map