@pisell/materials 2.2.13 → 2.2.14

package/es/components/pisellCheckboxGroup/index.js

@@ -0,0 +1,173 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["platform", "gap", "style", "options", "onChange", "value", "renderOption", "padding", "rowKey", "mode", "iconPosition", "optionClassName", "optionActiveClassName"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+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; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { useEffect, useMemo } from 'react';
+import usePisellConfig from "../pisell-config-provider/hooks/usePisellConfig";
+import classNames from 'classnames';
+import { Checkbox, Radio } from 'antd';
+import { isNumber } from '@pisell/utils';
+import { changeArray } from '@pisell/utils';
+import "./index.less";
+import { useState } from 'react';
+import PisellRow from "../pisellRow";
+import { mockList } from "./mock";
+
+// 列表选项
+
+/**
+ * @title: PisellCheckboxGroup
+ * @description: 选中组件
+ * @param {PisellCheckboxGroupProps} props
+ * @return {*}
+ * @Author: zhiwei.Wang
+ * @Date: 2024-08-16 10:34
+ */
+var PisellCheckboxGroup = function PisellCheckboxGroup(props) {
+  var config = usePisellConfig();
+  var platform = props.platform,
+    _props$gap = props.gap,
+    gap = _props$gap === void 0 ? 10 : _props$gap,
+    style = props.style,
+    _props$options = props.options,
+    options = _props$options === void 0 ? mockList : _props$options,
+    onChange = props.onChange,
+    value = props.value,
+    _props$renderOption = props.renderOption,
+    renderOption = _props$renderOption === void 0 ? function (option) {
+      return option.label;
+    } : _props$renderOption,
+    _props$padding = props.padding,
+    padding = _props$padding === void 0 ? 0 : _props$padding,
+    _props$rowKey = props.rowKey,
+    rowKey = _props$rowKey === void 0 ? 'value' : _props$rowKey,
+    _props$mode = props.mode,
+    mode = _props$mode === void 0 ? 'multiple' : _props$mode,
+    _props$iconPosition = props.iconPosition,
+    iconPosition = _props$iconPosition === void 0 ? 'left' : _props$iconPosition,
+    optionClassName = props.optionClassName,
+    optionActiveClassName = props.optionActiveClassName,
+    rest = _objectWithoutProperties(props, _excluded);
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    _value = _useState2[0],
+    set_value = _useState2[1];
+
+  // 当value 发生变化时, 将外部value 处理成内部value
+  useEffect(function () {
+    initValue();
+  }, [value]);
+
+  /**
+   * @title: 转换value到内部
+   * @description:
+   * @return {*}
+   * @Author: zhiwei.Wang
+   * @Date: 2024-01-30 16:45
+   */
+  var initValue = function initValue() {
+    var _val = value;
+    // 没有value 格式化空数组
+    if (!value) {
+      _val = [];
+    } else {
+      // 不是数组的话, 转换成数组
+      if (!Array.isArray(value)) {
+        _val = [value];
+      }
+    }
+    set_value(_val);
+  };
+
+  // 样式
+  var _style = useMemo(function () {
+    // 间隔
+    var gapVal = isNumber(gap) ? gap + 'px' : gap;
+
+    // 内边距
+    var paddingVal = isNumber(padding) ? padding + 'px' : padding;
+    var obj = _objectSpread({
+      gap: gapVal,
+      padding: paddingVal
+    }, style);
+    return obj;
+  }, [style, gap, padding]);
+
+  /**
+   * @title: 统一外部onChange
+   * @description:
+   * @return {*}
+   * @Author: zhiwei.Wang
+   * @Date: 2024-08-16 10:35
+   */
+  var _onChange = function _onChange(val, item) {
+    // 单选模式, 只返回第一个值
+    onChange === null || onChange === void 0 ? void 0 : onChange(mode === 'single' ? val[0] : val, item);
+  };
+
+  /**
+   * @title: 选择
+   * @description:
+   * @param {any} item
+   * @return {*}
+   * @Author: zhiwei.Wang
+   * @Date: 2024-01-30 16:46
+   */
+  var handleSelectItem = function handleSelectItem(key, item) {
+    var newVal = [key];
+
+    // 多选进行合并
+    if (mode === 'multiple') {
+      newVal = changeArray(_value, key, 'this');
+    }
+
+    // 返回外部
+    _onChange(newVal, item);
+
+    // 设置内部值
+    set_value(newVal);
+  };
+
+  // 根据mode 切换不同的组件
+  var CheckBoxItem = mode === 'multiple' ? Checkbox : Radio;
+  return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
+    className: classNames('pisell-checkbox-group', rest.className),
+    style: _style
+  }), options.map(function (option) {
+    var active = _value.includes(option[rowKey]);
+    return /*#__PURE__*/React.createElement(PisellRow, {
+      className: classNames('pisell-checkbox-group-item', optionClassName, _defineProperty({
+        'pisell-checkbox-group-item-active': active
+      }, optionActiveClassName, active)),
+      key: option[rowKey],
+      gap: 10,
+      onClick: function onClick() {
+        if (option.disabled) return;
+        handleSelectItem(option[rowKey], option);
+      },
+      leftContent: iconPosition === 'left' && /*#__PURE__*/React.createElement(CheckBoxItem, {
+        checked: active,
+        className: "pisell-checkbox-group-item-checkbox"
+      }),
+      rightContent: iconPosition === 'right' && /*#__PURE__*/React.createElement(CheckBoxItem, {
+        checked: active,
+        className: "pisell-checkbox-group-item-checkbox"
+      }),
+      centerContent: renderOption === null || renderOption === void 0 ? void 0 : renderOption(option, active),
+      centerContentFill: true
+    });
+  }));
+};
+export default PisellCheckboxGroup;

