@itcase/ui 1.0.1

package/dist/components/LanguageSelector.js

@@ -0,0 +1,86 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var index = require('./Icon.js');
+require('react-inlinesvg');
+require('../constants/componentProps/fill.js');
+require('../constants/componentProps/iconSize.js');
+require('../constants/componentProps/shape.js');
+require('../constants/componentProps/strokeColor.js');
+require('./Link.js');
+require('../useStyles-77c3b520.js');
+require('lodash/camelCase');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.js');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('../constants/componentProps/size.js');
+require('../constants/componentProps/textColor.js');
+require('../constants/componentProps/textGradient.js');
+require('../constants/componentProps/textStyle.js');
+require('../constants/componentProps/textWeight.js');
+require('../constants/componentProps/type.js');
+require('../constants/componentProps/underline.js');
+require('../hooks/useDeviceTargetClass.js');
+require('lodash/castArray');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+
+function LanguageSelectorItem(props) {
+  var label = props.label,
+    iconSize = props.iconSize,
+    SvgImage = props.SvgImage,
+    isActive = props.isActive,
+    onClick = props.onClick;
+  return /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default('lang__item', isActive && 'lang__item_state_current'),
+    onClick: onClick
+  }, SvgImage && /*#__PURE__*/React__default.default.createElement(index.Icon, {
+    size: iconSize,
+    SvgImage: SvgImage
+  }), label);
+}
+LanguageSelectorItem.propTypes = {
+  iconSize: PropTypes__default.default.number,
+  isActive: PropTypes__default.default.bool,
+  label: PropTypes__default.default.string,
+  SvgImage: PropTypes__default.default.element,
+  onClick: PropTypes__default.default.func
+};
+function LanguageSelector(props) {
+  var currentLanguage = props.currentLanguage,
+    _props$languagesItems = props.languagesItems,
+    languagesItems = _props$languagesItems === void 0 ? [] : _props$languagesItems,
+    className = props.className,
+    setLanguage = props.setLanguage;
+  return /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default(className, 'lang')
+  }, languagesItems.map(function (languageItem) {
+    return /*#__PURE__*/React__default.default.createElement(LanguageSelectorItem, {
+      iconSize: languageItem.iconSize,
+      isActive: currentLanguage === languageItem.value,
+      key: "languageItem_" + languageItem.value,
+      label: languageItem.label,
+      SvgImage: languageItem.SvgImage,
+      onClick: function onClick() {
+        return setLanguage && setLanguage(languageItem.value);
+      }
+    });
+  }));
+}
+LanguageSelector.propTypes = {
+  className: PropTypes__default.default.string,
+  currentLanguage: PropTypes__default.default.string,
+  languagesItems: PropTypes__default.default.array,
+  setLanguage: PropTypes__default.default.func
+};
+
+exports.LanguageSelector = LanguageSelector;

package/dist/components/Link.js

