@powerhousedao/contributor-billing 0.1.29 → 0.1.31

package/dist/editors/billing-statement/components/lineItemsTable.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Tag, Plus } from "lucide-react";
+import { Tag, Plus, Trash2 } from "lucide-react";
 import { Select } from "@powerhousedao/document-engineering";
 import { InputField } from "../../invoice/components/inputField.js";
 import { NumberForm } from "../../invoice/components/numberForm.js";
-import { actions } from "../../../document-models/billing-statement/index.js";
+import { actions, } from "../../../document-models/billing-statement/index.js";
 import { useState, useRef, useEffect } from "react";
 import { formatNumber } from "../../invoice/lineItems.js";
 import { LineItemTagsTable } from "../lineItemTags/lineItemTags.js";
@@ -29,7 +29,7 @@ const LineItemsTable = (props) => {
             const target = event.target;
             const isSelectMenu = target.closest('[role="listbox"]') || target.closest('[role="option"]');
             // Check if clicking on buttons (save/cancel)
-            const isButton = target.closest('button');
+            const isButton = target.closest("button");
             if (tableRef.current &&
                 !tableRef.current.contains(event.target) &&
                 !isSelectMenu &&
@@ -151,28 +151,37 @@ const LineItemsTable = (props) => {
         setIsAddingNew(false);
         setNewLineItem(initialLineItem);
     };
+    const handleDeleteLineItem = (id) => {
+        if (editingRow !== null) {
+            setEditingRow(null);
+            setLocalLineItem(initialLineItem);
+        }
+        dispatch(actions.deleteLineItem({ id }));
+    };
     if (showTagTable) {
         return (_jsx(LineItemTagsTable, { lineItems: state.lineItems, onClose: () => setShowTagTable(false), dispatch: dispatch }));
     }
-    return (_jsxs("div", { className: "mt-2 overflow-x-auto", children: [_jsxs("div", { className: "flex justify-between mt-6", children: [_jsx("div", { className: "flex items-center", children: _jsx("h1", { className: "text-1xl font-bold", children: "Line Items" }) }), _jsx("div", { className: "flex items-center", children: _jsx(Tag, { style: {
-                                cursor: "pointer",
-                                width: 28,
-                                height: 28,
-                                color: "white",
-                                fill: "#475264",
-                            }, onClick: () => setShowTagTable(!showTagTable) }) })] }), _jsxs("div", { className: "mt-4 min-w-[900px]", ref: tableRef, children: [_jsxs("table", { className: "w-full border border-gray-300 text-sm", children: [_jsx("thead", { className: "h-12", children: _jsxs("tr", { className: "bg-gray-100 h-10", children: [_jsx("th", { className: "border px-2 py-1 w-10", children: "#" }), _jsx("th", { className: "border px-2 py-1 w-72", children: "Desc" }), _jsx("th", { className: "border px-2 py-1 w-40", children: "Unit" }), _jsx("th", { className: "border px-2 py-1 w-16", children: "Qty" }), _jsx("th", { className: "border px-2 py-1 w-16", children: "FIAT/Unit" }), _jsx("th", { className: "border px-2 py-1 w-16", children: "POWT/Unit" }), _jsx("th", { className: "border px-2 py-1 w-16", children: "Total Fiat" }), _jsx("th", { className: "border px-2 py-1 w-16", children: "Total POWT" })] }) }), _jsxs("tbody", { children: [state.lineItems.map((item, idx) => editingRow === idx ? (_jsxs("tr", { className: "bg-yellow-100", children: [_jsx("td", { className: "border px-2 py-1 text-center w-10", children: idx + 1 }), _jsx("td", { className: "border px-2 py-1 w-72", children: _jsx(InputField, { input: localLineItem.description, value: localLineItem.description, onBlur: () => { }, handleInputChange: (e) => handleInputChange("description", e.target.value), className: "w-full px-1 py-1 border rounded" }) }), _jsx("td", { className: "border px-2 py-1 w-16", children: _jsx(Select, { options: units, value: localLineItem.unit, onChange: (value) => handleInputChange("unit", value), className: "w-32 px-1 py-1 border rounded" }) }), _jsx("td", { className: "border px-2 py-1 w-16", children: _jsx(NumberForm, { number: localLineItem.quantity, handleInputChange: (e) => handleInputChange("quantity", e.target.value), className: "w-32 px-4 py-1 border rounded text-center" }) }), _jsx("td", { className: "border px-2 py-1 w-16", children: _jsx(NumberForm, { number: localLineItem.unitPriceCash, handleInputChange: (e) => handleInputChange("unitPriceCash", String(e.target.value)), className: "w-32 px-4 py-1 border rounded text-center" }) }), _jsx("td", { className: "border px-2 py-1 w-16", children: _jsx(NumberForm, { number: localLineItem.unitPricePwt, handleInputChange: (e) => handleInputChange("unitPricePwt", e.target.value), className: "w-32 px-4 py-1 border rounded text-center" }) }), _jsx("td", { className: "border px-2 py-1 text-center", children: localLineItem.quantity && localLineItem.unitPriceCash
-                                                    ? Number(localLineItem.quantity) *
-                                                        Number(localLineItem.unitPriceCash)
-                                                    : "" }), _jsx("td", { className: "border px-2 py-1 text-center", children: localLineItem.quantity && localLineItem.unitPricePwt
-                                                    ? Number(localLineItem.quantity) *
-                                                        Number(localLineItem.unitPricePwt)
-                                                    : "" })] }, item.id)) : (_jsxs("tr", { className: "hover:bg-gray-50 cursor-pointer", onDoubleClick: () => {
-                                            setEditingRow(idx);
-                                            setLocalLineItem({ ...item });
-                                        }, children: [_jsx("td", { className: "border px-2 py-2 text-center w-10", children: idx + 1 }), _jsx("td", { className: "border px-2 py-2", children: item.description }), _jsx("td", { className: "border px-2 py-2 w-40 text-center", children: item.unit }), _jsx("td", { className: "border px-2 py-2 w-16 text-center", children: item.quantity }), _jsx("td", { className: "border px-2 py-2 w-10 text-center", children: formatNumber(item.unitPriceCash) }), _jsx("td", { className: "border px-2 py-2 w-10 text-center", children: formatNumber(item.unitPricePwt) }), _jsx("td", { className: "border px-2 py-2 text-center", children: formatNumber(item.totalPriceCash) }), _jsx("td", { className: "border px-2 py-2 text-center", children: formatNumber(item.totalPricePwt) })] }, item.id))), isAddingNew && (_jsxs("tr", { className: "bg-green-50", children: [_jsx("td", { className: "border px-2 py-1 text-center w-10", children: state.lineItems.length + 1 }), _jsx("td", { className: "border px-2 py-1 w-72", children: _jsx(InputField, { input: newLineItem.description, value: newLineItem.description, onBlur: () => { }, handleInputChange: (e) => handleNewLineItemChange("description", e.target.value), className: "w-full px-1 py-1 border rounded" }) }), _jsx("td", { className: "border px-2 py-1 w-16", children: _jsx(Select, { options: units, value: newLineItem.unit, onChange: (value) => handleNewLineItemChange("unit", value), className: "w-32 px-1 py-1 border rounded" }) }), _jsx("td", { className: "border px-2 py-1 w-16", children: _jsx(NumberForm, { number: newLineItem.quantity, handleInputChange: (e) => handleNewLineItemChange("quantity", e.target.value), className: "w-32 px-4 py-1 border rounded text-center" }) }), _jsx("td", { className: "border px-2 py-1 w-16", children: _jsx(NumberForm, { number: newLineItem.unitPriceCash, handleInputChange: (e) => handleNewLineItemChange("unitPriceCash", String(e.target.value)), className: "w-32 px-4 py-1 border rounded text-center" }) }), _jsx("td", { className: "border px-2 py-1 w-16", children: _jsx(NumberForm, { number: newLineItem.unitPricePwt, handleInputChange: (e) => handleNewLineItemChange("unitPricePwt", e.target.value), className: "w-32 px-4 py-1 border rounded text-center" }) }), _jsx("td", { className: "border px-2 py-1 text-center", children: newLineItem.quantity && newLineItem.unitPriceCash
-                                                    ? Number(newLineItem.quantity) * Number(newLineItem.unitPriceCash)
-                                                    : "" }), _jsx("td", { className: "border px-2 py-1 text-center", children: newLineItem.quantity && newLineItem.unitPricePwt
-                                                    ? Number(newLineItem.quantity) * Number(newLineItem.unitPricePwt)
-                                                    : "" })] }))] })] }), !isAddingNew && (_jsx("div", { className: "mt-4 flex justify-center", children: _jsxs("button", { onClick: handleAddLineItem, className: "flex items-center gap-1 px-3 py-1.5 text-sm bg-gray-200 text-gray-700 rounded hover:bg-gray-300 transition-colors", children: [_jsx(Plus, { size: 16 }), "Add Line Item"] }) })), isAddingNew && (_jsxs("div", { className: "mt-4 flex justify-center gap-2", children: [_jsx("button", { onClick: handleSaveNewLineItem, className: "px-3 py-1.5 text-sm bg-green-600 text-white rounded hover:bg-green-700 transition-colors", children: "Save Line Item" }), _jsx("button", { onClick: handleCancelAdd, className: "px-3 py-1.5 text-sm bg-gray-500 text-white rounded hover:bg-gray-600 transition-colors", children: "Cancel" })] }))] })] }));
+    return (_jsxs("div", { className: "w-full", children: [_jsxs("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "text-xs font-semibold tracking-[0.24em] text-black/60", children: "LINE ITEMS" }), _jsx("div", { className: "text-sm text-black/50", children: "Double\u2011click a row to edit. Click outside to save." })] }), _jsx("div", { className: "flex items-center justify-between gap-3 sm:justify-end", children: _jsxs("button", { type: "button", onClick: () => setShowTagTable(!showTagTable), className: "group inline-flex items-center gap-2 rounded-full border border-black/15 bg-[#efe8da] px-3 py-2 text-xs font-semibold tracking-wide text-black/80 shadow-[0_10px_28px_rgba(15,23,42,0.10)] transition hover:bg-[#e7ddc9] focus:outline-none focus-visible:ring-2 focus-visible:ring-black/20 focus-visible:ring-offset-2 focus-visible:ring-offset-white", "aria-label": "Open tag editor", children: [_jsx(Tag, { className: "h-4 w-4 text-black/70" }), "Tags"] }) })] }), _jsxs("div", { className: "mt-4 overflow-hidden rounded-xl border border-black/10 bg-white shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]", children: [_jsx("div", { className: "overflow-x-auto", ref: tableRef, children: _jsx("div", { className: "min-w-[980px]", children: _jsxs("table", { className: "w-full border-collapse text-sm", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-[#efe8da] text-[#14120f]", children: [_jsx("th", { className: "w-10 border-b border-black/10 px-2 py-3 text-center text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "#" }), _jsx("th", { className: "w-[28rem] border-b border-black/10 px-3 py-3 text-left text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "DESCRIPTION" }), _jsx("th", { className: "w-44 border-b border-black/10 px-3 py-3 text-left text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "UNIT" }), _jsx("th", { className: "w-20 border-b border-black/10 px-3 py-3 text-right text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "QTY" }), _jsx("th", { className: "w-28 border-b border-black/10 px-3 py-3 text-right text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "FIAT/UNIT" }), _jsx("th", { className: "w-28 border-b border-black/10 px-3 py-3 text-right text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "POWT/UNIT" }), _jsx("th", { className: "w-32 border-b border-black/10 px-3 py-3 text-right text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "TOTAL FIAT" }), _jsx("th", { className: "w-32 border-b border-black/10 px-3 py-3 text-right text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "TOTAL POWT" }), _jsx("th", { className: "w-16 border-b border-black/10 px-2 py-3 text-center text-[11px] font-semibold tracking-[0.20em] text-black/70" })] }) }), _jsxs("tbody", { className: "text-black/90", children: [state.lineItems.map((item, idx) => editingRow === idx ? (_jsxs("tr", { className: "bg-[#fff3cf] shadow-[inset_0_0_0_1px_rgba(245,158,11,0.35)]", children: [_jsx("td", { className: "border-b border-black/10 px-2 py-3 text-center font-mono text-xs tabular-nums text-black/60", children: idx + 1 }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(InputField, { input: localLineItem.description, value: localLineItem.description, onBlur: () => { }, handleInputChange: (e) => handleInputChange("description", e.target.value), className: "w-full rounded-lg border border-black/15 bg-white px-3 py-2 text-sm shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(Select, { options: units, value: localLineItem.unit, onChange: (value) => handleInputChange("unit", value), className: "w-44 rounded-lg border border-black/15 bg-white px-2 py-2 text-sm" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(NumberForm, { number: localLineItem.quantity, handleInputChange: (e) => handleInputChange("quantity", e.target.value), className: "w-24 rounded-lg border border-black/15 bg-white px-3 py-2 text-right font-mono tabular-nums shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(NumberForm, { number: localLineItem.unitPriceCash, handleInputChange: (e) => handleInputChange("unitPriceCash", String(e.target.value)), className: "w-28 rounded-lg border border-black/15 bg-white px-3 py-2 text-right font-mono tabular-nums shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(NumberForm, { number: localLineItem.unitPricePwt, handleInputChange: (e) => handleInputChange("unitPricePwt", e.target.value), className: "w-28 rounded-lg border border-black/15 bg-white px-3 py-2 text-right font-mono tabular-nums shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-right font-mono tabular-nums text-black/70", children: localLineItem.quantity && localLineItem.unitPriceCash
+                                                            ? Number(localLineItem.quantity) *
+                                                                Number(localLineItem.unitPriceCash)
+                                                            : "" }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-right font-mono tabular-nums text-black/70", children: localLineItem.quantity && localLineItem.unitPricePwt
+                                                            ? Number(localLineItem.quantity) *
+                                                                Number(localLineItem.unitPricePwt)
+                                                            : "" }), _jsx("td", { className: "border-b border-black/10 px-2 py-3 text-center", children: _jsx("button", { type: "button", onClick: (e) => {
+                                                                e.stopPropagation();
+                                                                handleDeleteLineItem(String(localLineItem.id));
+                                                            }, className: "inline-flex items-center justify-center rounded-lg p-1.5 text-red-600/70 transition hover:bg-red-50 hover:text-red-600 focus:outline-none focus-visible:ring-2 focus-visible:ring-red-600/20 focus-visible:ring-offset-1", "aria-label": "Delete line item", children: _jsx(Trash2, { className: "h-4 w-4" }) }) })] }, item.id)) : (_jsxs("tr", { className: "cursor-pointer odd:bg-[#fbf8f1] even:bg-white hover:bg-[#fff3cf]/60", onDoubleClick: () => {
+                                                    setEditingRow(idx);
+                                                    setLocalLineItem({ ...item });
+                                                }, children: [_jsx("td", { className: "border-b border-black/10 px-2 py-3 text-center font-mono text-xs tabular-nums text-black/60", children: idx + 1 }), _jsx("td", { className: "border-b border-black/10 px-3 py-3", children: item.description }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-center text-xs font-semibold tracking-wide text-black/60", children: item.unit }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-right font-mono tabular-nums", children: item.quantity }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-right font-mono tabular-nums", children: formatNumber(item.unitPriceCash) }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-right font-mono tabular-nums", children: formatNumber(item.unitPricePwt) }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-right font-mono tabular-nums", children: formatNumber(item.totalPriceCash) }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-right font-mono tabular-nums", children: formatNumber(item.totalPricePwt) }), _jsx("td", { className: "border-b border-black/10 px-2 py-3 text-center", children: _jsx("button", { type: "button", onClick: (e) => {
+                                                                e.stopPropagation();
+                                                                handleDeleteLineItem(item.id);
+                                                            }, className: "inline-flex items-center justify-center rounded-lg p-1.5 text-red-600/70 transition hover:bg-red-50 hover:text-red-600 focus:outline-none focus-visible:ring-2 focus-visible:ring-red-600/20 focus-visible:ring-offset-1", "aria-label": "Delete line item", children: _jsx(Trash2, { className: "h-4 w-4" }) }) })] }, item.id))), isAddingNew && (_jsxs("tr", { className: "bg-[#e8fff3] shadow-[inset_0_0_0_1px_rgba(16,185,129,0.22)]", children: [_jsx("td", { className: "border-b border-black/10 px-2 py-3 text-center font-mono text-xs tabular-nums text-black/60", children: state.lineItems.length + 1 }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(InputField, { input: newLineItem.description, value: newLineItem.description, onBlur: () => { }, handleInputChange: (e) => handleNewLineItemChange("description", e.target.value), className: "w-full rounded-lg border border-black/15 bg-white px-3 py-2 text-sm shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(Select, { options: units, value: newLineItem.unit, onChange: (value) => handleNewLineItemChange("unit", value), className: "w-44 rounded-lg border border-black/15 bg-white px-2 py-2 text-sm" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(NumberForm, { number: newLineItem.quantity, handleInputChange: (e) => handleNewLineItemChange("quantity", e.target.value), className: "w-24 rounded-lg border border-black/15 bg-white px-3 py-2 text-right font-mono tabular-nums shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(NumberForm, { number: newLineItem.unitPriceCash, handleInputChange: (e) => handleNewLineItemChange("unitPriceCash", String(e.target.value)), className: "w-28 rounded-lg border border-black/15 bg-white px-3 py-2 text-right font-mono tabular-nums shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-2", children: _jsx(NumberForm, { number: newLineItem.unitPricePwt, handleInputChange: (e) => handleNewLineItemChange("unitPricePwt", e.target.value), className: "w-28 rounded-lg border border-black/15 bg-white px-3 py-2 text-right font-mono tabular-nums shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]" }) }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-right font-mono tabular-nums text-black/70", children: newLineItem.quantity && newLineItem.unitPriceCash
+                                                            ? Number(newLineItem.quantity) *
+                                                                Number(newLineItem.unitPriceCash)
+                                                            : "" }), _jsx("td", { className: "border-b border-black/10 px-3 py-3 text-right font-mono tabular-nums text-black/70", children: newLineItem.quantity && newLineItem.unitPricePwt
+                                                            ? Number(newLineItem.quantity) *
+                                                                Number(newLineItem.unitPricePwt)
+                                                            : "" }), _jsx("td", { className: "border-b border-black/10 px-2 py-3 text-center" })] }))] })] }) }) }), !isAddingNew && (_jsx("div", { className: "flex justify-center bg-[#fbf8f1] px-4 py-4", children: _jsxs("button", { onClick: handleAddLineItem, className: "inline-flex items-center gap-2 rounded-full border border-black/15 bg-[#efe8da] px-4 py-2 text-xs font-semibold tracking-wide text-black/80 shadow-[0_10px_28px_rgba(15,23,42,0.10)] transition hover:bg-[#e7ddc9] focus:outline-none focus-visible:ring-2 focus-visible:ring-black/20 focus-visible:ring-offset-2 focus-visible:ring-offset-white", children: [_jsx(Plus, { className: "h-4 w-4 text-black/70" }), "Add Line Item"] }) })), isAddingNew && (_jsxs("div", { className: "flex justify-center gap-2 bg-[#fbf8f1] px-4 py-4", children: [_jsx("button", { onClick: handleSaveNewLineItem, className: "rounded-full bg-emerald-600 px-4 py-2 text-xs font-semibold tracking-wide text-white shadow-[0_10px_28px_rgba(0,0,0,0.18)] transition hover:bg-emerald-700 focus:outline-none focus-visible:ring-2 focus-visible:ring-emerald-600/60 focus-visible:ring-offset-2 focus-visible:ring-offset-white", children: "Save Line Item" }), _jsx("button", { onClick: handleCancelAdd, className: "rounded-full bg-[#121319] px-4 py-2 text-xs font-semibold tracking-wide text-[#f6f1e7] shadow-[0_10px_28px_rgba(0,0,0,0.18)] transition hover:bg-[#1b1d26] focus:outline-none focus-visible:ring-2 focus-visible:ring-[#f2d38a]/60 focus-visible:ring-offset-2 focus-visible:ring-offset-white", children: "Cancel" })] }))] })] }));
 };
 export default LineItemsTable;

