@powerhousedao/network-admin 1.0.0-dev.5 → 1.0.0-dev.7

package/dist/editors/payment-terms-editor/components/MilestonesTab.js

@@ -0,0 +1,177 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useMemo } from "react";
+import { ObjectSetTable, TextInput, DatePicker, Button, } from "@powerhousedao/document-engineering";
+import { toast } from "@powerhousedao/design-system/connect";
+import { generateId } from "document-model/core";
+import { actions, } from "@powerhousedao/network-admin/document-models/payment-terms";
+export function MilestonesTab({ milestones, dispatch, currency = "USD", }) {
+    const [isAddingNew, setIsAddingNew] = useState(false);
+    const [newMilestone, setNewMilestone] = useState({
+        name: "",
+        amount: "",
+        expectedCompletionDate: "",
+        requiresApproval: true,
+    });
+    const columns = useMemo(() => [
+        {
+            field: "name",
+            title: "Name",
+            editable: true,
+            align: "left",
+            onSave: (newValue, context) => {
+                if (newValue !== context.row.name) {
+                    dispatch(actions.updateMilestone({
+                        id: context.row.id,
+                        name: newValue,
+                    }));
+                    toast("Milestone name updated", { type: "success" });
+                    return true;
+                }
+                return false;
+            },
+        },
+        {
+            field: "amount",
+            title: `Amount (${currency})`,
+            editable: true,
+            align: "right",
+            renderCell: (value) => `${value.value} ${value.unit}`,
+            onSave: (newValue, context) => {
+                const amount = parseFloat(newValue);
+                if (isNaN(amount)) {
+                    toast("Please enter a valid amount", { type: "error" });
+                    return false;
+                }
+                dispatch(actions.updateMilestone({
+                    id: context.row.id,
+                    amount: { value: amount, unit: currency },
+                }));
+                toast("Milestone amount updated", { type: "success" });
+                return true;
+            },
+        },
+        {
+            field: "expectedCompletionDate",
+            title: "Expected Completion",
+            editable: true,
+            align: "center",
+            renderCell: (value) => value ? new Date(value).toLocaleDateString() : "Not set",
+            onSave: (newValue, context) => {
+                const dateValue = newValue;
+                dispatch(actions.updateMilestone({
+                    id: context.row.id,
+                    expectedCompletionDate: dateValue || undefined,
+                }));
+                toast("Expected completion date updated", { type: "success" });
+                return true;
+            },
+        },
+        {
+            field: "requiresApproval",
+            title: "Requires Approval",
+            editable: true,
+            align: "center",
+            renderCell: (value) => (value ? "Yes" : "No"),
+            onSave: (newValue, context) => {
+                const approved = newValue === "true" || newValue === true;
+                dispatch(actions.updateMilestone({
+                    id: context.row.id,
+                    requiresApproval: approved,
+                }));
+                toast("Approval requirement updated", { type: "success" });
+                return true;
+            },
+        },
+        {
+            field: "payoutStatus",
+            title: "Status",
+            editable: true,
+            align: "center",
+            renderCell: (value) => {
+                const statusMap = {
+                    PENDING: "Pending",
+                    READY_FOR_REVIEW: "Ready for Review",
+                    APPROVED: "Approved",
+                    PAID: "Paid",
+                    REJECTED: "Rejected",
+                };
+                return statusMap[value] || value;
+            },
+            onSave: (newValue, context) => {
+                dispatch(actions.updateMilestoneStatus({
+                    id: context.row.id,
+                    payoutStatus: newValue,
+                }));
+                toast("Milestone status updated", { type: "success" });
+                return true;
+            },
+        },
+        {
+            field: "actions",
+            title: "Actions",
+            editable: false,
+            align: "center",
+            renderCell: (_, context) => (_jsx(Button, { onClick: () => {
+                    dispatch(actions.deleteMilestone({ id: context.row.id }));
+                    toast("Milestone deleted", { type: "success" });
+                }, size: "sm", className: "text-red-600 hover:text-red-800", children: "Delete" })),
+        },
+    ], [currency, dispatch]);
+    const handleAddMilestone = useCallback((e) => {
+        e.preventDefault();
+        if (!newMilestone.name.trim()) {
+            toast("Name is required", { type: "error" });
+            return;
+        }
+        if (!newMilestone.amount || isNaN(parseFloat(newMilestone.amount))) {
+            toast("Valid amount is required", { type: "error" });
+            return;
+        }
+        const milestoneData = {
+            id: generateId(),
+            name: newMilestone.name,
+            amount: {
+                value: parseFloat(newMilestone.amount),
+                unit: currency,
+            },
+            requiresApproval: newMilestone.requiresApproval,
+            expectedCompletionDate: newMilestone.expectedCompletionDate
+                ? new Date(newMilestone.expectedCompletionDate).toISOString()
+                : undefined,
+        };
+        dispatch(actions.addMilestone(milestoneData));
+        toast("Milestone added successfully", { type: "success" });
+        setNewMilestone({
+            name: "",
+            amount: "",
+            expectedCompletionDate: "",
+            requiresApproval: true,
+        });
+        setIsAddingNew(false);
+    }, [newMilestone, dispatch, currency]);
+    return (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx("h2", { className: "text-xl font-semibold dark:text-white", children: "Milestones" }), _jsxs("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-300", children: [milestones.length, " milestone(s) defined"] })] }), _jsx(Button, { onClick: () => setIsAddingNew(!isAddingNew), color: "light", size: "sm", className: "cursor-pointer hover:bg-blue-600 hover:text-white", children: "+ Add Milestone" })] }), isAddingNew && (_jsxs("div", { className: "rounded-lg border bg-gray-50 p-4 dark:border-gray-600 dark:bg-gray-700", children: [_jsx("h3", { className: "mb-4 text-lg font-medium dark:text-white", children: "Add New Milestone" }), _jsxs("form", { onSubmit: handleAddMilestone, className: "space-y-4", children: [_jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsx(TextInput, { label: "Name *", value: newMilestone.name, onChange: (e) => setNewMilestone({ ...newMilestone, name: e.target.value }), className: "w-full", required: true }), _jsx(TextInput, { label: `Amount (${currency}) *`, type: "number", value: newMilestone.amount, onChange: (e) => setNewMilestone({ ...newMilestone, amount: e.target.value }), className: "w-full", placeholder: "0.00", step: "0.01", required: true }), _jsx(DatePicker, { value: newMilestone.expectedCompletionDate
+                                            ? new Date(newMilestone.expectedCompletionDate)
+                                            : undefined, onChange: (e) => {
+                                            const date = e.target.value ? new Date(e.target.value) : null;
+                                            setNewMilestone({
+                                                ...newMilestone,
+                                                expectedCompletionDate: date?.toISOString() || "",
+                                            });
+                                        }, name: "expected-completion-date", placeholder: "Select expected completion date" }), _jsxs("div", { className: "flex items-center pt-6", children: [_jsx("input", { type: "checkbox", id: "requiresApproval", checked: newMilestone.requiresApproval, onChange: (e) => setNewMilestone({
+                                                    ...newMilestone,
+                                                    requiresApproval: e.target.checked,
+                                                }), className: "mr-2 h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500" }), _jsx("label", { htmlFor: "requiresApproval", className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: "Requires Approval" })] })] }), _jsxs("div", { className: "flex gap-3", children: [_jsx(Button, { type: "submit", color: "light", size: "sm", className: "cursor-pointer hover:bg-blue-600 hover:text-white", children: "Add Milestone" }), _jsx(Button, { type: "button", onClick: () => {
+                                            setIsAddingNew(false);
+                                            setNewMilestone({
+                                                name: "",
+                                                amount: "",
+                                                expectedCompletionDate: "",
+                                                requiresApproval: true,
+                                            });
+                                        }, color: "light", size: "sm", className: "cursor-pointer hover:bg-gray-600 hover:text-white", children: "Cancel" })] })] })] })), milestones.length > 0 ? (_jsx(ObjectSetTable, { data: milestones, columns: columns, onAdd: () => setIsAddingNew(true), onDelete: (row) => {
+                    dispatch(actions.deleteMilestone({
+                        id: row.id,
+                    }));
+                    toast("Milestone deleted", { type: "success" });
+                } })) : (_jsxs("div", { className: "rounded-lg border-2 border-dashed border-gray-300 py-8 text-center text-gray-500 dark:border-gray-600 dark:text-gray-400", children: [_jsx("p", { className: "text-lg font-medium", children: "No milestones defined yet" }), _jsx("p", { className: "text-sm", children: "Add your first milestone to get started" })] }))] }));
+}