@@ -0,0 +1,172 @@
+'use strict';
+
+var useStyles = require('../useStyles-77c3b520.js');
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var fill = require('../constants/componentProps/fill.js');
+var size = require('../constants/componentProps/size.js');
+var textColor = require('../constants/componentProps/textColor.js');
+var textGradient = require('../constants/componentProps/textGradient.js');
+var textStyle = require('../constants/componentProps/textStyle.js');
+var textWeight = require('../constants/componentProps/textWeight.js');
+var type = require('../constants/componentProps/type.js');
+var underline = require('../constants/componentProps/underline.js');
+var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
+require('lodash/camelCase');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.js');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('lodash/castArray');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+
+var _excluded = ["children", "Component", "DefaultComponent", "href", "target", "rel"];
+var linkConfig = {
+  LinkComponent: 'a',
+  setLinkComponent: function setLinkComponent(newComponent) {
+    linkConfig.LinkComponent = newComponent;
+  }
+};
+function Link(props) {
+  var after = props.after,
+    before = props.before,
+    children = props.children,
+    className = props.className,
+    LinkComponent = props.LinkComponent,
+    href = props.href,
+    link = props.link,
+    target = props.target,
+    rel = props.rel,
+    text = props.text;
+    props.textGradient;
+    props.textStyle;
+    props.title;
+    var underline = props.underline,
+    onClick = props.onClick,
+    onMouseDown = props.onMouseDown;
+  var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'text_size_',
+    propsKey: 'size'
+  });
+  var textColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'text-color_',
+    propsKey: 'textColor'
+  });
+  var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'fill'
+  });
+  var weightClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'text-weight_',
+    propsKey: 'textWeight'
+  });
+  var textColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'text-color_hover_',
+    propsKey: 'textColorHover'
+  });
+  var textStyleClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'text-style_',
+    propsKey: 'textColorHover'
+  });
+  var textGradientClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'text-gradient_',
+    propsKey: 'textGradient'
+  });
+  var _useStyles = useStyles.useStyles(props),
+    styles = _useStyles.styles;
+  return /*#__PURE__*/React__default.default.createElement(LinkWrapper, {
+    className: clsx__default.default(className, 'link', sizeClass, underline && "link_underline_" + underline, (textColorClass || textColorHoverClass || textGradientClass || textStyleClass || weightClass) && 'text', textColorClass, textColorHoverClass, textGradientClass, textStyleClass, weightClass, fillClass),
+    href: href || link,
+    Component: LinkComponent,
+    rel: rel,
+    style: styles,
+    target: target,
+    onClick: onClick,
+    onMouseDown: onMouseDown
+  }, before, children || text, after);
+}
+Link.propTypes = {
+  after: PropTypes__default.default.any,
+  before: PropTypes__default.default.any,
+  children: PropTypes__default.default.any,
+  className: PropTypes__default.default.string,
+  fill: PropTypes__default.default.oneOf(fill.default),
+  fillDesktop: PropTypes__default.default.oneOf(fill.default),
+  fillMobile: PropTypes__default.default.oneOf(fill.default),
+  fillTablet: PropTypes__default.default.oneOf(fill.default),
+  LinkComponent: PropTypes__default.default.any,
+  href: PropTypes__default.default.string,
+  link: PropTypes__default.default.string,
+  rel: PropTypes__default.default.string,
+  text: PropTypes__default.default.string,
+  target: PropTypes__default.default.string,
+  textColor: PropTypes__default.default.oneOf(textColor.default),
+  textColorMobile: PropTypes__default.default.oneOf(textColor.default),
+  textColorTablet: PropTypes__default.default.oneOf(textColor.default),
+  textColorDesktop: PropTypes__default.default.oneOf(textColor.default),
+  textGradient: PropTypes__default.default.oneOf(textGradient.default),
+  textStyle: PropTypes__default.default.oneOf(textStyle.default),
+  textWeight: PropTypes__default.default.oneOf(textWeight.default),
+  textWeightDesktop: PropTypes__default.default.oneOf(textWeight.default),
+  textWeightMobile: PropTypes__default.default.oneOf(textWeight.default),
+  textWeightTablet: PropTypes__default.default.oneOf(textWeight.default),
+  type: PropTypes__default.default.oneOf(type.default),
+  size: PropTypes__default.default.oneOf(size.default),
+  sizeDesktop: PropTypes__default.default.oneOf(size.default),
+  sizeMobile: PropTypes__default.default.oneOf(size.default),
+  sizeTablet: PropTypes__default.default.oneOf(size.default),
+  underline: PropTypes__default.default.oneOf(underline.default),
+  onClick: PropTypes__default.default.func,
+  onMouseDown: PropTypes__default.default.func
+};
+Link.defaultProps = {
+  underline: 'underline'
+};
+
+// Wrapper with "Link" by condition
+function LinkWrapper(props) {
+  var children = props.children,
+    Component = props.Component,
+    DefaultComponent = props.DefaultComponent,
+    href = props.href,
+    target = props.target,
+    rel = props.rel,
+    otherProps = useStyles._objectWithoutPropertiesLoose(props, _excluded);
+  if (href) {
+    // If href passed, make link-wrapper
+    var LinkComponent = Component || linkConfig.LinkComponent;
+    return /*#__PURE__*/React__default.default.createElement(LinkComponent, Object.assign({
+      href: href,
+      target: target,
+      rel: rel
+    }, otherProps), children);
+  } else if (DefaultComponent) {
+    // If has default "Component" - render it
+    return /*#__PURE__*/React__default.default.createElement(DefaultComponent, otherProps, children);
+  }
+
+  // Return children and pass current props to
+  return React__default.default.Children.toArray(children).filter(Boolean).map(function (child) {
+    return /*#__PURE__*/React__default.default.isValidElement(child) ? /*#__PURE__*/React__default.default.cloneElement(child, otherProps) : child;
+  });
+}
+LinkWrapper.propTypes = {
+  children: PropTypes__default.default.any,
+  Component: PropTypes__default.default.element,
+  DefaultComponent: PropTypes__default.default.element,
+  href: PropTypes__default.default.string,
+  target: PropTypes__default.default.string,
+  rel: PropTypes__default.default.string
+};
+
+exports.Link = Link;
+exports.LinkWrapper = LinkWrapper;
+exports.linkConfig = linkConfig;

