@seakoi/native-ui 1.1.3 → 1.3.0

package/dist/commonjs/components/base/picker/index.js

@@ -3,9 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+var _exportNames = {
+  Picker: true
+};
+exports.Picker = void 0;
 var _picker = require("./picker.js");
 Object.keys(_picker).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _picker[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
@@ -14,14 +19,31 @@ Object.keys(_picker).forEach(function (key) {
     }
   });
 });
-var _pickerTrigger = require("./picker-trigger.js");
-Object.keys(_pickerTrigger).forEach(function (key) {
+var _pickerContent = require("./picker-content.js");
+Object.keys(_pickerContent).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _pickerTrigger[key]) return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _pickerContent[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _pickerTrigger[key];
+      return _pickerContent[key];
     }
   });
+});
+var _pickerField = require("./picker-field.js");
+Object.keys(_pickerField).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _pickerField[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _pickerField[key];
+    }
+  });
+});
+const Picker = exports.Picker = Object.assign(_picker.Picker, {
+  Field: _pickerField.PickerField,
+  Content: _pickerContent.PickerContent
 });

package/dist/commonjs/components/base/picker/picker-content.js

@@ -0,0 +1,64 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PickerContent = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _index = require("./../index.js");
+var _pickerContext = require("./picker-context.js");
+var _index2 = require("./style/index.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+/**
+ * Picker 内容组件的属性接口
+ * 继承自 Modal 组件,排除 visible 和 children 属性
+ */
+
+const PickerContent = ({
+  style,
+  children,
+  headerTitle,
+  headerStyle,
+  hiddenHeaderCloseIcon,
+  ...modalProps
+}) => {
+  const context = (0, _react.useContext)(_pickerContext.PickerContext);
+  const styles = (0, _index2.usePickerContentStyles)();
+  let childNode = null;
+  const injectToChildrenProps = {
+    value: context?.value,
+    onChange: context?.onChange
+  };
+  if (/*#__PURE__*/_react.default.isValidElement(children)) {
+    childNode = /*#__PURE__*/_react.default.cloneElement(children, injectToChildrenProps);
+  } else if (typeof children === 'function') {
+    childNode = children(injectToChildrenProps);
+  }
+  (0, _react.useEffect)(() => {
+    context?.setDisabled?.(!!childNode?.props?.disabled);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [childNode?.props?.disabled, context?.setDisabled]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Portal, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Modal, {
+      safeAreaInsetBottom: true,
+      position: "bottom",
+      contentHeight: '50%',
+      ...modalProps,
+      visible: !!context?.visible,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Flex, {
+        vertical: true,
+        align: "stretch",
+        gap: 16,
+        style: [styles.container, style],
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ModalHeader, {
+          title: headerTitle,
+          style: headerStyle,
+          onClose: context?.toggleVisible,
+          showClose: !hiddenHeaderCloseIcon
+        }), childNode]
+      })
+    })
+  });
+};
+exports.PickerContent = PickerContent;

package/dist/commonjs/components/base/picker/picker-context.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PickerContext = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const PickerContext = exports.PickerContext = /*#__PURE__*/_react.default.createContext(null);

package/dist/commonjs/components/base/picker/picker-field.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PickerField = PickerField;
+var _ahooks = require("ahooks");
+var _lodashEs = require("lodash-es");
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _index = require("./../index.js");
+var _index2 = require("../../../native-provider/index.js");
+var _index3 = require("../../../shared/utils/index.js");
+var _pickerContext = require("./picker-context.js");
+var _index4 = require("./style/index.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function PickerField(props) {
+  const theme = (0, _index2.useTheme)();
+  const styles = (0, _index4.usePickerFieldStyles)();
+  const context = (0, _react.useContext)(_pickerContext.PickerContext);
+  const renderValueRef = (0, _ahooks.useLatest)(props.renderValue);
+  const value = context?.value;
+  const hasControllableValue = !(0, _lodashEs.isNil)(value) && (!Array.isArray(value) || value.length > 0);
+  const displayValue = (0, _react.useMemo)(() => {
+    return typeof renderValueRef.current !== 'function' ? value : renderValueRef.current?.(value);
+  }, [value, renderValueRef]);
+  const textColor = hasControllableValue ? theme.palette.fontGray1 : theme.palette.fontGray3;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+    style: [styles.container, context?.disabled && styles.disabled],
+    onPress: context?.toggleVisible,
+    disabled: !!context?.disabled,
+    children: (0, _index3.safetyRenderChildren)(hasControllableValue ? displayValue : props.placeholder, displayText => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Text, {
+      size: 14,
+      color: textColor,
+      children: displayText
+    }))
+  });
+}

