feffery_antd_components 0.3.15 → 0.4.0-rc5

package/src/lib/components/dataDisplay/AntdCarousel.react.js

@@ -6,10 +6,52 @@ const LazyAntdCarousel = React.lazy(() => import(/* webpackChunkName: "data_disp
 /**
  * 走马灯组件AntdCarousel
  */
-const AntdCarousel = (props) => {
+const AntdCarousel = ({
+    id,
+    children,
+    className,
+    style,
+    key,
+    arrows = false,
+    autoplay = false,
+    dotPosition = 'bottom',
+    easing = 'linear',
+    effect = 'scrollx',
+    autoplaySpeed = 3000,
+    speed = 500,
+    pauseOnHover = false,
+    infinite = true,
+    lazyLoad = false,
+    slidesToShow = 1,
+    slidesToScroll = 1,
+    setProps,
+    ...others
+}) => {
     return (
         <Suspense fallback={null}>
-            <LazyAntdCarousel {...props} />
+            <LazyAntdCarousel {
+                ...{
+                    id,
+                    children,
+                    className,
+                    style,
+                    key,
+                    arrows,
+                    autoplay,
+                    dotPosition,
+                    easing,
+                    effect,
+                    autoplaySpeed,
+                    speed,
+                    pauseOnHover,
+                    infinite,
+                    lazyLoad,
+                    slidesToShow,
+                    slidesToScroll,
+                    setProps,
+                    ...others
+                }
+            } />
         </Suspense>
     );
 }
@@ -50,10 +92,18 @@ AntdCarousel.propTypes = {
     arrows: PropTypes.bool,
 
     /**
-     * 是否自动轮播
+     * 是否自动轮播，可传入字典型进行更多配置
      * 默认值：`false`
      */
-    autoplay: PropTypes.bool,
+    autoplay: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.shape({
+            /**
+             * 是否展示指示点进度条
+             */
+            dotDuration: PropTypes.bool
+        })
+    ]),
 
     /**
      * 面板指示器位置，可选项有`'top'`、`'bottom'`、`'left'`、`'right'`
@@ -125,21 +175,6 @@ AntdCarousel.propTypes = {
      */
     'aria-*': PropTypes.string,
 
-    loading_state: PropTypes.shape({
-        /**
-         * Determines if the component is loading or not
-         */
-        is_loading: PropTypes.bool,
-        /**
-         * Holds which property is loading
-         */
-        prop_name: PropTypes.string,
-        /**
-         * Holds the name of the component that is loading
-         */
-        component_name: PropTypes.string
-    }),
-
     /**
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.
@@ -147,22 +182,6 @@ AntdCarousel.propTypes = {
     setProps: PropTypes.func
 };
 
-// 设置默认参数
-AntdCarousel.defaultProps = {
-    arrows: false,
-    autoplay: false,
-    dotPosition: 'bottom',
-    easing: 'linear',
-    effect: 'scrollx',
-    autoplaySpeed: 3000,
-    speed: 500,
-    pauseOnHover: false,
-    infinite: true,
-    lazyLoad: false,
-    slidesToShow: 1,
-    slidesToScroll: 1
-}
-
 export default AntdCarousel;
 
 export const propTypes = AntdCarousel.propTypes;

package/src/lib/components/dataDisplay/AntdCheckableTag.react.js

@@ -6,10 +6,34 @@ const LazyAntdCheckableTag = React.lazy(() => import(/* webpackChunkName: "data_
 /**
  * 可选择标签AntdCheckableTag
  */
-const AntdCheckableTag = (props) => {
+const AntdCheckableTag = ({
+    id,
+    className,
+    style,
+    key,
+    content,
+    checkedContent,
+    unCheckedContent,
+    checked = false,
+    setProps,
+    ...others
+}) => {
     return (
         <Suspense fallback={null}>
-            <LazyAntdCheckableTag {...props} />
+            <LazyAntdCheckableTag {
+                ...{
+                    id,
+                    className,
+                    style,
+                    key,
+                    content,
+                    checkedContent,
+                    unCheckedContent,
+                    checked,
+                    setProps,
+                    ...others
+                }
+            } />
         </Suspense>
     );
 }
@@ -69,21 +93,6 @@ AntdCheckableTag.propTypes = {
      */
     'aria-*': PropTypes.string,
 
-    loading_state: PropTypes.shape({
-        /**
-         * Determines if the component is loading or not
-         */
-        is_loading: PropTypes.bool,
-        /**
-         * Holds which property is loading
-         */
-        prop_name: PropTypes.string,
-        /**
-         * Holds the name of the component that is loading
-         */
-        component_name: PropTypes.string
-    }),
-
     /**
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.
@@ -91,11 +100,6 @@ AntdCheckableTag.propTypes = {
     setProps: PropTypes.func
 };
 
-// 设置默认参数
-AntdCheckableTag.defaultProps = {
-    checked: false
-}
-
 export default AntdCheckableTag;
 
 export const propTypes = AntdCheckableTag.propTypes;

package/src/lib/components/dataDisplay/AntdCollapse.react.js

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 // antd核心
 import { Collapse } from 'antd';
 // 辅助库
-import { parseChildrenToArray } from '../utils';
+import { parseChildrenToArray, useLoading } from '../utils';
 import { isString, isUndefined } from 'lodash';
 import { pickBy } from 'ramda';
 // 自定义hooks
@@ -15,29 +15,28 @@ import PropsContext from '../../contexts/PropsContext';
 /**
  * 折叠面板组件AntdCollapse
  */
-const AntdCollapse = (props) => {
-    let {
-        id,
-        children,
-        className,
-        style,
-        key,
-        styles,
-        classNames,
-        title,
-        isOpen,
-        bordered,
-        size,
-        showArrow,
-        collapsible,
-        ghost,
-        forceRender,
-        setProps,
-        persistence,
-        persisted_props,
-        persistence_type,
-        loading_state
-    } = props;
+const AntdCollapse = ({
+    id,
+    children,
+    className,
+    style,
+    key,
+    styles,
+    classNames,
+    title,
+    isOpen = true,
+    bordered = true,
+    size = 'middle',
+    showArrow = true,
+    collapsible,
+    ghost = false,
+    forceRender = false,
+    setProps,
+    persistence,
+    persisted_props,
+    persistence_type,
+    ...others
+}) => {
 
     children = parseChildrenToArray(children)
 
@@ -46,7 +45,7 @@ const AntdCollapse = (props) => {
     return (
         <Collapse
             // 提取具有data-*或aria-*通配格式的属性
-            {...pickBy((_, k) => k.startsWith('data-') || k.startsWith('aria-'), props)}
+            {...pickBy((_, k) => k.startsWith('data-') || k.startsWith('aria-'), others)}
             id={id}
             className={
                 isString(className) ?
@@ -91,9 +90,7 @@ const AntdCollapse = (props) => {
             persistence={persistence}
             persisted_props={persisted_props}
             persistence_type={persistence_type}
-            data-dash-is-loading={
-                (loading_state && loading_state.is_loading) || undefined
-            } />
+            data-dash-is-loading={useLoading()} />
     );
 }
 
@@ -210,21 +207,6 @@ AntdCollapse.propTypes = {
      */
     'aria-*': PropTypes.string,
 
-    loading_state: PropTypes.shape({
-        /**
-         * Determines if the component is loading or not
-         */
-        is_loading: PropTypes.bool,
-        /**
-         * Holds which property is loading
-         */
-        prop_name: PropTypes.string,
-        /**
-         * Holds the name of the component that is loading
-         */
-        component_name: PropTypes.string
-    }),
-
     /**
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.
@@ -253,14 +235,7 @@ AntdCollapse.propTypes = {
     persistence_type: PropTypes.oneOf(['local', 'session', 'memory'])
 };
 
-// 设置默认参数
-AntdCollapse.defaultProps = {
-    isOpen: true,
-    bordered: true,
-    size: 'middle',
-    showArrow: true,
-    ghost: false,
-    forceRender: false,
+AntdCollapse.dashPersistence = {
     persisted_props: ['isOpen'],
     persistence_type: 'local'
 }

package/src/lib/components/dataDisplay/AntdComment.react.js

@@ -6,10 +6,64 @@ const LazyAntdComment = React.lazy(() => import(/* webpackChunkName: "data_displ
 /**
  * 评论组件AntdComment
  */
-const AntdComment = (props) => {
+const AntdComment = ({
+    id,
+    children,
+    className,
+    style,
+    locale = 'zh-cn',
+    commentId,
+    showLikeDislike = true,
+    showReply = true,
+    showDelete = false,
+    replyClicks = 0,
+    deleteClicks = 0,
+    authorName,
+    authorNameHref,
+    publishTime,
+    fromNow = false,
+    commentContent,
+    likesCount = 0,
+    dislikesCount = 0,
+    action,
+    defaultAction,
+    avatarProps,
+    popupContainer = 'body',
+    setProps,
+    batchPropsNames = [],
+    ...others
+}) => {
     return (
         <Suspense fallback={null}>
-            <LazyAntdComment {...props} />
+            <LazyAntdComment {
+                ...{
+                    id,
+                    children,
+                    className,
+                    style,
+                    locale,
+                    commentId,
+                    showLikeDislike,
+                    showReply,
+                    showDelete,
+                    replyClicks,
+                    deleteClicks,
+                    authorName,
+                    authorNameHref,
+                    publishTime,
+                    fromNow,
+                    commentContent,
+                    likesCount,
+                    dislikesCount,
+                    action,
+                    defaultAction,
+                    avatarProps,
+                    popupContainer,
+                    setProps,
+                    batchPropsNames,
+                    ...others
+                }
+            } />
         </Suspense>
     );
 }
@@ -44,10 +98,10 @@ AntdComment.propTypes = {
     ]),
 
     /**
-     * 组件文案语种，可选项有`'zh-cn'`（简体中文）、`'en-us'`（英语）、`'de-de'`（德语）
+     * 组件文案语种，可选项有`'zh-cn'`（简体中文）、`'en-us'`（英语）、`'de-de'`（德语）、`'ru-ru'`（俄语）
      * 默认值：`'zh-cn'`
      */
-    locale: PropTypes.oneOf(['zh-cn', 'en-us', 'de-de']),
+    locale: PropTypes.oneOf(['zh-cn', 'en-us', 'de-de', 'ru-ru']),
 
     /**
      * 评论唯一id，可用于数据库匹配等场景
@@ -192,20 +246,6 @@ AntdComment.propTypes = {
     setProps: PropTypes.func
 };
 
-AntdComment.defaultProps = {
-    showLikeDislike: true,
-    showReply: true,
-    showDelete: false,
-    likesCount: 0,
-    dislikesCount: 0,
-    deleteClicks: 0,
-    fromNow: false,
-    replyClicks: 0,
-    locale: 'zh-cn',
-    popupContainer: 'body',
-    batchPropsNames: []
-}
-
 export default AntdComment;
 
 export const propTypes = AntdComment.propTypes;

package/src/lib/components/dataDisplay/AntdCountdown.react.js

@@ -6,10 +6,42 @@ const LazyAntdCountdown = React.lazy(() => import(/* webpackChunkName: "data_dis
 /**
  * 倒计时组件AntdCountdown
  */
-const AntdCountdown = (props) => {
+const AntdCountdown = ({
+    id,
+    className,
+    style,
+    key,
+    value,
+    valueFormat = 'YYYY-MM-DD hh:mm:ss',
+    format,
+    prefix,
+    suffix,
+    title,
+    titleTooltip,
+    valueStyle,
+    setProps,
+    ...others
+}) => {
     return (
         <Suspense fallback={null}>
-            <LazyAntdCountdown {...props} />
+            <LazyAntdCountdown {
+                ...{
+                    id,
+                    className,
+                    style,
+                    key,
+                    value,
+                    valueFormat,
+                    format,
+                    prefix,
+                    suffix,
+                    title,
+                    titleTooltip,
+                    valueStyle,
+                    setProps,
+                    ...others
+                }
+            } />
         </Suspense>
     );
 }
@@ -79,6 +111,16 @@ AntdCountdown.propTypes = {
      */
     valueStyle: PropTypes.object,
 
+    /**
+     * 监听倒计时结束事件
+     */
+    finishEvent: PropTypes.shape({
+        /**
+         * 事件时间戳
+         */
+        timestamp: PropTypes.number,
+    }),
+
     /**
      * `data-*`格式属性通配
      */
@@ -89,21 +131,6 @@ AntdCountdown.propTypes = {
      */
     'aria-*': PropTypes.string,
 
-    loading_state: PropTypes.shape({
-        /**
-         * Determines if the component is loading or not
-         */
-        is_loading: PropTypes.bool,
-        /**
-         * Holds which property is loading
-         */
-        prop_name: PropTypes.string,
-        /**
-         * Holds the name of the component that is loading
-         */
-        component_name: PropTypes.string
-    }),
-
     /**
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.
@@ -111,11 +138,6 @@ AntdCountdown.propTypes = {
     setProps: PropTypes.func
 };
 
-// 设置默认参数
-AntdCountdown.defaultProps = {
-    valueFormat: 'YYYY-MM-DD hh:mm:ss'
-}
-
 export default AntdCountdown;
 
 export const propTypes = AntdCountdown.propTypes;

package/src/lib/components/dataDisplay/AntdEmpty.react.js

@@ -6,10 +6,38 @@ const LazyAntdEmpty = React.lazy(() => import(/* webpackChunkName: "data_display
 /**
  * 空状态组件AntdEmpty
  */
-const AntdEmpty = (props) => {
+const AntdEmpty = ({
+    id,
+    children,
+    className,
+    style,
+    styles,
+    classNames,
+    key,
+    locale = 'zh-cn',
+    description,
+    image = 'default',
+    setProps,
+    ...others
+}) => {
     return (
         <Suspense fallback={null}>
-            <LazyAntdEmpty {...props} />
+            <LazyAntdEmpty {
+                ...{
+                    id,
+                    children,
+                    className,
+                    style,
+                    styles,
+                    classNames,
+                    key,
+                    locale,
+                    description,
+                    image,
+                    setProps,
+                    ...others
+                }
+            } />
         </Suspense>
     );
 }
@@ -35,6 +63,50 @@ AntdEmpty.propTypes = {
      */
     style: PropTypes.object,
 
+    /**
+     * 细分控制子元素css样式
+     */
+    styles: PropTypes.exact({
+        /**
+         * 根元素css样式
+         */
+        root: PropTypes.object,
+        /**
+         * 图标元素css样式
+         */
+        image: PropTypes.object,
+        /**
+         * 描述元素css样式
+         */
+        description: PropTypes.object,
+        /**
+         * 底部元素css样式
+         */
+        footer: PropTypes.object
+    }),
+
+    /**
+     * 细分控制子元素css类名
+     */
+    classNames: PropTypes.exact({
+        /**
+         * 根元素css类名
+         */
+        root: PropTypes.string,
+        /**
+         * 图标元素css类名
+         */
+        image: PropTypes.string,
+        /**
+         * 描述元素css类名
+         */
+        description: PropTypes.string,
+        /**
+         * 底部元素css类名
+         */
+        footer: PropTypes.string
+    }),
+
     /**
      * 当前组件css类名，支持[动态css](/advanced-classname)
      */
@@ -44,10 +116,10 @@ AntdEmpty.propTypes = {
     ]),
 
     /**
-     * 组件文案语种，可选项有`'zh-cn'`（简体中文）、`'en-us'`（英语）、`'de-de'`（德语）
+     * 组件文案语种，可选项有`'zh-cn'`（简体中文）、`'en-us'`（英语）、`'de-de'`（德语）、`'ru-ru'`（俄语）
      * 默认值：`'zh-cn'`
      */
-    locale: PropTypes.oneOf(['zh-cn', 'en-us', 'de-de']),
+    locale: PropTypes.oneOf(['zh-cn', 'en-us', 'de-de', 'ru-ru']),
 
     /**
      * 描述信息内容
@@ -68,11 +140,6 @@ AntdEmpty.propTypes = {
         ])
     ]),
 
-    /**
-     * 状态图片css样式
-     */
-    imageStyle: PropTypes.object,
-
     /**
      * `data-*`格式属性通配
      */
@@ -83,21 +150,6 @@ AntdEmpty.propTypes = {
      */
     'aria-*': PropTypes.string,
 
-    loading_state: PropTypes.shape({
-        /**
-         * Determines if the component is loading or not
-         */
-        is_loading: PropTypes.bool,
-        /**
-         * Holds which property is loading
-         */
-        prop_name: PropTypes.string,
-        /**
-         * Holds the name of the component that is loading
-         */
-        component_name: PropTypes.string
-    }),
-
     /**
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.
@@ -105,12 +157,6 @@ AntdEmpty.propTypes = {
     setProps: PropTypes.func
 };
 
-// 设置默认参数
-AntdEmpty.defaultProps = {
-    locale: 'zh-cn',
-    image: 'default'
-}
-
 export default AntdEmpty;
 
 export const propTypes = AntdEmpty.propTypes;