package/dist/editors/billing-statement/components/objectSetTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"objectSetTable.d.ts","sourceRoot":"","sources":["../../../../editors/billing-statement/components/objectSetTable.tsx"],"names":[],"mappings":"AAQA,OAAO,EACL,KAAK,qBAAqB,EAC1B,KAAK,sBAAsB,EAE5B,MAAM,qDAAqD,CAAC;AAqB7D,QAAA,MAAM,uBAAuB,GAAI,OAAO;IAAE,KAAK,EAAE,qBAAqB,CAAC;IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,sBAAsB,CAAC,CAAA;CAAE,4CA6JzH,CAAC;AAEF,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"objectSetTable.d.ts","sourceRoot":"","sources":["../../../../editors/billing-statement/components/objectSetTable.tsx"],"names":[],"mappings":"AAOA,OAAO,EACL,KAAK,qBAAqB,EAC1B,KAAK,sBAAsB,EAE5B,MAAM,qDAAqD,CAAC;AAqB7D,QAAA,MAAM,uBAAuB,GAAI,OAAO;IACtC,KAAK,EAAE,qBAAqB,CAAC;IAC7B,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,sBAAsB,CAAC,CAAC;CAClD,4CAmKA,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/dist/editors/billing-statement/components/objectSetTable.js

