@synerise/ds-menu 1.4.12 → 1.4.13

package/dist/Menu.js

@@ -1,146 +1,81 @@
-var _excluded = ["dataSource", "ordered", "selectable", "children", "showTextTooltip", "texts", "maxToShowItems", "popoverDelay"];
-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 (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-function _inheritsLoose(t, o) { t.prototype = Object.create(o.prototype), t.prototype.constructor = t, _setPrototypeOf(t, o); }
-function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
-import React, { Children, Component } from 'react';
-import { FormattedMessage } from 'react-intl';
-import Button from '@synerise/ds-button';
-import '@synerise/ds-core/dist/js/style';
-import Icon, { ArrowDownCircleM, ArrowUpCircleM } from '@synerise/ds-icon';
-import { FloatingDelayGroup } from '@synerise/ds-popover';
-import Tooltip from '@synerise/ds-tooltip';
-import Breadcrumb from './Elements/Breadcrumb/Breadcrumb';
-import { Divider } from './Elements/Divider/Divider';
-import Header from './Elements/Header/Header';
-import MenuItem from './Elements/Item/MenuItem';
-import SubMenuItem from './Elements/SubMenu/SubMenu';
-import * as S from './Menu.styles';
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { Component, Children } from "react";
+import { FormattedMessage } from "react-intl";
+import Button from "@synerise/ds-button";
+import Icon, { ArrowUpCircleM, ArrowDownCircleM } from "@synerise/ds-icon";
+import { FloatingDelayGroup } from "@synerise/ds-popover";
+import Tooltip from "@synerise/ds-tooltip";
+import Breadcrumb from "./Elements/Breadcrumb/Breadcrumb.js";
+import { Divider } from "./Elements/Divider/Divider.js";
+import MenuHeader from "./Elements/Header/Header.js";
+import MenuItem from "./Elements/Item/MenuItem.js";
+import SubMenuItem from "./Elements/SubMenu/SubMenu.js";
+import { AntdMenu } from "./Menu.styles.js";
 import "./style/index.css";
-export var Menu = /*#__PURE__*/function (_Component) {
-  function Menu() {
-    var _this;
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _Component.call.apply(_Component, [this].concat(args)) || this;
-    _this.state = {
+const _Menu = class _Menu extends Component {
+  constructor() {
+    super(...arguments);
+    this.state = {
       allItemsVisible: false
     };
-    return _this;
   }
-  _inheritsLoose(Menu, _Component);
-  var _proto = Menu.prototype;
-  _proto.toggleItems = function toggleItems() {
-    var allItemsVisible = this.state.allItemsVisible;
+  toggleItems() {
+    const {
+      allItemsVisible
+    } = this.state;
     this.setState({
       allItemsVisible: !allItemsVisible
     });
-  };
-  _proto.render = function render() {
-    var _this2 = this;
-    var _this$props = this.props,
-      dataSource = _this$props.dataSource,
-      ordered = _this$props.ordered,
-      selectable = _this$props.selectable,
-      children = _this$props.children,
-      showTextTooltip = _this$props.showTextTooltip,
-      texts = _this$props.texts,
-      maxToShowItems = _this$props.maxToShowItems,
-      _this$props$popoverDe = _this$props.popoverDelay,
-      popoverDelay = _this$props$popoverDe === void 0 ? {
+  }
+  render() {
+    const {
+      dataSource,
+      ordered,
+      selectable,
+      children,
+      showTextTooltip,
+      texts,
+      maxToShowItems,
+      popoverDelay = {
         open: 100,
         close: 400
-      } : _this$props$popoverDe,
-      rest = _objectWithoutPropertiesLoose(_this$props, _excluded);
-    var allItemsVisible = this.state.allItemsVisible;
-    var allTexts = _extends({
-      showLess: /*#__PURE__*/React.createElement(FormattedMessage, {
-        id: "DS.MENU.SHOW-LESS",
-        defaultMessage: "Show less"
-      }),
-      showMore: /*#__PURE__*/React.createElement(FormattedMessage, {
-        id: "DS.MENU.SHOW-MORE",
-        defaultMessage: "Show more"
-      })
-    }, texts);
-    var isListTogglable = maxToShowItems !== undefined;
-    var isDataSource = dataSource !== undefined;
-    var childrenArray = Children.toArray(children);
-    var itemsCount = (isDataSource ? dataSource.length : childrenArray.length) || 0;
-    var itemsOverLimit = isListTogglable ? itemsCount - maxToShowItems : 0;
-    var visibleItems = allItemsVisible || !isListTogglable ? dataSource : dataSource == null ? void 0 : dataSource.slice(0, maxToShowItems);
-    var visibleChildren = allItemsVisible || !isListTogglable ? children : childrenArray.slice(0, maxToShowItems);
-    var toggleButtonLabel = allItemsVisible ? allTexts.showLess : allTexts.showMore;
-    var toggleButton = isListTogglable && itemsOverLimit > 0 && /*#__PURE__*/React.createElement(Button, {
-      onClick: function onClick() {
-        return _this2.toggleItems();
       },
-      type: "ghost-primary",
-      mode: "icon-label"
-    }, /*#__PURE__*/React.createElement(Icon, {
-      component: allItemsVisible ? /*#__PURE__*/React.createElement(ArrowUpCircleM, null) : /*#__PURE__*/React.createElement(ArrowDownCircleM, null)
-    }), toggleButtonLabel);
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FloatingDelayGroup, {
-      delay: popoverDelay
-    }, /*#__PURE__*/React.createElement(S.AntdMenu, _extends({
-      ordered: ordered,
-      mode: "inline",
-      inlineIndent: ordered ? 20 : 18
-    }, rest, {
-      selectable: selectable === undefined ? false : selectable
-    }), isDataSource ? visibleItems == null ? void 0 : visibleItems.map(function (item, index) {
-      return item.subMenu ? /*#__PURE__*/React.createElement(SubMenuItem, _extends({
-        parent: item.parent,
-        prefixel: item.prefixel,
-        suffixel: item.suffixel,
-        disabled: item.disabled,
-        text: showTextTooltip ? /*#__PURE__*/React.createElement(Tooltip, {
-          title: item.text
-        }, item.text) : item.text,
-        description: item.description,
-        subMenu: item.subMenu,
-        ordered: item.ordered === undefined ? ordered : item.ordered,
-        copyable: item.copyable,
-        copyHint: item.copyHint,
-        copyValue: item.copyValue,
-        suffixVisibilityTrigger: item.suffixVisibilityTrigger,
-        prefixVisibilityTrigger: item.prefixVisibilityTrigger,
-        key: item.key || "" + item.text + index,
-        menuItemKey: item.key || "" + item.text + index
-      }, rest, item, {
-        ItemComponent: MenuItem
-      })) : /*#__PURE__*/React.createElement(MenuItem, _extends({
-        className: "ds-menu-item",
-        parent: item.parent,
-        prefixel: item.prefixel,
-        suffixel: item.suffixel,
-        disabled: item.disabled,
-        text: showTextTooltip ? /*#__PURE__*/React.createElement(Tooltip, {
-          title: item.text
-        }, item.text) : item.text,
-        description: item.description,
-        subMenu: item.subMenu,
-        ordered: item.ordered === undefined ? ordered : item.ordered,
-        copyable: item.copyable,
-        copyHint: item.copyHint,
-        copyValue: item.copyValue,
-        highlight: item.highlight,
-        suffixVisibilityTrigger: item.suffixVisibilityTrigger,
-        prefixVisibilityTrigger: item.prefixVisibilityTrigger,
-        indentLevel: item.indentLevel || 0,
-        type: item.type,
-        key: item.key || "" + item.text + index,
-        menuItemKey: item.key || "" + item.text + index
-      }, rest, item));
-    }) : visibleChildren)), toggleButton);
-  };
-  return Menu;
-}(Component);
-Menu.Item = MenuItem;
-Menu.Breadcrumb = Breadcrumb;
-Menu.Header = Header;
-Menu.ItemGroup = S.AntdMenu.ItemGroup;
-Menu.SubMenu = S.AntdMenu.SubMenu;
-Menu.Divider = Divider;
-export default Menu;
+      ...rest
+    } = this.props;
+    const {
+      allItemsVisible
+    } = this.state;
+    const allTexts = {
+      showLess: /* @__PURE__ */ jsx(FormattedMessage, { id: "DS.MENU.SHOW-LESS", defaultMessage: "Show less" }),
+      showMore: /* @__PURE__ */ jsx(FormattedMessage, { id: "DS.MENU.SHOW-MORE", defaultMessage: "Show more" }),
+      ...texts
+    };
+    const isListTogglable = maxToShowItems !== void 0;
+    const isDataSource = dataSource !== void 0;
+    const childrenArray = Children.toArray(children);
+    const itemsCount = (isDataSource ? dataSource.length : childrenArray.length) || 0;
+    const itemsOverLimit = isListTogglable ? itemsCount - maxToShowItems : 0;
+    const visibleItems = allItemsVisible || !isListTogglable ? dataSource : dataSource?.slice(0, maxToShowItems);
+    const visibleChildren = allItemsVisible || !isListTogglable ? children : childrenArray.slice(0, maxToShowItems);
+    const toggleButtonLabel = allItemsVisible ? allTexts.showLess : allTexts.showMore;
+    const toggleButton = isListTogglable && itemsOverLimit > 0 && /* @__PURE__ */ jsxs(Button, { onClick: () => this.toggleItems(), type: "ghost-primary", mode: "icon-label", children: [
+      /* @__PURE__ */ jsx(Icon, { component: allItemsVisible ? /* @__PURE__ */ jsx(ArrowUpCircleM, {}) : /* @__PURE__ */ jsx(ArrowDownCircleM, {}) }),
+      toggleButtonLabel
+    ] });
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(FloatingDelayGroup, { delay: popoverDelay, children: /* @__PURE__ */ jsx(AntdMenu, { ordered, mode: "inline", inlineIndent: ordered ? 20 : 18, ...rest, selectable: selectable === void 0 ? false : selectable, children: isDataSource ? visibleItems?.map((item, index) => item.subMenu ? /* @__PURE__ */ jsx(SubMenuItem, { parent: item.parent, prefixel: item.prefixel, suffixel: item.suffixel, disabled: item.disabled, text: showTextTooltip ? /* @__PURE__ */ jsx(Tooltip, { title: item.text, children: item.text }) : item.text, description: item.description, subMenu: item.subMenu, ordered: item.ordered === void 0 ? ordered : item.ordered, copyable: item.copyable, copyHint: item.copyHint, copyValue: item.copyValue, suffixVisibilityTrigger: item.suffixVisibilityTrigger, prefixVisibilityTrigger: item.prefixVisibilityTrigger, menuItemKey: item.key || `${item.text}${index}`, ...rest, ...item, ItemComponent: MenuItem }, item.key || `${item.text}${index}`) : /* @__PURE__ */ jsx(MenuItem, { className: "ds-menu-item", parent: item.parent, prefixel: item.prefixel, suffixel: item.suffixel, disabled: item.disabled, text: showTextTooltip ? /* @__PURE__ */ jsx(Tooltip, { title: item.text, children: item.text }) : item.text, description: item.description, subMenu: item.subMenu, ordered: item.ordered === void 0 ? ordered : item.ordered, copyable: item.copyable, copyHint: item.copyHint, copyValue: item.copyValue, highlight: item.highlight, suffixVisibilityTrigger: item.suffixVisibilityTrigger, prefixVisibilityTrigger: item.prefixVisibilityTrigger, indentLevel: item.indentLevel || 0, type: item.type, menuItemKey: item.key || `${item.text}${index}`, ...rest, ...item }, item.key || `${item.text}${index}`)) : visibleChildren }) }),
+      toggleButton
+    ] });
+  }
+};
+_Menu.Item = MenuItem;
+_Menu.Breadcrumb = Breadcrumb;
+_Menu.Header = MenuHeader;
+_Menu.ItemGroup = AntdMenu.ItemGroup;
+_Menu.SubMenu = AntdMenu.SubMenu;
+_Menu.Divider = Divider;
+let Menu = _Menu;
+export {
+  Menu,
+  Menu as default
+};