package/es/components/pisellCheckboxGroup/index.less

@@ -0,0 +1,36 @@
+.pisell-checkbox-group {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+
+  .pisell-checkbox-group-item {
+    width: 100%;
+    cursor: pointer;
+    border-radius: 12px;
+    position: relative;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      border-radius: 12px;
+      border: 1px solid var(--Gray-200, #EAECF0);
+      z-index: 2;
+    }
+
+    &.pisell-checkbox-group-item-active {
+      &::before {
+        border-width: 2px;
+        border-color: var(--theme-color);
+      }
+
+    }
+  }
+}
+
+.pisell-checkbox-group-item-checkbox {
+  margin: 0;
+}

package/es/components/pisellCheckboxGroup/mock.d.ts

@@ -0,0 +1,4 @@
+export declare const mockList: {
+    label: string;
+    value: string;
+}[];

package/es/components/pisellCheckboxGroup/mock.js

@@ -0,0 +1,16 @@
+export var mockList = [{
+  label: "Option 1",
+  value: "1"
+}, {
+  label: "Option 2",
+  value: "2"
+}, {
+  label: "Option 3",
+  value: "3"
+}, {
+  label: "Option 4",
+  value: "4"
+}, {
+  label: "Option 5",
+  value: "5"
+}];

package/es/components/pisellContainer/components/Portal/index.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { PisellContextType } from "../../../pisell-config-provider/context";
+export interface PortalProps {
+    /** 平台 */
+    platform?: PisellContextType['platform'];
+    children?: React.ReactNode;
+    container: HTMLElement | null;
+}
+declare const Portal: React.FC<PortalProps>;
+export default Portal;

package/es/components/pisellContainer/components/Portal/index.js

@@ -0,0 +1,7 @@
+import ReactDOM from 'react-dom';
+var Portal = function Portal(props) {
+  var children = props.children,
+    container = props.container;
+  return /*#__PURE__*/ReactDOM.createPortal(children, container || document.body);
+};
+export default Portal;

package/es/components/pisellContainer/containers.d.ts

@@ -0,0 +1 @@
+export declare const containers: Record<string, any>;

package/es/components/pisellContainer/containers.js

@@ -0,0 +1,8 @@
+import PisellModal from "../pisellModal";
+import Drawer from "../drawer";
+import Portal from "./components/Portal";
+export var containers = {
+  modal: PisellModal,
+  drawer: Drawer,
+  portal: Portal
+};

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

@@ -0,0 +1,22 @@
+import React from 'react';
+import { DrawerProps } from 'antd';
+import { PisellModalProps } from '../pisellModal';
+import { PortalProps } from './components/Portal';
+import { PisellContextType } from "../pisell-config-provider/context";
+export declare type RenderType = 'modal' | 'drawer' | 'portal' | '';
+export interface PisellContainerProps<T> {
+    /** 平台 */
+    platform?: PisellContextType['platform'];
+    /** 渲染类型
+     * "modal" 弹窗
+     * "drawer" 抽屉
+     * "portal" 渲染到指定dom位置
+     * undefined | "" | null 渲染到当前位置
+     * */
+    renderType?: T;
+    /** 对应组件的props */
+    props?: T extends 'modal' ? PisellModalProps : T extends 'drawer' ? DrawerProps : T extends 'portal' ? PortalProps : any;
+    children?: React.ReactNode;
+}
+declare const PisellContainer: <T extends RenderType>(props: PisellContainerProps<T>) => any;
+export default PisellContainer;

