@baishuyun/ai-design 2.0.38 → 2.1.0-alpha.0

package/src/components/field-checker.tsx

@@ -1,185 +1,185 @@
-import { memo, useEffect, useRef, useState } from 'react';
-import { type FieldType, IField, type IFieldOption as Option } from '@baishuyun/types';
-import { FieldTypeNameMap } from '../const/ui';
-import LineChecker from './line-checker';
-import { OptionItem } from './option-item';
-import { FieldIcon } from './field-icon';
-
-type Field = IField;
-
-export interface FieldCheckerProps {
-  field: IField;
-  isSubField?: boolean;
-  disabled?: boolean;
-  icon?: React.ReactNode;
-  onChange?: (checked: boolean, field: Field, parentFieldName?: string, index?: number) => void;
-  value?: unknown;
-  checked?: boolean;
-  streaming?: boolean;
-  confirmed?: boolean;
-  onLoaded?: (field: Field) => void;
-  /** 字段更新类型：new 新增（淡绿背景），removed 删除（置灰+中横线） */
-  updateType?: 'new' | 'removed';
-}
-
-export const FieldChecker = memo(
-  ({
-    field,
-    disabled,
-    isSubField,
-    onChange,
-    onLoaded,
-    icon,
-    value,
-    checked,
-    streaming,
-    confirmed,
-    updateType,
-  }: FieldCheckerProps) => {
-    const { widget, label } = field;
-    if (!widget) {
-      return null;
-    }
-
-    const { type } = widget;
-
-    const t = type as FieldType;
-
-    if (!FieldTypeNameMap.hasOwnProperty(type)) {
-      return null;
-    }
-
-    const typeDesc = FieldTypeNameMap[t] || FieldTypeNameMap.unknown;
-
-    const isSubForm = type === 'subform';
-
-    const items = isSubForm ? [] : (widget.items as Option[]) || [];
-
-    // --- subform sub-field state management ---
-    const subFields = isSubForm ? (widget.items as Field[]) : [];
-    const [subCheckedMap, setSubCheckedMap] = useState<Record<number, boolean>>(() => {
-      const result: Record<number, boolean> = {};
-      subFields.forEach((_, i) => {
-        result[i] = true;
-      });
-      return result;
-    });
-
-    // When parent checked prop changes from outside, sync all sub-fields
-    const prevChecked = useRef(checked);
-    useEffect(() => {
-      if (isSubForm && checked !== prevChecked.current) {
-        prevChecked.current = checked;
-        if (checked !== undefined) {
-          const result: Record<number, boolean> = {};
-          subFields.forEach((_, i) => {
-            result[i] = checked;
-          });
-          setSubCheckedMap(result);
-        }
-      }
-    }, [checked, isSubForm, subFields.length]);
-
-    const handleSubFieldChange = (subChecked: boolean, subField: Field, index: number) => {
-      setSubCheckedMap((prev) => {
-        const next = { ...prev, [index]: subChecked };
-        // If all sub-fields are now unchecked, uncheck the parent subform
-        const allChecked = Object.values(next).every(Boolean);
-        if (allChecked) {
-          onChange?.(true, field);
-        }
-
-        const allUnchecked = Object.values(next).every((v) => v === false);
-        if (allUnchecked) {
-          onChange?.(false, field);
-        }
-
-        return next;
-      });
-      onChange?.(subChecked, subField, field.widget?.widgetName, index);
-    };
-    // --- end subform state management ---
-
-    useEffect(() => {
-      onLoaded?.(field);
-    }, []);
-
-    const handleCheck = (newChecked: boolean) => {
-      onChange?.(newChecked, field);
-    };
-
-    const extraPadding = isSubField ? 'pl-[38px]' : '';
-
-    // 表单填充
-    if (value) {
-      return (
-        <LineChecker
-          title={label}
-          disabled={disabled}
-          checked={checked}
-          defaultChecked={true}
-          onCheckedChange={handleCheck}
-          icon={icon}
-          className={extraPadding}
-          shortDesc={value as string}
-          updateType={updateType}
-        />
-      );
-    }
-
-    return (
-      <>
-        <LineChecker
-          streaming={streaming}
-          confirmed={confirmed}
-          title={label}
-          disabled={disabled}
-          checked={checked}
-          defaultChecked={true}
-          onCheckedChange={handleCheck}
-          icon={icon}
-          shortDesc={typeDesc}
-          className={extraPadding}
-          updateType={updateType}
-          extra={
-            items.length ? (
-              <>
-                {items.map(({ value, text, color }) => (
-                  <OptionItem key={value} color={color ? 'white' : undefined} bgColor={color}>
-                    {text}
-                  </OptionItem>
-                ))}
-              </>
-            ) : null
-          }
-        />
-        {isSubForm
-          ? subFields.map((subField: Field, index: number) => (
-              <FieldChecker
-                confirmed={confirmed}
-                streaming={streaming}
-                key={subField.label}
-                isSubField={true}
-                disabled={disabled}
-                checked={subCheckedMap[index]}
-                field={subField}
-                icon={<FieldIcon type={subField.widget?.type!} />}
-                onChange={(subChecked) => {
-                  handleSubFieldChange(subChecked, subField, index);
-                }}
-              />
-            ))
-          : null}
-      </>
-    );
-  },
-  (p1, p2) => {
-    return (
-      p1.field?.label === p2.field?.label &&
-      p1.disabled === p2.disabled &&
-      p1.checked === p2.checked &&
-      p1.confirmed === p2.confirmed &&
-      p1.streaming === p2.streaming
-    );
-  }
-);
+import { memo, useEffect, useRef, useState } from 'react';
+import { type FieldType, IField, type IFieldOption as Option } from '@baishuyun/types';
+import { FieldTypeNameMap } from '../const/ui';
+import LineChecker from './line-checker';
+import { OptionItem } from './option-item';
+import { FieldIcon } from './field-icon';
+
+type Field = IField;
+
+export interface FieldCheckerProps {
+  field: IField;
+  isSubField?: boolean;
+  disabled?: boolean;
+  icon?: React.ReactNode;
+  onChange?: (checked: boolean, field: Field, parentFieldName?: string, index?: number) => void;
+  value?: unknown;
+  checked?: boolean;
+  streaming?: boolean;
+  confirmed?: boolean;
+  onLoaded?: (field: Field) => void;
+  /** 字段更新类型：new 新增（淡绿背景），removed 删除（置灰+中横线） */
+  updateType?: 'new' | 'removed';
+}
+
+export const FieldChecker = memo(
+  ({
+    field,
+    disabled,
+    isSubField,
+    onChange,
+    onLoaded,
+    icon,
+    value,
+    checked,
+    streaming,
+    confirmed,
+    updateType,
+  }: FieldCheckerProps) => {
+    const { widget, label } = field;
+    if (!widget) {
+      return null;
+    }
+
+    const { type } = widget;
+
+    const t = type as FieldType;
+
+    if (!FieldTypeNameMap.hasOwnProperty(type)) {
+      return null;
+    }
+
+    const typeDesc = FieldTypeNameMap[t] || FieldTypeNameMap.unknown;
+
+    const isSubForm = type === 'subform';
+
+    const items = isSubForm ? [] : (widget.items as Option[]) || [];
+
+    // --- subform sub-field state management ---
+    const subFields = isSubForm ? (widget.items as Field[]) : [];
+    const [subCheckedMap, setSubCheckedMap] = useState<Record<number, boolean>>(() => {
+      const result: Record<number, boolean> = {};
+      subFields.forEach((_, i) => {
+        result[i] = true;
+      });
+      return result;
+    });
+
+    // When parent checked prop changes from outside, sync all sub-fields
+    const prevChecked = useRef(checked);
+    useEffect(() => {
+      if (isSubForm && checked !== prevChecked.current) {
+        prevChecked.current = checked;
+        if (checked !== undefined) {
+          const result: Record<number, boolean> = {};
+          subFields.forEach((_, i) => {
+            result[i] = checked;
+          });
+          setSubCheckedMap(result);
+        }
+      }
+    }, [checked, isSubForm, subFields.length]);
+
+    const handleSubFieldChange = (subChecked: boolean, subField: Field, index: number) => {
+      setSubCheckedMap((prev) => {
+        const next = { ...prev, [index]: subChecked };
+        // If all sub-fields are now unchecked, uncheck the parent subform
+        const allChecked = Object.values(next).every(Boolean);
+        if (allChecked) {
+          onChange?.(true, field);
+        }
+
+        const allUnchecked = Object.values(next).every((v) => v === false);
+        if (allUnchecked) {
+          onChange?.(false, field);
+        }
+
+        return next;
+      });
+      onChange?.(subChecked, subField, field.widget?.widgetName, index);
+    };
+    // --- end subform state management ---
+
+    useEffect(() => {
+      onLoaded?.(field);
+    }, []);
+
+    const handleCheck = (newChecked: boolean) => {
+      onChange?.(newChecked, field);
+    };
+
+    const extraPadding = isSubField ? 'pl-[38px]' : '';
+
+    // 表单填充
+    if (value) {
+      return (
+        <LineChecker
+          title={label}
+          disabled={disabled}
+          checked={checked}
+          defaultChecked={true}
+          onCheckedChange={handleCheck}
+          icon={icon}
+          className={extraPadding}
+          shortDesc={value as string}
+          updateType={updateType}
+        />
+      );
+    }
+
+    return (
+      <>
+        <LineChecker
+          streaming={streaming}
+          confirmed={confirmed}
+          title={label}
+          disabled={disabled}
+          checked={checked}
+          defaultChecked={true}
+          onCheckedChange={handleCheck}
+          icon={icon}
+          shortDesc={typeDesc}
+          className={extraPadding}
+          updateType={updateType}
+          extra={
+            items.length ? (
+              <>
+                {items.map(({ value, text, color }) => (
+                  <OptionItem key={value} color={color ? 'white' : undefined} bgColor={color}>
+                    {text}
+                  </OptionItem>
+                ))}
+              </>
+            ) : null
+          }
+        />
+        {isSubForm
+          ? subFields.map((subField: Field, index: number) => (
+              <FieldChecker
+                confirmed={confirmed}
+                streaming={streaming}
+                key={subField.label}
+                isSubField={true}
+                disabled={disabled}
+                checked={subCheckedMap[index]}
+                field={subField}
+                icon={<FieldIcon type={subField.widget?.type!} />}
+                onChange={(subChecked) => {
+                  handleSubFieldChange(subChecked, subField, index);
+                }}
+              />
+            ))
+          : null}
+      </>
+    );
+  },
+  (p1, p2) => {
+    return (
+      p1.field?.label === p2.field?.label &&
+      p1.disabled === p2.disabled &&
+      p1.checked === p2.checked &&
+      p1.confirmed === p2.confirmed &&
+      p1.streaming === p2.streaming
+    );
+  }
+);

