import './NavigationDrawer_x642ct.css';
import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
import React__default, { forwardRef } from 'react';
import cls from 'classnames';
import { styled } from '@linaria/react';
import { base as base$2 } from './variations/_view/base.js';
import { base as base$1 } from './variations/_size/base.js';
import { Footer, Overlay, Content, base } from './NavigationDrawer.styles.js';
import { classes } from './NavigationDrawer.tokens.js';
import { Section } from './ui/Section/Section.js';

var _excluded = ["opened", "header", "sections", "footer", "withContentLeft", "mode", "onHide", "children"];
var Wrapper = /*#__PURE__*/styled('div')({
  name: "Wrapper",
  "class": "wp29eiz",
  propsAsIs: false
});
var navigationDrawerRoot = function navigationDrawerRoot(Root) {
  return /*#__PURE__*/forwardRef(function (props, ref) {
    var _props$opened = props.opened,
      opened = _props$opened === void 0 ? true : _props$opened,
      header = props.header,
      sections = props.sections,
      footer = props.footer,
      _props$withContentLef = props.withContentLeft,
      withContentLeft = _props$withContentLef === void 0 ? true : _props$withContentLef,
      _props$mode = props.mode,
      mode = _props$mode === void 0 ? 'static' : _props$mode,
      onHide = props.onHide,
      children = props.children,
      rest = _objectWithoutProperties(props, _excluded);
    var isOpen = opened || !withContentLeft;
    var isOverlay = mode === 'overlay' || mode === 'drawer';
    return /*#__PURE__*/React__default.createElement(Root, _extends({
      ref: ref
    }, rest), /*#__PURE__*/React__default.createElement(Wrapper, {
      className: cls(classes.navigationDrawerSidebar, isOverlay && classes.navigationDrawerSidebarOverlay, !isOpen && classes.navigationDrawerSidebarClosed)
    }, header, sections.map(function (_ref, index) {
      var items = _ref.items,
        label = _ref.label,
        hasDivider = _ref.hasDivider;
      return /*#__PURE__*/React__default.createElement(Section, {
        key: index,
        items: items,
        label: label,
        withContentLeft: withContentLeft,
        isOpen: isOpen,
        hasDivider: hasDivider
      });
    }), footer && /*#__PURE__*/React__default.createElement(Footer, null, footer)), mode === 'overlay' && opened && /*#__PURE__*/React__default.createElement(Overlay, {
      onClick: onHide
    }), /*#__PURE__*/React__default.createElement(Content, {
      className: cls(isOverlay && classes.navigationDrawerContentOverlay)
    }, children));
  });
};
var navigationDrawerConfig = {
  name: 'NavigationDrawer',
  tag: 'div',
  layout: navigationDrawerRoot,
  base: base,
  variations: {
    size: {
      css: base$1
    },
    view: {
      css: base$2
    }
  },
  defaults: {
    view: 'default'
  }
};

export { navigationDrawerConfig, navigationDrawerRoot };
