@pantheon-systems/design-toolkit-react/dist/ExpandableSection/ExpandableSectionHeader.js

Pantheon's React Design Toolkit

import _defineProperty from '@babel/runtime/helpers/defineProperty';
import PropTypes from 'prop-types';
import { jsx } from 'react/jsx-runtime';

var sizes = {
  none: '0',
  small: '0.5rem',
  medium: '1rem',
  large: '1.5rem'
};
var locations = {
  'block-end': 'marginBlockEnd'
};
var ExpandableSectionHeader = function ExpandableSectionHeader(_ref) {
  var children = _ref.children,
    id = _ref.id,
    isShown = _ref.isShown,
    spacing = _ref.spacing,
    toggleContent = _ref.toggleContent;
  var location = spacing.location,
    size = spacing.size;
  return /*#__PURE__*/jsx("div", {
    "aria-expanded": isShown,
    className: "flex flex-row cursor-pointer",
    id: id,
    onClick: function onClick() {
      return toggleContent(!isShown);
    },
    onKeyDown: function onKeyDown() {},
    role: "button",
    style: _defineProperty({}, locations[location], sizes[size]),
    tabIndex: "0",
    children: children
  });
};
ExpandableSectionHeader.defaultProps = {
  spacing: {
    location: 'block-end',
    size: 'small'
  }
};
ExpandableSectionHeader.propTypes = {
  children: PropTypes.node.isRequired,
  id: PropTypes.string.isRequired,
  isShown: PropTypes.bool.isRequired,
  spacing: PropTypes.shape({
    location: PropTypes.oneOf(['block-end']),
    size: PropTypes.oneOf(['none', 'small', 'medium', 'large'])
  }),
  toggleContent: PropTypes.func.isRequired
};
var ExpandableSectionHeader$1 = ExpandableSectionHeader;

export { ExpandableSectionHeader$1 as default };
//# sourceMappingURL=ExpandableSectionHeader.js.map