@momentum-ui/react-collaboration
Version:
Cisco Momentum UI Framework for React Collaboration Applications
79 lines • 3.73 kB
JavaScript
/** @component alert-banner */
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);
};
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
import React from 'react';
import PropTypes from 'prop-types';
import { Icon } from '@momentum-ui/react-collaboration';
/**
* @deprecated - Components in the legacy folder (/src/legacy) are deprecated. Please use a component from the components folder (/src/components) instead. Legacy components may not follow accessibility standards.
**/
var AlertBanner = function (props) {
var className = props.className, closable = props.closable, closeBtnProps = props.closeBtnProps, children = props.children, onHide = props.onHide, onKeyDownClose = props.onKeyDownClose, show = props.show, type = props.type, otherProps = __rest(props, ["className", "closable", "closeBtnProps", "children", "onHide", "onKeyDownClose", "show", "type"]);
var handleKeyDown = function (e) {
if (e.which === 32 || e.charCode === 32 || e.which === 13 || e.charCode === 13) {
onHide && onHide(e);
e.preventDefault();
}
onKeyDownClose && onKeyDownClose(e);
};
return (show && (React.createElement("div", __assign({ className: "md-alert-banner" +
" md-alert-banner--".concat(type) +
"".concat((className && " ".concat(className)) || '') }, otherProps),
React.createElement("div", { className: "md-alert-banner__text" }, children),
closable && (React.createElement("div", __assign({ className: "md-alert-banner__close" }, (onHide && { onClick: function (e) { return onHide(e); } }), ((onHide || onKeyDownClose) && {
onKeyDown: function (e) { return handleKeyDown(e); },
role: 'button',
tabIndex: 0,
}), closeBtnProps),
React.createElement(Icon, { name: "cancel_16" }))))));
};
AlertBanner.defaultProps = {
children: null,
className: '',
closable: false,
closeBtnProps: null,
onKeyDownClose: null,
onHide: null,
type: 'info',
};
AlertBanner.propTypes = {
/** @prop Optional css class string | '' */
className: PropTypes.string,
/** @prop Sets the visibility of AlertBanner's close button | false */
closable: PropTypes.bool,
/** @prop Props to be passed to close button | null */
closeBtnProps: PropTypes.object,
/** @prop Children nodes to render inside AccordionHeader | null */
children: PropTypes.node,
/** @prop Invoked when the user presses on the AlertBanner's close button | null */
onHide: PropTypes.func,
/** @prop Optional callback function invoked on keydown of close button | null */
onKeyDownClose: PropTypes.func,
/** @prop Set AlertBanner visibility */
show: PropTypes.bool.isRequired,
/** @prop Sets the AlertBanner type | 'info' */
type: PropTypes.oneOf(['info', 'warning', 'error']),
};
AlertBanner.displayName = 'AlertBanner';
export default AlertBanner;
//# sourceMappingURL=index.js.map