package/dist/components/List.js

@@ -0,0 +1,143 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var direction = require('../constants/componentProps/direction.js');
+var fill = require('../constants/componentProps/fill.js');
+var textColor = require('../constants/componentProps/textColor.js');
+var size = require('../constants/componentProps/size.js');
+var useStyles = require('../useStyles-77c3b520.js');
+var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
+var textStyle = require('../constants/componentProps/textStyle.js');
+var textWeight = require('../constants/componentProps/textWeight.js');
+var type = require('../constants/componentProps/type.js');
+var index = require('./Link.js');
+require('lodash/camelCase');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.js');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('lodash/castArray');
+require('../constants/componentProps/textGradient.js');
+require('../constants/componentProps/underline.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+
+function List(props) {
+  var children = props.children,
+    className = props.className,
+    style = props.style,
+    type = props.type;
+  var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'list_size_',
+    propsKey: 'size'
+  });
+  var bulletSizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'list_bullet-size_',
+    propsKey: 'bulletSize'
+  });
+  var bulletFillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'list_bullet-fill_',
+    propsKey: 'bulletFill'
+  });
+  var bulletTextColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'list_bullet-text-color_',
+    propsKey: 'bulletTextColor'
+  });
+  var directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'list_direction_',
+    propsKey: 'direction'
+  });
+  var _useStyles = useStyles.useStyles(props),
+    ulStyles = _useStyles.styles;
+  return /*#__PURE__*/React__default.default.createElement("ul", {
+    className: clsx__default.default(className, 'list', bulletSizeClass, bulletFillClass, bulletTextColorClass, directionClass, sizeClass, style && "list_style_" + style, type && "list_type_" + type),
+    style: ulStyles
+  }, children);
+}
+List.propTypes = {
+  children: PropTypes__default.default.any,
+  className: PropTypes__default.default.string,
+  bulletFill: PropTypes__default.default.oneOf(fill.default),
+  bulletFillDesktop: PropTypes__default.default.oneOf(fill.default),
+  bulletFillMobile: PropTypes__default.default.oneOf(fill.default),
+  bulletFillTablet: PropTypes__default.default.oneOf(fill.default),
+  bulletSize: PropTypes__default.default.string,
+  bulletSizeDesktop: PropTypes__default.default.string,
+  bulletSizeMobile: PropTypes__default.default.string,
+  bulletSizeTablet: PropTypes__default.default.string,
+  bulletTextColor: PropTypes__default.default.oneOf(textColor.default),
+  bulletTextColorDesktop: PropTypes__default.default.oneOf(textColor.default),
+  bulletTextColorMobile: PropTypes__default.default.oneOf(textColor.default),
+  bulletTextColorTablet: PropTypes__default.default.oneOf(textColor.default),
+  direction: PropTypes__default.default.oneOf(direction.default),
+  directionDesktop: PropTypes__default.default.oneOf(direction.default),
+  directionMobile: PropTypes__default.default.oneOf(direction.default),
+  directionTablet: PropTypes__default.default.oneOf(direction.default),
+  size: PropTypes__default.default.oneOf(size.default),
+  sizeDesktop: PropTypes__default.default.oneOf(size.default),
+  sizeMobile: PropTypes__default.default.oneOf(size.default),
+  sizeTablet: PropTypes__default.default.oneOf(size.default),
+  style: PropTypes__default.default.string,
+  type: PropTypes__default.default.string,
+  onClick: PropTypes__default.default.func
+};
+
+function ListItem(props) {
+  var after = props.after,
+    before = props.before,
+    children = props.children,
+    className = props.className,
+    fill = props.fill,
+    href = props.href,
+    link = props.link,
+    text = props.text,
+    textColor = props.textColor,
+    textStyle = props.textStyle,
+    textWeight = props.textWeight;
+  var _useStyles = useStyles.useStyles(props),
+    liStyles = _useStyles.styles,
+    linkStyles = _useStyles.link;
+  if (link) {
+    return /*#__PURE__*/React__default.default.createElement("li", {
+      className: clsx__default.default(className, 'list__item', 'list__item_type_link', textStyle && "text text-style_" + textStyle, textWeight && "text text-weight_" + textWeight, textColor && "text-color_" + textColor.replace(/([A-Z])/g, '-$1').toLowerCase(), fill && "fill_" + fill.replace(/([A-Z])/g, '-$1').toLowerCase()),
+      style: liStyles
+    }, /*#__PURE__*/React__default.default.createElement(index.Link, {
+      href: link || href,
+      className: clsx__default.default('list__item-link'),
+      style: linkStyles
+    }, children || text));
+  }
+  return /*#__PURE__*/React__default.default.createElement("li", {
+    className: clsx__default.default(className, 'list__item', textStyle && "text text-style_" + textStyle, textWeight && "text text-weight_" + textWeight, textColor && "text-color_" + textColor.replace(/([A-Z])/g, '-$1').toLowerCase(), fill && "fill_" + fill.replace(/([A-Z])/g, '-$1').toLowerCase()),
+    style: liStyles
+  }, before, children || text, after);
+}
+ListItem.propTypes = {
+  after: PropTypes__default.default.any,
+  before: PropTypes__default.default.any,
+  children: PropTypes__default.default.any,
+  className: PropTypes__default.default.string,
+  href: PropTypes__default.default.string,
+  link: PropTypes__default.default.string,
+  fill: PropTypes__default.default.oneOf(fill.default),
+  fillDesktop: PropTypes__default.default.oneOf(fill.default),
+  fillMobile: PropTypes__default.default.oneOf(fill.default),
+  fillTablet: PropTypes__default.default.oneOf(fill.default),
+  type: PropTypes__default.default.oneOf(type.default),
+  text: PropTypes__default.default.string,
+  textColor: PropTypes__default.default.oneOf(textColor.default),
+  textWeight: PropTypes__default.default.oneOf(textWeight.default),
+  textStyle: PropTypes__default.default.oneOf(textStyle.default),
+  onClick: PropTypes__default.default.func
+};
+
+exports.List = List;
+exports.ListItem = ListItem;

