feffery_utils_components 0.2.0-rc11 → 0.2.0-rc13

package/feffery_utils_components/metadata.json

@@ -13294,8 +13294,60 @@
       }
     }
   },
+  "src/lib/components/FefferySetFavicon.react.js": {
+    "description": "favicon\u8bbe\u7f6e\u7ec4\u4ef6FefferySetFavicon",
+    "displayName": "FefferySetFavicon",
+    "methods": [],
+    "props": {
+      "id": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "\u7ec4\u4ef6id"
+      },
+      "favicon": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "\u7528\u4e8e\u8bbe\u7f6e\u8981\u66f4\u65b0\u7684favicon\u56fe\u7247\u6587\u4ef6\u5730\u5740\uff0c\u652f\u6301svg\u3001png\u3001ico\u3001gif\u683c\u5f0f"
+      },
+      "setProps": {
+        "type": {
+          "name": "func"
+        },
+        "required": false,
+        "description": "Dash-assigned callback that should be called to report property changes\r\nto Dash, to make them available for callbacks."
+      },
+      "loading_state": {
+        "type": {
+          "name": "shape",
+          "value": {
+            "is_loading": {
+              "name": "bool",
+              "description": "Determines if the component is loading or not",
+              "required": false
+            },
+            "prop_name": {
+              "name": "string",
+              "description": "Holds which property is loading",
+              "required": false
+            },
+            "component_name": {
+              "name": "string",
+              "description": "Holds the name of the component that is loading",
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": ""
+      }
+    }
+  },
   "src/lib/components/FefferySetTitle.react.js": {
-    "description": "",
+    "description": "\u9875\u9762title\u8bbe\u7f6e\u7ec4\u4ef6FefferySetTitle",
     "displayName": "FefferySetTitle",
     "methods": [],
     "props": {
@@ -13313,6 +13365,13 @@
         "required": false,
         "description": "\u7528\u4e8e\u8bbe\u7f6e\u8981\u66f4\u65b0\u7684title\u4fe1\u606f"
       },
+      "originTitle": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "\u5f53title\u53c2\u6570\u4e3a\u7a7a\uff0c\u6216\u5f53\u524d\u7ec4\u4ef6\u4ece\u9875\u9762\u4e2d\u5378\u8f7d\u540e\u5e94\u5f53\u8fd8\u539f\u7684title"
+      },
       "setProps": {
         "type": {
           "name": "func"
@@ -13704,6 +13763,244 @@
       }
     }
   },
