@pisell/materials 1.0.1023 → 1.8.1

package/lib/theme/tokens.js

@@ -84,10 +84,9 @@ function getComponentsToken() {
     Dropdown: {
       borderRadiusLG: 8,
       controlHeight: 42,
-      fontSize: 14
-      // // 下拉框阴影（Figma: Shadow/lg）
-      // boxShadowSecondary:
-      //   '0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08)',
+      fontSize: 14,
+      // 下拉框阴影（Figma: Shadow/lg）
+      boxShadowSecondary: "0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08)"
     },
     DatePicker: {
       borderRadius: 8,
@@ -98,117 +97,127 @@ function getComponentsToken() {
       colorTextDisabled: "#98A2B3"
     },
     Input: {
-      // // 基础样式（基于 Figma 设计规范）
-      // fontSizeIcon: 16,
-      // fontSize: 16,
-      // lineHeight: 1.5, // 24px / 16px = 1.5
-      // addonBg: '#fff',
-      //
-      // // 边框和圆角
-      // borderRadius: 8,
-      // colorBorder: '#D0D5DD', // Gray/300
-      //
-      // // 内边距（Figma: 16px 12px）
-      // paddingBlock: 12,
-      // paddingInline: 16,
-      // controlHeight: 48, // 12px + 24px + 12px = 48px
-      //
-      // // 颜色
-      // colorText: '#101828', // Gray/900 - 输入文本
-      // colorTextPlaceholder: '#667085', // Gray/500 - 占位符
-      // colorBgContainer: '#FFFFFF', // 背景色
-      //
-      // // 禁用态
-      // colorBgContainerDisabled: '#F9FAFB', // Gray/50
-      // colorTextDisabled: '#98A2B3', // Gray/400
-      //
-      // // 注意：TextArea 的水平内边距比 Input 小2px (14px vs 16px)
-      // // 在各组件的 Less 文件中单独设置
+      // 基础样式（基于 Figma 设计规范）
+      fontSizeIcon: 16,
+      fontSize: 16,
+      lineHeight: 1.5,
+      // 24px / 16px = 1.5
+      addonBg: "#fff",
+      // 边框和圆角
+      borderRadius: 8,
+      colorBorder: "#D0D5DD",
+      // Gray/300
+      // 内边距（Figma: 16px 12px）
+      paddingBlock: 12,
+      paddingInline: 16,
+      controlHeight: 48,
+      // 12px + 24px + 12px = 48px
+      // 颜色
+      colorText: "#101828",
+      // Gray/900 - 输入文本
+      colorTextPlaceholder: "#667085",
+      // Gray/500 - 占位符
+      colorBgContainer: "#FFFFFF",
+      // 背景色
+      // 禁用态
+      colorBgContainerDisabled: "#F9FAFB",
+      // Gray/50
+      colorTextDisabled: "#98A2B3"
+      // Gray/400
+      // 注意：TextArea 的水平内边距比 Input 小2px (14px vs 16px)
+      // 在各组件的 Less 文件中单独设置
     },
     InputNumber: {
-      // // 基础样式（与 Input 保持一致，基于 Figma 设计规范）
-      // fontSize: 16,
-      // lineHeight: 1.5, // 24px / 16px = 1.5
-      //
-      // // 边框和圆角
-      // borderRadius: 8,
-      // colorBorder: '#D0D5DD', // Gray/300
-      //
-      // // 内边距（Figma: 16px 12px）
-      // paddingBlock: 12,
-      // paddingInline: 16,
-      // controlHeight: 48, // 12px + 24px + 12px = 48px
-      //
-      // // 颜色
-      // colorText: '#101828', // Gray/900 - 输入文本
-      // colorTextPlaceholder: '#667085', // Gray/500 - 占位符
-      // colorBgContainer: '#FFFFFF', // 背景色
-      //
-      // // 禁用态
-      // colorBgContainerDisabled: '#F9FAFB', // Gray/50
-      // colorTextDisabled: '#98A2B3', // Gray/400
-      //
-      // // 控制按钮（步进器）
-      // handleVisible: true, // 显示增减按钮
-      // handleBg: '#FFFFFF',
-      // handleHoverColor: '#7F56DA', // 悬停颜色使用主色
-      // handleBorderColor: '#D0D5DD',
+      // 基础样式（与 Input 保持一致，基于 Figma 设计规范）
+      fontSize: 16,
+      lineHeight: 1.5,
+      // 24px / 16px = 1.5
+      // 边框和圆角
+      borderRadius: 8,
+      colorBorder: "#D0D5DD",
+      // Gray/300
+      // 内边距（Figma: 16px 12px）
+      paddingBlock: 12,
+      paddingInline: 16,
+      controlHeight: 48,
+      // 12px + 24px + 12px = 48px
+      // 颜色
+      colorText: "#101828",
+      // Gray/900 - 输入文本
+      colorTextPlaceholder: "#667085",
+      // Gray/500 - 占位符
+      colorBgContainer: "#FFFFFF",
+      // 背景色
+      // 禁用态
+      colorBgContainerDisabled: "#F9FAFB",
+      // Gray/50
+      colorTextDisabled: "#98A2B3",
+      // Gray/400
+      // 控制按钮（步进器）
+      handleVisible: true,
+      // 显示增减按钮
+      handleBg: "#FFFFFF",
+      handleHoverColor: "#7F56DA",
+      // 悬停颜色使用主色
+      handleBorderColor: "#D0D5DD"
     },
     Select: {
-      // // 基础样式（Figma 设计规范）
-      // fontSizeIcon: 16,
-      // fontSize: 16,
-      // lineHeight: 1.5,
-      //
-      // // 边框和圆角（Figma: 8px 圆角，#D0D5DD 边框）
-      // borderRadius: 8,
-      // colorBorder: '#D0D5DD', // Gray/300
-      //
-      // // 高度和内边距（Figma: 48px 高度，16px 水平内边距）
-      // controlHeight: 48,
-      // controlPaddingHorizontal: 16,
-      //
-      // // 颜色（Figma 设计规范）
-      // colorText: '#101828', // Gray/900 - 选中文本
-      // colorTextPlaceholder: '#667085', // Gray/500 - 占位符
-      // colorBgContainer: '#FFFFFF', // Base/White - 背景
-      //
-      // // 禁用态
-      // colorBgContainerDisabled: '#F9FAFB', // Gray/50
-      // colorTextDisabled: '#98A2B3', // Gray/400
-      //
-      // // 聚焦态（Figma: Primary/300 边框，Primary/100 阴影）
-      // colorPrimaryBorder: '#D6BBFB', // Primary/300
-      // controlOutline: '#F4EBFF', // Primary/100
-      // controlOutlineWidth: 4,
-      //
-      // // 下拉箭头和清空按钮颜色
-      // colorIcon: '#667085', // Gray/500
-      // colorIconHover: '#344054', // Gray/700
-      //
-      // // 选择框阴影（Figma: Shadow/xs）
-      // boxShadowSecondary:
-      //   '0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08)',
-      //
-      // // 多选标签样式（Figma: Gray/200 背景）
-      // multipleItemBg: '#EAECF0', // Gray/200
-      // multipleItemBorderColor: 'transparent',
-      // multipleItemHeight: 36,
-      //
-      // // 选项样式
-      // optionFontSize: 16,
-      // optionLineHeight: 1.5,
-      // optionPadding: '10px 8px',
-      // optionSelectedBg: '#F4EBFF', // Primary/100 - 选中项背景（浅紫色）
-      // optionActiveBg: '#F9FAFB', // Gray/50 - hover 背景
+      // 基础样式（Figma 设计规范）
+      fontSizeIcon: 16,
+      fontSize: 16,
+      lineHeight: 1.5,
+      // 边框和圆角（Figma: 8px 圆角，#D0D5DD 边框）
+      borderRadius: 8,
+      colorBorder: "#D0D5DD",
+      // Gray/300
+      // 高度和内边距（Figma: 48px 高度，16px 水平内边距）
+      controlHeight: 48,
+      controlPaddingHorizontal: 16,
+      // 颜色（Figma 设计规范）
+      colorText: "#101828",
+      // Gray/900 - 选中文本
+      colorTextPlaceholder: "#667085",
+      // Gray/500 - 占位符
+      colorBgContainer: "#FFFFFF",
+      // Base/White - 背景
+      // 禁用态
+      colorBgContainerDisabled: "#F9FAFB",
+      // Gray/50
+      colorTextDisabled: "#98A2B3",
+      // Gray/400
+      // 聚焦态（Figma: Primary/300 边框，Primary/100 阴影）
+      colorPrimaryBorder: "#D6BBFB",
+      // Primary/300
+      controlOutline: "#F4EBFF",
+      // Primary/100
+      controlOutlineWidth: 4,
+      // 下拉箭头和清空按钮颜色
+      colorIcon: "#667085",
+      // Gray/500
+      colorIconHover: "#344054",
+      // Gray/700
+      // 选择框阴影（Figma: Shadow/xs）
+      boxShadowSecondary: "0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08)",
+      // 多选标签样式（Figma: Gray/200 背景）
+      multipleItemBg: "#EAECF0",
+      // Gray/200
+      multipleItemBorderColor: "transparent",
+      multipleItemHeight: 36,
+      // 选项样式
+      optionFontSize: 16,
+      optionLineHeight: 1.5,
+      optionPadding: "10px 8px",
+      optionSelectedBg: "#F4EBFF",
+      // Primary/100 - 选中项背景（浅紫色）
+      optionActiveBg: "#F9FAFB"
+      // Gray/50 - hover 背景
     },
     Menu: {
       itemSelectedColor: "#9976e3"
     },
     Popover: {
       // 下拉框阴影（Figma: Shadow/lg）
-      // boxShadowSecondary:
-      //   '0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08)',
+      boxShadowSecondary: "0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08)"
     },
     Typography: {
       colorText: "#101828",

package/lib/utils/hoc.d.ts

@@ -1,17 +1,17 @@
-import { ComponentType } from 'react';
+import React, { ComponentType } from 'react';
 /**
  * 简单包装，不做任何处理
  * 部分组件ref比较特殊，包一层会解决这个问题
  */
-export declare function withWrap<T extends ComponentType<any>>(Comp: T): (props: any) => JSX.Element;
+export declare function withWrap<T extends ComponentType<any>>(Comp: T): (props: any) => React.JSX.Element;
 /**
  * 某些组件会用React.Children.only检查子节点
  * 需要做处理避免报错
  */
-export declare function withSingleChild(Comp: ComponentType<any>, needsConvert?: string[]): (props: any) => JSX.Element;
-export declare function withSingleFunctionChild(Comp: ComponentType<any>): (props: any) => JSX.Element;
+export declare function withSingleChild(Comp: ComponentType<any>, needsConvert?: string[]): (props: any) => React.JSX.Element;
+export declare function withSingleFunctionChild(Comp: ComponentType<any>): (props: any) => React.JSX.Element;
 /**
  * moment对象在序列化后会被转为字符串
  * 需要让日期类组件支持接受字符串值
  */
-export declare function withMomentProps(Comp: ComponentType<any>, needsConvert?: string[]): (props: any) => JSX.Element;
+export declare function withMomentProps(Comp: ComponentType<any>, needsConvert?: string[]): (props: any) => React.JSX.Element;

package/lib/utils/miniRedux.d.ts

@@ -12,6 +12,6 @@ declare const _default: <State extends Record<string, any>, Namespace extends st
             payload: any;
         }) => void;
     }>;
