@sustaina/shared-ui 1.25.0 → 1.26.0

package/dist/index.d.mts

@@ -568,6 +568,7 @@ type FormulaEditorProps = {
     onSelectSuggestion?: (token: FormulaTokenAttributes, config: FormulaTokenConfig) => void;
     field?: ControllerRenderProps<any, any>;
     fieldState?: ControllerFieldState;
+    mode?: "edit" | "display";
 };
 
 declare const FormulaEditor: React__default.FC<FormulaEditorProps>;

package/dist/index.d.ts

@@ -568,6 +568,7 @@ type FormulaEditorProps = {
     onSelectSuggestion?: (token: FormulaTokenAttributes, config: FormulaTokenConfig) => void;
     field?: ControllerRenderProps<any, any>;
     fieldState?: ControllerFieldState;
+    mode?: "edit" | "display";
 };
 
 declare const FormulaEditor: React__default.FC<FormulaEditorProps>;

package/dist/index.js

@@ -6305,7 +6305,8 @@ var FormulaEditor = ({
   onChange,
   onSelectSuggestion,
   field,
-  fieldState
+  fieldState,
+  mode = "edit"
 }) => {
   const [isExpanded, setIsExpanded] = React4.useState(false);
   const lastEmittedValueRef = React4.useRef(null);
@@ -6322,27 +6323,22 @@ var FormulaEditor = ({
   const prefixMap = React4.useMemo(() => buildPrefixMap(normalizedConfigs), [normalizedConfigs]);
   const configLookup = React4.useMemo(() => {
     const lookup = /* @__PURE__ */ new Map();
-    normalizedConfigs.forEach((config) => {
-      lookup.set(config.prefix, config);
-    });
+    normalizedConfigs.forEach((config) => lookup.set(config.prefix, config));
     return lookup;
   }, [normalizedConfigs]);
   const allowedOperators = React4.useMemo(() => operators.map((operator) => operator.value), [operators]);
   const displayError = errorMessage ?? fieldState?.error?.message;
   const hasError = Boolean(displayError);
-  const isInteractionDisabled = Boolean(disabled || loading);
+  const isEditorReadOnly = mode === "display";
+  const isEditorDisabled = disabled || loading || isEditorReadOnly;
   const convertValueToContent = React4.useCallback(
     (input) => {
       if (!input) return "";
       const trimmed = input.trim();
       if (!trimmed) return "";
       const parsedJSON = tryParseJSON(trimmed);
-      if (parsedJSON && parsedJSON.type === "doc") {
-        return parsedJSON;
-      }
-      if (looksLikeHTML(trimmed)) {
-        return input;
-      }
+      if (parsedJSON && parsedJSON.type === "doc") return parsedJSON;
+      if (looksLikeHTML(trimmed)) return input;
       return buildDocFromRaw(input, prefixMap, configLookup);
     },
     [configLookup, prefixMap]
@@ -6373,7 +6369,7 @@ var FormulaEditor = ({
           hasError ? "border border-destructive" : "border focus-visible:border-ring",
           "w-full rounded-lg bg-white px-4 py-3",
           "overflow-y-auto whitespace-pre-wrap wrap-break-word focus:outline-none",
-          isInteractionDisabled && "pointer-events-none opacity-60",
+          isEditorDisabled && "pointer-events-none",
           editorClassName
         ),
         ...loading ? { "aria-busy": "true" } : {}
@@ -6382,8 +6378,8 @@ var FormulaEditor = ({
   });
   React4.useEffect(() => {
     if (!editor) return;
-    editor.setEditable(!isInteractionDisabled);
-  }, [editor, isInteractionDisabled]);
+    editor.setEditable(!isEditorDisabled);
+  }, [editor, isEditorDisabled]);
   React4.useEffect(() => {
     if (!editor || resolvedContent === void 0) return;
     if (ignorePropValueRef.current && typeof value === "string" && value === lastEmittedValueRef.current) {
@@ -6417,9 +6413,7 @@ var FormulaEditor = ({
         className: "relative",
         "aria-busy": loading,
         onFocus: () => {
-          if (editor && !editor.isFocused) {
-            editor.chain().focus().run();
-          }
+          if (editor && !editor.isFocused) editor.chain().focus().run();
         },
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(react.EditorContent, { editor }),
@@ -6431,14 +6425,14 @@ var FormulaEditor = ({
               spinnerClassName: "size-6 text-sus-blue-3"
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(
+          !isEditorReadOnly && /* @__PURE__ */ jsxRuntime.jsx(
             Button,
             {
               type: "button",
               variant: "ghost",
               size: "icon",
               className: "absolute bottom-2 right-4 h-6 w-6 rounded-full bg-white shadow",
-              disabled: isInteractionDisabled,
+              disabled: isEditorDisabled,
               onClick: () => setIsExpanded((prev) => !prev),
               children: isExpanded ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Minimize2, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Maximize2, { className: "h-4 w-4" })
             }
@@ -6447,13 +6441,13 @@ var FormulaEditor = ({
       }
     ),
     hasError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-destructive", role: "alert", children: displayError }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap justify-end gap-2 py-2", children: operators.map((operator) => /* @__PURE__ */ jsxRuntime.jsx(
+    mode === "edit" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap justify-end gap-2 py-2", children: operators.map((operator) => /* @__PURE__ */ jsxRuntime.jsx(
       Button,
       {
         type: "button",
         onClick: () => insertOperator(operator.value),
         className: "min-w-10 rounded-sm px-3 bg-sus-blue-3",
-        disabled: isInteractionDisabled,
+        disabled: isEditorDisabled,
         children: operator.label
       },
       operator.value