sailboat-design/dist/components/Alert/alert.js

A simple sailboat simulator

var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import classNames from 'classnames';
// import { useTransition } from './hooks';
import Transition from '../Transition';
import Icon from '../Icon/icon';
export var AlertType;
(function (AlertType) {
    AlertType["Success"] = "success";
    AlertType["Danger"] = "danger";
    AlertType["Warning"] = "warning";
    AlertType["Default"] = "default";
})(AlertType || (AlertType = {}));
// 如果类中包含TransitionState.EXITED 则不会显示
// function hasExited()
/**
 * 一个警告提示组件展示了一段简短且重要的信息，在不影响用户操作的同时能够吸引用户的注意力。
 * ### 引用方法
 * ~~~js
 * import { Alert } from '@sailboat';
 * ~~~
 * * 警告提示有四种不同程度的级别，每种都有自己独特的颜色。
 * * title, description 可以是一个 React.ReactElement，也可以是一个字符串。
 */
export var Alert = function (props) {
    var _a;
    var className = props.className, type = props.type, title = props.title, description = props.description, showCloseIcon = props.showCloseIcon, open = props.open, autoHideDuration = props.autoHideDuration, onClose = props.onClose;
    var baseClasses = classNames('alert', className, (_a = {},
        _a["alert-".concat(type)] = type,
        _a));
    var handleClose = function (e) {
        e.preventDefault();
        onClose();
    };
    return (_jsx(Transition, __assign({ in: open, animation: "zoom-in-top", timeout: 300 }, { children: _jsxs("div", __assign({ className: baseClasses }, { children: [_jsxs("div", __assign({ className: "alert-container" }, { children: [_jsx("div", __assign({ className: "alert-title" }, { children: title })), description && _jsx("div", __assign({ className: "alert-desc" }, { children: description }))] })), showCloseIcon && (_jsx("div", __assign({ className: "alert-close", onClick: handleClose }, { children: _jsx(Icon, { icon: "close" }) })))] })) })));
};
Alert.defaultProps = {
    type: AlertType.Default,
    showCloseIcon: true,
    description: '',
    autoHideDuration: 0,
    onClose: function () { }
};
export default Alert;