UNPKG

@massds/mayflower-react

Version:

React versions of Mayflower design system UI components

79 lines (63 loc) 3.07 kB
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } /** * ButtonAlert module. * @module @massds/mayflower-react/ButtonAlert * @requires module:@massds/mayflower-assets/scss/01-atoms/button-with-icon * @requires module:@massds/mayflower-assets/scss/01-atoms/button-search * @requires module:@massds/mayflower-assets/scss/01-atoms/input-typeahead * @requires module:@massds/mayflower-assets/scss/01-atoms/svg-icons * @requires module:@massds/mayflower-assets/scss/01-atoms/svg-loc-icons */ import React from "react"; import PropTypes from "prop-types"; import classNames from "classnames"; import ButtonWithIcon from "../ButtonWithIcon/index.mjs"; // eslint-disable-next-line import/no-unresolved import IconChevron from "../Icon/IconChevron.mjs"; const ButtonAlert = props => { var _classNames; const text = props.text, hideText = props.hideText, showText = props.showText, classes = props.classes, isOpen = props.isOpen, rest = _objectWithoutPropertiesLoose(props, ["text", "hideText", "showText", "classes", "isOpen"]); const buttonClasses = classNames((_classNames = { 'ma__button-alert': true }, _classNames["" + classes] = classes && classes.length > 0, _classNames['is-open'] = isOpen, _classNames)); const buttonProps = _extends({ classes: [buttonClasses], expanded: isOpen, text: isOpen ? hideText + " " + text : showText + " " + text, usage: 'alert', icon: /*#__PURE__*/React.createElement(IconChevron, { height: 10, width: 10 }) }, rest); return /*#__PURE__*/React.createElement(ButtonWithIcon, buttonProps); }; ButtonAlert.propTypes = process.env.NODE_ENV !== "production" ? { /** The text that will display on the button alert. */ text: PropTypes.string, /** Optional class(es) to pass to the button alert */ classes: PropTypes.string, /** An optional onClick function */ onClick: PropTypes.func, /** Text for showing alert */ showText: PropTypes.string.isRequired, /** Text for hiding alert */ hideText: PropTypes.string.isRequired, /** Adds is-open class to button if true. */ isOpen: PropTypes.bool, /** HTML `<button>` 'type' attribute */ type: PropTypes.oneOf(['submit', 'reset', 'button', '']), /** Theme of the button */ theme: PropTypes.oneOf(['', 'c-primary', 'c-highlight', 'c-gray-dark', 'c-black']) } : {}; ButtonAlert.defaultProps = { isOpen: false, type: 'button', theme: 'c-black' }; export default ButtonAlert;