package/dist/editors/payment-terms-editor/components/RetainerTab.d.ts

@@ -0,0 +1,8 @@
+import type { DocumentDispatch } from "@powerhousedao/reactor-browser";
+import { type PaymentTermsState, type PaymentTermsAction } from "@powerhousedao/network-admin/document-models/payment-terms";
+export interface RetainerTabProps {
+    state: PaymentTermsState;
+    dispatch: DocumentDispatch<PaymentTermsAction>;
+}
+export declare function RetainerTab({ state, dispatch }: RetainerTabProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=RetainerTab.d.ts.map

package/dist/editors/payment-terms-editor/components/RetainerTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RetainerTab.d.ts","sourceRoot":"","sources":["../../../../editors/payment-terms-editor/components/RetainerTab.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,EAEL,KAAK,iBAAiB,EAEtB,KAAK,kBAAkB,EACxB,MAAM,4DAA4D,CAAC;AAEpE,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,iBAAiB,CAAC;IACzB,QAAQ,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;CAChD;AAED,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,gBAAgB,2CA0RhE"}

package/dist/editors/payment-terms-editor/components/RetainerTab.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useMemo } from "react";
+import { TextInput, Select, Textarea, DatePicker, Button, } from "@powerhousedao/document-engineering";
+import { toast } from "@powerhousedao/design-system/connect";
+import { actions, } from "@powerhousedao/network-admin/document-models/payment-terms";
+export function RetainerTab({ state, dispatch }) {
+    const [isEditing, setIsEditing] = useState(false);
+    const [formData, setFormData] = useState({
+        retainerAmount: state.retainerDetails?.retainerAmount.value?.toString() || "",
+        billingFrequency: state.retainerDetails?.billingFrequency || "MONTHLY",
+        startDate: state.retainerDetails?.startDate || "",
+        endDate: state.retainerDetails?.endDate || "",
+        autoRenew: state.retainerDetails?.autoRenew || false,
+        servicesIncluded: state.retainerDetails?.servicesIncluded || "",
+    });
+    const billingFrequencyOptions = useMemo(() => [
+        { label: "Weekly", value: "WEEKLY" },
+        { label: "Biweekly", value: "BIWEEKLY" },
+        { label: "Monthly", value: "MONTHLY" },
+    ], []);
+    const handleSubmit = useCallback((e) => {
+        e.preventDefault();
+        if (!formData.retainerAmount ||
+            isNaN(parseFloat(formData.retainerAmount))) {
+            toast("Please enter a valid retainer amount", { type: "error" });
+            return;
+        }
+        if (!formData.startDate) {
+            toast("Start date is required", { type: "error" });
+            return;
+        }
+        if (!formData.servicesIncluded.trim()) {
+            toast("Services included description is required", { type: "error" });
+            return;
+        }
+        const startDate = new Date(formData.startDate).toISOString();
+        const endDate = formData.endDate
+            ? new Date(formData.endDate).toISOString()
+            : undefined;
+        dispatch(actions.setRetainerDetails({
+            retainerAmount: {
+                value: parseFloat(formData.retainerAmount),
+                unit: state.currency,
+            },
+            billingFrequency: formData.billingFrequency,
+            startDate,
+            endDate,
+            autoRenew: formData.autoRenew,
+            servicesIncluded: formData.servicesIncluded,
+        }));
+        toast("Retainer configuration saved", { type: "success" });
+        setIsEditing(false);
+    }, [formData, dispatch, state.currency]);
+    const handleCancel = useCallback(() => {
+        setFormData({
+            retainerAmount: state.retainerDetails?.retainerAmount.value?.toString() || "",
+            billingFrequency: state.retainerDetails?.billingFrequency || "MONTHLY",
+            startDate: state.retainerDetails?.startDate || "",
+            endDate: state.retainerDetails?.endDate || "",
+            autoRenew: state.retainerDetails?.autoRenew || false,
+            servicesIncluded: state.retainerDetails?.servicesIncluded || "",
+        });
+        setIsEditing(false);
+    }, [state.retainerDetails]);
+    if (!isEditing) {
+        return (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "mb-4 flex items-center justify-between", children: [_jsx("h2", { className: "text-xl font-semibold dark:text-white", children: "Retainer Configuration" }), _jsx(Button, { onClick: () => setIsEditing(true), color: "light", size: "sm", className: "cursor-pointer hover:bg-blue-600 hover:text-white", children: state.retainerDetails
+                                ? "Edit Configuration"
+                                : "Configure Retainer" })] }), state.retainerDetails ? (_jsxs("div", { className: "grid grid-cols-2 gap-6", children: [_jsxs("div", { children: [_jsx("label", { className: "mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300", children: "Retainer Amount" }), _jsx("p", { className: "text-lg dark:text-white", children: `${state.retainerDetails.retainerAmount.value} ${state.retainerDetails.retainerAmount.unit}` })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300", children: "Billing Frequency" }), _jsx("p", { className: "text-lg dark:text-white", children: state.retainerDetails.billingFrequency })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300", children: "Start Date" }), _jsx("p", { className: "text-lg dark:text-white", children: state.retainerDetails.startDate })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300", children: "End Date" }), _jsx("p", { className: "text-lg dark:text-white", children: state.retainerDetails.endDate || "Ongoing" })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300", children: "Auto Renew" }), _jsx("p", { className: "text-lg dark:text-white", children: state.retainerDetails.autoRenew ? "Yes" : "No" })] }), _jsxs("div", { className: "col-span-2", children: [_jsx("label", { className: "mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300", children: "Services Included" }), _jsx("div", { className: "rounded border bg-gray-50 p-3 dark:border-gray-600 dark:bg-gray-700", children: _jsx("p", { className: "text-sm dark:text-white", children: state.retainerDetails.servicesIncluded }) })] })] })) : (_jsxs("div", { className: "py-8 text-center text-gray-500 dark:text-gray-400", children: [_jsx("p", { children: "No retainer configuration set up yet." }), _jsx("p", { className: "text-sm", children: "Click \"Configure Retainer\" to get started." })] }))] }));
+    }
+    return (_jsxs("form", { onSubmit: handleSubmit, className: "space-y-6", children: [_jsx("div", { className: "mb-4 flex items-center justify-between", children: _jsx("h2", { className: "text-xl font-semibold dark:text-white", children: "Configure Retainer" }) }), _jsxs("div", { className: "grid grid-cols-2 gap-6", children: [_jsx(TextInput, { label: "Retainer Amount *", type: "number", value: formData.retainerAmount, onChange: (e) => setFormData({ ...formData, retainerAmount: e.target.value }), className: "w-full", placeholder: "0.00", step: "0.01", required: true }), _jsx(Select, { label: "Billing Frequency *", options: billingFrequencyOptions, value: formData.billingFrequency, onChange: (value) => setFormData({
+                            ...formData,
+                            billingFrequency: value,
+                        }) }), _jsx(DatePicker, { value: formData.startDate ? new Date(formData.startDate) : undefined, onChange: (e) => {
+                            const date = e.target.value ? new Date(e.target.value) : null;
+                            setFormData({
+                                ...formData,
+                                startDate: date?.toISOString() || "",
+                            });
+                        }, name: "start-date", placeholder: "Select start date", required: true }), _jsx(DatePicker, { value: formData.endDate ? new Date(formData.endDate) : undefined, onChange: (e) => {
+                            const date = e.target.value ? new Date(e.target.value) : null;
+                            setFormData({
+                                ...formData,
+                                endDate: date?.toISOString() || "",
+                            });
+                        }, name: "end-date", placeholder: "Select end date (optional)" }), _jsx("div", { className: "col-span-2", children: _jsx(Textarea, { label: "Services Included *", value: formData.servicesIncluded, onChange: (e) => setFormData({ ...formData, servicesIncluded: e.target.value }), className: "w-full", rows: 4, placeholder: "Describe the services included in the retainer...", required: true }) }), _jsx("div", { className: "col-span-2", children: _jsxs("div", { className: "flex items-center", children: [_jsx("input", { type: "checkbox", id: "autoRenew", checked: formData.autoRenew, onChange: (e) => setFormData({ ...formData, autoRenew: e.target.checked }), className: "mr-2 h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500" }), _jsx("label", { htmlFor: "autoRenew", className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: "Auto-Renew Retainer" })] }) })] }), _jsxs("div", { className: "flex gap-3", children: [_jsx(Button, { type: "submit", color: "light", size: "sm", className: "cursor-pointer hover:bg-blue-600 hover:text-white", children: "Save Configuration" }), _jsx(Button, { type: "button", onClick: handleCancel, color: "light", size: "sm", className: "cursor-pointer hover:bg-gray-600 hover:text-white", children: "Cancel" })] })] }));
+}

