@powerhousedao/service-offering 0.0.1

package/dist/editors/resource-template-editor/components/markdown-editor.d.ts

@@ -0,0 +1,12 @@
+export type MarkdownEditorMode = "preview" | "edit" | "live";
+interface MarkdownEditorProps {
+    value: string | null;
+    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=markdown-editor.d.ts.map

package/dist/editors/resource-template-editor/components/markdown-editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"markdown-editor.d.ts","sourceRoot":"","sources":["../../../../editors/resource-template-editor/components/markdown-editor.tsx"],"names":[],"mappings":"AAeA,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAE7D,UAAU,mBAAmB;IAC3B,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,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,2CA0LrB"}

package/dist/editors/resource-template-editor/components/markdown-editor.js

@@ -0,0 +1,132 @@
+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
+    const editorMode = viewMarkdownMode;
+    // 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 -- dynamic import of untyped @uiw/react-md-editor
+                const module = await import("@uiw/react-md-editor");
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-member-access -- module.default from dynamic import
+                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) {
+            // Handle null/undefined but preserve empty strings, whitespace, and newlines
+            const stringValue = value ?? "";
+            setContentValue(stringValue);
+        }
+    }, [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 && previewLi.classList.contains("active")) {
+                setViewMarkdownMode("preview");
+            }
+            if (editLi && editLi.classList.contains("active")) {
+                setViewMarkdownMode("edit");
+            }
+            if (liveLi && 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) => {
+        // Handle null/undefined but preserve all string content including empty strings
+        const stringValue = newValue ?? "";
+        setContentValue(stringValue);
+        onChange(stringValue);
+    };
+    // 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 border border-gray-300 rounded-md p-3 bg-white", style: { height: `${height}px` }, children: _jsx("div", { className: "w-full h-full flex items-center justify-center text-gray-500", children: "Loading editor..." }) })), isLoaded && loadError && (_jsx("div", { className: "w-full border border-red-300 rounded-md p-3 bg-red-50", style: { height: `${height}px` }, children: _jsxs("div", { className: "w-full h-full flex flex-col items-center justify-center text-red-600", children: [_jsx("p", { className: "text-sm font-medium mb-2", children: "Failed to load markdown editor" }), _jsx("p", { className: "text-xs text-red-500", children: loadError }), _jsx("textarea", { className: "w-full h-full mt-2 p-2 border border-gray-300 rounded 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/resource-template-editor/editor.d.ts

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

package/dist/editors/resource-template-editor/editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/resource-template-editor/editor.tsx"],"names":[],"mappings":"AAKA,MAAM,CAAC,OAAO,UAAU,sBAAsB,4CAgC7C"}

package/dist/editors/resource-template-editor/editor.js