-    Provider: (ComponentUi: any) => (props: any, ref: any) => JSX.Element;
+    Provider: (ComponentUi: any) => (props: any, ref: any) => React.JSX.Element;
 };
 export default _default;

package/lowcode/_utils/defaultSchema.ts

@@ -47,8 +47,7 @@ export const generalItemMap = {
       },
       tip: {
         type: 'i18n',
-        'en-US':
-          'The text displayed in the label of the form item, corresponding to Label.',
+        'en-US': 'The text displayed in the label of the form item, corresponding to Label.',
         'zh-CN': '用于显示在表单项的标签文本，对应Label。',
       },
     },
@@ -165,10 +164,8 @@ export const generalItemMap = {
       },
       tip: {
         type: 'i18n',
-        'en-US':
-          'Whether to hide the Label of the component, including title and tooltip, but not including helper text.',
-        'zh-CN':
-          '是否隐藏组件的Label，包括title和tooltip，但是不包括helper text。',
+        'en-US': 'Whether to hide the Label of the component, including title and tooltip, but not including helper text.',
+        'zh-CN': '是否隐藏组件的Label，包括title和tooltip，但是不包括helper text。',
       },
     },
     propType: 'bool',
@@ -514,9 +511,7 @@ export const generalItemMap = {
               propType: 'string',
               setter: 'PisellI18nSetter',
               condition: (target: any) => {
-                return !['subdomain', 'appIdentifier'].includes(
-                  target.parent.getPropValue('type')
-                );
+                return !(['subdomain', 'appIdentifier'].includes(target.parent.getPropValue('type')));
               },
             },
           ],
