mh-rn-component/module/Toast/useToast.js

function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React, { createContext, useState, useMemo, useContext, useCallback } from 'react';
import Toast from './index';
// 创建一个createContext
const ToastContext = /*#__PURE__*/createContext({
  toastList: {},
  visibleToasts: {},
  setToast: () => {},
  hideToast: () => {},
  hideAll: () => {},
  loading: () => {}
}); // 组件调用Context

const CustomToast = () => {
  const {
    toastList,
    visibleToasts,
    hideToast
  } = useContext(ToastContext);

  const toastListIds = () => {
    return Object.keys(visibleToasts);
  };

  return /*#__PURE__*/React.createElement(React.Fragment, null, toastListIds().map(id => {
    return /*#__PURE__*/React.createElement(Toast, _extends({
      key: id,
      onChange: () => hideToast(id),
      show: visibleToasts[id]
    }, toastList[id]));
  }));
}; // 组件调用Context


export const ToastProvider = _ref => {
  let {
    children
  } = _ref;
  const [toastList, setToastList] = useState({});
  const [visibleToasts, setVisibleToasts] = useState({});
  const toastIndex = React.useRef(7000);
  const hideToast = useCallback(id => {
    setVisibleToasts(prev => {
      return { ...prev,
        [id]: false
      };
    });
  }, [setVisibleToasts]);
  const hideAll = useCallback(() => {
    setVisibleToasts({});
  }, [setVisibleToasts]);
  const setToast = useCallback(props => {
    const {
      id = toastIndex.current++,
      ...rest
    } = props;
    setToastList(prev => {
      return { ...prev,
        [id]: {
          id,
          ...rest
        }
      };
    });
    setVisibleToasts(prev => {
      return { ...prev,
        [id]: true
      };
    });
    return id;
  }, [toastList, visibleToasts, hideToast]);
  const loading = useCallback(props => {
    const {
      id = toastIndex.current++,
      ...rest
    } = props;
    setToastList(prev => {
      return { ...prev,
        [id]: {
          id,
          icon: "loading1",
          duration: 0,
          loading: true,
          ...rest
        }
      };
    });
    setVisibleToasts(prev => {
      return { ...prev,
        [id]: true
      };
    });
    return id;
  }, [toastList, visibleToasts, hideToast]);
  const contextValue = useMemo(() => {
    return {
      toastList,
      visibleToasts,
      setToast,
      hideToast,
      hideAll,
      loading
    };
  }, [toastList, visibleToasts, setToast, hideToast, hideAll, loading]);
  return /*#__PURE__*/React.createElement(ToastContext.Provider, {
    value: contextValue
  }, children, /*#__PURE__*/React.createElement(CustomToast, null));
};
export const useToast = () => {
  const {
    setToast,
    hideToast,
    hideAll,
    loading
  } = React.useContext(ToastContext);
  const toast = useMemo(() => ({
    show: setToast,
    close: hideToast,
    closeAll: hideAll,
    loading: loading
  }), [setToast, hideToast, hideAll, loading]);
  return toast;
}; //!这部分和ref相关的

export const ToastRef = /*#__PURE__*/React.createRef();
export const _Toast = {
  show: props => {
    var _ToastRef$current;

    return (_ToastRef$current = ToastRef.current) === null || _ToastRef$current === void 0 ? void 0 : _ToastRef$current.show(props);
  },
  close: id => {
    var _ToastRef$current2;

    return (_ToastRef$current2 = ToastRef.current) === null || _ToastRef$current2 === void 0 ? void 0 : _ToastRef$current2.close(id);
  },
  closeAll: () => {
    var _ToastRef$current3;

    return (_ToastRef$current3 = ToastRef.current) === null || _ToastRef$current3 === void 0 ? void 0 : _ToastRef$current3.closeAll();
  },
  loading: props => {
    var _ToastRef$current4;

    return (_ToastRef$current4 = ToastRef.current) === null || _ToastRef$current4 === void 0 ? void 0 : _ToastRef$current4.show(props);
  } // isActive: (id: any) => ToastRef.current?.isActive(id),

};
//# sourceMappingURL=useToast.js.map