@@ -0,0 +1,146 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DocumentToolbar } from "@powerhousedao/design-system/connect";
+import { useSelectedResourceTemplateDocument } from "../../document-models/resource-template/hooks.js";
+import { TemplateInfo } from "./components/TemplateInfo.js";
+import { FacetTargeting } from "./components/FacetTargeting.js";
+export default function ResourceTemplateEditor() {
+    const [document, dispatch] = useSelectedResourceTemplateDocument();
+    return (_jsxs("div", { className: "rt-editor", children: [_jsx("style", { children: editorStyles }), _jsx(DocumentToolbar, {}), _jsxs("div", { className: "rt-editor__container", children: [_jsxs("div", { className: "rt-editor__header", children: [_jsxs("div", { className: "rt-editor__header-badge", children: [_jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: _jsx("path", { d: "M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m0 12.75h7.5m-7.5 3H12M10.5 2.25H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" }) }), "Product Information"] }), _jsx("p", { className: "rt-editor__header-desc", children: "Define the base configuration for resources. These templates can be used to create Service Offerings." })] }), _jsxs("div", { className: "rt-editor__content", children: [_jsx(TemplateInfo, { document: document, dispatch: dispatch }), _jsx(FacetTargeting, { document: document, dispatch: dispatch })] })] })] }));
+}
+const editorStyles = `
+  @import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=DM+Mono:wght@400;500&display=swap');
+
+  .rt-editor {
+    --rt-font-sans: 'DM Sans', system-ui, sans-serif;
+    --rt-font-mono: 'DM Mono', 'SF Mono', monospace;
+
+    --rt-slate-50: #f8fafc;
+    --rt-slate-100: #f1f5f9;
+    --rt-slate-200: #e2e8f0;
+    --rt-slate-300: #cbd5e1;
+    --rt-slate-400: #94a3b8;
+    --rt-slate-500: #64748b;
+    --rt-slate-600: #475569;
+    --rt-slate-700: #334155;
+    --rt-slate-800: #1e293b;
+    --rt-slate-900: #0f172a;
+
+    --rt-teal-50: #f0fdfa;
+    --rt-teal-100: #ccfbf1;
+    --rt-teal-200: #99f6e4;
+    --rt-teal-500: #14b8a6;
+    --rt-teal-600: #0d9488;
+    --rt-teal-700: #0f766e;
+
+    --rt-radius-sm: 6px;
+    --rt-radius-md: 10px;
+    --rt-radius-lg: 14px;
+    --rt-radius-xl: 20px;
+
+    --rt-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
+    --rt-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.06), 0 1px 3px rgba(15, 23, 42, 0.04);
+    --rt-shadow-lg: 0 10px 40px rgba(15, 23, 42, 0.08), 0 2px 8px rgba(15, 23, 42, 0.04);
+
+    --rt-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
+    --rt-transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
+    --rt-transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
+
+    font-family: var(--rt-font-sans);
+    background: linear-gradient(135deg, var(--rt-teal-50) 0%, var(--rt-slate-50) 50%, #f0f4f8 100%);
+    min-height: 100%;
+    overflow-y: auto;
+  }
+
+  .rt-editor__container {
+    max-width: 1400px;
+    margin: 0 auto;
+    padding: 24px 32px 48px;
+  }
+
+  .rt-editor__header {
+    margin-bottom: 24px;
+    padding-bottom: 20px;
+    border-bottom: 1px solid var(--rt-slate-200);
+  }
+
+  .rt-editor__header-badge {
+    display: inline-flex;
+    align-items: center;
+    gap: 8px;
+    padding: 8px 16px;
+    background: var(--rt-teal-100);
+    color: var(--rt-teal-700);
+    border-radius: 100px;
+    font-size: 0.875rem;
+    font-weight: 600;
+    margin-bottom: 12px;
+  }
+
+  .rt-editor__header-badge svg {
+    width: 18px;
+    height: 18px;
+  }
+
+  .rt-editor__header-desc {
+    font-size: 0.9375rem;
+    color: var(--rt-slate-600);
+    margin: 0;
+    max-width: 600px;
+    line-height: 1.6;
+  }
+
+  .rt-editor__content {
+    min-height: 500px;
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
+    animation: rt-fade-in var(--rt-transition-slow) ease-out;
+  }
+
+  @keyframes rt-fade-in {
+    from { opacity: 0; transform: translateY(8px); }
+    to { opacity: 1; transform: translateY(0); }
+  }
+
+  .rt-empty-state {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    min-height: 100vh;
+    text-align: center;
+    padding: 48px;
+  }
+
+  .rt-empty-state__icon {
+    width: 80px;
+    height: 80px;
+    margin-bottom: 24px;
+    color: var(--rt-teal-300);
+    animation: rt-float 3s ease-in-out infinite;
+  }
+
+  .rt-empty-state__icon svg {
+    width: 100%;
+    height: 100%;
+  }
+
+  @keyframes rt-float {
+    0%, 100% { transform: translateY(0); }
+    50% { transform: translateY(-8px); }
+  }
+
+  .rt-empty-state__title {
+    font-size: 1.5rem;
+    font-weight: 600;
+    color: var(--rt-slate-700);
+    margin: 0 0 8px;
+    letter-spacing: -0.02em;
+  }
+
+  .rt-empty-state__subtitle {
+    font-size: 1rem;
+    color: var(--rt-slate-500);
+    margin: 0;
+  }
+`;

package/dist/editors/resource-template-editor/module.d.ts

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

package/dist/editors/resource-template-editor/module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../../../editors/resource-template-editor/module.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAGnD,sFAAsF;AACtF,eAAO,MAAM,sBAAsB,EAAE,YAOpC,CAAC"}

