@seakoi/native-ui 1.0.0

package/dist/commonjs/components/base/picker-view/utils/picker.js

@@ -0,0 +1,188 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getVisibleItemCount = exports.getDefaultValues = exports.getDataType = exports.findOptionsByValue = exports.findNextAllColumns = exports.findDefaultValue = exports.findAllColumnsByValues = exports.buildSelectedValue = exports.buildOptions = void 0;
+const getVisibleItemCount = n => {
+  if (n % 2 === 0) {
+    return n + 1;
+  }
+  return n;
+};
+
+/**
+ * 获取当前选项是什么数据
+ * @description cascade 联级选择，multiple 多列选择，single 单列选择
+ */
+exports.getVisibleItemCount = getVisibleItemCount;
+const getDataType = columns => {
+  const firstColumn = columns[0];
+  if (firstColumn) {
+    if ('children' in firstColumn) {
+      return 'cascade';
+    }
+    if ('options' in firstColumn || Array.isArray(firstColumn)) {
+      return 'multiple';
+    }
+  }
+  return 'single';
+};
+
+/**
+ * 构建选项
+ */
+exports.getDataType = getDataType;
+const buildOptions = (dataType, columns, values) => {
+  switch (dataType) {
+    case 'cascade':
+      {
+        if (!values?.length) {
+          const data = findNextAllColumns(columns);
+          return [data.options, [], data.values];
+        }
+        return [findAllColumnsByValues(columns, values), [], values];
+      }
+    case 'multiple':
+      {
+        const mixOptions = [];
+        const defaultValues = [];
+        columns.forEach(column => {
+          if (Array.isArray(column)) {
+            mixOptions.push(column);
+            defaultValues.push(column[0].value);
+          }
+        });
+        return [mixOptions, defaultValues, []];
+      }
+    default:
+      {
+        if (!columns || columns.length === 0) {
+          return [[], [], []];
+        }
+        const options = [columns];
+        const [firstColumn] = options[0];
+        const defaultValues = [firstColumn.value];
+        return [options, defaultValues, []];
+      }
+  }
+};
+
+/** 通过已有值找到联级选择的所有子级找到 */
+exports.buildOptions = buildOptions;
+const findAllColumnsByValues = (columns, values) => {
+  const options = [];
+  let currentColumn = columns;
+  values.forEach(value => {
+    options.push(currentColumn);
+    const nextIndex = currentColumn.findIndex(item => item.value === value);
+    currentColumn = currentColumn[nextIndex]?.children || [];
+  });
+  return options;
+};
+
+/** 把联级选择的所有子级找到 */
+exports.findAllColumnsByValues = findAllColumnsByValues;
+const findNextAllColumns = columns => {
+  const options = [];
+  const values = [];
+  const findNext = c => {
+    if (c.length) {
+      options.push(c);
+      values.push(c[0].value);
+      const cc = c[0].children || [];
+      findNext(cc);
+    }
+  };
+  findNext(columns);
+  return {
+    options,
+    values
+  };
+};
+
+// 构建选中的值
+exports.findNextAllColumns = findNextAllColumns;
+const buildSelectedValue = (values, options) => {
+  const selectedColumns = values.map((value, index) => {
+    const vIndex = options[index].findIndex(item => item.value === value);
+    return options[index][vIndex];
+  });
+  return [values, selectedColumns];
+};
+exports.buildSelectedValue = buildSelectedValue;
+const findDefaultValue = (value, options) => {
+  // value 是否在 options 内
+  const valueIndex = options.findIndex(item => item.value === value);
+  if (valueIndex < 0 || options[valueIndex].disabled) {
+    // 重新找一个
+    const index = options.findIndex(item => !item.disabled);
+    if (index < 0) {
+      return null;
+    }
+    return options[index].value;
+  }
+  return value;
+};
+
+/**
+ * 根据 value 和 columns 计算对应的 options
+ */
+exports.findDefaultValue = findDefaultValue;
+const findOptionsByValue = (value, columns) => {
+  if (!value?.length) return [];
+  const dataType = getDataType(columns);
+  switch (dataType) {
+    case 'cascade':
+      {
+        const options = [];
+        let currentOptions = columns;
+        for (const v of value) {
+          const option = currentOptions.find(item => item.value === v);
+          if (option) {
+            options.push(option);
+            currentOptions = option.children || [];
+          }
+        }
+        return options;
+      }
+    case 'multiple':
+      {
+        return value.map((v, index) => {
+          const columnOptions = columns[index];
+          return columnOptions?.find(item => item.value === v);
+        }).filter(Boolean);
+      }
+    default:
+      {
+        const options = columns;
+        const option = options.find(item => item.value === value[0]);
+        return option ? [option] : [];
+      }
+  }
+};
+
+/**
+ * 获取 columns 的默认值（每列的第一个选项）
+ */
+exports.findOptionsByValue = findOptionsByValue;
+const getDefaultValues = columns => {
+  const dataType = getDataType(columns);
+  switch (dataType) {
+    case 'cascade':
+      {
+        const data = findNextAllColumns(columns);
+        return data.values;
+      }
+    case 'multiple':
+      {
+        return columns.map(col => col[0]?.value).filter(Boolean);
+      }
+    default:
+      {
+        const firstOption = columns[0];
+        return firstOption ? [firstOption.value] : [];
+      }
+  }
+};
+exports.getDefaultValues = getDefaultValues;

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

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  Portal: true
+};
+exports.Portal = void 0;
+var _portal = require("./portal.js");
+Object.keys(_portal).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _portal[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _portal[key];
+    }
+  });
+});
+var _portalGuard = require("./portal-guard.js");
+var _portalHost = require("./portal-host.js");
+Object.keys(_portalHost).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _portalHost[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _portalHost[key];
+    }
+  });
+});
+var _portalContext = require("./portal-context.js");
+Object.keys(_portalContext).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _portalContext[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _portalContext[key];
+    }
+  });
+});
+const Portal = exports.Portal = Object.assign(_portal.Portal, {
+  Host: _portalHost.PortalHost,
+  add: _portalGuard.portal.add,
+  remove: _portalGuard.portal.remove
+});

