@pisell/materials 1.0.478 → 1.0.480

package/es/components/dataSourceComponents/fields/TimePicker/style.less

@@ -0,0 +1,86 @@
+.pisell-h5-time-picker-wrapper {
+  position: relative;
+  width: 100%;
+  display: inline-flex;
+  align-items: center;
+
+  .pisell-h5-time-picker-suffix {
+    position: absolute;
+    right: 11px;
+    color: var(--pisell-lowcode-color-icon, #98A2B3);
+    pointer-events: none;
+    z-index: 1;
+    cursor: pointer;
+  }
+}
+
+.pisell-h5-time-picker {
+  width: 100%;
+  padding: 4px 11px;
+  color: var(--pisell-lowcode-color-text);
+  font-size: 14px;
+  line-height: 1.5714285714285714;
+  background-color: var(--pisell-lowcode-color-bg-container);
+  border: 1px solid var(--pisell-lowcode-color-border);
+  border-radius: var(--pisell-lowcode-border-radius);
+  transition: all 0.2s;
+  outline: none;
+  box-sizing: border-box;
+
+  // 让原生图标透明但保持可点击
+  &::-webkit-calendar-picker-indicator {
+    opacity: 0;
+    width: 20px;
+    height: 20px;
+    cursor: pointer;
+    position: absolute;
+    right: 8px;
+  }
+  &::-webkit-time-picker-indicator {
+    opacity: 0;
+    width: 20px;
+    height: 20px;
+    cursor: pointer;
+    position: absolute;
+    right: 8px;
+  }
+
+  // 默认是 middle 尺寸
+  height: 32px;
+
+  &.pisell-h5-time-picker-lg {
+    padding: 7px 11px;
+    height: 40px;
+    font-size: 16px;
+  }
+
+  &.pisell-h5-time-picker-sm {
+    padding: 0px 7px;
+    height: 24px;
+  }
+
+  &:hover {
+    border-color: var(--pisell-lowcode-color-primary);
+  }
+
+  &:focus {
+    border-color: var(--pisell-lowcode-color-primary);
+    box-shadow: 0 0 0 2px var(--pisell-lowcode-color-primary-bg-hover);
+    outline: 0;
+  }
+
+  &:disabled {
+    color: var(--pisell-lowcode-color-text-disabled);
+    background-color: var(--pisell-lowcode-color-bg-container-disabled);
+    border-color: var(--pisell-lowcode-color-border);
+    box-shadow: none;
+    cursor: not-allowed;
+  }
+
+  &::placeholder {
+    color: var(--pisell-lowcode-color-text-placeholder);
+  }
+
+  // 添加右侧padding以容纳图标
+  padding-right: 30px !important;
+} 

package/es/components/dataSourceComponents/fields/index.d.ts

@@ -30,7 +30,7 @@ declare const formFieldMap: {
     }) => import("react").JSX.Element;
     InputNumber: import("react").FC<any>;
     Percent: import("react").FC<any>;
-    TimePicker: import("react").FC<import("antd").TimePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
+    TimePicker: import("react").FC<import("./TimePicker/type").TimePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
     'Input.JSON': import("react").FC<any>;
     'Input.URL': import("react").FC<import("antd").InputProps & import("react").RefAttributes<import("antd").InputRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
     'Input.Password': import("react").FC<import("antd/es/input").PasswordProps & import("react").RefAttributes<import("antd").InputRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
@@ -60,5 +60,5 @@ declare const getFieldComponent: (fieldComponent: string) => import("react").FC<
     valueField: string;
 } & {
     dataSource?: any;
-}) => import("react").JSX.Element) | import("react").FC<import("antd").TimePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./DateRangePicker/type").DateRangePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
+}) => import("react").JSX.Element) | import("react").FC<import("./TimePicker/type").TimePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./DateRangePicker/type").DateRangePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
 export { getFieldComponent, formFieldMap };

package/es/components/dataSourceComponents/hooks/useActions.js

@@ -35,7 +35,8 @@ var useActions = function useActions() {
       fields: fields || []
     }),
     formatListResult = _useFormat.formatListResult,
-    formatListParams = _useFormat.formatListParams;
+    formatListParams = _useFormat.formatListParams,
+    formatCreateUpdateParams = _useFormat.formatCreateUpdateParams;
   var getParsedActions = useMemoizedFn(function () {
     return parseActions(originalActions, {});
   });