@@ -681,7 +676,7 @@ export const formItemGeneralDataGroup = {
           disabled: true,
           filters: {
             tables: 'all',
-            variables: {},
+            variables: {}
           },
         },
       },
@@ -706,29 +701,15 @@ export const formItemGeneralOptionTypeGroup = {
         'en-US': 'Type',
         'zh-CN': '类型',
       },
-      setter: (target: any) => {
-        const parentForm = getParentForm(target);
-        const fields = getVariable(parentForm, 'currentFields');
-        // 获取当前表单项的 name
-        const currentFieldName = target.getProps().getPropValue('name');
-        // 在 currentFields 中查找对应的字段配置
-        const fieldConfig = fields?.find(
-          (item: any) => item.name === currentFieldName
-        );
-        // 检查字段配置中是否有 x-data-source，如果有说明 optionSourceType 是从数据源设置的
-        const dataSourceType = fieldConfig?.uiSchema?.['x-data-source']?.type;
-
-        return {
-          componentName: 'PisellSelectSetter',
-          props: {
-            disabled: !!dataSourceType,
-            options: [
-              { label: '默认', value: 'default' },
-              { label: '自定义', value: 'custom' },
-              { label: 'API', value: 'api' },
-            ],
-          },
-        };
+      setter: {
+        componentName: 'SelectSetter',
+        props: {
+          options: [
+            { title: '默认', value: 'default' },
+            { title: '自定义', value: 'custom' },
+            { title: 'API', value: 'api' },
+          ],
+        },
       },
     },
     {
@@ -760,29 +741,15 @@ export const formItemGeneralOptionTypeGroup = {
           return target.getProps().setPropValue('dataSource', value.item);
         },
       },
