@qsxy/element-plus-react 1.0.2 → 2.0.0

package/dist/Countdown/typings.d.ts

@@ -0,0 +1,52 @@
+import { Dayjs } from 'dayjs';
+import type { CSSProperties, ReactNode, RefObject } from 'react';
+import type { BaseProps, NativeProps } from '../types/common';
+/**
+ * @description Countdown 倒计时组件属性
+ */
+export interface CountdownProps extends BaseProps, NativeProps {
+    /**
+     * @description 格式化倒计时显示，支持 Y(年)/M(月)/D(天)/H(时)/m(分)/s(秒)/S(毫秒)
+     * @default 'HH:mm:ss'
+     */
+    format?: string;
+    /**
+     * @description 设置倒计时的前缀
+     */
+    prefix?: string | ReactNode;
+    /**
+     * @description 设置倒计时的后缀
+     */
+    suffix?: string | ReactNode;
+    /**
+     * @description 倒计时标题
+     */
+    title?: string | ReactNode;
+    /**
+     * @description 目标时间，支持时间戳（毫秒）或 dayjs 等时间对象
+     * @default 0
+     */
+    value?: number | Dayjs;
+    /**
+     * @description 倒计时数值的样式
+     */
+    valueStyle?: CSSProperties;
+    /**
+     * @description 倒计时数值变化时触发
+     * @param value - 剩余毫秒数
+     */
+    onChange?: (value: number) => void;
+    /**
+     * @description 倒计时结束时触发
+     */
+    onFinish?: () => void;
+}
+/**
+ * @description Countdown 组件暴露的 ref 接口
+ */
+export interface CountdownRef {
+    /** 倒计时容器 DOM 引用 */
+    ref: RefObject<HTMLDivElement>;
+    /** 当前格式化后的显示值 */
+    displayValue: string | ReactNode;
+}

package/dist/Countdown/typings.js

@@ -0,0 +1 @@
+export {};

package/dist/Countdown/util.d.ts

@@ -0,0 +1,14 @@
+import { Dayjs } from 'dayjs';
+/**
+ * @description 将时间值转换为时间戳（毫秒）
+ * @param value - 时间值，可以是数字时间戳或 Dayjs 对象
+ * @returns 时间戳（毫秒）
+ */
+export declare function getTime(value: number | Dayjs): number;
+/**
+ * @description 格式化倒计时时间戳为显示字符串
+ * @param timestamp - 剩余毫秒数
+ * @param format - 格式化模板，支持 Y(年)/M(月)/D(天)/H(时)/m(分)/s(秒)/S(毫秒)，用 [] 包裹的文本不会被替换
+ * @returns 格式化后的时间字符串
+ */
+export declare function formatTime(timestamp: number, format: string): string;

package/dist/Countdown/util.js

@@ -0,0 +1,58 @@
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { isNumber } from "../Util";
+
+/** 时间单位元组：[标识符, 毫秒值] */
+var timeUnits = [['Y', 1000 * 60 * 60 * 24 * 365],
+// years
+['M', 1000 * 60 * 60 * 24 * 30],
+// months
+['D', 1000 * 60 * 60 * 24],
+// days
+['H', 1000 * 60 * 60],
+// hours
+['m', 1000 * 60],
+// minutes
+['s', 1000],
+// seconds
+['S', 1] // million seconds
+];
+
+/**
+ * @description 将时间值转换为时间戳（毫秒）
+ * @param value - 时间值，可以是数字时间戳或 Dayjs 对象
+ * @returns 时间戳（毫秒）
+ */
+export function getTime(value) {
+  return isNumber(value) ? new Date(value).getTime() : value.valueOf();
+}
+
+/**
+ * @description 格式化倒计时时间戳为显示字符串
+ * @param timestamp - 剩余毫秒数
+ * @param format - 格式化模板，支持 Y(年)/M(月)/D(天)/H(时)/m(分)/s(秒)/S(毫秒)，用 [] 包裹的文本不会被替换
+ * @returns 格式化后的时间字符串
+ */
+export function formatTime(timestamp, format) {
+  var timeLeft = timestamp;
+  var escapeRegex = /\[([^\]]*)]/g;
+  var replacedText = timeUnits.reduce(function (current, _ref) {
+    var _ref2 = _slicedToArray(_ref, 2),
+      name = _ref2[0],
+      unit = _ref2[1];
+    var replaceRegex = new RegExp("".concat(name, "+(?![^\\[\\]]*\\])"), 'g');
+    if (replaceRegex.test(current)) {
+      var value = Math.floor(timeLeft / unit);
+      timeLeft -= value * unit;
+      return current.replace(replaceRegex, function (match) {
+        return String(value).padStart(match.length, '0');
+      });
+    }
+    return current;
+  }, format);
+  return replacedText.replace(escapeRegex, '$1');
+}

