@powerhousedao/vetra 4.1.0-dev.8 → 4.1.0-dev.80

package/dist/editors/app-editor/index.js

@@ -0,0 +1,12 @@
+import { Editor } from "./editor.js";
+export const module = {
+    Component: Editor,
+    documentTypes: ["powerhouse/app"],
+    config: {
+        id: "app-module-editor",
+        disableExternalControls: true,
+        documentToolbarEnabled: true,
+        showSwitchboardLink: true,
+    },
+};
+export default module;

package/dist/editors/components/StatusPill.d.ts

@@ -0,0 +1,6 @@
+export interface StatusPillProps {
+    status: "draft" | "confirmed";
+    label: string;
+}
+export declare const StatusPill: React.FC<StatusPillProps>;
+//# sourceMappingURL=StatusPill.d.ts.map

package/dist/editors/components/StatusPill.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusPill.d.ts","sourceRoot":"","sources":["../../../editors/components/StatusPill.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,OAAO,GAAG,WAAW,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAYhD,CAAC"}

package/dist/editors/components/StatusPill.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const StatusPill = ({ status, label }) => {
+    return (_jsx("div", { className: `rounded-full px-3 py-1 text-xs font-medium ${status === "confirmed"
+            ? "bg-green-100 text-green-800"
+            : "bg-yellow-100 text-yellow-800"}`, children: label }));
+};

package/dist/editors/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./StatusPill.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/editors/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../editors/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}

package/dist/editors/components/index.js

@@ -0,0 +1 @@
+export * from "./StatusPill.js";

package/dist/editors/document-editor/components/DocumentEditorForm.d.ts

@@ -0,0 +1,12 @@
+import type { AddDocumentTypeInput, DocumentTypeItem, RemoveDocumentTypeInput } from "../../../document-models/document-editor/index.js";
+export interface DocumentEditorFormProps {
+    editorName?: string;
+    documentTypes?: DocumentTypeItem[];
+    status?: string;
+    onEditorNameChange?: (name: string) => void;
+    onAddDocumentType?: (input: AddDocumentTypeInput) => void;
+    onRemoveDocumentType?: (input: RemoveDocumentTypeInput) => void;
+    onConfirm?: () => void;
+}
+export declare const DocumentEditorForm: React.FC<DocumentEditorFormProps>;
+//# sourceMappingURL=DocumentEditorForm.d.ts.map

package/dist/editors/document-editor/components/DocumentEditorForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DocumentEditorForm.d.ts","sourceRoot":"","sources":["../../../../editors/document-editor/components/DocumentEditorForm.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,oBAAoB,EACpB,gBAAgB,EAChB,uBAAuB,EACxB,MAAM,mDAAmD,CAAC;AAI3D,MAAM,WAAW,uBAAuB;IACtC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACnC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC1D,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAChE,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA2JhE,CAAC"}

package/dist/editors/document-editor/components/DocumentEditorForm.js

