feffery_antd_components 0.4.4 → 0.4.5

package/src/lib/components/feedback/AntdProgress.react.js

@@ -36,16 +36,20 @@ const AntdProgress = ({
     setProps,
     ...others
 }) => {
-
     return (
         <Progress
             // 提取具有data-*或aria-*通配格式的属性
-            {...pickBy((_, k) => k.startsWith('data-') || k.startsWith('aria-'), others)}
+            {...pickBy(
+                (_, k) => k.startsWith('data-') || k.startsWith('aria-'),
+                others
+            )}
             id={id}
             className={
-                isString(className) ?
-                    className :
-                    (className ? useCss(className) : undefined)
+                isString(className)
+                    ? className
+                    : className
+                      ? useCss(className)
+                      : undefined
             }
             style={style}
             key={key}
@@ -53,23 +57,28 @@ const AntdProgress = ({
             size={size}
             percent={percent}
             success={success}
-            format={format ? p => (format && format.content) ?
-                format.content : (
-                    ((format && format.prefix) ? format.prefix : '') +
-                    `${p}` +
-                    ((format && format.suffix) ? format.suffix : '%')
-                ) : undefined}
+            format={
+                format
+                    ? (p) =>
+                          format && format.content
+                              ? format.content
+                              : (format && format.prefix ? format.prefix : '') +
+                                `${p}` +
+                                (format && format.suffix ? format.suffix : '%')
+                    : undefined
+            }
             status={status}
             showInfo={showInfo}
             percentPosition={percentPosition}
-            strokeColor={strokeColor ?
-                (
-                    strokeColor.from && strokeColor.to ?
-                        {
-                            '0%': strokeColor.from,
-                            '100%': strokeColor.to
-                        } : strokeColor
-                ) : undefined
+            strokeColor={
+                strokeColor
+                    ? strokeColor.from && strokeColor.to
+                        ? {
+                              '0%': strokeColor.from,
+                              '100%': strokeColor.to,
+                          }
+                        : strokeColor
+                    : undefined
             }
             strokeLinecap={strokeLinecap}
             strokeWidth={strokeWidth}
@@ -80,7 +89,7 @@ const AntdProgress = ({
             data-dash-is-loading={useLoading()}
         ></Progress>
     );
-}
+};
 
 AntdProgress.propTypes = {
     /**
@@ -101,10 +110,7 @@ AntdProgress.propTypes = {
     /**
      * 当前组件css类名，支持[动态css](/advanced-classname)
      */
-    className: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.object
-    ]),
+    className: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
 
     /**
      * 进度条类型，可选项有`'line'`、`'circle'`、`'dashboard'`
@@ -119,10 +125,7 @@ AntdProgress.propTypes = {
     size: PropTypes.oneOfType([
         PropTypes.number,
         PropTypes.arrayOf(
-            PropTypes.oneOfType([
-                PropTypes.number,
-                PropTypes.string
-            ])
+            PropTypes.oneOfType([PropTypes.number, PropTypes.string])
         ),
         PropTypes.oneOf(['small', 'default']),
         PropTypes.shape({
@@ -133,8 +136,8 @@ AntdProgress.propTypes = {
             /**
              * 像素高度
              */
-            height: PropTypes.number
-        })
+            height: PropTypes.number,
+        }),
     ]),
 
     /**
@@ -166,9 +169,9 @@ AntdProgress.propTypes = {
                 /**
                  * 渐变色末端颜色
                  */
-                to: PropTypes.string
-            })
-        ])
+                to: PropTypes.string,
+            }),
+        ]),
     }),
 
     /**
@@ -188,7 +191,7 @@ AntdProgress.propTypes = {
         /**
          * 组件型，强制设置显示内容
          */
-        content: PropTypes.node
+        content: PropTypes.node,
     }),
 
     /**
@@ -214,7 +217,7 @@ AntdProgress.propTypes = {
         /**
          * 内外位置，可选项有`'inner'`、`'outer'`
          */
-        type: PropTypes.oneOf(['inner', 'outer'])
+        type: PropTypes.oneOf(['inner', 'outer']),
     }),
 
     /**
@@ -231,9 +234,9 @@ AntdProgress.propTypes = {
             /**
              * 渐变色末端颜色
              */
-            to: PropTypes.string
+            to: PropTypes.string,
         }),
-        PropTypes.objectOf(PropTypes.string)
+        PropTypes.objectOf(PropTypes.string),
     ]),
 
     /**
@@ -277,8 +280,8 @@ AntdProgress.propTypes = {
             /**
              * 分段间隔像素大小
              */
-            gap: PropTypes.number
-        })
+            gap: PropTypes.number,
+        }),
     ]),
 
     /**
@@ -295,7 +298,7 @@ AntdProgress.propTypes = {
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.
      */
