feat: manually mirror opencoze's code from bytedance

Change-Id: I09a73aadda978ad9511264a756b2ce51f5761adf

frontend/packages/common/biz-components/stories/parameters/index.stories.tsx

@@ -0,0 +1,193 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import React from 'react';
+
+import type { Meta, StoryObj } from '@storybook/react';
+import { useArgs } from '@storybook/client-api';
+
+import { Parameters, ParamTypeAlias } from '../../src/parameters';
+import type { ParameterValue } from '../../src/parameters';
+
+const meta: Meta<typeof Parameters> = {
+  title: 'Biz Components/Parameters',
+  component: Parameters,
+  parameters: {
+    actions: { argTypesRegex: '^on.*' },
+    layout: 'centered',
+  },
+  render: args => {
+    // eslint-disable-next-line react-hooks/rules-of-hooks -- linter-disable-autofix
+    const [, updateArgs] = useArgs();
+    const handleChange = (value: ParameterValue[]) => {
+      updateArgs({ ...args, value });
+    };
+    return <Parameters {...args} onChange={handleChange} />;
+  },
+  argTypes: {
+    value: {
+      description: '值',
+      table: {
+        type: { summary: 'ParameterValue[]' },
+      },
+    },
+    readonly: {
+      description: '启用只读',
+      type: 'boolean',
+      table: {
+        type: { summary: 'Boolean' },
+      },
+    },
+    withDescription: {
+      description: '启用描述',
+      defaultValue: false,
+      table: {
+        type: { summary: 'Boolean' },
+      },
+    },
+    errors: {
+      control: 'object',
+      description: '失焦时触发',
+      table: {
+        type: { summary: 'ParametersError[]' },
+      },
+    },
+    disabledTypes: {
+      description: '禁用可选参数类型',
+      control: 'multi-select',
+      options: {
+        String: ParamTypeAlias.String,
+        Integer: ParamTypeAlias.Integer,
+        Boolean: ParamTypeAlias.Boolean,
+        Number: ParamTypeAlias.Number,
+        Object: ParamTypeAlias.Object,
+        ArrayString: ParamTypeAlias.ArrayString,
+        ArrayInteger: ParamTypeAlias.ArrayInteger,
+        ArrayBoolean: ParamTypeAlias.ArrayBoolean,
+        ArrayNumber: ParamTypeAlias.ArrayNumber,
+      },
+      table: {
+        type: { summary: 'ParamTypeAlias' },
+      },
+    },
+    allowValueEmpty: {
+      defaultValue: false,
+      type: 'boolean',
+      table: {
+        type: { summary: 'Boolean' },
+      },
+    },
+    className: {
+      description: '样式类',
+      table: {
+        type: { summary: 'String' },
+      },
+    },
+    style: {
+      description: '样式对象',
+      table: {
+        type: { summary: 'CSSProperties' },
+      },
+    },
+    onChange: {
+      description: '监听值变化',
+      table: {
+        type: { summary: '(value: ParameterValue[]) => void' },
+      },
+    },
+  },
+  args: {
+    value: [
+      {
+        key: '1',
+        type: ParamTypeAlias.ArrayObject,
+        name: 'outputList',
+        description: '输出',
+        children: [
+          {
+            key: '1-1',
+            name: 'name',
+            type: ParamTypeAlias.ArrayString,
+            description: '名称',
+            children: [
+              {
+                key: '1-1-1',
+                name: 'sub-name',
+                type: ParamTypeAlias.String,
+              },
+            ],
+          },
+          {
+            key: '1-2',
+            name: 'type',
+            type: ParamTypeAlias.Integer,
+            description: '类型',
+          },
+          {
+            key: '1-3',
+            name: 'description',
+            type: ParamTypeAlias.String,
+            description: '描述',
+          },
+        ],
+      },
+    ],
+    withDescription: true,
+    readonly: false,
+    errors: [],
+    disabledTypes: [],
+    className: '',
+    allowValueEmpty: false,
+    style: {
+      width: 500,
+    },
+  },
+  tags: ['autodocs'],
+};
+
+export default meta;
+
+type Story = StoryObj<typeof Parameters>;
+
+export const Base: Story = {};
+
+export const WithDescription: Story = { args: { withDescription: true } };
+
+export const Readonly: Story = { args: { readonly: true } };
+
+export const Error: Story = {
+  args: { errors: [{ path: '0.children.0.name', message: '名称最小长度10' }] },
+  parameters: {
+    docs: {
+      description: {
+        story: '目前只支持名称展示错误 失焦时触发',
+      },
+    },
+  },
+};
+
+export const DisableTypes: Story = {
+  args: {
+    disabledTypes: [ParamTypeAlias.ArrayString, ParamTypeAlias.ArrayInteger],
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: '可配置多个禁用类型',
+      },
+    },
+  },
+};

frontend/packages/common/biz-components/stories/parameters/valid-value.ts

@@ -0,0 +1,53 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { z, ZodError, type ZodSchema } from 'zod';
+
+import type { ParameterValue, ParametersError } from '../../src';
+
+interface SimpleParamTypeAlias {
+  name: string;
+  children?: SimpleParamTypeAlias[];
+}
+
+// 使用 zod 创建校验规则，只校验 name 和 description
+const createParameterValueSchema = (): ZodSchema<SimpleParamTypeAlias> =>
+  z.lazy(() =>
+    z.object({
+      name: z.string().min(1, { message: 'Name cannot be empty' }),
+      children: z.array(createParameterValueSchema()).optional(),
+    }),
+  );
+
+const parametersValueSchema = z.array(createParameterValueSchema());
+
+// 定义 validValue 函数，使用 zod 进行校验
+export default function validValue(
+  values: ParameterValue[],
+): ParametersError[] | undefined {
+  try {
+    parametersValueSchema.parse(values);
+  } catch (error) {
+    if (error instanceof ZodError) {
+      return error.errors.map(({ path, message }) => ({
+        path: String(path).replaceAll(',', '.'),
+        message,
+      }));
+    }
+
+    throw error;
+  }
+}