package/dist/commonjs/components/base/portal/portal-consumer.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PortalConsumer = void 0;
+var _react = require("react");
+const PortalConsumer = ({
+  manager,
+  children
+}) => {
+  const keyRef = (0, _react.useRef)(null);
+
+  // 挂载 & 卸载
+  (0, _react.useEffect)(() => {
+    // 只在尚未挂载时挂载
+    if (manager && keyRef.current === null) {
+      keyRef.current = manager.mount(children);
+    }
+    return () => {
+      if (keyRef.current !== null) {
+        manager?.unmount(keyRef.current);
+        keyRef.current = null;
+      }
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [manager]);
+
+  // 更新 children
+  (0, _react.useEffect)(() => {
+    if (keyRef.current !== null) {
+      manager?.update(keyRef.current, children);
+    }
+  }, [children, manager]);
+  return null;
+};
+exports.PortalConsumer = PortalConsumer;

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

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useNamedHost = exports.unregisterHost = exports.registerHost = exports.getHost = exports.PortalContext = void 0;
+var _react = require("react");
+// 用于嵌套 PortalHost 的 context（传送到最近的 PortalHost）
+const PortalContext = exports.PortalContext = /*#__PURE__*/(0, _react.createContext)(null);
+
+// 命名 PortalHost 的注册表
+const namedHostsRegistry = new Map();
+// 订阅者列表
+const listeners = new Set();
+
+// 通知所有订阅者
+const notifyListeners = () => {
+  listeners.forEach(listener => listener());
+};
+
+// 注册命名的 PortalHost
+const registerHost = (name, methods) => {
+  namedHostsRegistry.set(name, methods);
+  notifyListeners();
+};
+
+// 注销命名的 PortalHost
+exports.registerHost = registerHost;
+const unregisterHost = name => {
+  namedHostsRegistry.delete(name);
+  notifyListeners();
+};
+
+// 获取命名的 PortalHost
+exports.unregisterHost = unregisterHost;
+const getHost = name => {
+  return namedHostsRegistry.get(name) ?? null;
+};
+
+// 订阅注册表变化
+exports.getHost = getHost;
+const subscribe = callback => {
+  listeners.add(callback);
+  return () => listeners.delete(callback);
+};
+
+// 使用 hook 获取命名的 PortalHost（响应式）
+const useNamedHost = name => {
+  return (0, _react.useSyncExternalStore)(subscribe, () => getHost(name));
+};
+exports.useNamedHost = useNamedHost;

package/dist/commonjs/components/base/portal/portal-guard.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.portal = void 0;
+var _reactNative = require("react-native");
+var _index = require("../../../shared/constants/index.js");
+class PortalGuard {
+  nextKey = 10000;
+  add = e => {
+    const key = this.nextKey++;
+    _reactNative.DeviceEventEmitter.emit(_index.NATIVE_UI_PORTAL_ADD_EVENT, e, key);
+    return key;
+  };
+  remove = key => _reactNative.DeviceEventEmitter.emit(_index.NATIVE_UI_PORTAL_REMOVE_EVENT, key);
+}
+const portal = exports.portal = new PortalGuard();

package/dist/commonjs/components/base/portal/portal-host.js

@@ -0,0 +1,119 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PortalHost = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _index = require("../../../shared/constants/index.js");
+var _portalContext = require("./portal-context.js");
+var _portalManager = require("./portal-manager.js");
+var _index2 = require("./style/index.js");
+var _jsxRuntime = require("react/jsx-runtime");
+const PortalHost = ({
+  children,
+  name
+}) => {
+  const portalHostStyles = (0, _index2.usePortalHostStyles)();
+  const managerRef = (0, _react.useRef)(null);
+  const nextKeyRef = (0, _react.useRef)(0);
+  const queueRef = (0, _react.useRef)([]);
+  const mount = (0, _react.useCallback)((children, _key) => {
+    const key = _key ?? nextKeyRef.current++;
+    if (managerRef.current) {
+      managerRef.current.mount(key, children);
+    } else {
+      queueRef.current.push({
+        type: 'mount',
+        key,
+        children
+      });
+    }
+    return key;
+  }, []);
+  const update = (0, _react.useCallback)((key, children) => {
+    if (managerRef.current) {
+      managerRef.current.update(key, children);
+    } else {
+      const op = {
+        type: 'update',
+        key,
+        children
+      };
+      const index = queueRef.current.findIndex(o => o.type === 'mount' || o.type === 'update' && o.key === key);
+      if (index > -1) {
+        queueRef.current[index] = op;
+      } else {
+        queueRef.current.push(op);
+      }
+    }
+  }, []);
+  const unmount = (0, _react.useCallback)(key => {
+    if (managerRef.current) {
+      managerRef.current.unmount(key);
+    } else {
+      queueRef.current.push({
+        type: 'unmount',
+        key
+      });
+    }
+  }, []);
+  const contextValue = (0, _react.useMemo)(() => ({
+    mount,
+    update,
+    unmount
+  }), [mount, update, unmount]);
+  (0, _react.useEffect)(() => {
+    const manager = managerRef.current;
+    const queue = queueRef.current;
+
+    // 处理队列中积压的操作
+    while (queue.length && manager) {
+      const action = queue.pop();
+      if (!action) continue;
+      switch (action.type) {
+        case 'mount':
+          manager.mount(action.key, action.children);
+          break;
+        case 'update':
+          manager.update(action.key, action.children);
+          break;
+        case 'unmount':
+          manager.unmount(action.key);
+          break;
+      }
+    }
+
+    // 只有默认 PortalHost（没有 name）才监听全局事件
+    // 这样 Portal.add() 只会在默认 host 中显示
+    let addListener = null;
+    let removeListener = null;
+
+    // 如果有 name，注册到全局注册表（用于 <Portal hostName="xxx"> 指定传送）
+    if (name) {
+      (0, _portalContext.registerHost)(name, contextValue);
+    } else {
+      addListener = _reactNative.DeviceEventEmitter.addListener(_index.NATIVE_UI_PORTAL_ADD_EVENT, mount);
+      removeListener = _reactNative.DeviceEventEmitter.addListener(_index.NATIVE_UI_PORTAL_REMOVE_EVENT, unmount);
+    }
+    return () => {
+      if (name) {
+        (0, _portalContext.unregisterHost)(name);
+      }
+      addListener?.remove();
+      removeListener?.remove();
+    };
+  }, [mount, unmount, name, contextValue]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_portalContext.PortalContext.Provider, {
+    value: contextValue,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: portalHostStyles.container,
+      collapsable: false,
+      children: children
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_portalManager.PortalManager, {
+      ref: managerRef
+    })]
+  });
+};
+exports.PortalHost = PortalHost;