@@ -1,8 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
 import { Tag } from "lucide-react";
 import { ObjectSetTable, Select } from "@powerhousedao/document-engineering";
-import { useMemo, useRef, useEffect } from "react";
+import { useMemo } from "react";
 import { actions, } from "../../../document-models/billing-statement/index.js";
 const ObjectSetTableComponent = (props) => {
     const { state, dispatch } = props;

package/dist/editors/billing-statement/editor.d.ts

@@ -1,5 +1,9 @@
 import type { EditorProps } from "document-model";
 export type IProps = EditorProps;
+export declare const currencyList: {
+    ticker: string;
+    crypto: boolean;
+}[];
 export default function Editor(props: Partial<EditorProps> & {
     documentId?: string;
 }): import("react/jsx-runtime").JSX.Element | null;

package/dist/editors/billing-statement/editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/billing-statement/editor.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAiBlD,MAAM,MAAM,MAAM,GAAG,WAAW,CAAC;AAEjC,MAAM,CAAC,OAAO,UAAU,MAAM,CAC5B,KAAK,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG;IAAE,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,kDA4GtD"}
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/billing-statement/editor.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAiBlD,MAAM,MAAM,MAAM,GAAG,WAAW,CAAC;AAEjC,eAAO,MAAM,YAAY;;;GAWxB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,MAAM,CAC5B,KAAK,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG;IAAE,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,kDAuKtD"}

package/dist/editors/billing-statement/editor.js

@@ -2,34 +2,52 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { actions, } from "../../document-models/billing-statement/index.js";
 import { CurrencyForm } from "../invoice/components/currencyForm.js";
-import { Textarea } from "@powerhousedao/document-engineering";
+import { Textarea, Select } from "@powerhousedao/document-engineering";
 import LineItemsTable from "./components/lineItemsTable.js";
 import { formatNumber } from "../invoice/lineItems.js";
-import { useSelectedBillingStatementDocument } from "../hooks/useBillingStatementDocument.js";
+import { useSelectedBillingStatementDocument } from "../../document-models/billing-statement/hooks.js";
 import { DocumentToolbar } from "@powerhousedao/design-system/connect";
 import { setSelectedNode, useParentFolderForSelectedNode, } from "@powerhousedao/reactor-browser";
+export const currencyList = [
+    { ticker: "USDS", crypto: true },
+    { ticker: "USDC", crypto: true },
+    { ticker: "DAI", crypto: true },
+    { ticker: "USD", crypto: false },
+    { ticker: "EUR", crypto: false },
+    { ticker: "DKK", crypto: false },
+    { ticker: "GBP", crypto: false },
+    { ticker: "JPY", crypto: false },
+    { ticker: "CNY", crypto: false },
+    { ticker: "CHF", crypto: false },
+];
 export default function Editor(props) {
     const [doc, dispatch] = useSelectedBillingStatementDocument();
     const state = doc?.state.global;
+    // ALL HOOKS MUST BE CALLED BEFORE ANY CONDITIONAL RETURNS
+    const [notes, setNotes] = useState(state?.notes ?? "");
+    // Get the parent folder node for the currently selected node
+    const parentFolder = useParentFolderForSelectedNode();
     if (!state) {
         console.log("Document state not found from document id", props.documentId);
         return null;
     }
-    const [notes, setNotes] = useState(state.notes ?? "");
-    // Get the parent folder node for the currently selected node
-    const parentFolder = useParentFolderForSelectedNode();
     // Set the selected node to the parent folder node (close the editor)
     function handleClose() {
-        setSelectedNode(parentFolder?.id);
+        setSelectedNode(parentFolder);
     }
-    return (_jsxs("div", { children: [_jsx(DocumentToolbar, { document: doc, onClose: handleClose }), _jsxs("div", { className: "editor-container", children: [_jsxs("div", { className: "grid grid-cols-2 gap-2 border border-gray-500 p-2 rounded-md bg-gray-1001", children: [_jsx("div", { className: "col-span-1 flex items-center", children: _jsx("h1", { className: "text-xl md:text-2xl font-bold", children: "Billing Statement" }) }), _jsxs("div", { className: "grid col-span-1 grid-rows-2 gap-2 justify-end ", children: [_jsxs("div", { className: "col-span-1 space-x-2", children: [_jsx("span", { children: "Submitter" }), _jsx("span", { children: state.contributor })] }), _jsxs("div", { className: "col-span-1 space-x-2", children: [_jsx("span", { children: "Status" }), _jsx("span", { children: state.status })] })] })] }), _jsx("div", { className: "mt-6 p-2", children: _jsxs("div", { className: "flex justify-end", children: [_jsx("span", { className: "mr-2 pt-2", children: "Currency: " }), _jsx(CurrencyForm, { currency: state.currency, handleInputChange: (e) => {
-                                        dispatch(actions.editBillingStatement({ currency: e.target.value }));
-                                    } })] }) }), _jsx("div", { className: "", children: _jsx(LineItemsTable, { state: state, dispatch: dispatch }) }), _jsxs("div", { className: "grid sm:grid-cols-2", children: [_jsx("div", { className: "mt-6 p-2 two-column-grid:mt-2", children: _jsx(Textarea, { label: "Notes", placeholder: "Add notes", autoExpand: true, rows: 4, multiline: true, value: notes, onBlur: (e) => {
-                                        const newValue = e.target.value;
-                                        if (newValue !== state.notes) {
-                                            dispatch(actions.editBillingStatement({ notes: newValue }));
-                                        }
-                                    }, onChange: (e) => {
-                                        setNotes(e.target.value);
-                                    }, className: "p-2 mb-4" }) }), _jsx("div", { className: "p-2 flex justify-center items-center sm:mt-6", children: _jsxs("table", { className: "border border-gray-300", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-100", children: [_jsx("th", { className: "border px-4 py-2", children: "Total Fiat" }), _jsx("th", { className: "border px-4 py-2", children: "Total POWT" })] }) }), _jsx("tbody", { children: _jsxs("tr", { children: [_jsx("td", { className: "border px-4 py-2 text-center", children: formatNumber(state.totalCash) }), _jsx("td", { className: "border px-4 py-2 text-center", children: formatNumber(state.totalPowt) })] }) })] }) })] })] })] }));
+    return (_jsxs("div", { className: "min-h-screen w-full bg-white text-[#14120f]", children: [_jsx(DocumentToolbar, { document: doc, onClose: handleClose }), _jsx("div", { className: "w-full bg-white", children: _jsxs("div", { className: "mx-auto w-full max-w-6xl px-4 py-10 sm:px-6 lg:px-8", children: [_jsxs("div", { className: "overflow-hidden rounded-2xl border border-black/10 bg-white text-[#14120f] shadow-[0_18px_50px_rgba(15,23,42,0.10)]", children: [_jsx("div", { className: "border-b border-black/10 bg-[#efe8da] px-6 py-5 text-[#14120f]", children: _jsxs("div", { className: "flex flex-col gap-4 sm:flex-row sm:items-end sm:justify-between", children: [_jsx("div", { className: "space-y-1", children: _jsx("h1", { className: "font-serif text-2xl tracking-tight sm:text-3xl", children: "Billing Statement" }) }), _jsxs("div", { className: "grid grid-cols-2 gap-x-6 gap-y-2 text-sm sm:text-right", children: [_jsx("div", { className: "text-black/60", children: "Submitter" }), _jsx("div", { className: "font-semibold text-black/90", children: state.contributor }), _jsx("div", { className: "text-black/60", children: "Status" }), _jsx("div", { className: "flex justify-start sm:justify-end", children: _jsx("span", { className: "inline-flex items-center rounded-full border border-black/15 bg-black/5 px-3 py-1 text-xs font-semibold tracking-wide text-black/80", children: String(state.status || "—") }) })] })] }) }), _jsxs("div", { className: "px-6 py-6", children: [_jsxs("div", { className: "flex flex-col gap-3 rounded-xl border border-black/10 bg-[#efe8da] px-4 py-3 sm:flex-row sm:items-center sm:justify-between", children: [_jsx("div", { className: "text-sm text-black/60", children: "Keep edits lightweight: double\u2011click a row to edit, click outside to auto\u2011save." }), _jsxs("div", { className: "flex items-center justify-between gap-3 sm:justify-end", children: [_jsx("span", { className: "text-xs font-semibold tracking-wide text-black/60", children: "CURRENCY" }), _jsx("div", { className: "rounded-lg border border-black/10 px-2 py-1 shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]", children: _jsx(Select, { className: "w-28", options: currencyList.map((currency) => ({
+                                                                    value: currency.ticker,
+                                                                    label: currency.ticker,
+                                                                })), value: state.currency, onChange: (value) => {
+                                                                    dispatch(actions.editBillingStatement({
+                                                                        currency: value,
+                                                                    }));
+                                                                } }) })] })] }), _jsx("div", { className: "mt-6", children: _jsx(LineItemsTable, { state: state, dispatch: dispatch }) }), _jsxs("div", { className: "mt-8 grid gap-6 lg:grid-cols-2", children: [_jsxs("div", { className: "rounded-xl border border-black/10 bg-white p-4 shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]", children: [_jsx(Textarea, { label: "Notes", placeholder: "Add notes", autoExpand: true, rows: 4, multiline: true, value: notes, onBlur: (e) => {
+                                                                const newValue = e.target.value;
+                                                                if (newValue !== state.notes) {
+                                                                    dispatch(actions.editBillingStatement({ notes: newValue }));
+                                                                }
+                                                            }, onChange: (e) => {
+                                                                setNotes(e.target.value);
+                                                            }, className: "p-2" }), _jsx("div", { className: "mt-2 text-xs text-black/50", children: "Tip: notes are saved by clicking outside of the textarea or pressing tab." })] }), _jsxs("div", { className: "rounded-xl border border-black/10 bg-white p-4 shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]", children: [_jsxs("div", { className: "flex items-baseline justify-between", children: [_jsx("div", { className: "text-xs font-semibold tracking-[0.24em] text-black/60", children: "TOTALS" }), _jsx("div", { className: "text-xs text-black/40", children: "read\u2011only" })] }), _jsx("div", { className: "mt-3 overflow-hidden rounded-lg border border-black/10", children: _jsxs("table", { className: "w-full border-collapse", children: [_jsx("thead", { className: "bg-[#efe8da] text-[#14120f]", children: _jsxs("tr", { children: [_jsx("th", { className: "border-b border-black/10 px-4 py-3 text-left text-xs font-semibold tracking-wide text-black/70", children: "Total Fiat" }), _jsx("th", { className: "border-b border-black/10 px-4 py-3 text-left text-xs font-semibold tracking-wide text-black/70", children: "Total POWT" })] }) }), _jsx("tbody", { className: "bg-[#fbf8f1]", children: _jsxs("tr", { children: [_jsx("td", { className: "border-t border-black/10 px-4 py-4 font-mono text-sm tabular-nums text-black/90", children: formatNumber(state.totalCash) }), _jsx("td", { className: "border-t border-black/10 px-4 py-4 font-mono text-sm tabular-nums text-black/90", children: formatNumber(state.totalPowt) })] }) })] }) }), _jsx("div", { className: "mt-3 text-xs text-black/50", children: "Totals update from line items." })] })] })] })] }), _jsx("div", { className: "mt-6 text-center text-xs text-black/40", children: "This view is a styled editor shell \u2014 your document operations remain unchanged." })] }) })] }));
 }

package/dist/editors/billing-statement/lineItemTags/lineItemTags.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lineItemTags.d.ts","sourceRoot":"","sources":["../../../../editors/billing-statement/lineItemTags/lineItemTags.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAKtC,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,sBAAsB,EAC5B,MAAM,qDAAqD,CAAC;AAG7D,UAAU,gBAAgB;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,mBAAmB,EAAE,CAAC;CACpC;AAED,UAAU,sBAAsB;IAC9B,SAAS,EAAE,gBAAgB,EAAE,CAAC;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC;CAC5C;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,OAAO,EACP,QAAQ,GACT,EAAE,sBAAsB,2CAyKxB"}
+{"version":3,"file":"lineItemTags.d.ts","sourceRoot":"","sources":["../../../../editors/billing-statement/lineItemTags/lineItemTags.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAKtC,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,sBAAsB,EAC5B,MAAM,qDAAqD,CAAC;AAG7D,UAAU,gBAAgB;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,mBAAmB,EAAE,CAAC;CACpC;AAED,UAAU,sBAAsB;IAC9B,SAAS,EAAE,gBAAgB,EAAE,CAAC;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC;CAC5C;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,OAAO,EACP,QAAQ,GACT,EAAE,sBAAsB,2CAiMxB"}

package/dist/editors/billing-statement/lineItemTags/lineItemTags.js

@@ -19,41 +19,40 @@ export function LineItemTagsTable({ lineItems, onClose, dispatch, }) {
             });
         });
     };
-    return (_jsxs("div", { className: "w-full", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-gray-200 p-6 bg-white z-10", children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx("h2", { className: "text-1xl font-semibold text-gray-900", children: "Assign Tags " }), _jsx(Tag, { style: { width: 28, height: 28, color: "white", fill: "#475264" } })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Button, { color: "light", size: "small", onClick: handleReset, children: ["Reset", " "] }), _jsx("button", { onClick: onClose, className: "rounded-full p-2 hover:bg-gray-100", children: _jsx(X, { size: 24, className: "text-gray-500" }) })] })] }), _jsx("div", { className: "overflow-x-auto rounded-sm border border-gray-200", children: _jsxs("table", { className: "w-full border-collapse bg-white", children: [_jsx("thead", { className: "bg-gray-50 z-10", children: _jsxs("tr", { children: [_jsx("th", { className: "border-b border-gray-200 p-3 text-center text-sm", children: "Item" }), _jsx("th", { className: "border-b border-gray-200 p-3 text-center text-sm", children: "Period" }), _jsx("th", { className: "border-b border-gray-200 p-3 text-center text-sm", children: "Expense Account" }), _jsx("th", { className: "border-b border-gray-200 p-3 text-center text-sm", children: "Budget" })] }) }), _jsx("tbody", { children: lineItems.map((item) => (_jsxs("tr", { className: "hover:bg-gray-50", children: [_jsx("td", { className: "border-b border-gray-200 p-2", children: _jsx(InputField, { value: item.description, handleInputChange: (e) => { }, onBlur: (e) => {
-                                                dispatch(actions.editLineItem({
-                                                    id: item.id,
-                                                    description: e.target.value,
-                                                }));
-                                            }, className: "w-full text-xs" }) }), _jsx("td", { className: "border-b border-gray-200 p-2 w-50", children: _jsx(DatePicker, { name: "period", dateFormat: "YYYY-MM-DD", autoClose: true, placeholder: "Select Period", value: item.lineItemTag.find((tag) => tag.dimension === "accounting-period")?.label || "", onChange: (e) => dispatch(actions.editLineItemTag({
-                                                lineItemId: item.id,
-                                                dimension: "accounting-period",
-                                                value: new Date(e.target.value)
-                                                    .toLocaleDateString("en-US", {
-                                                    year: "numeric",
-                                                    month: "numeric",
-                                                })
-                                                    .split("/")
-                                                    .reverse()
-                                                    .join("/"),
-                                                label: new Date(e.target.value).toLocaleDateString("en-US", {
-                                                    month: "long",
-                                                    year: "numeric",
-                                                }),
-                                            })), className: "w-full text-xs bg-white" }) }), _jsx("td", { className: "border-b border-gray-200 p-2", children: _jsx(Select, { options: expenseAccountOptions, value: item.lineItemTag.find((tag) => tag.dimension === "expense-account")?.value || "", placeholder: "Select Expense Account", searchable: true, onChange: (value) => {
-                                                const selectedOption = expenseAccountOptions.find((option) => option.value === value);
-                                                dispatch(actions.editLineItemTag({
-                                                    lineItemId: item.id,
-                                                    dimension: "expense-account",
-                                                    value: selectedOption?.value || "",
-                                                    label: selectedOption?.label
-                                                }));
-                                            }, className: "w-full text-xs" }) }), _jsx("td", { className: "border-b border-gray-200 p-2", children: _jsx(Select, { options: budgetOptions, value: item.lineItemTag.find((tag) => tag.dimension === "budget")
-                                                ?.value || "", placeholder: "Select Budget", onChange: (value) => {
-                                                dispatch(actions.editLineItemTag({
-                                                    lineItemId: item.id,
-                                                    dimension: "budget",
-                                                    value: value,
-                                                    label: budgetOptions.find((option) => option.value === value)?.label,
-                                                }));
-                                            } }) })] }, item.id))) })] }) })] }));
+    return (_jsx("div", { className: "min-h-screen w-full bg-white text-[#14120f]", children: _jsx("div", { className: "mx-auto w-full max-w-6xl px-4 py-10 sm:px-6 lg:px-8", children: _jsxs("div", { className: "overflow-hidden rounded-2xl border border-black/10 bg-white text-[#14120f] shadow-[0_18px_50px_rgba(15,23,42,0.10)]", children: [_jsxs("div", { className: "flex flex-col gap-4 border-b border-black/10 bg-[#efe8da] px-6 py-5 text-[#14120f] sm:flex-row sm:items-center sm:justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "grid h-10 w-10 place-items-center rounded-xl border border-black/10 bg-white", children: _jsx(Tag, { className: "h-5 w-5 text-black/70" }) }), _jsxs("div", { children: [_jsx("div", { className: "text-[11px] font-semibold tracking-[0.22em] text-black/60", children: "TAG EDITOR" }), _jsx("h2", { className: "font-serif text-xl tracking-tight", children: "Assign tags to line items" })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { color: "light", size: "small", onClick: handleReset, children: "Reset" }), _jsx("button", { type: "button", onClick: onClose, className: "inline-flex items-center justify-center rounded-full border border-black/15 bg-black/5 p-2 text-black/70 transition hover:bg-black/10 focus:outline-none focus-visible:ring-2 focus-visible:ring-black/20 focus-visible:ring-offset-2 focus-visible:ring-offset-[#efe8da]", "aria-label": "Close tag editor", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsxs("div", { className: "p-6", children: [_jsx("div", { className: "overflow-hidden rounded-xl border border-black/10 bg-white shadow-[inset_0_1px_0_rgba(255,255,255,0.9)]", children: _jsx("div", { className: "overflow-x-auto", children: _jsxs("table", { className: "w-full border-collapse", children: [_jsx("thead", { className: "bg-[#efe8da] text-[#14120f]", children: _jsxs("tr", { children: [_jsx("th", { className: "border-b border-black/10 px-3 py-3 text-left text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "ITEM" }), _jsx("th", { className: "border-b border-black/10 px-3 py-3 text-left text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "PERIOD" }), _jsx("th", { className: "border-b border-black/10 px-3 py-3 text-left text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "EXPENSE ACCOUNT" }), _jsx("th", { className: "border-b border-black/10 px-3 py-3 text-left text-[11px] font-semibold tracking-[0.20em] text-black/70", children: "BUDGET" })] }) }), _jsx("tbody", { className: "text-sm text-black/90", children: lineItems.map((item) => (_jsxs("tr", { className: "odd:bg-[#fbf8f1] even:bg-white hover:bg-[#fff3cf]/60", children: [_jsx("td", { className: "border-b border-gray-200 p-2", children: _jsx(InputField, { value: item.description, handleInputChange: (e) => { }, onBlur: (e) => {
+                                                                    dispatch(actions.editLineItem({
+                                                                        id: item.id,
+                                                                        description: e.target.value,
+                                                                    }));
+                                                                }, className: "w-full text-xs" }) }), _jsx("td", { className: "border-b border-gray-200 p-2 w-50", children: _jsx(DatePicker, { name: "period", dateFormat: "YYYY-MM-DD", autoClose: true, placeholder: "Select Period", value: item.lineItemTag.find((tag) => tag.dimension === "accounting-period")?.label || "", onChange: (e) => dispatch(actions.editLineItemTag({
+                                                                    lineItemId: item.id,
+                                                                    dimension: "accounting-period",
+                                                                    value: new Date(e.target.value)
+                                                                        .toLocaleDateString("en-US", {
+                                                                        year: "numeric",
+                                                                        month: "numeric",
+                                                                    })
+                                                                        .split("/")
+                                                                        .reverse()
+                                                                        .join("/"),
+                                                                    label: new Date(e.target.value).toLocaleDateString("en-US", {
+                                                                        month: "long",
+                                                                        year: "numeric",
+                                                                    }),
+                                                                })), className: "w-full text-xs bg-white" }) }), _jsx("td", { className: "border-b border-gray-200 p-2", children: _jsx(Select, { options: expenseAccountOptions, value: item.lineItemTag.find((tag) => tag.dimension === "expense-account")?.value || "", placeholder: "Select Expense Account", searchable: true, onChange: (value) => {
+                                                                    const selectedOption = expenseAccountOptions.find((option) => option.value === value);
+                                                                    dispatch(actions.editLineItemTag({
+                                                                        lineItemId: item.id,
+                                                                        dimension: "expense-account",
+                                                                        value: selectedOption?.value || "",
+                                                                        label: selectedOption?.label,
+                                                                    }));
+                                                                }, className: "w-full text-xs" }) }), _jsx("td", { className: "border-b border-gray-200 p-2", children: _jsx(Select, { options: budgetOptions, value: item.lineItemTag.find((tag) => tag.dimension === "budget")?.value || "", placeholder: "Select Budget", onChange: (value) => {
+                                                                    dispatch(actions.editLineItemTag({
+                                                                        lineItemId: item.id,
+                                                                        dimension: "budget",
+                                                                        value: value,
+                                                                        label: budgetOptions.find((option) => option.value === value)?.label,
+                                                                    }));
+                                                                } }) })] }, item.id))) })] }) }) }), _jsx("div", { className: "mt-4 text-xs text-black/50", children: "Changes persist as you blur fields/selects." })] })] }) }) }));
 }

