@fruits-chain/react-native-xiaoshu/lib/commonjs/toast/toast.js

🌈 React Native UI library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _iconsReactNative = require("@fruits-chain/icons-react-native");
var _isNil = _interopRequireDefault(require("lodash/isNil"));
var _react = _interopRequireWildcard(require("react"));
var _reactNative = require("react-native");
var _loadingCircular = _interopRequireDefault(require("../loading/loading-circular.js"));
var _loadingSpinner = _interopRequireDefault(require("../loading/loading-spinner.js"));
var _popup = _interopRequireDefault(require("../popup/popup.js"));
var _index = _interopRequireDefault(require("../theme/index.js"));
var _style = require("./style.js");
var _jsxRuntime = require("react/jsx-runtime");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const Toast = /*#__PURE__*/(0, _react.forwardRef)(({
  theme,
  type,
  position = 'middle',
  message,
  overlay = false,
  forbidPress = false,
  closeOnPress = false,
  closeOnPressOverlay = false,
  loadingType = 'spinner',
  duration = 2000,
  icon,
  ...resetProps
}, ref) => {
  const [CV, STYLES] = _index.default.useStyle({
    varCreator: _style.varCreator,
    styleCreator: _style.styleCreator,
    theme
  });
  const [show, setShow] = (0, _react.useState)(false);
  const [msg, setMsg] = (0, _react.useState)(message);

  // 修正数据
  if (closeOnPress) {
    // 是否在点击后关闭
    // 是否禁止背景点击
    // 可以触发点击的地方正好被背景 View 挡住
    forbidPress = false;
  }

  /**
   * 点击遮罩层
   */
  const onPressOverlay = () => {
    // 是否在点击遮罩层后关闭
    if (closeOnPressOverlay) {
      setShow(false);
    }
  };

  /**
   * 点击内容
   */
  const onPressContent = () => {
    // 是否在点击后关闭
    if (closeOnPress) {
      setShow(false);
    }
  };
  (0, _react.useEffect)(() => {
    setShow(true);
    let timer;
    if (duration !== 0) {
      timer = setTimeout(() => {
        // 隐藏弹窗
        setShow(false);
      }, duration);
    }
    return () => {
      clearTimeout(timer);
    };
  }, [duration]);

  // 向外暴露方法
  (0, _react.useImperativeHandle)(ref, () => ({
    close: () => {
      setShow(false);
    },
    setMessage: s => {
      setMsg(s);
    }
  }), []);
  const toastStyles = [STYLES.toast, {
    justifyContent: position === 'top' ? 'flex-start' : position === 'bottom' ? 'flex-end' : 'center'
  }];
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_popup.default, {
    ...resetProps,
    visible: show,
    overlay: overlay,
    onPressOverlay: onPressOverlay,
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableWithoutFeedback, {
      onPress: onPressContent,
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
        style: toastStyles,
        pointerEvents: forbidPress ? undefined : 'box-none',
        collapsable: false,
        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
          style: [STYLES.inner, type === 'text' ? STYLES.inner_type_text : null],
          children: [type !== 'text' ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
            style: STYLES.icon,
            children: [type === 'loading' ? loadingType === 'circular' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_loadingCircular.default, {
              color: CV.toast_icon_color,
              size: CV.toast_icon_size
            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_loadingSpinner.default, {
              color: CV.toast_icon_color,
              size: CV.toast_icon_size
            }) : null, type === 'success' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconsReactNative.SuccessCircleOutline, {
              color: CV.toast_icon_color,
              size: CV.toast_icon_size
            }) : null, type === 'fail' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconsReactNative.CrossCircleOutline, {
              color: CV.toast_icon_color,
              size: CV.toast_icon_size
            }) : null, type === 'icon' ? icon : null]
          }) : null, !(0, _isNil.default)(msg) && msg !== '' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
            style: [STYLES.text, type === 'text' ? STYLES.text_top_0 : null],
            children: msg
          }) : null]
        })
      })
    })
  });
});
var _default = exports.default = /*#__PURE__*/(0, _react.memo)(Toast);
//# sourceMappingURL=toast.js.map