@flowgram.ai/form-materials 0.3.3 → 0.3.4

package/dist/esm/index.js

@@ -1,5 +1,6 @@
 // src/components/variable-selector/index.tsx
 import React11, { useMemo } from "react";
+import { I18n as I18n7 } from "@flowgram.ai/editor";
 import { Popover } from "@douyinfe/semi-ui";
 import { IconChevronDownStroked, IconIssueStroked } from "@douyinfe/semi-icons";
 
@@ -22,14 +23,24 @@ import { jsonSchemaTypeManager } from "@flowgram.ai/json-schema";
 
 // src/plugins/json-schema-preset/type-definition/string.tsx
 import React from "react";
+import { I18n } from "@flowgram.ai/editor";
 import { Input } from "@douyinfe/semi-ui";
 var stringRegistry = {
   type: "string",
-  ConstantRenderer: (props) => /* @__PURE__ */ React.createElement(Input, { placeholder: "Please Input String", size: "small", disabled: props.readonly, ...props })
+  ConstantRenderer: (props) => /* @__PURE__ */ React.createElement(
+    Input,
+    {
+      placeholder: I18n.t("Please Input String"),
+      size: "small",
+      disabled: props.readonly,
+      ...props
+    }
+  )
 };
 
 // src/plugins/json-schema-preset/type-definition/object.tsx
 import React4 from "react";
+import { I18n as I18n2 } from "@flowgram.ai/editor";
 
 // src/components/code-editor-mini/index.tsx
 import React3 from "react";
@@ -409,7 +420,7 @@ var objectRegistry = {
       value: props.value,
       onChange: (v) => props.onChange?.(v),
       languageId: "json",
-      placeholder: "Please Input Object",
+      placeholder: I18n2.t("Please Input Object"),
       readonly: props.readonly
     }
   )
