feffery_utils_components 0.0.24 → 0.0.26

package/src/lib/components/dom/FefferyRawHTML.react.js

@@ -0,0 +1,56 @@
+import { Interweave } from 'interweave';
+import PropTypes from 'prop-types';
+
+// 定义原始HTML字符渲染组件FefferyRawHTML
+const FefferyRawHTML = (props) => {
+
+    const {
+        id,
+        htmlString,
+        setProps,
+        loading_state
+    } = props;
+
+    return (<Interweave
+        id={id}
+        content={htmlString}
+        data-dash-is-loading={
+            (loading_state && loading_state.is_loading) || undefined
+        } />);
+}
+
+// 定义参数或属性
+FefferyRawHTML.propTypes = {
+    // 部件id
+    id: PropTypes.string,
+
+    // 要渲染的原始HTML内容字符串
+    htmlString: 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
+    })
+};
+
+// 设置默认参数
+FefferyRawHTML.defaultProps = {
+}
+
+export default React.memo(FefferyRawHTML);

package/src/lib/index.js

@@ -36,6 +36,8 @@ import FefferyTimeout from "./components/FefferyTimeout.react";
 import FefferyCountDown from "./components/FefferyCountDown.react";
 import FefferySortableItem from "./components/sortable/FefferySortableItem.react";
 import FefferySortableContainer from "./components/sortable/FefferySortableContainer.react";
+import FefferyRawHTML from "./components/dom/FefferyRawHTML.react";
+import FefferyFancyNotification from "./components/FefferyFancyNotification";
 
 /* 
 忽略部分设计React中规范的console警告信息
@@ -96,5 +98,7 @@ export {
     FefferyTimeout,
     FefferyCountDown,
     FefferySortableItem,
-    FefferySortableContainer
+    FefferySortableContainer,
+    FefferyRawHTML,
+    FefferyFancyNotification
 };

package/tests/FancyNotificationTest/app.py

@@ -0,0 +1,50 @@
+if True:
+    import sys
+    import time
+    sys.path.append('../..')
+    import dash
+    import uuid
+    from dash import html, dcc
+    import feffery_utils_components as fuc
+    from dash.dependencies import Input, Output, State
+
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    [
+        html.Button(
+            '触发',
+            id='trigger-button'
+        ),
+
+        html.Div(
+            id='fancy-notification-container',
+            style={
+                'height': '800px'
+            }
+        )
+    ]
+)
+
+
+@app.callback(
+    Output('fancy-notification-container', 'children'),
+    Input('trigger-button', 'n_clicks')
+)
+def demo(n_clicks):
+
+    if n_clicks:
+
+        return fuc.FefferyFancyNotification(
+            html.Span('自定义内容测试', style={'color': 'green'}),
+            autoClose=5000,
+            closable=False,
+            position='top-left',
+            type='success',
+            draggable=False
+        )
+
+
+if __name__ == '__main__':
+    app.run(debug=True)