-      setter: (target: any) => {
-        const parentForm = getParentForm(target);
-        const fields = getVariable(parentForm, 'currentFields');
-        // 获取当前表单项的 name
-        const currentFieldName = target.getProps().getPropValue('name');
-        // 在 currentFields 中查找对应的字段配置
-        const fieldConfig = fields?.find(
-          (item: any) => item.name === currentFieldName
-        );
-        // 检查字段配置中是否有 x-data-source，如果有说明 dataSource 是从数据源设置的
-        const dataSource = fieldConfig?.uiSchema?.['x-data-source']?.dataSource;
-
-        return {
-          componentName: 'PisellDataSourceSetter',
-          props: {
-            disabled: !!dataSource,
-            mode: 'list',
-            filters: {
-              tables: 'all',
-              variables: {},
-            },
+      setter: {
+        componentName: 'PisellDataSourceSetter',
+        props: {
+          mode: 'list',
+          filters: {
+            tables: 'all',
+            variables: {}
           },
-        }
+        },
       },
     },
     {
@@ -798,7 +765,7 @@ export const formItemGeneralOptionTypeGroup = {
         'en-US': 'Extra Params',
         'zh-CN': '额外参数',
       },
-      setter: 'JsonSetter',
+      setter: 'JsonSetter'
     },
     {
       name: 'labelField',
@@ -885,7 +852,7 @@ export const formItemGeneralOptionTypeGroup = {
             itemSetter: {
               componentName: 'ObjectSetter',
               initialValue: () => {
-                return {};
+                return {}
               },
               props: {
                 config: {
@@ -1587,7 +1554,7 @@ export const genGeneralVariablesSetting = ({
       props: (target: any) => {
         return {
           filters: {
-            variables: {},
+            variables: {}
           },
           variables: getCptValuesVariables(target),
         };
@@ -1596,37 +1563,38 @@ export const genGeneralVariablesSetting = ({
   };
 };
 
+
 export const inputPlaceholder = {
   type: 'i18n',
-  en: 'Enter',
+  'en': 'Enter',
   'zh-CN': '请输入',
   'zh-HK': '請輸入',
 };
 
 export const selectPlaceholder = {
   type: 'i18n',
-  en: 'Select an option',
+  'en': 'Select an option',
   'zh-CN': '请选择一个选项',
   'zh-HK': '請選擇一個選項',
 };
 
 export const selectMultiplePlaceholder = {
   type: 'i18n',
-  en: 'Select one or more options',
+  'en': 'Select one or more options',
   'zh-CN': '请选择一个或多个选项',
   'zh-HK': '請選擇一個或多個選項',
 };
 
 export const datePickerPlaceholder = {
   type: 'i18n',
-  en: 'Select a date',
+  'en': 'Select a date',
   'zh-CN': '请选择日期',
   'zh-HK': '請選擇日期',
 };
 
 export const timePickerPlaceholder = {
   type: 'i18n',
-  en: 'Select a time',
+  'en': 'Select a time',
   'zh-CN': '请选择时间',
   'zh-HK': '請選擇時間',
 };

package/lowcode/data-source-form/utils.ts

@@ -16,20 +16,6 @@ type UiSchema = {
   'x-validator'?: string;
   'x-display'?: 'visible' | 'hidden' | 'none';
   'x-pattern'?: 'editable' | 'disabled' | 'readPretty';
-  'x-data-source'?: {
-    sourceType?: string;
-    type?: string;
-    options?: Array<{ 
-      id?: string;
-      label: string | any; // 支持字符串或多语言对象
-      value: string;
-      color?: string;
-    }>;
-    labelField?: string;
-    valueField?: string;
-    dataSource?: any;
-    extraParams?: Record<string, any>;
-  };
   type: 'string' | 'number' | 'boolean' | 'array' | 'object';
 };
 
@@ -149,6 +135,7 @@ export const createFormItemSchema = (
     'x-display': xDisplay,
     type,
   } = uiSchema;
+
   let cptTitle = undefined;
 
   // 根据 x-pattern 和 x-display 确定 renderMode
@@ -303,20 +290,14 @@ export const createFormItemSchema = (
     componentName = 'Translation';
   }
 
-  // 获取选项配置
-  const dataSourceConfig = (uiSchema as any)?.['x-data-source'];
-  
   if (
     ['Select', 'Radio.Group', 'Checkbox.Group'].includes(xComponent) &&
-    (uiSchema?.enum?.length > 0 || dataSourceConfig)
+    uiSchema?.enum?.length > 0
   ) {
     if (['Radio.Group', 'Checkbox.Group'].includes(xComponent)) {
       props.direction = 'horizontal';
       props.placeholder = "";
     } else {
-      if (type === 'array') {
-        props.mode = 'multiple';
-      }
       props.styleType = 'antd';
       props.showSearch = true;
       props.optionFilterProp = 'label';
@@ -338,53 +319,8 @@ export const createFormItemSchema = (
         };
       }
     }
-    
-    // 统一的选项配置处理
-    const optionConfig = dataSourceConfig || {};
-    
-    // 设置 optionSourceType
-    props.optionSourceType = optionConfig?.type || 'default';
-    
-    // 根据 sourceType 设置不同的配置
-    if (props.optionSourceType === 'default') {
-      // 优先使用 optionConfig.options，其次兼容旧的 enum 格式
-      const rawOptions = optionConfig.options || uiSchema?.enum || [];
-      
-      // 转换多语言格式的 label 为组件可识别的 i18n 格式
-      props.options = rawOptions.map((option: any) => {
-        const label = option.label;
-        
-        // 如果 label 是多语言对象格式，转换为 i18n 格式
-        if (label && typeof label === 'object' && !label.type) {
-          return {
-            ...option,
-            label: {
-              type: 'i18n',
-              'en': label.en || label.original || '',
-              'zh-CN': label['zh-CN'] || label.original || '',
-              'zh-HK': label['zh-HK'] || label.original || '',
-            }
-          };
-        }
-        
-        // 如果已经是 i18n 格式或者是字符串，直接返回
-        return option;
-      });
-    } else if (props.optionSourceType === 'api') {
-      // API 类型需要设置 labelField 和 valueField
-      if (optionConfig?.labelField) {
-        props.labelField = optionConfig.labelField;
-      }
-      if (optionConfig?.valueField) {
-        props.valueField = optionConfig.valueField;
-      }
-      if (optionConfig?.dataSource) {
-        props.dataSource = optionConfig.dataSource;
-      }
-      if (optionConfig?.extraParams) {
-        props.extraParams = optionConfig.extraParams;
-      }
-    }
+    props.optionSourceType = 'default';
+    props.options = uiSchema?.enum || [];
   }
 
   if (xComponent === 'TimePicker') {