@@ -417,13 +428,14 @@ var objectRegistry = {
 
 // src/plugins/json-schema-preset/type-definition/number.tsx
 import React5 from "react";
+import { I18n as I18n3 } from "@flowgram.ai/editor";
 import { InputNumber } from "@douyinfe/semi-ui";
 var numberRegistry = {
   type: "number",
   ConstantRenderer: (props) => /* @__PURE__ */ React5.createElement(
     InputNumber,
     {
-      placeholder: "Please Input Number",
+      placeholder: I18n3.t("Please Input Number"),
       size: "small",
       disabled: props.readonly,
       hideButtons: true,
@@ -434,13 +446,14 @@ var numberRegistry = {
 
 // src/plugins/json-schema-preset/type-definition/integer.tsx
 import React6 from "react";
+import { I18n as I18n4 } from "@flowgram.ai/editor";
 import { InputNumber as InputNumber2 } from "@douyinfe/semi-ui";
 var integerRegistry = {
   type: "integer",
   ConstantRenderer: (props) => /* @__PURE__ */ React6.createElement(
     InputNumber2,
     {
-      placeholder: "Please Input Integer",
+      placeholder: I18n4.t("Please Input Integer"),
       size: "small",
       disabled: props.readonly,
       precision: 0,
@@ -451,6 +464,7 @@ var integerRegistry = {
 
 // src/plugins/json-schema-preset/type-definition/boolean.tsx
 import React7 from "react";
+import { I18n as I18n5 } from "@flowgram.ai/editor";
 import { Select } from "@douyinfe/semi-ui";
 var booleanRegistry = {
   type: "boolean",
@@ -459,12 +473,12 @@ var booleanRegistry = {
     return /* @__PURE__ */ React7.createElement(
       Select,
       {
-        placeholder: "Please Select Boolean",
+        placeholder: I18n5.t("Please Select Boolean"),
         size: "small",
         disabled: props.readonly,
         optionList: [
-          { label: "True", value: 1 },
-          { label: "False", value: 0 }
+          { label: I18n5.t("True"), value: 1 },
+          { label: I18n5.t("False"), value: 0 }
         ],
         value: value ? 1 : 0,
         onChange: (value2) => onChange?.(!!value2),
@@ -476,6 +490,7 @@ var booleanRegistry = {
 
 // src/plugins/json-schema-preset/type-definition/array.tsx
 import React8 from "react";
+import { I18n as I18n6 } from "@flowgram.ai/editor";
 var arrayRegistry = {
   type: "array",
   ConstantRenderer: (props) => /* @__PURE__ */ React8.createElement(
@@ -484,7 +499,7 @@ var arrayRegistry = {
       value: props.value,
       languageId: "json",
       onChange: (v) => props.onChange?.(v),
-      placeholder: "Please Input Array",
+      placeholder: I18n6.t("Please Input Array"),
       readonly: props.readonly
     }
   )
@@ -735,7 +750,7 @@ var VariableSelector = ({
       showClear: false,
       arrowIcon: /* @__PURE__ */ React11.createElement(IconChevronDownStroked, { size: "small" }),
       triggerRender,
-      placeholder: config?.placeholder ?? "Select Variable"
+      placeholder: config?.placeholder ?? I18n7.t("Select Variable")
     }
   ));
 };
@@ -744,7 +759,6 @@ var VariableSelector = ({
 import React12, { useMemo as useMemo2 } from "react";
 import { Cascader, Icon as Icon2, IconButton } from "@douyinfe/semi-ui";
 var labelStyle = { display: "flex", alignItems: "center", gap: 5 };
-var firstUppercase = (str) => str.charAt(0).toUpperCase() + str.slice(1);
 var getTypeSelectValue = (value) => {
   if (value?.type === "array" && value?.items) {
     return [value.type, ...getTypeSelectValue(value.items) || []];
@@ -767,7 +781,7 @@ function TypeSelector(props) {
     () => typeManager.getTypeRegistriesWithParentType().map((_type) => {
       const isArray2 = _type.type === "array";
       return {
-        label: /* @__PURE__ */ React12.createElement("div", { style: labelStyle }, /* @__PURE__ */ React12.createElement(Icon2, { size: "small", svg: _type.icon }), firstUppercase(_type.type)),
+        label: /* @__PURE__ */ React12.createElement("div", { style: labelStyle }, /* @__PURE__ */ React12.createElement(Icon2, { size: "small", svg: _type.icon }), typeManager.getTypeBySchema(_type)?.label || _type.type),
         value: _type.type,
         children: isArray2 ? typeManager.getTypeRegistriesWithParentType("array").map((_type2) => ({
           label: /* @__PURE__ */ React12.createElement("div", { style: labelStyle }, /* @__PURE__ */ React12.createElement(
@@ -779,7 +793,7 @@ function TypeSelector(props) {
                 items: { type: _type2.type }
               })
             }
-          ), firstUppercase(_type2.type)),
+          ), typeManager.getTypeBySchema(_type2)?.label || _type2.type),
           value: _type2.type
         })) : []
       };
@@ -804,6 +818,7 @@ function TypeSelector(props) {
 
 // src/components/json-schema-editor/index.tsx
 import React17, { useMemo as useMemo5, useState as useState4 } from "react";
+import { I18n as I18n8 } from "@flowgram.ai/editor";
 import { Button, Checkbox, IconButton as IconButton3 } from "@douyinfe/semi-ui";
 import {
   IconExpand,
@@ -1418,22 +1433,22 @@ function PropertyEdit(props) {
         onClick: onRemove
       }
     ))),
-    expand && /* @__PURE__ */ React17.createElement(UIExpandDetail, null, /* @__PURE__ */ React17.createElement(UILabel, null, config?.descTitle ?? "Description"), /* @__PURE__ */ React17.createElement(
+    expand && /* @__PURE__ */ React17.createElement(UIExpandDetail, null, /* @__PURE__ */ React17.createElement(UILabel, null, config?.descTitle ?? I18n8.t("Description")), /* @__PURE__ */ React17.createElement(
       BlurInput,
       {
         disabled: readonly,
         size: "small",
         value: description,
         onChange: (value2) => onChange("description", value2),
-        placeholder: config?.descPlaceholder ?? "Help LLM to understand the property"
+        placeholder: config?.descPlaceholder ?? I18n8.t("Help LLM to understand the property")
       }
-    ), $level === 0 && type && type !== "array" && /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(UILabel, { style: { marginTop: 10 } }, config?.defaultValueTitle ?? "Default Value"), /* @__PURE__ */ React17.createElement(DefaultValueWrapper, null, /* @__PURE__ */ React17.createElement(
+    ), $level === 0 && type && type !== "array" && /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(UILabel, { style: { marginTop: 10 } }, config?.defaultValueTitle ?? I18n8.t("Default Value")), /* @__PURE__ */ React17.createElement(DefaultValueWrapper, null, /* @__PURE__ */ React17.createElement(
       DefaultValue,
       {
         value: defaultValue,
         schema: value,
         type,
-        placeholder: config?.defaultValuePlaceholder,
+        placeholder: config?.defaultValuePlaceholder ?? I18n8.t("Default Value"),
         jsonFormatText: config?.jsonFormatText,
         onChange: (value2) => onChange("default", value2)
       }
@@ -1654,6 +1669,7 @@ function DynamicValueInput({
 
 // src/components/condition-row/index.tsx
 import React21, { useMemo as useMemo9 } from "react";
+import { I18n as I18n10 } from "@flowgram.ai/editor";
 import { Input as Input4 } from "@douyinfe/semi-ui";
 
 // src/components/condition-row/styles.tsx
@@ -1684,7 +1700,7 @@ import { JsonSchemaUtils as JsonSchemaUtils4 } from "@flowgram.ai/json-schema";
 import { useScopeAvailable as useScopeAvailable2 } from "@flowgram.ai/editor";
 
 // src/components/condition-row/constants.ts
-var rules = {
+var defaultRules = {
   string: {
     ["eq" /* EQ */]: "string",
     ["neq" /* NEQ */]: "string",
@@ -1740,7 +1756,7 @@ var rules = {
     ["is_not_empty" /* IS_NOT_EMPTY */]: null
   }
 };
-var opConfigs = {
+var defaultOpConfigs = {
   ["eq" /* EQ */]: {
     label: "Equal",
     abbreviation: "="
@@ -1804,8 +1820,9 @@ var opConfigs = {
 };
 
 // src/components/condition-row/hooks/useRule.ts
-function useRule(left) {
+function useRule(left, userRules) {
   const available = useScopeAvailable2();
+  const rules = useMemo7(() => ({ ...defaultRules, ...userRules || {} }), [userRules]);
   const variable = useMemo7(() => {
     if (!left) return void 0;
     return available.getByKeyPath(left.content);
@@ -1814,23 +1831,26 @@ function useRule(left) {
     if (!variable) return void 0;
     const schema = JsonSchemaUtils4.astToSchema(variable.type, { drilldown: false });
     return rules[schema?.type];
-  }, [variable?.type]);
+  }, [variable?.type, rules]);
   return { rule };
 }
 
 // src/components/condition-row/hooks/useOp.tsx
 import React20, { useMemo as useMemo8 } from "react";
+import { I18n as I18n9 } from "@flowgram.ai/editor";
 import { Button as Button2, Select as Select2 } from "@douyinfe/semi-ui";
 import { IconChevronDownStroked as IconChevronDownStroked2 } from "@douyinfe/semi-icons";
-function useOp({ rule, op, onChange, readonly }) {
+function useOp({ rule, op, onChange, readonly, userOps }) {
   const options = useMemo8(
     () => Object.keys(rule || {}).map((_op) => ({
-      ...opConfigs[_op] || {},
-      value: _op
+      ...defaultOpConfigs[_op] || {},
+      ...userOps?.[_op] || {},
+      value: _op,
+      label: I18n9.t(userOps?.[_op]?.label || defaultOpConfigs[_op]?.label)
     })),
-    [rule]
+    [rule, userOps]
   );
-  const opConfig = useMemo8(() => opConfigs[op], [op]);
+  const opConfig = useMemo8(() => defaultOpConfigs[op], [op]);
   const renderOpSelect = () => /* @__PURE__ */ React20.createElement(
     Select2,
     {
@@ -1849,17 +1869,28 @@ function useOp({ rule, op, onChange, readonly }) {
 }
 
 // src/components/condition-row/index.tsx
-function ConditionRow({ style, value, onChange, readonly }) {
+var defaultRuleConfig = {
+  ops: {},
+  rules: {}
+};
+function ConditionRow({
+  style,
+  value,
+  onChange,
+  readonly,
+  ruleConfig = defaultRuleConfig
+}) {
   const { left, operator, right } = value || {};
-  const { rule } = useRule(left);
+  const { rule } = useRule(left, ruleConfig.rules);
   const { renderOpSelect, opConfig } = useOp({
     rule,
     op: operator,
     onChange: (v) => onChange({ ...value, operator: v }),
-    readonly
+    readonly,
+    userOps: ruleConfig.ops
   });
   const targetSchema = useMemo9(() => {
-    const targetType = rule?.[operator] || null;
+    const targetType = rule?.[operator || ""] || null;
     return targetType ? { type: targetType, extra: { weak: true } } : null;
   }, [rule, opConfig]);
   return /* @__PURE__ */ React21.createElement(UIContainer3, { style }, /* @__PURE__ */ React21.createElement(UIOperator, null, renderOpSelect()), /* @__PURE__ */ React21.createElement(UIValues, null, /* @__PURE__ */ React21.createElement(UILeft, null, /* @__PURE__ */ React21.createElement(
@@ -1890,7 +1921,7 @@ function ConditionRow({ style, value, onChange, readonly }) {
       size: "small",
       disabled: true,
       style: { pointerEvents: "none" },
-      value: opConfig?.rightDisplay || "Empty"
+      value: opConfig?.rightDisplay || I18n10.t("Empty")
     }
   ))));
 }