@coreui/react
Version:
UI Components Library for React.js
39 lines (36 loc) • 2.1 kB
JavaScript
import { __rest, __assign } 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';
var CAlert = forwardRef(function (_a, ref) {
var children = _a.children, className = _a.className, _b = _a.color, color = _b === void 0 ? 'primary' : _b, dismissible = _a.dismissible, variant = _a.variant, _c = _a.visible, visible = _c === void 0 ? true : _c, onClose = _a.onClose, rest = __rest(_a, ["children", "className", "color", "dismissible", "variant", "visible", "onClose"]);
var alertRef = useRef(null);
var forkedRef = useForkedRef(ref, alertRef);
var _d = useState(visible), _visible = _d[0], setVisible = _d[1];
useEffect(function () {
setVisible(visible);
}, [visible]);
return (React.createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: alertRef, onExit: onClose, timeout: 150, unmountOnExit: true }, function (state) { return (React.createElement("div", __assign({ className: classNames('alert', variant === 'solid' ? "bg-".concat(color, " text-white") : "alert-".concat(color), {
'alert-dismissible fade': dismissible,
show: state === 'entered',
}, className), role: "alert" }, rest, { ref: forkedRef }),
children,
dismissible && React.createElement(CCloseButton, { onClick: function () { return setVisible(false); } }))); }));
});
CAlert.propTypes = {
children: PropTypes.node,
className: PropTypes.string,
color: colorPropType.isRequired,
dismissible: PropTypes.bool,
onClose: PropTypes.func,
variant: PropTypes.string,
visible: PropTypes.bool,
};
CAlert.displayName = 'CAlert';
export { CAlert };
//# sourceMappingURL=CAlert.js.map