@@ -0,0 +1,60 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { StatusPill } from "../../components/index.js";
+import { useAvailableDocumentTypes, useDebounce } from "../../hooks/index.js";
+export const DocumentEditorForm = ({ editorName: initialEditorName = "", documentTypes: initialDocumentTypes = [], status = "DRAFT", onEditorNameChange, onAddDocumentType, onRemoveDocumentType, onConfirm, }) => {
+    const [editorName, setEditorName] = useState(initialEditorName);
+    const [documentTypes, setDocumentTypes] = useState(initialDocumentTypes);
+    const [selectedDocumentType, setSelectedDocumentType] = useState("");
+    const [isConfirmed, setIsConfirmed] = useState(false);
+    // Get available document types from the hook (vetra drive only for document editor)
+    const availableDocumentTypes = useAvailableDocumentTypes(true);
+    // Use the debounce hook for name changes
+    useDebounce(editorName, onEditorNameChange, 300);
+    // Update local state when initial values change
+    useEffect(() => {
+        setEditorName(initialEditorName);
+    }, [initialEditorName]);
+    useEffect(() => {
+        setDocumentTypes(initialDocumentTypes);
+    }, [initialDocumentTypes]);
+    // Reset confirmation state if status changes back to DRAFT
+    useEffect(() => {
+        if (status === "DRAFT") {
+            setIsConfirmed(false);
+        }
+    }, [status]);
+    // Check if form should be read-only
+    const isReadOnly = isConfirmed || status === "CONFIRMED";
+    const handleConfirm = () => {
+        if (editorName.trim() && documentTypes.length > 0) {
+            setIsConfirmed(true); // Immediate UI update
+            onConfirm?.();
+        }
+    };
+    return (_jsxs("div", { className: "space-y-6 bg-white p-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h2", { className: "text-lg font-medium text-gray-900", children: "Editor Configuration" }), _jsx(StatusPill, { status: status === "CONFIRMED" ? "confirmed" : "draft", label: status === "CONFIRMED" ? "Confirmed" : "Draft" })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Editor Name" }), _jsx("input", { type: "text", value: editorName, onChange: (e) => setEditorName(e.target.value), disabled: isReadOnly, className: `w-full rounded-md border border-gray-300 px-3 py-2 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-blue-500 ${isReadOnly ? "cursor-not-allowed bg-gray-100" : ""}` })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Supported Document Types" }), _jsxs("div", { className: "space-y-2", children: [!isReadOnly && availableDocumentTypes.length > 0 && (_jsxs("select", { value: selectedDocumentType, onChange: (e) => {
+                                    const selectedValue = e.target.value;
+                                    if (selectedValue) {
+                                        // Remove existing document type if any
+                                        const existingType = documentTypes.at(0);
+                                        if (existingType) {
+                                            onRemoveDocumentType?.({ id: existingType.id });
+                                        }
+                                        // Add the new document type
+                                        const newTypeInput = {
+                                            id: Date.now().toString(), // Generate a unique ID
+                                            documentType: selectedValue,
+                                        };
+                                        const newType = {
+                                            id: newTypeInput.id,
+                                            documentType: newTypeInput.documentType,
+                                        };
+                                        setDocumentTypes([newType]); // Replace with single item array
+                                        onAddDocumentType?.(newTypeInput);
+                                    }
+                                    setSelectedDocumentType("");
+                                }, className: "w-full rounded-md border border-gray-300 px-3 py-2 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-blue-500", children: [_jsx("option", { value: "", children: "Select a document type" }), availableDocumentTypes.map((docType) => (_jsx("option", { value: docType, children: docType }, docType)))] })), _jsx("div", { className: "space-y-1", children: documentTypes.map((type) => (_jsxs("div", { className: "flex items-center py-1", children: [_jsx("span", { className: "text-sm text-gray-700", children: type.documentType }), !isReadOnly && (_jsx("button", { onClick: () => {
+                                                setDocumentTypes([]);
+                                                onRemoveDocumentType?.({ id: type.id });
+                                            }, className: "ml-2 text-gray-400 hover:text-gray-600 focus:outline-none", children: "\u00D7" }))] }, type.id))) })] })] }), !isReadOnly && (_jsx("div", { children: _jsx("button", { onClick: handleConfirm, disabled: !editorName.trim() || documentTypes.length === 0, className: "rounded-md bg-blue-600 px-4 py-2 text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:cursor-not-allowed disabled:bg-gray-300", children: "Confirm" }) }))] }));
+};

package/dist/editors/document-editor/editor.d.ts

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

package/dist/editors/document-editor/editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/document-editor/editor.tsx"],"names":[],"mappings":"AASA,wBAAgB,MAAM,4CA4CrB"}

package/dist/editors/document-editor/editor.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback } from "react";
+import { actions } from "../../document-models/document-editor/index.js";
+import { useSelectedDocumentEditorDocument } from "../hooks/useVetraDocument.js";
+import { DocumentEditorForm } from "./components/DocumentEditorForm.js";
+export function Editor() {
+    const [document, dispatch] = useSelectedDocumentEditorDocument();
+    const onEditorNameChange = useCallback((name) => {
+        if (!document.state.global.name && !name)
+            return;
+        if (name === document.state.global.name)
+            return;
+        dispatch(actions.setEditorName({ name }));
+    }, [document.state.global.name, dispatch]);
+    const onAddDocumentType = useCallback((input) => {
+        dispatch(actions.addDocumentType(input));
+    }, [dispatch]);
+    const onRemoveDocumentType = useCallback((input) => {
+        dispatch(actions.removeDocumentType(input));
+    }, [dispatch]);
+    const onConfirm = useCallback(() => {
+        dispatch(actions.setEditorStatus({ status: "CONFIRMED" }));
+    }, [dispatch]);
+    return (_jsx("div", { children: _jsx(DocumentEditorForm, { status: document.state.global.status, editorName: document.state.global.name ?? "", documentTypes: document.state.global.documentTypes, onEditorNameChange: onEditorNameChange, onAddDocumentType: onAddDocumentType, onRemoveDocumentType: onRemoveDocumentType, onConfirm: onConfirm }) }));
+}

package/dist/editors/document-editor/index.d.ts

