feffery_antd_components 0.4.4 → 0.4.5

package/src/lib/hooks/useCss.js

@@ -26,4 +26,4 @@ const useCss = (css) => {
     return className;
 };
 
-export default useCss;
+export default useCss;

package/src/lib/hooks/useStickyOffset.js

@@ -1,20 +1,26 @@
 import { useEffect, useLayoutEffect, useRef, useState } from 'react';
 
 function resolveNodes(selector) {
-  const sels = Array.isArray(selector) ? selector : [selector];
-  const nodes = [];
-  if (typeof document === 'undefined') return nodes;
-  for (const sel of sels) {
-    if (!sel) continue;
-    const first = document.querySelector(sel);
-    if (first) nodes.push(first);
-  }
-  return nodes;
+    const sels = Array.isArray(selector) ? selector : [selector];
+    const nodes = [];
+    if (typeof document === 'undefined') {
+        return nodes;
+    }
+    for (const sel of sels) {
+        if (!sel) {
+            continue;
+        }
+        const first = document.querySelector(sel);
+        if (first) {
+            nodes.push(first);
+        }
+    }
+    return nodes;
 }
 
 function getNodesHeight(nodes) {
-  // include borders + padding; exclude margins
-  return nodes.reduce((acc, n) => acc + n.getBoundingClientRect().height, 0);
+    // include borders + padding; exclude margins
+    return nodes.reduce((acc, n) => acc + n.getBoundingClientRect().height, 0);
 }
 
 /**
@@ -27,89 +33,102 @@ function getNodesHeight(nodes) {
  *   useStickyOffset({ selector: ['.topbar', '.filters'], extra: 8 })
  */
 export default function useStickyOffset(selectorOrOptions, extra = 0) {
-  const isObj =
-    selectorOrOptions &&
-    typeof selectorOrOptions === 'object' &&
-    !Array.isArray(selectorOrOptions);
+    const isObj =
+        selectorOrOptions &&
+        typeof selectorOrOptions === 'object' &&
+        !Array.isArray(selectorOrOptions);
 
-  const selector = isObj
-    ? (selectorOrOptions.selector ?? selectorOrOptions.belowSelector ?? null)
-    : selectorOrOptions;
+    const selector = isObj
+        ? (selectorOrOptions.selector ??
+          selectorOrOptions.belowSelector ??
+          null)
+        : selectorOrOptions;
 
-  // allow both `{ extra }` in options and the 2nd positional arg
-  const extraAdd =
-    (isObj ? Number(selectorOrOptions.extra || 0) : Number(extra || 0)) || 0;
+    // allow both `{ extra }` in options and the 2nd positional arg
+    const extraAdd =
+        (isObj ? Number(selectorOrOptions.extra || 0) : Number(extra || 0)) ||
+        0;
 
-  const [offset, setOffset] = useState(0);
-  const rafRef = useRef(null);
-  const nodesRef = useRef([]);
+    const [offset, setOffset] = useState(0);
+    const rafRef = useRef(null);
+    const nodesRef = useRef([]);
 
-  const update = () => {
-    const nodes = nodesRef.current;
-    const h = nodes.length ? getNodesHeight(nodes) : 0;
-    // 1px threshold avoids micro-flutters during transitions
-    setOffset((prev) => {
-      const next = h + extraAdd;
-      return Math.abs(prev - next) >= 1 ? next : prev;
-    });
-  };
+    const update = () => {
+        const nodes = nodesRef.current;
+        const h = nodes.length ? getNodesHeight(nodes) : 0;
+        // 1px threshold avoids micro-flutters during transitions
+        setOffset((prev) => {
+            const next = h + extraAdd;
+            return Math.abs(prev - next) >= 1 ? next : prev;
+        });
+    };
 
-  // use layout effect on client so first paint has correct offset
-  const useLE = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
+    // use layout effect on client so first paint has correct offset
+    const useLE = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
 
-  useLE(() => {
-    if (!selector) {
-      setOffset(extraAdd);
-      return;
-    }
-    nodesRef.current = resolveNodes(selector);
+    useLE(() => {
+        if (!selector) {
+            setOffset(extraAdd);
+            return;
+        }
+        nodesRef.current = resolveNodes(selector);
 
-    // initial measure
-    update();
+        // initial measure
+        update();
 
-    // observe size changes
-    const ros = [];
-    if (typeof window !== 'undefined' && 'ResizeObserver' in window) {
-      for (const n of nodesRef.current) {
-        const ro = new ResizeObserver(() => update());
-        ro.observe(n);
-        ros.push(ro);
-      }
-    }
+        // observe size changes
+        const ros = [];
+        if (typeof window !== 'undefined' && 'ResizeObserver' in window) {
+            for (const n of nodesRef.current) {
+                const ro = new ResizeObserver(() => update());
+                ro.observe(n);
+                ros.push(ro);
+            }
+        }
 
-    // observe attribute/class changes that may affect height
-    const mos = [];
-    if (typeof window !== 'undefined' && 'MutationObserver' in window) {
-      for (const n of nodesRef.current) {
-        const mo = new MutationObserver(() => {
-          if (rafRef.current) cancelAnimationFrame(rafRef.current);
-          rafRef.current = requestAnimationFrame(update);
-        });
-        mo.observe(n, {
-          attributes: true,
-          attributeFilter: ['style', 'class', 'data-open', 'aria-expanded'],
-          childList: true,
-          subtree: true
-        });
-        mos.push(mo);
-      }
-    }
+        // observe attribute/class changes that may affect height
+        const mos = [];
+        if (typeof window !== 'undefined' && 'MutationObserver' in window) {
+            for (const n of nodesRef.current) {
+                const mo = new MutationObserver(() => {
+                    if (rafRef.current) {
+                        cancelAnimationFrame(rafRef.current);
+                    }
+                    rafRef.current = requestAnimationFrame(update);
+                });
+                mo.observe(n, {
+                    attributes: true,
+                    attributeFilter: [
+                        'style',
+                        'class',
+                        'data-open',
+                        'aria-expanded',
+                    ],
+                    childList: true,
+                    subtree: true,
+                });
+                mos.push(mo);
+            }
+        }
 
-    const onWin = () => update();
-    if (typeof window !== 'undefined') {
-      window.addEventListener('resize', onWin);
-    }
+        const onWin = () => update();
+        if (typeof window !== 'undefined') {
+            window.addEventListener('resize', onWin);
+        }
 
-    return () => {
-      if (typeof window !== 'undefined') {
-        window.removeEventListener('resize', onWin);
-      }
-      ros.forEach((ro) => ro.disconnect());
-      mos.forEach((mo) => mo.disconnect());
-      if (rafRef.current) cancelAnimationFrame(rafRef.current);
-    };
-    // stringify option to capture selector arrays etc.
-  }, [JSON.stringify(selector), extraAdd]);
+        return () => {
+            if (typeof window !== 'undefined') {
+                window.removeEventListener('resize', onWin);
+            }
+            ros.forEach((ro) => ro.disconnect());
+            mos.forEach((mo) => mo.disconnect());
+            if (rafRef.current) {
+                cancelAnimationFrame(rafRef.current);
+            }
+            return;
+        };
+        // stringify option to capture selector arrays etc.
+    }, [JSON.stringify(selector), extraAdd]);
 
-  return offset;
+    return offset;
 }