+  "src/lib/components/FefferySliderCaptcha.react.js": {
+    "description": "",
+    "displayName": "FefferySliderCaptcha",
+    "methods": [],
+    "props": {
+      "id": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "\u7ec4\u4ef6id"
+      },
+      "className": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "css\u7c7b\u540d"
+      },
+      "style": {
+        "type": {
+          "name": "object"
+        },
+        "required": false,
+        "description": "css\u6837\u5f0f"
+      },
+      "imgSrc": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "\u7528\u4e8e\u751f\u6210\u62fc\u56fe\u7684\u5b8c\u6574\u56fe\u7247\u5730\u5740"
+      },
+      "imgWidth": {
+        "type": {
+          "name": "number"
+        },
+        "required": false,
+        "description": "\u58f0\u660e\u7528\u4e8e\u751f\u6210\u62fc\u56fe\u7684\u5b8c\u6574\u56fe\u7247\u50cf\u7d20\u5bbd\u5ea6\u503c"
+      },
+      "xOffset": {
+        "type": {
+          "name": "number"
+        },
+        "required": false,
+        "description": "\u62fc\u56fe\u5408\u6cd5\u9a8c\u8bc1\u50cf\u7d20\u504f\u79fb\u91cf\r\n\u9ed8\u8ba4\u503c\uff1a`5`",
+        "defaultValue": {
+          "value": "5",
+          "computed": false
+        }
+      },
+      "mode": {
+        "type": {
+          "name": "enum",
+          "value": [
+            {
+              "value": "'embed'",
+              "computed": false
+            },
+            {
+              "value": "'float'",
+              "computed": false
+            },
+            {
+              "value": "'slider'",
+              "computed": false
+            }
+          ]
+        },
+        "required": false,
+        "description": "\u663e\u793a\u6a21\u5f0f\uff0c\u53ef\u9009\u9879\u6709`'embed'`\u3001`'float'`\u3001`'slider'`\r\n\u9ed8\u8ba4\u503c\uff1a`'embed'`",
+        "defaultValue": {
+          "value": "'embed'",
+          "computed": false
+        }
+      },
+      "tipText": {
+        "type": {
+          "name": "exact",
+          "value": {
+            "default": {
+              "name": "node",
+              "description": "\u9ed8\u8ba4\u63d0\u793a\u5185\u5bb9",
+              "required": false
+            },
+            "loading": {
+              "name": "node",
+              "description": "\u52a0\u8f7d\u4e2d\u63d0\u793a\u5185\u5bb9",
+              "required": false
+            },
+            "moving": {
+              "name": "node",
+              "description": "\u79fb\u52a8\u4e2d\u63d0\u793a\u5185\u5bb9",
+              "required": false
+            },
+            "verifying": {
+              "name": "node",
+              "description": "\u9a8c\u8bc1\u4e2d\u63d0\u793a\u5185\u5bb9",
+              "required": false
+            },
+            "success": {
+              "name": "node",
+              "description": "\u9a8c\u8bc1\u6210\u529f\u63d0\u793a\u5185\u5bb9",
+              "required": false
+            },
+            "error": {
+              "name": "node",
+              "description": "\u9a8c\u8bc1\u5931\u8d25\u63d0\u793a\u5185\u5bb9",
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": "\u914d\u7f6e\u76f8\u5173\u6587\u6848\u63d0\u793a\u5185\u5bb9"
+      },
+      "showRefreshIcon": {
+        "type": {
+          "name": "bool"
+        },
+        "required": false,
+        "description": "\u663e\u793a\u53f3\u4e0a\u89d2\u5237\u65b0\u6309\u94ae\r\n\u9ed8\u8ba4\u503c\uff1a`true`",
+        "defaultValue": {
+          "value": "true",
+          "computed": false
+        }
+      },
+      "autoRefreshOnError": {
+        "type": {
+          "name": "bool"
+        },
+        "required": false,
+        "description": "\u9a8c\u8bc1\u5931\u8d25\u540e\u662f\u5426\u81ea\u52a8\u5237\u65b0\r\n\u9ed8\u8ba4\u503c\uff1a`true`",
+        "defaultValue": {
+          "value": "true",
+          "computed": false
+        }
+      },
+      "errorHoldDuration": {
+        "type": {
+          "name": "number"
+        },
+        "required": false,
+        "description": "\u5f53`autoRefreshOnError=True`\u65f6\uff0c\u6bcf\u6b21\u9a8c\u8bc1\u5931\u8d25\u540e\u505c\u987f\u591a\u5c11\u6beb\u79d2\u81ea\u52a8\u5237\u65b0\r\n\u9ed8\u8ba4\u503c\uff1a`500`",
+        "defaultValue": {
+          "value": "500",
+          "computed": false
+        }
+      },
+      "placement": {
+        "type": {
+          "name": "enum",
+          "value": [
+            {
+              "value": "'top'",
+              "computed": false
+            },
+            {
+              "value": "'bottom'",
+              "computed": false
+            }
+          ]
+        },
+        "required": false,
+        "description": "\u62fc\u56fe\u56fe\u7247\u663e\u793a\u65b9\u4f4d\uff0c\u53ef\u9009\u9879\u6709`'top'`\u3001`'bottom'`\r\n\u9ed8\u8ba4\u503c\uff1a`'top'`",
+        "defaultValue": {
+          "value": "'top'",
+          "computed": false
+        }
+      },
+      "refresh": {
+        "type": {
+          "name": "bool"
+        },
+        "required": false,
+        "description": "\u624b\u52a8\u5237\u65b0\u7528\uff0c\u6bcf\u6b21\u66f4\u65b0\u4e3a`True`\u65f6\u4f1a\u4e3b\u52a8\u89e6\u53d1\u5237\u65b0\uff0c\u6bcf\u6b21\u6210\u529f\u5237\u65b0\u540e\u4f1a\u91cd\u7f6e\u4e3a`False`"
+      },
+      "verifyResult": {
+        "type": {
+          "name": "exact",
+          "value": {
+            "status": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'success'",
+                  "computed": false
+                },
+                {
+                  "value": "'error'",
+                  "computed": false
+                }
+              ],
+              "description": "\u9a8c\u8bc1\u72b6\u6001\uff0c`'success'`\u8868\u793a\u9a8c\u8bc1\u6210\u529f\uff0c`'error'`\u8868\u793a\u9a8c\u8bc1\u5931\u8d25",
+              "required": false
+            },
+            "timestamp": {
+              "name": "number",
+              "description": "\u4e8b\u4ef6\u53d1\u751f\u65f6\u95f4\u6233",
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": "\u76d1\u542c\u6700\u8fd1\u4e00\u6b21\u9a8c\u8bc1\u7ed3\u679c"
+      },
+      "loading_state": {
+        "type": {
+          "name": "shape",
+          "value": {
+            "is_loading": {
+              "name": "bool",
+              "description": "Determines if the component is loading or not",
+              "required": false
+            },
+            "prop_name": {
+              "name": "string",
+              "description": "Holds which property is loading",
+              "required": false
+            },
+            "component_name": {
+              "name": "string",
+              "description": "Holds the name of the component that is loading",
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": ""
+      },
+      "setProps": {
+        "type": {
+          "name": "func"
+        },
+        "required": false,
+        "description": "Dash-assigned callback that should be called to report property changes\r\nto Dash, to make them available for callbacks."
+      }
+    }
+  },
   "src/lib/components/FefferySticky.react.js": {
     "description": "",
     "displayName": "FefferySticky",

package/feffery_utils_components/package-info.json

@@ -1,6 +1,6 @@
 {
   "name": "feffery_utils_components",
-  "version": "0.2.0-rc11",
+  "version": "0.2.0-rc13",
   "description": "Build more utility components for Plotly Dash.",
   "repository": {
     "type": "git",
@@ -43,6 +43,7 @@
     "byte-guide": "^1.0.7",
     "cherry-markdown": "^0.8.31",
     "comutils": "^1.1.19",
+    "create-puzzle": "^2.0.2",
     "dashjs": "4.7.2",
     "devtools-detector": "^2.0.15",
     "emoji-mart": "^5.5.2",
@@ -62,6 +63,7 @@
     "pinyin_js": "^1.0.4",
     "qrcode.react": "^3.1.0",
     "ramda": "^0.26.1",
+    "rc-slider-captcha": "^1.3.0",
     "rc-virtual-list": "^3.4.8",
     "re-resizable": "^6.9.9",
     "react-aplayer": "1.0.0",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "feffery_utils_components",
-  "version": "0.2.0-rc11",
+  "version": "0.2.0-rc13",
   "description": "Build more utility components for Plotly Dash.",
   "repository": {
     "type": "git",
@@ -43,6 +43,7 @@
     "byte-guide": "^1.0.7",
     "cherry-markdown": "^0.8.31",
     "comutils": "^1.1.19",
+    "create-puzzle": "^2.0.2",
     "dashjs": "4.7.2",
     "devtools-detector": "^2.0.15",
     "emoji-mart": "^5.5.2",
@@ -62,6 +63,7 @@
     "pinyin_js": "^1.0.4",
     "qrcode.react": "^3.1.0",
     "ramda": "^0.26.1",
+    "rc-slider-captcha": "^1.3.0",
     "rc-virtual-list": "^3.4.8",
     "re-resizable": "^6.9.9",
     "react-aplayer": "1.0.0",

package/src/lib/components/FefferySetFavicon.react.js

@@ -0,0 +1,58 @@
+import { useFavicon } from 'ahooks';
+import PropTypes from 'prop-types';
+
+/**
+ * favicon设置组件FefferySetFavicon
+ */
+const FefferySetFavicon = (props) => {
+
+    const {
+        favicon,
+        setProps,
+        loading_state
+    } = props;
+
+    useFavicon(favicon);
+
+    return <></>;
+}
+
+// 定义参数或属性
+FefferySetFavicon.propTypes = {
+    /**
+     * 组件id
+     */
+    id: PropTypes.string,
+
+    /**
+     * 用于设置要更新的favicon图片文件地址，支持svg、png、ico、gif格式
+     */
+    favicon: PropTypes.string,
+
+    /**
+     * Dash-assigned callback that should be called to report property changes
+     * to Dash, to make them available for callbacks.
+     */
+    setProps: PropTypes.func,
+
+    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
+    })
+};
+
+// 设置默认参数
+FefferySetFavicon.defaultProps = {
+}
+
+export default FefferySetFavicon;

package/src/lib/components/FefferySetTitle.react.js

@@ -1,20 +1,30 @@
+import { useEffect } from 'react';
 import { useTitle } from 'ahooks';
 import PropTypes from 'prop-types';
 
-// 定义页面title设置组件FefferySetTitle
+/**
+ * 页面title设置组件FefferySetTitle
+ */
 const FefferySetTitle = (props) => {
 
     const {
-        id,
         title,
+        originTitle,
         setProps,
         loading_state
     } = props;
 
-    // 随着title更新进而改变页面title
-    if (title) {
-        useTitle(title)
-    }
+    // 组件卸载时，还原有效的originTitle
+    useEffect(() => {
+        return () => {
+            if (originTitle) {
+                document.title = originTitle;
+            }
+        }
+    }, [])
+
+    // 处理title变化时的更新
+    useTitle(title || originTitle);
 
     return <></>;
 }
@@ -31,6 +41,11 @@ FefferySetTitle.propTypes = {
      */
     title: PropTypes.string,
 
+    /**
+     * 当title参数为空，或当前组件从页面中卸载后应当还原的title
+     */
+    originTitle: PropTypes.string,
+
     /**
      * Dash-assigned callback that should be called to report property changes
      * to Dash, to make them available for callbacks.

package/src/lib/components/FefferySliderCaptcha.react.js

@@ -0,0 +1,160 @@
+import React, { Suspense } from 'react';
+import PropTypes from 'prop-types';
+
+const LazyFefferySliderCaptcha = React.lazy(() => import(/* webpackChunkName: "feffery_slider_captcha" */ '../fragments/FefferySliderCaptcha.react'));
+
+const FefferySliderCaptcha = (props) => {
+    return (
+        <Suspense fallback={null}>
+            <LazyFefferySliderCaptcha {...props} />
+        </Suspense>
+    );
+}
+
+FefferySliderCaptcha.propTypes = {
+    /**
+     * 组件id
+     */
+    id: PropTypes.string,
+
+    /**
+     * css类名
+     */
+    className: PropTypes.string,
+
+    /**
+     * css样式
+     */
+    style: PropTypes.object,
+
+    /**
+     * 用于生成拼图的完整图片地址
+     */
+    imgSrc: PropTypes.string,
+
+    /**
+     * 声明用于生成拼图的完整图片像素宽度值
+     */
+    imgWidth: PropTypes.number,
+
+    /**
+     * 拼图合法验证像素偏移量
+     * 默认值：`5`
+     */
+    xOffset: PropTypes.number,
+
+    /**
+     * 显示模式，可选项有`'embed'`、`'float'`、`'slider'`
+     * 默认值：`'embed'`
+     */
+    mode: PropTypes.oneOf(['embed', 'float', 'slider']),
+
+    /**
+     * 配置相关文案提示内容
+     */
+    tipText: PropTypes.exact({
+        /**
+         * 默认提示内容
+         */
+        default: PropTypes.node,
+        /**
+         * 加载中提示内容
+         */
+        loading: PropTypes.node,
+        /**
+         * 移动中提示内容
+         */
+        moving: PropTypes.node,
+        /**
+         * 验证中提示内容
+         */
+        verifying: PropTypes.node,
+        /**
+         * 验证成功提示内容
+         */
+        success: PropTypes.node,
+        /**
+         * 验证失败提示内容
+         */
+        error: PropTypes.node
+    }),
+
+    /**
+     * 显示右上角刷新按钮
+     * 默认值：`true`
+     */
+    showRefreshIcon: PropTypes.bool,
+
+    /**
+     * 验证失败后是否自动刷新
+     * 默认值：`true`
+     */
+    autoRefreshOnError: PropTypes.bool,
+
+    /**
+     * 当`autoRefreshOnError=True`时，每次验证失败后停顿多少毫秒自动刷新
+     * 默认值：`500`
+     */
+    errorHoldDuration: PropTypes.number,
+
+    /**
+     * 拼图图片显示方位，可选项有`'top'`、`'bottom'`
+     * 默认值：`'top'`
+     */
+    placement: PropTypes.oneOf(['top', 'bottom']),
+
+    /**
+     * 手动刷新用，每次更新为`True`时会主动触发刷新，每次成功刷新后会重置为`False`
+     */
+    refresh: PropTypes.bool,
+
+    /**
+     * 监听最近一次验证结果
+     */
+    verifyResult: PropTypes.exact({
+        /**
+         * 验证状态，`'success'`表示验证成功，`'error'`表示验证失败
+         */
+        status: PropTypes.oneOf(['success', 'error']),
+        /**
+         * 事件发生时间戳
+         */
+        timestamp: PropTypes.number
+    }),
+
+    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.
+     */
+    setProps: PropTypes.func
+};
+
+// 设置默认参数
+FefferySliderCaptcha.defaultProps = {
+    xOffset: 5,
+    mode: 'embed',
+    showRefreshIcon: true,
+    autoRefreshOnError: true,
+    errorHoldDuration: 500,
+    placement: 'top'
+}
+
+export default FefferySliderCaptcha;
+
+export const propTypes = FefferySliderCaptcha.propTypes;
+export const defaultProps = FefferySliderCaptcha.defaultProps;