pure-styled-components/dist/components/Menu/Dropdown.js

Styled Component design system based on Pure CSS for React/Preact

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _styledComponents = _interopRequireDefault(require("styled-components"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

const showDropdown = ({
  active
}) => {
  if (active) {
    return `display:block;`;
  }

  return ``;
};

function BaseDropdown({
  className,
  children
}) {
  return _react.default.createElement("nav", {
    className: `dropdown ${className}`
  }, children);
}

BaseDropdown.propTypes = {
  /**
   * Class provided by Styled Components
   */
  className: _propTypes.default.string.isRequired,

  /**
   * Child components (array or single element)
   */
  children: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.node), _propTypes.default.node]).isRequired
};
/**
 * Dropdown used in `<Menu>` component
 *
 * @param {*} { className, children }
 */

const Dropdown = (0, _styledComponents.default)(BaseDropdown)`
  display: none;
  position: absolute;
  left: 100%;
  top: 0;
  margin: 0;
  padding: 0;
  z-index: 3;

  ${props => showDropdown(props)};
`;
/** @component */

var _default = Dropdown;
exports.default = _default;
//# sourceMappingURL=Dropdown.js.map