package/src/lib/index.js

@@ -114,10 +114,8 @@ import AntdWatermark from './components/other/AntdWatermark.react';
 import AntdConfigProvider from './components/other/AntdConfigProvider.react';
 import AntdHappyProvider from './components/other/AntdHappyProvider.react';
 import Fragment from './components/other/Fragment.react';
-// 表单生成
-// import AntdFormRender from './components/formRender/AntdFormRender.react';
-// css样式
-import './components/styles.css'; // 自定义样式
+// 额外自定义样式
+import './components/styles.css';
 
 export {
     // 通用
@@ -238,4 +236,4 @@ export {
     Fragment,
     // 表单生成
     // AntdFormRender
-};
+};

package/src/lib/internal_components/UtilsLink.react.js

@@ -1,4 +1,4 @@
-import { Component } from "react";
+import { Component } from 'react';
 import isAbsoluteUrl from 'is-absolute-url';
 import { isUndefined, isNull } from 'lodash';
 
@@ -8,8 +8,13 @@ function CustomEvent(event, params) {
         cancelable: false,
         detail: undefined,
     };
-    const evt = document.createEvent("CustomEvent");
-    evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
+    const evt = document.createEvent('CustomEvent');
+    evt.initCustomEvent(
+        event,
+        params.bubbles,
+        params.cancelable,
+        params.detail
+    );
     return evt;
 }
 CustomEvent.prototype = window.Event.prototype;