package/dist/DatePicker/DatePicker.js

@@ -1,5 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["name", "readonly", "clearable", "required", "valueFormat", "plain", "onClick", "prepend", "append", "error", "warning", "shortcuts", "onChange", "formatter", "type", "isoWeek"];
+var _excluded = ["name", "readonly", "clearable", "required", "valueFormat", "plain", "onClick", "prepend", "append", "shortcuts", "onChange", "formatter", "type", "isoWeek"];
 var _this = this;
 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 _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; }
@@ -50,8 +50,6 @@ var DatePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref
     onClick = _props.onClick,
     prepend = _props.prepend,
     append = _props.append,
-    error = _props.error,
-    warning = _props.warning,
     shortcuts = _props.shortcuts,
     onChange = _props.onChange,
     formatter = _props.formatter,
@@ -248,8 +246,6 @@ var DatePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref
     },
     className: classNames(_defineProperty(_defineProperty({}, "".concat(namespace, "-date"), readonly), 'is-focus', visible)),
     style: props.style,
-    error: error,
-    warning: warning,
     prepend: prepend,
     append: append,
     plain: plain,
@@ -264,9 +260,16 @@ var DatePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref
     onDestroy: function onDestroy() {
       return setVisible(false);
     },
+    popperClass: "is-pure",
     transitionAppear: true,
     unmountOnExit: true
-  }, animationInputProps, popperProps), /*#__PURE__*/React.createElement(CalendarContext.Provider, {
+  }, animationInputProps, {
+    onEnter: function onEnter() {
+      var _props$onEnter, _props2, _popperInstRef$curren;
+      (_props$onEnter = (_props2 = props).onEnter) === null || _props$onEnter === void 0 || _props$onEnter.call(_props2);
+      (_popperInstRef$curren = popperInstRef.current) === null || _popperInstRef$curren === void 0 || _popperInstRef$curren.update();
+    }
+  }, popperProps), /*#__PURE__*/React.createElement(CalendarContext.Provider, {
     value: {
       value: dateProp,
       valueRange: valueRange,

package/dist/DatePicker/DateRangePicker.js

@@ -48,8 +48,6 @@ var DateRangePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props
     prepend = _props.prepend,
     append = _props.append,
     onChange = _props.onChange,
-    error = _props.error,
-    warning = _props.warning,
     formatter = _props.formatter;
   var _useControlled = useControlled(props.value, props.defaultValue),
     _useControlled2 = _slicedToArray(_useControlled, 2),
@@ -232,9 +230,7 @@ var DateRangePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props
     return /*#__PURE__*/React.createElement("div", {
       className: classNames(b('date-editor', 'date-editor--daterange', false), b(_templateObject || (_templateObject = _taggedTemplateLiteral(["editor"]))), be('input', 'wrapper', false), be('tooltip', 'trigger', false), _defineProperty({}, bm('editor', size), size), is({
         focus: visible,
-        disabled: disabled,
-        error: error,
-        warning: warning
+        disabled: disabled
       })),
       ref: referenceElement,
       onClick: onActive,
@@ -275,7 +271,7 @@ var DateRangePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props
         event.stopPropagation();
       }
     }));
-  }, [b, be, bm, size, is, visible, disabled, error, warning, onActive, append, prepend, props.style, props.readOnly, props.rangeSeparator, onMouseEnter, onMouseLeave, e, name, startPlaceholder, formatValue, endPlaceholder, clearable, ebm, onClear]);
+  }, [b, be, bm, size, is, visible, disabled, onActive, append, prepend, props.style, props.readOnly, props.rangeSeparator, onMouseEnter, onMouseLeave, e, name, startPlaceholder, formatValue, endPlaceholder, clearable, ebm, onClear]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, append || prepend ? /*#__PURE__*/React.createElement(InputGroup, {
     prepend: prepend,
     append: append,
@@ -289,6 +285,11 @@ var DateRangePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props
     onDestroy: function onDestroy() {
       return setVisible(false);
     },
+    onEnter: function onEnter() {
+      var _props$onEnter, _props2, _popperInstRef$curren;
+      (_props$onEnter = (_props2 = props).onEnter) === null || _props$onEnter === void 0 || _props$onEnter.call(_props2);
+      (_popperInstRef$curren = popperInstRef.current) === null || _popperInstRef$curren === void 0 || _popperInstRef$curren.update();
+    },
     transitionAppear: true,
     unmountOnExit: true
   }, /*#__PURE__*/React.createElement(CalendarContext.Provider, {

package/dist/DatePicker/typings.d.ts

@@ -35,10 +35,6 @@ export interface DatePickerProps extends Omit<FormControlBaseProps, 'name' | 'va
     valueFormat?: string;
     /** 设置ISO周数，其中1为星期一，7为星期日 */
     isoWeek?: boolean;
-    /** 表单校验错误提示 */
-    error?: boolean;
-    /** 表单校验警告提示 */
-    warning?: boolean;
     /** 输入框前置内容，只对 type="text" 有效 */
     prepend?: React.ReactElement<any> | string | number;
     /** 输入框后置内容，只对 type="text" 有效 */
@@ -86,11 +82,6 @@ export interface DatePickerRangeProps extends Omit<FormControlBaseProps, 'name'
     unlinkPanels?: boolean;
     /** 设置ISO周数，其中1为星期一，7为星期日 */
     isoWeek?: boolean;
-    /** 表单校验错误提示 */
-    error?: boolean;
-    /** 表单校验警告提示 */
-    warning?: boolean;
-    /** 输入框前置内容，只对 type="text" 有效 */
     prepend?: React.ReactElement<any> | string | number;
     /** 输入框后置内容，只对 type="text" 有效 */
     append?: React.ReactElement | string | number;
@@ -135,10 +126,6 @@ export interface AllDatePickerProps extends Omit<FormControlBaseProps, 'name' |
     valueFormat?: string;
     /** 设置ISO周数，其中1为星期一，7为星期日 */
     isoWeek?: boolean;
-    /** 表单校验错误提示 */
-    error?: boolean;
-    /** 表单校验警告提示 */
-    warning?: boolean;
     /** 输入框前置内容，只对 type="text" 有效 */
     prepend?: React.ReactElement<any> | string | number;
     /** 输入框后置内容，只对 type="text" 有效 */

package/dist/DateTimePicker/DateTimePicker.js

@@ -1,6 +1,6 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _templateObject, _templateObject2, _templateObject3;
-var _excluded = ["name", "readonly", "clearable", "valueFormat", "format", "placeholder", "classPrefix", "onChange", "prepend", "shortcuts", "append", "warning", "error", "defaultTime", "formatter", "onClear", "onVisibleChange"];
+var _excluded = ["name", "readonly", "clearable", "valueFormat", "format", "placeholder", "classPrefix", "onChange", "prepend", "shortcuts", "append", "defaultTime", "formatter", "onClear", "onVisibleChange"];
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 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 _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; }
@@ -35,7 +35,7 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
     isoWeek: true,
     clearable: true,
     disabled: false,
-    placeholder: '请选择日期时间'
+    placeholder: ''
   }, props);
   var _props = props,
     name = _props.name,