package/es/components/pisellContainer/index.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { containers } from "./containers";
+var PisellContainer = function PisellContainer(props) {
+  var renderType = props.renderType,
+    children = props.children,
+    cptProps = props.props;
+
+  /** undefined | "" | null 渲染到当前位置 */
+  if (!renderType) {
+    return children;
+  }
+  var Container = containers[renderType];
+  if (!Container) {
+    console.error('Container not found for renderType:', renderType);
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(Container, cptProps, children);
+};
+export default PisellContainer;

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

@@ -0,0 +1,24 @@
+import React from 'react';
+import { Options } from 'ahooks/es/useCountDown';
+import { PisellContextType } from "../pisell-config-provider/context";
+export declare type PisellCountdownProps = React.HTMLAttributes<HTMLSpanElement> & {
+    /** 平台 */
+    platform?: PisellContextType['platform'];
+    /** 剩余时间（毫秒） */
+    leftTime?: number;
+    /**
+     * 目标时间（如果同时传了 leftTime 和 targetDate，则会忽略 targetDate，以 leftTime 为主）
+     * 2024-12-31 00:00:00
+     * */
+    targetDate?: Options['targetDate'];
+    /** 倒计时时间变化时触发 */
+    onChange?: (val: number) => void;
+    /** 倒计时完成时触发 */
+    onFinish?: () => void;
+    /** 变化时间间隔（毫秒） */
+    interval?: number;
+    /** 格式化倒计时展示 参考 dayjs */
+    format?: string;
+};
+declare const PisellCountdown: (props: PisellCountdownProps) => React.JSX.Element;
+export default PisellCountdown;

package/es/components/pisellCountdown/index.js

@@ -0,0 +1,44 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["leftTime", "targetDate", "interval", "onChange", "onFinish", "format"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+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; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React from 'react';
+import { useCountDown, useUpdateEffect } from 'ahooks';
+import { formatTimeStr } from "./utils";
+var PisellCountdown = function PisellCountdown(props) {
+  var leftTime = props.leftTime,
+    targetDate = props.targetDate,
+    interval = props.interval,
+    onChange = props.onChange,
+    onFinish = props.onFinish,
+    _props$format = props.format,
+    format = _props$format === void 0 ? 'HH:mm:ss' : _props$format,
+    others = _objectWithoutProperties(props, _excluded);
+  var _useCountDown = useCountDown(_objectSpread(_objectSpread({}, leftTime ? {
+      leftTime: leftTime
+    } : {}), {}, {
+      targetDate: targetDate,
+      interval: interval,
+      onEnd: function onEnd() {
+        onFinish === null || onFinish === void 0 ? void 0 : onFinish();
+      }
+    })),
+    _useCountDown2 = _slicedToArray(_useCountDown, 1),
+    countdown = _useCountDown2[0];
+  useUpdateEffect(function () {
+    onChange === null || onChange === void 0 ? void 0 : onChange(countdown);
+  }, [countdown]);
+  return /*#__PURE__*/React.createElement("span", others, formatTimeStr(countdown, format || 'HH:mm:ss'));
+};
+export default PisellCountdown;

package/es/components/pisellCountdown/utils.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 格式化时间字符串函数
+ * 该函数将给定的持续时间（以秒为单位）格式化为指定格式的时间字符串
+ * @param duration - 持续时间，单位为秒。
+ * @param format - 时间格式字符串，其中包含要显示的时间单位及其格式。例如："[HH] hours, [mm] minutes, [ss] seconds"。
+ */
+export declare function formatTimeStr(duration: number, format: string): string;

package/es/components/pisellCountdown/utils.js

@@ -0,0 +1,50 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+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; }
+var timeUnits = [['Y', 1000 * 60 * 60 * 24 * 365], ['M', 1000 * 60 * 60 * 24 * 30], ['D', 1000 * 60 * 60 * 24], ['H', 1000 * 60 * 60], ['m', 1000 * 60], ['s', 1000], ['S', 1]];
+
+/**
+ * 格式化时间字符串函数
+ * 该函数将给定的持续时间（以秒为单位）格式化为指定格式的时间字符串
+ * @param duration - 持续时间，单位为秒。
+ * @param format - 时间格式字符串，其中包含要显示的时间单位及其格式。例如："[HH] hours, [mm] minutes, [ss] seconds"。
+ */
+export function formatTimeStr(duration, format) {
+  // 剩余的持续时间，初始值为输入的持续时间
+  var leftDuration = duration;
+
+  // 匹配格式字符串中带方括号的部分，例如 "[HH]"、"[mm]"，以便后续处理
+  var escapeRegex = /\[[^\]]*]/g;
+  // 从格式字符串中提取带方括号的部分，并去掉方括号
+  var keepList = (format.match(escapeRegex) || []).map(function (str) {
+    return str.slice(1, -1);
+  });
+  // 用 "[]" 替换格式字符串中的带方括号的部分
+  var templateText = format.replace(escapeRegex, '[]');
+  var replacedText = timeUnits.reduce(function (current, _ref) {
+    var _ref2 = _slicedToArray(_ref, 2),
+      name = _ref2[0],
+      unit = _ref2[1];
+    if (current.includes(name)) {
+      // 计算当前时间单位的值
+      var value = Math.floor(leftDuration / unit);
+      // 更新剩余时间
+      leftDuration -= value * unit;
+      // 用数字填充替换格式字符串中的时间单位
+      return current.replace(new RegExp("".concat(name, "+"), 'g'), function (match) {
+        var len = match.length;
+        return value.toString().padStart(len, '0');
+      });
+    }
+    return current;
+  }, templateText);
+  var index = 0;
+  return replacedText.replace(escapeRegex, function () {
+    var match = keepList[index];
+    index += 1;
+    return match;
+  });
+}