@@ -44,8 +49,8 @@ class UtilsLink extends Component {
             // prevent anchor from updating location
             e.preventDefault();
             const { href } = this.props;
-            window.history.pushState({}, "", href);
-            window.dispatchEvent(new CustomEvent("_dashprivate_pushstate"));
+            window.history.pushState({}, '', href);
+            window.dispatchEvent(new CustomEvent('_dashprivate_pushstate'));
             // scroll back to top
             window.scrollTo(0, 0);
         }

package/src/lib/store/formStore.js

@@ -6,50 +6,57 @@ const useFormStore = create((set) => ({
     validateStatuses: {},
     helps: {},
     tooltips: {},
-    updateItemValue: (formId, newValueName, newValue) => set((state) => ({
-        values: {
-            ...state.values,
-            [formId]: {
-                ...state.values[formId],
-                [newValueName]: newValue
-            }
-        }
-    })),
-    updateFormValues: (formId, newValues) => set((state) => ({
-        values: {
-            ...state.values,
-            [formId]: newValues
-        }
-    })),
-    deleteFormValues: (formId) => set((state) => ({
-        // 清除对应表单值
-        values: omit([formId], state.values)
-    })),
-    deleteItemValue: (formId, newValueName) => set((state) => ({
-        values: {
-            ...state.values,
-            // 清除对应表单项的值
-            [formId]: omit([newValueName], state.values[formId])
-        }
-    })),
-    updateValidateStatuses: (formId, newStatues) => set((state) => ({
-        validateStatuses: {
-            ...state.validateStatuses,
-            [formId]: newStatues
-        }
-    })),
-    updateHelps: (formId, newHelps) => set((state) => ({
-        helps: {
-            ...state.helps,
-            [formId]: newHelps
-        }
-    })),
-    updateTooltips: (formId, newTooltips) => set((state) => ({
-        tooltips: {
-            ...state.tooltips,
-            [formId]: newTooltips
-        }
-    }))
+    updateItemValue: (formId, newValueName, newValue) =>
+        set((state) => ({
+            values: {
+                ...state.values,
+                [formId]: {
+                    ...state.values[formId],
+                    [newValueName]: newValue,
+                },
+            },
+        })),
+    updateFormValues: (formId, newValues) =>
+        set((state) => ({
+            values: {
+                ...state.values,
+                [formId]: newValues,
+            },
+        })),
+    deleteFormValues: (formId) =>
+        set((state) => ({
+            // 清除对应表单值
+            values: omit([formId], state.values),
+        })),
+    deleteItemValue: (formId, newValueName) =>
+        set((state) => ({
+            values: {
+                ...state.values,
+                // 清除对应表单项的值
+                [formId]: omit([newValueName], state.values[formId]),
+            },
+        })),
+    updateValidateStatuses: (formId, newStatues) =>
+        set((state) => ({
+            validateStatuses: {
+                ...state.validateStatuses,
+                [formId]: newStatues,
+            },
+        })),
+    updateHelps: (formId, newHelps) =>
+        set((state) => ({
+            helps: {
+                ...state.helps,
+                [formId]: newHelps,
+            },
+        })),
+    updateTooltips: (formId, newTooltips) =>
+        set((state) => ({
+            tooltips: {
+                ...state.tooltips,
+                [formId]: newTooltips,
+            },
+        })),
 }));
 
-export default useFormStore;
+export default useFormStore;

package/tests/requirements.txt

@@ -0,0 +1,5 @@
+# Packages needed to run the tests.
+# Switch into a virtual environment
+# pip install -r requirements.txt
+
+dash[dev,testing]>=3.3.0