@@ -0,0 +1,4 @@
+import type { EditorModule } from "document-model";
+export declare const module: EditorModule;
+export default module;
+//# sourceMappingURL=index.d.ts.map

package/dist/editors/document-editor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../editors/document-editor/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAGnD,eAAO,MAAM,MAAM,EAAE,YASpB,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/editors/document-editor/index.js

@@ -0,0 +1,12 @@
+import { Editor } from "./editor.js";
+export const module = {
+    Component: Editor,
+    documentTypes: ["powerhouse/document-editor"],
+    config: {
+        id: "document-editor-editor",
+        disableExternalControls: true,
+        documentToolbarEnabled: true,
+        showSwitchboardLink: true,
+    },
+};
+export default module;

package/dist/editors/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export { useAvailableDocumentTypes } from "./useAvailableDocumentTypes.js";
+export { useDebounce } from "./useDebounce.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/editors/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../editors/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/editors/hooks/index.js

@@ -0,0 +1,2 @@
+export { useAvailableDocumentTypes } from "./useAvailableDocumentTypes.js";
+export { useDebounce } from "./useDebounce.js";

package/dist/editors/hooks/useAvailableDocumentTypes.d.ts

@@ -0,0 +1,2 @@
+export declare function useAvailableDocumentTypes(onlyVetraDocuments?: boolean): string[];
+//# sourceMappingURL=useAvailableDocumentTypes.d.ts.map

package/dist/editors/hooks/useAvailableDocumentTypes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAvailableDocumentTypes.d.ts","sourceRoot":"","sources":["../../../editors/hooks/useAvailableDocumentTypes.ts"],"names":[],"mappings":"AAMA,wBAAgB,yBAAyB,CACvC,kBAAkB,UAAQ,GACzB,MAAM,EAAE,CA8CV"}

package/dist/editors/hooks/useAvailableDocumentTypes.js

@@ -0,0 +1,37 @@
+import { useReactor, useSelectedDriveId } from "@powerhousedao/reactor-browser";
+import { useEffect, useState } from "react";
+const DEFAULT_DRIVE_ID = "vetra";
+export function useAvailableDocumentTypes(onlyVetraDocuments = false) {
+    const [availableDocumentTypes, setAvailableDocumentTypes] = useState([]);
+    const reactor = useReactor();
+    const selectedDriveId = useSelectedDriveId();
+    useEffect(() => {
+        async function loadDocumentTypes() {
+            const moduleDocIds = [];
+            // Get from reactor document model modules (if not onlyVetraDocuments)
+            if (!onlyVetraDocuments) {
+                const docModels = reactor?.getDocumentModelModules() ?? [];
+                moduleDocIds.push(...docModels.map((model) => model.documentModel.global.id));
+            }
+            // Get from vetra drive
+            const driveDocIds = [];
+            const driveDocs = await reactor?.getDocuments(selectedDriveId ?? DEFAULT_DRIVE_ID);
+            if (driveDocs) {
+                for (const docId of driveDocs) {
+                    const document = await reactor?.getDocument(docId);
+                    if (document?.header.documentType === "powerhouse/document-model") {
+                        const documentModel = document;
+                        driveDocIds.push(documentModel.state.global.id);
+                    }
+                }
+            }
+            // Combine and deduplicate (or just use driveDocIds if onlyVetraDocuments)
+            const uniqueIds = onlyVetraDocuments
+                ? driveDocIds
+                : [...new Set([...moduleDocIds, ...driveDocIds])];
+            setAvailableDocumentTypes(uniqueIds);
+        }
+        void loadDocumentTypes();
+    }, [reactor, selectedDriveId, onlyVetraDocuments]);
+    return availableDocumentTypes;
+}

package/dist/editors/hooks/useDebounce.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Reusable debounce hook that calls a callback function after a specified delay
+ * when the value changes. Useful for API calls, search inputs, etc.
+ *
+ * @param value - The value to debounce
+ * @param callback - Function to call with the debounced value (optional)
+ * @param delay - Delay in milliseconds
+ */
+export declare function useDebounce<T>(value: T, callback: ((value: T) => void) | undefined, delay: number): void;
+//# sourceMappingURL=useDebounce.d.ts.map

package/dist/editors/hooks/useDebounce.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebounce.d.ts","sourceRoot":"","sources":["../../../editors/hooks/useDebounce.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAC3B,KAAK,EAAE,CAAC,EACR,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,EAC1C,KAAK,EAAE,MAAM,QAWd"}

package/dist/editors/hooks/useDebounce.js