@@ -50,8 +50,6 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
     prepend = _props.prepend,
     shortcuts = _props.shortcuts,
     append = _props.append,
-    warning = _props.warning,
-    error = _props.error,
     defaultTime = _props.defaultTime,
     formatter = _props.formatter,
     _onClear = _props.onClear,
@@ -124,6 +122,7 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
     _useState10 = _slicedToArray(_useState9, 2),
     time = _useState10[0],
     setTime = _useState10[1];
+  var timeRef = useRef('');
   var onActive = useCallback(function () {
     if (!disabled) {
       setVisible(true);
@@ -131,7 +130,7 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
     }
   }, [disabled, onVisibleChange]);
   var handleChange = useCallback(function (val) {
-    if (isEmpty(time) && !defaultTime) {
+    if (isEmpty(timeRef.current) && !defaultTime) {
       val = val.hour(0).minute(0).second(0);
     } else if (defaultTime) {
       var defTime = dayjs(defaultTime);
@@ -140,6 +139,7 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
     setValue(val ? val.format(format) : '');
     setDate(val ? val.format(extractDateFormat(format === 'x' ? 'YYYY-MM-DD' : format)) : '');
     setTime(val ? val.format(extractTimeFormat(format === 'x' ? 'HH:mm:ss' : format)) : '');
+    timeRef.current = val ? val.format(extractTimeFormat(format === 'x' ? 'HH:mm:ss' : format)) : '';
     if (valueFormat == 'x') {
       onChange(val ? val.toDate().getTime() : '');
     } else if (isNotEmpty(props.valueFormat)) {
@@ -147,10 +147,11 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
     } else {
       onChange === null || onChange === void 0 || onChange(val ? val.toDate() : '');
     }
-  }, [defaultTime, format, onChange, props.valueFormat, setValue, time, valueFormat]);
+  }, [defaultTime, format, onChange, props.valueFormat, setValue, valueFormat]);
   var setSelectionRange = useCallback(function (start, end) {
-    var _inputs = timePickerRef.current.input.current;
-    if (!_inputs.value) {
+    var _timePickerRef$curren;
+    var _inputs = (_timePickerRef$curren = timePickerRef.current) === null || _timePickerRef$curren === void 0 || (_timePickerRef$curren = _timePickerRef$curren.input) === null || _timePickerRef$curren === void 0 ? void 0 : _timePickerRef$curren.current;
+    if (!(_inputs !== null && _inputs !== void 0 && _inputs.value)) {
       return;
     }
     _inputs.setSelectionRange(start, end);
@@ -198,8 +199,6 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
       focus: visible
     })),
     style: props.style,
