@flowgram.ai/form-materials 0.2.25 → 0.2.27

package/dist/index.d.mts

@@ -268,6 +268,7 @@ type PropsType$1 = React$1.PropsWithChildren<{
     hasError?: boolean;
     placeholder?: string;
     activeLinePlaceholder?: string;
+    disableMarkdownHighlight?: boolean;
     style?: React$1.CSSProperties;
 }>;
 

package/dist/index.d.ts

@@ -268,6 +268,7 @@ type PropsType$1 = React$1.PropsWithChildren<{
     hasError?: boolean;
     placeholder?: string;
     activeLinePlaceholder?: string;
+    disableMarkdownHighlight?: boolean;
     style?: React$1.CSSProperties;
 }>;
 

package/dist/index.js

@@ -1003,6 +1003,7 @@ var ConstantInputWrapper = import_styled_components2.default.div`
 
 // src/components/json-schema-editor/hooks.tsx
 var import_react6 = require("react");
+var import_lodash2 = require("lodash");
 var _id = 0;
 function genId() {
   return _id++;
@@ -1075,7 +1076,7 @@ function usePropertiesEdit(value, onChange) {
         if (!_property.name) {
           continue;
         }
-        nextProperties[_property.name] = _property;
+        nextProperties[_property.name] = (0, import_lodash2.omit)(_property, ["key", "name", "isPropertyRequired"]);
         if (_property.isPropertyRequired) {
           nextRequired.push(_property.name);
         }
@@ -1737,9 +1738,9 @@ var opConfigs = {
 };
 
 // src/utils/format-legacy-refs/index.ts
-var import_lodash2 = require("lodash");
+var import_lodash3 = require("lodash");
 function formatLegacyRefOnSubmit(value) {
-  if ((0, import_lodash2.isObject)(value)) {
+  if ((0, import_lodash3.isObject)(value)) {
     if (isLegacyFlowRefValueSchema(value)) {
       return formatLegacyRefToNewRef(value);
     }
@@ -1756,7 +1757,7 @@ function formatLegacyRefOnSubmit(value) {
   return value;
 }
 function formatLegacyRefOnInit(value) {
-  if ((0, import_lodash2.isObject)(value)) {
+  if ((0, import_lodash3.isObject)(value)) {
     if (isNewFlowRefValueSchema(value)) {
       return formatNewRefToLegacyRef(value);
     }
@@ -1773,10 +1774,10 @@ function formatLegacyRefOnInit(value) {
   return value;
 }
 function isLegacyFlowRefValueSchema(value) {
-  return (0, import_lodash2.isObject)(value) && Object.keys(value).length === 2 && value.type === "ref" && typeof value.content === "string";
+  return (0, import_lodash3.isObject)(value) && Object.keys(value).length === 2 && value.type === "ref" && typeof value.content === "string";
 }
 function isNewFlowRefValueSchema(value) {
-  return (0, import_lodash2.isObject)(value) && Object.keys(value).length === 2 && value.type === "ref" && Array.isArray(value.content);
+  return (0, import_lodash3.isObject)(value) && Object.keys(value).length === 2 && value.type === "ref" && Array.isArray(value.content);
 }
 function formatLegacyRefToNewRef(value) {
   const keyPath = value.content.split(".");
@@ -1895,7 +1896,7 @@ var import_semi_icons8 = require("@douyinfe/semi-icons");
 
 // src/components/batch-outputs/use-list.ts
 var import_react16 = require("react");
-var import_lodash3 = require("lodash");
+var import_lodash4 = require("lodash");
 var _id2 = 0;
 function genId2() {
   return _id2++;
@@ -1906,7 +1907,7 @@ function useList({ value, onChange }) {
     setList((_prevList) => {
       const newKeys = Object.keys(value || {});
       const oldKeys = _prevList.map((item) => item.key).filter(Boolean);
-      const addKeys = (0, import_lodash3.difference)(newKeys, oldKeys);
+      const addKeys = (0, import_lodash4.difference)(newKeys, oldKeys);
       return _prevList.filter((item) => !item.key || newKeys.includes(item.key)).map((item) => ({
         id: item.id,
         key: item.key,
@@ -2152,7 +2153,8 @@ function PromptEditor(props) {
     activeLinePlaceholder,
     style,
     hasError,
-    children
+    children,
+    disableMarkdownHighlight
   } = props || {};
   const editorRef = (0, import_react24.useRef)(null);
   (0, import_react24.useEffect)(() => {
@@ -2177,7 +2179,7 @@ function PromptEditor(props) {
         onChange({ type: "template", content: e.value });
       }
     }
-  ), activeLinePlaceholder && /* @__PURE__ */ import_react24.default.createElement(import_react25.ActiveLinePlaceholder, null, activeLinePlaceholder), /* @__PURE__ */ import_react24.default.createElement(markdown_default, null), /* @__PURE__ */ import_react24.default.createElement(language_support_default, null), /* @__PURE__ */ import_react24.default.createElement(jinja_default, null), children));
+  ), activeLinePlaceholder && /* @__PURE__ */ import_react24.default.createElement(import_react25.ActiveLinePlaceholder, null, activeLinePlaceholder), !disableMarkdownHighlight && /* @__PURE__ */ import_react24.default.createElement(markdown_default, null), /* @__PURE__ */ import_react24.default.createElement(language_support_default, null), /* @__PURE__ */ import_react24.default.createElement(jinja_default, null), children));
 }
 
 // src/components/prompt-editor-with-variables/index.tsx
@@ -2243,7 +2245,7 @@ function VariableTree() {
 // src/components/prompt-editor-with-variables/extensions/variable-tag.tsx
 var import_react_dom = __toESM(require("react-dom"));
 var import_react28 = __toESM(require("react"));
-var import_lodash4 = require("lodash");
+var import_lodash5 = require("lodash");
 var import_editor7 = require("@flowgram.ai/editor");
 var import_semi_ui13 = require("@douyinfe/semi-ui");
 var import_semi_icons9 = require("@douyinfe/semi-icons");
@@ -2311,7 +2313,7 @@ var VariableTagWidget = class extends import_view3.WidgetType {
       );
       return;
     }
-    const rootField = (0, import_lodash4.last)(v.parentFields);
+    const rootField = (0, import_lodash5.last)(v.parentFields);
     const rootTitle = /* @__PURE__ */ import_react28.default.createElement(UIRootTitle2, null, rootField?.meta.title ? `${rootField.meta.title} -` : "");
     const rootIcon = this.renderIcon(rootField?.meta.icon);
     this.renderReact(
@@ -2345,7 +2347,7 @@ var VariableTagWidget = class extends import_view3.WidgetType {
     return dom;
   }
   eq(other) {
-    return (0, import_lodash4.isEqual)(this.keyPath, other.keyPath);
+    return (0, import_lodash5.isEqual)(this.keyPath, other.keyPath);
   }
   ignoreEvent() {
     return false;
@@ -2407,7 +2409,7 @@ var import_react33 = require("@coze-editor/editor/react");
 
 // src/components/prompt-editor-with-inputs/inputs-picker.tsx
 var import_react31 = __toESM(require("react"));
-var import_lodash5 = require("lodash");
+var import_lodash6 = require("lodash");
 var import_editor8 = require("@flowgram.ai/editor");
 var import_semi_ui14 = require("@douyinfe/semi-ui");
 function InputsPicker({
@@ -2442,7 +2444,7 @@ function InputsPicker({
     const key = keyPath.map((_key, idx) => _key === "[0]" || idx === 0 ? _key : `.${_key}`).join("");
     return {
       key,
-      label: (0, import_lodash5.last)(keyPath),
+      label: (0, import_lodash6.last)(keyPath),
       value: key,
       children
     };
@@ -2904,7 +2906,7 @@ function VariableTree2() {
 // src/components/json-editor-with-variables/extensions/variable-tag.tsx
 var import_react39 = __toESM(require("react"));
 var import_client = require("react-dom/client");
-var import_lodash6 = require("lodash");
+var import_lodash7 = require("lodash");
 var import_editor10 = require("@flowgram.ai/editor");
 var import_semi_ui18 = require("@douyinfe/semi-ui");
 var import_semi_icons10 = require("@douyinfe/semi-icons");
@@ -2969,7 +2971,7 @@ var VariableTagWidget2 = class extends import_view5.WidgetType {
       );
       return;
     }
-    const rootField = (0, import_lodash6.last)(v.parentFields);
+    const rootField = (0, import_lodash7.last)(v.parentFields);
     const rootTitle = /* @__PURE__ */ import_react39.default.createElement(UIRootTitle3, null, rootField?.meta.title ? `${rootField.meta.title} -` : "");
     const rootIcon = this.renderIcon(rootField?.meta.icon);
     this.root.render(
@@ -3003,7 +3005,7 @@ var VariableTagWidget2 = class extends import_view5.WidgetType {
     return dom;
   }
   eq(other) {
-    return (0, import_lodash6.isEqual)(this.keyPath, other.keyPath);
+    return (0, import_lodash7.isEqual)(this.keyPath, other.keyPath);
   }
   ignoreEvent() {
     return false;
@@ -3154,7 +3156,7 @@ var provideBatchOutputsEffect = (0, import_editor12.createEffectFromVariableProv
 });
 
 // src/effects/auto-rename-ref/index.ts
-var import_lodash7 = require("lodash");
+var import_lodash8 = require("lodash");
 var import_editor13 = require("@flowgram.ai/editor");
 var autoRenameRefEffect = [
   {
@@ -3172,9 +3174,30 @@ var autoRenameRefEffect = [
           after.key
         ];
         traverseRef(name, form.getValueIn(name), (_drilldownName, _v) => {
-          if (isRefMatch(_v, beforeKeyPath)) {
-            _v.content = [...afterKeyPath, ...(_v.content || [])?.slice(beforeKeyPath.length)];
-            form.setValueIn(_drilldownName, _v);
+          if (_v.type === "ref") {
+            if (isKeyPathMatch(_v.content, beforeKeyPath)) {
+              _v.content = [...afterKeyPath, ...(_v.content || [])?.slice(beforeKeyPath.length)];
+              form.setValueIn(_drilldownName, _v);
+            }
+          } else if (_v.type === "template") {
+            const templateKeyPaths = getTemplateKeyPaths(_v);
+            let hasMatch = false;
+            templateKeyPaths.forEach((_keyPath) => {
+              if (isKeyPathMatch(_keyPath, beforeKeyPath)) {
+                hasMatch = true;
+                const nextKeyPath = [
+                  ...afterKeyPath,
+                  ...(_keyPath || [])?.slice(beforeKeyPath.length)
+                ];
+                _v.content = _v.content?.replace(
+                  `{{${_keyPath.join(".")}}`,
+                  `{{${nextKeyPath.join(".")}}`
+                );
+              }
+            });
+            if (hasMatch) {
+              form.setValueIn(_drilldownName, { ..._v });
+            }
           }
         });
       });
@@ -3184,24 +3207,37 @@ var autoRenameRefEffect = [
     }
   }
 ];
-function isRefMatch(value, targetKeyPath) {
-  return targetKeyPath.every((_key, index) => _key === value.content?.[index]);
+function isKeyPathMatch(keyPath = [], targetKeyPath) {
+  return targetKeyPath.every((_key, index) => _key === keyPath[index]);
+}
+function getTemplateKeyPaths(value) {
+  const keyPathReg = /{{(.*?)}}/g;
+  return (0, import_lodash8.uniq)(value.content?.match(keyPathReg) || []).map(
+    (_keyPath) => _keyPath.slice(2, -2).split(".")
+  );
 }
 function isRef(value) {
   return value?.type === "ref" && Array.isArray(value?.content) && typeof value?.content[0] === "string";
 }
+function isTemplate(value) {
+  return value?.type === "template" && typeof value?.content === "string";
+}
 function traverseRef(name, value, cb) {
-  if ((0, import_lodash7.isObject)(value)) {
+  if ((0, import_lodash8.isObject)(value)) {
     if (isRef(value)) {
       cb(name, value);
       return;
     }
+    if (isTemplate(value)) {
+      cb(name, value);
+      return;
+    }
     Object.entries(value).forEach(([_key, _value]) => {
       traverseRef(`${name}.${_key}`, _value, cb);
     });
     return;
   }
-  if ((0, import_lodash7.isArray)(value)) {
+  if ((0, import_lodash8.isArray)(value)) {
     value.forEach((_value, idx) => {
       traverseRef(`${name}[${idx}]`, _value, cb);
     });