@powerhousedao/contributor-billing 0.0.91 → 0.0.93

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

@@ -1,4 +1,4 @@
 import type { EditorProps } from "document-model";
 export type IProps = EditorProps;
-export default function Editor(props: any): import("react/jsx-runtime").JSX.Element;
+export default function Editor(props: any): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=editor.d.ts.map

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;AAWlD,MAAM,MAAM,MAAM,GAAG,WAAW,CAAC;AAEjC,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,GAAG,2CAmHxC"}
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/billing-statement/editor.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAYlD,MAAM,MAAM,MAAM,GAAG,WAAW,CAAC;AAEjC,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,GAAG,kDAoHxC"}

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

@@ -5,20 +5,16 @@ import { CurrencyForm } from "../invoice/components/currencyForm.js";
 import { Textarea } from "@powerhousedao/document-engineering";
 import LineItemsTable from "./components/lineItemsTable.js";
 import { formatNumber } from "../invoice/lineItems.js";
-import { useSelectedDocument } from "@powerhousedao/reactor-browser";
+import { useDocumentById } from "@powerhousedao/reactor-browser";
 export default function Editor(props) {
-    let dispatch;
-    const { document } = props;
-    if (props?.dispatch) {
-        dispatch = props.dispatch;
+    const [doc, dispatch] = useDocumentById(props.documentId);
+    const state = doc?.state.global;
+    if (!state) {
+        console.log("Document state not found from document id", props.documentId);
+        return null;
     }
-    else {
-        const selectedDocument = useSelectedDocument();
-        dispatch = selectedDocument[1];
-    }
-    const state = document.state.global;
     const [notes, setNotes] = useState(state.notes ?? "");
-    return (_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: props.document.state.global.currency, handleInputChange: (e) => {
+    return (_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: false, rows: 4, multiline: true, value: notes, onBlur: (e) => {
                                 const newValue = e.target.value;

package/dist/editors/contributor-billing/components/DriveExplorer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DriveExplorer.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/DriveExplorer.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,gBAAgB,EAUtB,MAAM,gCAAgC,CAAC;AAUxC;;;GAGG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,gBAAgB,2CAuWpD"}
+{"version":3,"file":"DriveExplorer.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/DriveExplorer.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,KAAK,gBAAgB,EAStB,MAAM,gCAAgC,CAAC;AAQxC;;;GAGG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,gBAAgB,2CAkXpD"}

package/dist/editors/contributor-billing/components/DriveExplorer.js

@@ -1,11 +1,9 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { CreateDocumentModal, useDrop } from "@powerhousedao/design-system";
-import { addDocument, useDocumentModelModules, useDriveContext, useDriveSharingType, useEditorModules, useFileChildNodes, useSelectedDrive, useSelectedDriveDocuments, useSelectedFolder, useSelectedNodePath, } from "@powerhousedao/reactor-browser";
+import { CreateDocumentModal, ToastContainer, } from "@powerhousedao/design-system";
+import { addDocument, useDocumentModelModules, useEditorModules, useFileChildNodes, useSelectedDrive, useSelectedDriveDocuments, useSelectedFolder, useNodeActions, showDeleteNodeModal, } from "@powerhousedao/reactor-browser";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { EditorContainer } from "./EditorContainer.js";
 import { InvoiceTable } from "./InvoiceTable/InvoiceTable.js";
-import { twMerge } from "tailwind-merge";
-import { ToastContainer } from "@powerhousedao/design-system";
 import { HeaderStats } from "./InvoiceTable/HeaderStats.js";
 /**
  * Main drive explorer component with sidebar navigation and content area.
@@ -24,24 +22,13 @@ export function DriveExplorer(props) {
     const [openModal, setOpenModal] = useState(false);
     const selectedDocumentModel = useRef(null);
     const editorModules = useEditorModules();
-    // === DRIVE CONTEXT HOOKS ===
-    // Core drive operations and document models
-    const { onAddFile, onAddFolder, onCopyNode, onMoveNode } = useDriveContext();
+    // === NODE ACTIONS HOOK ===
+    // Get all node operations from reactor-browser
+    const { onRenameNode, onDuplicateNode } = useNodeActions();
     // === STATE MANAGEMENT HOOKS ===
     // Core state hooks for drive navigation
     const [selectedDrive] = useSelectedDrive(); // Currently selected drive
     const selectedFolder = useSelectedFolder(); // Currently selected folder
-    const selectedNodePath = useSelectedNodePath();
-    const sharingType = useDriveSharingType(selectedDrive?.header.id);
-    // === DROP HOOKS ===
-    const { isDropTarget, dropProps } = useDrop({
-        node: selectedNodePath?.length > 0
-            ? selectedNodePath[selectedNodePath.length - 1]
-            : undefined,
-        onAddFile,
-        onCopyNode,
-        onMoveNode,
-    });
     const fileChildren = useFileChildNodes();
     // All document states
     const allDocuments = useSelectedDriveDocuments();
@@ -64,12 +51,12 @@ export function DriveExplorer(props) {
             "PAYMENTCLOSED",
         ];
         // Get all selected row IDs
-        const selectedRowIds = Object.keys(selected).filter(id => selected[id]);
+        const selectedRowIds = Object.keys(selected).filter((id) => selected[id]);
         if (selectedRowIds.length === 0)
             return false;
         // Check if all selected rows have allowed statuses
-        const selectedRows = state?.filter(doc => selectedRowIds.includes(doc.header.id)) || [];
-        return selectedRows.every(row => allowedStatuses.includes(row.state.global.status));
+        const selectedRows = state?.filter((doc) => selectedRowIds.includes(doc.header.id)) || [];
+        return selectedRows.every((row) => allowedStatuses.includes(row.state.global.status));
     }, [selected, state]);
     // Create a stable dispatcher map using useRef only (no useState to avoid re-renders)
     const dispatchersRef = useRef(new Map());
@@ -166,23 +153,38 @@ export function DriveExplorer(props) {
         return dispatchersRef.current.get(id) || null;
     };
     // === EVENT HANDLERS ===
-    // Handle folder creation with optional name parameter
-    const handleCreateFolder = useCallback(async (folderName) => {
-        let name = folderName;
-        // If no name provided, prompt for it (for manual folder creation)
-        if (!name) {
-            const promptResult = prompt("Enter folder name:");
-            name = promptResult || undefined;
+    // Wrapper for rename that handles node ID
+    const handleRenameNode = useCallback(async (nodeId, newName) => {
+        const node = fileChildren.find((n) => n.id === nodeId);
+        if (node) {
+            await onRenameNode(newName, node);
         }
-        if (name?.trim()) {
-            try {
-                await onAddFolder(name.trim(), selectedFolder);
-            }
-            catch (error) {
-                console.error("Failed to create folder:", error);
-            }
+    }, [fileChildren, onRenameNode]);
+    // Wrapper for delete that clears selection
+    const handleDeleteNode = useCallback(async (nodeId) => {
+        const node = fileChildren.find((n) => n.id === nodeId);
+        if (node &&
+            window.confirm(`Are you sure you want to delete "${node.name}"?`)) {
+            // Delete via context menu or direct call
+            // The FileItem component will call showDeleteNodeModal instead
+            setSelected((prev) => {
+                const newSelected = { ...prev };
+                delete newSelected[nodeId];
+                return newSelected;
+            });
         }
-    }, [onAddFolder, selectedFolder]);
+    }, [fileChildren]);
+    // Wrapper for showDeleteNodeModal (for FileItem) - uses the reactor-browser function
+    const handleShowDeleteModal = useCallback(async (node) => {
+        showDeleteNodeModal(node.id);
+        // Clear selection after deletion is confirmed
+        setSelected((prev) => {
+            const newSelected = { ...prev };
+            delete newSelected[node.id];
+            return newSelected;
+        });
+        return undefined;
+    }, []);
     // Handle document creation from modal
     const onCreateDocument = useCallback(async (fileName) => {
         setOpenModal(false);
@@ -222,11 +224,10 @@ export function DriveExplorer(props) {
         ? editorModules?.find((e) => e.documentTypes.includes(activeDocument.documentType))
         : null;
     // === RENDER ===
-    // console.log("files", fileChildren);
-    // console.log("state", state);
-    // console.log("isDropTarget", isDropTarget);
-    // console.log("dropProps", dropProps);
-    return (_jsx("div", { className: "flex h-full editor-container", children: _jsxs("div", { ...dropProps, className: twMerge("rounded-md border-2 border-transparent ", isDropTarget && "border-dashed border-blue-100"), children: [_jsx(ToastContainer, { position: "bottom-right", autoClose: 5000, hideProgressBar: false, newestOnTop: false, closeOnClick: false, rtl: false, pauseOnFocusLoss: true, draggable: true, pauseOnHover: true, theme: "light" }), _jsx("div", { className: "flex-1 p-4", children: activeDocument && documentModelModule && editorModule ? (
+    return (_jsx("div", { className: "flex h-full editor-container", children: _jsxs("div", { className: "h-full", children: [_jsx(ToastContainer, { position: "bottom-right", autoClose: 5000, hideProgressBar: false, newestOnTop: false, closeOnClick: false, rtl: false, pauseOnFocusLoss: true, draggable: true, pauseOnHover: true, theme: "light" }), _jsx("div", { className: "flex-1 p-4", children: activeDocument && documentModelModule && editorModule ? (
                     // Document editor view
-                    _jsx(EditorContainer, { handleClose: () => setActiveDocumentId(undefined), activeDocumentId: activeDocumentId || "" })) : (_jsxs(_Fragment, { children: [_jsx(HeaderStats, {}), _jsx(InvoiceTable, { setActiveDocumentId: setActiveDocumentId, files: fileChildren, state: state || [], selected: selected, setSelected: setSelected, onBatchAction: () => { }, onDeleteNode: () => { }, renameNode: () => { }, filteredDocumentModels: documentModelModules, onSelectDocumentModel: onSelectDocumentModel, getDocDispatcher: getDocDispatcher, selectedStatuses: selectedStatuses, onStatusChange: handleStatusChange, onRowSelection: handleRowSelection, canExportSelectedRows: canExportSelectedRows })] })) }), _jsx(CreateDocumentModal, { onContinue: onCreateDocument, onOpenChange: (open) => setOpenModal(open), open: openModal })] }) }));
+                    _jsx(EditorContainer, { handleClose: () => setActiveDocumentId(undefined), activeDocumentId: activeDocumentId || "" })) : (_jsxs(_Fragment, { children: [_jsx(HeaderStats, {}), _jsx(InvoiceTable, { setActiveDocumentId: setActiveDocumentId, files: fileChildren, state: state || [], selected: selected, setSelected: setSelected, onBatchAction: () => { }, onDeleteNode: handleDeleteNode, renameNode: handleRenameNode, onDuplicateNode: async (node) => {
+                                    await onDuplicateNode(node);
+                                    return undefined;
+                                }, showDeleteNodeModal: handleShowDeleteModal, filteredDocumentModels: documentModelModules, onSelectDocumentModel: onSelectDocumentModel, getDocDispatcher: getDocDispatcher, selectedStatuses: selectedStatuses, onStatusChange: handleStatusChange, onRowSelection: handleRowSelection, canExportSelectedRows: canExportSelectedRows })] })) }), _jsx(CreateDocumentModal, { onContinue: onCreateDocument, onOpenChange: (open) => setOpenModal(open), open: openModal })] }) }));
 }

package/dist/editors/contributor-billing/components/EditorContainer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorContainer.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/EditorContainer.tsx"],"names":[],"mappings":"AAiBA;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAI,OAAO;IACrC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,gBAAgB,EAAE,MAAM,CAAC;CAC1B,4CAmGA,CAAC"}
+{"version":3,"file":"EditorContainer.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/EditorContainer.tsx"],"names":[],"mappings":"AAiBA;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAI,OAAO;IACrC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,gBAAgB,EAAE,MAAM,CAAC;CAC1B,4CAgGA,CAAC"}

package/dist/editors/contributor-billing/components/EditorContainer.js

@@ -52,5 +52,5 @@ export const EditorContainer = (props) => {
     _jsxs(Suspense, { fallback: loadingContent, children: [_jsx(DocumentToolbar, { onClose: handleClose, onExport: onExport, onShowRevisionHistory: () => setShowRevisionHistory(true), onSwitchboardLinkClick: () => { }, title: selectedDocument.header.name, timelineButtonVisible: editorModule.config.timelineEnabled, timelineItems: timelineItems.data, onTimelineItemClick: setSelectedTimelineItem }), _jsx(EditorComponent, { context: {
                     readMode: !!selectedTimelineItem,
                     selectedTimelineRevision: getRevisionFromDate(selectedTimelineItem?.startDate, selectedTimelineItem?.endDate, selectedDocument.operations.global),
-                }, dispatch: dispatch, document: selectedDocument, error: console.error })] }));
+                }, documentId: selectedDocument.header.id })] }));
 };

package/dist/editors/contributor-billing/components/InvoiceTable/InvoiceTable.d.ts

@@ -1,3 +1,4 @@
+import type { Node } from "document-drive";
 import { type DocumentModelModule } from "document-model";
 interface InvoiceTableProps {
     files: any[];
@@ -16,6 +17,8 @@ interface InvoiceTableProps {
     onBatchAction: (action: string) => void;
     onDeleteNode: (nodeId: string) => void;
     renameNode: (nodeId: string, name: string) => void;
+    onDuplicateNode: (node: Node) => Promise<Node | undefined>;
+    showDeleteNodeModal: (node: Node) => Promise<Node | undefined>;
     filteredDocumentModels: DocumentModelModule[];
     onSelectDocumentModel: (model: DocumentModelModule) => void;
     getDocDispatcher: (id: string) => any;
@@ -24,6 +27,6 @@ interface InvoiceTableProps {
     onRowSelection: (rowId: string, checked: boolean, rowStatus: string) => void;
     canExportSelectedRows: () => boolean;
 }
-export declare const InvoiceTable: ({ files, state, setActiveDocumentId, selected, setSelected, onBatchAction, onDeleteNode, renameNode, filteredDocumentModels, onSelectDocumentModel, getDocDispatcher, selectedStatuses, onStatusChange, onRowSelection, canExportSelectedRows, }: InvoiceTableProps) => import("react/jsx-runtime").JSX.Element;
+export declare const InvoiceTable: ({ files, state, setActiveDocumentId, selected, setSelected, onBatchAction, onDeleteNode, renameNode, onDuplicateNode, showDeleteNodeModal, filteredDocumentModels, onSelectDocumentModel, getDocDispatcher, selectedStatuses, onStatusChange, onRowSelection, canExportSelectedRows, }: InvoiceTableProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=InvoiceTable.d.ts.map

package/dist/editors/contributor-billing/components/InvoiceTable/InvoiceTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InvoiceTable.d.ts","sourceRoot":"","sources":["../../../../../editors/contributor-billing/components/InvoiceTable/InvoiceTable.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AA2B1D,UAAU,iBAAiB;IACzB,KAAK,EAAE,GAAG,EAAE,CAAC;IACb,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CAAC;IAC7B,mBAAmB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,QAAQ,EAAE;QAAE,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,CAAC;IACpC,WAAW,EAAE,CACX,QAAQ,EACJ;QAAE,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,GACzB,CAAC,CAAC,IAAI,EAAE;QAAE,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,KAAK;QAAE,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,CAAC,KACjE,IAAI,CAAC;IACV,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,sBAAsB,EAAE,mBAAmB,EAAE,CAAC;IAC9C,qBAAqB,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAC5D,gBAAgB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,GAAG,CAAC;IACtC,gBAAgB,EAAE,MAAM,EAAE,CAAC;IAC3B,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7E,qBAAqB,EAAE,MAAM,OAAO,CAAC;CACtC;AAED,eAAO,MAAM,YAAY,GAAI,kPAgB1B,iBAAiB,4CA0nBnB,CAAC"}
+{"version":3,"file":"InvoiceTable.d.ts","sourceRoot":"","sources":["../../../../../editors/contributor-billing/components/InvoiceTable/InvoiceTable.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AA2B1D,UAAU,iBAAiB;IACzB,KAAK,EAAE,GAAG,EAAE,CAAC;IACb,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CAAC;IAC7B,mBAAmB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,QAAQ,EAAE;QAAE,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,CAAC;IACpC,WAAW,EAAE,CACX,QAAQ,EACJ;QAAE,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,GACzB,CAAC,CAAC,IAAI,EAAE;QAAE,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,KAAK;QAAE,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,CAAC,KACjE,IAAI,CAAC;IACV,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,eAAe,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,CAAC;IAC3D,mBAAmB,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,CAAC;IAC/D,sBAAsB,EAAE,mBAAmB,EAAE,CAAC;IAC9C,qBAAqB,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAC5D,gBAAgB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,GAAG,CAAC;IACtC,gBAAgB,EAAE,MAAM,EAAE,CAAC;IAC3B,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7E,qBAAqB,EAAE,MAAM,OAAO,CAAC;CACtC;AAED,eAAO,MAAM,YAAY,GAAI,wRAkB1B,iBAAiB,4CA0pBnB,CAAC"}

package/dist/editors/contributor-billing/components/InvoiceTable/InvoiceTable.js

@@ -20,7 +20,7 @@ const statusOptions = [
     { label: "Rejected", value: "REJECTED" },
     { label: "Other", value: "OTHER" },
 ];
-export const InvoiceTable = ({ files, state, setActiveDocumentId, selected, setSelected, onBatchAction, onDeleteNode, renameNode, filteredDocumentModels, onSelectDocumentModel, getDocDispatcher, selectedStatuses, onStatusChange, onRowSelection, canExportSelectedRows, }) => {
+export const InvoiceTable = ({ files, state, setActiveDocumentId, selected, setSelected, onBatchAction, onDeleteNode, renameNode, onDuplicateNode, showDeleteNodeModal, filteredDocumentModels, onSelectDocumentModel, getDocDispatcher, selectedStatuses, onStatusChange, onRowSelection, canExportSelectedRows, }) => {
     const [selectedDrive] = useSelectedDrive();
     const billingDocStates = state
         .filter((doc) => doc.header.documentType === "powerhouse/billing-statement")
@@ -202,11 +202,17 @@ export const InvoiceTable = ({ files, state, setActiveDocumentId, selected, setS
     };
     // check if integrations document exists
     const integrationsDoc = files.find((file) => file.documentType === "powerhouse/integrations");
-    const createIntegrationsDocument = () => {
+    const createIntegrationsDocument = async () => {
         const integrationsDocument = filteredDocumentModels?.find((model) => model.documentModel.id === "powerhouse/integrations");
         if (integrationsDocument) {
-            onSelectDocumentModel(integrationsDocument);
+            const createdNode = await addDocument(selectedDrive?.header.id || "", `integration-settings`, "powerhouse/integrations", undefined, undefined, undefined, "integrations-editor");
+            console.log("created integrations document", createdNode);
+            if (!createdNode?.id) {
+                console.error("Failed to create integrations document");
+                return null;
+            }
+            setActiveDocumentId(createdNode.id);
         }
     };
-    return (_jsxs("div", { className: "w-full h-full bg-white rounded-lg p-4 border border-gray-200 shadow-md mt-4 overflow-x-auto", children: [_jsx(HeaderControls, { statusOptions: statusOptions, onStatusChange: onStatusChange, onBatchAction: onBatchAction, onExport: handleCSVExport, selectedStatuses: selectedStatuses, createIntegrationsDocument: createIntegrationsDocument, integrationsDoc: integrationsDoc, setActiveDocumentId: setActiveDocumentId, canExportSelectedRows: canExportSelectedRows }), shouldShowSection("DRAFT") && (_jsx(InvoiceTableSection, { title: "Draft", count: draft.length, onSelectDocumentModel: onSelectDocumentModel, filteredDocumentModels: filteredDocumentModels, children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: draft.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode }, row.id))) })] }) })), shouldShowSection("ISSUED") && (_jsx(InvoiceTableSection, { title: "Issued", count: issued.length, children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: issued.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("ACCEPTED") && (_jsx(InvoiceTableSection, { title: "Accepted", count: accepted.length, color: "bg-green-100 text-green-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: accepted.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("PAYMENTSCHEDULED") && (_jsx(InvoiceTableSection, { title: "Payment Scheduled", count: paymentScheduled.length, color: "bg-green-100 text-green-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: paymentScheduled.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("PAYMENTSENT") && (_jsx(InvoiceTableSection, { title: "Payment Sent", count: paymentSent.length, color: "bg-green-100 text-green-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: paymentSent.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("PAYMENTISSUE") && (_jsx(InvoiceTableSection, { title: "Payment Issue", count: paymentIssue.length, color: "bg-yellow-100 text-yellow-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: paymentIssue.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("PAYMENTCLOSED") && (_jsx(InvoiceTableSection, { title: "Payment Closed", count: paymentClosed.length, color: "bg-red-500 text-black-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: paymentClosed.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode }, row.id))) })] }) })), shouldShowSection("REJECTED") && (_jsx(InvoiceTableSection, { title: "Rejected", count: rejected.length, color: "bg-red-500 text-black-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: rejected.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode }, row.id))) })] }) })), shouldShowSection("OTHER") && (_jsx(InvoiceTableSection, { title: "Other", count: otherInvoices.length, children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Exported" })] }) }), _jsx("tbody", { children: otherInvoices.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode }, row.id))) })] }) }))] }, `${state.length}`));
+    return (_jsxs("div", { className: "w-full h-full bg-white rounded-lg p-4 border border-gray-200 shadow-md mt-4 overflow-x-auto", children: [_jsx(HeaderControls, { statusOptions: statusOptions, onStatusChange: onStatusChange, onBatchAction: onBatchAction, onExport: handleCSVExport, selectedStatuses: selectedStatuses, createIntegrationsDocument: createIntegrationsDocument, integrationsDoc: integrationsDoc, setActiveDocumentId: setActiveDocumentId, canExportSelectedRows: canExportSelectedRows }), shouldShowSection("DRAFT") && (_jsx(InvoiceTableSection, { title: "Draft", count: draft.length, onSelectDocumentModel: onSelectDocumentModel, filteredDocumentModels: filteredDocumentModels, children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: draft.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onDuplicateNode: onDuplicateNode, showDeleteNodeModal: showDeleteNodeModal }, row.id))) })] }) })), shouldShowSection("ISSUED") && (_jsx(InvoiceTableSection, { title: "Issued", count: issued.length, children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: issued.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onDuplicateNode: onDuplicateNode, showDeleteNodeModal: showDeleteNodeModal, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("ACCEPTED") && (_jsx(InvoiceTableSection, { title: "Accepted", count: accepted.length, color: "bg-green-100 text-green-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: accepted.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onDuplicateNode: onDuplicateNode, showDeleteNodeModal: showDeleteNodeModal, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("PAYMENTSCHEDULED") && (_jsx(InvoiceTableSection, { title: "Payment Scheduled", count: paymentScheduled.length, color: "bg-green-100 text-green-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: paymentScheduled.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onDuplicateNode: onDuplicateNode, showDeleteNodeModal: showDeleteNodeModal, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("PAYMENTSENT") && (_jsx(InvoiceTableSection, { title: "Payment Sent", count: paymentSent.length, color: "bg-green-100 text-green-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: paymentSent.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onDuplicateNode: onDuplicateNode, showDeleteNodeModal: showDeleteNodeModal, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("PAYMENTISSUE") && (_jsx(InvoiceTableSection, { title: "Payment Issue", count: paymentIssue.length, color: "bg-yellow-100 text-yellow-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Billing Statement" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: paymentIssue.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onDuplicateNode: onDuplicateNode, showDeleteNodeModal: showDeleteNodeModal, onCreateBillingStatement: handleCreateBillingStatement, billingDocStates: billingDocStates }, row.id))) })] }) })), shouldShowSection("PAYMENTCLOSED") && (_jsx(InvoiceTableSection, { title: "Payment Closed", count: paymentClosed.length, color: "bg-red-500 text-black-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: paymentClosed.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onDuplicateNode: onDuplicateNode, showDeleteNodeModal: showDeleteNodeModal }, row.id))) })] }) })), shouldShowSection("REJECTED") && (_jsx(InvoiceTableSection, { title: "Rejected", count: rejected.length, color: "bg-red-500 text-black-600", children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2", children: "Exported" })] }) }), _jsx("tbody", { children: rejected.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onDuplicateNode: onDuplicateNode, showDeleteNodeModal: showDeleteNodeModal }, row.id))) })] }) })), shouldShowSection("OTHER") && (_jsx(InvoiceTableSection, { title: "Other", count: otherInvoices.length, children: _jsxs("table", { className: "w-full text-sm border-separate border-spacing-0 border border-gray-400", children: [_jsx("thead", { children: _jsxs("tr", { className: "bg-gray-50", children: [_jsx("th", { className: "px-2 py-2 w-8" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issuer" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Invoice No." }), _jsx("th", { className: "px-2 py-2 text-center", children: "Issue Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Due Date" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Currency" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Amount" }), _jsx("th", { className: "px-2 py-2 text-center", children: "Exported" })] }) }), _jsx("tbody", { children: otherInvoices.map((row) => (_jsx(InvoiceTableRow, { files: files, row: row, isSelected: !!selected[row.id], onSelect: (checked) => onRowSelection(row.id, checked, row.status), setActiveDocumentId: setActiveDocumentId, onDeleteNode: handleDelete, renameNode: renameNode, onDuplicateNode: onDuplicateNode, showDeleteNodeModal: showDeleteNodeModal }, row.id))) })] }) }))] }, `${state.length}`));
 };

package/dist/editors/contributor-billing/components/InvoiceTable/InvoiceTableRow.d.ts

@@ -1,4 +1,5 @@
-export declare const InvoiceTableRow: ({ files, row, isSelected, onSelect, setActiveDocumentId, onDeleteNode, renameNode, onCreateBillingStatement, billingDocStates, }: {
+import type { Node } from "document-drive";
+export declare const InvoiceTableRow: ({ files, row, isSelected, onSelect, setActiveDocumentId, onDeleteNode, renameNode, onDuplicateNode, showDeleteNodeModal, onCreateBillingStatement, billingDocStates, }: {
     files?: any[];
     row: any;
     isSelected: boolean;
@@ -6,6 +7,8 @@ export declare const InvoiceTableRow: ({ files, row, isSelected, onSelect, setAc
     setActiveDocumentId: (id: string) => void;
     onDeleteNode: (nodeId: string) => void;
     renameNode: (nodeId: string, name: string) => void;
+    onDuplicateNode?: (node: Node) => Promise<Node | undefined>;
+    showDeleteNodeModal?: (node: Node) => Promise<Node | undefined>;
     onCreateBillingStatement?: (id: string) => void;
     billingDocStates?: {
         id: string;

package/dist/editors/contributor-billing/components/InvoiceTable/InvoiceTableRow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InvoiceTableRow.d.ts","sourceRoot":"","sources":["../../../../../editors/contributor-billing/components/InvoiceTable/InvoiceTableRow.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,eAAe,GAAI,kIAU7B;IACD,KAAK,CAAC,EAAE,GAAG,EAAE,CAAC;IACd,GAAG,EAAE,GAAG,CAAC;IACT,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,mBAAmB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,wBAAwB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,gBAAgB,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CAC1D,4CAgLA,CAAC"}
+{"version":3,"file":"InvoiceTableRow.d.ts","sourceRoot":"","sources":["../../../../../editors/contributor-billing/components/InvoiceTable/InvoiceTableRow.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAE3C,eAAO,MAAM,eAAe,GAAI,wKAY7B;IACD,KAAK,CAAC,EAAE,GAAG,EAAE,CAAC;IACd,GAAG,EAAE,GAAG,CAAC;IACT,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,mBAAmB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,CAAC;IAC5D,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,CAAC;IAChE,wBAAwB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,gBAAgB,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CAC1D,4CAoLA,CAAC"}

package/dist/editors/contributor-billing/components/InvoiceTable/InvoiceTableRow.js

@@ -1,8 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useRef } from "react";
 import { FileItem } from "@powerhousedao/design-system";
-import { useDriveContext } from "@powerhousedao/reactor-browser";
-export const InvoiceTableRow = ({ files, row, isSelected, onSelect, setActiveDocumentId, onDeleteNode, renameNode, onCreateBillingStatement, billingDocStates, }) => {
+export const InvoiceTableRow = ({ files, row, isSelected, onSelect, setActiveDocumentId, onDeleteNode, renameNode, onDuplicateNode, showDeleteNodeModal, onCreateBillingStatement, billingDocStates, }) => {
     const [menuOpen, setMenuOpen] = useState(false);
     const menuRef = useRef(null);
     const formatTimestamp = (timestamp) => {
@@ -42,11 +41,21 @@ export const InvoiceTableRow = ({ files, row, isSelected, onSelect, setActiveDoc
     const billingFile = files?.find((file) => file.id === billingDoc?.id);
     const file = files?.find((file) => file.id === row.id);
     const hasExportedData = row.exported != null && Boolean(row.exported.timestamp?.trim());
-    const { onAddFile, onAddFolder, onCopyNode, onDuplicateNode, onMoveNode, onRenameNode, showDeleteNodeModal, } = useDriveContext();
-    return (_jsxs("tr", { className: "hover:bg-gray-50", children: [_jsx("td", { className: "px-2 py-2", children: _jsx("input", { type: "checkbox", checked: isSelected, onChange: (e) => onSelect(e.target.checked), className: "size-4 rounded border-gray-300 text-blue-600 focus:ring-2 focus:ring-blue-500" }) }), _jsx("td", { className: "py-1 w-10", children: file && (_jsx(FileItem, { fileNode: file, sharingType: "PUBLIC", onRenameNode: onRenameNode, onDuplicateNode: () => new Promise((resolve) => resolve(undefined)), showDeleteNodeModal: showDeleteNodeModal, isAllowedToCreateDocuments: true, className: "h-10", onAddFile: () => new Promise((resolve) => resolve(undefined)), onAddFolder: () => new Promise((resolve) => resolve(undefined)), onCopyNode: () => new Promise((resolve) => resolve(undefined)), onMoveNode: () => new Promise((resolve) => resolve(undefined)), onAddAndSelectNewFolder: () => new Promise((resolve) => resolve(undefined)), getSyncStatusSync: () => undefined, setSelectedNode: () => setActiveDocumentId(row.id) }, row.id)) }), _jsx("td", { className: "px-2 py-2 text-center", children: row.invoiceNo }), _jsx("td", { className: "px-2 py-2 text-center", children: row.issueDate }), _jsx("td", { className: "px-2 py-2 text-center", children: row.dueDate }), _jsx("td", { className: "px-2 py-2 text-center", children: row.currency }), _jsx("td", { className: "px-2 py-2 text-center", children: formatAmount(row.amount) }), (row.status === "ISSUED" ||
+    // Wrapper functions for FileItem that convert between nodeId and Node
+    const handleRenameNode = async (newName, node) => {
+        await renameNode(node.id, newName);
+        return undefined;
+    };
+    const handleDuplicateNode = async (node) => {
+        if (onDuplicateNode) {
+            await onDuplicateNode(node);
+        }
+    };
+    const handleShowDeleteModal = showDeleteNodeModal || (async () => undefined);
+    return (_jsxs("tr", { className: "hover:bg-gray-50", children: [_jsx("td", { className: "px-2 py-2", children: _jsx("input", { type: "checkbox", checked: isSelected, onChange: (e) => onSelect(e.target.checked), className: "size-4 rounded border-gray-300 text-blue-600 focus:ring-2 focus:ring-blue-500" }) }), _jsx("td", { className: "py-1 w-10", children: file && (_jsx(FileItem, { fileNode: file, sharingType: "PUBLIC", onRenameNode: handleRenameNode, onDuplicateNode: handleDuplicateNode, showDeleteNodeModal: handleShowDeleteModal, isAllowedToCreateDocuments: true, className: "h-10", onAddFile: () => new Promise((resolve) => resolve(undefined)), onAddFolder: () => new Promise((resolve) => resolve(undefined)), onCopyNode: () => new Promise((resolve) => resolve(undefined)), onMoveNode: () => new Promise((resolve) => resolve(undefined)), onAddAndSelectNewFolder: () => new Promise((resolve) => resolve(undefined)), getSyncStatusSync: () => undefined, setSelectedNode: () => setActiveDocumentId(row.id) }, row.id)) }), _jsx("td", { className: "px-2 py-2 text-center", children: row.invoiceNo }), _jsx("td", { className: "px-2 py-2 text-center", children: row.issueDate }), _jsx("td", { className: "px-2 py-2 text-center", children: row.dueDate }), _jsx("td", { className: "px-2 py-2 text-center", children: row.currency }), _jsx("td", { className: "px-2 py-2 text-center", children: formatAmount(row.amount) }), (row.status === "ISSUED" ||
                 row.status === "ACCEPTED" ||
                 row.status === "PAYMENTSCHEDULED" ||
                 row.status === "PAYMENTRECEIVED" ||
                 row.status === "PAYMENTSENT") &&
-                !billingFile && (_jsx("td", { className: "px-2 py-2 text-center", children: _jsx("button", { className: "bg-white border border-gray-300 rounded px-3 py-1 text-sm hover:bg-gray-100 col-span-1 justify-self-end", onClick: () => onCreateBillingStatement?.(row.id), children: "Generate Billing Statement" }) })), billingFile && (_jsx("td", { className: "px-2 py-2 text-center", children: _jsx(FileItem, { fileNode: billingFile, sharingType: "PUBLIC", onRenameNode: onRenameNode, onDuplicateNode: () => new Promise((resolve) => resolve(undefined)), showDeleteNodeModal: showDeleteNodeModal, isAllowedToCreateDocuments: true, className: "h-10", onAddFile: () => new Promise((resolve) => resolve(undefined)), onAddFolder: () => new Promise((resolve) => resolve(undefined)), onCopyNode: () => new Promise((resolve) => resolve(undefined)), onMoveNode: () => new Promise((resolve) => resolve(undefined)), onAddAndSelectNewFolder: () => new Promise((resolve) => resolve(undefined)), getSyncStatusSync: () => undefined, setSelectedNode: () => setActiveDocumentId(billingDoc?.id) }, billingDoc?.id) })), _jsx("td", { className: "px-2 py-2 text-center", children: hasExportedData ? (_jsxs("div", { className: "flex flex-col items-center", children: [_jsx("span", { className: "text-green-500", children: "Yes" }), _jsx("span", { className: "text-green-500 text-xs", children: formatTimestamp(row.exported.timestamp) })] })) : (_jsx("span", { className: "text-red-500", children: "No" })) })] }));
+                !billingFile && (_jsx("td", { className: "px-2 py-2 text-center", children: _jsx("button", { className: "bg-white border border-gray-300 rounded px-3 py-1 text-sm hover:bg-gray-100 col-span-1 justify-self-end", onClick: () => onCreateBillingStatement?.(row.id), children: "Generate Billing Statement" }) })), billingFile && (_jsx("td", { className: "px-2 py-2 text-center", children: _jsx(FileItem, { fileNode: billingFile, sharingType: "PUBLIC", onRenameNode: handleRenameNode, onDuplicateNode: handleDuplicateNode, showDeleteNodeModal: handleShowDeleteModal, isAllowedToCreateDocuments: true, className: "h-10", onAddFile: () => new Promise((resolve) => resolve(undefined)), onAddFolder: () => new Promise((resolve) => resolve(undefined)), onCopyNode: () => new Promise((resolve) => resolve(undefined)), onMoveNode: () => new Promise((resolve) => resolve(undefined)), onAddAndSelectNewFolder: () => new Promise((resolve) => resolve(undefined)), getSyncStatusSync: () => undefined, setSelectedNode: () => setActiveDocumentId(billingDoc?.id) }, billingDoc?.id) })), _jsx("td", { className: "px-2 py-2 text-center", children: hasExportedData ? (_jsxs("div", { className: "flex flex-col items-center", children: [_jsx("span", { className: "text-green-500", children: "Yes" }), _jsx("span", { className: "text-green-500 text-xs", children: formatTimestamp(row.exported.timestamp) })] })) : (_jsx("span", { className: "text-red-500", children: "No" })) })] }));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/contributor-billing/editor.tsx"],"names":[],"mappings":"AACA,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,gCAAgC,CAAC;AAGxC;;;GAGG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,gBAAgB,2CAOjD;AAED;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,gBAAgB,2CAarD"}
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/contributor-billing/editor.tsx"],"names":[],"mappings":"AACA,OAAO,EAGL,KAAK,gBAAgB,EACtB,MAAM,gCAAgC,CAAC;AAIxC;;;GAGG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,gBAAgB,2CAMjD;AAKD;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,gBAAgB,2CAWrD"}

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

@@ -1,15 +1,17 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { WagmiContext } from "@powerhousedao/design-system";
-import { AnalyticsProvider, DriveContextProvider, useAppConfig, } from "@powerhousedao/reactor-browser";
+import { AnalyticsProvider, useAppConfig, } from "@powerhousedao/reactor-browser";
 import { DriveExplorer } from "./components/DriveExplorer.js";
+import { withDropZone } from "./utils/withDropZone.js";
 /**
  * Base editor component that renders the drive explorer interface.
  * Customize document opening behavior and drive-level actions here.
  */
 export function BaseEditor(props) {
-    const { context, document } = props;
-    return (_jsx("div", { className: "new-drive-explorer", style: { height: "100%" }, children: _jsx(DriveExplorer, { document: document, context: context }) }));
+    return (_jsx("div", { className: "new-drive-explorer", style: { height: "100%" }, children: _jsx(DriveExplorer, { ...props }) }));
 }
+// Wrap base editor with drop zone functionality
+const BaseEditorWithDropZone = withDropZone(BaseEditor);
 /**
  * Main editor entry point with required providers.
  */
@@ -18,5 +20,5 @@ export default function Editor(props) {
     const analyticsDatabaseName = appConfig?.analyticsDatabaseName;
     return (
     // Required context providers for drive functionality
-    _jsx(DriveContextProvider, { value: props.context, children: _jsx(WagmiContext, { children: _jsx(AnalyticsProvider, { databaseName: analyticsDatabaseName, children: _jsx(BaseEditor, { ...props }) }) }) }));
+    _jsx(WagmiContext, { children: _jsx(AnalyticsProvider, { databaseName: analyticsDatabaseName, children: _jsx(BaseEditorWithDropZone, { ...props }) }) }));
 }

package/dist/editors/contributor-billing/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../editors/contributor-billing/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAGxE,eAAO,MAAM,MAAM,EAAE,iBASpB,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../editors/contributor-billing/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAGxE,eAAO,MAAM,MAAM,EAAE,iBAgBpB,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/editors/contributor-billing/index.js

@@ -7,6 +7,13 @@ export const module = {
         disableExternalControls: true,
         documentToolbarEnabled: true,
         showSwitchboardLink: true,
+        documentTypes: [
+            "powerhouse/invoice",
+            "powerhouse/billing-statement",
+        ],
+        dragAndDrop: {
+            enabled: true,
+        },
     },
 };
 export default module;

package/dist/editors/contributor-billing/utils/withDropZone.d.ts

@@ -0,0 +1,4 @@
+import type { DriveEditorProps } from "@powerhousedao/reactor-browser";
+import type { ComponentType } from "react";
+export declare function withDropZone<T extends DriveEditorProps>(WrappedComponent: ComponentType<T>): ComponentType<T>;
+//# sourceMappingURL=withDropZone.d.ts.map

package/dist/editors/contributor-billing/utils/withDropZone.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"withDropZone.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/utils/withDropZone.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,gBAAgB,EAEjB,MAAM,gCAAgC,CAAC;AAMxC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,wBAAgB,YAAY,CAAC,CAAC,SAAS,gBAAgB,EACrD,gBAAgB,EAAE,aAAa,CAAC,CAAC,CAAC,GACjC,aAAa,CAAC,CAAC,CAAC,CAqClB"}

package/dist/editors/contributor-billing/utils/withDropZone.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DropZone } from "@powerhousedao/design-system";
+import { setSelectedNode, useOnDropFile, useSelectedDriveId, } from "@powerhousedao/reactor-browser";
+export function withDropZone(WrappedComponent) {
+    const WithDropZoneComponent = (props) => {
+        const driveId = useSelectedDriveId();
+        const onDropFile = useOnDropFile(props.editorConfig?.documentTypes);
+        const onAddFile = async (file, parent, onProgress, resolveConflict) => {
+            return await onDropFile(file, onProgress, resolveConflict);
+        };
+        // Only wrap with DropZone if enabled in config
+        if (props.editorConfig?.dragAndDrop?.enabled) {
+            return (_jsx(DropZone, { onAddFile: onAddFile, setSelectedNode: setSelectedNode, driveId: driveId, useLocalStorage: true, style: { height: "100%" }, children: _jsx(WrappedComponent, { ...props }) }));
+        }
+        return _jsx(WrappedComponent, { ...props });
+    };
+    WithDropZoneComponent.displayName = `withDropZone(${WrappedComponent.displayName || WrappedComponent.name || "Component"})`;
+    return WithDropZoneComponent;
+}

package/dist/editors/integrations/editor.d.ts

@@ -1,2 +1,2 @@
-export default function Editor(props: any): import("react/jsx-runtime").JSX.Element;
+export default function Editor(props: any): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=editor.d.ts.map

package/dist/editors/integrations/editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/integrations/editor.tsx"],"names":[],"mappings":"AAeA,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,GAAG,2CA8TxC"}
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/integrations/editor.tsx"],"names":[],"mappings":"AAgBA,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,GAAG,kDAyTxC"}

package/dist/editors/integrations/editor.js

@@ -2,49 +2,45 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { actions, } from "../../document-models/integrations/index.js";
 import { Button } from "@powerhousedao/document-engineering";
 import { useState } from "react";
-import { useSelectedDocument } from "@powerhousedao/reactor-browser";
+import { useDocumentById } from "@powerhousedao/reactor-browser";
 const TABS = [
     { key: "requestFinance", label: "Request Finance" },
     { key: "gnosisSafe", label: "Gnosis Safe" },
     { key: "googleCloud", label: "Google Cloud" },
 ];
 export default function Editor(props) {
-    let dispatch;
-    const { document } = props;
-    if (props?.dispatch) {
-        dispatch = props.dispatch;
-    }
-    else {
-        const selectedDocument = useSelectedDocument();
-        dispatch = selectedDocument[1];
+    const [doc, dispatch] = useDocumentById(props.documentId);
+    const state = doc?.state.global;
+    if (!state) {
+        console.log("Document state not found from document id", props.documentId);
+        return null;
     }
     const [activeTab, setActiveTab] = useState("requestFinance");
     // State for each form
     const [requestFinance, setRequestFinance] = useState(() => ({
-        apiKey: document.state.global.requestFinance?.apiKey || "",
-        email: document.state.global.requestFinance?.email || "",
+        apiKey: state.requestFinance?.apiKey || "",
+        email: state.requestFinance?.email || "",
     }));
     const [gnosisSafe, setGnosisSafe] = useState(() => ({
-        safeAddress: document.state.global.gnosisSafe?.safeAddress || "",
-        signerPrivateKey: document.state.global.gnosisSafe?.signerPrivateKey || "",
+        safeAddress: state.gnosisSafe?.safeAddress || "",
+        signerPrivateKey: state.gnosisSafe?.signerPrivateKey || "",
     }));
     const [googleCloud, setGoogleCloud] = useState(() => ({
-        projectId: document.state.global.googleCloud?.projectId || "",
-        location: document.state.global.googleCloud?.location || "",
-        processorId: document.state.global.googleCloud?.processorId || "",
+        projectId: state.googleCloud?.projectId || "",
+        location: state.googleCloud?.location || "",
+        processorId: state.googleCloud?.processorId || "",
         keyFile: {
-            type: document.state.global.googleCloud?.keyFile?.type || "",
-            project_id: document.state.global.googleCloud?.keyFile?.project_id || "",
-            private_key_id: document.state.global.googleCloud?.keyFile?.private_key_id || "",
-            private_key: document.state.global.googleCloud?.keyFile?.private_key || "",
-            client_email: document.state.global.googleCloud?.keyFile?.client_email || "",
-            client_id: document.state.global.googleCloud?.keyFile?.client_id || "",
-            auth_uri: document.state.global.googleCloud?.keyFile?.auth_uri || "",
-            token_uri: document.state.global.googleCloud?.keyFile?.token_uri || "",
-            auth_provider_x509_cert_url: document.state.global.googleCloud?.keyFile
-                ?.auth_provider_x509_cert_url || "",
-            client_x509_cert_url: document.state.global.googleCloud?.keyFile?.client_x509_cert_url || "",
-            universe_domain: document.state.global.googleCloud?.keyFile?.universe_domain || "",
+            type: state.googleCloud?.keyFile?.type || "",
+            project_id: state.googleCloud?.keyFile?.project_id || "",
+            private_key_id: state.googleCloud?.keyFile?.private_key_id || "",
+            private_key: state.googleCloud?.keyFile?.private_key || "",
+            client_email: state.googleCloud?.keyFile?.client_email || "",
+            client_id: state.googleCloud?.keyFile?.client_id || "",
+            auth_uri: state.googleCloud?.keyFile?.auth_uri || "",
+            token_uri: state.googleCloud?.keyFile?.token_uri || "",
+            auth_provider_x509_cert_url: state.googleCloud?.keyFile?.auth_provider_x509_cert_url || "",
+            client_x509_cert_url: state.googleCloud?.keyFile?.client_x509_cert_url || "",
+            universe_domain: state.googleCloud?.keyFile?.universe_domain || "",
         },
     }));
     // Handlers
@@ -65,10 +61,9 @@ export default function Editor(props) {
                             : "border-transparent text-gray-500 bg-gray-100 hover:text-blue-500"}`, onClick: () => setActiveTab(tab.key), type: "button", children: tab.label }, tab.key))) }), _jsxs("div", { className: "bg-white rounded-xl shadow p-4 sm:p-6", children: [activeTab === "requestFinance" && (_jsxs("form", { className: "flex flex-col gap-4", onSubmit: (e) => {
                                 e.preventDefault();
                                 handleRequestFinanceSave();
-                            }, children: [_jsx("h2", { className: "text-lg font-semibold mb-2", children: "Request Finance API" }), _jsxs("label", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-sm font-medium", children: "API Key" }), _jsx("input", { className: "input input-bordered rounded px-3 py-2 border border-gray-300 focus:border-blue-400 focus:ring focus:ring-blue-100 text-sm", type: "text", value: requestFinance.apiKey, onChange: (e) => setRequestFinance((v) => ({ ...v, apiKey: e.target.value })), placeholder: "Enter API Key" })] }), _jsxs("label", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-sm font-medium", children: "Email" }), _jsx("input", { className: "input input-bordered rounded px-3 py-2 border border-gray-300 focus:border-blue-400 focus:ring focus:ring-blue-100 text-sm", type: "email", value: requestFinance.email, onChange: (e) => setRequestFinance((v) => ({ ...v, email: e.target.value })), placeholder: "Enter Email" })] }), _jsx("div", { className: "flex justify-end mt-2", children: _jsx(Button, { size: "sm", variant: "outline", color: "black", type: "submit", className: "hover:bg-gray-200", disabled: document.state.global.requestFinance?.apiKey ===
+                            }, children: [_jsx("h2", { className: "text-lg font-semibold mb-2", children: "Request Finance API" }), _jsxs("label", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-sm font-medium", children: "API Key" }), _jsx("input", { className: "input input-bordered rounded px-3 py-2 border border-gray-300 focus:border-blue-400 focus:ring focus:ring-blue-100 text-sm", type: "text", value: requestFinance.apiKey, onChange: (e) => setRequestFinance((v) => ({ ...v, apiKey: e.target.value })), placeholder: "Enter API Key" })] }), _jsxs("label", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-sm font-medium", children: "Email" }), _jsx("input", { className: "input input-bordered rounded px-3 py-2 border border-gray-300 focus:border-blue-400 focus:ring focus:ring-blue-100 text-sm", type: "email", value: requestFinance.email, onChange: (e) => setRequestFinance((v) => ({ ...v, email: e.target.value })), placeholder: "Enter Email" })] }), _jsx("div", { className: "flex justify-end mt-2", children: _jsx(Button, { size: "sm", variant: "outline", color: "black", type: "submit", className: "hover:bg-gray-200", disabled: state.requestFinance?.apiKey ===
                                             requestFinance.apiKey &&
-                                            document.state.global.requestFinance?.email ===
-                                                requestFinance.email, children: "Save" }) })] })), activeTab === "gnosisSafe" && (_jsxs("form", { className: "flex flex-col gap-4", onSubmit: (e) => {
+                                            state.requestFinance?.email === requestFinance.email, children: "Save" }) })] })), activeTab === "gnosisSafe" && (_jsxs("form", { className: "flex flex-col gap-4", onSubmit: (e) => {
                                 e.preventDefault();
                                 handleGnosisSafeSave();
                             }, children: [_jsx("h2", { className: "text-lg font-semibold mb-2", children: "Gnosis Safe" }), _jsxs("label", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-sm font-medium", children: "Safe Address" }), _jsx("input", { className: "input input-bordered rounded px-3 py-2 border border-gray-300 focus:border-blue-400 focus:ring focus:ring-blue-100 text-sm", type: "text", value: gnosisSafe.safeAddress, onChange: (e) => setGnosisSafe((v) => ({
@@ -77,9 +72,9 @@ export default function Editor(props) {
                                             })), placeholder: "0x..." })] }), _jsxs("label", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-sm font-medium", children: "Signer Private Key" }), _jsx("input", { className: "input input-bordered rounded px-3 py-2 border border-gray-300 focus:border-blue-400 focus:ring focus:ring-blue-100 text-sm", type: "text", value: gnosisSafe.signerPrivateKey, onChange: (e) => setGnosisSafe((v) => ({
                                                 ...v,
                                                 signerPrivateKey: e.target.value,
-                                            })), placeholder: "Private Key" })] }), _jsx("div", { className: "flex justify-end mt-2", children: _jsx(Button, { size: "sm", variant: "outline", color: "black", type: "submit", className: "hover:bg-gray-200", disabled: document.state.global.gnosisSafe?.safeAddress ===
+                                            })), placeholder: "Private Key" })] }), _jsx("div", { className: "flex justify-end mt-2", children: _jsx(Button, { size: "sm", variant: "outline", color: "black", type: "submit", className: "hover:bg-gray-200", disabled: state.gnosisSafe?.safeAddress ===
                                             gnosisSafe.safeAddress &&
-                                            document.state.global.gnosisSafe?.signerPrivateKey ===
+                                            state.gnosisSafe?.signerPrivateKey ===
                                                 gnosisSafe.signerPrivateKey, children: "Save" }) })] })), activeTab === "googleCloud" && (_jsxs("form", { className: "flex flex-col gap-4", onSubmit: (e) => {
                                 e.preventDefault();
                                 handleGoogleCloudSave();
@@ -89,34 +84,33 @@ export default function Editor(props) {
                                             })), placeholder: "Processor ID" })] }), _jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4", children: Object.entries(googleCloud.keyFile).map(([key, value]) => (_jsxs("label", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-sm font-medium", children: key.replace(/_/g, " ") }), _jsx("input", { className: "input input-bordered rounded px-3 py-2 border border-gray-300 focus:border-blue-400 focus:ring focus:ring-blue-100 text-sm", type: "text", value: value, onChange: (e) => setGoogleCloud((v) => ({
                                                     ...v,
                                                     keyFile: { ...v.keyFile, [key]: e.target.value },
-                                                })), placeholder: key.replace(/_/g, " ") })] }, key))) }), _jsx("div", { className: "flex justify-end mt-2", children: _jsx(Button, { size: "sm", variant: "outline", color: "black", type: "submit", className: "hover:bg-gray-200", disabled: document.state.global.googleCloud?.projectId ===
+                                                })), placeholder: key.replace(/_/g, " ") })] }, key))) }), _jsx("div", { className: "flex justify-end mt-2", children: _jsx(Button, { size: "sm", variant: "outline", color: "black", type: "submit", className: "hover:bg-gray-200", disabled: state.googleCloud?.projectId ===
                                             googleCloud.projectId &&
-                                            document.state.global.googleCloud?.location ===
+                                            state.googleCloud?.location ===
                                                 googleCloud.location &&
-                                            document.state.global.googleCloud?.processorId ===
+                                            state.googleCloud?.processorId ===
                                                 googleCloud.processorId &&
-                                            document.state.global.googleCloud?.keyFile?.type ===
+                                            state.googleCloud?.keyFile?.type ===
                                                 googleCloud.keyFile.type &&
-                                            document.state.global.googleCloud?.keyFile?.project_id ===
+                                            state.googleCloud?.keyFile?.project_id ===
                                                 googleCloud.keyFile.project_id &&
-                                            document.state.global.googleCloud?.keyFile
-                                                ?.private_key_id === googleCloud.keyFile.private_key_id &&
-                                            document.state.global.googleCloud?.keyFile?.private_key ===
+                                            state.googleCloud?.keyFile?.private_key_id ===
+                                                googleCloud.keyFile.private_key_id &&
+                                            state.googleCloud?.keyFile?.private_key ===
                                                 googleCloud.keyFile.private_key &&
-                                            document.state.global.googleCloud?.keyFile?.client_email ===
+                                            state.googleCloud?.keyFile?.client_email ===
                                                 googleCloud.keyFile.client_email &&
-                                            document.state.global.googleCloud?.keyFile?.client_id ===
+                                            state.googleCloud?.keyFile?.client_id ===
                                                 googleCloud.keyFile.client_id &&
-                                            document.state.global.googleCloud?.keyFile?.auth_uri ===
+                                            state.googleCloud?.keyFile?.auth_uri ===
                                                 googleCloud.keyFile.auth_uri &&
-                                            document.state.global.googleCloud?.keyFile?.token_uri ===
+                                            state.googleCloud?.keyFile?.token_uri ===
                                                 googleCloud.keyFile.token_uri &&
-                                            document.state.global.googleCloud?.keyFile
+                                            state.googleCloud?.keyFile
                                                 ?.auth_provider_x509_cert_url ===
                                                 googleCloud.keyFile.auth_provider_x509_cert_url &&
-                                            document.state.global.googleCloud?.keyFile
-                                                ?.client_x509_cert_url ===
+                                            state.googleCloud?.keyFile?.client_x509_cert_url ===
                                                 googleCloud.keyFile.client_x509_cert_url &&
-                                            document.state.global.googleCloud?.keyFile
-                                                ?.universe_domain === googleCloud.keyFile.universe_domain, children: "Save" }) })] }))] })] }) }));
+                                            state.googleCloud?.keyFile?.universe_domain ===
+                                                googleCloud.keyFile.universe_domain, children: "Save" }) })] }))] })] }) }));
 }

package/dist/editors/invoice/editor.d.ts

@@ -1,2 +1,2 @@
-export default function Editor(props: any): import("react/jsx-runtime").JSX.Element;
+export default function Editor(props: any): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=editor.d.ts.map

package/dist/editors/invoice/editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/invoice/editor.tsx"],"names":[],"mappings":"AA6CA,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,GAAG,2CAg7BxC"}
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/invoice/editor.tsx"],"names":[],"mappings":"AA6CA,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,GAAG,kDAi7BxC"}

package/dist/editors/invoice/editor.js

@@ -23,21 +23,17 @@ import ConfirmationModal from "./components/confirmationModal.js";
 import { ClosePaymentModalContent, ConfirmPaymentModalContent, FinalRejectionModalContent, IssueInvoiceModalContent, RegisterPaymentTxModalContent, RejectInvoiceModalContent, ReportPaymentIssueModalContent, SchedulePaymentModalContent, } from "./components/statusModalComponents.js";
 import { InvoiceStateSchema } from "../../document-models/invoice/gen/schema/zod.js";
 import validateStatusBeforeContinue from "./validation/validationHandler.js";
-import { useSelectedDocument } from "@powerhousedao/reactor-browser";
+import { useDocumentById } from "@powerhousedao/reactor-browser";
 function isFiatCurrency(currency) {
     return currencyList.find((c) => c.ticker === currency)?.crypto === false;
 }
 export default function Editor(props) {
-    let dispatch;
-    const { document: doc } = props;
-    if (props?.dispatch) {
-        dispatch = props.dispatch;
+    const [doc, dispatch] = useDocumentById(props.documentId);
+    const state = doc?.state.global;
+    if (!state) {
+        console.log("Document state not found from document id", props.documentId);
+        return null;
     }
-    else {
-        const selectedDocument = useSelectedDocument();
-        dispatch = selectedDocument[1];
-    }
-    const state = doc.state.global;
     // Dynamic property check based on the actual schema
     try {
         const schema = InvoiceStateSchema();

package/dist/style.css

@@ -363,9 +363,6 @@
   .mt-8 {
     margin-top: calc(var(--spacing) * 8);
   }
-  .mr-1 {
-    margin-right: calc(var(--spacing) * 1);
-  }
   .mr-2 {
     margin-right: calc(var(--spacing) * 2);
   }
@@ -375,9 +372,6 @@
   .mb-2 {
     margin-bottom: calc(var(--spacing) * 2);
   }
-  .mb-3 {
-    margin-bottom: calc(var(--spacing) * 3);
-  }
   .mb-4 {
     margin-bottom: calc(var(--spacing) * 4);
   }
@@ -466,9 +460,6 @@
   .w-4 {
     width: calc(var(--spacing) * 4);
   }
-  .w-5 {
-    width: calc(var(--spacing) * 5);
-  }
   .w-8 {
     width: calc(var(--spacing) * 8);
   }
@@ -578,9 +569,6 @@
   .flex-nowrap {
     flex-wrap: nowrap;
   }
-  .flex-wrap {
-    flex-wrap: wrap;
-  }
   .items-center {
     align-items: center;
   }
@@ -605,13 +593,6 @@
   .gap-4 {
     gap: calc(var(--spacing) * 4);
   }
-  .space-y-1 {
-    :where(& > :not(:last-child)) {
-      --tw-space-y-reverse: 0;
-      margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
-      margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
-    }
-  }
   .space-y-2 {
     :where(& > :not(:last-child)) {
       --tw-space-y-reverse: 0;
@@ -684,10 +665,6 @@
     border-style: var(--tw-border-style);
     border-width: 1px;
   }
-  .border-2 {
-    border-style: var(--tw-border-style);
-    border-width: 2px;
-  }
   .border-t {
     border-top-style: var(--tw-border-style);
     border-top-width: 1px;
@@ -700,10 +677,6 @@
     border-bottom-style: var(--tw-border-style);
     border-bottom-width: 2px;
   }
-  .border-dashed {
-    --tw-border-style: dashed;
-    border-style: dashed;
-  }
   .border-blue-100 {
     border-color: var(--color-blue-100);
   }
@@ -915,9 +888,6 @@
   .text-blue-600 {
     color: var(--color-blue-600);
   }
-  .text-blue-800 {
-    color: var(--color-blue-800);
-  }
   .text-blue-900 {
     color: var(--color-blue-900);
   }
@@ -5604,6 +5574,95 @@ input[type="number"] {
     cursor: pointer;
   }
 }
+.ph-default-styles h1 {
+  font-family: "Inter", sans-serif;
+  font-style: normal;
+  font-weight: 600;
+  font-size: 32px;
+  line-height: 120%;
+  color: #343839;
+}
+.ph-default-styles h2 {
+  font-family: "Inter", sans-serif;
+  font-style: normal;
+  font-weight: 600;
+  font-size: 24px;
+  line-height: 120%;
+  color: #343839;
+}
+.ph-default-styles h3 {
+  font-family: "Inter", sans-serif;
+  font-style: normal;
+  font-weight: 600;
+  font-size: 20px;
+  line-height: 120%;
+  color: #343839;
+}
+.ph-default-styles p {
+  font-family: "Inter", sans-serif;
+  font-style: normal;
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 120%;
+  color: #343839;
+}
+.ph-default-styles small {
+  font-family: "Inter", sans-serif;
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 100%;
+  color: #474d4e;
+}
+.ph-default-styles input[type="text"], .ph-default-styles input[type="email"], .ph-default-styles input[type="password"], .ph-default-styles input[type="search"], .ph-default-styles input[type="tel"], .ph-default-styles input[type="url"], .ph-default-styles input[type="number"], .ph-default-styles textarea {
+  font-family: "Inter", sans-serif;
+  font-size: 0.875rem;
+  font-weight: 400;
+  line-height: 1.25rem;
+  color: #343839;
+  background-color: #ffffff;
+  border: 1px solid #ced4da;
+  border-radius: 0.375rem;
+  padding: 7px 0.75rem;
+  width: 100%;
+  box-sizing: border-box;
+  margin-bottom: 10px;
+}
+.ph-default-styles textarea {
+  min-height: 2.25rem;
+  resize: vertical;
+}
+.ph-default-styles a {
+  color: #007bff;
+  text-decoration: none;
+}
+.ph-default-styles a:hover {
+  text-decoration: underline;
+  color: #0056b3;
+}
+.ph-default-styles a:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px rgba(0, 123, 255, 0.5);
+}
+.ph-default-styles ul, .ph-default-styles ol {
+  padding-left: 0px;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.ph-default-styles label {
+  display: block;
+  font-family: "Inter", sans-serif;
+  font-weight: 500;
+  color: #343839;
+}
+.ph-default-styles hr {
+  border: 0;
+  height: 1px;
+  background-color: #ced4da;
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
 @layer base {
   * {
     scrollbar-color: initial;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@powerhousedao/contributor-billing",
   "description": "Document models that help contributors of open organisations get paid anonymously for their work on a monthly basis.",
-  "version": "0.0.91",
+  "version": "0.0.93",
   "license": "AGPL-3.0-only",
   "type": "module",
   "files": [
@@ -57,10 +57,10 @@
   },
   "dependencies": {
     "@google-cloud/documentai": "^8.12.0",
-    "@powerhousedao/builder-tools": "^5.0.0-staging.18",
-    "@powerhousedao/common": "^5.0.0-staging.18",
-    "@powerhousedao/design-system": "^5.0.0-staging.18",
-    "@powerhousedao/document-engineering": "^1.37.0",
+    "@powerhousedao/builder-tools": "^5.0.0-staging.21",
+    "@powerhousedao/common": "^5.0.0-staging.21",
+    "@powerhousedao/design-system": "^5.0.0-staging.21",
+    "@powerhousedao/document-engineering": "^1.38.0",
     "@react-pdf/renderer": "^4.3.0",
     "@safe-global/api-kit": "^3.0.1",
     "@safe-global/protocol-kit": "^6.0.3",
@@ -69,7 +69,7 @@
     "@types/cors": "^2.8.17",
     "axios": "^1.9.0",
     "cors": "^2.8.5",
-    "document-model": "^5.0.0-staging.18",
+    "document-model": "^5.0.0-staging.21",
     "dotenv": "^16.5.0",
     "error": "^10.4.0",
     "ethers": "^6.14.0",
@@ -85,19 +85,19 @@
     "@electric-sql/pglite": "^0.2.12",
     "@eslint/js": "^9.25.0",
     "@powerhousedao/analytics-engine-core": "^0.5.0",
-    "@powerhousedao/codegen": "^5.0.0-staging.18",
-    "@powerhousedao/ph-cli": "^5.0.0-staging.18",
-    "@powerhousedao/reactor-api": "^5.0.0-staging.18",
-    "@powerhousedao/reactor-browser": "^5.0.0-staging.18",
-    "@powerhousedao/reactor-local": "^5.0.0-staging.18",
+    "@powerhousedao/codegen": "^5.0.0-staging.21",
+    "@powerhousedao/ph-cli": "^5.0.0-staging.21",
+    "@powerhousedao/reactor-api": "^5.0.0-staging.21",
+    "@powerhousedao/reactor-browser": "^5.0.0-staging.21",
+    "@powerhousedao/reactor-local": "^5.0.0-staging.21",
     "@powerhousedao/scalars": "^1.33.1-staging.5",
-    "@powerhousedao/switchboard": "^5.0.0-staging.18",
+    "@powerhousedao/switchboard": "^5.0.0-staging.21",
     "@tailwindcss/cli": "^4.1.4",
     "@testing-library/react": "^16.3.0",
     "@types/node": "^22.14.1",
     "@types/react": "^18.3.20",
     "@vitejs/plugin-react": "^4.4.1",
-    "document-drive": "^5.0.0-staging.18",
+    "document-drive": "^5.0.0-staging.21",
     "eslint": "^9.25.0",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",