UNPKG

@massds/mayflower-react

Version:

React versions of Mayflower design system UI components

52 lines 2.25 kB
const _excluded = ["children", "onClick", "onKeyDown", "stacked", "align", "className"]; function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; } /** * GenTeaserContainer module. * @module @massds/mayflower-react/GenTeaserContainer * @requires module:@massds/mayflower-assets/scss/03-organisms/gen-teaser */ import React from "react"; import classNames from "classnames"; import PropTypes from "prop-types"; const GenTeaserContainer = props => { var _classNames; const children = props.children, onClick = props.onClick, onKeyDown = props.onKeyDown, stacked = props.stacked, align = props.align, className = props.className, rest = _objectWithoutPropertiesLoose(props, _excluded); const teaserClasses = classNames((_classNames = { 'ma__gen-teaser': true, 'ma__gen-teaser--clickable': onClick, 'ma__gen-teaser--stacked': stacked }, _classNames["ma__gen-teaser--align-" + align] = align, _classNames["" + className] = !!className, _classNames)); const role = onClick ? 'button' : null; return ( /*#__PURE__*/ // eslint-disable-next-line jsx-a11y/no-static-element-interactions React.createElement("section", _extends({ className: teaserClasses, onClick: onClick, onKeyDown: onKeyDown, role: role }, rest), children) ); }; GenTeaserContainer.propTypes = process.env.NODE_ENV !== "production" ? { /** A custom on click function */ onClick: PropTypes.func, /** A custom on key down function */ onKeyDown: PropTypes.func, /** React children to render */ children: PropTypes.node, /** whether to stack image on top */ stacked: PropTypes.bool, /** alignment for description relative to image */ align: PropTypes.oneOf(['top', 'center']), /** A custom class. */ className: PropTypes.string } : {}; export default GenTeaserContainer;