-    setProps: PropTypes.func
+    setProps: PropTypes.func,
 };
 
-export default AntdProgress;
+export default AntdProgress;

package/src/lib/components/feedback/AntdResult.react.js

@@ -27,34 +27,37 @@ const AntdResult = ({
     setProps,
     ...others
 }) => {
-
     return (
         <Result
             // 提取具有data-*或aria-*通配格式的属性
-            {...pickBy((_, k) => k.startsWith('data-') || k.startsWith('aria-'), others)}
+            {...pickBy(
+                (_, k) => k.startsWith('data-') || k.startsWith('aria-'),
+                others
+            )}
             id={id}
             className={
-                isString(className) ?
-                    className :
-                    (className ? useCss(className) : undefined)
+                isString(className)
+                    ? className
+                    : className
+                      ? useCss(className)
+                      : undefined
             }
             style={style}
             key={key}
             icon={
                 icon ||
-                (
-                    status === 'loading' ?
-                        <LoadingOutlined style={{ color: '#1890ff' }} /> :
-                        undefined)
+                (status === 'loading' ? (
+                    <LoadingOutlined style={{ color: '#1890ff' }} />
+                ) : undefined)
             }
             extra={extra}
             status={status}
             title={title}
             subTitle={subTitle}
-            data-dash-is-loading={useLoading()}>
-        </Result>
+            data-dash-is-loading={useLoading()}
+        ></Result>
     );
-}
+};
 
 AntdResult.propTypes = {
     /**
@@ -75,10 +78,7 @@ AntdResult.propTypes = {
     /**
      * 当前组件css类名，支持[动态css](/advanced-classname)
      */
-    className: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.object
-    ]),
+    className: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
 
     /**
      * 组件型，操作区域
@@ -89,7 +89,16 @@ AntdResult.propTypes = {
      * 状态，可选项有`'success'`、`'error'`、`'info'`、`'warning'`、`'404'`、`'403'`、`'500'`
      * 默认值：`'info'`
      */
-    status: PropTypes.oneOf(['success', 'error', 'info', 'warning', '404', '403', '500', 'loading']),
+    status: PropTypes.oneOf([
+        'success',
+        'error',
+        'info',
+        'warning',
+        '404',
+        '403',
+        '500',
+        'loading',
+    ]),
 
     /**
      * 组件型，标题内容
@@ -120,7 +129,7 @@ AntdResult.propTypes = {
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.
      */
-    setProps: PropTypes.func
+    setProps: PropTypes.func,
 };
 
-export default AntdResult;
+export default AntdResult;

package/src/lib/components/feedback/AntdSpin.react.js

@@ -8,7 +8,7 @@ import { isString, isNumber } from 'lodash';
 import { pickBy, equals } from 'ramda';
 import { useLoading, loadingSelector } from '../utils';
 // 自定义hooks
