tdesign-react/esm/message/MessageComponent.js

TDesign Component for React

/**
 * tdesign v1.15.1
 * (c) 2025 tdesign
 * @license MIT
 */

import { _ as _slicedToArray } from '../_chunks/dep-48805ab8.js';
import React, { useState, useEffect } from 'react';
import classNames from 'classnames';
import MessageClose from './MessageClose.js';
import MessageIcon from './MessageIcon.js';
import { useMessageClass } from './useMessageClass.js';
import { usePersistFn } from '../hooks/usePersistFn.js';
import noop from '../_util/noop.js';
import '../_chunks/dep-026a4c6b.js';
import 'tdesign-icons-react';
import '../hooks/useGlobalIcon.js';
import '../hooks/useConfig.js';
import '../config-provider/ConfigContext.js';
import '../_chunks/dep-cb0a3966.js';
import '../_chunks/dep-eca3a3de.js';
import 'lodash-es';
import '../locale/zh_CN.js';
import '../_chunks/dep-e29214cb.js';
import 'dayjs';
import '../_chunks/dep-3c9ab31a.js';
import '../loading/index.js';
import '../loading/Loading.js';
import '../_chunks/dep-3a09424a.js';
import '../common/Portal.js';
import 'react-dom';
import '../hooks/useLayoutEffect.js';
import '../loading/gradient.js';
import '../_chunks/dep-c48e2ca1.js';
import '../_chunks/dep-1630b9b4.js';
import '../_chunks/dep-87d110df.js';
import '../_chunks/dep-6b660ef0.js';
import '../hooks/useDomRefCallback.js';
import '../loading/defaultProps.js';
import '../hooks/useDefaultProps.js';
import '../loading/plugin.js';
import '../_util/react-render.js';
import '../_chunks/dep-a74cc5e4.js';
import '../common/PluginContainer.js';
import '../config-provider/index.js';
import '../config-provider/ConfigProvider.js';
import '../config-provider/type.js';
import '../loading/style/index.js';
import '../loading/type.js';

var MessageComponent = function MessageComponent(props) {
  var _useMessageClass = useMessageClass(),
    tdMessagePrefix = _useMessageClass.tdMessagePrefix,
    tdClassIsGenerator = _useMessageClass.tdClassIsGenerator;
  var _props$theme = props.theme,
    theme = _props$theme === void 0 ? "info" : _props$theme,
    className = props.className,
    children = props.children,
    style = props.style,
    _props$icon = props.icon,
    icon = _props$icon === void 0 ? true : _props$icon,
    content = props.content,
    closeBtn = props.closeBtn,
    _props$onCloseBtnClic = props.onCloseBtnClick,
    onCloseBtnClick = _props$onCloseBtnClic === void 0 ? noop : _props$onCloseBtnClic,
    _props$onDurationEnd = props.onDurationEnd,
    onDurationEnd = _props$onDurationEnd === void 0 ? noop : _props$onDurationEnd,
    _props$onClose = props.onClose,
    onClose = _props$onClose === void 0 ? noop : _props$onClose,
    duration = props.duration;
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    isHovering = _useState2[0],
    setIsHovering = _useState2[1];
  var onCloseFn = usePersistFn(onClose);
  var onDurationEndFn = usePersistFn(onDurationEnd);
  var onCloseBtnClickFn = usePersistFn(onCloseBtnClick);
  function handleCloseBtnClick(e) {
    onCloseBtnClickFn(e);
    onCloseFn({
      trigger: "close-click"
    });
  }
  useEffect(function () {
    if (!isHovering && duration > 0) {
      var timer = setTimeout(function () {
        onDurationEndFn();
        onCloseFn({
          trigger: "duration-end"
        });
      }, duration);
      return function () {
        clearTimeout(timer);
      };
    }
  }, [duration, isHovering, onCloseFn, onDurationEndFn]);
  return /* @__PURE__ */React.createElement("div", {
    key: "message",
    style: style,
    className: classNames(className, "".concat(tdMessagePrefix), tdClassIsGenerator(theme), closeBtn ? tdClassIsGenerator("closable") : ""),
    onMouseEnter: function onMouseEnter() {
      return setIsHovering(true);
    },
    onMouseLeave: function onMouseLeave() {
      return setIsHovering(false);
    }
  }, icon === true ? /* @__PURE__ */React.createElement(MessageIcon, {
    theme: theme
  }) : icon, content ? content : children, /* @__PURE__ */React.createElement(MessageClose, {
    closeBtn: closeBtn,
    onCloseBtnClick: handleCloseBtnClick
  }));
};

export { MessageComponent as default };
//# sourceMappingURL=MessageComponent.js.map