package/dist/commonjs/components/base/portal/portal-manager.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PortalManager = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _jsxRuntime = require("react/jsx-runtime");
+const PortalManager = exports.PortalManager = /*#__PURE__*/(0, _react.memo)(({
+  ref
+}) => {
+  const [portals, setPortals] = (0, _react.useState)([]);
+  const mount = (0, _react.useCallback)((key, children) => {
+    setPortals(prev => [...prev, {
+      key,
+      children
+    }]);
+  }, []);
+  const update = (0, _react.useCallback)((key, children) => {
+    setPortals(prev => prev.map(item => item.key === key ? {
+      ...item,
+      children
+    } : item));
+  }, []);
+  const unmount = (0, _react.useCallback)(key => {
+    setPortals(prev => prev.filter(item => item.key !== key));
+  }, []);
+  (0, _react.useImperativeHandle)(ref, () => ({
+    mount,
+    update,
+    unmount
+  }), [mount, update, unmount]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: portals.map(({
+      key,
+      children
+    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      collapsable: false,
+      pointerEvents: "box-none" // 允许点击穿透到下层
+      ,
+      style: _reactNative.StyleSheet.absoluteFill // 绝对定位覆盖全屏
+      ,
+      children: children
+    }, key))
+  });
+});

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

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Portal = void 0;
+var _react = require("react");
+var _portalConsumer = require("./portal-consumer.js");
+var _portalContext = require("./portal-context.js");
+var _jsxRuntime = require("react/jsx-runtime");
+const Portal = ({
+  children,
+  hostName
+}) => {
+  // 如果指定了 hostName，从注册表获取（响应式）
+  const namedManager = (0, _portalContext.useNamedHost)(hostName ?? '');
+  // 否则使用最近的 PortalHost
+  const contextManager = (0, _react.use)(_portalContext.PortalContext);
+  const manager = hostName ? namedManager : contextManager;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_portalConsumer.PortalConsumer, {
+    manager: manager,
+    children: children
+  });
+};
+exports.Portal = Portal;

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

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePortalHostStyles = void 0;
+var _index = require("../../../../native-provider/index.js");
+const usePortalHostStyles = exports.usePortalHostStyles = (0, _index.createThemedStyles)(() => ({
+  container: {
+    flex: 1
+  }
+}));