-import useCss from '../../hooks/useCss'
+import useCss from '../../hooks/useCss';
 
 /**
  * 加载动画组件AntdSpin
@@ -35,18 +35,24 @@ const AntdSpin = ({
     setProps,
     ...others
 }) => {
-
     const ctx = window.dash_component_api.useDashContext();
     // 获取内部加载中组件信息
-    const loading_info = ctx.useSelector(loadingSelector(ctx.componentPath), equals);
+    const loading_info = ctx.useSelector(
+        loadingSelector(ctx.componentPath),
+        equals
+    );
 
     useEffect(() => {
         // 检查数值型percent参数是否取值在合法的0到100之间
         if (isNumber(percent) && (percent < 0 || percent > 100)) {
             // 抛出中英文错误提示
-            setProps({ _dash_error: new Error('数值型percent取值应在0到100之间！\nThe value of the numerical type "percent" should be between 0 and 100!') });
+            setProps({
+                _dash_error: new Error(
+                    '数值型percent取值应在0到100之间！\nThe value of the numerical type "percent" should be between 0 and 100!'
+                ),
+            });
         }
-    }, [percent])
+    }, [percent]);
 
     const [showSpinning, setShowSpinning] = useState(spinning);
     const timer = useRef();
@@ -61,29 +67,48 @@ const AntdSpin = ({
                 // 当listenPropsMode为'default'时
                 if (listenPropsMode === 'default') {
                     if (debug) {
-                        loading_info.forEach(item => console.log(item.id + '.' + item.property))
+                        loading_info.forEach((item) =>
+                            console.log(item.id + '.' + item.property)
+                        );
                     }
                     setShowSpinning(true);
                 } else if (listenPropsMode === 'exclude') {
                     // 当listenPropsMode为'exclude'模式时
                     // 当前触发加载状态的组件+属性组合均不在排除列表中时，激活动画
-                    if (loading_info.every(item => excludeProps.indexOf(item.id + '.' + item.property) === -1)) {
+                    if (
+                        loading_info.every(
+                            (item) =>
+                                excludeProps.indexOf(
+                                    item.id + '.' + item.property
+                                ) === -1
+                        )
+                    ) {
                         if (debug) {
-                            loading_info.forEach(item => console.log(item.id + '.' + item.property))
+                            loading_info.forEach((item) =>
+                                console.log(item.id + '.' + item.property)
+                            );
                         }
                         setShowSpinning(true);
                     }
                 } else if (listenPropsMode === 'include') {
                     // 当listenPropsMode为'include'模式时
                     // 当前触发加载状态的组件+属性组合至少有一个在包含列表中时，激活动画
-                    if (loading_info.some(item => includeProps.indexOf(item.id + '.' + item.property) !== -1)) {
+                    if (
+                        loading_info.some(
+                            (item) =>
+                                includeProps.indexOf(
+                                    item.id + '.' + item.property
+                                ) !== -1
+                        )
+                    ) {
                         if (debug) {
-                            loading_info.forEach(item => console.log(item.id + '.' + item.property))
+                            loading_info.forEach((item) =>
+                                console.log(item.id + '.' + item.property)
+                            );
                         }
                         setShowSpinning(true);
                     }
                 }
-
             } else if (loading_info.length === 0 && showSpinning) {
                 timer.current = setTimeout(() => setShowSpinning(false));
             }
@@ -96,18 +121,26 @@ const AntdSpin = ({
             <>
                 <Spin
                     // 提取具有data-*或aria-*通配格式的属性
-                    {...pickBy((_, k) => k.startsWith('data-') || k.startsWith('aria-'), others)}
+                    {...pickBy(
+                        (_, k) =>
+                            k.startsWith('data-') || k.startsWith('aria-'),
+                        others
+                    )}
                     id={id}
                     className={
-                        isString(className) ?
-                            className :
-                            (className ? useCss(className) : undefined)
+                        isString(className)
+                            ? className
+                            : className
+                              ? useCss(className)
+                              : undefined
                     }
                     key={key}
                     wrapperClassName={
-                        isString(wrapperClassName) ?
-                            wrapperClassName :
-                            (wrapperClassName ? useCss(wrapperClassName) : undefined)
+                        isString(wrapperClassName)
+                            ? wrapperClassName
+                            : wrapperClassName
+                              ? useCss(wrapperClassName)
+                              : undefined
                     }
                     style={style}
                     spinning={manual ? spinning : showSpinning}
@@ -117,7 +150,8 @@ const AntdSpin = ({
                     tip={text}
                     indicator={indicator}
                     percent={percent}
-                    data-dash-is-loading={useLoading()} />
+                    data-dash-is-loading={useLoading()}
+                />
                 {children}
             </>
         );
@@ -126,18 +160,25 @@ const AntdSpin = ({
     return (
         <Spin
             // 提取具有data-*或aria-*通配格式的属性
-            {...pickBy((_, k) => k.startsWith('data-') || k.startsWith('aria-'), others)}
+            {...pickBy(
+                (_, k) => k.startsWith('data-') || k.startsWith('aria-'),
+                others
+            )}
             id={id}
             className={
-                isString(className) ?
-                    className :
-                    (className ? useCss(className) : undefined)
+                isString(className)
+                    ? className
+                    : className
+                      ? useCss(className)
+                      : undefined
             }
             key={key}
             wrapperClassName={
-                isString(wrapperClassName) ?
-                    wrapperClassName :
-                    (wrapperClassName ? useCss(wrapperClassName) : undefined)
+                isString(wrapperClassName)
+                    ? wrapperClassName
+                    : wrapperClassName
+                      ? useCss(wrapperClassName)
+                      : undefined
             }
             style={style}
             spinning={manual ? spinning : showSpinning}
@@ -147,9 +188,13 @@ const AntdSpin = ({
             tip={text}
             indicator={indicator}
             percent={percent}
-            data-dash-is-loading={useLoading()} > {children} </Spin>
+            data-dash-is-loading={useLoading()}
+        >
+            {' '}
+            {children}{' '}
+        </Spin>
     );
-}
+};
 
 AntdSpin.propTypes = {
     /**
@@ -175,18 +220,12 @@ AntdSpin.propTypes = {
     /**
      * 当前组件css类名，支持[动态css](/advanced-classname)
      */
-    className: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.object
-    ]),
+    className: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
 
     /**
      * 外层容器css类名
      */
-    wrapperClassName: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.object
-    ]),
+    wrapperClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
 
     /**
      * 是否处于加载中状态
@@ -268,7 +307,7 @@ AntdSpin.propTypes = {
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.
      */