package/dist/commonjs/components/base/picker/picker.js

@@ -6,105 +6,36 @@ Object.defineProperty(exports, "__esModule", {
 exports.Picker = void 0;
 var _ahooks = require("ahooks");
 var _react = require("react");
-var _index = require("../button/index.js");
-var _index2 = require("../flex/index.js");
-var _index3 = require("../modal/index.js");
-var _index4 = require("../picker-view/index.js");
-var _picker = require("../picker-view/utils/picker.js");
-var _index5 = require("../portal/index.js");
-var _pickerTrigger = require("./picker-trigger.js");
+var _pickerContext = require("./picker-context.js");
 var _jsxRuntime = require("react/jsx-runtime");
-const Picker = ({
-  placeholder = '请选择',
-  disabled = false,
-  title = '请选择',
-  formatter,
-  children,
-  style,
-  confirmText = '确定',
-  ...restProps
-}) => {
-  const [value, setValue] = (0, _ahooks.useControllableValue)(restProps, {
-    defaultValue: restProps.defaultValue
-  });
-  const [visible, setVisible] = (0, _react.useState)(false);
-
-  // 内部状态用于管理滚动时的临时值
-  const [localValue, setLocalValue] = (0, _react.useState)(restProps.value ?? restProps.defaultValue ?? []);
-
-  // 用 ref 同步保存最新值，解决 useMemoizedFn 闭包问题
-  const localValueRef = (0, _react.useRef)(localValue);
-  localValueRef.current = localValue;
-
-  // 滑动时的临时 options（不用于 displayText）
-  const localOptionsRef = (0, _react.useRef)([]);
+/**
+ * Picker 组件的基础属性接口
+ * @template T 选择器值的类型
+ */
 
-  /** 格式化显示文案 - 根据 value 从 columns 计算 */
-  const displayText = (0, _react.useMemo)(() => {
-    if (!value?.length) return '';
-
-    // 从 columns 计算对应的 options
-    const options = (0, _picker.findOptionsByValue)(value, restProps.columns);
-    if (formatter) {
-      return formatter(value, options);
-    }
-    return options.map(opt => opt?.label).filter(Boolean).join(' / ');
-  }, [value, restProps.columns, formatter]);
-  const handleOpen = (0, _ahooks.useMemoizedFn)(() => {
-    // 打开时同步外部 value 到内部
-    // 如果 value 为空，使用 columns 的默认值（第一个选项）
-    const initialValue = value?.length ? value : (0, _picker.getDefaultValues)(restProps.columns);
-    setLocalValue(initialValue);
-    setVisible(true);
-  });
-  const handleClose = (0, _ahooks.useMemoizedFn)(() => {
-    setVisible(false);
-  });
-  const handleChange = (0, _ahooks.useMemoizedFn)((v, options) => {
-    setLocalValue(v);
-    localOptionsRef.current = options;
+const Picker = props => {
+  const [visible, {
+    toggle: toggleVisible
+  }] = (0, _ahooks.useToggle)();
+  const [disabled, setDisabled] = (0, _react.useState)(props.disabled);
+  const [value, setValue] = (0, _ahooks.useControllableValue)(props, {
+    trigger: props.trigger
   });
-  const handleConfirm = (0, _ahooks.useMemoizedFn)(() => {
-    setVisible(false);
-    setValue(localValueRef.current);
+  const _onChange = (0, _ahooks.useMemoizedFn)(value => {
+    setValue(value);
+    toggleVisible();
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_pickerTrigger.PickerTrigger, {
-      displayText: displayText,
-      placeholder: placeholder,
-      disabled: disabled,
-      style: style,
-      onPress: handleOpen,
-      children: children
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index5.Portal, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.Modal, {
-        visible: visible,
-        position: "bottom",
-        safeAreaInsetBottom: true,
-        contentHeight: '50%',
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index2.Flex, {
-          vertical: true,
-          align: "stretch",
-          gap: 16,
-          style: {
-            flex: 1,
-            padding: 16
-          },
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.ModalHeader, {
-            title: title,
-            onClose: handleClose
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.PickerView, {
-            ...restProps,
-            value: localValue,
-            onChange: handleChange
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Button, {
-            text: confirmText,
-            size: "large",
-            onPress: handleConfirm
-          })]
-        })
-      })
-    })]
+  const contextValue = (0, _react.useMemo)(() => ({
+    value,
+    visible,
+    disabled,
+    setDisabled,
+    toggleVisible,
+    onChange: _onChange
+  }), [value, visible, disabled, toggleVisible, _onChange]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_pickerContext.PickerContext.Provider, {
+    value: contextValue,
+    children: props.children
   });
 };
 exports.Picker = Picker;

package/dist/commonjs/components/base/picker/style/index.js

@@ -3,14 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.usePickerFieldStyles = void 0;
+exports.usePickerFieldStyles = exports.usePickerContentStyles = void 0;
 var _index = require("../../../../native-provider/index.js");
 const usePickerFieldStyles = exports.usePickerFieldStyles = (0, _index.createThemedStyles)(theme => ({
   container: {
     flex: 1,
-    alignSelf: 'stretch'
-  },
-  content: {
+    alignSelf: 'stretch',
     backgroundColor: theme.palette.white,
     paddingVertical: 12,
     paddingHorizontal: 12
@@ -18,4 +16,10 @@ const usePickerFieldStyles = exports.usePickerFieldStyles = (0, _index.createThe
   disabled: {
     backgroundColor: theme.palette.blueGray2
   }
+}));
+const usePickerContentStyles = exports.usePickerContentStyles = (0, _index.createThemedStyles)(() => ({
+  container: {
+    flex: 1,
+    padding: 16
+  }
 }));

package/dist/commonjs/components/base/picker-backup/base-picker-container.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BasePickerContainer = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _index = require("../flex/index.js");
+var _index2 = require("../modal/index.js");
+var _index3 = require("../portal/index.js");
+var _pickerTrigger = require("./picker-trigger.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const BasePickerContainer = ({
+  children,
+  pickerTriggerProps,
+  modalProps
+}) => {
+  const [visible, setVisible] = (0, _react.useState)(false);
+  const controller = (0, _react.useMemo)(() => ({
+    visible,
+    setVisible
+  }), [visible]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_pickerTrigger.PickerTrigger, {
+      ...pickerTriggerProps
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.Portal, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Modal, {
+        visible: visible,
+        position: "bottom",
+        safeAreaInsetBottom: true,
+        contentHeight: '50%',
+        ...modalProps,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Flex, {
+          vertical: true,
+          align: "stretch",
+          gap: 16,
+          style: {
+            flex: 1,
+            padding: 16
+          },
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.ModalHeader, {
+            onClose: () => setVisible(false)
+          }), children(controller)]
+        })
+      })
+    })]
+  });
+};
+exports.BasePickerContainer = BasePickerContainer;

