@douyinfe/semi-ui 2.1.2 → 2.1.5

package/layout/_story/layout.stories.js

@@ -0,0 +1,305 @@
+import React from 'react';
+
+import { Layout } from '../index';
+import Nav from '../../navigation';
+import { Button } from '../../index';
+import {
+  IconBytedanceLogo,
+  IconVigoLogo,
+  IconDescend,
+  IconList,
+  IconEdit,
+  IconCamera,
+  IconFile,
+  IconGlobe,
+} from '@douyinfe/semi-icons';
+
+export default {
+  title: 'Layout'
+}
+
+const { Header, Footer, Sider, Content } = Layout;
+const style = {
+  textAlign: 'center',
+  margin: 60,
+};
+const contentStyle = {
+  height: 300,
+  backgroundColor: '#ddd',
+};
+const siderStyle = {
+  width: 100,
+  backgroundColor: '#ccc',
+};
+const headerStyle = {
+  height: 64,
+  paddingLeft: 50,
+  paddingRight: 50,
+  color: '#333',
+  background: '#f0f2f5',
+};
+const footerStyle = {
+  height: 64,
+  paddingLeft: 50,
+  paddingRight: 50,
+  color: '#333',
+  background: '#f0f2f5',
+};
+
+export const LayoutDefault = () => (
+  <div>
+    <Layout style={style}>
+      <Header style={headerStyle}>Header</Header>
+      <Content style={contentStyle}>Content</Content>
+      <Footer style={footerStyle}>Footer</Footer>
+    </Layout>
+
+    <Layout style={style}>
+      <Header style={headerStyle}>Header</Header>
+      <Layout>
+        <Sider style={siderStyle}>Sider</Sider>
+        <Content style={contentStyle}>Content</Content>
+      </Layout>
+      <Footer style={footerStyle}>Footer</Footer>
+    </Layout>
+
+    <Layout style={style}>
+      <Header style={headerStyle}>Header</Header>
+      <Layout>
+        <Content style={contentStyle}>Content</Content>
+        <Sider style={siderStyle}>Sider</Sider>
+      </Layout>
+      <Footer style={footerStyle}>Footer</Footer>
+    </Layout>
+
+    <Layout style={style}>
+      <Sider style={siderStyle}>Sider</Sider>
+      <Layout>
+        <Header style={headerStyle}>Header</Header>
+        <Content style={contentStyle}>Content</Content>
+        <Footer style={footerStyle}>Footer</Footer>
+      </Layout>
+    </Layout>
+  </div>
+);
+
+LayoutDefault.story = {
+  name: 'Layout default',
+};
+
+export const LayoutDemo = () => (
+  <div>
+    <Layout style={style}>
+      <Sider>
+        <Nav
+          style={{
+            width: 200,
+          }}
+          items={[
+            {
+              itemKey: '1',
+              text: 'Option 1',
+              icon: <IconEdit />,
+            },
+            {
+              itemKey: '2',
+              text: 'Option 2',
+              icon: <IconCamera />,
+            },
+            {
+              text: 'Group 3',
+              icon: <IconFile />,
+              itemKey: '3',
+              items: ['3-1', '3-2'],
+            },
+            {
+              text: 'Group 4',
+              icon: <IconGlobe />,
+              itemKey: '4',
+              items: ['4-1', '4-2'],
+            },
+          ]}
+        />
+      </Sider>
+      <Layout>
+        <Header style={headerStyle}>Header</Header>
+        <Content style={contentStyle}>Content</Content>
+        <Footer style={footerStyle}>Footer</Footer>
+      </Layout>
+    </Layout>
+  </div>
+);
+
+LayoutDemo.story = {
+  name: 'Layout demo',
+};
+
+class NavApp extends React.Component {
+  constructor() {
+    super();
+    this.state = {
+      isCollapsed: true,
+      defaultOpenKeys: [],
+      mode: 'vertical',
+      navHeight: 480,
+      selectedKeys: [],
+      openKeys: [],
+    };
+
+    this.onSelect = (data = {}) => {
+      console.log('trigger onSelect: ', data);
+      let selectedKeys = Array.from(data.selectedKeys);
+      this.setState({
+        selectedKeys,
+      });
+    };
+
+    this.onOpenChange = (data = {}) => {
+      console.log('trigger onOpenChange: ', data);
+      let openKeys = Array.from(data.openKeys);
+      this.setState({
+        openKeys,
+      });
+    };
+  }
+
+  updateCollapsed(isCollapsed) {
+    this.setState({
+      isCollapsed,
+    });
+  }
+
+  toggleMode() {
+    let { mode, navHeight } = this.state;
+
+    if (mode === 'vertical') {
+      mode = 'horizontal';
+      navHeight = 60;
+    } else {
+      mode = 'vertical';
+      navHeight = 480;
+    }
+
+    this.setState({
+      mode,
+      navHeight,
+    });
+  }
+
+  render() {
+    let { isCollapsed, defaultOpenKeys, mode, navHeight, selectedKeys, openKeys } = this.state;
+    return (
+      <div>
+        <Nav
+          isCollapsed={isCollapsed}
+          defaultOpenKeys={defaultOpenKeys}
+          style={{
+            height: navHeight,
+          }}
+          mode={mode}
+          selectedKeys={selectedKeys}
+          openKeys={openKeys}
+          onSelect={this.onSelect}
+          onOpenChange={this.onOpenChange}
+        >
+          <Nav.Header logo={<IconBytedanceLogo size="extra-large" />} text="互娱运营" />
+          <Nav.Item itemKey={'1'} text={<strong>火山运营</strong>} icon={<IconVigoLogo />} />
+          <Nav.Sub itemKey={'2'} text={<strong>运营</strong>} icon={<IconVigoLogo />}>
+            {['2-1', '2-2'].map(k => (
+              <Nav.Item key={k} itemKey={String(k)} text={'Option ' + k} />
+            ))}
+            <Nav.Sub text={'Group 2-3'} icon={<IconDescend />} itemKey="2-3">
+              <Nav.Item itemKey={'2-3-1'} text={'Option 2-3-1'} />
+              <Nav.Item itemKey={'2-3-2'} text={'Option 2-3-2'} />
+            </Nav.Sub>
+          </Nav.Sub>
+          <Nav.Footer>
+            <Button
+              title="展开/收起切换"
+              icon={<IconList />}
+              onClick={() => this.updateCollapsed(!isCollapsed)}
+            />
+          </Nav.Footer>
+        </Nav>
+      </div>
+    );
+  }
+}
+
+export const CollapseNavDemo = () => (
+  <div>
+    <Layout style={style}>
+      <Sider>
+        <NavApp />
+      </Sider>
+      <Layout>
+        <Header style={headerStyle}>Header</Header>
+        <Content style={contentStyle}>Content</Content>
+        <Footer style={footerStyle}>Footer</Footer>
+      </Layout>
+    </Layout>
+  </div>
+);
+
+CollapseNavDemo.story = {
+  name: 'collapse nav demo',
+};
+
+class SimpleNav extends React.Component {
+  constructor() {
+    super();
+    this.state = {
+      isCollapsed: true,
+      mode: 'vertical',
+      navHeight: 480,
+    };
+  }
+
+  updateCollapsed(isCollapsed) {
+    this.setState({
+      isCollapsed,
+    });
+  }
+
+  render() {
+    let { isCollapsed, mode, navHeight } = this.state;
+    return (
+      <div>
+        <Nav
+          isCollapsed={isCollapsed}
+          style={{
+            height: navHeight,
+          }}
+          mode={mode}
+        >
+          <Button icon={<IconList />} onClick={() => this.updateCollapsed(!isCollapsed)}>
+            展开/收起切换
+          </Button>
+        </Nav>
+      </div>
+    );
+  }
+}
+
+const onbreakpoint = (screen, bool) => {
+  console.log(screen, bool);
+};
+
+export const CollapseSimpleNavDemo = () => (
+  <div>
+    <Layout style={style}>
+      <Sider breakpoint={['md']} onBreakpoint={onbreakpoint}>
+        <SimpleNav />
+      </Sider>
+      <Layout>
+        <Header style={headerStyle}>Header</Header>
+        <Content style={contentStyle}>Content</Content>
+        <Footer style={footerStyle}>Footer</Footer>
+      </Layout>
+    </Layout>
+  </div>
+);
+
+CollapseSimpleNavDemo.story = {
+  name: 'collapse SimpleNav demo',
+};