package/es/components/pisellDatePicker/datePickerCpt.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { PickerDateProps } from 'antd/es/date-picker/generatePicker';
+import { Dayjs } from 'dayjs';
+import './detePickerCpt.less';
+import { PisellContextType } from "../pisell-config-provider/context";
+export interface DatePickerCptProps extends PickerDateProps<Dayjs> {
+    /** 平台 */
+    platform?: PisellContextType['platform'];
+    /** 当前类型
+     * input 仅输入
+     * select 仅选择
+     * both 输入和选择
+     * */
+    type: 'input' | 'select' | 'both';
+}
+/**
+ * 当前日期组件实例
+ * @param props
+ * @constructor
+ */
+declare const DatePickerCpt: (props: DatePickerCptProps) => React.JSX.Element;
+export default DatePickerCpt;

package/es/components/pisellDatePicker/datePickerCpt.js

@@ -0,0 +1,191 @@
+var _excluded = ["format", "value", "onChange", "onDateChange"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { useMemo } from 'react';
+import { DatePicker, Input } from 'antd';
+import "./detePickerCpt.less";
+/**
+ * 校验时间字符串是否符合格式
+ * @param dateString
+ * @param format
+ */
+var isValidDate = function isValidDate(dateString, format) {
+  var date = window.dayjs(dateString, format, true);
+  return date.isValid();
+};
+var DatePickerInput = function DatePickerInput(props) {
+  var format = props.format,
+    value = props.value,
+    onChange = props.onChange,
+    onDateChange = props.onDateChange,
+    others = _objectWithoutProperties(props, _excluded);
+
+  /**
+   * 数据输入变更事件
+   * @param val
+   */
+  var eventChange = function eventChange(val) {
+    onChange === null || onChange === void 0 ? void 0 : onChange({
+      target: {
+        value: val
+      }
+    });
+    if (isValidDate(val, format)) {
+      onDateChange === null || onDateChange === void 0 ? void 0 : onDateChange(window.dayjs(val, format), window.dayjs(val, format).format(format));
+    }
+  };
+  var handleChange = function handleChange(e) {
+    var inputValue = e.target.value;
+
+    // 禁止特殊字符时
+    if (!/^[\d/]*$/.test(inputValue)) {
+      return;
+    }
+
+    // 根据 format 字符串，将字母部分分离开来
+    var parts = format.split(/[^a-zA-Z]/);
+
+    // 提取 format 中的分隔符
+    var separators = format.match(/[^a-zA-Z]+/g) || [];
+
+    // 如果输入值长度小于之前的值，说明用户正在删除字符，直接触发 eventChange 事件
+    if (inputValue.length < value.length) {
+      eventChange === null || eventChange === void 0 ? void 0 : eventChange(inputValue);
+      return;
+    }
+
+    // 光标位置，用于跟踪当前输入的位置
+    var cursor = 0;
+    // 格式化后的结果
+    var result = '';
+    // 记录上一个分隔符后的索引位置
+    var lastIndex = 0;
+
+    // 遍历格式化字符串的部分
+    for (var i = 0; i < parts.length; i++) {
+      // 当前字母部分
+      var part = parts[i];
+      // 如果部分为空，则跳过
+      if (!part) continue;
+
+      // 当前部分的分隔符
+      var separator = separators[i] || '';
+      // 当前部分的期望长度
+      var expectedLength = part.length;
+
+      // 更新 lastIndex 到当前部分末尾（加上分隔符长度）
+      lastIndex = lastIndex + part.length + separator.length;
+
+      // 计算当前部分的起始和结束位置
+      var start = cursor;
+      if (i > 0) {
+        start += separators.slice(0, i).join('').length;
+      }
+      var end = start + expectedLength;
+      // 从用户输入中提取对应部分
+      var userPart = inputValue.slice(start, end);
+
+      // 如果当前部分有输入，添加前一个分隔符
+      if (userPart.length > 0) {
+        result += separators[i - 1] || '';
+      }
+
+      // 如果当前部分没有输入且格式化结果的最后一个字符不同于输入值的对应字符
+      if (userPart.length === 0 && result.slice(result.length - 1) !== inputValue.slice(result.length - 1)) {
+        userPart = inputValue.slice(result.length - 1);
+      }
+
+      // 如果当前部分包含 'Y'（表示年份等），直接添加用户输入
+      if (part.includes('Y')) {
+        result += userPart;
+      } else {
+        // 对日期时间部分的特殊处理（如月份、日期等）
+        if (userPart.length === 1 && ['M', 'D', 'H', 'm', 's'].includes(part[0])) {
+          if ('M' === part[0] && userPart > 1) {
+            // 月份第一位如果大于1，前面加 '0'
+            userPart = '0' + userPart;
+          }
+          if ('D' === part[0] && userPart > 3) {
+            // 日期第一位如果大于3，前面加 '0'
+            userPart = '0' + userPart;
+          }
+          if ('H' === part[0] && userPart > 2) {
+            // 小时第一位如果大于2，前面加 '0'
+            userPart = '0' + userPart;
+          }
+          if ('m' === part[0] && userPart > 7) {
+            // 分钟第一位如果大于7，前面加 '0'
+            userPart = '0' + userPart;
+          }
+          if ('s' === part[0] && userPart > 7) {
+            // 秒数第一位如果大于7，前面加 '0'
+            userPart = '0' + userPart;
+          }
+        }
+        result += userPart;
+      }
+
+      // 如果当前部分长度达到期望且下一个字符不是分隔符，则添加分隔符
+      if (userPart.length === expectedLength && !inputValue.slice(lastIndex - 1).startsWith(separator)) {
+        result += separator;
+      }
+      // 更新光标位置
+      cursor += userPart.length;
+    }
+    eventChange === null || eventChange === void 0 ? void 0 : eventChange(result);
+  };
+  return /*#__PURE__*/React.createElement(Input, _extends({}, others, {
+    type: "tel",
+    value: value,
+    onChange: handleChange
+  }));
+};
+
+/**
+ * 当前日期组件实例
+ * @param props
+ * @constructor
+ */
+var DatePickerCpt = function DatePickerCpt(props) {
+  var format = props.format,
+    type = props.type,
+    onChange = props.onChange,
+    size = props.size,
+    picker = props.picker;
+
+  /**
+   * 不同类型时注入参数
+   */
+  var propsObj = useMemo(function () {
+    if (picker && picker !== 'date') {
+      return {
+        inputRender: undefined
+      };
+    }
+    if (type === 'input') {
+      return {
+        popupClassName: 'pisell-date-picker-type-input',
+        suffixIcon: null,
+        placeholder: format || ""
+      };
+    } else if (type === 'select') {
+      return {
+        inputReadOnly: true
+      };
+    }
+    return {};
+  }, [type, picker, format]);
+  return /*#__PURE__*/React.createElement(DatePicker, _extends({}, props, {
+    className: 'pisell-date-picker'
+    // size={size ?? 'large'}
+    ,
+    inputRender: function inputRender(props) {
+      return /*#__PURE__*/React.createElement(DatePickerInput, _extends({}, props, {
+        onDateChange: onChange,
+        format: format
+      }));
+    }
+  }, propsObj));
+};
+export default DatePickerCpt;