package/dist/commonjs/components/base/picker-backup/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _pickerBackup = require("./picker-backup.js");
+Object.keys(_pickerBackup).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _pickerBackup[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _pickerBackup[key];
+    }
+  });
+});
+var _pickerTrigger = require("./picker-trigger.js");
+Object.keys(_pickerTrigger).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _pickerTrigger[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _pickerTrigger[key];
+    }
+  });
+});

package/dist/commonjs/components/base/picker-backup/picker-backup.js

@@ -0,0 +1,75 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PickerBackup = void 0;
+var _ahooks = require("ahooks");
+var _react = _interopRequireWildcard(require("react"));
+var _index = require("../button/index.js");
+var _index2 = require("../picker/index.js");
+var _index3 = require("../picker-view/index.js");
+var _picker = require("../picker-view/utils/picker.js");
+var _utils = require("./utils.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const PickerBackup = ({
+  placeholder = '请选择',
+  headerTitle = '请选择',
+  formatter,
+  confirmText = '确定',
+  columns: rawColumns,
+  fieldNames,
+  ...restProps
+}) => {
+  const [draftValue, setDraftValue] = (0, _react.useState)();
+  const committedValueRef = (0, _react.useRef)(restProps.value ?? []);
+  const handleOpen = (0, _react.useCallback)(() => {
+    setDraftValue(committedValueRef.current);
+  }, []);
+
+  /** 标准化列数据：将自定义字段名映射为内部标准格式 */
+  const columns = (0, _react.useMemo)(() => (0, _utils.normalizeColumns)(rawColumns, fieldNames), [rawColumns, fieldNames]);
+
+  /** 格式化显示文案 - 根据 value 从 columns 计算 */
+  const _renderValue = (0, _ahooks.useMemoizedFn)(value => {
+    if (!value?.length) return;
+    const options = (0, _picker.findOptionsByValue)(value, columns);
+    if (formatter) {
+      return formatter(value, options);
+    }
+    return options.map(opt => opt?.label).filter(Boolean).join(' / ');
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index2.Picker, {
+    ...restProps,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Picker.Field, {
+      placeholder: placeholder,
+      renderValue: _renderValue
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Picker.Content, {
+      headerTitle: headerTitle,
+      onOpen: handleOpen,
+      children: ({
+        onChange,
+        value: contextValue
+      }) => {
+        // 同步 ref：始终保持最新的已提交值
+        committedValueRef.current = contextValue ?? [];
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.PickerView, {
+            columns: columns,
+            itemHeight: restProps.itemHeight,
+            value: draftValue,
+            onChange: setDraftValue
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Button, {
+            text: confirmText,
+            size: "large",
+            onPress: () => {
+              onChange?.(draftValue);
+            }
+          })]
+        });
+      }
+    })]
+  });
+};
+exports.PickerBackup = PickerBackup;