package/layout/_story/layout.stories.tsx

@@ -0,0 +1,13 @@
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { Layout } from '../index';
+
+const stories = storiesOf('Layout', module);
+
+stories.add('Layout', () => (
+    <Layout className='components-layout-demo'>
+        <Layout.Header>Header</Layout.Header>
+        <Layout.Content>Content</Layout.Content>
+        <Layout.Footer>Footer</Layout.Footer>
+    </Layout>
+));

package/layout/index.tsx

@@ -0,0 +1,126 @@
+import React, { CSSProperties, ComponentClass } from 'react';
+import cls from 'classnames';
+import PropTypes from 'prop-types';
+import { cssClasses } from '@douyinfe/semi-foundation/layout/constants';
+import '@douyinfe/semi-foundation/layout/layout.scss';
+import LayoutContext, { ContextType } from './layout-context';
+import Sider from './Sider';
+
+export { ResponsiveMap, SiderProps } from './Sider';
+
+const htmlTag = {
+    Header: 'header',
+    Footer: 'footer',
+    Content: 'main',
+    Layout: 'section'
+};
+
+function generator<P extends { type?: string; tagName?: string }>(type: string): (ComponentType: ComponentClass<{ type?: string; tagName?: string } & P>) => ComponentClass<P> {
+    const tagName = htmlTag[type];
+    const typeName = type.toLowerCase();
+    return (BasicComponent): ComponentClass<P> => class Adapter extends React.PureComponent<P> {
+        render() {
+            return <BasicComponent type={typeName} tagName={tagName} {...this.props} />;
+        }
+    };
+}
+
+export interface BasicProps {
+    prefixCls?: string;
+    style?: CSSProperties;
+    className?: string;
+    tagName?: keyof HTMLElementTagNameMap;
+    type?: string;
+}
+
+class Basic extends React.PureComponent<BasicProps> {
+    static propTypes = {
+        prefixCls: PropTypes.string,
+        style: PropTypes.object,
+        className: PropTypes.string,
+    };
+
+    static defaultProps = {
+        prefixCls: cssClasses.PREFIX,
+    };
+
+    render() {
+        const { prefixCls, type, className, children, tagName, ...others } = this.props;
+        const classString = cls(className, `${prefixCls}-${type}`);
+        return React.createElement(tagName, { className: classString, ...others }, children);
+    }
+}
+
+const Header = generator<BasicProps>('Header')(Basic);
+const Footer = generator<BasicProps>('Footer')(Basic);
+const Content = generator<BasicProps>('Content')(Basic);
+
+export interface BasicLayoutProps {
+    prefixCls?: string;
+    style?: CSSProperties;
+    className?: string;
+    hasSider?: boolean;
+    tagName?: keyof HTMLElementTagNameMap;
+}
+
+export interface BasicLayoutState {
+    siders: Array<string>;
+}
+
+class Layout extends React.Component<BasicLayoutProps, BasicLayoutState> {
+    static propTypes = {
+        prefixCls: PropTypes.string,
+        style: PropTypes.object,
+        className: PropTypes.string,
+    };
+
+    static defaultProps = {
+        prefixCls: cssClasses.PREFIX,
+        tagName: 'section'
+    };
+    static Header = Header;
+    static Footer = Footer;
+    static Content = Content;
+    static Sider = Sider;
+
+    constructor(props: BasicLayoutProps) {
+        super(props);
+        this.state = {
+            siders: [],
+        };
+    }
+
+    getSiderHook(): ContextType['siderHook'] {
+        return {
+            addSider: (id: string): void => {
+                this.setState(state => ({
+                    siders: [...state.siders, id],
+                }));
+            },
+            removeSider: (id: string): void => {
+                this.setState(state => ({
+                    siders: state.siders.filter(curr => curr !== id),
+                }));
+            },
+        };
+    }
+
+    render() {
+        const { prefixCls, className, children, hasSider, tagName, ...others } = this.props;
+        const { siders } = this.state;
+        const classString = cls(className, prefixCls, {
+            [`${prefixCls}-has-sider`]: typeof hasSider === 'boolean' ? hasSider : siders.length > 0,
+        });
+        const Tag: any = tagName;
+        return (
+            <LayoutContext.Provider value={{ siderHook: this.getSiderHook() }}>
+                <Tag className={classString} {...others}>
+                    {children}
+                </Tag>
+            </LayoutContext.Provider>
+        );
+    }
+}
+
+export { Layout };
+export default Layout;