@@ -0,0 +1,19 @@
+import { useEffect } from "react";
+/**
+ * Reusable debounce hook that calls a callback function after a specified delay
+ * when the value changes. Useful for API calls, search inputs, etc.
+ *
+ * @param value - The value to debounce
+ * @param callback - Function to call with the debounced value (optional)
+ * @param delay - Delay in milliseconds
+ */
+export function useDebounce(value, callback, delay) {
+    useEffect(() => {
+        if (!callback)
+            return;
+        const timer = setTimeout(() => {
+            callback(value);
+        }, delay);
+        return () => clearTimeout(timer);
+    }, [value, callback, delay]);
+}

package/dist/editors/hooks/useVetraDocument.d.ts

@@ -0,0 +1,17 @@
+import type { AppModuleAction, AppModuleDocument } from "../../document-models/app-module/index.js";
+import { type DocumentEditorDocument } from "../../document-models/document-editor/index.js";
+import type { ProcessorModuleDocument } from "../../document-models/processor-module/index.js";
+import type { SubgraphModuleDocument } from "../../document-models/subgraph-module/index.js";
+import type { VetraPackageDocument } from "../../document-models/vetra-package/index.js";
+export declare function useAppModuleDocument(documentId: string | undefined | null): never[] | [AppModuleDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<AppModuleAction>];
+export declare function useSelectedAppModuleDocument(): never[] | [AppModuleDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<AppModuleAction>];
+export declare function useDocumentEditorDocument(documentId: string | undefined | null): never[] | [DocumentEditorDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<import("../../document-models/document-editor/gen/actions.js").DocumentEditorBaseOperationsAction>];
+export declare function useSelectedDocumentEditorDocument(): never[] | [DocumentEditorDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<import("../../document-models/document-editor/gen/actions.js").DocumentEditorBaseOperationsAction>];
+export declare function useProcessorModuleDocument(documentId: string | undefined | null): never[] | [ProcessorModuleDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<import("../../document-models/processor-module/gen/actions.js").ProcessorModuleBaseOperationsAction>];
+export declare function useSelectedProcessorModuleDocument(): never[] | [ProcessorModuleDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<import("../../document-models/processor-module/gen/actions.js").ProcessorModuleBaseOperationsAction>];
+export declare function useSubgraphModuleDocument(documentId: string | undefined | null): never[] | [SubgraphModuleDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<import("../../document-models/subgraph-module/gen/actions.js").SubgraphModuleBaseOperationsAction>];
+export declare function useSelectedSubgraphModuleDocument(): never[] | [SubgraphModuleDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<import("../../document-models/subgraph-module/gen/actions.js").SubgraphModuleBaseOperationsAction>];
+export declare function useVetraPackageDocument(documentId: string | undefined | null): never[] | [VetraPackageDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<import("../../document-models/vetra-package/gen/actions.js").VetraPackageBaseOperationsAction>];
+export declare function useSelectedVetraPackageDocument(): [VetraPackageDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<import("../../document-models/vetra-package/gen/actions.js").VetraPackageBaseOperationsAction>];
+export declare function useSelectedDriveVetraPackage(): never[] | [VetraPackageDocument, import("@powerhousedao/reactor-browser").DocumentDispatch<import("../../document-models/vetra-package/gen/actions.js").VetraPackageBaseOperationsAction>];
+//# sourceMappingURL=useVetraDocument.d.ts.map

package/dist/editors/hooks/useVetraDocument.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useVetraDocument.d.ts","sourceRoot":"","sources":["../../../editors/hooks/useVetraDocument.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EACV,eAAe,EACf,iBAAiB,EAClB,MAAM,2CAA2C,CAAC;AACnD,OAAO,EAEL,KAAK,sBAAsB,EAC5B,MAAM,gDAAgD,CAAC;AACxD,OAAO,KAAK,EAEV,uBAAuB,EACxB,MAAM,iDAAiD,CAAC;AACzD,OAAO,KAAK,EAEV,sBAAsB,EACvB,MAAM,gDAAgD,CAAC;AACxD,OAAO,KAAK,EAEV,oBAAoB,EACrB,MAAM,8CAA8C,CAAC;AAOtD,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,6GAKzE;AAED,wBAAgB,4BAA4B,8GAG3C;AAED,wBAAgB,yBAAyB,CACvC,UAAU,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,oMAMtC;AAED,wBAAgB,iCAAiC,qMAGhD;AAED,wBAAgB,0BAA0B,CACxC,UAAU,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,uMAMtC;AAED,wBAAgB,kCAAkC,wMAGjD;AAED,wBAAgB,yBAAyB,CACvC,UAAU,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,oMAMtC;AAED,wBAAgB,iCAAiC,qMAGhD;AAED,wBAAgB,uBAAuB,CAAC,UAAU,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,8LAK5E;AAED,wBAAgB,+BAA+B,qLAI9C;AAED,wBAAgB,4BAA4B,+LAQ3C"}