package/dist/editors/payment-terms-editor/editor.d.ts

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

package/dist/editors/payment-terms-editor/editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/payment-terms-editor/editor.tsx"],"names":[],"mappings":"AAaA,MAAM,CAAC,OAAO,UAAU,MAAM,4CAuN7B"}

package/dist/editors/payment-terms-editor/editor.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { DocumentToolbar, ToastContainer, } from "@powerhousedao/design-system/connect";
+import { useSelectedPaymentTermsDocument } from "@powerhousedao/network-admin/document-models/payment-terms";
+import { BasicTermsTab } from "./components/BasicTermsTab.js";
+import { MilestonesTab } from "./components/MilestonesTab.js";
+import { ClausesTab } from "./components/ClausesTab.js";
+import { CostMaterialsTab } from "./components/CostMaterialsTab.js";
+import { RetainerTab } from "./components/RetainerTab.js";
+import { EscrowTab } from "./components/EscrowTab.js";
+import { EvaluationTab } from "./components/EvaluationTab.js";
+export default function Editor() {
+    const [doc, dispatch] = useSelectedPaymentTermsDocument();
+    const state = doc.state.global;
+    const getStatusColor = (status) => {
+        switch (status) {
+            case "DRAFT":
+                return "bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-200";
+            case "SUBMITTED":
+                return "bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200";
+            case "ACCEPTED":
+                return "bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200";
+            case "CANCELLED":
+                return "bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200";
+            default:
+                return "bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-200";
+        }
+    };
+    const totalMilestones = state.milestoneSchedule.length;
+    const completedMilestones = state.milestoneSchedule.filter((m) => m.payoutStatus === "PAID").length;
+    return (_jsxs(_Fragment, { children: [_jsx(DocumentToolbar, {}), _jsx("div", { className: "min-h-screen bg-gray-50 dark:bg-gray-900", children: _jsxs("div", { className: "mx-auto max-w-7xl p-6", children: [_jsxs("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm dark:bg-gray-800", children: [_jsxs("div", { className: "flex items-start justify-between", children: [_jsxs("div", { children: [_jsx("h1", { className: "mb-2 text-3xl font-bold text-gray-900 dark:text-white", children: "Payment Terms Document" }), _jsx("p", { className: "text-gray-600 dark:text-gray-300", children: "Manage payment terms, milestones, and contract clauses" })] }), _jsx("div", { className: `flex items-center gap-2 rounded-full px-3 py-2 font-medium ${getStatusColor(state.status)}`, children: state.status })] }), _jsxs("div", { className: "mt-6 grid grid-cols-2 gap-4 md:grid-cols-4", children: [_jsxs("div", { className: "rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-600 dark:bg-gray-700", children: [_jsx("p", { className: "mb-1 text-sm font-medium text-gray-600 dark:text-gray-300", children: "Payment Model" }), _jsx("p", { className: "text-lg font-semibold dark:text-white", children: state.paymentModel.replace(/_/g, " ") })] }), _jsxs("div", { className: "rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-600 dark:bg-gray-700", children: [_jsx("p", { className: "mb-1 text-sm font-medium text-gray-600 dark:text-gray-300", children: "Currency" }), _jsx("p", { className: "text-lg font-semibold dark:text-white", children: state.currency })] }), _jsxs("div", { className: "rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-600 dark:bg-gray-700", children: [_jsx("p", { className: "mb-1 text-sm font-medium text-gray-600 dark:text-gray-300", children: "Total Amount" }), _jsx("p", { className: "text-lg font-semibold dark:text-white", children: state.totalAmount
+                                                        ? `${state.totalAmount.value} ${state.totalAmount.unit}`
+                                                        : "Not set" })] }), _jsxs("div", { className: "rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-600 dark:bg-gray-700", children: [_jsx("p", { className: "mb-1 text-sm font-medium text-gray-600 dark:text-gray-300", children: "Progress" }), _jsx("p", { className: "text-lg font-semibold dark:text-white", children: state.paymentModel === "MILESTONE"
+                                                        ? `${completedMilestones} / ${totalMilestones}`
+                                                        : "N/A" })] })] })] }), _jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "rounded-lg bg-white shadow-sm dark:bg-gray-800", children: [_jsxs("div", { className: "border-b border-gray-200 px-6 py-4 dark:border-gray-700", children: [_jsx("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: "Basic Terms" }), _jsx("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-300", children: "Configure the basic payment terms and details" })] }), _jsx("div", { className: "p-6", children: _jsx(BasicTermsTab, { state: state, dispatch: dispatch }) })] }), state.paymentModel === "MILESTONE" && (_jsxs("div", { className: "rounded-lg bg-white shadow-sm dark:bg-gray-800", children: [_jsxs("div", { className: "border-b border-gray-200 px-6 py-4 dark:border-gray-700", children: [_jsx("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: "Milestone Schedule" }), _jsx("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-300", children: "Define project milestones and payment amounts" })] }), _jsx("div", { className: "p-6", children: _jsx(MilestonesTab, { milestones: state.milestoneSchedule, dispatch: dispatch, currency: state.currency }) })] })), state.paymentModel === "COST_AND_MATERIALS" && (_jsxs("div", { className: "rounded-lg bg-white shadow-sm dark:bg-gray-800", children: [_jsxs("div", { className: "border-b border-gray-200 px-6 py-4 dark:border-gray-700", children: [_jsx("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: "Cost & Materials" }), _jsx("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-300", children: "Configure hourly rates, billing frequency, and caps" })] }), _jsx("div", { className: "p-6", children: _jsx(CostMaterialsTab, { state: state, dispatch: dispatch }) })] })), state.paymentModel === "RETAINER" && (_jsxs("div", { className: "rounded-lg bg-white shadow-sm dark:bg-gray-800", children: [_jsxs("div", { className: "border-b border-gray-200 px-6 py-4 dark:border-gray-700", children: [_jsx("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: "Retainer Details" }), _jsx("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-300", children: "Configure retainer amount, frequency, and services" })] }), _jsx("div", { className: "p-6", children: _jsx(RetainerTab, { state: state, dispatch: dispatch }) })] })), state.escrowDetails && state.escrowDetails.releaseConditions && (_jsxs("div", { className: "rounded-lg bg-white shadow-sm dark:bg-gray-800", children: [_jsxs("div", { className: "border-b border-gray-200 px-6 py-4 dark:border-gray-700", children: [_jsx("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: "Escrow Details" }), _jsx("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-300", children: "Configure escrow payment arrangements" })] }), _jsx("div", { className: "p-6", children: _jsx(EscrowTab, { state: state, dispatch: dispatch }) })] })), _jsxs("div", { className: "rounded-lg bg-white shadow-sm dark:bg-gray-800", children: [_jsxs("div", { className: "border-b border-gray-200 px-6 py-4 dark:border-gray-700", children: [_jsx("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: "Bonus & Penalty Clauses" }), _jsx("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-300", children: "Add performance-based bonus and penalty conditions" })] }), _jsx("div", { className: "p-6", children: _jsx(ClausesTab, { bonusClauses: state.bonusClauses, penaltyClauses: state.penaltyClauses, dispatch: dispatch, currency: state.currency }) })] }), _jsxs("div", { className: "rounded-lg bg-white shadow-sm dark:bg-gray-800", children: [_jsxs("div", { className: "border-b border-gray-200 px-6 py-4 dark:border-gray-700", children: [_jsx("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: "Evaluation Terms" }), _jsx("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-300", children: "Define performance evaluation criteria and processes" })] }), _jsx("div", { className: "p-6", children: _jsx(EvaluationTab, { state: state, dispatch: dispatch }) })] })] })] }) }), _jsx(ToastContainer, {})] }));
+}

package/dist/editors/payment-terms-editor/module.d.ts

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

package/dist/editors/payment-terms-editor/module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../../../editors/payment-terms-editor/module.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAGnD,eAAO,MAAM,kBAAkB,EAAE,YAOhC,CAAC"}

package/dist/editors/payment-terms-editor/module.js

@@ -0,0 +1,9 @@
+import { lazy } from "react";
+export const PaymentTermsEditor = {
+    Component: lazy(() => import("./editor.js")),
+    documentTypes: ["payment-terms"],
+    config: {
+        id: "payment-terms-editor",
+        name: "Payment Terms",
+    },
+};

package/dist/editors/rfp-editor/components/MarkdownEditor.d.ts

@@ -0,0 +1,12 @@
+export type MarkdownEditorMode = "preview" | "edit" | "live";
+interface MarkdownEditorProps {
+    value: string;
+    onChange: (value: string) => void;
+    onBlur?: (value: string) => void;
+    height?: number;
+    label?: string;
+    labelClassName?: string;
+}
+export declare function MarkdownEditor({ value, onChange, onBlur, height, label, labelClassName, }: MarkdownEditorProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MarkdownEditor.d.ts.map

package/dist/editors/rfp-editor/components/MarkdownEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkdownEditor.d.ts","sourceRoot":"","sources":["../../../../editors/rfp-editor/components/MarkdownEditor.tsx"],"names":[],"mappings":"AAgBA,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAE7D,UAAU,mBAAmB;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,MAAM,EACN,MAAY,EACZ,KAAiB,EACjB,cAAqD,GACtD,EAAE,mBAAmB,2CA6LrB"}

package/dist/editors/rfp-editor/components/MarkdownEditor.js

@@ -0,0 +1,135 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import remarkGfm from "remark-gfm";
+import rehypeSlug from "rehype-slug";
+import { useLocalStorage } from "usehooks-ts";
+// Custom preview renderer to make links open in new tabs and ensure proper list rendering
+const previewOptions = {
+    components: {
+        a: ({ ...props }) => (_jsx("a", { ...props, target: "_blank", rel: "noopener noreferrer" })),
+    },
+    rehypePlugins: [rehypeSlug],
+    remarkPlugins: [remarkGfm],
+};
+export function MarkdownEditor({ value, onChange, onBlur, height = 350, label = "Content", labelClassName = "text-sm leading-4 mb-3 font-medium", }) {
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+    const [MDEditor, setMDEditor] = useState(null);
+    const [contentValue, setContentValue] = useState(" ");
+    const [isLoaded, setIsLoaded] = useState(false);
+    const [loadError, setLoadError] = useState(null);
+    const [viewMarkdownMode, setViewMarkdownMode] = useLocalStorage("markdown-editor-view-mode", "live");
+    // Ensure we have a valid mode for the editor
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+    const editorMode = viewMarkdownMode || "live";
+    // Load the MDEditor component dynamically
+    useEffect(() => {
+        // Use a more robust dynamic import approach
+        const loadEditor = async () => {
+            try {
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+                const module = await import("@uiw/react-md-editor");
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-member-access
+                setMDEditor(() => module.default);
+                setIsLoaded(true);
+                setLoadError(null);
+            }
+            catch (error) {
+                console.error("Failed to load MDEditor:", error);
+                setLoadError(error instanceof Error ? error.message : "Failed to load editor");
+                setIsLoaded(true);
+            }
+        };
+        // Add a small delay to ensure DOM is ready
+        const timer = setTimeout(() => void loadEditor(), 0);
+        return () => clearTimeout(timer);
+    }, []);
+    // Update contentValue when value prop changes
+    useEffect(() => {
+        if (isLoaded) {
+            const stringValue = typeof value === "string" ? value : "";
+            const safeValue = stringValue.trim() || " ";
+            setContentValue(safeValue);
+        }
+    }, [value, isLoaded]);
+    useEffect(() => {
+        if (!MDEditor)
+            return;
+        const handleViewButtonClick = () => {
+            const buttonLive = document.querySelector("button[data-name='live']");
+            const buttonEdit = document.querySelector("button[data-name='edit']");
+            const buttonPreview = document.querySelector("button[data-name='preview']");
+            const liveLi = buttonLive?.closest("li");
+            const editLi = buttonEdit?.closest("li");
+            const previewLi = buttonPreview?.closest("li");
+            if (previewLi?.classList.contains("active")) {
+                setViewMarkdownMode("preview");
+            }
+            if (editLi?.classList.contains("active")) {
+                setViewMarkdownMode("edit");
+            }
+            if (liveLi?.classList.contains("active")) {
+                setViewMarkdownMode("live");
+            }
+        };
+        document.addEventListener("click", handleViewButtonClick, true);
+        return () => {
+            document.removeEventListener("click", handleViewButtonClick, true);
+        };
+    }, [MDEditor, setViewMarkdownMode]);
+    // Handle content changes
+    const handleContentChange = (newValue) => {
+        if (newValue !== undefined) {
+            const stringValue = typeof newValue === "string" ? newValue : "";
+            // Only replace completely empty strings with a space, preserve all other content
+            const safeValue = stringValue === "" ? " " : stringValue;
+            setContentValue(safeValue);
+            onChange(newValue); // Keep the original value for the parent component
+        }
+    };
+    // Handle content blur
+    const handleContentBlur = (e) => {
+        if (onBlur) {
+            onBlur(e.target.value);
+        }
+    };
+    return (_jsxs("div", { className: "w-full", children: [_jsx("style", { children: `
+          .w-md-editor-preview ul {
+            list-style-type: disc !important;
+            padding-left: 2em !important;
+          }
+
+          .w-md-editor-preview ol {
+            list-style-type: decimal !important;
+            padding-left: 2em !important;
+          }
+
+          /* Ensure proper table styling */
+          .w-md-editor-preview table {
+            border-collapse: collapse;
+            width: 100%;
+            margin: 1em 0;
+          }
+
+          .w-md-editor-preview th,
+          .w-md-editor-preview td {
+            border: 1px solid #ddd;
+            padding: 8px;
+            text-align: left;
+          }
+
+          .w-md-editor-preview th {
+            background-color: #f5f5f5;
+          }
+
+          .w-md-editor-text-pre code, .w-md-editor-text-pre div {
+            font-size: 16px !important;
+            line-height: 24px !important;
+          }
+          .w-md-editor-text-input {
+            font-size: 16px !important;
+            line-height: 24px !important;
+          }
+        ` }), label && _jsx("p", { className: labelClassName, children: label }), !isLoaded && (_jsx("div", { className: "w-full rounded-md border border-gray-300 bg-white p-3", style: { height: `${height}px` }, children: _jsx("div", { className: "flex h-full w-full items-center justify-center text-gray-500", children: "Loading editor..." }) })), isLoaded && loadError && (_jsx("div", { className: "w-full rounded-md border border-red-300 bg-red-50 p-3", style: { height: `${height}px` }, children: _jsxs("div", { className: "flex h-full w-full flex-col items-center justify-center text-red-600", children: [_jsx("p", { className: "mb-2 text-sm font-medium", children: "Failed to load markdown editor" }), _jsx("p", { className: "text-xs text-red-500", children: loadError }), _jsx("textarea", { className: "mt-2 h-full w-full rounded border border-gray-300 p-2 text-sm", placeholder: "Fallback text editor - write your content here...", value: value, onChange: (e) => onChange(e.target.value), onBlur: (e) => onBlur?.(e.target.value) })] }) })), isLoaded && MDEditor && (_jsx("div", { "data-color-mode": "light", className: "w-full", children: _jsx(MDEditor, { height: height, value: contentValue, onChange: handleContentChange, onBlur: handleContentBlur, previewOptions: previewOptions, enableScroll: true, preview: editorMode, textareaProps: {
+                        placeholder: "Write your content here...",
+                    } }) }))] }));
+}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/rfp-editor/editor.tsx"],"names":[],"mappings":"AA4BA,MAAM,CAAC,OAAO,UAAU,MAAM,4CA+O7B"}

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

@@ -0,0 +1,79 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useSelectedRequestForProposalsDocument, actions, } from "@powerhousedao/network-admin/document-models/request-for-proposals";
+import { DatePicker, Select, TextInput, NumberInput, } from "@powerhousedao/document-engineering";
+import { DocumentToolbar, toast, ToastContainer, } from "@powerhousedao/design-system/connect";
+import { MarkdownEditor } from "./components/MarkdownEditor.js";
+const statusOptions = [
+    { label: "DRAFT", value: "DRAFT" },
+    { label: "REQUEST_FOR_COMMMENTS", value: "REQUEST_FOR_COMMMENTS" },
+    { label: "CANCELED", value: "CANCELED" },
+    { label: "OPEN_FOR_PROPOSALS", value: "OPEN_FOR_PROPOSALS" },
+    { label: "AWARDED", value: "AWARDED" },
+    { label: "NOT_AWARDED", value: "NOT_AWARDED" },
+    { label: "CLOSED", value: "CLOSED" },
+];
+export default function Editor() {
+    const [doc, dispatch] = useSelectedRequestForProposalsDocument();
+    const state = doc.state.global;
+    // Validation function for budget range
+    const validateBudgetRange = (min, max) => {
+        if (min !== null && max !== null && min >= max) {
+            toast("Minimum budget must be less than maximum budget", {
+                type: "error",
+            });
+            return false;
+        }
+        return true;
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(DocumentToolbar, {}), _jsxs("div", { className: "w-full bg-gray-50", children: [_jsxs("div", { className: "mx-auto min-h-screen max-w-4xl p-6", children: [_jsx("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm", children: _jsx("h1", { className: "mb-2 text-3xl font-bold text-gray-900", children: "Request for Proposals" }) }), _jsx("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm", children: _jsxs("div", { className: "flex flex-row gap-6", children: [_jsxs("div", { className: "flex-1", children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Code" }), _jsx(TextInput, { className: "w-full", defaultValue: state.code || "", onBlur: (e) => {
+                                                        if (e.target.value !== state.code) {
+                                                            dispatch(actions.editRfp({ code: e.target.value }));
+                                                        }
+                                                    }, placeholder: "Enter rfp code" })] }), _jsxs("div", { className: "flex-1", children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Title" }), _jsx(TextInput, { className: "w-full", defaultValue: state.title || "", onBlur: (e) => {
+                                                        if (e.target.value !== state.title) {
+                                                            dispatch(actions.editRfp({ title: e.target.value }));
+                                                        }
+                                                    }, placeholder: "Enter rfp title" })] }), _jsx("div", { className: "w-[150px]", children: _jsx(Select, { label: "Status", options: statusOptions, value: state.status, onChange: (value) => dispatch(actions.editRfp({ status: value })) }) })] }) }), _jsx("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm", children: _jsx(MarkdownEditor, { height: 200, label: "Summary", value: state.summary || "", onChange: () => { }, onBlur: (value) => dispatch(actions.editRfp({ summary: value })) }) }), _jsxs("div", { className: "mb-6 flex flex-row justify-between rounded-lg bg-white p-6 shadow-sm", children: [_jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Submission Deadline" }), _jsx("div", { className: "w-[250px]", children: _jsx(DatePicker, { value: state.deadline ? new Date(state.deadline) : undefined, onChange: (e) => {
+                                                        const date = e.target.value
+                                                            ? new Date(e.target.value)
+                                                            : null;
+                                                        dispatch(actions.editRfp({ deadline: date?.toISOString() }));
+                                                    }, name: "submission-deadline", placeholder: "Select submission deadline" }) })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Budget Range" }), _jsxs("div", { className: "flex flex-row gap-2", children: [_jsx(NumberInput, { name: "minimum-budget", defaultValue: state.budgetRange.min || undefined, onBlur: (e) => {
+                                                            const newMin = Number(e.target.value);
+                                                            if (newMin !== Number(state.budgetRange.min)) {
+                                                                // Validate before dispatching
+                                                                if (validateBudgetRange(newMin, state.budgetRange.max || null)) {
+                                                                    dispatch(actions.editRfp({
+                                                                        budgetRange: { min: newMin },
+                                                                    }));
+                                                                }
+                                                            }
+                                                        }, placeholder: "Minimum budget", className: "w-[140px]" }), _jsx("span", { className: "text-gray-500", children: "-" }), _jsx(NumberInput, { name: "maximum-budget", defaultValue: state.budgetRange.max || undefined, onBlur: (e) => {
+                                                            const newMax = Number(e.target.value);
+                                                            if (newMax !== Number(state.budgetRange.max)) {
+                                                                // Validate before dispatching
+                                                                if (validateBudgetRange(state.budgetRange.min || null, newMax)) {
+                                                                    dispatch(actions.editRfp({
+                                                                        budgetRange: { max: newMax },
+                                                                    }));
+                                                                }
+                                                            }
+                                                        }, placeholder: "Maximum budget", className: "w-[140px]" }), _jsx(Select, { placeholder: "Currency", options: [
+                                                            "USD",
+                                                            "EUR",
+                                                            "GBP",
+                                                            "JPY",
+                                                            "CHF",
+                                                            "CNY",
+                                                            "DKK",
+                                                            "USDC",
+                                                            "USDS",
+                                                            "DAI",
+                                                        ].map((currency) => ({ label: currency, value: currency })), value: state.budgetRange.currency || "", onChange: (value) => {
+                                                            if (value !== state.budgetRange.currency) {
+                                                                dispatch(actions.editRfp({
+                                                                    budgetRange: { currency: value },
+                                                                }));
+                                                            }
+                                                        }, className: "w-[115px]" })] })] })] }), _jsx("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm", children: _jsx(MarkdownEditor, { height: 200, label: "Eligibility Criteria", value: state.eligibilityCriteria || "", onChange: () => { }, onBlur: (value) => dispatch(actions.editRfp({ eligibilityCriteria: value })) }) }), _jsx("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm", children: _jsx(MarkdownEditor, { height: 200, label: "Evaluation Criteria", value: state.evaluationCriteria || "", onChange: () => { }, onBlur: (value) => dispatch(actions.editRfp({ evaluationCriteria: value })) }) })] }), _jsx(ToastContainer, { position: "bottom-right", autoClose: 5000, hideProgressBar: false, newestOnTop: false, closeOnClick: true, rtl: false, pauseOnFocusLoss: true, draggable: true, pauseOnHover: true, theme: "light" })] })] }));
+}

package/dist/editors/rfp-editor/module.d.ts

@@ -0,0 +1,4 @@
+import type { EditorModule } from "document-model";
+/** Document editor module for the "powerhouse/rfp" document type */
+export declare const RfpEditor: EditorModule;
+//# sourceMappingURL=module.d.ts.map

package/dist/editors/rfp-editor/module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../../../editors/rfp-editor/module.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAGnD,oEAAoE;AACpE,eAAO,MAAM,SAAS,EAAE,YAOvB,CAAC"}