@powerhousedao/network-admin 0.0.49 → 0.0.50

package/dist/editors/payment-terms/components/milestones-section.js

@@ -0,0 +1,268 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Milestone as MilestoneIcon, Plus, Calendar, CheckCircle2, Clock, AlertCircle, CircleDollarSign, XCircle, } from "lucide-react";
+import { ObjectSetTable, DatePicker, Checkbox, Select, } from "@powerhousedao/document-engineering";
+import { toast } from "@powerhousedao/design-system/connect";
+import { generateId } from "document-model/core";
+import {} from "../../../document-models/payment-terms/index.js";
+const STATUS_CONFIG = {
+    PENDING: {
+        label: "Pending",
+        icon: Clock,
+        tagClass: "bg-stone-100 text-slate-500",
+        dotClass: "bg-slate-400",
+    },
+    READY_FOR_REVIEW: {
+        label: "Ready for Review",
+        icon: AlertCircle,
+        tagClass: "bg-amber-100 text-amber-600",
+        dotClass: "bg-amber-500",
+    },
+    APPROVED: {
+        label: "Approved",
+        icon: CheckCircle2,
+        tagClass: "bg-blue-100 text-blue-600",
+        dotClass: "bg-blue-500",
+    },
+    PAID: {
+        label: "Paid",
+        icon: CircleDollarSign,
+        tagClass: "bg-emerald-100 text-emerald-600",
+        dotClass: "bg-emerald-500",
+    },
+    REJECTED: {
+        label: "Rejected",
+        icon: XCircle,
+        tagClass: "bg-rose-100 text-rose-600",
+        dotClass: "bg-rose-500",
+    },
+};
+export function MilestonesSection({ milestones, dispatch, actions, currency, }) {
+    const columns = useMemo(() => [
+        {
+            field: "name",
+            title: "Milestone",
+            type: "string",
+            editable: true,
+            align: "left",
+            width: 280,
+            onSave: (newValue, context) => {
+                if (newValue !== context.row.name && newValue) {
+                    dispatch(actions.updateMilestone({
+                        id: context.row.id,
+                        name: newValue,
+                    }));
+                    return true;
+                }
+                return false;
+            },
+            renderCell: (value, context) => {
+                // Use value from row data, fallback to context.row.name for empty rows
+                const displayValue = value || context.row.name || "";
+                if (!displayValue) {
+                    return (_jsx("span", { className: "text-slate-400 italic", children: "+ Double-click to add milestone" }));
+                }
+                return _jsx("span", { className: "font-medium", children: displayValue });
+            },
+        },
+        {
+            field: "amount",
+            title: `Amount (${currency})`,
+            type: "number",
+            editable: true,
+            align: "right",
+            width: 120,
+            renderCell: (value, context) => {
+                // Hide for empty/new rows
+                if (!context.row.name) {
+                    return null;
+                }
+                const numValue = context.row.amount?.value;
+                if (numValue === undefined || numValue === null) {
+                    return _jsx("span", { className: "text-slate-400", children: "\u2014" });
+                }
+                return (_jsx("span", { className: "font-mono text-sm text-slate-700", children: _jsx("span", { children: numValue.toLocaleString() }) }));
+            },
+            renderCellEditor: (value, onChange, context) => {
+                // Extract numeric value from Amount object
+                const amountValue = context.row.amount?.value;
+                return (_jsx("input", { className: "w-full bg-white border border-gray-300 rounded-md p-2", name: `amount-${context.row.id}`, defaultValue: amountValue, step: "0.01", type: "number", onBlur: (e) => {
+                        if (e.target.value !== undefined &&
+                            e.target.value !== String(context.row.amount?.value)) {
+                            dispatch(actions.updateMilestone({
+                                id: context.row.id,
+                                amount: {
+                                    value: parseFloat(e.target.value),
+                                    unit: currency,
+                                },
+                            }));
+                            toast("Amount updated", { type: "success" });
+                        }
+                    } }));
+            },
+            onSave: (newValue, context) => {
+                return true;
+            },
+        },
+        {
+            field: "expectedCompletionDate",
+            title: "Due Date",
+            type: "date",
+            editable: true,
+            align: "center",
+            width: 160,
+            className: "bg-white ",
+            style: {
+                backgroundColor: "white",
+            },
+            renderCell: (value) => {
+                if (!value) {
+                    return (_jsx("div", { className: "flex items-center justify-center w-full h-full", children: _jsx("span", { className: "text-slate-400" }) }));
+                }
+                try {
+                    // Extract date parts using UTC methods to avoid timezone conversion
+                    const date = new Date(value);
+                    if (isNaN(date.getTime())) {
+                        return (_jsx("div", { className: "flex items-center justify-center w-full h-full", children: _jsx("span", { className: "text-slate-400", children: "\u2014" }) }));
+                    }
+                    const year = date.getUTCFullYear();
+                    const monthNames = [
+                        "Jan",
+                        "Feb",
+                        "Mar",
+                        "Apr",
+                        "May",
+                        "Jun",
+                        "Jul",
+                        "Aug",
+                        "Sep",
+                        "Oct",
+                        "Nov",
+                        "Dec",
+                    ];
+                    const month = monthNames[date.getUTCMonth()];
+                    const day = date.getUTCDate();
+                    return (_jsx("div", { className: "flex items-center justify-center w-full h-full", children: _jsx("span", { className: "text-slate-500", children: `${day} ${month} ${year}` }) }));
+                }
+                catch {
+                    return (_jsx("div", { className: "flex items-center justify-center w-full h-full", children: _jsx("span", { className: "text-slate-400", children: "\u2014" }) }));
+                }
+            },
+            renderCellEditor: (value, onChange, context) => {
+                const dateValue = value
+                    ? typeof value === "string"
+                        ? new Date(value)
+                        : value
+                    : undefined;
+                return (_jsx(DatePicker, { className: "bg-white min-w-[160px]", name: `date-${context.row.id}`, value: dateValue instanceof Date ? dateValue : undefined, onChange: (e) => {
+                        const date = e.target.value ? new Date(e.target.value) : null;
+                        dispatch(actions.updateMilestone({
+                            id: context.row.id,
+                            expectedCompletionDate: date?.toISOString() || null,
+                        }));
+                    } }));
+            },
+            onSave: (newValue, context) => {
+                return true;
+            },
+        },
+        {
+            field: "requiresApproval",
+            title: "Approval",
+            type: "boolean",
+            editable: true,
+            align: "center",
+            width: 90,
+            onSave: (newValue, context) => {
+                return true;
+            },
+            renderCell: (value, context) => {
+                // Use context.row to get the latest state value
+                const requiresApproval = context.row.requiresApproval;
+                if (requiresApproval === undefined || requiresApproval === null) {
+                    return (_jsx("div", { className: "flex items-center justify-center w-full h-full", children: _jsx("span", { className: "text-slate-400" }) }));
+                }
+                return (_jsx("div", { className: "flex items-center justify-center w-full h-full", children: requiresApproval === true ? (_jsx("span", { className: "text-emerald-600 font-medium", children: "Yes" })) : (_jsx("span", { className: "text-slate-400", children: "No" })) }));
+            },
+            renderCellEditor: (value, onChange, context) => {
+                const currentValue = context.row.requiresApproval ?? false;
+                return (_jsx(Checkbox, { className: "bg-white", name: `requiresApproval-${context.row.id}`, value: currentValue, onChange: (checked) => {
+                        dispatch(actions.updateMilestone({
+                            id: context.row.id,
+                            requiresApproval: checked,
+                        }));
+                        toast("Approval requirement updated", { type: "success" });
+                    } }));
+            },
+        },
+        {
+            field: "payoutStatus",
+            title: "Status",
+            type: "enum",
+            getCellValue: (row) => row.payoutStatus,
+            editable: true,
+            align: "center",
+            width: 140,
+            onSave: (newValue, context) => {
+                return true;
+            },
+            renderCell: (value, context) => {
+                const status = {
+                    APPROVED: "Approved",
+                    PAID: "Paid",
+                    PENDING: "Pending",
+                    READY_FOR_REVIEW: "Ready for Review",
+                    REJECTED: "Rejected",
+                };
+                return (_jsx("div", { className: "flex items-center justify-center w-full h-full text-center", children: _jsx("span", { className: "text-slate-500", children: status[value] }) }));
+            },
+            renderCellEditor: (value, onChange, context) => {
+                return (_jsx(Select, { className: "bg-white min-w-[160px]", name: `payoutStatus-${context.row.id}`, value: value, options: [
+                        { value: "APPROVED", label: "Approved" },
+                        { value: "PAID", label: "Paid" },
+                        { value: "PENDING", label: "Pending" },
+                        { value: "READY_FOR_REVIEW", label: "Ready for Review" },
+                        { value: "REJECTED", label: "Rejected" },
+                    ], onChange: (e) => {
+                        dispatch(actions.updateMilestoneStatus({
+                            id: context.row.id,
+                            payoutStatus: e,
+                        }));
+                    } }));
+            },
+        },
+    ], [actions, currency, dispatch]);
+    return (_jsxs("div", { className: "bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden transition-shadow hover:shadow-md", children: [_jsx("div", { className: "flex items-center justify-between px-5 py-4 border-b border-gray-200 bg-stone-50", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex items-center justify-center w-9 h-9 rounded-lg bg-blue-100", children: _jsx(MilestoneIcon, { size: 18, className: "text-blue-600" }) }), _jsxs("div", { children: [_jsx("h2", { className: "text-[15px] font-semibold text-slate-800", children: "Milestones" }), _jsxs("p", { className: "text-[13px] text-slate-400 mt-0.5", children: [milestones.length, " milestone", milestones.length !== 1 ? "s" : "", " ", "defined"] })] })] }) }), _jsx("div", { className: "p-5", children: milestones.length > 0 ? (_jsx(ObjectSetTable, { data: milestones, columns: columns, onAdd: (data) => {
+                        const name = data.name || "";
+                        if (name.trim()) {
+                            const milestoneData = {
+                                id: generateId(),
+                                name: name.trim(),
+                                amount: { value: 0, unit: currency },
+                                requiresApproval: true,
+                                expectedCompletionDate: null,
+                                payoutStatus: "PENDING",
+                            };
+                            dispatch(actions.addMilestone(milestoneData));
+                            toast("Milestone added", { type: "success" });
+                        }
+                    }, onDelete: (rows) => {
+                        if (rows.length > 0) {
+                            rows.forEach((row) => {
+                                dispatch(actions.deleteMilestone({ id: row.id }));
+                            });
+                            toast(`${rows.length} milestone${rows.length > 1 ? "s" : ""} deleted`, { type: "success" });
+                        }
+                    }, allowRowSelection: true })) : (_jsxs("div", { className: "flex flex-col items-center justify-center py-10 text-center border-2 border-dashed border-gray-200 rounded-lg bg-stone-50", children: [_jsx(MilestoneIcon, { size: 48, className: "text-slate-400 mb-4" }), _jsx("p", { className: "text-[15px] font-semibold text-slate-800 mb-1", children: "No milestones yet" }), _jsx("p", { className: "text-sm text-slate-400 mb-4", children: "Add milestones to define your payment schedule" }), _jsxs("button", { type: "button", className: "inline-flex items-center gap-2 px-4 py-2 text-[13px] font-medium text-white bg-slate-800 border-none rounded-md cursor-pointer transition-colors hover:bg-slate-700", onClick: () => {
+                                const milestoneData = {
+                                    id: generateId(),
+                                    name: "New Milestone",
+                                    amount: { value: 0, unit: currency },
+                                    requiresApproval: true,
+                                    expectedCompletionDate: null,
+                                    payoutStatus: "PENDING",
+                                };
+                                dispatch(actions.addMilestone(milestoneData));
+                                toast("Milestone added", { type: "success" });
+                            }, children: [_jsx(Plus, { size: 16 }), "Add First Milestone"] })] })) })] }));
+}