package/dist/editors/hooks/useVetraDocument.js

@@ -0,0 +1,46 @@
+import { useDocumentOfType, useSelectedDocumentId, useSelectedDocumentOfType, useSelectedDrive, } from "@powerhousedao/reactor-browser";
+import { isFileNode } from "document-drive";
+import {} from "../../document-models/document-editor/index.js";
+const VETRA_PACKAGE_DOCUMENT_TYPE = "powerhouse/package";
+const DOCUMENT_EDITOR_DOCUMENT_TYPE = "powerhouse/document-editor";
+const SUBGRAPH_MODULE_DOCUMENT_TYPE = "powerhouse/subgraph";
+const PROCESSOR_MODULE_DOCUMENT_TYPE = "powerhouse/processor";
+export function useAppModuleDocument(documentId) {
+    return useDocumentOfType(documentId, "powerhouse/app");
+}
+export function useSelectedAppModuleDocument() {
+    const documentId = useSelectedDocumentId();
+    return useAppModuleDocument(documentId);
+}
+export function useDocumentEditorDocument(documentId) {
+    return useDocumentOfType(documentId, DOCUMENT_EDITOR_DOCUMENT_TYPE);
+}
+export function useSelectedDocumentEditorDocument() {
+    const documentId = useSelectedDocumentId();
+    return useDocumentEditorDocument(documentId);
+}
+export function useProcessorModuleDocument(documentId) {
+    return useDocumentOfType(documentId, PROCESSOR_MODULE_DOCUMENT_TYPE);
+}
+export function useSelectedProcessorModuleDocument() {
+    const documentId = useSelectedDocumentId();
+    return useProcessorModuleDocument(documentId);
+}
+export function useSubgraphModuleDocument(documentId) {
+    return useDocumentOfType(documentId, SUBGRAPH_MODULE_DOCUMENT_TYPE);
+}
+export function useSelectedSubgraphModuleDocument() {
+    const documentId = useSelectedDocumentId();
+    return useSubgraphModuleDocument(documentId);
+}
+export function useVetraPackageDocument(documentId) {
+    return useDocumentOfType(documentId, VETRA_PACKAGE_DOCUMENT_TYPE);
+}
+export function useSelectedVetraPackageDocument() {
+    return useSelectedDocumentOfType(VETRA_PACKAGE_DOCUMENT_TYPE);
+}
+export function useSelectedDriveVetraPackage() {
+    const [selectedDrive] = useSelectedDrive();
+    const documentId = selectedDrive.state.global.nodes.find((node) => isFileNode(node) && node.documentType === VETRA_PACKAGE_DOCUMENT_TYPE)?.id;
+    return useVetraPackageDocument(documentId);
+}

package/dist/editors/index.d.ts

@@ -1,2 +1,7 @@
-export {};
+export { module as AppEditor } from "./app-editor/index.js";
+export { module as DocumentEditor } from "./document-editor/index.js";
+export { module as ProcessorEditor } from "./processor-editor/index.js";
+export { module as SubgraphEditor } from "./subgraph-editor/index.js";
+export { module as VetraDriveApp } from "./vetra-drive-app/index.js";
+export { module as VetraPackage } from "./vetra-package/index.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/editors/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../editors/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../editors/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,6BAA6B,CAAC;AACxE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACrE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,0BAA0B,CAAC"}

package/dist/editors/index.js

@@ -1,2 +1,6 @@
-export {};
-//# sourceMappingURL=index.js.map
+export { module as AppEditor } from "./app-editor/index.js";
+export { module as DocumentEditor } from "./document-editor/index.js";
+export { module as ProcessorEditor } from "./processor-editor/index.js";
+export { module as SubgraphEditor } from "./subgraph-editor/index.js";
+export { module as VetraDriveApp } from "./vetra-drive-app/index.js";
+export { module as VetraPackage } from "./vetra-package/index.js";

package/dist/editors/processor-editor/components/ProcessorEditorForm.d.ts