package/tests/test_basic_usage.py

@@ -0,0 +1,19 @@
+from dash import Dash, html
+from feffery_dash_utils.style_utils import style
+
+import feffery_antd_components as fac
+
+
+def test_basic_usage(dash_duo):
+    app = Dash(__name__)
+    app.layout = html.Div(
+        fac.AntdButton(fac.__version__, id='button-demo', type='primary'),
+        style=style(padding=50),
+    )
+
+    dash_duo.start_server(app)
+
+    dash_duo.wait_for_text_to_equal(
+        '#button-demo',
+        fac.__version__,
+    )

package/tests/test_locale_french.py

@@ -0,0 +1,33 @@
+import time
+
+from dash import Dash, html
+from feffery_dash_utils.style_utils import style
+from selenium.webdriver.common.by import By
+
+import feffery_antd_components as fac
+
+
+def test_locale_french(dash_duo):
+    app = Dash(__name__)
+    app.layout = html.Div(
+        fac.AntdSpace(
+            [
+                fac.AntdEmpty(locale='fr-fr'),
+                fac.AntdConfigProvider(fac.AntdEmpty(), locale='fr-fr'),
+            ],
+            direction='vertical',
+            style=style(width='100%'),
+        ),
+        style=style(padding=50),
+    )
+
+    dash_duo.start_server(app)
+
+    time.sleep(1)
+
+    descriptions = dash_duo.driver.find_elements(
+        By.XPATH, '//div[contains(@class, "ant-empty-description")]'
+    )
+    assert len(descriptions) == 2
+    for desc in descriptions:
+        assert desc.text == 'Aucune donnée'

package/usage.py

@@ -1,8 +1,9 @@
 import dash
 from dash import html
-import feffery_antd_components as fac
 from feffery_dash_utils.style_utils import style
 
+import feffery_antd_components as fac
+
 app = dash.Dash(
     __name__,
     # 静态资源全量加载测试
@@ -13,9 +14,7 @@ app.layout = fac.AntdConfigProvider(
     html.Div(
         fac.AntdSpace(
             [
-                fac.AntdButton(
-                    '按钮示例', type='primary', size=size
-                )
+                fac.AntdButton('按钮示例', type='primary', size=size)
                 for size in ['large', 'middle', 'small']
             ],
             align='center',

package/webpack.config.js

@@ -1,9 +1,7 @@
 const path = require('path');
-const TerserPlugin = require('terser-webpack-plugin');
 const webpack = require('webpack');
 const WebpackDashDynamicImport = require('@plotly/webpack-dash-dynamic-import');
 const packagejson = require('./package.json');
-// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 
 const dashLibraryName = packagejson.name.replace(/-/g, '_');
 
@@ -55,8 +53,12 @@ module.exports = (env, argv) => {
             library: dashLibraryName,
             libraryTarget: 'window',
         },
-        // devtool: false, // 开发阶段使用，生成全量source-map
-        devtool, // 发布阶段使用，生成最小化source-map
+        devtool,
+        devServer: {
+            static: {
+                directory: path.join(__dirname, '/')
+            }
+        },
         externals,
         module: {
             rules: [
@@ -140,17 +142,6 @@ module.exports = (env, argv) => {
             ],
         },
         optimization: {
-            minimizer: [
-                new TerserPlugin({
-                    sourceMap: true,
-                    parallel: true,
-                    cache: './.build_cache/terser',
-                    terserOptions: {
-                        warnings: false,
-                        ie8: false
-                    }
-                })
-            ],
             splitChunks: {
                 name: '[name].js',
                 cacheGroups: {

package/bug_fix.py

@@ -1,21 +0,0 @@
-import dash
-from dash import html
-import feffery_antd_components as fac
-from feffery_dash_utils.style_utils import style
-
-app = dash.Dash(__name__)
-
-app.layout = html.Div(
-    [
-        fac.AntdDatePicker(
-            placeholder='picker="week"',
-            picker='week',
-            format='YYYY年第w周',
-            style={'width': 175},
-        )
-    ],
-    style=style(padding=50),
-)
-
-if __name__ == '__main__':
-    app.run(debug=True)