package/dist/commonjs/components/base/portal/types.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DEFAULT_PORTAL_HOST = void 0;
+// 默认的 PortalHost 名称
+const DEFAULT_PORTAL_HOST = exports.DEFAULT_PORTAL_HOST = 'default';

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

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  Radio: true
+};
+exports.Radio = void 0;
+var _radio = require("./radio.js");
+Object.keys(_radio).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _radio[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _radio[key];
+    }
+  });
+});
+var _radioCard = require("./radio-card.js");
+Object.keys(_radioCard).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _radioCard[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _radioCard[key];
+    }
+  });
+});
+var _radioGroup = require("./radio-group.js");
+Object.keys(_radioGroup).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _radioGroup[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _radioGroup[key];
+    }
+  });
+});
+const Radio = exports.Radio = Object.assign(_radio.Radio, {
+  Group: _radioGroup.RadioGroup,
+  Card: _radioCard.RadioCard
+});

package/dist/commonjs/components/base/radio/radio-card.js

@@ -0,0 +1,68 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RadioCard = void 0;
+var _svgIcons = require("@seakoi/svg-icons");
+var _ahooks = require("ahooks");
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _index = require("../../../native-provider/index.js");
+var _radio = require("./radio.js");
+var _radioContext = require("./radio-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); }
+const RadioCard = ({
+  variant = 'normal',
+  ...props
+}) => {
+  const theme = (0, _index.useTheme)();
+  const styles = (0, _index2.useRadioCardStyles)();
+  const context = (0, _react.useContext)(_radioContext.RadioContext);
+  const [radioIconState, setRadioIconState] = (0, _react.useState)();
+  const isRibbonVariant = variant === 'ribbon';
+  const checkboxIconPlacement = props.radioIconPlacement ?? context.radioIconPlacement;
+  const isRibbonUncheckedDisabled = isRibbonVariant && radioIconState?.disabled && !radioIconState.checked;
+  const iconRender = (0, _ahooks.useMemoizedFn)(iconState => {
+    if (!iconState.checked) return null;
+    const borderColor = iconState.disabled ? theme.palette.brand4 : theme.palette.brand7;
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: [styles.ribbon, {
+          borderColor,
+          borderRightColor: 'transparent',
+          borderBottomColor: 'transparent'
+        }]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: styles.checkIcon,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_svgIcons.CheckOutlined, {
+          size: 20,
+          color: theme.palette.white
+        })
+      })]
+    });
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.Radio, {
+    ...props,
+    titleStyle: [isRibbonVariant && theme.fonts.medium.size16, isRibbonUncheckedDisabled && {
+      color: theme.palette.fontGray5
+    }, props.titleStyle],
+    descriptionStyle: [!isRibbonVariant && {
+      color: theme.palette.fontGray3
+    }, isRibbonUncheckedDisabled && {
+      color: theme.palette.fontGray5
+    }, props.descriptionStyle],
+    iconRender: isRibbonVariant ? iconRender : props.iconRender,
+    radioIconPlacement: isRibbonVariant ? 'left' : checkboxIconPlacement ?? 'right',
+    onRadioIconStateChange: iconState => {
+      setRadioIconState(iconState);
+      props.onRadioIconStateChange?.(iconState);
+    },
+    style: [styles.radio, radioIconState?.checked && {
+      borderColor: radioIconState.disabled ? theme.palette.brand4 : theme.palette.brand7
+    }, props.style]
+  });
+};
+exports.RadioCard = RadioCard;

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

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RadioContext = void 0;
+var _react = require("react");
+const RadioContext = exports.RadioContext = /*#__PURE__*/(0, _react.createContext)({});