@nutui/nutui-react-taro/dist/esm/notify.taro-BVXg7xTI.js

京东风格的轻量级移动端 React 组件库，支持一套代码生成 H5 和小程序

import React__default, { useState, useRef, useEffect } from "react";
import classNames from "classnames";
import { CSSTransition } from "react-transition-group";
import { C as ComponentDefaults } from "./typings-DV9RBfhj.js";
import { u as useCustomEvent, a as useCustomEventsPath, c as customEvents } from "./use-custom-event-DuP4onEm.js";
import { m as mergeProps } from "./merge-props-2rRqFlJz.js";
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { id: "", duration: 3e3, type: "danger", position: "top", visible: false, onClose: () => {
}, onClick: () => {
} });
const classPrefix = "nut-notify";
const Notify = (props) => {
  const { id, children, style, type, className, position, visible, duration, onClose, onClick } = mergeProps(defaultProps, props);
  useCustomEvent(id, (status) => {
    status ? show() : hide();
  });
  let timer;
  const [showNotify, setShowNotify] = useState(false);
  const cssRef = useRef(null);
  useEffect(() => {
    if (visible) {
      show();
    } else {
      hide();
    }
  }, [visible]);
  const clickHandle = () => {
    onClick();
  };
  const show = () => {
    setShowNotify(true);
    clearTimer();
    if (duration) {
      timer = window.setTimeout(() => {
        hide();
      }, duration);
    }
  };
  const clearTimer = () => {
    if (timer) {
      clearTimeout(timer);
      timer = null;
    }
  };
  const hide = () => {
    setShowNotify(false);
    onClose();
  };
  const classes = classNames({
    [`${classPrefix}-popup-top`]: position === "top",
    [`${classPrefix}-popup-bottom`]: position === "bottom",
    [`${classPrefix}`]: true,
    [`${classPrefix}-${type}`]: true
  });
  return React__default.createElement(
    React__default.Fragment,
    null,
    React__default.createElement(
      CSSTransition,
      { nodeRef: cssRef, in: showNotify, timeout: 300, classNames: "fade", unmountOnExit: true, appear: true, position, id },
      React__default.createElement("div", { className: `${classes} ${className}`, style, onClick: clickHandle }, children)
    )
  );
};
function open(selector) {
  const path = useCustomEventsPath(selector);
  customEvents.trigger(path, true);
}
function close(selector) {
  const path = useCustomEventsPath(selector);
  customEvents.trigger(path, false);
}
Notify.displayName = "NutNotify";
Notify.open = open;
Notify.close = close;
export {
  Notify as N
};