package/dist/editors/billing-statement/lineItemTags/tagMapping.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tagMapping.d.ts","sourceRoot":"","sources":["../../../../editors/billing-statement/lineItemTags/tagMapping.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAC3E,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,+CAA+C,CAAC;AAkGhF,eAAO,MAAM,qBAAqB,EAAE,YAAY,EAO9C,CAAC;AAEH,eAAO,MAAM,aAAa,EAAE,YAAY,EAGvC,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,cAAc,UAAU,EAAE,+BAmBjD,CAAC"}
+{"version":3,"file":"tagMapping.d.ts","sourceRoot":"","sources":["../../../../editors/billing-statement/lineItemTags/tagMapping.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAC3E,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,+CAA+C,CAAC;AAoHhF,eAAO,MAAM,qBAAqB,EAAE,YAAY,EAO9C,CAAC;AAEH,eAAO,MAAM,aAAa,EAAE,YAAY,EAGvC,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,cAAc,UAAU,EAAE,+BAmBjD,CAAC"}

package/dist/editors/billing-statement/lineItemTags/tagMapping.js

@@ -9,15 +9,24 @@ const billingTagMapping = [
     { fusion: "Travel & Entertainment", xero: "3001 - Meals" },
     { fusion: "Travel & Entertainment", xero: "3002 - Airfare" },
     { fusion: "Travel & Entertainment", xero: "3003 - Hotels" },
-    { fusion: "Travel & Entertainment", xero: "3004 - Transportation (Uber, Taxi etc)" },
+    {
+        fusion: "Travel & Entertainment",
+        xero: "3004 - Transportation (Uber, Taxi etc)",
+    },
     { fusion: "Travel & Entertainment", xero: "3005 - Other travel cost" },
     { fusion: "Cost of Goods Sold", xero: "310 - Cost of Goods Sold" },
     { fusion: "Marketing Expense", xero: "400 - Advertising" },
     { fusion: "Professional Services", xero: "4001 - Legal Fees Abroad" },
     { fusion: "Professional Services", xero: "4002 - Legal Fees Switzerland" },
     { fusion: "Professional Services", xero: "4003 - Finance Team Fees Abroad" },
-    { fusion: "Professional Services", xero: "4004 - Finance and Accounting Fees Switzerland" },
-    { fusion: "Software Development Expense", xero: "4005 - Software Development Team Fees" },
+    {
+        fusion: "Professional Services",
+        xero: "4004 - Finance and Accounting Fees Switzerland",
+    },
+    {
+        fusion: "Software Development Expense",
+        xero: "4005 - Software Development Team Fees",
+    },
     { fusion: "Professional Services", xero: "4006 - Research Team Fees" },
     { fusion: "Marketing Expense", xero: "4007 - Marketing Team Fees" },
     { fusion: "Compensation & Benefits", xero: "4008 - Health Care Fees" },
@@ -32,7 +41,10 @@ const billingTagMapping = [
     { fusion: "Admin Expense", xero: "453 - Office Expenses" },
     { fusion: "Admin Expense", xero: "469 - Rent" },
     { fusion: "Admin Expense", xero: "485 - Subscriptions" },
-    { fusion: "Other Income Expense (Non-operating)", xero: "497 - Bank Revaluations" },
+    {
+        fusion: "Other Income Expense (Non-operating)",
+        xero: "497 - Bank Revaluations",
+    },
     { fusion: "Other Income", xero: "498 - Unrealised Currency Gains" },
     { fusion: "Other Income", xero: "499 - Realised Currency Gains" },
     { fusion: "Income Tax Expense", xero: "505 - Income Tax Expense" },
@@ -42,9 +54,15 @@ const billingTagMapping = [
     { fusion: "Software Expense", xero: "701 - Software/IT Subscriptions" },
     { fusion: "Software Expense", xero: "702 - Telephone and Internet Charges" },
     { fusion: "Fixed Asset", xero: "710 - Office Equipment" },
-    { fusion: "Fixed Asset", xero: "711 - Less Accumulated Depreciation on Office Equipment" },
+    {
+        fusion: "Fixed Asset",
+        xero: "711 - Less Accumulated Depreciation on Office Equipment",
+    },
     { fusion: "Non-Current Asset", xero: "720 - Computer Equipment" },
-    { fusion: "Non-Current Asset", xero: "721 - Less Accumulated Depreciation on Computer Equipment" },
+    {
+        fusion: "Non-Current Asset",
+        xero: "721 - Less Accumulated Depreciation on Computer Equipment",
+    },
     { fusion: "Current Liability", xero: "800 - Accounts Payable" },
     { fusion: "Other", xero: "8000 - Bank Fees" },
     { fusion: "Gas Expense", xero: "8001 - Gas Fees" },
@@ -64,11 +82,11 @@ const billingTagMapping = [
     { fusion: "Owner Equity", xero: "881 - Owner A Funds Introduced" },
     { fusion: "Non-current Liability", xero: "900 - Loan" },
     { fusion: "Equity", xero: "960 - Retained Earnings" },
-    { fusion: "Equity", xero: "970 - Owner A Share Capital" }
+    { fusion: "Equity", xero: "970 - Owner A Share Capital" },
 ];
 // Mapping of labels to values
 const fusionLabelToValue = {
-    "Budget": "budget",
+    Budget: "budget",
     "Current Liability": "liabilities/current",
     "Interest Income": "income/interest",
     "Travel & Entertainment": "expenses/headcount/travel-and-entertainment",
@@ -88,11 +106,11 @@ const fusionLabelToValue = {
     "Gas Expense": "expenses/non-headcount/gas",
     "Adjustment A/C": "accounts/adjustment",
     "Temporary Holding Account": "accounts/temporary",
-    "Other": "accounts/other",
+    Other: "accounts/other",
     "Internal Transfers": "accounts/internal-transfers",
     "Owner Equity": "equity/owner",
     "Non-current Liability": "liabilities/non-current",
-    "Equity": "equity/retained",
+    Equity: "equity/retained",
 };
 export const expenseAccountOptions = Array.from(new Set(billingTagMapping.map((tag) => tag.fusion))).map((tag) => {
     return {

package/dist/editors/clean-new-editor/components/CreateDocument.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Document creation UI component.
+ * Displays available document types as clickable buttons.
+ */
+export declare function CreateDocument(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CreateDocument.d.ts.map

package/dist/editors/clean-new-editor/components/CreateDocument.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CreateDocument.d.ts","sourceRoot":"","sources":["../../../../editors/clean-new-editor/components/CreateDocument.tsx"],"names":[],"mappings":"AAMA;;;GAGG;AACH,wBAAgB,cAAc,4CAsB7B"}

package/dist/editors/clean-new-editor/components/CreateDocument.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { showCreateDocumentModal, useAllowedDocumentModelModules, } from "@powerhousedao/reactor-browser";
+/**
+ * Document creation UI component.
+ * Displays available document types as clickable buttons.
+ */
+export function CreateDocument() {
+    const allowedDocumentModelModules = useAllowedDocumentModelModules();
+    return (_jsxs("div", { children: [_jsx("h3", { className: "mb-3 mt-4 text-sm font-bold text-gray-600", children: "Create document" }), _jsx("div", { className: "flex w-full flex-wrap gap-4", children: allowedDocumentModelModules?.map((documentModelModule) => {
+                    return (_jsx(CreateDocumentButton, { documentModelModule: documentModelModule }, documentModelModule.documentModel.global.id));
+                }) })] }));
+}
+function CreateDocumentButton({ documentModelModule }) {
+    const documentType = documentModelModule.documentModel.global.id;
+    const documentModelName = documentModelModule.documentModel.global.name || documentType;
+    const documentModelDescription = documentModelModule.documentModel.global.description;
+    return (_jsx("button", { className: "cursor-pointer rounded-md bg-gray-200 py-2 px-3 hover:bg-gray-300", title: documentModelName, "aria-description": documentModelDescription, onClick: () => showCreateDocumentModal(documentType), children: documentModelName }));
+}

package/dist/editors/clean-new-editor/components/DriveContents.d.ts

@@ -0,0 +1,3 @@
+/** Shows the documents and folders in the selected drive */
+export declare function DriveContents(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DriveContents.d.ts.map

package/dist/editors/clean-new-editor/components/DriveContents.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DriveContents.d.ts","sourceRoot":"","sources":["../../../../editors/clean-new-editor/components/DriveContents.tsx"],"names":[],"mappings":"AAMA,4DAA4D;AAC5D,wBAAgB,aAAa,4CAU5B"}

package/dist/editors/clean-new-editor/components/DriveContents.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CreateDocument } from "./CreateDocument.js";
+import { EmptyState } from "./EmptyState.js";
+import { Files } from "./Files.js";
+import { Folders } from "./Folders.js";
+import { NavigationBreadcrumbs } from "./NavigationBreadcrumbs.js";
+/** Shows the documents and folders in the selected drive */
+export function DriveContents() {
+    return (_jsxs("div", { className: "space-y-6 px-6", children: [_jsx(NavigationBreadcrumbs, {}), _jsx(Folders, {}), _jsx(Files, {}), _jsx(EmptyState, {}), _jsx(CreateDocument, {})] }));
+}

package/dist/editors/clean-new-editor/components/DriveExplorer.d.ts

@@ -0,0 +1,7 @@
+import type { EditorProps } from "document-model";
+/**
+ * Main drive explorer component with sidebar navigation and content area.
+ * Layout: Left sidebar (folder tree) + Right content area (files/folders + document editor)
+ */
+export declare function DriveExplorer({ children }: EditorProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DriveExplorer.d.ts.map

package/dist/editors/clean-new-editor/components/DriveExplorer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DriveExplorer.d.ts","sourceRoot":"","sources":["../../../../editors/clean-new-editor/components/DriveExplorer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAIlD;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW,2CAmBtD"}

package/dist/editors/clean-new-editor/components/DriveExplorer.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FolderTree } from "./FolderTree.js";
+import { DriveContents } from "./DriveContents.js";
+/**
+ * Main drive explorer component with sidebar navigation and content area.
+ * Layout: Left sidebar (folder tree) + Right content area (files/folders + document editor)
+ */
+export function DriveExplorer({ children }) {
+    // if a document is selected then it's editor will be passed as children
+    const showDocumentEditor = !!children;
+    return (_jsxs("div", { className: "flex h-full", children: [_jsx(FolderTree, {}), _jsx("div", { className: "flex-1 overflow-y-auto p-4", children: showDocumentEditor ? (
+                /* Document editor view */
+                children) : (
+                /* Folder contents view */
+                _jsx(DriveContents, {})) })] }));
+}

package/dist/editors/clean-new-editor/components/EmptyState.d.ts

@@ -0,0 +1,3 @@
+/** Shows a message when the selected drive or folder is empty */
+export declare function EmptyState(): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=EmptyState.d.ts.map

package/dist/editors/clean-new-editor/components/EmptyState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../../editors/clean-new-editor/components/EmptyState.tsx"],"names":[],"mappings":"AAEA,iEAAiE;AACjE,wBAAgB,UAAU,mDAWzB"}

package/dist/editors/clean-new-editor/components/EmptyState.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useNodesInSelectedDriveOrFolder } from "@powerhousedao/reactor-browser";
+/** Shows a message when the selected drive or folder is empty */
+export function EmptyState() {
+    const nodes = useNodesInSelectedDriveOrFolder();
+    const hasNodes = nodes.length > 0;
+    if (hasNodes)
+        return null;
+    return (_jsxs("div", { className: "py-12 text-center text-gray-500", children: [_jsx("p", { className: "text-lg", children: "This folder is empty" }), _jsx("p", { className: "mt-2 text-sm", children: "Create your first document or folder below" })] }));
+}

package/dist/editors/clean-new-editor/components/Files.d.ts

@@ -0,0 +1,3 @@
+/** Shows the files in the selected drive or folder */
+export declare function Files(): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=Files.d.ts.map

package/dist/editors/clean-new-editor/components/Files.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Files.d.ts","sourceRoot":"","sources":["../../../../editors/clean-new-editor/components/Files.tsx"],"names":[],"mappings":"AAMA,sDAAsD;AACtD,wBAAgB,KAAK,mDAiBpB"}

package/dist/editors/clean-new-editor/components/Files.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FileItem } from "@powerhousedao/design-system/connect";
+import { useNodesInSelectedDriveOrFolder, isFileNodeKind, } from "@powerhousedao/reactor-browser";
+/** Shows the files in the selected drive or folder */
+export function Files() {
+    const nodes = useNodesInSelectedDriveOrFolder();
+    const fileNodes = nodes.filter((n) => isFileNodeKind(n));
+    const hasFiles = fileNodes.length > 0;
+    if (!hasFiles)
+        return null;
+    return (_jsxs("div", { children: [_jsx("h3", { className: "mb-2 text-sm font-semibold text-gray-600", children: "Documents" }), _jsx("div", { className: "flex flex-wrap gap-4", children: fileNodes.map((fileNode) => (_jsx(FileItem, { fileNode: fileNode }, fileNode.id))) })] }));
+}

package/dist/editors/clean-new-editor/components/FolderTree.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Hierarchical folder tree navigation component using Sidebar from document-engineering.
+ * Displays folders and files in a tree structure with expand/collapse functionality, search, and resize support.
+ */
+export declare function FolderTree(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FolderTree.d.ts.map

package/dist/editors/clean-new-editor/components/FolderTree.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FolderTree.d.ts","sourceRoot":"","sources":["../../../../editors/clean-new-editor/components/FolderTree.tsx"],"names":[],"mappings":"AAyDA;;;GAGG;AACH,wBAAgB,UAAU,4CA0CzB"}