amis-ui 2.1.1-beta.2 → 2.3.0

package/esm/components/Spinner.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v2.1.1-beta.2
+ * amis-ui v2.3.0
  * Copyright 2018-2022 fex
  */
 
@@ -8,6 +8,8 @@ import React__default from 'react';
 import { generateIcon, themeable } from 'amis-core';
 import Transition, { ENTERED, ENTERING } from 'react-transition-group/Transition';
 import { hasIcon, Icon } from './icons.js';
+import { types } from 'mobx-state-tree';
+import { observable, reaction } from 'mobx';
 
 /**
  * @file Spinner
@@ -20,35 +22,121 @@ var fadeStyles = (_a = {},
     _a[ENTERED] = 'in',
     _a[ENTERING] = 'in',
     _a);
+var SpinnerSharedStore = types
+    .model('SpinnerSharedStore', {})
+    .volatile(function (self) {
+    return {
+        // 保存所有可以进入 loading 状态（props.show = true）的 Spinner 的父级容器
+        spinnerContainers: observable.set([], {
+            deep: false
+        })
+    };
+})
+    .actions(function (self) {
+    return {
+        push: function (spinnerContainer) {
+            if (self.spinnerContainers.has(spinnerContainer)) {
+                return;
+            }
+            self.spinnerContainers.add(spinnerContainer);
+        },
+        remove: function (spinnerContainer) {
+            self.spinnerContainers.delete(spinnerContainer);
+        },
+        /**
+         *  判断当前 Spinner 是否可以进入 loading 状态
+         * @param spinnerContainerWillCheck 待检查的 Spinner 父容器
+         * @returns {boolean} 是否可以进入 loading
+         */
+        checkLoading: function (spinnerContainerWillCheck) {
+            if (self.spinnerContainers.has(spinnerContainerWillCheck)) {
+                if (!self.spinnerContainers.size) {
+                    return false;
+                }
+                var loading_1 = true;
+                // 检查缓存的容器中是否有当前容器的父级元素
+                self.spinnerContainers.forEach(function (container) {
+                    if (container.contains(spinnerContainerWillCheck) &&
+                        container !== spinnerContainerWillCheck) {
+                        loading_1 = false;
+                    }
+                });
+                return loading_1;
+            }
+            return false;
+        }
+    };
+});
+var store = SpinnerSharedStore.create({});
 var Spinner = /** @class */ (function (_super) {
     __extends(Spinner, _super);
     function Spinner() {
-        return _super !== null && _super.apply(this, arguments) || this;
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.state = {
+            spinning: false,
+            showMark: true
+        };
+        _this.parent = null;
+        _this.spinnerRef = function (dom) {
+            if (dom) {
+                _this.parent = dom.parentNode;
+                _this.setState({
+                    showMark: false
+                });
+            }
+        };
+        /**
+         * 监控着 spinnerContainers 的变化
+         */
+        _this.loadingChecker = reaction(function () { return store.spinnerContainers.size; }, function () {
+            _this.setState({
+                spinning: store.checkLoading(_this.parent)
+            });
+        });
+        return _this;
     }
+    Spinner.prototype.componentDidUpdate = function () {
+        if (this.parent) {
+            if (this.props.show) {
+                store.push(this.parent);
+            }
+            else if (this.state.spinning) {
+                store.remove(this.parent);
+            }
+        }
+    };
+    Spinner.prototype.componentWillUnmount = function () {
+        // 卸载 reaction
+        this.loadingChecker();
+        // 删除 当前 parent 元素
+        store.remove(this.parent);
+    };
     Spinner.prototype.render = function () {
-        var _a = this.props, cx = _a.classnames, show = _a.show, className = _a.className, spinnerClassName = _a.spinnerClassName, _b = _a.size, size = _b === void 0 ? '' : _b, overlay = _a.overlay, delay = _a.delay, icon = _a.icon, tip = _a.tip, _c = _a.tipPlacement, tipPlacement = _c === void 0 ? '' : _c;
+        var _a = this.props, cx = _a.classnames, className = _a.className, spinnerClassName = _a.spinnerClassName, _b = _a.size, size = _b === void 0 ? '' : _b, overlay = _a.overlay, delay = _a.delay, icon = _a.icon, tip = _a.tip, _c = _a.tipPlacement, tipPlacement = _c === void 0 ? '' : _c;
         var isCustomIcon = icon && React__default.isValidElement(icon);
         var timeout = { enter: delay, exit: 0 };
-        return (React__default.createElement(Transition, { mountOnEnter: true, unmountOnExit: true, in: show, timeout: timeout }, function (status) {
-            var _a, _b, _c;
-            return (React__default.createElement(React__default.Fragment, null,
-                overlay ? (React__default.createElement("div", { className: cx("Spinner-overlay", fadeStyles[status]) })) : null,
-                React__default.createElement("div", { "data-testid": "spinner", className: cx("Spinner", tip && (_a = {},
-                        _a["Spinner-tip--".concat(tipPlacement)] = [
-                            'top',
-                            'right',
-                            'bottom',
-                            'left'
-                        ].includes(tipPlacement),
-                        _a), (_b = {}, _b["Spinner--overlay"] = overlay, _b), fadeStyles[status], className) },
-                    React__default.createElement("div", { className: cx("Spinner-icon", (_c = {},
-                            _c["Spinner-icon--".concat(size)] = ['lg', 'sm'].includes(size),
-                            _c["Spinner-icon--default"] = !icon,
-                            _c["Spinner-icon--simple"] = !isCustomIcon && icon,
-                            _c["Spinner-icon--custom"] = isCustomIcon,
-                            _c), spinnerClassName) }, icon ? (isCustomIcon ? (icon) : hasIcon(icon) ? (React__default.createElement(Icon, { icon: icon, className: "icon" })) : (generateIcon(cx, icon, 'icon'))) : null),
-                    tip ? React__default.createElement("span", { className: cx("Spinner-tip") }, tip) : '')));
-        }));
+        return (React__default.createElement(React__default.Fragment, null,
+            this.state.showMark && (React__default.createElement("span", { className: cx('Spinner-mark'), ref: this.spinnerRef })),
+            React__default.createElement(Transition, { mountOnEnter: true, unmountOnExit: true, in: this.state.spinning, timeout: timeout }, function (status) {
+                var _a, _b, _c;
+                return (React__default.createElement(React__default.Fragment, null,
+                    overlay ? (React__default.createElement("div", { className: cx("Spinner-overlay", fadeStyles[status]) })) : null,
+                    React__default.createElement("div", { "data-testid": "spinner", className: cx("Spinner", tip && (_a = {},
+                            _a["Spinner-tip--".concat(tipPlacement)] = [
+                                'top',
+                                'right',
+                                'bottom',
+                                'left'
+                            ].includes(tipPlacement),
+                            _a), (_b = {}, _b["Spinner--overlay"] = overlay, _b), fadeStyles[status], className) },
+                        React__default.createElement("div", { className: cx("Spinner-icon", (_c = {},
+                                _c["Spinner-icon--".concat(size)] = ['lg', 'sm'].includes(size),
+                                _c["Spinner-icon--default"] = !icon,
+                                _c["Spinner-icon--simple"] = !isCustomIcon && icon,
+                                _c["Spinner-icon--custom"] = isCustomIcon,
+                                _c), spinnerClassName) }, icon ? (isCustomIcon ? (icon) : hasIcon(icon) ? (React__default.createElement(Icon, { icon: icon, className: "icon" })) : (generateIcon(cx, icon, 'icon'))) : null),
+                        tip ? React__default.createElement("span", { className: cx("Spinner-tip") }, tip) : '')));
+            })));
     };
     Spinner.defaultProps = {
         show: true,

package/esm/components/Steps.d.ts

@@ -73,7 +73,39 @@ export interface StepsProps extends ThemeProps {
     useMobileUI?: boolean;
 }
 export declare function Steps(props: StepsProps): JSX.Element;
-declare const _default: (React.ComponentType<any> & import("hoist-non-react-statics").NonReactStatics<React.ComponentType<any>, {}>) & {
+declare const _default: {
+    new (props: Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps): {
+        ref: any;
+        childRef(ref: any): void;
+        getWrappedInstance(): any;
+        render(): JSX.Element;
+        context: any;
+        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        state: Readonly<{}>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        componentDidMount?(): void;
+        shouldComponentUpdate?(nextProps: Readonly<Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): boolean;
+        componentWillUnmount?(): void;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>): any;
+        componentDidUpdate?(prevProps: Readonly<Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>, snapshot?: any): void;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<Omit<StepsProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void;
+    };
+    displayName: string;
+    contextType: React.Context<string>;
+    ComposedComponent: React.ComponentType<typeof Steps>;
+} & import("hoist-non-react-statics").NonReactStatics<typeof Steps, {}> & {
     ComposedComponent: typeof Steps;
 };
 export default _default;

package/esm/components/Steps.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v2.1.1-beta.2
+ * amis-ui v2.3.0
  * Copyright 2018-2022 fex
  */
 

package/esm/components/Switch.d.ts

@@ -33,7 +33,69 @@ export declare class Switch extends React.PureComponent<SwitchProps, any> {
     hanldeCheck(e: React.ChangeEvent<HTMLInputElement>): void;
     render(): JSX.Element;
 }
-declare const _default: (React.ComponentType<any> & import("hoist-non-react-statics").NonReactStatics<React.ComponentType<any>, {}>) & {
+declare const _default: {
+    new (props: Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+        trueValue: boolean;
+        falseValue: boolean;
+    }, never>> & import("amis-core/lib/theme").ThemeOutterProps): {
+        ref: any;
+        childRef(ref: any): void;
+        getWrappedInstance(): any;
+        render(): JSX.Element;
+        context: any;
+        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+            trueValue: boolean;
+            falseValue: boolean;
+        }, never>> & import("amis-core/lib/theme").ThemeOutterProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+            trueValue: boolean;
+            falseValue: boolean;
+        }, never>> & import("amis-core/lib/theme").ThemeOutterProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        state: Readonly<{}>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        componentDidMount?(): void;
+        shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+            trueValue: boolean;
+            falseValue: boolean;
+        }, never>> & import("amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): boolean;
+        componentWillUnmount?(): void;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+            trueValue: boolean;
+            falseValue: boolean;
+        }, never>> & import("amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>): any;
+        componentDidUpdate?(prevProps: Readonly<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+            trueValue: boolean;
+            falseValue: boolean;
+        }, never>> & import("amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>, snapshot?: any): void;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+            trueValue: boolean;
+            falseValue: boolean;
+        }, never>> & import("amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+            trueValue: boolean;
+            falseValue: boolean;
+        }, never>> & import("amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+            trueValue: boolean;
+            falseValue: boolean;
+        }, never>> & import("amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "disabled" | "value" | "checked" | "id" | "onChange" | "inline" | "size" | "readOnly" | "level" | "onText" | "offText"> & Partial<Pick<Omit<SwitchProps, keyof import("amis-core").ThemeProps>, "trueValue" | "falseValue">> & Partial<Pick<{
+            trueValue: boolean;
+            falseValue: boolean;
+        }, never>> & import("amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void;
+    };
+    displayName: string;
+    contextType: React.Context<string>;
+    ComposedComponent: React.ComponentType<typeof Switch>;
+} & import("hoist-non-react-statics").NonReactStatics<typeof Switch, {}> & {
     ComposedComponent: typeof Switch;
 };
 export default _default;

package/esm/components/Switch.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v2.1.1-beta.2
+ * amis-ui v2.3.0
  * Copyright 2018-2022 fex
  */