package/dist/components/Loader.js

@@ -0,0 +1,66 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var index = require('./Text.js');
+var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
+require('../constants/componentProps/textColor.js');
+require('../constants/componentProps/textColorActive.js');
+require('../constants/componentProps/textColorHover.js');
+require('../constants/componentProps/size.js');
+require('../constants/componentProps/textStyle.js');
+require('../constants/componentProps/textWeight.js');
+require('../useStyles-77c3b520.js');
+require('lodash/camelCase');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.js');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('lodash/castArray');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+
+function Loader(props) {
+  var className = props.className,
+    children = props.children,
+    set = props.set,
+    text = props.text,
+    textSize = props.textSize,
+    textColor = props.textColor;
+  var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'fill'
+  });
+  return /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default('loader', className, set && "loader_set_" + set)
+  }, children || /*#__PURE__*/React__default.default.createElement("div", {
+    className: "loader__inner"
+  }, /*#__PURE__*/React__default.default.createElement("span", {
+    className: clsx__default.default('loader__item', fillClass)
+  }), /*#__PURE__*/React__default.default.createElement("span", {
+    className: clsx__default.default('loader__item', fillClass)
+  }), /*#__PURE__*/React__default.default.createElement("span", {
+    className: clsx__default.default('loader__item', fillClass)
+  })), text && /*#__PURE__*/React__default.default.createElement(index.Text, {
+    className: "loader__text",
+    size: textSize,
+    textColor: textColor
+  }, text));
+}
+Loader.propTypes = {
+  className: PropTypes__default.default.string,
+  children: PropTypes__default.default.any,
+  text: PropTypes__default.default.string,
+  textSize: PropTypes__default.default.string,
+  textColor: PropTypes__default.default.string,
+  set: PropTypes__default.default.string
+};
+
+exports.Loader = Loader;