package/src/components/field-icon.tsx

@@ -1,13 +1,13 @@
-import { FIELD_ICON_CODE_MAP } from '../const/ui';
-import { FieldType } from '@baishuyun/types';
-import { FontIcon } from './font-icon';
-import { FormulasIcon } from './bs-icons';
-
-export const FieldIcon = ({ type }: { type: FieldType }) => {
-  const code = FIELD_ICON_CODE_MAP[type] || 'unknown';
-  if (type === 'formula') {
-    return <FormulasIcon />;
-  }
-
-  return <FontIcon code={code} />;
-};
+import { FIELD_ICON_CODE_MAP } from '../const/ui';
+import { FieldType } from '@baishuyun/types';
+import { FontIcon } from './font-icon';
+import { FormulasIcon } from './bs-icons';
+
+export const FieldIcon = ({ type }: { type: FieldType }) => {
+  const code = FIELD_ICON_CODE_MAP[type] || 'unknown';
+  if (type === 'formula') {
+    return <FormulasIcon />;
+  }
+
+  return <FontIcon code={code} />;
+};

package/src/components/field-value-checker.tsx

@@ -1,116 +1,116 @@
-import { memo, useEffect } from 'react';
-import { FieldType, IField } from '@baishuyun/types';
-import { FieldTypeNameMap } from '../const/ui';
-import { isSubformFieldEqual, toHumanReadable } from '../lib/utils';
-import { SubformFieldsValueChecker } from './subform-fields-value-checker';
-import LineChecker from './line-checker';
-
-type Field = IField;
-
-export interface FieldValueCheckerProps {
-  field: IField;
-  isSubField?: boolean;
-  disabled?: boolean;
-  readonly?: boolean;
-  onChange?: (checked: boolean, field: Field, parentFieldName?: string, index?: number) => void;
-  onLoaded?: (field: Field) => void;
-  streaming?: boolean;
-}
-
-export const FieldValueChecker = memo(
-  ({
-    field,
-    disabled,
-    isSubField,
-    readonly,
-    streaming,
-    onChange,
-    onLoaded,
-  }: FieldValueCheckerProps) => {
-    const { widget, label } = field;
-    if (!widget) {
-      return null;
-    }
-
-    const { type, value: v } = widget;
-
-    const t = type as FieldType;
-
-    const value = toHumanReadable(v, t);
-
-    if (!FieldTypeNameMap.hasOwnProperty(type)) {
-      return null;
-    }
-
-    const isSubForm = type === 'subform';
-
-    useEffect(() => {
-      onLoaded?.(field);
-    }, []);
-
-    const handleCheck = (checked: boolean) => {
-      onChange?.(checked, field);
-    };
-
-    const extraPadding = isSubField ? 'pl-6' : '';
-
-    return (
-      <>
-        <LineChecker
-          streaming={streaming}
-          title={label}
-          disabled={disabled}
-          defaultChecked={true}
-          onCheckedChange={handleCheck}
-          className={extraPadding}
-          readonly={readonly}
-          shortDesc={isSubForm ? '' : (value as string)}
-        />
-        {isSubForm && (
-          <SubformFieldsValueChecker
-            readonly={readonly}
-            subformField={field}
-            onChange={(detail) => {
-              onChange?.(detail.checked, detail.field, detail.parentFieldName, detail.row);
-            }}
-            streaming={streaming}
-          />
-        )}
-      </>
-    );
-  },
-  (p1, p2) => {
-    // 标签一致
-    const isLabelEqual = p1.field?.label === p2.field?.label;
-    if (!isLabelEqual) {
-      return false;
-    }
-
-    // id 一致
-    const isFieldNameEqual = p1.field?.widget?.widgetName === p2.field?.widget?.widgetName;
-    if (!isFieldNameEqual) {
-      return false;
-    }
-
-    // 禁用状态一致
-    const isDisabledEqual = p1.disabled === p2.disabled;
-    if (!isDisabledEqual) {
-      return false;
-    }
-
-    // 只读状态一致
-    const isReadonlyEqual = p1.readonly === p2.readonly;
-    if (!isReadonlyEqual) {
-      return false;
-    }
-
-    // 流式状态一致
-    const isStreamingEqual = p1.streaming === p2.streaming;
-    if (!isStreamingEqual) {
-      return false;
-    }
-
-    // 进一步比较子表单下的字段
-    return isSubformFieldEqual(p1?.field, p2?.field);
-  }
-);
+import { memo, useEffect } from 'react';
+import { FieldType, IField } from '@baishuyun/types';
+import { FieldTypeNameMap } from '../const/ui';
+import { isSubformFieldEqual, toHumanReadable } from '../lib/utils';
+import { SubformFieldsValueChecker } from './subform-fields-value-checker';
+import LineChecker from './line-checker';
+
+type Field = IField;
+
+export interface FieldValueCheckerProps {
+  field: IField;
+  isSubField?: boolean;
+  disabled?: boolean;
+  readonly?: boolean;
+  onChange?: (checked: boolean, field: Field, parentFieldName?: string, index?: number) => void;
+  onLoaded?: (field: Field) => void;
+  streaming?: boolean;
+}
+
+export const FieldValueChecker = memo(
+  ({
+    field,
+    disabled,
+    isSubField,
+    readonly,
+    streaming,
+    onChange,
+    onLoaded,
+  }: FieldValueCheckerProps) => {
+    const { widget, label } = field;
+    if (!widget) {
+      return null;
+    }
+
+    const { type, value: v } = widget;
+
+    const t = type as FieldType;
+
+    const value = toHumanReadable(v, t);
+
+    if (!FieldTypeNameMap.hasOwnProperty(type)) {
+      return null;
+    }
+
+    const isSubForm = type === 'subform';
+
+    useEffect(() => {
+      onLoaded?.(field);
+    }, []);
+
+    const handleCheck = (checked: boolean) => {
+      onChange?.(checked, field);
+    };
+
+    const extraPadding = isSubField ? 'pl-6' : '';
+
+    return (
+      <>
+        <LineChecker
+          streaming={streaming}
+          title={label}
+          disabled={disabled}
+          defaultChecked={true}
+          onCheckedChange={handleCheck}
+          className={extraPadding}
+          readonly={readonly}
+          shortDesc={isSubForm ? '' : (value as string)}
+        />
+        {isSubForm && (
+          <SubformFieldsValueChecker
+            readonly={readonly}
+            subformField={field}
+            onChange={(detail) => {
+              onChange?.(detail.checked, detail.field, detail.parentFieldName, detail.row);
+            }}
+            streaming={streaming}
+          />
+        )}
+      </>
+    );
+  },
+  (p1, p2) => {
+    // 标签一致
+    const isLabelEqual = p1.field?.label === p2.field?.label;
+    if (!isLabelEqual) {
+      return false;
+    }
+
+    // id 一致
+    const isFieldNameEqual = p1.field?.widget?.widgetName === p2.field?.widget?.widgetName;
+    if (!isFieldNameEqual) {
+      return false;
+    }
+
+    // 禁用状态一致
+    const isDisabledEqual = p1.disabled === p2.disabled;
+    if (!isDisabledEqual) {
+      return false;
+    }
+
+    // 只读状态一致
+    const isReadonlyEqual = p1.readonly === p2.readonly;
+    if (!isReadonlyEqual) {
+      return false;
+    }
+
+    // 流式状态一致
+    const isStreamingEqual = p1.streaming === p2.streaming;
+    if (!isStreamingEqual) {
+      return false;
+    }
+
+    // 进一步比较子表单下的字段
+    return isSubformFieldEqual(p1?.field, p2?.field);
+  }
+);