@@ -0,0 +1,14 @@
+import type { DocumentTypeItem } from "../../../document-models/processor-module/index.js";
+export interface ProcessorEditorFormProps {
+    processorName?: string;
+    processorType?: string;
+    documentTypes?: DocumentTypeItem[];
+    status?: string;
+    onNameChange?: (name: string) => void;
+    onTypeChange?: (type: string) => void;
+    onAddDocumentType?: (id: string, documentType: string) => void;
+    onRemoveDocumentType?: (id: string) => void;
+    onConfirm?: () => void;
+}
+export declare const ProcessorEditorForm: React.FC<ProcessorEditorFormProps>;
+//# sourceMappingURL=ProcessorEditorForm.d.ts.map

package/dist/editors/processor-editor/components/ProcessorEditorForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProcessorEditorForm.d.ts","sourceRoot":"","sources":["../../../../editors/processor-editor/components/ProcessorEditorForm.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oDAAoD,CAAC;AAI3F,MAAM,WAAW,wBAAwB;IACvC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACnC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,iBAAiB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/D,oBAAoB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAyLlE,CAAC"}

package/dist/editors/processor-editor/components/ProcessorEditorForm.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { StatusPill } from "../../components/index.js";
+import { useAvailableDocumentTypes, useDebounce } from "../../hooks/index.js";
+export const ProcessorEditorForm = ({ processorName: initialProcessorName = "", processorType: initialProcessorType = "", documentTypes: initialDocumentTypes = [], status = "DRAFT", onNameChange, onTypeChange, onAddDocumentType, onRemoveDocumentType, onConfirm, }) => {
+    const [processorName, setProcessorName] = useState(initialProcessorName);
+    const [processorType, setProcessorType] = useState(initialProcessorType);
+    const [documentTypes, setDocumentTypes] = useState(initialDocumentTypes);
+    const [selectedDocumentType, setSelectedDocumentType] = useState("");
+    const [isConfirmed, setIsConfirmed] = useState(false);
+    // Get available document types from the hook (combines reactor and vetra drive)
+    const availableDocumentTypes = useAvailableDocumentTypes();
+    // Use the debounce hook for name and type changes
+    useDebounce(processorName, onNameChange, 300);
+    useDebounce(processorType, onTypeChange, 300);
+    // Update local state when initial values change
+    useEffect(() => {
+        setProcessorName(initialProcessorName);
+    }, [initialProcessorName]);
+    useEffect(() => {
+        setProcessorType(initialProcessorType);
+    }, [initialProcessorType]);
+    useEffect(() => {
+        setDocumentTypes(initialDocumentTypes);
+    }, [initialDocumentTypes]);
+    // Reset confirmation state if status changes back to DRAFT
+    useEffect(() => {
+        if (status === "DRAFT") {
+            setIsConfirmed(false);
+        }
+    }, [status]);
+    // Check if form should be read-only
+    const isReadOnly = isConfirmed || status === "CONFIRMED";
+    const handleConfirm = () => {
+        if (processorName.trim() && processorType && documentTypes.length > 0) {
+            setIsConfirmed(true); // Immediate UI update
+            onConfirm?.();
+        }
+    };
+    const handleRemoveDocumentType = (id) => {
+        setDocumentTypes(documentTypes.filter((dt) => dt.id !== id));
+        onRemoveDocumentType?.(id);
+    };
+    const canConfirm = processorName.trim() && processorType && documentTypes.length > 0;
+    return (_jsxs("div", { className: "space-y-6 bg-white p-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h2", { className: "text-lg font-medium text-gray-900", children: "Processor Configuration" }), _jsx(StatusPill, { status: status === "CONFIRMED" ? "confirmed" : "draft", label: status === "CONFIRMED" ? "Confirmed" : "Draft" })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Processor Name" }), _jsx("input", { type: "text", value: processorName, onChange: (e) => setProcessorName(e.target.value), disabled: isReadOnly, className: `w-full rounded-md border border-gray-300 px-3 py-2 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-blue-500 ${isReadOnly ? "cursor-not-allowed bg-gray-100" : ""}`, placeholder: "Enter processor name" })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Type" }), _jsxs("select", { value: processorType, onChange: (e) => setProcessorType(e.target.value), disabled: isReadOnly, className: `w-full rounded-md border border-gray-300 px-3 py-2 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-blue-500 ${isReadOnly ? "cursor-not-allowed bg-gray-100" : ""}`, children: [_jsx("option", { value: "", children: "Select type..." }), _jsx("option", { value: "analytics", children: "Analytics" }), _jsx("option", { value: "relational", children: "Relational Database" })] })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Document Types" }), _jsxs("div", { className: "space-y-2", children: [!isReadOnly && availableDocumentTypes.length > 0 && (_jsxs("select", { value: selectedDocumentType, onChange: (e) => {
+                                    const selectedValue = e.target.value;
+                                    if (selectedValue &&
+                                        !documentTypes.some((dt) => dt.documentType === selectedValue)) {
+                                        const id = Date.now().toString();
+                                        const newType = {
+                                            id,
+                                            documentType: selectedValue,
+                                        };
+                                        setDocumentTypes([...documentTypes, newType]);
+                                        onAddDocumentType?.(id, selectedValue);
+                                    }
+                                    setSelectedDocumentType("");
+                                }, className: "w-full rounded-md border border-gray-300 px-3 py-2 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-blue-500", children: [_jsx("option", { value: "", children: "Select a document type to add" }), availableDocumentTypes
+                                        .filter((docType) => !documentTypes.some((dt) => dt.documentType === docType))
+                                        .map((docType) => (_jsx("option", { value: docType, children: docType }, docType)))] })), _jsx("div", { className: "space-y-1", children: documentTypes.map((type) => (_jsxs("div", { className: "flex items-center py-1", children: [_jsx("span", { className: "text-sm text-gray-700", children: type.documentType }), !isReadOnly && (_jsx("button", { onClick: () => handleRemoveDocumentType(type.id), className: "ml-2 text-gray-400 hover:text-gray-600 focus:outline-none", children: "\u00D7" }))] }, type.id))) })] })] }), !isReadOnly && (_jsx("div", { children: _jsx("button", { onClick: handleConfirm, disabled: !canConfirm, className: "rounded-md bg-blue-600 px-4 py-2 text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:cursor-not-allowed disabled:bg-gray-300", children: "Confirm" }) }))] }));
+};