package/dist/commonjs/components/base/picker-backup/picker-copy.js

@@ -0,0 +1,106 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Picker = void 0;
+var _ahooks = require("ahooks");
+var _react = require("react");
+var _index = require("../button/index.js");
+var _index2 = require("../flex/index.js");
+var _index3 = require("../modal/index.js");
+var _index4 = require("../picker-view/index.js");
+var _picker = require("../picker-view/utils/picker.js");
+var _index5 = require("../portal/index.js");
+var _pickerTrigger = require("./picker-trigger.js");
+var _jsxRuntime = require("react/jsx-runtime");
+const Picker = ({
+  placeholder = '请选择',
+  disabled = false,
+  title = '请选择',
+  formatter,
+  children,
+  style,
+  confirmText = '确定',
+  ...restProps
+}) => {
+  const [value, setValue] = (0, _ahooks.useControllableValue)(restProps, {
+    defaultValue: restProps.defaultValue
+  });
+  const [visible, setVisible] = (0, _react.useState)(false);
+
+  // 内部状态用于管理滚动时的临时值
+  const [localValue, setLocalValue] = (0, _react.useState)(restProps.value ?? restProps.defaultValue ?? []);
+
+  // 滑动时的临时 options（不用于 displayText）
+  const localOptionsRef = (0, _react.useRef)([]);
+
+  /** 格式化显示文案 - 根据 value 从 columns 计算 */
+  const displayText = (0, _react.useMemo)(() => {
+    if (!value?.length) return '';
+
+    // 从 columns 计算对应的 options
+    const options = (0, _picker.findOptionsByValue)(value, restProps.columns);
+    if (formatter) {
+      return formatter(value, options);
+    }
+    return options.map(opt => opt?.label).filter(Boolean).join(' / ');
+  }, [value, restProps.columns, formatter]);
+  const handleOpen = (0, _ahooks.useMemoizedFn)(() => {
+    // 打开时同步外部 value 到内部
+    // 如果 value 为空，使用 columns 的默认值（第一个选项）
+    const initialValue = value?.length ? value : (0, _picker.getDefaultValues)(restProps.columns);
+    setLocalValue(initialValue);
+    setVisible(true);
+  });
+  const handleClose = (0, _ahooks.useMemoizedFn)(() => {
+    setVisible(false);
+  });
+  const handleChange = (0, _ahooks.useMemoizedFn)((v, options) => {
+    setLocalValue(v);
+    localOptionsRef.current = options;
+  });
+  const handleConfirm = (0, _ahooks.useMemoizedFn)(() => {
+    setVisible(false);
+    setValue(localValue);
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_pickerTrigger.PickerTrigger, {
+      displayText: displayText,
+      placeholder: placeholder,
+      disabled: disabled,
+      style: style,
+      onPress: handleOpen,
+      children: children
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index5.Portal, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.Modal, {
+        visible: visible,
+        position: "bottom",
+        safeAreaInsetBottom: true,
+        contentHeight: '50%',
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index2.Flex, {
+          vertical: true,
+          align: "stretch",
+          gap: 16,
+          style: {
+            flex: 1,
+            padding: 16
+          },
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.ModalHeader, {
+            title: title,
+            onClose: handleClose
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.PickerView, {
+            ...restProps,
+            value: localValue,
+            onChange: handleChange
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Button, {
+            text: confirmText,
+            size: "large",
+            onPress: handleConfirm
+          })]
+        })
+      })
+    })]
+  });
+};
+exports.Picker = Picker;