@@ -103,7 +104,7 @@ var useActions = function useActions() {
             }
             actions = getParsedActions();
             createApi = genCustomApi(actions === null || actions === void 0 ? void 0 : actions.create);
-            return _context2.abrupt("return", createApi(values));
+            return _context2.abrupt("return", createApi(formatCreateUpdateParams(values)));
           case 6:
             if (name) {
               _context2.next = 8;
@@ -113,7 +114,7 @@ var useActions = function useActions() {
           case 8:
             return _context2.abrupt("return", createNocobaseData({
               key: name,
-              data: values,
+              data: formatCreateUpdateParams(values),
               headers: getHeaders()
             }));
           case 9:
@@ -186,7 +187,7 @@ var useActions = function useActions() {
             return _context4.abrupt("return", {});
           case 4:
             updateApi = genCustomApi(actions === null || actions === void 0 ? void 0 : actions.update);
-            return _context4.abrupt("return", updateApi(values));
+            return _context4.abrupt("return", updateApi(formatCreateUpdateParams(values)));
           case 8:
             id = values === null || values === void 0 ? void 0 : values.id;
             if (!(!id || !name)) {
@@ -199,7 +200,7 @@ var useActions = function useActions() {
             return _context4.abrupt("return", updateNocobaseData({
               key: name,
               id: id,
-              data: values,
+              data: formatCreateUpdateParams(values),
               headers: getHeaders()
             }));
           case 13:

package/es/components/date-picker/datePickerCpt.d.ts

@@ -3,6 +3,7 @@ import { PickerDateProps } from 'antd/es/date-picker/generatePicker';
 import { Dayjs } from 'dayjs';
 import './index.less';
 interface DatePickerCptProps extends PickerDateProps<Dayjs> {
+    showTime: any;
 }
 declare const DatePickerCpt: (props: DatePickerCptProps) => React.JSX.Element;
 export default DatePickerCpt;

package/es/components/date-picker/datePickerCpt.js

@@ -128,7 +128,7 @@ var DatePickerCpt = function DatePickerCpt(props) {
       if (isFunction(propsFormat)) {
         return propsFormat(value);
       }
-      return propsFormat;
+      return propsFormat + (showTime !== null && showTime !== void 0 && showTime.format ? " ".concat(showTime === null || showTime === void 0 ? void 0 : showTime.format) : '');
     }
     var localeValue = locale === null || locale === void 0 ? void 0 : locale.locale;
     return localeValue === 'en' || localeValue === 'en-US' ? 'DD/MM/YYYY' : 'YYYY/MM/DD';
@@ -161,8 +161,12 @@ var DatePickerCpt = function DatePickerCpt(props) {
     setPopupOpen(visible);
   };
   var handleOk = function handleOk(val) {
-    var returnValue = val || _value;
-    onChange === null || onChange === void 0 ? void 0 : onChange(returnValue, returnValue === null || returnValue === void 0 ? void 0 : returnValue.format('YYYY-MM-DD'));
+    var _returnValue;
+    var returnValue = val;
+    if (returnValue !== null) {
+      returnValue = returnValue || _value;
+    }
+    onChange === null || onChange === void 0 ? void 0 : onChange(returnValue, (_returnValue = returnValue) === null || _returnValue === void 0 ? void 0 : _returnValue.format('YYYY-MM-DD'));
     handleOpenChange(false);
   };
   var handleChange = function handleChange(val, valStr, isNotChange) {

package/es/components/date-picker/index.js

@@ -1,15 +1,15 @@
+import { DatePicker as OriginalDatePicker } from 'antd';
 import { withMomentProps } from "../../utils/hoc";
 import dayjs from 'dayjs';
 import { RangePicker, OldPisellDateRangePicker } from "@pisell/date-picker";
 import localeData from 'dayjs/plugin/localeData';
 import weekday from 'dayjs/plugin/weekday';
-import DatePickerCpt from "./datePickerCpt";
 dayjs.extend(weekday);
 dayjs.extend(localeData);
 
 // const OriginalRangePicker = OriginalDatePicker.RangePicker;
 
-var DatePicker = withMomentProps(DatePickerCpt, ['defaultPickerValue', 'defaultValue', 'showTime.defaultValue', 'value']);
+var DatePicker = withMomentProps(OriginalDatePicker, ['defaultPickerValue', 'defaultValue', 'showTime.defaultValue', 'value']);
 
 // const RangePicker = withMomentProps(OriginalRangePicker, [
 //   'defaultPickerValue',

package/es/components/date-picker/index.less

@@ -231,7 +231,7 @@ textarea.pisell-lowcode-picker.pisell-lowcode-mode-date-picker
   color: #667085;
 }
 .pisell-lowcode-picker-large {
-  padding: 7px 11px 7px;
+  padding: 7px 11px 7px !important;
 }
 .pisell-lowcode-picker-large .pisell-lowcode-picker-input > input {
   font-size: 16px;

package/es/components/page/index.js

@@ -60,6 +60,9 @@ var Page = function Page(props) {
     if (props !== null && props !== void 0 && props.theme) {
       var _props$theme, _props$theme$token;
       return _objectSpread(_objectSpread({}, props.theme), {}, {
+        cssVar: {
+          key: 'app'
+        },
         token: _objectSpread(_objectSpread({}, props.theme.token), {}, {
           // 外部透传主题时，如果没有传入colorPrimary 默认使用主项目内主题色
           colorPrimary: (props === null || props === void 0 ? void 0 : (_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : (_props$theme$token = _props$theme.token) === null || _props$theme$token === void 0 ? void 0 : _props$theme$token.colorPrimary) || themeColor || '#7F56D9'
@@ -67,6 +70,9 @@ var Page = function Page(props) {
       });
     }
     return {
+      cssVar: {
+        key: 'app'
+      },
       components: {
         Table: {
           colorFillContent: '#EAECF0',

package/es/components/select/index.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
-import "./index.less";
-declare const Select: (props: any) => import("react").JSX.Element;
+import React from 'react';
+import './index.less';
+declare const Select: (props: any) => React.JSX.Element;
 export default Select;

package/es/components/select/index.js

@@ -5,58 +5,100 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { Checkbox, Divider, Select as OriginalSelect } from "antd";
-import { useCallback, useMemo, forwardRef } from "react";
+import React, { useCallback, useMemo, forwardRef, useState } from 'react';
+import { Checkbox, Divider, Select as OriginalSelect, Input } from 'antd';
+import { useControllableValue, useMemoizedFn } from 'ahooks';
+import Iconfont from "../iconfont";
 import { getText } from "../../locales";
 import { withWrap } from "../../utils/hoc";
-import { useControllableValue, useMemoizedFn } from "ahooks";
+import BrowserSelect from "../browserSelect";
 import "./index.less";
-var prefix = "pisell-lowcode-";
+var prefix = 'pisell-lowcode-';
 var SelectBase = /*#__PURE__*/forwardRef(function (props, ref) {
   var isShowDropdown = props.isShowDropdown,
     selectAll = props.selectAll,
     mode = props.mode,
     options = props.options,
-    propsDropdownRender = props.dropdownRender;
+    propsDropdownRender = props.dropdownRender,
+    showSearch = props.showSearch,
+    styleType = props.styleType,
+    _props$optionFilterPr = props.optionFilterProp,
+    optionFilterProp = _props$optionFilterPr === void 0 ? 'value' : _props$optionFilterPr;
   var _useControllableValue = useControllableValue(props),
     _useControllableValue2 = _slicedToArray(_useControllableValue, 2),
     state = _useControllableValue2[0],
     setState = _useControllableValue2[1];
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    searchValue = _useState2[0],
+    setSearchValue = _useState2[1];
+  var filteredOptions = useMemo(function () {
+    if (!searchValue) return options;
+    return options.filter(function (option) {
+      var _option$optionFilterP;
+      var optionValue = ((_option$optionFilterP = option[optionFilterProp]) === null || _option$optionFilterP === void 0 ? void 0 : _option$optionFilterP.toString().toLowerCase()) || '';
+      return optionValue.includes(searchValue.toLowerCase());
+    });
+  }, [options, searchValue, optionFilterProp]);
   var onSelectAllChange = useMemoizedFn(function (e) {
     if (e.target.checked) {
-      setState(options.map(function (item) {
+      setState(filteredOptions.map(function (item) {
         return item.value;
-      }), options);
+      }), filteredOptions);
     } else {
       setState([], []);
     }
   });
   var isShowSelectAll = useMemo(function () {
-    return mode === "multiple" && isShowDropdown && selectAll;
+    return mode === 'multiple' && isShowDropdown && selectAll;
   }, [mode, selectAll, isShowDropdown]);
   var checkboxChecked = useMemo(function () {
-    if (mode !== "multiple") return false;
-    return (state === null || state === void 0 ? void 0 : state.length) === (options === null || options === void 0 ? void 0 : options.length) && state.sort().join("") === options.map(function (item) {
+    if (mode !== 'multiple') return false;
+    return (state === null || state === void 0 ? void 0 : state.length) === (filteredOptions === null || filteredOptions === void 0 ? void 0 : filteredOptions.length) && state.sort().join('') === filteredOptions.map(function (item) {
       return item.value;
-    }).sort().join("");
-  }, [state, options]);
+    }).sort().join('');
+  }, [state, filteredOptions]);
   var dropdownRender = useCallback(propsDropdownRender ? propsDropdownRender : function (originNode) {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, originNode, isShowDropdown && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider, {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, showSearch && /*#__PURE__*/React.createElement(Input
+    // size="large"
+    , {
+      placeholder: getText('select-dropdown-render-search'),
+      value: searchValue,
+      onChange: function onChange(e) {
+        return setSearchValue(e.target.value);
+      },
+      style: {
+        width: '100%',
+        marginBottom: '4px'
+      },
+      bordered: false,
+      prefix: /*#__PURE__*/React.createElement(Iconfont, {
+        style: {
+          color: '#98A2B3'
+        },
+        type: "pisell2-search-lg"
+      })
+    }), originNode, isShowDropdown && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider, {
       className: "".concat(prefix, "select-dropdown-render-divider")
     }), /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefix, "select-dropdown-render-options-wrap")
     }, isShowSelectAll && /*#__PURE__*/React.createElement(Checkbox, {
       onChange: onSelectAllChange,
       checked: checkboxChecked
-    }, getText("select-dropdown-render-select-all")))));
-  }, [isShowDropdown, isShowSelectAll, checkboxChecked, propsDropdownRender]);
+    }, getText('select-dropdown-render-select-all')))));
+  }, [isShowDropdown, isShowSelectAll, checkboxChecked, propsDropdownRender, searchValue, showSearch]);
+  if (styleType === 'system') {
+    return /*#__PURE__*/React.createElement(BrowserSelect, props);
+  }
   return /*#__PURE__*/React.createElement(OriginalSelect, _extends({}, props, {
+    showSearch: false,
     ref: ref,
     value: state,
     onChange: function onChange(value, option) {
       return setState(value, option);
     },
-    dropdownRender: dropdownRender
+    dropdownRender: dropdownRender,
+    options: filteredOptions
   }));
 });
 var Select = withWrap(SelectBase);