package/dist/Menu.styles.d.ts

@@ -1,6 +1,6 @@
 import { Menu } from 'antd';
-import { type PropsWithChildren, type ReactNode } from 'react';
-import { type AntdMenuProps } from './Menu.types';
+import { PropsWithChildren, ReactNode } from 'react';
+import { AntdMenuProps } from './Menu.types';
 type SubMenuProps = PropsWithChildren<{
     ordered?: boolean | undefined;
     disabled?: boolean | undefined;
@@ -9,6 +9,6 @@ type SubMenuProps = PropsWithChildren<{
     title: string | ReactNode;
     tabIndex?: number;
 }>;
-export declare const AntdMenu: import("styled-components").StyledComponent<typeof Menu, any, AntdMenuProps, never>;
-export declare const SubMenuItem: import("styled-components").StyledComponent<typeof import("antd/lib/menu/SubMenu").default, any, SubMenuProps, never>;
+export declare const AntdMenu: import('styled-components').StyledComponent<typeof Menu, any, AntdMenuProps, never>;
+export declare const SubMenuItem: import('styled-components').StyledComponent<typeof import('antd/lib/menu/SubMenu').default, any, SubMenuProps, never>;
 export {};

package/dist/Menu.styles.js

@@ -1,82 +1,32 @@
-import { Menu } from 'antd';
-import styled, { css } from 'styled-components';
-var overflowStyles = css(["text-overflow:ellipsis;overflow:hidden;white-space:nowrap;"]);
-var arrowDownSvgWithCustomColor = function arrowDownSvgWithCustomColor(color) {
-  var colorValueForSvg = color.replace(/#/, '%23');
-  var iconWithColor = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' >/><path fill='none' d='M0 0h24v24H0z' /><path style='fill: " + colorValueForSvg + ";' d='M14.71973,9.84473,12,12.56445,9.28027,9.84473a.74992.74992,0,0,0-1.06054,1.06054l3.25,3.25a.74971.74971,0,0,0,1.06054,0l3.25-3.25a.74992.74992,0,0,0-1.06054-1.06054Z'/></svg>";
+import { Menu } from "antd";
+import styled, { css } from "styled-components";
+const overflowStyles = /* @__PURE__ */ css(["text-overflow:ellipsis;overflow:hidden;white-space:nowrap;"]);
+const arrowDownSvgWithCustomColor = (color) => {
+  const colorValueForSvg = color.replace(/#/, "%23");
+  const iconWithColor = `data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' >/><path fill='none' d='M0 0h24v24H0z' /><path style='fill: ${colorValueForSvg};' d='M14.71973,9.84473,12,12.56445,9.28027,9.84473a.74992.74992,0,0,0-1.06054,1.06054l3.25,3.25a.74971.74971,0,0,0,1.06054,0l3.25-3.25a.74992.74992,0,0,0-1.06054-1.06054Z'/></svg>`;
   return iconWithColor;
 };
-export var AntdMenu = styled(Menu).withConfig({
+const AntdMenu = /* @__PURE__ */ styled(Menu).withConfig({
   displayName: "Menustyles__AntdMenu",
   componentId: "sc-10eu0qe-0"
-})(["", " ", " > li{> .ant-menu-submenu-title,> .-submenu-title{padding-left:12px !important;}&:not(.ant-menu-submenu){padding-left:12px !important;}}.ant-menu-submenu-title,.-submenu-title{display:flex;", " .ds-submenu-title-wrapper{", " .ds-submenu-title{padding-top:5px;padding-bottom:5px;", "}}}&&& .ant-menu-item-selected,&&& .-item-selected{&:focus:not(:active){color:", ";background:", ";box-shadow:inset 0 0 0 2px ", ";&::before{color:", ";}}}&&{.ant-menu-submenu-open,.-submenu-open{.ant-menu-inline,.-inline,.ant-menu-vertical,.-vertical,.ant-menu-vertical-left,.-vertical-left{border-right-width:0px;margin:8px 0 8px 0;padding-left:24px;}}}", ""], function (props) {
-  return Boolean(props.asDropdownMenu) && !props.asInfoCardContainer && css(["&&{padding:8px;width:100%;"]);
-}, function (props) {
-  return !!props.ordered && css(["&,ul{counter-reset:custom-counter;li:not(.ds-submenu-title){counter-increment:custom-counter;&::before{content:'0' counter(custom-counter) '. \\a0';line-height:1.39;font-weight:normal;color:", ";}}li.ant-menu-submenu,li.-submenu{&::before{content:'';}}}"], props.theme.palette['grey-500']);
-}, overflowStyles, overflowStyles, overflowStyles, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return props.theme.palette['blue-050'];
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return Boolean(props.asInfoCardContainer) && css(["&&& li.ds-menu-item{padding:0 !important;}"]);
-});
-export var SubMenuItem = styled(Menu.SubMenu).withConfig({
+})(["", " ", " > li{> .ant-menu-submenu-title,> .-submenu-title{padding-left:12px !important;}&:not(.ant-menu-submenu){padding-left:12px !important;}}.ant-menu-submenu-title,.-submenu-title{display:flex;", " .ds-submenu-title-wrapper{", " .ds-submenu-title{padding-top:5px;padding-bottom:5px;", "}}}&&& .ant-menu-item-selected,&&& .-item-selected{&:focus:not(:active){color:", ";background:", ";box-shadow:inset 0 0 0 2px ", ";&::before{color:", ";}}}&&{.ant-menu-submenu-open,.-submenu-open{.ant-menu-inline,.-inline,.ant-menu-vertical,.-vertical,.ant-menu-vertical-left,.-vertical-left{border-right-width:0px;margin:8px 0 8px 0;padding-left:24px;}}}", ""], (props) => Boolean(props.asDropdownMenu) && !props.asInfoCardContainer && css(["&&{padding:8px;width:100%;"]), (props) => !!props.ordered && css(["&,ul{counter-reset:custom-counter;li:not(.ds-submenu-title){counter-increment:custom-counter;&::before{content:'0' counter(custom-counter) '. \\a0';line-height:1.39;font-weight:normal;color:", ";}}li.ant-menu-submenu,li.-submenu{&::before{content:'';}}}"], props.theme.palette["grey-500"]), overflowStyles, overflowStyles, overflowStyles, (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["blue-050"], (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["blue-600"], (props) => Boolean(props.asInfoCardContainer) && css(["&&& li.ds-menu-item{padding:0 !important;}"]));
+const SubMenuItem$1 = /* @__PURE__ */ styled(Menu.SubMenu).withConfig({
   displayName: "Menustyles__SubMenuItem",
   componentId: "sc-10eu0qe-1"
-})(["&&&{color:", ";opacity:", ";cursor:", ";font-weight:500;border-radius:3px;transition:background-color 0.2s ease-out;&& .ant-menu-submenu-title:hover,&& .-submenu-title:hover{&& > i.ant-menu-submenu-arrow,&& > i.-submenu-arrow{background-image:url(\"", "\");}.ds-submenu-title-wrapper > .ds-submenu-title{color:", ";.ds-menu-prefix{svg{fill:", ";}}}}> .ant-menu-submenu-title,> .-submenu-title{line-height:1.39;height:auto;margin:0;padding-bottom:2px;padding-top:2px;max-width:100%;align-items:center;.ds-submenu-title-wrapper > .ds-submenu-title:focus:not(:active){box-shadow:inset 0 0 0 2px transparent;background:transparent;}", "}.ant-menu-item,.-item{padding-right:5px;padding-left:10px !important;}.ant-menu-title-content{.ant-menu-item,.-item{margin-left:0;}}.ds-menu-prefix{margin-left:0px;}&.ant-menu-item-selected,&.-item-selected{background:inherit;.ant-menu-submenu-title,.-submenu-title{&:focus,&:active{background:", ";&::before{color:", ";}}& > .ds-menu-prefix{svg{fill:", ";}}&::after{content:none;}}}}", " i{right:12px;}> .ant-menu-submenu-title:hover,> .-submenu-title:hover{color:", ";}&&.ant-menu-submenu-open > .ant-menu-submenu-title,&&.-submenu-open > .-submenu-title{&:not(:hover){color:", ";}background:", ";.ds-menu-content-wrapper{color:", ";background:", ";.ds-menu-prefix{svg{fill:", ";}}.ds-check-icon{svg{fill:", ";}}}& > i.ant-menu-submenu-arrow,& > i.-submenu-arrow{transform:rotate(180deg);background-image:url(\"", "\");}}> .ant-menu-submenu-title,> .-submenu-title{border-radius:3px;& > i.ant-menu-submenu-arrow,& > i.-submenu-arrow{transform:rotate(0deg);top:calc(50% - 12px);right:5px;height:24px;width:24px;}& > i.ant-menu-submenu-arrow::after,& > i.-submenu-arrow::after,& > i.ant-menu-submenu-arrow::before,& > i.-submenu-arrow::before{background-image:none;display:none;}&:hover > i.ant-menu-submenu-arrow::after,&:hover > i.-submenu-arrow::after,&:hover > i.ant-menu-submenu-arrow::before,&:hover > i.-submenu-arrow::before{background-image:none;}&:hover{color:", ";background:", ";}& > i.ant-menu-submenu-arrow,& > i.-submenu-arrow{background-image:url(\"", "\");}&:hover > i.ant-menu-submenu-arrow,&:hover > i.-submenu-arrow{background-image:url(\"", "\");}}&&.ant-menu-submenu-open > .ant-menu-submenu-title:hover,&&.-submenu-open > .-submenu-title:hover{& > i.ant-menu-submenu-arrow,& > i.-submenu-arrow{background-image:url(\"", "\");}}> li.ant-menu-submenu,> li.-submenu{&:hover{background:none !important;}}", " > ul{li{i{right:12px;}> .ant-menu-submenu,> .-submenu{&:hover{", "}}}}}"], function (props) {
-  return props.theme.palette['grey-700'];
-}, function (props) {
-  return props.disabled ? '0.4' : '1';
-}, function (props) {
-  return props.disabled ? 'not-allowed' : 'pointer';
-}, function (props) {
-  return props.disabled ? arrowDownSvgWithCustomColor(props.theme.palette['grey-400']) : arrowDownSvgWithCustomColor(props.theme.palette['blue-600']);
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return !!props.ordered && css(["&::before{content:'0' counter(custom-counter) '. \\a0';line-height:1.39;font-weight:normal;color:", ";}"], props.theme.palette['grey-500']);
-}, function (props) {
-  return props.theme.palette['blue-050'];
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return !props.disabled && "\n    &:focus {\n       > .ant-menu-submenu-title, > .-submenu-title {\n         box-shadow: inset 0 0 0 2px " + props.theme.palette['blue-600'] + ";\n      }\n    }\n    ";
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return props.theme.palette['grey-700'];
-}, function (props) {
-  return props.theme.palette['blue-050'];
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return props.theme.palette['blue-050'];
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return props.theme.palette['green-600'];
-}, function (props) {
-  return props.disabled ? arrowDownSvgWithCustomColor(props.theme.palette['grey-400']) : arrowDownSvgWithCustomColor(props.theme.palette['blue-600']);
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return props.theme.palette['grey-050'];
-}, function (props) {
-  return arrowDownSvgWithCustomColor(props.theme.palette['grey-400']);
-}, function (props) {
-  return arrowDownSvgWithCustomColor(props.theme.palette['blue-600']);
-}, function (props) {
-  return arrowDownSvgWithCustomColor(props.theme.palette['blue-600']);
-}, function (props) {
-  return props.disabled ? "\n     > * {\n        pointer-events:none;\n     }" : "";
-}, function (props) {
-  return !props.disabled && "\n              color: " + (props.danger ? props.theme.palette['red-600'] : props.theme.palette['blue-600']) + ";\n              background: " + (props.danger ? props.theme.palette['red-050'] : props.theme.palette['grey-050']) + ";\n           ";
-});
+})(["&&&{color:", ";opacity:", ";cursor:", ';font-weight:500;border-radius:3px;transition:background-color 0.2s ease-out;&& .ant-menu-submenu-title:hover,&& .-submenu-title:hover{&& > i.ant-menu-submenu-arrow,&& > i.-submenu-arrow{background-image:url("', '");}.ds-submenu-title-wrapper > .ds-submenu-title{color:', ";.ds-menu-prefix{svg{fill:", ";}}}}> .ant-menu-submenu-title,> .-submenu-title{line-height:1.39;height:auto;margin:0;padding-bottom:2px;padding-top:2px;max-width:100%;align-items:center;.ds-submenu-title-wrapper > .ds-submenu-title:focus:not(:active){box-shadow:inset 0 0 0 2px transparent;background:transparent;}", "}.ant-menu-item,.-item{padding-right:5px;padding-left:10px !important;}.ant-menu-title-content{.ant-menu-item,.-item{margin-left:0;}}.ds-menu-prefix{margin-left:0px;}&.ant-menu-item-selected,&.-item-selected{background:inherit;.ant-menu-submenu-title,.-submenu-title{&:focus,&:active{background:", ";&::before{color:", ";}}& > .ds-menu-prefix{svg{fill:", ";}}&::after{content:none;}}}}", " i{right:12px;}> .ant-menu-submenu-title:hover,> .-submenu-title:hover{color:", ";}&&.ant-menu-submenu-open > .ant-menu-submenu-title,&&.-submenu-open > .-submenu-title{&:not(:hover){color:", ";}background:", ";.ds-menu-content-wrapper{color:", ";background:", ";.ds-menu-prefix{svg{fill:", ";}}.ds-check-icon{svg{fill:", ';}}}& > i.ant-menu-submenu-arrow,& > i.-submenu-arrow{transform:rotate(180deg);background-image:url("', '");}}> .ant-menu-submenu-title,> .-submenu-title{border-radius:3px;& > i.ant-menu-submenu-arrow,& > i.-submenu-arrow{transform:rotate(0deg);top:calc(50% - 12px);right:5px;height:24px;width:24px;}& > i.ant-menu-submenu-arrow::after,& > i.-submenu-arrow::after,& > i.ant-menu-submenu-arrow::before,& > i.-submenu-arrow::before{background-image:none;display:none;}&:hover > i.ant-menu-submenu-arrow::after,&:hover > i.-submenu-arrow::after,&:hover > i.ant-menu-submenu-arrow::before,&:hover > i.-submenu-arrow::before{background-image:none;}&:hover{color:', ";background:", ';}& > i.ant-menu-submenu-arrow,& > i.-submenu-arrow{background-image:url("', '");}&:hover > i.ant-menu-submenu-arrow,&:hover > i.-submenu-arrow{background-image:url("', '");}}&&.ant-menu-submenu-open > .ant-menu-submenu-title:hover,&&.-submenu-open > .-submenu-title:hover{& > i.ant-menu-submenu-arrow,& > i.-submenu-arrow{background-image:url("', '");}}> li.ant-menu-submenu,> li.-submenu{&:hover{background:none !important;}}', " > ul{li{i{right:12px;}> .ant-menu-submenu,> .-submenu{&:hover{", "}}}}}"], (props) => props.theme.palette["grey-700"], (props) => props.disabled ? "0.4" : "1", (props) => props.disabled ? "not-allowed" : "pointer", (props) => props.disabled ? arrowDownSvgWithCustomColor(props.theme.palette["grey-400"]) : arrowDownSvgWithCustomColor(props.theme.palette["blue-600"]), (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["blue-600"], (props) => !!props.ordered && css(["&::before{content:'0' counter(custom-counter) '. \\a0';line-height:1.39;font-weight:normal;color:", ";}"], props.theme.palette["grey-500"]), (props) => props.theme.palette["blue-050"], (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["blue-600"], (props) => !props.disabled && `
+    &:focus {
+       > .ant-menu-submenu-title, > .-submenu-title {
+         box-shadow: inset 0 0 0 2px ${props.theme.palette["blue-600"]};
+      }
+    }
+    `, (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["grey-700"], (props) => props.theme.palette["blue-050"], (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["blue-050"], (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["green-600"], (props) => props.disabled ? arrowDownSvgWithCustomColor(props.theme.palette["grey-400"]) : arrowDownSvgWithCustomColor(props.theme.palette["blue-600"]), (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["grey-050"], (props) => arrowDownSvgWithCustomColor(props.theme.palette["grey-400"]), (props) => arrowDownSvgWithCustomColor(props.theme.palette["blue-600"]), (props) => arrowDownSvgWithCustomColor(props.theme.palette["blue-600"]), (props) => props.disabled ? `
+     > * {
+        pointer-events:none;
+     }` : ``, (props) => !props.disabled && `
+              color: ${props.danger ? props.theme.palette["red-600"] : props.theme.palette["blue-600"]};
+              background: ${props.danger ? props.theme.palette["red-050"] : props.theme.palette["grey-050"]};
+           `);
+export {
+  AntdMenu,
+  SubMenuItem$1 as SubMenuItem
+};

package/dist/Menu.types.d.ts

@@ -1,7 +1,7 @@
-import { type MenuProps } from 'antd/lib/menu';
-import type { ReactElement, ReactNode } from 'react';
-import { type DelayConfig, type LegacyPlacement, type PopoverOptions } from '@synerise/ds-popover';
-import { type TooltipProps } from '@synerise/ds-tooltip';
+import { MenuProps } from 'antd/lib/menu';
+import { ReactElement, ReactNode } from 'react';
+import { DelayConfig, LegacyPlacement, PopoverOptions } from '@synerise/ds-popover';
+import { TooltipProps } from '@synerise/ds-tooltip';
 export type MenuTexts = {
     showLess: ReactNode;
     showMore: ReactNode;

package/dist/Menu.types.js

@@ -1,22 +1,22 @@
-export var VisibilityTrigger = /*#__PURE__*/function (VisibilityTrigger) {
-  VisibilityTrigger["DEFAULT"] = "default";
-  VisibilityTrigger["HOVER"] = "hover";
-  return VisibilityTrigger;
-}({});
-/**
- * @deprecated
- * provide Copyable type instead
- */
-
-export var ItemType = /*#__PURE__*/function (ItemType) {
-  ItemType["DEFAULT"] = "default";
-  ItemType["SELECT"] = "select";
-  ItemType["DANGER"] = "danger";
-  ItemType["DIVIDER"] = "divider";
-  return ItemType;
-}({});
-export var ItemSize = /*#__PURE__*/function (ItemSize) {
-  ItemSize["DEFAULT"] = "default";
-  ItemSize["LARGE"] = "large";
-  return ItemSize;
-}({});
+var VisibilityTrigger = /* @__PURE__ */ ((VisibilityTrigger2) => {
+  VisibilityTrigger2["DEFAULT"] = "default";
+  VisibilityTrigger2["HOVER"] = "hover";
+  return VisibilityTrigger2;
+})(VisibilityTrigger || {});
+var ItemType = /* @__PURE__ */ ((ItemType2) => {
+  ItemType2["DEFAULT"] = "default";
+  ItemType2["SELECT"] = "select";
+  ItemType2["DANGER"] = "danger";
+  ItemType2["DIVIDER"] = "divider";
+  return ItemType2;
+})(ItemType || {});
+var ItemSize = /* @__PURE__ */ ((ItemSize2) => {
+  ItemSize2["DEFAULT"] = "default";
+  ItemSize2["LARGE"] = "large";
+  return ItemSize2;
+})(ItemSize || {});
+export {
+  ItemSize,
+  ItemType,
+  VisibilityTrigger
+};

package/dist/hooks/useTemporaryLabel.d.ts

@@ -1,4 +1,4 @@
 export declare const useTemporaryLabel: (duration: number) => {
     temporaryLabel: boolean;
-    setTemporaryLabel: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    setTemporaryLabel: import('react').Dispatch<import('react').SetStateAction<boolean>>;
 };

package/dist/hooks/useTemporaryLabel.js

@@ -1,18 +1,17 @@
-import { useEffect, useState } from 'react';
-export var useTemporaryLabel = function useTemporaryLabel(duration) {
-  var _useState = useState(false),
-    temporaryLabel = _useState[0],
-    setTemporaryLabel = _useState[1];
-  useEffect(function () {
-    var timer = setTimeout(function () {
-      return setTemporaryLabel(false);
-    }, duration);
-    return function () {
+import { useState, useEffect } from "react";
+const useTemporaryLabel = (duration) => {
+  const [temporaryLabel, setTemporaryLabel] = useState(false);
+  useEffect(() => {
+    const timer = setTimeout(() => setTemporaryLabel(false), duration);
+    return () => {
       clearTimeout(timer);
     };
   });
   return {
-    temporaryLabel: temporaryLabel,
-    setTemporaryLabel: setTemporaryLabel
+    temporaryLabel,
+    setTemporaryLabel
   };
-};
+};
+export {
+  useTemporaryLabel
+};

package/dist/index.js

@@ -1,18 +1,25 @@
-import * as BreadcrumbStyles from './Elements/Breadcrumb/Breadcrumb.styles';
-import * as HeaderStyles from './Elements/Header/Header.styles';
-import * as ItemDangerStyles from './Elements/Item/Danger/Danger.styles';
-import * as ItemSelectStyles from './Elements/Item/Select/Select.styles';
-import * as ItemSubmenuTextStyles from './Elements/Item/SubmenuText/SubmenuText.styles';
-import * as ItemTextStyles from './Elements/Item/Text/Text.styles';
-import * as MainMenuStyles from './Menu.styles';
-export { default } from './Menu';
-export * from './Menu.types';
-export var MenuStyles = {
-  MenuStyles: MainMenuStyles,
-  Breadcrumb: BreadcrumbStyles,
-  Header: HeaderStyles,
-  ItemDanger: ItemDangerStyles,
-  ItemSelect: ItemSelectStyles,
-  ItemSubmenuText: ItemSubmenuTextStyles,
-  ItemText: ItemTextStyles
-};
+import * as Elements_Breadcrumb_Breadcrumb_styles from "./Elements/Breadcrumb/Breadcrumb.styles.js";
+import * as Elements_Header_Header_styles from "./Elements/Header/Header.styles.js";
+import * as Elements_Item_Danger_Danger_styles from "./Elements/Item/Danger/Danger.styles.js";
+import * as Elements_Item_Select_Select_styles from "./Elements/Item/Select/Select.styles.js";
+import * as Elements_Item_SubmenuText_SubmenuText_styles from "./Elements/Item/SubmenuText/SubmenuText.styles.js";
+import * as Elements_Item_Text_Text_styles from "./Elements/Item/Text/Text.styles.js";
+import * as Menu_styles from "./Menu.styles.js";
+import { Menu } from "./Menu.js";
+import { ItemSize, ItemType, VisibilityTrigger } from "./Menu.types.js";
+const MenuStyles = {
+  MenuStyles: Menu_styles,
+  Breadcrumb: Elements_Breadcrumb_Breadcrumb_styles,
+  Header: Elements_Header_Header_styles,
+  ItemDanger: Elements_Item_Danger_Danger_styles,
+  ItemSelect: Elements_Item_Select_Select_styles,
+  ItemSubmenuText: Elements_Item_SubmenuText_SubmenuText_styles,
+  ItemText: Elements_Item_Text_Text_styles
+};
+export {
+  ItemSize,
+  ItemType,
+  MenuStyles,
+  VisibilityTrigger,
+  Menu as default
+};

package/dist/modules.d.js

@@ -1 +1 @@
-import '@testing-library/jest-dom';
+import "@testing-library/jest-dom";

package/dist/utils/getCopyConfig.d.ts

@@ -1,8 +1,8 @@
-import { type MenuItemProps } from '../Menu.types';
+import { MenuItemProps } from '../Menu.types';
 export declare const getCopyConfig: ({ copyable, copyValue, disabled, }: Pick<MenuItemProps, "copyValue" | "copyable" | "disabled">) => {
     delayClickEvent: number | false;
     enabled: boolean | "" | undefined;
     valueToCopy: string | undefined;
-    copiedLabel: import("react").ReactNode;
+    copiedLabel: import('react').ReactNode;
     labelTimerReset: number;
 };

package/dist/utils/getCopyConfig.js

@@ -1,19 +1,23 @@
-export var getCopyConfig = function getCopyConfig(_ref) {
-  var copyable = _ref.copyable,
-    copyValue = _ref.copyValue,
-    disabled = _ref.disabled;
-  var DEFAULT_RESET_TIMER = 1000;
-  var DELAY_CLICK_AFTER_COPY_DURATION = 700;
-  var enabled = copyable && (copyValue || typeof copyable === 'object' && copyable.copyValue) && !disabled;
-  var valueToCopy = typeof copyable === 'object' ? copyable.copyValue : copyValue;
-  var copiedLabel = typeof copyable === 'object' ? copyable.copiedLabel : null;
-  var labelTimerReset = typeof copyable === 'object' && copyable.timeToReset || DEFAULT_RESET_TIMER;
-  var delayClickEvent = typeof copyable === 'object' && copyable.delayClickEvent !== undefined ? copyable.delayClickEvent : copyable ? DELAY_CLICK_AFTER_COPY_DURATION : false;
+const getCopyConfig = ({
+  copyable,
+  copyValue,
+  disabled
+}) => {
+  const DEFAULT_RESET_TIMER = 1e3;
+  const DELAY_CLICK_AFTER_COPY_DURATION = 700;
+  const enabled = copyable && (copyValue || typeof copyable === "object" && copyable.copyValue) && !disabled;
+  const valueToCopy = typeof copyable === "object" ? copyable.copyValue : copyValue;
+  const copiedLabel = typeof copyable === "object" ? copyable.copiedLabel : null;
+  const labelTimerReset = typeof copyable === "object" && copyable.timeToReset || DEFAULT_RESET_TIMER;
+  const delayClickEvent = typeof copyable === "object" && copyable.delayClickEvent !== void 0 ? copyable.delayClickEvent : copyable ? DELAY_CLICK_AFTER_COPY_DURATION : false;
   return {
-    delayClickEvent: delayClickEvent,
-    enabled: enabled,
-    valueToCopy: valueToCopy,
-    copiedLabel: copiedLabel,
-    labelTimerReset: labelTimerReset
+    delayClickEvent,
+    enabled,
+    valueToCopy,
+    copiedLabel,
+    labelTimerReset
   };
-};
+};
+export {
+  getCopyConfig
+};