@coreui/react/dist/esm/components/alert/CAlert.js

UI Components Library for React.js

import { __rest } from '../../node_modules/tslib/tslib.es6.js';
import React, { forwardRef, useRef, useState, useEffect } from 'react';
import PropTypes from 'prop-types';
import classNames from '../../_virtual/index.js';
import { CCloseButton } from '../close-button/CCloseButton.js';
import { useForkedRef } from '../../hooks/useForkedRef.js';
import '@popperjs/core';
import { colorPropType } from '../../props.js';
import Transition from '../../node_modules/react-transition-group/esm/Transition.js';

const CAlert = forwardRef((_a, ref) => {
    var { children, ariaCloseLabel = 'Close', className, color = 'primary', dismissible, transition = true, variant, visible = true, onClose, onClosed } = _a, rest = __rest(_a, ["children", "ariaCloseLabel", "className", "color", "dismissible", "transition", "variant", "visible", "onClose", "onClosed"]);
    const alertRef = useRef(null);
    const forkedRef = useForkedRef(ref, alertRef);
    const [_visible, setVisible] = useState(visible);
    useEffect(() => {
        setVisible(visible);
    }, [visible]);
    return (React.createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: alertRef, onExit: onClose, onExited: onClosed, timeout: transition ? 150 : 0, unmountOnExit: true }, (state) => (React.createElement("div", Object.assign({ className: classNames('alert', variant === 'solid' ? `bg-${color} text-white` : `alert-${color}`, {
            'alert-dismissible': dismissible,
            fade: transition,
            show: state === 'entered',
        }, className), role: "alert" }, rest, { ref: forkedRef }),
        children,
        dismissible && (React.createElement(CCloseButton, { "aria-label": ariaCloseLabel, onClick: () => setVisible(false) }))))));
});
CAlert.propTypes = {
    ariaCloseLabel: PropTypes.string,
    children: PropTypes.node,
    className: PropTypes.string,
    color: colorPropType.isRequired,
    dismissible: PropTypes.bool,
    onClose: PropTypes.func,
    onClosed: PropTypes.func,
    transition: PropTypes.bool,
    variant: PropTypes.string,
    visible: PropTypes.bool,
};
CAlert.displayName = 'CAlert';

export { CAlert };
//# sourceMappingURL=CAlert.js.map