-    setProps: PropTypes.func
+    setProps: PropTypes.func,
 };
 
-export default AntdSpin;
+export default AntdSpin;

package/src/lib/components/feedback/skeleton/AntdCustomSkeleton.react.js

@@ -28,10 +28,12 @@ const AntdCustomSkeleton = ({
     setProps,
     ...others
 }) => {
-
     const ctx = window.dash_component_api.useDashContext();
     // 获取内部加载中组件信息
-    const loading_info = ctx.useSelector(loadingSelector(ctx.componentPath), equals);
+    const loading_info = ctx.useSelector(
+        loadingSelector(ctx.componentPath),
+        equals
+    );
 
     const [showLoading, setShowLoading] = useState(loading);
     const timer = useRef();
@@ -49,7 +51,9 @@ const AntdCustomSkeleton = ({
                 // 当listenPropsMode为'default'时
                 if (listenPropsMode === 'default') {
                     if (debug) {
-                        loading_info.forEach(item => console.log(item.id + '.' + item.property))
+                        loading_info.forEach((item) =>
+                            console.log(item.id + '.' + item.property)
+                        );
                     }
                     delayTimer.current = setTimeout(
                         () => setShowLoading(true),
@@ -58,9 +62,18 @@ const AntdCustomSkeleton = ({
                 } else if (listenPropsMode === 'exclude') {
                     // 当listenPropsMode为'exclude'模式时
                     // 当前触发加载状态的组件+属性组合均不在排除列表中时，激活动画
-                    if (loading_info.every(item => excludeProps.indexOf(item.id + '.' + item.property) === -1)) {
+                    if (
+                        loading_info.every(
+                            (item) =>
+                                excludeProps.indexOf(
+                                    item.id + '.' + item.property
+                                ) === -1
+                        )
+                    ) {
                         if (debug) {
-                            loading_info.forEach(item => console.log(item.id + '.' + item.property))
+                            loading_info.forEach((item) =>
+                                console.log(item.id + '.' + item.property)
+                            );
                         }
                         delayTimer.current = setTimeout(
                             () => setShowLoading(true),
@@ -70,9 +83,18 @@ const AntdCustomSkeleton = ({
                 } else if (listenPropsMode === 'include') {
                     // 当listenPropsMode为'include'模式时
                     // 当前触发加载状态的组件+属性组合至少有一个在包含列表中时，激活动画
-                    if (loading_info.some(item => includeProps.indexOf(item.id + '.' + item.property) !== -1)) {
+                    if (
+                        loading_info.some(
+                            (item) =>
+                                includeProps.indexOf(
+                                    item.id + '.' + item.property
+                                ) !== -1
+                        )
+                    ) {
                         if (debug) {
-                            loading_info.forEach(item => console.log(item.id + '.' + item.property))
+                            loading_info.forEach((item) =>
+                                console.log(item.id + '.' + item.property)
+                            );
                         }
                         delayTimer.current = setTimeout(
                             () => setShowLoading(true),
@@ -80,7 +102,6 @@ const AntdCustomSkeleton = ({
                         );
                     }
                 }
-
             } else if (loading_info.length === 0 && showLoading) {
                 timer.current = setTimeout(() => setShowLoading(false));
             }
@@ -90,20 +111,26 @@ const AntdCustomSkeleton = ({
     return (
         <div
             // 提取具有data-*或aria-*通配格式的属性
-            {...pickBy((_, k) => k.startsWith('data-') || k.startsWith('aria-'), others)}
+            {...pickBy(
+                (_, k) => k.startsWith('data-') || k.startsWith('aria-'),
+                others
+            )}
             id={id}
             className={
-                isString(className) ?
-                    className :
-                    (className ? useCss(className) : undefined)
+                isString(className)
+                    ? className
+                    : className
+                      ? useCss(className)
+                      : undefined
             }
             style={style}
             key={key}
             data-dash-is-loading={useLoading()}
-        >{(manual ? loading : showLoading) ? skeletonContent : children}
+        >
+            {(manual ? loading : showLoading) ? skeletonContent : children}
         </div>
     );
-}
+};
 
 AntdCustomSkeleton.propTypes = {
     /**
@@ -129,10 +156,7 @@ AntdCustomSkeleton.propTypes = {
     /**
      * 当前组件css类名，支持[动态css](/advanced-classname)
      */
-    className: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.object
-    ]),
+    className: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
 
     /**
      * 组件型，加载状态下显示的内容
@@ -192,7 +216,7 @@ AntdCustomSkeleton.propTypes = {
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.
      */
-    setProps: PropTypes.func
+    setProps: PropTypes.func,
 };
 
-export default AntdCustomSkeleton;
+export default AntdCustomSkeleton;