package/dist/commonjs/components/base/{picker → picker-backup}/picker-trigger.js

@@ -8,8 +8,8 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _index = require("../../../native-provider/index.js");
 var _index2 = require("../flex/index.js");
-var _index3 = require("../text/index.js");
-var _index4 = require("./style/index.js");
+var _index3 = require("../picker/style/index.js");
+var _index4 = require("../text/index.js");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /** Picker 基础触发器 Props */
@@ -23,7 +23,7 @@ const PickerTrigger = ({
   onPress
 }) => {
   const theme = (0, _index.useTheme)();
-  const styles = (0, _index4.usePickerFieldStyles)();
+  const styles = (0, _index3.usePickerFieldStyles)();
 
   /** 渲染触发器 */
   const renderTrigger = () => {
@@ -43,8 +43,8 @@ const PickerTrigger = ({
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Flex, {
         align: "center",
         gap: theme.spacing.sm,
-        style: [styles.content, disabled && styles.disabled, style],
-        children: /*#__PURE__*/_react.default.isValidElement(displayText) ? displayText : /*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.Text, {
+        style: [disabled && styles.disabled, style],
+        children: /*#__PURE__*/_react.default.isValidElement(displayText) ? displayText : /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.Text, {
           size: 14,
           color: displayText ? theme.palette.fontGray1 : theme.palette.fontGray3,
           children: displayText || placeholder

package/dist/commonjs/components/base/picker-backup/style/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePickerFieldStyles = void 0;
+var _index = require("../../../../native-provider/index.js");
+const usePickerFieldStyles = exports.usePickerFieldStyles = (0, _index.createThemedStyles)(theme => ({
+  container: {
+    flex: 1,
+    alignSelf: 'stretch',
+    backgroundColor: theme.palette.white,
+    paddingVertical: 12,
+    paddingHorizontal: 12
+  },
+  disabled: {
+    backgroundColor: theme.palette.blueGray2
+  }
+}));