package/dist/editors/resource-template-editor/module.js

@@ -0,0 +1,10 @@
+import { lazy } from "react";
+/** Document editor module for the "["powerhouse/resource-template"]" document type */
+export const ResourceTemplateEditor = {
+    Component: lazy(() => import("./editor.js")),
+    documentTypes: ["powerhouse/resource-template"],
+    config: {
+        id: "resource-template-editor",
+        name: "Resource Template Editor",
+    },
+};

package/dist/editors/service-offering-editor/components/EditName.d.ts

@@ -0,0 +1,3 @@
+/** Displays the name of the selected ServiceOffering document and allows editing it */
+export declare function EditServiceOfferingName(): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=EditName.d.ts.map

package/dist/editors/service-offering-editor/components/EditName.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditName.d.ts","sourceRoot":"","sources":["../../../../editors/service-offering-editor/components/EditName.tsx"],"names":[],"mappings":"AAKA,uFAAuF;AACvF,wBAAgB,uBAAuB,mDAwEtC"}

package/dist/editors/service-offering-editor/components/EditName.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { setName } from "document-model";
+import { useState } from "react";
+import { useSelectedServiceOfferingDocument } from "@powerhousedao/service-offering/document-models/service-offering";
+/** Displays the name of the selected ServiceOffering document and allows editing it */
+export function EditServiceOfferingName() {
+    const [serviceOfferingDocument, dispatch] = useSelectedServiceOfferingDocument();
+    const [isEditing, setIsEditing] = useState(false);
+    if (!serviceOfferingDocument)
+        return null;
+    const serviceOfferingDocumentName = serviceOfferingDocument.header.name;
+    const onClickEditServiceOfferingName = () => {
+        setIsEditing(true);
+    };
+    const onClickCancelEditServiceOfferingName = () => {
+        setIsEditing(false);
+    };
+    const onSubmitSetName = (event) => {
+        event.preventDefault();
+        const form = event.currentTarget;
+        const nameInput = form.elements.namedItem("name");
+        const name = nameInput.value;
+        if (!name)
+            return;
+        dispatch(setName(name));
+        setIsEditing(false);
+    };
+    if (isEditing)
+        return (_jsxs("form", { className: "flex gap-2 items-center justify-between", onSubmit: onSubmitSetName, children: [_jsx("input", { className: "text-lg font-semibold text-gray-900 p-1", type: "text", name: "name", defaultValue: serviceOfferingDocumentName, autoFocus: true }), _jsxs("div", { className: "flex gap-2", children: [_jsx("button", { type: "submit", className: "text-sm text-gray-600", children: "Save" }), _jsx("button", { className: "text-sm text-red-800", onClick: onClickCancelEditServiceOfferingName, children: "Cancel" })] })] }));
+    return (_jsxs("div", { className: "flex justify-between items-center", children: [_jsx("h2", { className: "text-lg font-semibold text-gray-900", children: serviceOfferingDocumentName }), _jsx("button", { className: "text-sm text-gray-600", onClick: onClickEditServiceOfferingName, children: "Edit Name" })] }));
+}

package/dist/editors/service-offering-editor/components/MarkdownPreview.d.ts