package/layout/layout-context.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { noop } from '@douyinfe/semi-foundation/utils/function';
+
+export interface ContextType{
+    siderHook: {
+        addSider: (id: string) => void;
+        removeSider: (id: string) => void;
+    };
+}
+
+const LayoutContext = React.createContext<ContextType>({
+    siderHook: {
+        addSider: noop,
+        removeSider: noop,
+    },
+});
+
+export default LayoutContext;

package/lib/cjs/_base/base.css

@@ -399,7 +399,7 @@ body, body[theme-mode=dark] .semi-always-light {
   --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
   --semi-color-border: rgba(var(--semi-grey-9), .08);
   --semi-color-nav-bg: rgba(var(--semi-white), 1);
-  --semi-overlay-bg: rgba(22, 22, 26, .6);
+  --semi-color-overlay-bg: rgba(22, 22, 26, .6);
   --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
   --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
   --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
@@ -486,7 +486,7 @@ body[theme-mode=dark], body .semi-always-dark {
   --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
   --semi-color-nav-bg: rgba(35, 36, 41, 1);
   --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
-  --semi-overlay-bg: rgba(22, 22, 26, .6);
+  --semi-color-overlay-bg: rgba(22, 22, 26, .6);
   --semi-color-fill-0: rgba(var(--semi-white), .05);
   --semi-color-fill-1: rgba(var(--semi-white), .09);
   --semi-color-fill-2: rgba(var(--semi-white), .13);

package/lib/cjs/button/Button.d.ts

@@ -7,6 +7,7 @@ export declare type Size = 'default' | 'small' | 'large';
 export declare type Theme = 'solid' | 'borderless' | 'light';
 export declare type Type = 'primary' | 'secondary' | 'tertiary' | 'warning' | 'danger';
 export interface ButtonProps {
+    id?: string;
     block?: boolean;
     circle?: boolean;
     disabled?: boolean;

package/lib/cjs/button/buttonGroup.js

@@ -1,7 +1,11 @@
 "use strict";
 
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
 
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
 
 _Object$defineProperty(exports, "__esModule", {
@@ -20,7 +24,7 @@ var _isArray = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-st
 
 var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
 
@@ -30,6 +34,10 @@ var _constants = require("@douyinfe/semi-foundation/lib/cjs/button/constants");
 
 require("@douyinfe/semi-foundation/lib/cjs/button/button.css");
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
 
@@ -60,13 +68,13 @@ class ButtonGroup extends _baseComponent.default {
     if (children) {
       var _context;
 
-      inner = (0, _map.default)(_context = (0, _isArray.default)(children) ? children : [children]).call(_context, (itm, index) => /*#__PURE__*/_react.default.cloneElement(itm, (0, _assign.default)((0, _assign.default)((0, _assign.default)({
+      inner = (0, _map.default)(_context = (0, _isArray.default)(children) ? children : [children]).call(_context, (itm, index) => /*#__PURE__*/(0, _react.isValidElement)(itm) ? /*#__PURE__*/(0, _react.cloneElement)(itm, (0, _assign.default)((0, _assign.default)((0, _assign.default)({
         disabled,
         size,
         type
       }, itm.props), rest), {
         key: index
-      })));
+      })) : itm);
     }
 
     return /*#__PURE__*/_react.default.createElement("div", {

package/lib/cjs/cascader/item.js

@@ -83,6 +83,11 @@ class Item extends _react.PureComponent {
       } = this.props; // Prevent Checkbox's click event bubbling to trigger the li click event
 
       e.stopPropagation();
+
+      if (e.nativeEvent && typeof e.nativeEvent.stopImmediatePropagation === 'function') {
+        e.nativeEvent.stopImmediatePropagation();
+      }
+
       onItemCheckboxClick(item);
     };
 

package/lib/cjs/checkbox/checkbox.js

@@ -108,7 +108,8 @@ class Checkbox extends _baseComponent.default {
       onMouseEnter,
       onMouseLeave,
       extra,
-      value
+      value,
+      id
     } = this.props;
     const {
       checked
@@ -148,6 +149,7 @@ class Checkbox extends _baseComponent.default {
       ["".concat(prefix, "-cardType_disabled")]: props.disabled && props.isCardType,
       ["".concat(prefix, "-cardType_unDisabled")]: !(props.disabled && props.isCardType),
       ["".concat(prefix, "-cardType_checked")]: props.isCardType && props.checked && !props.disabled,
+      ["".concat(prefix, "-cardType_checked_disabled")]: props.isCardType && props.checked && props.disabled,
       [className]: Boolean(className)
     });
     const extraCls = (0, _classnames.default)("".concat(prefix, "-extra"), {
@@ -164,6 +166,7 @@ class Checkbox extends _baseComponent.default {
     return /*#__PURE__*/_react.default.createElement("span", {
       style: style,
       className: wrapper,
+      id: id,
       onMouseEnter: onMouseEnter,
       onMouseLeave: onMouseLeave,
       onClick: this.handleChange

package/lib/cjs/checkbox/checkboxGroup.d.ts

@@ -18,6 +18,7 @@ export declare type CheckboxGroupProps = {
     style?: React.CSSProperties;
     className?: string;
     type?: CheckboxType;
+    id?: string;
 };
 export declare type CheckboxGroupState = {
     value?: any[];

package/lib/cjs/checkbox/checkboxGroup.js

@@ -91,6 +91,7 @@ class CheckboxGroup extends _baseComponent.default {
       prefixCls,
       direction,
       className,
+      id,
       style,
       type
     } = this.props;
@@ -140,7 +141,8 @@ class CheckboxGroup extends _baseComponent.default {
 
     return /*#__PURE__*/_react.default.createElement("div", {
       className: prefixClsDisplay,
-      style: style
+      style: style,
+      id: id
     }, /*#__PURE__*/_react.default.createElement(_context7.Context.Provider, {
       value: {
         checkboxGroup: {

package/lib/cjs/form/baseForm.d.ts

@@ -53,6 +53,7 @@ declare class Form extends BaseComponent<BaseFormProps, BaseFormState> {
     static TextArea: React.ComponentType<import("utility-types").Subtract<Omit<import("../input").TextAreaProps, "forwardRef"> & React.RefAttributes<HTMLTextAreaElement>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
     static InputNumber: React.ComponentType<import("utility-types").Subtract<import("../inputNumber").InputNumberProps & React.RefAttributes<HTMLInputElement>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
     static Select: React.ComponentType<import("utility-types").Subtract<{
+        id?: string;
         autoFocus?: boolean;
         arrowIcon?: React.ReactNode;
         defaultValue?: string | number | any[] | Record<string, any>;

package/lib/cjs/form/field.d.ts

@@ -3,6 +3,7 @@ declare const FormInput: import("react").ComponentType<import("utility-types").S
 declare const FormInputNumber: import("react").ComponentType<import("utility-types").Subtract<import("../inputNumber/index").InputNumberProps & import("react").RefAttributes<HTMLInputElement>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
 declare const FormTextArea: import("react").ComponentType<import("utility-types").Subtract<Omit<import("../input/textarea").TextAreaProps, "forwardRef"> & import("react").RefAttributes<HTMLTextAreaElement>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
 declare const FormSelect: import("react").ComponentType<import("utility-types").Subtract<{
+    id?: string;
     autoFocus?: boolean;
     arrowIcon?: import("react").ReactNode;
     defaultValue?: string | number | any[] | Record<string, any>;

package/lib/cjs/form/hoc/withField.js

@@ -107,7 +107,9 @@ function withField(Component, opts) {
     // Return without injection, eg: <Checkbox> / <Radio> inside CheckboxGroup/RadioGroup
 
     if (!shouldInject) {
-      return /*#__PURE__*/_react.default.createElement(Component, (0, _assign.default)({}, rest));
+      return /*#__PURE__*/_react.default.createElement(Component, (0, _assign.default)({}, rest, {
+        ref: ref
+      }));
     } // grab formState from context
 
 

package/lib/cjs/modal/Modal.d.ts

@@ -3,7 +3,7 @@ import ModalFoundation, { ModalAdapter, ModalProps, ModalState } from '@douyinfe
 import PropTypes from 'prop-types';
 import '@douyinfe/semi-foundation/lib/cjs/modal/modal.css';
 import BaseComponent from '../_base/baseComponent';
-import useModal from '../modal/useModal';
+import useModal from './useModal';
 import { ButtonProps } from '../button/Button';
 export declare const destroyFns: any[];
 export declare type ConfirmType = 'leftTop' | 'leftBottom' | 'rightTop' | 'rightBottom';
@@ -30,8 +30,8 @@ declare class Modal extends BaseComponent<ModalReactProps, ModalState> {
         closable: PropTypes.Requireable<boolean>;
         centered: PropTypes.Requireable<boolean>;
         visible: PropTypes.Requireable<boolean>;
-        width: PropTypes.Requireable<number>;
-        height: PropTypes.Requireable<number>;
+        width: PropTypes.Requireable<string | number>;
+        height: PropTypes.Requireable<string | number>;
         confirmLoading: PropTypes.Requireable<boolean>;
         cancelLoading: PropTypes.Requireable<boolean>;
         okText: PropTypes.Requireable<string>;
@@ -101,23 +101,23 @@ declare class Modal extends BaseComponent<ModalReactProps, ModalState> {
     static getScrollbarWidth(): number;
     static info: (props: ModalReactProps) => {
         destroy: () => void;
-        update: (newConfig: import("../modal/confirm").ConfirmProps) => void;
+        update: (newConfig: import("./confirm").ConfirmProps) => void;
     };
     static success: (props: ModalReactProps) => {
         destroy: () => void;
-        update: (newConfig: import("../modal/confirm").ConfirmProps) => void;
+        update: (newConfig: import("./confirm").ConfirmProps) => void;
     };
     static error: (props: ModalReactProps) => {
         destroy: () => void;
-        update: (newConfig: import("../modal/confirm").ConfirmProps) => void;
+        update: (newConfig: import("./confirm").ConfirmProps) => void;
     };
     static warning: (props: ModalReactProps) => {
         destroy: () => void;
-        update: (newConfig: import("../modal/confirm").ConfirmProps) => void;
+        update: (newConfig: import("./confirm").ConfirmProps) => void;
     };
     static confirm: (props: ModalReactProps) => {
         destroy: () => void;
-        update: (newConfig: import("../modal/confirm").ConfirmProps) => void;
+        update: (newConfig: import("./confirm").ConfirmProps) => void;
     };
     static destroyAll: () => void;
     componentDidMount(): void;