@powerhousedao/vetra 5.1.0-dev.27 → 5.1.0-dev.29
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
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;
|
|
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;AAqED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAmIhE,CAAC"}
|
|
@@ -1,14 +1,41 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { useEffect, useState } from "react";
|
|
2
|
+
import { Suspense, useEffect, useState } from "react";
|
|
3
3
|
import { StatusPill } from "../../components/index.js";
|
|
4
4
|
import { useAvailableDocumentTypes, useDebounce } from "../../hooks/index.js";
|
|
5
|
+
function DocumentTypeSelectUI(props) {
|
|
6
|
+
return (_jsxs("select", { id: "supported-document-types", 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", ...props, children: [_jsx("option", { value: "", children: "Select a document type" }), props.children] }));
|
|
7
|
+
}
|
|
8
|
+
function DocumentTypeSelect({ documentTypes, setDocumentTypes, onAddDocumentType, onRemoveDocumentType, }) {
|
|
9
|
+
// Get available document types from the hook (vetra drive only for document editor)
|
|
10
|
+
const availableDocumentTypes = useAvailableDocumentTypes(true);
|
|
11
|
+
const [selectedDocumentType, setSelectedDocumentType] = useState("");
|
|
12
|
+
return (_jsx(DocumentTypeSelectUI, { value: selectedDocumentType, onChange: (e) => {
|
|
13
|
+
const selectedValue = e.target.value;
|
|
14
|
+
if (selectedValue) {
|
|
15
|
+
// Remove existing document type if any
|
|
16
|
+
const existingType = documentTypes?.at(0);
|
|
17
|
+
if (existingType) {
|
|
18
|
+
onRemoveDocumentType?.({ id: existingType.id });
|
|
19
|
+
}
|
|
20
|
+
// Add the new document type
|
|
21
|
+
const newTypeInput = {
|
|
22
|
+
id: Date.now().toString(), // Generate a unique ID
|
|
23
|
+
documentType: selectedValue,
|
|
24
|
+
};
|
|
25
|
+
const newType = {
|
|
26
|
+
id: newTypeInput.id,
|
|
27
|
+
documentType: newTypeInput.documentType,
|
|
28
|
+
};
|
|
29
|
+
setDocumentTypes([newType]); // Replace with single item array
|
|
30
|
+
onAddDocumentType?.(newTypeInput);
|
|
31
|
+
}
|
|
32
|
+
setSelectedDocumentType("");
|
|
33
|
+
}, children: availableDocumentTypes.map((docType) => (_jsx("option", { value: docType, children: docType }, docType))) }));
|
|
34
|
+
}
|
|
5
35
|
export const DocumentEditorForm = ({ editorName: initialEditorName = "", documentTypes: initialDocumentTypes = [], status = "DRAFT", onEditorNameChange, onAddDocumentType, onRemoveDocumentType, onConfirm, }) => {
|
|
6
36
|
const [editorName, setEditorName] = useState(initialEditorName);
|
|
7
37
|
const [documentTypes, setDocumentTypes] = useState(initialDocumentTypes);
|
|
8
|
-
const [selectedDocumentType, setSelectedDocumentType] = useState("");
|
|
9
38
|
const [isConfirmed, setIsConfirmed] = useState(false);
|
|
10
|
-
// Get available document types from the hook (vetra drive only for document editor)
|
|
11
|
-
const availableDocumentTypes = useAvailableDocumentTypes(true);
|
|
12
39
|
// Use the debounce hook for name changes
|
|
13
40
|
useDebounce(editorName, onEditorNameChange, 300);
|
|
14
41
|
// Update local state when initial values change
|
|
@@ -32,28 +59,7 @@ export const DocumentEditorForm = ({ editorName: initialEditorName = "", documen
|
|
|
32
59
|
onConfirm?.();
|
|
33
60
|
}
|
|
34
61
|
};
|
|
35
|
-
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", { htmlFor: "editor-name", className: "mb-2 block text-sm font-medium text-gray-700", children: "Editor Name" }), _jsx("input", { id: "editor-name", 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", { htmlFor: "supported-document-types", className: "mb-2 block text-sm font-medium text-gray-700", children: "Supported Document Types" }), _jsxs("div", { className: "space-y-2", children: [!isReadOnly &&
|
|
36
|
-
const selectedValue = e.target.value;
|
|
37
|
-
if (selectedValue) {
|
|
38
|
-
// Remove existing document type if any
|
|
39
|
-
const existingType = documentTypes.at(0);
|
|
40
|
-
if (existingType) {
|
|
41
|
-
onRemoveDocumentType?.({ id: existingType.id });
|
|
42
|
-
}
|
|
43
|
-
// Add the new document type
|
|
44
|
-
const newTypeInput = {
|
|
45
|
-
id: Date.now().toString(), // Generate a unique ID
|
|
46
|
-
documentType: selectedValue,
|
|
47
|
-
};
|
|
48
|
-
const newType = {
|
|
49
|
-
id: newTypeInput.id,
|
|
50
|
-
documentType: newTypeInput.documentType,
|
|
51
|
-
};
|
|
52
|
-
setDocumentTypes([newType]); // Replace with single item array
|
|
53
|
-
onAddDocumentType?.(newTypeInput);
|
|
54
|
-
}
|
|
55
|
-
setSelectedDocumentType("");
|
|
56
|
-
}, 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: () => {
|
|
62
|
+
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", { htmlFor: "editor-name", className: "mb-2 block text-sm font-medium text-gray-700", children: "Editor Name" }), _jsx("input", { id: "editor-name", 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", { htmlFor: "supported-document-types", className: "mb-2 block text-sm font-medium text-gray-700", children: "Supported Document Types" }), _jsxs("div", { className: "space-y-2", children: [!isReadOnly && (_jsx(Suspense, { fallback: _jsx(DocumentTypeSelectUI, {}), children: _jsx(DocumentTypeSelect, { documentTypes: documentTypes, setDocumentTypes: setDocumentTypes, onAddDocumentType: onAddDocumentType, onRemoveDocumentType: onRemoveDocumentType }) })), _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: () => {
|
|
57
63
|
setDocumentTypes([]);
|
|
58
64
|
onRemoveDocumentType?.({ id: type.id });
|
|
59
65
|
}, 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" }) }))] }));
|