@@ -0,0 +1,8 @@
+interface MarkdownPreviewProps {
+    content: string;
+    maxLength?: number;
+    className?: string;
+}
+export declare function MarkdownPreview({ content, maxLength, className, }: MarkdownPreviewProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MarkdownPreview.d.ts.map

package/dist/editors/service-offering-editor/components/MarkdownPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkdownPreview.d.ts","sourceRoot":"","sources":["../../../../editors/service-offering-editor/components/MarkdownPreview.tsx"],"names":[],"mappings":"AAGA,UAAU,oBAAoB;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,eAAe,CAAC,EAC9B,OAAO,EACP,SAAe,EACf,SAAc,GACf,EAAE,oBAAoB,2CA2HtB"}

package/dist/editors/service-offering-editor/components/MarkdownPreview.js

@@ -0,0 +1,87 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { ChevronDown, ChevronUp } from "lucide-react";
+export function MarkdownPreview({ content, maxLength = 300, className = "", }) {
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+    const [MarkdownRenderer, setMarkdownRenderer] = useState(null);
+    const [isExpanded, setIsExpanded] = useState(false);
+    const shouldTruncate = content.length > maxLength;
+    const displayContent = shouldTruncate && !isExpanded
+        ? content.slice(0, maxLength) + "..."
+        : content;
+    useEffect(() => {
+        import("@uiw/react-markdown-preview")
+            .then((module) => {
+            setMarkdownRenderer(() => module.default);
+        })
+            .catch(() => {
+            // Silently fail - will use fallback
+        });
+    }, []);
+    const ExpandButton = () => shouldTruncate ? (_jsx("button", { type: "button", onClick: () => setIsExpanded(!isExpanded), className: "mt-2 inline-flex items-center gap-1 text-sm font-medium text-indigo-600 hover:text-indigo-700 transition-colors", children: isExpanded ? (_jsxs(_Fragment, { children: ["Show less ", _jsx(ChevronUp, { size: 16 })] })) : (_jsxs(_Fragment, { children: ["Read more ", _jsx(ChevronDown, { size: 16 })] })) })) : null;
+    // Fallback to plain text if markdown renderer not loaded
+    if (!MarkdownRenderer) {
+        return (_jsxs("div", { className: className, children: [_jsx("p", { className: "text-slate-600 text-sm leading-relaxed whitespace-pre-wrap", children: displayContent }), _jsx(ExpandButton, {})] }));
+    }
+    return (_jsxs("div", { className: className, children: [_jsx("style", { children: `
+          .markdown-preview-content {
+            font-size: 0.875rem;
+            line-height: 1.625;
+            color: #475569;
+          }
+          .markdown-preview-content p {
+            margin-bottom: 0.75em;
+          }
+          .markdown-preview-content p:last-child {
+            margin-bottom: 0;
+          }
+          .markdown-preview-content h1,
+          .markdown-preview-content h2,
+          .markdown-preview-content h3 {
+            font-weight: 600;
+            color: #1e293b;
+            margin-top: 1em;
+            margin-bottom: 0.5em;
+          }
+          .markdown-preview-content h1 { font-size: 1.25rem; }
+          .markdown-preview-content h2 { font-size: 1.125rem; }
+          .markdown-preview-content h3 { font-size: 1rem; }
+          .markdown-preview-content ul {
+            list-style-type: disc;
+            padding-left: 1.5em;
+            margin-bottom: 0.75em;
+          }
+          .markdown-preview-content ol {
+            list-style-type: decimal;
+            padding-left: 1.5em;
+            margin-bottom: 0.75em;
+          }
+          .markdown-preview-content a {
+            color: #4f46e5;
+            text-decoration: underline;
+          }
+          .markdown-preview-content code {
+            background: #f1f5f9;
+            padding: 0.125em 0.375em;
+            border-radius: 0.25em;
+            font-size: 0.875em;
+          }
+          .markdown-preview-content blockquote {
+            border-left: 3px solid #e2e8f0;
+            padding-left: 1em;
+            color: #64748b;
+            font-style: italic;
+          }
+          .markdown-preview-content strong {
+            font-weight: 600;
+            color: #334155;
+          }
+          /* Hide anchor links on headers */
+          .markdown-preview-content .anchor {
+            display: none;
+          }
+          .markdown-preview-content .octicon {
+            display: none;
+          }
+        ` }), _jsx("div", { className: "markdown-preview-content", "data-color-mode": "light", children: _jsx(MarkdownRenderer, { source: displayContent, disableCopy: true }) }), _jsx(ExpandButton, {})] }));
+}

package/dist/editors/service-offering-editor/components/OfferingInfo.d.ts

@@ -0,0 +1,9 @@
+import type { DocumentDispatch } from "@powerhousedao/reactor-browser";
+import type { ServiceOfferingDocument, ServiceOfferingAction } from "@powerhousedao/service-offering/document-models/service-offering";
+interface OfferingInfoProps {
+    document: ServiceOfferingDocument;
+    dispatch: DocumentDispatch<ServiceOfferingAction>;
+}
+export declare function OfferingInfo({ document, dispatch }: OfferingInfoProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=OfferingInfo.d.ts.map

package/dist/editors/service-offering-editor/components/OfferingInfo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OfferingInfo.d.ts","sourceRoot":"","sources":["../../../../editors/service-offering-editor/components/OfferingInfo.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,KAAK,EACV,uBAAuB,EACvB,qBAAqB,EACtB,MAAM,kEAAkE,CAAC;AAQ1E,UAAU,iBAAiB;IACzB,QAAQ,EAAE,uBAAuB,CAAC;IAClC,QAAQ,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAC;CACnD;AAED,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,iBAAiB,2CAsRrE"}

package/dist/editors/service-offering-editor/components/OfferingInfo.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { updateOfferingInfo, updateOfferingStatus, setOperator, setOfferingId, } from "../../../document-models/service-offering/gen/creators.js";
+export function OfferingInfo({ document, dispatch }) {
+    const { state } = document;
+    const globalState = state.global;
+    const [isEditing, setIsEditing] = useState(false);
+    const [formData, setFormData] = useState({
+        id: globalState.id || "",
+        title: globalState.title || "",
+        summary: globalState.summary || "",
+        infoLink: globalState.infoLink || "",
+        operatorId: globalState.operatorId || "",
+    });
+    const handleSave = () => {
+        if (formData.id && formData.id !== globalState.id) {
+            dispatch(setOfferingId({
+                id: formData.id,
+                lastModified: new Date().toISOString(),
+            }));
+        }
+        if (formData.title !== globalState.title ||
+            formData.summary !== globalState.summary ||
+            formData.infoLink !== globalState.infoLink) {
+            dispatch(updateOfferingInfo({
+                title: formData.title || undefined,
+                summary: formData.summary || undefined,
+                infoLink: formData.infoLink || undefined,
+                lastModified: new Date().toISOString(),
+            }));
+        }
+        if (formData.operatorId && formData.operatorId !== globalState.operatorId) {
+            dispatch(setOperator({
+                operatorId: formData.operatorId,
+                lastModified: new Date().toISOString(),
+            }));
+        }
+        setIsEditing(false);
+    };
+    const handleCancel = () => {
+        setFormData({
+            id: globalState.id || "",
+            title: globalState.title || "",
+            summary: globalState.summary || "",
+            infoLink: globalState.infoLink || "",
+            operatorId: globalState.operatorId || "",
+        });
+        setIsEditing(false);
+    };
+    const statusColors = {
+        DRAFT: "bg-gray-100 text-gray-800",
+        COMING_SOON: "bg-blue-100 text-blue-800",
+        ACTIVE: "bg-green-100 text-green-800",
+        DEPRECATED: "bg-red-100 text-red-800",
+    };
+    return (_jsxs("div", { className: "bg-white rounded-lg shadow-sm p-6", children: [_jsxs("div", { className: "flex items-center justify-between mb-4", children: [_jsx("h2", { className: "text-2xl font-semibold text-gray-900", children: "Offering Information" }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("span", { className: `px-3 py-1 rounded-full text-sm font-medium ${statusColors[globalState.status] || "bg-gray-100 text-gray-800"}`, children: globalState.status }), !isEditing && (_jsx("button", { onClick: () => setIsEditing(true), className: "px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors", children: "Edit" }))] })] }), isEditing ? (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { children: [_jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Offering ID (PHID)" }), _jsx("input", { type: "text", value: formData.id, onChange: (e) => setFormData({ ...formData, id: e.target.value }), className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent", placeholder: "phid:offering-...", disabled: !!globalState.id }), globalState.id && (_jsx("p", { className: "text-sm text-gray-500 mt-1", children: "ID cannot be changed once set" }))] }), _jsxs("div", { children: [_jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Title" }), _jsx("input", { type: "text", value: formData.title, onChange: (e) => setFormData({ ...formData, title: e.target.value }), className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent", placeholder: "e.g., Powerhouse Operational Services" })] }), _jsxs("div", { children: [_jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Summary" }), _jsx("textarea", { value: formData.summary, onChange: (e) => setFormData({ ...formData, summary: e.target.value }), rows: 3, className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent", placeholder: "Brief description of your service offering..." })] }), _jsxs("div", { children: [_jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Info Link (URL)" }), _jsx("input", { type: "url", value: formData.infoLink, onChange: (e) => setFormData({ ...formData, infoLink: e.target.value }), className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent", placeholder: "https://..." })] }), _jsxs("div", { children: [_jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Operator ID (PHID)" }), _jsx("input", { type: "text", value: formData.operatorId, onChange: (e) => setFormData({ ...formData, operatorId: e.target.value }), className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent", placeholder: "phid:operator-..." })] }), _jsxs("div", { className: "flex items-center gap-3 pt-4", children: [_jsx("button", { onClick: handleSave, className: "px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors", children: "Save Changes" }), _jsx("button", { onClick: handleCancel, className: "px-4 py-2 bg-gray-200 text-gray-700 rounded-md hover:bg-gray-300 transition-colors", children: "Cancel" })] })] })) : (_jsxs("div", { className: "space-y-3", children: [globalState.id && (_jsxs("div", { children: [_jsx("span", { className: "text-sm font-medium text-gray-500", children: "ID:" }), _jsx("p", { className: "text-gray-900 font-mono text-sm", children: globalState.id })] })), _jsxs("div", { children: [_jsx("span", { className: "text-sm font-medium text-gray-500", children: "Title:" }), _jsx("p", { className: "text-gray-900", children: globalState.title || "Not set" })] }), _jsxs("div", { children: [_jsx("span", { className: "text-sm font-medium text-gray-500", children: "Summary:" }), _jsx("p", { className: "text-gray-900", children: globalState.summary || "Not set" })] }), globalState.infoLink && (_jsxs("div", { children: [_jsx("span", { className: "text-sm font-medium text-gray-500", children: "Info Link:" }), _jsx("a", { href: globalState.infoLink, target: "_blank", rel: "noopener noreferrer", className: "text-blue-600 hover:underline", children: globalState.infoLink })] })), _jsxs("div", { children: [_jsx("span", { className: "text-sm font-medium text-gray-500", children: "Operator:" }), _jsx("p", { className: "text-gray-900 font-mono text-sm", children: globalState.operatorId || "Not set" })] }), globalState.lastModified && (_jsxs("div", { children: [_jsx("span", { className: "text-sm font-medium text-gray-500", children: "Last Modified:" }), _jsx("p", { className: "text-gray-900 text-sm", children: new Date(globalState.lastModified).toLocaleString() })] }))] })), !isEditing && (_jsxs("div", { className: "mt-6 pt-6 border-t border-gray-200", children: [_jsx("label", { className: "block text-sm font-medium text-gray-700 mb-2", children: "Change Status" }), _jsx("div", { className: "flex items-center gap-2", children: ["DRAFT", "COMING_SOON", "ACTIVE", "DEPRECATED"].map((status) => (_jsx("button", { onClick: () => dispatch(updateOfferingStatus({
+                                status: status,
+                                lastModified: new Date().toISOString(),
+                            })), disabled: globalState.status === status, className: `px-3 py-1 rounded-md text-sm font-medium transition-colors ${globalState.status === status
+                                ? "bg-gray-300 text-gray-500 cursor-not-allowed"
+                                : "bg-gray-100 text-gray-700 hover:bg-gray-200"}`, children: status.replace("_", " ") }, status))) })] }))] }));
+}

package/dist/editors/service-offering-editor/components/OfferingProgress.d.ts

@@ -0,0 +1,10 @@
+import type { ServiceOfferingDocument } from "@powerhousedao/service-offering/document-models/service-offering";
+import type { TabId } from "./TabNavigation.js";
+interface OfferingProgressProps {
+    document: ServiceOfferingDocument;
+    activeTab: TabId;
+    onTabChange: (tabId: TabId) => void;
+}
+export declare function OfferingProgress({ document, activeTab, onTabChange, }: OfferingProgressProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=OfferingProgress.d.ts.map

package/dist/editors/service-offering-editor/components/OfferingProgress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OfferingProgress.d.ts","sourceRoot":"","sources":["../../../../editors/service-offering-editor/components/OfferingProgress.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kEAAkE,CAAC;AAChH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAEhD,UAAU,qBAAqB;IAC7B,QAAQ,EAAE,uBAAuB,CAAC;IAClC,SAAS,EAAE,KAAK,CAAC;IACjB,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CACrC;AAyCD,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,WAAW,GACZ,EAAE,qBAAqB,2CAoHvB"}