feffery_antd_components 0.3.0-b0 → 0.3.0-b2

package/feffery_antd_components/metadata.json

@@ -1920,6 +1920,286 @@
       }
     }
   },
+  "src/lib/components/dataDisplay/AntdDraggablePanel.react.js": {
+    "description": "",
+    "displayName": "AntdDraggablePanel",
+    "methods": [],
+    "props": {
+      "id": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "\u7ec4\u4ef6id"
+      },
+      "children": {
+        "type": {
+          "name": "node"
+        },
+        "required": false,
+        "description": "\u5185\u90e8\u7ec4\u4ef6\u5143\u7d20"
+      },
+      "style": {
+        "type": {
+          "name": "object"
+        },
+        "required": false,
+        "description": "css\u6837\u5f0f"
+      },
+      "className": {
+        "type": {
+          "name": "union",
+          "value": [
+            {
+              "name": "string"
+            },
+            {
+              "name": "object"
+            }
+          ]
+        },
+        "required": false,
+        "description": "css\u7c7b\u540d"
+      },
+      "key": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "\u5f3a\u5236\u5237\u65b0\u7528"
+      },
+      "mode": {
+        "type": {
+          "name": "enum",
+          "value": [
+            {
+              "value": "'fixed'",
+              "computed": false
+            },
+            {
+              "value": "'float'",
+              "computed": false
+            }
+          ]
+        },
+        "required": false,
+        "description": "\u8bbe\u7f6e\u9762\u677f\u6a21\u5f0f\uff0c\u53ef\u9009\u7684\u6709'fixed'\uff08\u56fa\u5b9a\u6a21\u5f0f\uff09\u3001'float'\uff08\u6d6e\u52a8\u7a97\u53e3\u6a21\u5f0f\uff09\r\n\u9ed8\u8ba4\uff1a'fixed'",
+        "defaultValue": {
+          "value": "'fixed'",
+          "computed": false
+        }
+      },
+      "defaultSize": {
+        "type": {
+          "name": "exact",
+          "value": {
+            "width": {
+              "name": "union",
+              "value": [
+                {
+                  "name": "number"
+                },
+                {
+                  "name": "string"
+                }
+              ],
+              "description": "\u8bbe\u7f6e\u50cf\u7d20\u5bbd\u5ea6\u6570\u503c\uff0c\u6216css\u5bbd\u5ea6\u5b57\u7b26\u4e32",
+              "required": false
+            },
+            "height": {
+              "name": "union",
+              "value": [
+                {
+                  "name": "number"
+                },
+                {
+                  "name": "string"
+                }
+              ],
+              "description": "\u8bbe\u7f6e\u50cf\u7d20\u9ad8\u5ea6\u6570\u503c\uff0c\u6216css\u9ad8\u5ea6\u5b57\u7b26\u4e32",
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": "\u8bbe\u7f6e\u5f53\u524d\u9762\u677f\u9ed8\u8ba4\u5c3a\u5bf8"
+      },
+      "defaultPosition": {
+        "type": {
+          "name": "exact",
+          "value": {
+            "x": {
+              "name": "number",
+              "description": "\u8bbe\u7f6e\u8ddd\u79bb\u6587\u6863\u5de6\u7aef\u50cf\u7d20\u8ddd\u79bb",
+              "required": false
+            },
+            "y": {
+              "name": "number",
+              "description": "\u8bbe\u7f6e\u8ddd\u79bb\u6587\u6863\u9876\u7aef\u50cf\u7d20\u8ddd\u79bb",
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": "\u8bbe\u7f6e\u5f53\u524d\u9762\u677f\u9ed8\u8ba4\u4f4d\u7f6e"
+      },
+      "placement": {
+        "type": {
+          "name": "enum",
+          "value": [
+            {
+              "value": "'right'",
+              "computed": false
+            },
+            {
+              "value": "'left'",
+              "computed": false
+            },
+            {
+              "value": "'top'",
+              "computed": false
+            },
+            {
+              "value": "'bottom'",
+              "computed": false
+            }
+          ]
+        },
+        "required": false,
+        "description": "\u56fa\u5b9a\u6a21\u5f0f\u4e0b\uff0c\u7528\u4e8e\u8bbe\u7f6e\u9762\u677f\u671d\u5411\uff0c\u53ef\u9009\u7684\u6709'right'\u3001'left'\u3001'top'\u3001'bottom'\r\n\u9ed8\u8ba4\uff1a'right'",
+        "defaultValue": {
+          "value": "'right'",
+          "computed": false
+        }
+      },
+      "minWidth": {
+        "type": {
+          "name": "number"
+        },
+        "required": false,
+        "description": "\u9762\u677f\u6700\u5c0f\u50cf\u7d20\u5bbd\u5ea6"
+      },
+      "minHeight": {
+        "type": {
+          "name": "number"
+        },
+        "required": false,
+        "description": "\u9762\u677f\u6700\u5c0f\u50cf\u7d20\u9ad8\u5ea6"
+      },
+      "maxWidth": {
+        "type": {
+          "name": "number"
+        },
+        "required": false,
+        "description": "\u9762\u677f\u6700\u5927\u50cf\u7d20\u5bbd\u5ea6"
+      },
+      "maxHeight": {
+        "type": {
+          "name": "number"
+        },
+        "required": false,
+        "description": "\u9762\u677f\u6700\u5927\u50cf\u7d20\u9ad8\u5ea6"
+      },
+      "resize": {
+        "type": {
+          "name": "union",
+          "value": [
+            {
+              "name": "bool"
+            },
+            {
+              "name": "exact",
+              "value": {
+                "bottom": {
+                  "name": "bool",
+                  "required": false
+                },
+                "bottomLeft": {
+                  "name": "bool",
+                  "required": false
+                },
+                "bottomRight": {
+                  "name": "bool",
+                  "required": false
+                },
+                "left": {
+                  "name": "bool",
+                  "required": false
+                },
+                "right": {
+                  "name": "bool",
+                  "required": false
+                },
+                "top": {
+                  "name": "bool",
+                  "required": false
+                },
+                "topLeft": {
+                  "name": "bool",
+                  "required": false
+                },
+                "topRight": {
+                  "name": "bool",
+                  "required": false
+                }
+              }
+            }
+          ]
+        },
+        "required": false,
+        "description": "\u914d\u7f6e\u5c3a\u5bf8\u53ef\u8c03\u6574\u6027\uff0c\u53ef\u72ec\u7acb\u63a7\u5236\u5404\u4e2a\u65b9\u5411\uff0c\u4e5f\u53ef\u76f4\u63a5\u63a7\u5236\u6240\u6709\u65b9\u5411\u662f\u5426\u53ef\u8c03\u6574\u5c3a\u5bf8"
+      },
+      "expandable": {
+        "type": {
+          "name": "bool"
+        },
+        "required": false,
+        "description": "\u9762\u677f\u662f\u5426\u53ef\u5c55\u5f00\r\n\u9ed8\u8ba4\uff1atrue",
+        "defaultValue": {
+          "value": "true",
+          "computed": false
+        }
+      },
+      "isExpand": {
+        "type": {
+          "name": "bool"
+        },
+        "required": false,
+        "description": "\u8bbe\u7f6e\u6216\u76d1\u542c\u5f53\u524d\u9762\u677f\u662f\u5426\u4e3a\u5c55\u5f00\u72b6\u6001"
+      },
+      "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/dataDisplay/AntdEmpty.react.js": {
     "description": "",
     "displayName": "AntdEmpty",
@@ -26893,6 +27173,13 @@
         "required": false,
         "description": ""
       },
+      "children": {
+        "type": {
+          "name": "node"
+        },
+        "required": false,
+        "description": "\u81ea\u5b9a\u4e49\u4e0b\u62c9\u83dc\u5355\u951a\u5b9a\u7684\u81ea\u5b9a\u4e49\u5143\u7d20\uff0c\u4f18\u5148\u7ea7\u6700\u9ad8"
+      },
       "className": {
         "type": {
           "name": "union",
@@ -26915,6 +27202,28 @@
         "required": false,
         "description": ""
       },
+      "wrapperStyle": {
+        "type": {
+          "name": "object"
+        },
+        "required": false,
+        "description": "\u9488\u5bf9\u81ea\u5b9a\u4e49\u951a\u5b9a\u5143\u7d20\u7684\u7236\u5bb9\u5668\u8bbe\u7f6ecss\u6837\u5f0f"
+      },
+      "wrapperClassName": {
+        "type": {
+          "name": "union",
+          "value": [
+            {
+              "name": "string"
+            },
+            {
+              "name": "object"
+            }
+          ]
+        },
+        "required": false,
+        "description": "\u9488\u5bf9\u81ea\u5b9a\u4e49\u951a\u5b9a\u5143\u7d20\u7684\u7236\u5bb9\u5668\u8bbe\u7f6ecss\u7c7b\u540d"
+      },
       "key": {
         "type": {
           "name": "string"

package/feffery_antd_components/package-info.json

@@ -1,6 +1,6 @@
 {
   "name": "feffery_antd_components",
-  "version": "0.3.0-b0",
+  "version": "0.3.0-b2",
   "description": "Best implementation of Antd components in Plotly Dash.",
   "repository": {
     "type": "git",
@@ -28,6 +28,7 @@
     "@ant-design/happy-work-theme": "^1.0.0",
     "@ant-design/icons": "^5.0.0",
     "@ant-design/pro-card": "^1.20.1",
+    "@ant-design/pro-editor": "^0.31.0",
     "@ant-design/pro-layout": "^7.17.13",
     "@plotly/webpack-dash-dynamic-import": "^1.3.0",
     "ahooks": "^3.7.0",
@@ -90,4 +91,4 @@
     "node": ">=8.11.0",
     "npm": ">=6.1.0"
   }
-}
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "feffery_antd_components",
-  "version": "0.3.0-b0",
+  "version": "0.3.0-b2",
   "description": "Best implementation of Antd components in Plotly Dash.",
   "repository": {
     "type": "git",
@@ -28,6 +28,7 @@
     "@ant-design/happy-work-theme": "^1.0.0",
     "@ant-design/icons": "^5.0.0",
     "@ant-design/pro-card": "^1.20.1",
+    "@ant-design/pro-editor": "^0.31.0",
     "@ant-design/pro-layout": "^7.17.13",
     "@plotly/webpack-dash-dynamic-import": "^1.3.0",
     "ahooks": "^3.7.0",
@@ -90,4 +91,4 @@
     "node": ">=8.11.0",
     "npm": ">=6.1.0"
   }
-}
+}

package/src/jl/'feffery'_antddraggablepanel.jl

@@ -0,0 +1,62 @@
+# AUTO GENERATED FILE - DO NOT EDIT
+
+export 'feffery'_antddraggablepanel
+
+"""
+    'feffery'_antddraggablepanel(;kwargs...)
+    'feffery'_antddraggablepanel(children::Any;kwargs...)
+    'feffery'_antddraggablepanel(children_maker::Function;kwargs...)
+
+
+An AntdDraggablePanel component.
+
+Keyword arguments:
+- `children` (a list of or a singular dash component, string or number; optional): 内部组件元素
+- `id` (String; optional): 组件id
+- `className` (String | Dict; optional): css类名
+- `defaultPosition` (optional): 设置当前面板默认位置. defaultPosition has the following type: lists containing elements 'x', 'y'.
+Those elements have the following types:
+  - `x` (Real; optional): 设置距离文档左端像素距离
+  - `y` (Real; optional): 设置距离文档顶端像素距离
+- `defaultSize` (optional): 设置当前面板默认尺寸. defaultSize has the following type: lists containing elements 'width', 'height'.
+Those elements have the following types:
+  - `width` (Real | String; optional): 设置像素宽度数值，或css宽度字符串
+  - `height` (Real | String; optional): 设置像素高度数值，或css高度字符串
+- `expandable` (Bool; optional): 面板是否可展开
+默认：true
+- `isExpand` (Bool; optional): 设置或监听当前面板是否为展开状态
+- `key` (String; optional): 强制刷新用
+- `loading_state` (optional): . loading_state has the following type: lists containing elements 'is_loading', 'prop_name', 'component_name'.
+Those elements have the following types:
+  - `is_loading` (Bool; optional): Determines if the component is loading or not
+  - `prop_name` (String; optional): Holds which property is loading
+  - `component_name` (String; optional): Holds the name of the component that is loading
+- `maxHeight` (Real; optional): 面板最大像素高度
+- `maxWidth` (Real; optional): 面板最大像素宽度
+- `minHeight` (Real; optional): 面板最小像素高度
+- `minWidth` (Real; optional): 面板最小像素宽度
+- `mode` (a value equal to: 'fixed', 'float'; optional): 设置面板模式，可选的有'fixed'（固定模式）、'float'（浮动窗口模式）
+默认：'fixed'
+- `placement` (a value equal to: 'right', 'left', 'top', 'bottom'; optional): 固定模式下，用于设置面板朝向，可选的有'right'、'left'、'top'、'bottom'
+默认：'right'
+- `resize` (optional): 配置尺寸可调整性，可独立控制各个方向，也可直接控制所有方向是否可调整尺寸. resize has the following type: Bool | lists containing elements 'bottom', 'bottomLeft', 'bottomRight', 'left', 'right', 'top', 'topLeft', 'topRight'.
+Those elements have the following types:
+  - `bottom` (Bool; optional)
+  - `bottomLeft` (Bool; optional)
+  - `bottomRight` (Bool; optional)
+  - `left` (Bool; optional)
+  - `right` (Bool; optional)
+  - `top` (Bool; optional)
+  - `topLeft` (Bool; optional)
+  - `topRight` (Bool; optional)
+- `style` (Dict; optional): css样式
+"""
+function 'feffery'_antddraggablepanel(; kwargs...)
+        available_props = Symbol[:children, :id, :className, :defaultPosition, :defaultSize, :expandable, :isExpand, :key, :loading_state, :maxHeight, :maxWidth, :minHeight, :minWidth, :mode, :placement, :resize, :style]
+        wild_props = Symbol[]
+        return Component("'feffery'_antddraggablepanel", "AntdDraggablePanel", "feffery_antd_components", available_props, wild_props; kwargs...)
+end
+
+'feffery'_antddraggablepanel(children::Any; kwargs...) = 'feffery'_antddraggablepanel(;kwargs..., children = children)
+'feffery'_antddraggablepanel(children_maker::Function; kwargs...) = 'feffery'_antddraggablepanel(children_maker(); kwargs...)
+

package/src/jl/'feffery'_antddropdown.jl

@@ -4,10 +4,14 @@ export 'feffery'_antddropdown
 
 """
     'feffery'_antddropdown(;kwargs...)
+    'feffery'_antddropdown(children::Any;kwargs...)
+    'feffery'_antddropdown(children_maker::Function;kwargs...)
+
 
 An AntdDropdown component.
 
 Keyword arguments:
+- `children` (a list of or a singular dash component, string or number; optional): 自定义下拉菜单锚定的自定义元素，优先级最高
 - `id` (String; optional)
 - `arrow` (Bool; optional)
 - `autoAdjustOverflow` (Bool; optional)
@@ -59,10 +63,15 @@ Those elements have the following types:
 - `title` (String; optional)
 - `trigger` (a value equal to: 'click', 'hover'; optional)
 - `visible` (Bool; optional)
+- `wrapperClassName` (String | Dict; optional): 针对自定义锚定元素的父容器设置css类名
+- `wrapperStyle` (Dict; optional): 针对自定义锚定元素的父容器设置css样式
 """
 function 'feffery'_antddropdown(; kwargs...)
-        available_props = Symbol[:id, :arrow, :autoAdjustOverflow, :batchPropsNames, :batchPropsValues, :buttonMode, :buttonProps, :className, :clickedKey, :disabled, :freePosition, :freePositionClassName, :freePositionStyle, :key, :loading_state, :menuItems, :multiple, :nClicks, :nonSelectableKeys, :overlayClassName, :overlayStyle, :placement, :popupContainer, :selectable, :selectedKeys, :style, :title, :trigger, :visible]
+        available_props = Symbol[:children, :id, :arrow, :autoAdjustOverflow, :batchPropsNames, :batchPropsValues, :buttonMode, :buttonProps, :className, :clickedKey, :disabled, :freePosition, :freePositionClassName, :freePositionStyle, :key, :loading_state, :menuItems, :multiple, :nClicks, :nonSelectableKeys, :overlayClassName, :overlayStyle, :placement, :popupContainer, :selectable, :selectedKeys, :style, :title, :trigger, :visible, :wrapperClassName, :wrapperStyle]
         wild_props = Symbol[]
         return Component("'feffery'_antddropdown", "AntdDropdown", "feffery_antd_components", available_props, wild_props; kwargs...)
 end
 
+'feffery'_antddropdown(children::Any; kwargs...) = 'feffery'_antddropdown(;kwargs..., children = children)
+'feffery'_antddropdown(children_maker::Function; kwargs...) = 'feffery'_antddropdown(children_maker(); kwargs...)
+

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

@@ -0,0 +1,174 @@
+import React, { Suspense } from 'react';
+import PropTypes from 'prop-types';
+
+const LazyAntdDraggablePanel = React.lazy(() => import(/* webpackChunkName: "data_display" */ '../../fragments/dataDisplay/AntdDraggablePanel.react'));
+
+const AntdDraggablePanel = (props) => {
+    return (
+        <Suspense fallback={null}>
+            <LazyAntdDraggablePanel {...props} />
+        </Suspense>
+    );
+}
+
+// 定义参数或属性
+AntdDraggablePanel.propTypes = {
+    /**
+     * 组件id
+     */
+    id: PropTypes.string,
+
+    /**
+     * 内部组件元素
+     */
+    children: PropTypes.node,
+
+    /**
+     * css样式
+     */
+    style: PropTypes.object,
+
+    /**
+     * css类名
+     */
+    className: PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.object
+    ]),
+
+    /**
+     * 强制刷新用
+     */
+    key: PropTypes.string,
+
+    /**
+     * 设置面板模式，可选的有'fixed'（固定模式）、'float'（浮动窗口模式）
+     * 默认：'fixed'
+     */
+    mode: PropTypes.oneOf(['fixed', 'float']),
+
+    /**
+     * 设置当前面板默认尺寸
+     */
+    defaultSize: PropTypes.exact({
+        /**
+         * 设置像素宽度数值，或css宽度字符串
+         */
+        width: PropTypes.oneOfType([
+            PropTypes.number,
+            PropTypes.string
+        ]),
+
+        /**
+         * 设置像素高度数值，或css高度字符串
+         */
+        height: PropTypes.oneOfType([
+            PropTypes.number,
+            PropTypes.string
+        ])
+    }),
+
+    /**
+     * 设置当前面板默认位置
+     */
+    defaultPosition: PropTypes.exact({
+        /**
+         * 设置距离文档左端像素距离
+         */
+        x: PropTypes.number,
+
+        /**
+         * 设置距离文档顶端像素距离
+         */
+        y: PropTypes.number
+    }),
+
+    /**
+     * 固定模式下，用于设置面板朝向，可选的有'right'、'left'、'top'、'bottom'
+     * 默认：'right'
+     */
+    placement: PropTypes.oneOf(['right', 'left', 'top', 'bottom']),
+
+    /**
+     * 面板最小像素宽度
+     */
+    minWidth: PropTypes.number,
+
+    /**
+     * 面板最小像素高度
+     */
+    minHeight: PropTypes.number,
+
+    /**
+     * 面板最大像素宽度
+     */
+    maxWidth: PropTypes.number,
+
+    /**
+     * 面板最大像素高度
+     */
+    maxHeight: PropTypes.number,
+
+    /**
+     * 配置尺寸可调整性，可独立控制各个方向，也可直接控制所有方向是否可调整尺寸
+     */
+    resize: PropTypes.oneOfType(
+        [
+            PropTypes.bool,
+            PropTypes.exact({
+                bottom: PropTypes.bool,
+                bottomLeft: PropTypes.bool,
+                bottomRight: PropTypes.bool,
+                left: PropTypes.bool,
+                right: PropTypes.bool,
+                top: PropTypes.bool,
+                topLeft: PropTypes.bool,
+                topRight: PropTypes.bool
+            })
+        ]
+    ),
+
+    /**
+     * 面板是否可展开
+     * 默认：true
+     */
+    expandable: PropTypes.bool,
+
+    /**
+     * 设置或监听当前面板是否为展开状态
+     */
+    isExpand: PropTypes.bool,
+
+    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
+};
+
+// 设置默认参数
+AntdDraggablePanel.defaultProps = {
+    mode: 'fixed',
+    placement: 'right',
+    expandable: true
+}
+
+export default AntdDraggablePanel;
+
+export const propTypes = AntdDraggablePanel.propTypes;
+export const defaultProps = AntdDraggablePanel.defaultProps;

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

@@ -23,6 +23,7 @@ const AntdNotification = (props) => {
         setProps
     } = props;
 
+    const [api, contextHolder] = notification.useNotification({ stack: false });
     const { notification: _notification } = App.useApp();
 
     let config = {
@@ -60,20 +61,20 @@ const AntdNotification = (props) => {
             }
         } else {
             if (type === 'default') {
-                notification.open(config)
+                api.open(config)
             } else if (type === 'success') {
-                notification.success(config)
+                api.success(config)
             } else if (type === 'error') {
-                notification.error(config)
+                api.error(config)
             } else if (type === 'info') {
-                notification.info(config)
+                api.info(config)
             } else if (type === 'warning') {
-                notification.warning(config)
+                api.warning(config)
             }
         }
     })
 
-    return <></>;
+    return <>{contextHolder}</>;
 }
 
 // 定义参数或属性