package/dist/editors/processor-editor/editor.d.ts

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

package/dist/editors/processor-editor/editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/processor-editor/editor.tsx"],"names":[],"mappings":"AAKA,wBAAgB,MAAM,4CAqDrB"}

package/dist/editors/processor-editor/editor.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback } from "react";
+import { actions } from "../../document-models/processor-module/index.js";
+import { useSelectedProcessorModuleDocument } from "../hooks/useVetraDocument.js";
+import { ProcessorEditorForm } from "./components/ProcessorEditorForm.js";
+export function Editor() {
+    const [document, dispatch] = useSelectedProcessorModuleDocument();
+    const onConfirm = useCallback(() => {
+        // Dispatch all actions at once
+        dispatch([actions.setProcessorStatus({ status: "CONFIRMED" })]);
+    }, [dispatch]);
+    const onNameChange = useCallback((name) => {
+        if (name === document.state.global.name)
+            return;
+        dispatch(actions.setProcessorName({ name }));
+    }, [document.state.global.name, dispatch]);
+    const onTypeChange = useCallback((type) => {
+        if (type === document.state.global.type)
+            return;
+        dispatch(actions.setProcessorType({ type }));
+    }, [document.state.global.type, dispatch]);
+    const onAddDocumentType = useCallback((id, documentType) => {
+        dispatch(actions.addDocumentType({ id, documentType }));
+    }, [dispatch]);
+    const onRemoveDocumentType = useCallback((id) => {
+        dispatch(actions.removeDocumentType({ id }));
+    }, [dispatch]);
+    return (_jsx("div", { children: _jsx(ProcessorEditorForm, { onNameChange: onNameChange, onTypeChange: onTypeChange, onAddDocumentType: onAddDocumentType, onRemoveDocumentType: onRemoveDocumentType, status: document.state.global.status, processorName: document.state.global.name ?? "", processorType: document.state.global.type ?? "", documentTypes: document.state.global.documentTypes ?? [], onConfirm: onConfirm }) }));
+}

package/dist/editors/processor-editor/index.d.ts

@@ -0,0 +1,4 @@
+import type { EditorModule } from "document-model";
+export declare const module: EditorModule;
+export default module;
+//# sourceMappingURL=index.d.ts.map

package/dist/editors/processor-editor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../editors/processor-editor/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAGnD,eAAO,MAAM,MAAM,EAAE,YASpB,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/editors/processor-editor/index.js

@@ -0,0 +1,12 @@
+import { Editor } from "./editor.js";
+export const module = {
+    Component: Editor,
+    documentTypes: ["powerhouse/processor"],
+    config: {
+        id: "processor-module-editor",
+        disableExternalControls: true,
+        documentToolbarEnabled: true,
+        showSwitchboardLink: true,
+    },
+};
+export default module;

package/dist/editors/subgraph-editor/components/SubgraphEditorForm.d.ts