-    error: error,
-    warning: warning,
     prepend: prepend,
     append: append,
     plain: props.plain
@@ -214,11 +213,17 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
       setVisible(false);
       onVisibleChange === null || onVisibleChange === void 0 || onVisibleChange(false);
       setShowTime(false);
-    }
-  }, animationInputProps, {
+    },
     transitionAppear: true,
-    unmountOnExit: true
-  }, animationInputProps, popperProps), /*#__PURE__*/React.createElement(CalendarContext.Provider, {
+    unmountOnExit: true,
+    popperClass: "is-pure"
+  }, animationInputProps, {
+    onEnter: function onEnter() {
+      var _props$onEnter, _props2, _popperInstRef$curren;
+      (_props$onEnter = (_props2 = props).onEnter) === null || _props$onEnter === void 0 || _props$onEnter.call(_props2);
+      (_popperInstRef$curren = popperInstRef.current) === null || _popperInstRef$curren === void 0 || _popperInstRef$curren.update();
+    }
+  }, popperProps), /*#__PURE__*/React.createElement(CalendarContext.Provider, {
     value: {
       value: dateProp,
       dateType: 'date',
@@ -228,6 +233,10 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
       onChange: handleChange,
       disabledDate: props.disabledDate,
       close: function close() {
+        if (isEmpty(value)) {
+          timeRef.current = dayjs().format(extractTimeFormat(format === 'x' ? 'HH:mm:ss' : format));
+          handleChange(dayjs());
+        }
         setVisible(false);
         onVisibleChange === null || onVisibleChange === void 0 || onVisibleChange(false);
       },
@@ -251,7 +260,7 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
     placeholder: "\u9009\u62E9\u65F6\u95F4",
     value: time,
     clearable: false,
-    onFocus: function onFocus() {
+    onClick: function onClick() {
       return setShowTime(true);
     },
     ref: timePickerRef,
@@ -283,14 +292,15 @@ var DateTimePicker = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
     visible: enter,
     showSeconds: (valueFormat || format).includes('s') || (valueFormat || format) === 'x',
     referenceElement: function referenceElement() {
-      var _timePickerRef$curren;
-      return timePickerRef === null || timePickerRef === void 0 || (_timePickerRef$curren = timePickerRef.current) === null || _timePickerRef$curren === void 0 ? void 0 : _timePickerRef$curren.ref;
+      var _timePickerRef$curren2;
+      return timePickerRef === null || timePickerRef === void 0 || (_timePickerRef$curren2 = timePickerRef.current) === null || _timePickerRef$curren2 === void 0 ? void 0 : _timePickerRef$curren2.ref;
     },
     onDestroy: function onDestroy() {
       return setShowTime(false);
     },
-    ref: timePanelRef,
-    setSelectionRange: setSelectionRange,
+    ref: timePanelRef
+    // setSelectionRange={setSelectionRange}
+    ,
     onOk: function onOk() {
       setShowTime(false);
     }

package/dist/Dialog/Dialog.d.ts

@@ -1,15 +1,4 @@
-import React, { RefObject } from 'react';
-import DialogBody from './DialogBody';
-import DialogFooter from './DialogFooter';
+import React from 'react';
 import { DialogProps } from './typings';
-declare const Comp: (props: DialogProps & {
-    ref?: RefObject<HTMLDivElement> | React.ForwardedRef<HTMLDivElement>;
-}) => React.ReactElement;
-type InternalType = typeof Comp;
-interface CompInterface extends InternalType {
-    displayName?: string;
-    body: typeof DialogBody;
-    footer: typeof DialogFooter;
-}
-declare const Dialog: CompInterface;
+declare const Dialog: React.MemoExoticComponent<React.ForwardRefExoticComponent<DialogProps & React.RefAttributes<HTMLDivElement>>>;
 export default Dialog;