package/dist/editors/payment-terms/components/parties-section.d.ts

@@ -0,0 +1,11 @@
+import type { PaymentTermsState } from "../../../document-models/payment-terms/gen/types.js";
+import type { PaymentTermsAction } from "../../../document-models/payment-terms/gen/actions.js";
+import { type actions as paymentTermsActions } from "../../../document-models/payment-terms/index.js";
+interface PartiesSectionProps {
+    state: PaymentTermsState;
+    dispatch: (action: PaymentTermsAction) => void;
+    actions: typeof paymentTermsActions;
+}
+export declare function PartiesSection({ state, dispatch, actions, }: PartiesSectionProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=parties-section.d.ts.map

package/dist/editors/payment-terms/components/parties-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"parties-section.d.ts","sourceRoot":"","sources":["../../../../editors/payment-terms/components/parties-section.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qDAAqD,CAAC;AAC7F,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uDAAuD,CAAC;AAChG,OAAO,EAAE,KAAK,OAAO,IAAI,mBAAmB,EAAE,MAAM,iDAAiD,CAAC;AAEtG,UAAU,mBAAmB;IAC3B,KAAK,EAAE,iBAAiB,CAAC;IACzB,QAAQ,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC/C,OAAO,EAAE,OAAO,mBAAmB,CAAC;CACrC;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,OAAO,GACR,EAAE,mBAAmB,2CAqIrB"}

package/dist/editors/payment-terms/components/parties-section.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { Users, UserCircle, Building2, Pencil, Check, X } from "lucide-react";
+import { TextInput } from "@powerhousedao/document-engineering";
+import { toast } from "@powerhousedao/design-system/connect";
+import {} from "../../../document-models/payment-terms/index.js";
+export function PartiesSection({ state, dispatch, actions, }) {
+    const [isEditing, setIsEditing] = useState(false);
+    const [formData, setFormData] = useState({
+        proposer: state.proposer || "",
+        payer: state.payer || "",
+    });
+    const handleSave = useCallback(() => {
+        if (!formData.proposer.trim() || !formData.payer.trim()) {
+            toast("Both proposer and payer are required", { type: "error" });
+            return;
+        }
+        dispatch(actions.setBasicTerms({
+            proposer: formData.proposer,
+            payer: formData.payer,
+            currency: state.currency,
+            paymentModel: state.paymentModel,
+            totalAmount: state.totalAmount || undefined,
+        }));
+        toast("Parties updated successfully", { type: "success" });
+        setIsEditing(false);
+    }, [formData, state, dispatch, actions]);
+    const handleCancel = useCallback(() => {
+        setFormData({
+            proposer: state.proposer || "",
+            payer: state.payer || "",
+        });
+        setIsEditing(false);
+    }, [state]);
+    return (_jsxs("div", { className: "bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden transition-shadow hover:shadow-md", children: [_jsxs("div", { className: "flex items-center justify-between px-5 py-4 border-b border-gray-200 bg-stone-50", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex items-center justify-center w-9 h-9 rounded-lg bg-white text-slate-500", children: _jsx(Users, { size: 18 }) }), _jsxs("div", { children: [_jsx("h2", { className: "text-[15px] font-semibold text-slate-800", children: "Parties" }), _jsx("p", { className: "text-[13px] text-slate-400 mt-0.5", children: "Contract participants" })] })] }), !isEditing ? (_jsxs("button", { type: "button", className: "inline-flex items-center gap-2 px-3 py-1.5 text-[13px] font-medium text-slate-500 bg-transparent border-none rounded-md cursor-pointer transition-colors hover:bg-stone-100 hover:text-slate-800", onClick: () => setIsEditing(true), children: [_jsx(Pencil, { size: 14 }), "Edit"] })) : (_jsxs("div", { className: "flex gap-2", children: [_jsxs("button", { type: "button", className: "inline-flex items-center gap-2 px-3 py-1.5 text-[13px] font-medium text-white bg-emerald-600 border-none rounded-md cursor-pointer transition-colors hover:bg-emerald-700", onClick: handleSave, children: [_jsx(Check, { size: 14 }), "Save"] }), _jsxs("button", { type: "button", className: "inline-flex items-center gap-2 px-3 py-1.5 text-[13px] font-medium text-slate-500 bg-transparent border-none rounded-md cursor-pointer transition-colors hover:bg-stone-100 hover:text-slate-800", onClick: handleCancel, children: [_jsx(X, { size: 14 }), "Cancel"] })] }))] }), _jsx("div", { className: "p-5", children: _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsxs("label", { className: "text-[13px] font-medium text-slate-500", children: [_jsx(UserCircle, { size: 14, className: "inline align-middle mr-1.5" }), "Proposer"] }), isEditing ? (_jsx(TextInput, { value: formData.proposer, onChange: (e) => setFormData({ ...formData, proposer: e.target.value }), placeholder: "Enter proposer name or entity" })) : (_jsx("p", { className: `text-[15px] py-2.5 ${!state.proposer ? "text-slate-400 italic" : "text-slate-800"}`, children: state.proposer || "Not specified" }))] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsxs("label", { className: "text-[13px] font-medium text-slate-500", children: [_jsx(Building2, { size: 14, className: "inline align-middle mr-1.5" }), "Payer"] }), isEditing ? (_jsx(TextInput, { value: formData.payer, onChange: (e) => setFormData({ ...formData, payer: e.target.value }), placeholder: "Enter payer name or entity" })) : (_jsx("p", { className: `text-[15px] py-2.5 ${!state.payer ? "text-slate-400 italic" : "text-slate-800"}`, children: state.payer || "Not specified" }))] })] }) })] }));
+}

package/dist/editors/payment-terms/components/payment-config-section.d.ts

@@ -0,0 +1,11 @@
+import type { PaymentTermsState } from "../../../document-models/payment-terms/gen/types.js";
+import type { PaymentTermsAction } from "../../../document-models/payment-terms/gen/actions.js";
+import { type actions as paymentTermsActions } from "../../../document-models/payment-terms/index.js";
+interface PaymentConfigSectionProps {
+    state: PaymentTermsState;
+    dispatch: (action: PaymentTermsAction) => void;
+    actions: typeof paymentTermsActions;
+}
+export declare function PaymentConfigSection({ state, dispatch, actions, }: PaymentConfigSectionProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=payment-config-section.d.ts.map

package/dist/editors/payment-terms/components/payment-config-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"payment-config-section.d.ts","sourceRoot":"","sources":["../../../../editors/payment-terms/components/payment-config-section.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EACV,iBAAiB,EAGlB,MAAM,qDAAqD,CAAC;AAC7D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uDAAuD,CAAC;AAChG,OAAO,EAAE,KAAK,OAAO,IAAI,mBAAmB,EAAE,MAAM,iDAAiD,CAAC;AAEtG,UAAU,yBAAyB;IACjC,KAAK,EAAE,iBAAiB,CAAC;IACzB,QAAQ,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC/C,OAAO,EAAE,OAAO,mBAAmB,CAAC;CACrC;AAaD,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,QAAQ,EACR,OAAO,GACR,EAAE,yBAAyB,2CA0L3B"}

package/dist/editors/payment-terms/components/payment-config-section.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { Settings, DollarSign, Milestone, Clock, Pencil, Check, X, } from "lucide-react";
+import { TextInput, Select } from "@powerhousedao/document-engineering";
+import { toast } from "@powerhousedao/design-system/connect";
+import {} from "../../../document-models/payment-terms/index.js";
+const CURRENCY_OPTIONS = [
+    { value: "USD", label: "USD - US Dollar" },
+    { value: "EUR", label: "EUR - Euro" },
+    { value: "GBP", label: "GBP - British Pound" },
+];
+const PAYMENT_MODEL_OPTIONS = [
+    { value: "MILESTONE", label: "Milestone-Based" },
+    { value: "TIME_AND_MATERIALS", label: "Time & Materials" },
+];
+export function PaymentConfigSection({ state, dispatch, actions, }) {
+    const [isEditing, setIsEditing] = useState(false);
+    const [formData, setFormData] = useState({
+        currency: state.currency || "USD",
+        paymentModel: state.paymentModel || "MILESTONE",
+        totalAmount: state.totalAmount?.value?.toString() || "",
+    });
+    const handleSave = useCallback(() => {
+        dispatch(actions.setBasicTerms({
+            proposer: state.proposer,
+            payer: state.payer,
+            currency: formData.currency,
+            paymentModel: formData.paymentModel,
+            totalAmount: formData.totalAmount
+                ? {
+                    value: parseFloat(formData.totalAmount),
+                    unit: formData.currency,
+                }
+                : undefined,
+        }));
+        toast("Payment configuration updated", { type: "success" });
+        setIsEditing(false);
+    }, [formData, state, dispatch, actions]);
+    const handleCancel = useCallback(() => {
+        setFormData({
+            currency: state.currency || "USD",
+            paymentModel: state.paymentModel || "MILESTONE",
+            totalAmount: state.totalAmount?.value?.toString() || "",
+        });
+        setIsEditing(false);
+    }, [state]);
+    const formatAmount = (value, currency) => {
+        if (!value)
+            return null;
+        return new Intl.NumberFormat("en-US", {
+            style: "currency",
+            currency: currency,
+            minimumFractionDigits: 0,
+            maximumFractionDigits: 2,
+        }).format(value);
+    };
+    const PaymentModelIcon = state.paymentModel === "MILESTONE" ? Milestone : Clock;
+    return (_jsxs("div", { className: "bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden transition-shadow hover:shadow-md", children: [_jsxs("div", { className: "flex items-center justify-between px-5 py-4 border-b border-gray-200 bg-stone-50", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex items-center justify-center w-9 h-9 rounded-lg bg-white text-slate-500", children: _jsx(Settings, { size: 18 }) }), _jsxs("div", { children: [_jsx("h2", { className: "text-[15px] font-semibold text-slate-800", children: "Payment Configuration" }), _jsx("p", { className: "text-[13px] text-slate-400 mt-0.5", children: "Currency, model, and total amount" })] })] }), !isEditing ? (_jsxs("button", { type: "button", className: "inline-flex items-center gap-2 px-3 py-1.5 text-[13px] font-medium text-slate-500 bg-transparent border-none rounded-md cursor-pointer transition-colors hover:bg-stone-100 hover:text-slate-800", onClick: () => setIsEditing(true), children: [_jsx(Pencil, { size: 14 }), "Edit"] })) : (_jsxs("div", { className: "flex gap-2", children: [_jsxs("button", { type: "button", className: "inline-flex items-center gap-2 px-3 py-1.5 text-[13px] font-medium text-white bg-emerald-600 border-none rounded-md cursor-pointer transition-colors hover:bg-emerald-700", onClick: handleSave, children: [_jsx(Check, { size: 14 }), "Save"] }), _jsxs("button", { type: "button", className: "inline-flex items-center gap-2 px-3 py-1.5 text-[13px] font-medium text-slate-500 bg-transparent border-none rounded-md cursor-pointer transition-colors hover:bg-stone-100 hover:text-slate-800", onClick: handleCancel, children: [_jsx(X, { size: 14 }), "Cancel"] })] }))] }), _jsx("div", { className: "p-5", children: _jsxs("div", { className: "grid grid-cols-3 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsxs("label", { className: "text-[13px] font-medium text-slate-500", children: [_jsx(DollarSign, { size: 14, className: "inline align-middle mr-1.5" }), "Currency"] }), isEditing ? (_jsx(Select, { value: formData.currency, onChange: (value) => setFormData({
+                                        ...formData,
+                                        currency: value,
+                                    }), options: CURRENCY_OPTIONS })) : (_jsx("p", { className: "text-[15px] py-2.5", children: _jsx("span", { className: "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-full bg-stone-100 text-slate-500", children: state.currency }) }))] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsxs("label", { className: "text-[13px] font-medium text-slate-500", children: [_jsx(PaymentModelIcon, { size: 14, className: "inline align-middle mr-1.5" }), "Payment Model"] }), isEditing ? (_jsx(Select, { value: formData.paymentModel, onChange: (value) => setFormData({
+                                        ...formData,
+                                        paymentModel: value,
+                                    }), options: PAYMENT_MODEL_OPTIONS })) : (_jsx("p", { className: "text-[15px] py-2.5", children: _jsx("span", { className: `inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-full ${state.paymentModel === "MILESTONE" ? "bg-blue-100 text-blue-600" : "bg-amber-100 text-amber-600"}`, children: state.paymentModel === "MILESTONE"
+                                            ? "Milestone-Based"
+                                            : "Time & Materials" }) }))] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx("label", { className: "text-[13px] font-medium text-slate-500", children: "Total Contract Value" }), isEditing ? (_jsx(TextInput, { type: "number", value: formData.totalAmount, onChange: (e) => setFormData({ ...formData, totalAmount: e.target.value }), placeholder: "0.00", step: "0.01" })) : (_jsx("p", { className: `text-lg font-mono font-semibold py-2.5 ${!state.totalAmount ? "text-slate-400 italic text-[15px] font-normal" : "text-slate-800"}`, children: formatAmount(state.totalAmount?.value, state.currency) ||
+                                        "Not set" }))] })] }) })] }));
+}

package/dist/editors/payment-terms/components/styles.d.ts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../editors/payment-terms/components/styles.tsx"],"names":[],"mappings":"AAAA,wBAAgB,kBAAkB,4CAquBjC"}