package/es/components/table/Table/utils.d.ts

@@ -167,7 +167,7 @@ export declare const getSettingKeyArrByMode: ({ filter, columnSetting, dataSourc
     sort?: SortType | undefined;
     mode: "" | "localStorage" | "remote";
     currentViewMode: ModeType;
-}) => ("filter_setting" | "column_setting" | "gallery_setting" | "view_mode" | "group_by" | "order_by")[];
+}) => ("view_mode" | "column_setting" | "order_by" | "group_by" | "gallery_setting" | "filter_setting")[];
 export declare const omit: (obj: Record<string, any>, keys: string[]) => Record<string, any>;
 export declare const stringify: (obj: Record<string, any>) => string;
 export {};

package/es/locales/en-US.d.ts

@@ -8,6 +8,7 @@ declare const _default: {
     "table-pagination-next": string;
     "table-pagination-total": (current: string, total: string) => string;
     "select-dropdown-render-select-all": string;
+    "select-dropdown-render-search": string;
     "sort-button-text": string;
     "sort-oldest-to-newest": string;
     "sort-newest-to-oldest": string;

package/es/locales/en-US.js

@@ -10,6 +10,7 @@ export default {
     return "Page ".concat(current, " of ").concat(total);
   },
   "select-dropdown-render-select-all": "Select all",
+  "select-dropdown-render-search": "Search",
   "sort-button-text": "Sort",
   "sort-oldest-to-newest": "Oldest to newest",
   "sort-newest-to-oldest": "Newest to oldest",

package/es/locales/zh-CN.d.ts

@@ -8,6 +8,7 @@ declare const _default: {
     "table-pagination-next": string;
     "table-pagination-total": (current: string, total: string) => string;
     "select-dropdown-render-select-all": string;
+    "select-dropdown-render-search": string;
     "sort-button-text": string;
     "sort-oldest-to-newest": string;
     "sort-newest-to-oldest": string;

package/es/locales/zh-CN.js

@@ -10,6 +10,7 @@ export default {
     return "\u7B2C".concat(current, "\u9875 \u5171").concat(total, "\u9875");
   },
   "select-dropdown-render-select-all": "全选",
+  "select-dropdown-render-search": "搜索",
   "sort-button-text": "排序",
   "sort-oldest-to-newest": "从旧到新",
   "sort-newest-to-oldest": "从新到旧",

package/es/locales/zh-TW.d.ts

@@ -8,6 +8,7 @@ declare const _default: {
     "table-pagination-next": string;
     "table-pagination-total": (current: string, total: string) => string;
     "select-dropdown-render-select-all": string;
+    "select-dropdown-render-search": string;
     "sort-button-text": string;
     "sort-oldest-to-newest": string;
     "sort-newest-to-oldest": string;

package/es/locales/zh-TW.js

@@ -10,6 +10,7 @@ export default {
     return "\u7B2C".concat(current, "\u9801 \u5171").concat(total, "\u9801");
   },
   "select-dropdown-render-select-all": "全選",
+  "select-dropdown-render-search": "搜索",
   "sort-button-text": "排序",
   "sort-oldest-to-newest": "從舊到新",
   "sort-newest-to-oldest": "從新到舊",

package/lib/components/browserSelect/index.d.ts

@@ -1,7 +1,13 @@
 import React from "react";
 import "./index.less";
-interface BrowserSelectProps extends React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement> {
-    options: any[];
+interface Option {
+    label: React.ReactNode;
+    value: string | number;
+}
+interface BrowserSelectProps extends Omit<React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, 'value' | 'onChange'> {
+    options: Option[];
+    value?: string | number;
+    onChange?: (value: string | number, option: Option) => void;
 }
 /**
  * @title: 系统级别的下拉框

package/lib/components/browserSelect/index.js

@@ -34,26 +34,32 @@ __export(browserSelect_exports, {
 module.exports = __toCommonJS(browserSelect_exports);
 var import_react = __toESM(require("react"));
 var import_classnames = __toESM(require("classnames"));
+var import_icons = require("@ant-design/icons");
 var import_index = require("./index.less");
 var BrowserSelect = (props) => {
-  const { options, ...resetProps } = props;
+  const { options, onChange, value, style, ...resetProps } = props;
   const _options = (0, import_react.useMemo)(() => {
-    return (props.options || []).map((d) => {
+    return (options || []).map((d) => {
       return /* @__PURE__ */ import_react.default.createElement("option", { value: d.value, key: d.value }, d.label);
     });
-  }, [props.options]);
-  return /* @__PURE__ */ import_react.default.createElement(
+  }, [options]);
+  const handleChange = (e) => {
+    e.persist();
+    const selectedValue = e.target.value;
+    const selectedOption = options.find((opt) => String(opt.value) === selectedValue);
+    if (selectedOption) {
+      onChange == null ? void 0 : onChange(selectedOption.value, selectedOption);
+    }
+  };
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "browser-select-wrapper", style: { ...style } }, /* @__PURE__ */ import_react.default.createElement(
     "select",
     {
       ...resetProps,
+      value,
       className: (0, import_classnames.default)("date-picker-pisell-browser-select", resetProps.className),
-      onChange: (e) => {
-        var _a;
-        e.persist();
-        (_a = resetProps.onChange) == null ? void 0 : _a.call(resetProps, e);
-      }
+      onChange: handleChange
     },
     _options
-  );
+  ), /* @__PURE__ */ import_react.default.createElement(import_icons.DownOutlined, { className: "browser-select-icon" }));
 };
 var browserSelect_default = BrowserSelect;

