UNPKG

@coreui/react

Version:

UI Components Library for React.js

45 lines (41 loc) 2.23 kB
'use strict'; var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js'); var React = require('react'); var PropTypes = require('prop-types'); var index = require('../../_virtual/index.js'); var CCloseButton = require('../close-button/CCloseButton.js'); var useForkedRef = require('../../hooks/useForkedRef.js'); require('@popperjs/core'); var props = require('../../props.js'); var Transition = require('../../node_modules/react-transition-group/esm/Transition.js'); const CAlert = React.forwardRef((_a, ref) => { var { children, ariaCloseLabel = 'Close', className, color = 'primary', dismissible, transition = true, variant, visible = true, onClose, onClosed } = _a, rest = tslib_es6.__rest(_a, ["children", "ariaCloseLabel", "className", "color", "dismissible", "transition", "variant", "visible", "onClose", "onClosed"]); const alertRef = React.useRef(null); const forkedRef = useForkedRef.useForkedRef(ref, alertRef); const [_visible, setVisible] = React.useState(visible); React.useEffect(() => { setVisible(visible); }, [visible]); return (React.createElement(Transition.default, { in: _visible, mountOnEnter: true, nodeRef: alertRef, onExit: onClose, onExited: onClosed, timeout: transition ? 150 : 0, unmountOnExit: true }, (state) => (React.createElement("div", Object.assign({ className: index.default('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.CCloseButton, { "aria-label": ariaCloseLabel, onClick: () => setVisible(false) })))))); }); CAlert.propTypes = { ariaCloseLabel: PropTypes.string, children: PropTypes.node, className: PropTypes.string, color: props.colorPropType.isRequired, dismissible: PropTypes.bool, onClose: PropTypes.func, onClosed: PropTypes.func, transition: PropTypes.bool, variant: PropTypes.string, visible: PropTypes.bool, }; CAlert.displayName = 'CAlert'; exports.CAlert = CAlert; //# sourceMappingURL=CAlert.js.map