@powerhousedao/vetra 6.1.0-dev.13 → 6.1.0-dev.15

package/dist/editor-Dw-NohMb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor-Dw-NohMb.js","names":[],"sources":["../editors/processor-editor/components/ProcessorEditorForm.tsx","../editors/processor-editor/config.ts","../editors/processor-editor/editor.tsx"],"sourcesContent":["import {\n  PROCESSOR_APPS,\n  type ProcessorApp,\n  type ProcessorApps,\n} from \"@powerhousedao/shared/processors\";\nimport { useEffect, useState } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport type { DocumentTypeItem } from \"../../../document-models/processor-module/index.js\";\nimport { StatusPill } from \"../../components/index.js\";\nimport { useAvailableDocumentTypes, useDebounce } from \"../../hooks/index.js\";\n\nexport interface ProcessorEditorFormProps {\n  processorName?: string;\n  processorType?: string;\n  documentTypes?: DocumentTypeItem[];\n  processorApps?: ProcessorApps;\n  status?: string;\n  onNameChange?: (name: string) => void;\n  onTypeChange?: (type: string) => void;\n  onAddDocumentType?: (id: string, documentType: string) => void;\n  onRemoveDocumentType?: (id: string) => void;\n  onAddProcessorApp?: (processorApp: ProcessorApp) => void;\n  onRemoveProcessorApp?: (processorApp: ProcessorApp) => void;\n  onConfirm?: () => void;\n}\n\nexport const ProcessorEditorForm: React.FC<ProcessorEditorFormProps> = ({\n  processorName: initialProcessorName = \"\",\n  processorType: initialProcessorType = \"\",\n  documentTypes: initialDocumentTypes = [],\n  processorApps: initialProcessorApps = [],\n  status = \"DRAFT\",\n  onNameChange,\n  onTypeChange,\n  onAddDocumentType,\n  onRemoveDocumentType,\n  onAddProcessorApp,\n  onRemoveProcessorApp,\n  onConfirm,\n}) => {\n  const [processorName, setProcessorName] = useState(initialProcessorName);\n  const [processorType, setProcessorType] = useState(initialProcessorType);\n  const [documentTypes, setDocumentTypes] =\n    useState<DocumentTypeItem[]>(initialDocumentTypes);\n  const [selectedDocumentType, setSelectedDocumentType] = useState(\"\");\n  const [processorApps, setProcessorApps] = useState(initialProcessorApps);\n  const [isConfirmed, setIsConfirmed] = useState(false);\n\n  // Get available document types from the hook (combines reactor and vetra drive)\n  const availableDocumentTypes = useAvailableDocumentTypes();\n\n  // Use the debounce hook for name and type changes\n  useDebounce(processorName, onNameChange, 300);\n  useDebounce(processorType, onTypeChange, 300);\n\n  // Update local state when initial values change\n  useEffect(() => {\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setProcessorName(initialProcessorName);\n  }, [initialProcessorName]);\n\n  useEffect(() => {\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setProcessorType(initialProcessorType);\n  }, [initialProcessorType]);\n\n  useEffect(() => {\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setDocumentTypes(initialDocumentTypes);\n  }, [initialDocumentTypes]);\n\n  useEffect(() => {\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setProcessorApps(initialProcessorApps);\n  }, [initialProcessorApps]);\n\n  // Reset confirmation state if status changes back to DRAFT\n  useEffect(() => {\n    if (status === \"DRAFT\") {\n      // eslint-disable-next-line react-hooks/set-state-in-effect\n      setIsConfirmed(false);\n    }\n  }, [status]);\n\n  // Check if form should be read-only\n  const isReadOnly = isConfirmed || status === \"CONFIRMED\";\n\n  const handleConfirm = () => {\n    if (\n      processorName.trim() &&\n      processorType &&\n      documentTypes.length > 0 &&\n      processorApps.length > 0\n    ) {\n      setIsConfirmed(true); // Immediate UI update\n      onConfirm?.();\n    }\n  };\n\n  const handleRemoveDocumentType = (id: string) => {\n    setDocumentTypes(documentTypes.filter((dt) => dt.id !== id));\n    onRemoveDocumentType?.(id);\n  };\n\n  const canConfirm =\n    !!processorName.trim() &&\n    !!processorType &&\n    documentTypes.length > 0 &&\n    processorApps.length > 0;\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <h2 className=\"text-lg font-medium text-gray-900 dark:text-slate-50\">\n          Processor Configuration\n        </h2>\n        <StatusPill\n          status={status === \"CONFIRMED\" ? \"confirmed\" : \"draft\"}\n          label={status === \"CONFIRMED\" ? \"Confirmed\" : \"Draft\"}\n        />\n      </div>\n\n      {/* Processor Name Field */}\n      <div>\n        <label\n          htmlFor=\"processor-name\"\n          className=\"mb-2 block text-sm font-medium text-gray-700 dark:text-slate-200\"\n        >\n          Processor Name\n        </label>\n        <input\n          id=\"processor-name\"\n          type=\"text\"\n          value={processorName}\n          onChange={(e) => setProcessorName(e.target.value)}\n          disabled={isReadOnly}\n          className={twMerge(\n            \"w-full rounded-md border border-gray-300 px-3 py-2 placeholder:text-gray-700 focus:border-transparent focus:ring-2 focus:ring-blue-500 focus:outline-none dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100 dark:placeholder:text-slate-200\",\n            isReadOnly\n              ? \"cursor-not-allowed bg-gray-100 dark:bg-slate-700\"\n              : \"\",\n          )}\n          placeholder=\"Enter processor name\"\n        />\n      </div>\n\n      {/* Processor Type Dropdown */}\n      <div>\n        <label\n          htmlFor=\"processor-type\"\n          className=\"mb-2 block text-sm font-medium text-gray-700 dark:text-slate-200\"\n        >\n          Type\n        </label>\n        <select\n          id=\"processor-type\"\n          value={processorType}\n          onChange={(e) => setProcessorType(e.target.value)}\n          disabled={isReadOnly}\n          className={twMerge(\n            \"w-full rounded-md border border-gray-300 px-3 py-2 text-gray-900 focus:border-transparent focus:ring-2 focus:ring-blue-500 focus:outline-none dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100\",\n            isReadOnly\n              ? \"cursor-not-allowed bg-gray-100 dark:bg-slate-700\"\n              : \"\",\n          )}\n        >\n          <option value=\"\">Select type...</option>\n          <option value=\"analytics\">Analytics</option>\n          <option value=\"relational\">Relational Database</option>\n        </select>\n      </div>\n\n      {/* Document Types Field */}\n      <div>\n        <label\n          htmlFor=\"document-types\"\n          className=\"mb-2 block text-sm font-medium text-gray-700 dark:text-slate-200\"\n        >\n          Document Types\n        </label>\n        <div className=\"space-y-2\">\n          {!isReadOnly && availableDocumentTypes.length > 0 && (\n            <select\n              id=\"document-types\"\n              value={selectedDocumentType}\n              onChange={(e) => {\n                const selectedValue = e.target.value;\n                if (\n                  selectedValue &&\n                  !documentTypes.some((dt) => dt.documentType === selectedValue)\n                ) {\n                  const id = Date.now().toString();\n                  const newType: DocumentTypeItem = {\n                    id,\n                    documentType: selectedValue,\n                  };\n                  setDocumentTypes([...documentTypes, newType]);\n                  onAddDocumentType?.(id, selectedValue);\n                }\n                setSelectedDocumentType(\"\");\n              }}\n              className=\"w-full rounded-md border border-gray-300 px-3 py-2 text-gray-900 focus:border-transparent focus:ring-2 focus:ring-blue-500 focus:outline-none dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100\"\n            >\n              <option value=\"\">Select a document type to add</option>\n              {availableDocumentTypes\n                .filter(\n                  (docType) =>\n                    !documentTypes.some((dt) => dt.documentType === docType),\n                )\n                .map((docType) => (\n                  <option key={docType} value={docType}>\n                    {docType}\n                  </option>\n                ))}\n            </select>\n          )}\n          <div className=\"space-y-1\">\n            {documentTypes.map((type) => (\n              <div key={type.id} className=\"flex items-center py-1\">\n                <span className=\"text-sm text-gray-700 dark:text-slate-200\">\n                  {type.documentType}\n                </span>\n                {!isReadOnly && (\n                  <button\n                    onClick={() => handleRemoveDocumentType(type.id)}\n                    className=\"ml-2 text-gray-400 hover:text-gray-600 focus:outline-none dark:text-slate-500 dark:hover:text-slate-300\"\n                  >\n                    ×\n                  </button>\n                )}\n              </div>\n            ))}\n          </div>\n        </div>\n      </div>\n      {/* Processor Apps Field */}\n      <div>\n        <label\n          htmlFor=\"processor-apps\"\n          className=\"mb-2 block text-sm font-medium text-gray-700 dark:text-slate-200\"\n        >\n          Processor Apps\n        </label>\n        <div className=\"space-y-2\">\n          {!isReadOnly && (\n            <>\n              {PROCESSOR_APPS.map((processorApp) => (\n                <div key={processorApp} className=\"flex gap-1\">\n                  <input\n                    type=\"checkbox\"\n                    name={processorApp}\n                    id={processorApp}\n                    checked={processorApps.includes(processorApp)}\n                    onChange={(event) => {\n                      const isChecked = event.target.checked;\n                      if (isChecked) {\n                        setProcessorApps((processorApps) => [\n                          ...new Set([...processorApps, processorApp]),\n                        ]);\n                        onAddProcessorApp?.(processorApp);\n                      } else {\n                        if (processorApps.length > 1) {\n                          setProcessorApps((processorApps) =>\n                            processorApps.filter((p) => p !== processorApp),\n                          );\n                          onRemoveProcessorApp?.(processorApp);\n                        }\n                      }\n                    }}\n                  />\n                  <label\n                    htmlFor={processorApp}\n                    className=\"text-gray-700 dark:text-slate-200\"\n                  >\n                    {processorApp}\n                  </label>\n                </div>\n              ))}\n            </>\n          )}\n          <div className=\"space-y-1\">\n            {isReadOnly &&\n              processorApps.map((processorApp) => (\n                <span\n                  key={processorApp}\n                  className=\"text-sm text-gray-700 dark:text-slate-200\"\n                >\n                  {processorApp}\n                </span>\n              ))}\n          </div>\n        </div>\n      </div>\n      {/* Confirm Button - only show if not in read-only mode */}\n      {!isReadOnly && (\n        <div>\n          <button\n            onClick={handleConfirm}\n            disabled={!canConfirm}\n            className=\"rounded-md bg-blue-600 px-4 py-2 text-white hover:bg-blue-700 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:outline-none disabled:cursor-not-allowed disabled:bg-gray-300 dark:bg-blue-300 dark:text-slate-900 dark:hover:bg-blue-200 dark:disabled:bg-slate-600 dark:disabled:text-slate-100\"\n          >\n            Confirm\n          </button>\n        </div>\n      )}\n    </div>\n  );\n};\n","import type { PHDocumentEditorConfig } from \"@powerhousedao/reactor-browser\";\n\nexport const editorConfig: PHDocumentEditorConfig = {\n  isExternalControlsEnabled: false,\n};\n","import { DocumentToolbar } from \"@powerhousedao/design-system/connect\";\nimport { useSetPHDocumentEditorConfig } from \"@powerhousedao/reactor-browser\";\nimport type {\n  ProcessorApp,\n  ProcessorApps,\n} from \"@powerhousedao/shared/processors\";\nimport { useCallback } from \"react\";\nimport {\n  addDocumentType,\n  addProcessorApp,\n  removeDocumentType,\n  removeProcessorApp,\n  setProcessorName,\n  setProcessorStatus,\n  setProcessorType,\n} from \"../../document-models/processor-module/index.js\";\nimport { useSelectedProcessorModuleDocument } from \"../hooks/useVetraDocument.js\";\nimport { ProcessorEditorForm } from \"./components/ProcessorEditorForm.js\";\nimport { editorConfig } from \"./config.js\";\n\nexport default function Editor() {\n  useSetPHDocumentEditorConfig(editorConfig);\n  const [document, dispatch] = useSelectedProcessorModuleDocument();\n\n  const onConfirm = useCallback(() => {\n    // Dispatch all actions at once\n    dispatch([setProcessorStatus({ status: \"CONFIRMED\" })]);\n  }, [dispatch]);\n\n  const onNameChange = useCallback(\n    (name: string) => {\n      if (name === document.state.global.name) return;\n      dispatch(setProcessorName({ name }));\n    },\n    [document.state.global.name, dispatch],\n  );\n\n  const onTypeChange = useCallback(\n    (type: string) => {\n      if (type === document.state.global.type) return;\n      dispatch(setProcessorType({ type }));\n    },\n    [document.state.global.type, dispatch],\n  );\n\n  const onAddDocumentType = useCallback(\n    (id: string, documentType: string) => {\n      dispatch(addDocumentType({ id, documentType }));\n    },\n    [dispatch],\n  );\n\n  const onRemoveDocumentType = useCallback(\n    (id: string) => {\n      dispatch(removeDocumentType({ id }));\n    },\n    [dispatch],\n  );\n\n  const onAddProcessorApp = useCallback(\n    (processorApp: ProcessorApp) => {\n      dispatch(addProcessorApp({ processorApp }));\n    },\n    [dispatch],\n  );\n\n  const onRemoveProcessorApp = useCallback(\n    (processorApp: ProcessorApp) => {\n      dispatch(removeProcessorApp({ processorApp }));\n    },\n    [dispatch],\n  );\n\n  return (\n    <div className=\"bg-gray-50 p-6 dark:bg-slate-800\">\n      <DocumentToolbar />\n      <ProcessorEditorForm\n        onNameChange={onNameChange}\n        onTypeChange={onTypeChange}\n        onAddDocumentType={onAddDocumentType}\n        onRemoveDocumentType={onRemoveDocumentType}\n        onAddProcessorApp={onAddProcessorApp}\n        onRemoveProcessorApp={onRemoveProcessorApp}\n        status={document.state.global.status}\n        processorName={document.state.global.name ?? \"\"}\n        processorType={document.state.global.type ?? \"\"}\n        documentTypes={document.state.global.documentTypes ?? []}\n        processorApps={document.state.global.processorApps as ProcessorApps}\n        onConfirm={onConfirm}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/{editor-3TL5Vdsn.js → editor-UWE1ab9Y.js}