package/lib/components/browserSelect/index.less

@@ -1,8 +1,24 @@
+.browser-select-wrapper {
+  position: relative;
+  width: 100%;
+  display: inline-block;
+}
+
+.browser-select-icon {
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  transform: translateY(-50%);
+  color: #D0D5DD;
+  pointer-events: none;
+  font-size: 16px;
+}
+
 .date-picker-pisell-browser-select {
-  padding: 9px 16px;
+  padding: 10px 16px;
+  padding-right: 30px;
   border-radius: 8px;
   background-color: #fff;
-  background-image: url('./chevron-down.png');
   color: var(--Gray-true-900, #141414);
   font-size: 16px;
   font-style: normal;
@@ -12,7 +28,35 @@
   appearance: none;
   -webkit-appearance: none;
   -moz-appearance: none;
-  background-position: right 10px center;
-  background-size: 12px;
-  background-repeat: no-repeat;
-}
+  width: 100%;
+
+  &:hover {
+    border-color: var(--theme-color, #7F56D9);
+    & + .browser-select-icon {
+      color: var(--theme-color, #7F56D9);
+    }
+  }
+
+  &:focus {
+    border-color: var(--theme-color, #7F56D9);
+    box-shadow: 0 0 0 2px rgba(5, 145, 255, 0.1);
+    outline: none;
+    & + .browser-select-icon {
+      color: var(--theme-color, #7F56D9);
+    }
+  }
+
+  &:active {
+    border-color: var(--theme-color, #7F56D9);
+  }
+
+  &:disabled {
+    background-color: rgba(0, 0, 0, 0.04);
+    border-color: #d9d9d9;
+    cursor: not-allowed;
+    color: rgba(0, 0, 0, 0.25);
+    & + .browser-select-icon {
+      color: rgba(0, 0, 0, 0.25);
+    }
+  }
+}

package/lib/components/dataSourceComponents/dataSourceForm/BaseForm.js

@@ -77,7 +77,8 @@ var BaseForm = (0, import_react.forwardRef)(
       {
         renderMode,
         groupInfoPosition,
-        currentValue
+        currentValue,
+        size: others.size
       },
       /* @__PURE__ */ import_react.default.createElement(
         import_form.default,

package/lib/components/dataSourceComponents/dataSourceForm/provider/formSetting/FormSettingContext.d.ts

@@ -5,6 +5,7 @@ export interface FormSettingContextType {
     groupInfoPosition?: 'top' | 'side';
     children?: React.ReactNode;
     currentValue?: 'server' | 'local';
+    size?: 'small' | 'middle' | 'large';
 }
 export declare const FormSettingContext: import("react").Context<FormSettingContextType>;
 export default FormSettingContext;

package/lib/components/dataSourceComponents/dataSourceForm/provider/formSetting/FormSettingContext.js

@@ -25,7 +25,8 @@ __export(FormSettingContext_exports, {
 module.exports = __toCommonJS(FormSettingContext_exports);
 var import_react = require("react");
 var initialContext = {
-  renderMode: "edit"
+  renderMode: "edit",
+  size: "large"
 };
 var FormSettingContext = (0, import_react.createContext)(initialContext);
 var FormSettingContext_default = FormSettingContext;

package/lib/components/dataSourceComponents/dataSourceForm/provider/formSetting/FormSettingProvider.js

@@ -35,14 +35,15 @@ module.exports = __toCommonJS(FormSettingProvider_exports);
 var import_react = __toESM(require("react"));
 var import_FormSettingContext = __toESM(require("./FormSettingContext"));
 var FormSettingProvider = (props) => {
-  const { children, renderMode, groupInfoPosition, currentValue } = props;
+  const { children, renderMode, groupInfoPosition, currentValue, size } = props;
   const value = import_react.default.useMemo(() => {
     return {
       renderMode,
       groupInfoPosition,
-      currentValue
+      currentValue,
+      size
     };
-  }, [renderMode, groupInfoPosition, currentValue]);
+  }, [renderMode, groupInfoPosition, currentValue, size]);
   return /* @__PURE__ */ import_react.default.createElement(
     import_FormSettingContext.default.Provider,
     {

package/lib/components/dataSourceComponents/dataSourceForm/type.d.ts

@@ -13,4 +13,5 @@ export interface DataSourceFormProps {
     currentValue?: 'server' | 'local';
     children: React.ReactNode;
     className?: string;
+    size?: 'small' | 'middle' | 'large';
 }

package/lib/components/dataSourceComponents/dataSourceForm/utils.d.ts

@@ -31,7 +31,10 @@ export declare const formItemNameReverse: (name: string) => string;
  * @Author: shengjie.zuo
  * @Date: 2024-11-23 17:14:25
  */
-export declare const withFormItem: <P extends object>(WrappedComponent: React.ComponentType<P>, otherFormItemProps?: Record<string, any>) => React.FC<P & WithFormItemProps>;
+export declare const withFormItem: <P extends object>(WrappedComponent: React.ComponentType<P>, overlayProps?: {
+    otherFormItemProps?: Record<string, any>;
+    innerProps?: Record<string, any>;
+}) => React.FC<P & WithFormItemProps>;
 export declare const withDataSource: <P extends unknown>(WrappedComponent: React.ComponentType<P>) => (props: P & {
     dataSource?: any;
 }) => React.JSX.Element;