@@ -0,0 +1,8 @@
+export interface SubgraphEditorFormProps {
+    subgraphName?: string;
+    status?: string;
+    onNameChange?: (name: string) => void;
+    onConfirm?: () => void;
+}
+export declare const SubgraphEditorForm: React.FC<SubgraphEditorFormProps>;
+//# sourceMappingURL=SubgraphEditorForm.d.ts.map

package/dist/editors/subgraph-editor/components/SubgraphEditorForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SubgraphEditorForm.d.ts","sourceRoot":"","sources":["../../../../editors/subgraph-editor/components/SubgraphEditorForm.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,uBAAuB;IACtC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA6EhE,CAAC"}

package/dist/editors/subgraph-editor/components/SubgraphEditorForm.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { useDebounce } from "../../hooks/index.js";
+import { StatusPill } from "../../components/index.js";
+export const SubgraphEditorForm = ({ subgraphName: initialSubgraphName = "", status = "DRAFT", onNameChange, onConfirm, }) => {
+    const [subgraphName, setSubgraphName] = useState(initialSubgraphName);
+    const [isConfirmed, setIsConfirmed] = useState(false);
+    // Use the debounce hook for name changes
+    useDebounce(subgraphName, onNameChange, 300);
+    // Update local state when initialSubgraphName changes
+    useEffect(() => {
+        setSubgraphName(initialSubgraphName);
+    }, [initialSubgraphName]);
+    // Reset confirmation state if status changes back to DRAFT
+    useEffect(() => {
+        if (status === "DRAFT") {
+            setIsConfirmed(false);
+        }
+    }, [status]);
+    // Check if form should be read-only
+    const isReadOnly = isConfirmed || status === "CONFIRMED";
+    const handleConfirm = () => {
+        if (subgraphName.trim()) {
+            setIsConfirmed(true); // Immediate UI update
+            onConfirm?.();
+        }
+    };
+    return (_jsxs("div", { className: "space-y-6 bg-white p-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h2", { className: "text-lg font-medium text-gray-900", children: "Subgraph Configuration" }), _jsx(StatusPill, { status: status === "CONFIRMED" ? "confirmed" : "draft", label: status === "CONFIRMED" ? "Confirmed" : "Draft" })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Subgraph Name" }), _jsx("input", { type: "text", value: subgraphName, onChange: (e) => setSubgraphName(e.target.value), disabled: isReadOnly, className: `w-full rounded-md border border-gray-300 px-3 py-2 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-blue-500 ${isReadOnly ? "cursor-not-allowed bg-gray-100" : ""}`, placeholder: "Enter subgraph name" })] }), !isReadOnly && (_jsx("div", { children: _jsx("button", { onClick: handleConfirm, disabled: !subgraphName.trim(), className: "rounded-md bg-blue-600 px-4 py-2 text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:cursor-not-allowed disabled:bg-gray-300", children: "Confirm" }) }))] }));
+};

package/dist/editors/subgraph-editor/editor.d.ts

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

package/dist/editors/subgraph-editor/editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/subgraph-editor/editor.tsx"],"names":[],"mappings":"AAKA,wBAAgB,MAAM,4CAyBrB"}

package/dist/editors/subgraph-editor/editor.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback } from "react";
+import { actions } from "../../document-models/subgraph-module/index.js";
+import { useSelectedSubgraphModuleDocument } from "../hooks/useVetraDocument.js";
+import { SubgraphEditorForm } from "./components/SubgraphEditorForm.js";
+export function Editor() {
+    const [document, dispatch] = useSelectedSubgraphModuleDocument();
+    const onNameChange = useCallback((name) => {
+        if (name === document.state.global.name)
+            return;
+        dispatch(actions.setSubgraphName({ name }));
+    }, [document.state.global.name, dispatch]);
+    const onConfirm = useCallback(() => {
+        dispatch(actions.setSubgraphStatus({ status: "CONFIRMED" }));
+    }, [dispatch]);
+    return (_jsx("div", { children: _jsx(SubgraphEditorForm, { subgraphName: document.state.global.name ?? "", status: document.state.global.status, onNameChange: onNameChange, onConfirm: onConfirm }) }));
+}

package/dist/editors/subgraph-editor/index.d.ts

@@ -0,0 +1,4 @@
+import type { EditorModule } from "document-model";
+export declare const module: EditorModule;
+export default module;
+//# sourceMappingURL=index.d.ts.map

package/dist/editors/subgraph-editor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../editors/subgraph-editor/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAGnD,eAAO,MAAM,MAAM,EAAE,YASpB,CAAC;AAEF,eAAe,MAAM,CAAC"}