@@ -4,13 +4,14 @@ import { StatusPill } from "./editors/components/index.js";
 import { n as useAvailableDocumentTypes, t as useDebounce } from "./hooks-Btogj1f0.js";
 import { useSetPHDocumentEditorConfig } from "@powerhousedao/reactor-browser";
 import { Suspense, useCallback, useEffect, useState } from "react";
+import { twMerge } from "tailwind-merge";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { DocumentToolbar } from "@powerhousedao/design-system/connect";
 //#region editors/document-editor/components/DocumentEditorForm.tsx
 function DocumentTypeSelectUI(props) {
 	return /* @__PURE__ */ jsxs("select", {
 		id: "supported-document-types",
-		className: "w-full rounded-md border border-gray-300 px-3 py-2 focus:border-transparent focus:ring-2 focus:ring-blue-500 focus:outline-none",
+		className: "w-full rounded-md border border-gray-300 px-3 py-2 text-gray-900 focus:border-transparent focus:ring-2 focus:ring-blue-500 focus:outline-none dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100",
 		...props,
 		children: [/* @__PURE__ */ jsx("option", {
 			value: "",
@@ -73,7 +74,7 @@ const DocumentEditorForm = ({ editorName: initialEditorName = "", documentTypes:
 			/* @__PURE__ */ jsxs("div", {
 				className: "flex items-center justify-between",
 				children: [/* @__PURE__ */ jsx("h2", {
-					className: "text-lg font-medium text-gray-900",
+					className: "text-lg font-medium text-gray-900 dark:text-slate-50",
 					children: "Editor Configuration"
 				}), /* @__PURE__ */ jsx(StatusPill, {
 					status: status === "CONFIRMED" ? "confirmed" : "draft",
@@ -82,7 +83,7 @@ const DocumentEditorForm = ({ editorName: initialEditorName = "", documentTypes:
 			}),
 			/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("label", {
 				htmlFor: "editor-name",
-				className: "mb-2 block text-sm font-medium text-gray-700",
+				className: "mb-2 block text-sm font-medium text-gray-700 dark:text-slate-200",
 				children: "Editor Name"
 			}), /* @__PURE__ */ jsx("input", {
 				id: "editor-name",
@@ -90,11 +91,11 @@ const DocumentEditorForm = ({ editorName: initialEditorName = "", documentTypes:
 				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:ring-2 focus:ring-blue-500 focus:outline-none ${isReadOnly ? "cursor-not-allowed bg-gray-100" : ""}`
+				className: twMerge("w-full rounded-md border border-gray-300 px-3 py-2 placeholder:text-gray-700 focus:border-transparent focus:ring-2 focus:ring-blue-500 focus:outline-none dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100 dark:placeholder:text-slate-200", isReadOnly ? "cursor-not-allowed bg-gray-100 dark:bg-slate-700" : "")
 			})] }),
 			/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("label", {
 				htmlFor: "supported-document-types",
-				className: "mb-2 block text-sm font-medium text-gray-700",
+				className: "mb-2 block text-sm font-medium text-gray-700 dark:text-slate-200",
 				children: "Supported Document Types"
 			}), /* @__PURE__ */ jsxs("div", {
 				className: "space-y-2",
@@ -111,14 +112,14 @@ const DocumentEditorForm = ({ editorName: initialEditorName = "", documentTypes:
 					children: documentTypes.map((type) => /* @__PURE__ */ jsxs("div", {
 						className: "flex items-center py-1",
 						children: [/* @__PURE__ */ jsx("span", {
-							className: "text-sm text-gray-700",
+							className: "text-sm text-gray-700 dark:text-slate-200",
 							children: type.documentType
 						}), !isReadOnly && /* @__PURE__ */ jsx("button", {
 							onClick: () => {
 								setDocumentTypes([]);
 								onRemoveDocumentType?.({ id: type.id });
 							},
-							className: "ml-2 text-gray-400 hover:text-gray-600 focus:outline-none",
+							className: "ml-2 text-gray-400 hover:text-gray-600 focus:outline-none dark:text-slate-500 dark:hover:text-slate-300",
 							children: "×"
 						})]
 					}, type.id))
@@ -127,7 +128,7 @@ const DocumentEditorForm = ({ editorName: initialEditorName = "", documentTypes:
 			!isReadOnly && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ 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:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:outline-none disabled:cursor-not-allowed disabled:bg-gray-300",
+				className: "rounded-md bg-blue-600 px-4 py-2 text-white hover:bg-blue-700 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:outline-none disabled:cursor-not-allowed disabled:bg-gray-300 dark:bg-blue-300 dark:text-slate-900 dark:hover:bg-blue-200 dark:disabled:bg-slate-600 dark:disabled:text-slate-100",
 				children: "Confirm"
 			}) })
 		]
@@ -156,7 +157,7 @@ function Editor() {
 		dispatch(setEditorStatus({ status: "CONFIRMED" }));
 	}, [dispatch]);
 	return /* @__PURE__ */ jsxs("div", {
-		className: "bg-gray-50 p-6",
+		className: "bg-gray-50 p-6 dark:bg-slate-800",
 		children: [/* @__PURE__ */ jsx(DocumentToolbar, {}), /* @__PURE__ */ jsx(DocumentEditorForm, {
 			status: document.state.global.status,
 			editorName: document.state.global.name ?? "",
@@ -171,4 +172,4 @@ function Editor() {
 //#endregion
 export { Editor as default };
 
-//# sourceMappingURL=editor-3TL5Vdsn.js.map
+//# sourceMappingURL=editor-UWE1ab9Y.js.map

package/dist/editor-UWE1ab9Y.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor-UWE1ab9Y.js","names":[],"sources":["../editors/document-editor/components/DocumentEditorForm.tsx","../editors/document-editor/config.ts","../editors/document-editor/editor.tsx"],"sourcesContent":["import { Suspense, useEffect, useState } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport type {\n  AddDocumentTypeInput,\n  DocumentTypeItem,\n  RemoveDocumentTypeInput,\n} from \"../../../document-models/document-editor/index.js\";\nimport { StatusPill } from \"../../components/index.js\";\nimport { useAvailableDocumentTypes, useDebounce } from \"../../hooks/index.js\";\n\nexport interface DocumentEditorFormProps {\n  editorName?: string;\n  documentTypes?: DocumentTypeItem[];\n  status?: string;\n  onEditorNameChange?: (name: string) => void;\n  onAddDocumentType?: (input: AddDocumentTypeInput) => void;\n  onRemoveDocumentType?: (input: RemoveDocumentTypeInput) => void;\n  onConfirm?: () => void;\n}\n\nfunction DocumentTypeSelectUI(\n  props: React.SelectHTMLAttributes<HTMLSelectElement>,\n) {\n  return (\n    <select\n      id=\"supported-document-types\"\n      className=\"w-full rounded-md border border-gray-300 px-3 py-2 text-gray-900 focus:border-transparent focus:ring-2 focus:ring-blue-500 focus:outline-none dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100\"\n      {...props}\n    >\n      <option value=\"\">Select a document type</option>\n      {props.children}\n    </select>\n  );\n}\n\nfunction DocumentTypeSelect({\n  documentTypes,\n  setDocumentTypes,\n  onAddDocumentType,\n  onRemoveDocumentType,\n}: {\n  setDocumentTypes: (documentTypes: DocumentTypeItem[]) => void;\n} & Pick<\n  DocumentEditorFormProps,\n  \"documentTypes\" | \"onAddDocumentType\" | \"onRemoveDocumentType\"\n>) {\n  // Get available document types from the hook (vetra drive only for document editor)\n  const availableDocumentTypes = useAvailableDocumentTypes(true);\n  const [selectedDocumentType, setSelectedDocumentType] = useState(\"\");\n\n  return (\n    <DocumentTypeSelectUI\n      value={selectedDocumentType}\n      onChange={(e) => {\n        const selectedValue = e.target.value;\n        if (selectedValue) {\n          // Remove existing document type if any\n\n          const existingType = documentTypes?.at(0);\n          if (existingType) {\n            onRemoveDocumentType?.({ id: existingType.id });\n          }\n\n          // Add the new document type\n          const newTypeInput: AddDocumentTypeInput = {\n            id: Date.now().toString(), // Generate a unique ID\n            documentType: selectedValue,\n          };\n          const newType: DocumentTypeItem = {\n            id: newTypeInput.id,\n            documentType: newTypeInput.documentType,\n          };\n          setDocumentTypes([newType]); // Replace with single item array\n          onAddDocumentType?.(newTypeInput);\n        }\n        setSelectedDocumentType(\"\");\n      }}\n    >\n      {availableDocumentTypes.map((docType) => (\n        <option key={docType} value={docType}>\n          {docType}\n        </option>\n      ))}\n    </DocumentTypeSelectUI>\n  );\n}\n\nexport const DocumentEditorForm: React.FC<DocumentEditorFormProps> = ({\n  editorName: initialEditorName = \"\",\n  documentTypes: initialDocumentTypes = [],\n  status = \"DRAFT\",\n  onEditorNameChange,\n  onAddDocumentType,\n  onRemoveDocumentType,\n  onConfirm,\n}) => {\n  const [editorName, setEditorName] = useState(initialEditorName);\n  const [documentTypes, setDocumentTypes] =\n    useState<DocumentTypeItem[]>(initialDocumentTypes);\n  const [isConfirmed, setIsConfirmed] = useState(false);\n\n  // Use the debounce hook for name changes\n  useDebounce(editorName, onEditorNameChange, 300);\n\n  // Update local state when initial values change\n  useEffect(() => {\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setEditorName(initialEditorName);\n  }, [initialEditorName]);\n\n  useEffect(() => {\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setDocumentTypes(initialDocumentTypes);\n  }, [initialDocumentTypes]);\n\n  // Reset confirmation state if status changes back to DRAFT\n  useEffect(() => {\n    if (status === \"DRAFT\") {\n      // eslint-disable-next-line react-hooks/set-state-in-effect\n      setIsConfirmed(false);\n    }\n  }, [status]);\n\n  // Check if form should be read-only\n  const isReadOnly = isConfirmed || status === \"CONFIRMED\";\n\n  const handleConfirm = () => {\n    if (editorName.trim() && documentTypes.length > 0) {\n      setIsConfirmed(true); // Immediate UI update\n      onConfirm?.();\n    }\n  };\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <h2 className=\"text-lg font-medium text-gray-900 dark:text-slate-50\">\n          Editor Configuration\n        </h2>\n        <StatusPill\n          status={status === \"CONFIRMED\" ? \"confirmed\" : \"draft\"}\n          label={status === \"CONFIRMED\" ? \"Confirmed\" : \"Draft\"}\n        />\n      </div>\n\n      {/* Editor Name Field */}\n      <div>\n        <label\n          htmlFor=\"editor-name\"\n          className=\"mb-2 block text-sm font-medium text-gray-700 dark:text-slate-200\"\n        >\n          Editor Name\n        </label>\n        <input\n          id=\"editor-name\"\n          type=\"text\"\n          value={editorName}\n          onChange={(e) => setEditorName(e.target.value)}\n          disabled={isReadOnly}\n          className={twMerge(\n            \"w-full rounded-md border border-gray-300 px-3 py-2 placeholder:text-gray-700 focus:border-transparent focus:ring-2 focus:ring-blue-500 focus:outline-none dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100 dark:placeholder:text-slate-200\",\n            isReadOnly\n              ? \"cursor-not-allowed bg-gray-100 dark:bg-slate-700\"\n              : \"\",\n          )}\n        />\n      </div>\n\n      {/* Supported Document Types Field */}\n      <div>\n        <label\n          htmlFor=\"supported-document-types\"\n          className=\"mb-2 block text-sm font-medium text-gray-700 dark:text-slate-200\"\n        >\n          Supported Document Types\n        </label>\n        <div className=\"space-y-2\">\n          {!isReadOnly && (\n            <Suspense fallback={<DocumentTypeSelectUI />}>\n              <DocumentTypeSelect\n                documentTypes={documentTypes}\n                setDocumentTypes={setDocumentTypes}\n                onAddDocumentType={onAddDocumentType}\n                onRemoveDocumentType={onRemoveDocumentType}\n              />\n            </Suspense>\n          )}\n          <div className=\"space-y-1\">\n            {documentTypes.map((type) => (\n              <div key={type.id} className=\"flex items-center py-1\">\n                <span className=\"text-sm text-gray-700 dark:text-slate-200\">\n                  {type.documentType}\n                </span>\n                {!isReadOnly && (\n                  <button\n                    onClick={() => {\n                      setDocumentTypes([]);\n                      onRemoveDocumentType?.({ id: type.id });\n                    }}\n                    className=\"ml-2 text-gray-400 hover:text-gray-600 focus:outline-none dark:text-slate-500 dark:hover:text-slate-300\"\n                  >\n                    ×\n                  </button>\n                )}\n              </div>\n            ))}\n          </div>\n        </div>\n      </div>\n\n      {/* Confirm Button - only show if not in read-only mode */}\n      {!isReadOnly && (\n        <div>\n          <button\n            onClick={handleConfirm}\n            disabled={!editorName.trim() || documentTypes.length === 0}\n            className=\"rounded-md bg-blue-600 px-4 py-2 text-white hover:bg-blue-700 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:outline-none disabled:cursor-not-allowed disabled:bg-gray-300 dark:bg-blue-300 dark:text-slate-900 dark:hover:bg-blue-200 dark:disabled:bg-slate-600 dark:disabled:text-slate-100\"\n          >\n            Confirm\n          </button>\n        </div>\n      )}\n    </div>\n  );\n};\n","import type { PHDocumentEditorConfig } from \"@powerhousedao/reactor-browser\";\n\nexport const editorConfig: PHDocumentEditorConfig = {\n  isExternalControlsEnabled: false,\n};\n","import { DocumentToolbar } from \"@powerhousedao/design-system/connect\";\nimport { useSetPHDocumentEditorConfig } from \"@powerhousedao/reactor-browser\";\nimport { useCallback } from \"react\";\nimport { useSelectedDocumentEditorDocument } from \"../../document-models/document-editor/index.js\";\nimport {\n  addDocumentType,\n  removeDocumentType,\n  setEditorName,\n  setEditorStatus,\n  type AddDocumentTypeInput,\n  type RemoveDocumentTypeInput,\n} from \"../../document-models/document-editor/index.js\";\nimport { DocumentEditorForm } from \"./components/DocumentEditorForm.js\";\nimport { editorConfig } from \"./config.js\";\n\nexport default function Editor() {\n  useSetPHDocumentEditorConfig(editorConfig);\n  const [document, dispatch] = useSelectedDocumentEditorDocument();\n\n  const onEditorNameChange = useCallback(\n    (name: string) => {\n      if (!document.state.global.name && !name) return;\n      if (name === document.state.global.name) return;\n\n      dispatch(setEditorName({ name }));\n    },\n    [document.state.global.name, dispatch],\n  );\n\n  const onAddDocumentType = useCallback(\n    (input: AddDocumentTypeInput) => {\n      dispatch(addDocumentType(input));\n    },\n    [dispatch],\n  );\n\n  const onRemoveDocumentType = useCallback(\n    (input: RemoveDocumentTypeInput) => {\n      dispatch(removeDocumentType(input));\n    },\n    [dispatch],\n  );\n\n  const onConfirm = useCallback(() => {\n    dispatch(setEditorStatus({ status: \"CONFIRMED\" }));\n  }, [dispatch]);\n\n  return (\n    <div className=\"bg-gray-50 p-6 dark:bg-slate-800\">\n      <DocumentToolbar />\n      <DocumentEditorForm\n        status={document.state.global.status}\n        editorName={document.state.global.name ?? \"\"}\n        documentTypes={document.state.global.documentTypes}\n        onEditorNameChange={onEditorNameChange}\n        onAddDocumentType={onAddDocumentType}\n        onRemoveDocumentType={onRemoveDocumentType}\n        onConfirm={onConfirm}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}