package/dist/components/Logo.js

@@ -0,0 +1,55 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
+var useStyles = require('../useStyles-77c3b520.js');
+require('lodash/castArray');
+require('lodash/camelCase');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+
+function Logo(props) {
+  var children = props.children,
+    className = props.className;
+  props.LinkComponent;
+    props.href;
+    props.link;
+    props.target;
+    props.rel;
+  var alignItemsClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'logo_align-items_',
+    propsKey: 'alignItems'
+  });
+  var _useStyles = useStyles.useStyles(props),
+    logo = _useStyles.styles;
+  return /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default(className, 'logo', alignItemsClass),
+    style: logo
+  }, children);
+}
+Logo.propTypes = {
+  children: PropTypes__default.default.any,
+  className: PropTypes__default.default.string,
+  LinkComponent: PropTypes__default.default.any,
+  href: PropTypes__default.default.string,
+  link: PropTypes__default.default.string,
+  target: PropTypes__default.default.string,
+  rel: PropTypes__default.default.string
+};
+Logo.defaultProps = {
+  LinkComponent: 'a'
+};
+
+exports.Logo = Logo;

package/dist/components/Menu.js

@@ -0,0 +1,86 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var direction = require('../constants/componentProps/direction.js');
+var type = require('../constants/componentProps/type.js');
+var useStyles = require('../useStyles-77c3b520.js');
+var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
+var index = require('./MenuItem.js');
+require('lodash/camelCase');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.js');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('lodash/castArray');
+require('./Text.js');
+require('../constants/componentProps/textColor.js');
+require('../constants/componentProps/textColorActive.js');
+require('../constants/componentProps/textColorHover.js');
+require('../constants/componentProps/size.js');
+require('../constants/componentProps/textStyle.js');
+require('../constants/componentProps/textWeight.js');
+require('./Link.js');
+require('../constants/componentProps/fill.js');
+require('../constants/componentProps/textGradient.js');
+require('../constants/componentProps/underline.js');
+require('../constants/componentProps/shape.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+
+function Menu(props) {
+  var after = props.after,
+    before = props.before,
+    children = props.children,
+    className = props.className,
+    items = props.items,
+    type = props.type,
+    onClickItem = props.onClickItem;
+  var directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'menu_direction_',
+    propsKey: 'direction'
+  });
+  var columnsClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'menu_columns_',
+    propsKey: 'columns'
+  });
+  var _useStyles = useStyles.useStyles(props),
+    menuStyles = _useStyles.styles;
+  return /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default(className, 'menu', directionClass, columnsClass, type && "menu_type_" + type)
+  }, /*#__PURE__*/React__default.default.createElement("div", {
+    className: "menu__wrapper",
+    style: menuStyles
+  }, before, children || (items == null ? void 0 : items.map(function (item, i) {
+    return /*#__PURE__*/React__default.default.createElement(index.MenuItem, {
+      key: "menuItem_" + (item.id || i),
+      label: item.label,
+      onClick: onClickItem
+    });
+  })), after));
+}
+Menu.propTypes = {
+  before: PropTypes__default.default.any,
+  after: PropTypes__default.default.any,
+  children: PropTypes__default.default.any,
+  className: PropTypes__default.default.string,
+  direction: PropTypes__default.default.oneOf(direction.default),
+  directionDesktop: PropTypes__default.default.oneOf(direction.default),
+  directionMobile: PropTypes__default.default.oneOf(direction.default),
+  directionTablet: PropTypes__default.default.oneOf(direction.default),
+  type: PropTypes__default.default.oneOf(type.default),
+  items: PropTypes__default.default.array,
+  onClickItem: PropTypes__default.default.func
+};
+Menu.defaultProps = {
+  direction: 'horizontal'
+};
+
+exports.Menu = Menu;