@rainbow-oh/yee-c 0.8.2 → 0.8.3

package/dist/esm/Table/theader/cell.js

@@ -10,6 +10,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 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 clsx from 'clsx';
 import React, { useContext } from 'react';
+import { useLocale } from "../../locale";
 import Tooltip from "../../Tooltip";
 import ArrowIcon from "../icon/arrow-icon";
 import Filter from "./filter";
@@ -42,6 +43,9 @@ var HeadCell = function HeadCell(props) {
     rest = _objectWithoutProperties(props, _excluded);
   var _useContext = useContext(TableCtx),
     prefixCls = _useContext.prefixCls;
+  var _useLocale = useLocale(),
+    locale = _useLocale.locale;
+  var tableLocale = locale.table;
   var showFilter = !!filter;
 
   // Get current sort order for this column (0 = none, 1 = ascend, -1 = descend)
@@ -80,11 +84,11 @@ var HeadCell = function HeadCell(props) {
       if (showSorterTooltip && sorter) {
         var _title = '';
         if (displaySortOrder === 0) {
-          _title = 'Click to sort ascending';
+          _title = tableLocale.sortAscending || 'Click to sort ascending';
         } else if (displaySortOrder === 1) {
-          _title = 'Click to sort descending';
+          _title = tableLocale.sortDescending || 'Click to sort descending';
         } else if (displaySortOrder === 2) {
-          _title = 'Click to cancel sorting';
+          _title = tableLocale.sortCancel || 'Click to cancel sorting';
         }
         return /*#__PURE__*/React.createElement(Tooltip, {
           title: _title

package/dist/esm/TextArea/style/index.less

@@ -66,6 +66,7 @@
   padding: 4px 8px;
   font-size: var(--yee-textarea-font-size);
   line-height: var(--yee-textarea-line-height);
+  background-color: var(--yee-input-content-bg-color);
   border-radius: var(--yee-textarea-border-radius, 4px);
   font-family: var(--yee-font-family);
   width: 100%;

package/dist/esm/VerificationCode/style/index.less

@@ -9,6 +9,7 @@
     width: var(--yee-verification-code-item-width);
     height: var(--yee-verification-code-item-height);
     text-align: center;
+    background-color: var(--yee-input-content-bg-color);
     border: var(--yee-verification-code-item-border-width) solid
       var(--yee-input-border-color);
     border-radius: var(--yee-verification-code-item-border-radius);

package/dist/esm/hooks/useCountdown.d.ts

@@ -2,8 +2,9 @@ export type CountdownOptions = {
     duration: number;
     interval?: number;
     onComplete?: () => void;
+    resetKey?: string | number;
 };
-export default function useCountdown({ duration, interval, onComplete, }: CountdownOptions): {
+export default function useCountdown({ duration, interval, onComplete, resetKey, }: CountdownOptions): {
     remaining: number;
     isPaused: boolean;
     onPause: () => void;

package/dist/esm/hooks/useCountdown.js

@@ -9,8 +9,10 @@ export default function useCountdown(_ref) {
   var duration = _ref.duration,
     _ref$interval = _ref.interval,
     interval = _ref$interval === void 0 ? 100 : _ref$interval,
-    onComplete = _ref.onComplete;
-  var _useState = useState(duration),
+    onComplete = _ref.onComplete,
+    resetKey = _ref.resetKey;
+  var initialRemaining = Math.max(0, duration);
+  var _useState = useState(initialRemaining),
     _useState2 = _slicedToArray(_useState, 2),
     remaining = _useState2[0],
     setRemaining = _useState2[1];
@@ -19,16 +21,32 @@ export default function useCountdown(_ref) {
     isPaused = _useState4[0],
     setIsPaused = _useState4[1];
   var timerRef = useRef(null);
-  var remainingRef = useRef(duration);
+  var remainingRef = useRef(initialRemaining);
+  var isPausedRef = useRef(false);
   var onCompleteRef = useRef(onComplete);
+  var identityRef = useRef({
+    duration: duration,
+    resetKey: resetKey
+  });
+  var epochRef = useRef(0);
   onCompleteRef.current = onComplete;
+  if (identityRef.current.duration !== duration || identityRef.current.resetKey !== resetKey) {
+    identityRef.current = {
+      duration: duration,
+      resetKey: resetKey
+    };
+    epochRef.current += 1;
+  }
   var clear = useCallback(function () {
     if (timerRef.current !== null) {
       clearTimeout(timerRef.current);
       timerRef.current = null;
     }
   }, []);
-  var tick = useCallback(function () {
+  var tick = useCallback(function (epoch) {
+    if (epoch !== epochRef.current) {
+      return;
+    }
     var next = Math.max(0, remainingRef.current - interval);
     remainingRef.current = next;
     setRemaining(next);
@@ -36,29 +54,41 @@ export default function useCountdown(_ref) {
       var _onCompleteRef$curren;
       (_onCompleteRef$curren = onCompleteRef.current) === null || _onCompleteRef$curren === void 0 || _onCompleteRef$curren.call(onCompleteRef);
     } else {
-      timerRef.current = setTimeout(tick, interval);
+      timerRef.current = setTimeout(function () {
+        return tick(epoch);
+      }, interval);
     }
   }, [interval]);
   var start = useCallback(function () {
     clear();
-    timerRef.current = setTimeout(tick, interval);
+    if (remainingRef.current > 0 && !isPausedRef.current) {
+      var epoch = epochRef.current;
+      timerRef.current = setTimeout(function () {
+        return tick(epoch);
+      }, interval);
+    }
   }, [clear, interval, tick]);
   useEffect(function () {
-    remainingRef.current = duration;
-    setRemaining(duration);
-    setIsPaused(false);
-    start();
+    clear();
+    var nextRemaining = Math.max(0, duration);
+    remainingRef.current = nextRemaining;
+    setRemaining(nextRemaining);
+    if (nextRemaining > 0 && !isPausedRef.current) {
+      start();
+    }
     return clear;
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [duration]);
+  }, [clear, duration, resetKey, start]);
   var onPause = useCallback(function () {
+    isPausedRef.current = true;
     clear();
     setIsPaused(true);
   }, [clear]);
   var onResume = useCallback(function () {
-    if (remainingRef.current <= 0) return;
+    isPausedRef.current = false;
     setIsPaused(false);
-    start();
+    if (remainingRef.current > 0) {
+      start();
+    }
   }, [start]);
   return {
     remaining: remaining,

package/dist/esm/locale/interface.d.ts

@@ -52,6 +52,9 @@ export interface LocaleTable {
     selectionAll?: string;
     selectionInvert?: string;
     selectionNone?: string;
+    sortAscending?: string;
+    sortDescending?: string;
+    sortCancel?: string;
 }
 export interface LocalePagination {
     total?: string;

package/dist/esm/locale/lang/en_US.js

@@ -53,7 +53,10 @@ var locale = {
     selectNone: 'Clear Selection',
     selectionAll: 'Select All on Page',
     selectionInvert: 'Invert Selection on Page',
-    selectionNone: 'Clear Selection on Page'
+    selectionNone: 'Clear Selection on Page',
+    sortAscending: 'Click to sort ascending',
+    sortDescending: 'Click to sort descending',
+    sortCancel: 'Click to cancel sorting'
   },
   pagination: {
     total: 'Total {total} items',

package/dist/esm/locale/lang/ja_JP.js

@@ -53,7 +53,10 @@ var locale = {
     selectNone: '選択をクリア',
     selectionAll: 'ページ内すべて選択',
     selectionInvert: 'ページ内選択を反転',
-    selectionNone: 'ページ内選択をクリア'
+    selectionNone: 'ページ内選択をクリア',
+    sortAscending: 'クリックで昇順に並べ替え',
+    sortDescending: 'クリックで降順に並べ替え',
+    sortCancel: 'クリックで並べ替えを解除'
   },
   pagination: {
     total: '合計 {total} 件',

package/dist/esm/locale/lang/zh_CN.js

@@ -53,7 +53,10 @@ var locale = {
     selectNone: '清空选择',
     selectionAll: '全选当页',
     selectionInvert: '反选当页',
-    selectionNone: '清空当页选择'
+    selectionNone: '清空当页选择',
+    sortAscending: '点击升序排列',
+    sortDescending: '点击降序排列',
+    sortCancel: '点击取消排序'
   },
   pagination: {
     total: '共 {total} 条',

package/dist/esm/locale/lang/zh_TW.js

@@ -53,7 +53,10 @@ var locale = {
     selectNone: '清空選擇',
     selectionAll: '全選當頁',
     selectionInvert: '反選當頁',
-    selectionNone: '清空當頁選擇'
+    selectionNone: '清空當頁選擇',
+    sortAscending: '點擊升序排列',
+    sortDescending: '點擊降序排列',
+    sortCancel: '點擊取消排序'
   },
   pagination: {
     total: '共 {total} 條',

package/dist/esm/message/demo/base.js

@@ -7,7 +7,10 @@ var BaseDemo = function BaseDemo() {
   var showMessage = function showMessage(type) {
     switch (type) {
       case 'info':
-        messageApi.open('This is an info message');
+        messageApi.open({
+          content: 'This is an info message',
+          duration: 0
+        });
         break;
       case 'success':
         message.success('This is a success message');

package/dist/esm/message/index.d.ts

@@ -1,4 +1,4 @@
 import { message } from './wrapper';
-export type { MessageConfig } from './interface';
+export type { MessageApi, MessageClose, MessageConfig } from './interface';
 export * from './message-provider';
 export default message;

package/dist/esm/message/interface.d.ts

@@ -1,9 +1,6 @@
 /// <reference types="react" />
 export type MessageConfig = {
-    /**
-     * test identifier
-     */
-    'data-testid'?: string;
+    [dataAttribute: `data-${string}`]: string | number | boolean | undefined;
     /**
      * Custom prefix class name
      */
@@ -21,8 +18,8 @@ export type MessageConfig = {
      */
     content: React.ReactNode;
     /**
-     * Auto close time (ms), 0 means no auto close
-     * @default 3000
+     * Auto close time (seconds), 0 means no auto close
+     * @default 3
      */
     duration?: number;
     /**
@@ -42,15 +39,27 @@ export type MessageConfig = {
      */
     onClose?: () => void;
 };
+export type MessageClose = () => void;
+export interface MessageApi {
+    open: (config: string | MessageConfig) => MessageClose;
+    info: (config: string | MessageConfig) => MessageClose;
+    success: (config: string | MessageConfig) => MessageClose;
+    warning: (config: string | MessageConfig) => MessageClose;
+    error: (config: string | MessageConfig) => MessageClose;
+    loading: (config: string | MessageConfig) => MessageClose;
+    destroy: (key: string | number) => void;
+    clear: () => void;
+}
 export type WrapperedMessageConfig = MessageConfig & {
     status?: 'info' | 'success' | 'warning' | 'error' | 'loading';
 };
 export type MessageType = WrapperedMessageConfig & {
     key: string | number;
+    timerGeneration: number;
 };
 export interface MessageProps extends MessageType {
     /**
      * Destroy component callback
      */
-    onDestroy?: (key: string | number) => void;
+    onDestroy?: (key: string | number, timerGeneration?: number) => void;
 }

package/dist/esm/message/message-provider.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
+import type { MessageApi } from './interface';
 export declare function MessageProvider({ children }: {
     children: React.ReactNode;
 }): React.JSX.Element;
-export declare function useGlobalMessage(): any;
+export declare function useGlobalMessage(): MessageApi;

package/dist/esm/message/message-provider.js

@@ -1,6 +1,6 @@
 import React, { createContext, useContext } from 'react';
 import useMessage from "./use-message";
-var MessageContext = /*#__PURE__*/createContext({});
+var MessageContext = /*#__PURE__*/createContext(undefined);
 export function MessageProvider(_ref) {
   var children = _ref.children;
   var _useMessage = useMessage(),

package/dist/esm/message/message.js

@@ -1,4 +1,4 @@
-var _excluded = ["prefixCls", "id", "status", "content", "style", "className", "icon", "duration", "onClick", "onClose", "onDestroy", "data-testid"];
+var _excluded = ["prefixCls", "id", "timerGeneration", "status", "content", "style", "className", "icon", "duration", "onClick", "onClose", "onDestroy", "data-testid"];
 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; }
@@ -8,19 +8,27 @@ import React, { useEffect } from 'react';
 import Spin from "../Spin";
 var icons = {
   info: /*#__PURE__*/React.createElement(Info, {
-    size: 16,
+    size: 22,
+    fill: "currentColor",
+    stroke: "#FFF",
     strokeWidth: 2
   }),
   success: /*#__PURE__*/React.createElement(CircleCheck, {
-    size: 16,
+    size: 22,
+    fill: "currentColor",
+    stroke: "#FFF",
     strokeWidth: 2
   }),
   warning: /*#__PURE__*/React.createElement(CircleAlert, {
-    size: 16,
+    size: 22,
+    fill: "currentColor",
+    stroke: "#FFF",
     strokeWidth: 2
   }),
   error: /*#__PURE__*/React.createElement(CircleX, {
-    size: 16,
+    size: 22,
+    fill: "currentColor",
+    stroke: "#FFF",
     strokeWidth: 2
   }),
   loading: /*#__PURE__*/React.createElement(Spin, {
@@ -34,6 +42,7 @@ var Message = function Message(props) {
   var _props$prefixCls = props.prefixCls,
     prefixCls = _props$prefixCls === void 0 ? 'yee-message' : _props$prefixCls,
     key = props.id,
+    timerGeneration = props.timerGeneration,
     status = props.status,
     content = props.content,
     style = props.style,
@@ -49,28 +58,32 @@ var Message = function Message(props) {
   useEffect(function () {
     if (duration && duration > 0) {
       var timer = setTimeout(function () {
-        onDestroy === null || onDestroy === void 0 || onDestroy(key);
-        onClose === null || onClose === void 0 || onClose();
+        onDestroy === null || onDestroy === void 0 || onDestroy(key, timerGeneration);
       }, duration * 1000);
       return function () {
         clearTimeout(timer);
       };
     }
-  }, [duration, key, onDestroy, onClose]);
+  }, [duration, key, onDestroy, onClose, timerGeneration]);
   var renderIcon = function renderIcon() {
     if (!icon && !status) {
       return null;
     }
     return /*#__PURE__*/React.createElement("span", {
+      "aria-hidden": "true",
       className: "".concat(prefixCls, "-icon")
     }, icon ? icon : status ? icons[status] : null);
   };
+  var isAssertive = status === 'error' || status === 'warning';
   return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
+    "aria-atomic": "true",
+    "aria-live": isAssertive ? 'assertive' : 'polite',
+    role: isAssertive ? 'alert' : 'status',
     "data-testid": dataTestId,
     className: clsx(prefixCls, ["".concat(prefixCls, "-").concat(status)], className),
     style: style,
     onClick: onClick
-  }), renderIcon(), /*#__PURE__*/React.createElement("p", {
+  }), renderIcon(), /*#__PURE__*/React.createElement("div", {
     className: "".concat(prefixCls, "-content")
   }, content));
 };

package/dist/esm/message/style/index.less

@@ -6,6 +6,7 @@
   align-items: center;
   width: fit-content;
   padding: var(--yee-message-padding);
+  pointer-events: auto;
   background-color: var(--yee-message-bg-color);
   border-radius: var(--yee-message-border-radius);
   box-shadow: var(--yee-message-box-shadow);
@@ -30,12 +31,13 @@
     align-items: center;
     justify-content: center;
     width: 100vw;
+    pointer-events: none;
   }
 
   // status
   &-success {
     @{pls}-icon {
-      color: var(--yee-primary-color);
+      color: var(--yee-success-color);
     }
   }
 

package/dist/esm/message/use-message.d.ts

@@ -1,16 +1,7 @@
 import React from 'react';
-import { MessageConfig } from './interface';
+import { MessageApi } from './interface';
 declare const useMessage: () => {
-    messageApi: {
-        open: (props: string | MessageConfig) => () => void;
-        info: (props: string | MessageConfig) => () => void;
-        success: (props: string | MessageConfig) => () => void;
-        error: (props: string | MessageConfig) => () => void;
-        warning: (props: string | MessageConfig) => () => void;
-        loading: (props: string | MessageConfig) => () => void;
-        destroy: (key: string | number) => void;
-        clear: () => void;
-    };
-    messageHolder: React.ReactPortal;
+    messageApi: MessageApi;
+    messageHolder: React.ReactPortal | null;
 };
 export default useMessage;