@synerise/ds-menu 1.4.12 → 1.4.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/Elements/Breadcrumb/Breadcrumb.d.ts +3 -3
  3. package/dist/Elements/Breadcrumb/Breadcrumb.js +53 -74
  4. package/dist/Elements/Breadcrumb/Breadcrumb.styles.d.ts +10 -10
  5. package/dist/Elements/Breadcrumb/Breadcrumb.styles.js +45 -60
  6. package/dist/Elements/Breadcrumb/Breadcrumb.types.d.ts +1 -1
  7. package/dist/Elements/Breadcrumb/Breadcrumb.types.js +1 -1
  8. package/dist/Elements/Divider/Divider.d.ts +3 -3
  9. package/dist/Elements/Divider/Divider.js +8 -9
  10. package/dist/Elements/Divider/Divider.styles.d.ts +2 -2
  11. package/dist/Elements/Divider/Divider.styles.js +7 -8
  12. package/dist/Elements/Header/Header.d.ts +2 -2
  13. package/dist/Elements/Header/Header.js +15 -15
  14. package/dist/Elements/Header/Header.styles.d.ts +2 -2
  15. package/dist/Elements/Header/Header.styles.js +9 -9
  16. package/dist/Elements/Header/Header.types.js +1 -1
  17. package/dist/Elements/Item/Danger/Danger.d.ts +2 -3
  18. package/dist/Elements/Item/Danger/Danger.js +10 -10
  19. package/dist/Elements/Item/Danger/Danger.styles.d.ts +2 -2
  20. package/dist/Elements/Item/Danger/Danger.styles.js +28 -33
  21. package/dist/Elements/Item/MenuItem.d.ts +2 -3
  22. package/dist/Elements/Item/MenuItem.js +45 -89
  23. package/dist/Elements/Item/Select/Select.d.ts +2 -3
  24. package/dist/Elements/Item/Select/Select.js +12 -16
  25. package/dist/Elements/Item/Select/Select.styles.d.ts +2 -2
  26. package/dist/Elements/Item/Select/Select.styles.js +13 -18
  27. package/dist/Elements/Item/SubmenuText/SubmenuText.d.ts +2 -3
  28. package/dist/Elements/Item/SubmenuText/SubmenuText.js +15 -24
  29. package/dist/Elements/Item/SubmenuText/SubmenuText.styles.d.ts +3 -3
  30. package/dist/Elements/Item/SubmenuText/SubmenuText.styles.js +18 -23
  31. package/dist/Elements/Item/Text/DynamicLabel.d.ts +1 -1
  32. package/dist/Elements/Item/Text/DynamicLabel.js +15 -10
  33. package/dist/Elements/Item/Text/Text.const.d.ts +1 -1
  34. package/dist/Elements/Item/Text/Text.const.js +13 -6
  35. package/dist/Elements/Item/Text/Text.d.ts +2 -2
  36. package/dist/Elements/Item/Text/Text.js +131 -196
  37. package/dist/Elements/Item/Text/Text.styles.d.ts +15 -15
  38. package/dist/Elements/Item/Text/Text.styles.js +68 -112
  39. package/dist/Elements/Item/Text/Text.types.d.ts +3 -3
  40. package/dist/Elements/Item/Text/Text.types.js +1 -1
  41. package/dist/Elements/SubMenu/SubMenu.d.ts +2 -3
  42. package/dist/Elements/SubMenu/SubMenu.js +44 -89
  43. package/dist/Elements/index.js +4 -1
  44. package/dist/Menu.d.ts +6 -8
  45. package/dist/Menu.js +71 -136
  46. package/dist/Menu.styles.d.ts +4 -4
  47. package/dist/Menu.styles.js +26 -76
  48. package/dist/Menu.types.d.ts +4 -4
  49. package/dist/Menu.types.js +22 -22
  50. package/dist/assets/style/index-tn0RQdqM.css +0 -0
  51. package/dist/hooks/useTemporaryLabel.d.ts +1 -1
  52. package/dist/hooks/useTemporaryLabel.js +12 -13
  53. package/dist/index.js +25 -18
  54. package/dist/modules.d.js +1 -1
  55. package/dist/modules.d.ts +0 -0
  56. package/dist/utils/getCopyConfig.d.ts +2 -2
  57. package/dist/utils/getCopyConfig.js +21 -17
  58. package/package.json +11 -10
@@ -1,43 +1,29 @@
1
- import MenuItem from 'antd/lib/menu/MenuItem';
2
- import styled, { css } from 'styled-components';
3
- import { IconContainer } from '@synerise/ds-icon';
4
- import { ItemSize } from '../../../Menu.types';
5
- var INDENT_LEVEL_STEP = 16;
6
- var TRANSITION_FN = '0.2s ease-out';
7
- var calculateIndent = function calculateIndent(indentLevel) {
8
- var indentLevelPadding = indentLevel && Number(indentLevel) > 0 ? indentLevel * INDENT_LEVEL_STEP : 0;
1
+ import MenuItem from "antd/lib/menu/MenuItem";
2
+ import styled, { css } from "styled-components";
3
+ import { IconContainer } from "@synerise/ds-icon";
4
+ import { ItemSize } from "../../../Menu.types.js";
5
+ const INDENT_LEVEL_STEP = 16;
6
+ const TRANSITION_FN = "0.2s ease-out";
7
+ const calculateIndent = (indentLevel) => {
8
+ const indentLevelPadding = indentLevel && Number(indentLevel) > 0 ? indentLevel * INDENT_LEVEL_STEP : 0;
9
9
  return indentLevelPadding;
10
10
  };
11
- var hiddenElementStyle = function hiddenElementStyle() {
12
- return css(["opacity:0;pointer-events:none;"]);
13
- };
14
- var visibleElementStyle = function visibleElementStyle() {
15
- return css(["opacity:1;pointer-events:all;"]);
16
- };
17
- export var ArrowRight = styled.div.withConfig({
11
+ const hiddenElementStyle = () => css(["opacity:0;pointer-events:none;"]);
12
+ const visibleElementStyle = () => css(["opacity:1;pointer-events:all;"]);
13
+ const ArrowRight = /* @__PURE__ */ styled.div.withConfig({
18
14
  displayName: "Textstyles__ArrowRight",
19
15
  componentId: "sc-dgb761-0"
20
- })(["transition:all ", ";opacity:", ";"], TRANSITION_FN, function (props) {
21
- return props.disabled ? '1' : '0';
22
- });
23
- export var Inner = styled.div.withConfig({
16
+ })(["transition:all ", ";opacity:", ";"], TRANSITION_FN, (props) => props.disabled ? "1" : "0");
17
+ const Inner = /* @__PURE__ */ styled.div.withConfig({
24
18
  displayName: "Textstyles__Inner",
25
19
  componentId: "sc-dgb761-1"
26
- })(["padding-left:", ";width:100%;display:flex;"], function (props) {
27
- return calculateIndent(props.indentLevel) + "px";
28
- });
29
- export var PrefixelWrapper = styled.div.withConfig({
20
+ })(["padding-left:", ";width:100%;display:flex;"], (props) => `${calculateIndent(props.indentLevel)}px`);
21
+ const PrefixelWrapper = /* @__PURE__ */ styled.div.withConfig({
30
22
  displayName: "Textstyles__PrefixelWrapper",
31
23
  componentId: "sc-dgb761-2"
32
- })(["display:flex;", ";transition:opacity ", ";margin-top:-7px;margin-bottom:-7px;margin-left:-4px;margin-right:12px;align-items:center;", ""], function (props) {
33
- return props.visible ? visibleElementStyle() : hiddenElementStyle();
34
- }, TRANSITION_FN, function (props) {
35
- return !!props.disabled && "svg {fill: " + props.theme.palette['grey-600'] + "};";
36
- });
37
- var disableOrdering = function disableOrdering() {
38
- return css(["&::before{content:none;}"]);
39
- };
40
- var applySizeStyles = function applySizeStyles(props) {
24
+ })(["display:flex;", ";transition:opacity ", ";margin-top:-7px;margin-bottom:-7px;margin-left:-4px;margin-right:12px;align-items:center;", ""], (props) => props.visible ? visibleElementStyle() : hiddenElementStyle(), TRANSITION_FN, (props) => !!props.disabled && `svg {fill: ${props.theme.palette["grey-600"]}};`);
25
+ const disableOrdering = () => css(["&::before{content:none;}"]);
26
+ const applySizeStyles = (props) => {
41
27
  if (props.size === ItemSize.LARGE) {
42
28
  return css(["&.large{min-height:50px;}"]);
43
29
  }
@@ -46,107 +32,77 @@ var applySizeStyles = function applySizeStyles(props) {
46
32
  }
47
33
  return css([""]);
48
34
  };
49
- export var Wrapper = styled(MenuItem).withConfig({
35
+ const Wrapper = /* @__PURE__ */ styled(MenuItem).withConfig({
50
36
  displayName: "Textstyles__Wrapper",
51
37
  componentId: "sc-dgb761-3"
52
- })(["&&&{", " ", " ", ";color:", ";opacity:", ";cursor:", ";padding-right:12px;font-weight:500;border-radius:3px;display:flex;align-items:center;margin:0;transition:background-color ", ";padding-left:12px;", " ", " > .-title-content,> .ant-menu-title-content{display:flex;flex-grow:1;max-width:100%;}&.ant-menu-item-only-child,&.-item-only-child{margin-bottom:0px;}&.ant-menu-item-selected,&.-item-selected{background:", ";color:", ";.ds-menu-prefix > .ds-icon > svg{fill:", ";}&::before{color:", ";}&:focus,&:active{background:", ";&::before{color:", ";}}&::after{content:none;}}&.ant-menu-item-disabled,&.-item-disabled,&.ant-menu-submenu-disabled,&.-submenu-disabled{color:", " !important;}& .ds-menu-prefix > * > .ant-avatar::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:", ";opacity:0.05;border-radius:inherit;}& .ds-checkbox{padding:0px;}& .ds-checkbox > .ant-checkbox-wrapper{padding:0px;}& .ds-tag{margin:0;}&:focus:not(:active){box-shadow:", ";color:", ";background:", ";", " > .ds-icon > svg{fill:", ";}}", " &:active{&&{background:", ";}}&{.ds-icon{height:18px;display:flex;align-items:center;}}", " > .ds-icon > svg{", "}&:focus{color:", ";", "{opacity:1;svg{fill:", ";}}}&:hover{& .ds-menu-prefix > * > .ant-avatar::before,.ds-menu-prefix > .ant-badge::before,.ds-menu-prefix > .ant-avatar::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:transparent;opacity:0.3;border-radius:inherit;box-sizing:border-box;}& .ds-menu-prefix > * > .ant-avatar::after,.ds-menu-prefix > .ant-badge::after,.ds-menu-prefix > .ant-avatar::after{opacity:0.1;}", "{opacity:1;svg{fill:", ";}}", "}}"], function (props) {
53
- return !props.description && props.size === ItemSize.DEFAULT && "max-height: 32px;";
54
- }, function (props) {
55
- return props.size === ItemSize.LARGE && "min-height: 50px;";
56
- }, function (props) {
57
- return props.ordered ? '' : disableOrdering();
58
- }, function (props) {
59
- return props.theme.palette['grey-700'];
60
- }, function (props) {
61
- return props.disabled ? '0.4' : '1';
62
- }, function (props) {
63
- return props.disabled ? 'not-allowed' : 'pointer';
64
- }, TRANSITION_FN, function (props) {
65
- return props.disabled ? "\n & > :active {\n pointer-events: none\n }" : '';
66
- }, function (props) {
67
- return props.size && applySizeStyles(props);
68
- }, function (props) {
69
- return props.theme.palette['blue-050'];
70
- }, function (props) {
71
- return props.theme.palette['blue-600'];
72
- }, function (props) {
73
- return props.theme.palette['blue-600'];
74
- }, function (props) {
75
- return props.theme.palette['blue-600'];
76
- }, function (props) {
77
- return props.theme.palette['grey-050'];
78
- }, function (props) {
79
- return props.theme.palette['grey-600'];
80
- }, function (props) {
81
- return props.theme.palette['grey-600'];
82
- }, function (props) {
83
- return props.theme.palette['grey-800'];
84
- }, function (props) {
85
- return !props.disabled && "inset 0 0 0 2px " + props.theme.palette['blue-600'] + " ";
86
- }, function (props) {
87
- return props.theme.palette['grey-700'];
88
- }, function (props) {
89
- return props.description ? props.theme.palette.white : props.theme.palette['grey-050'];
90
- }, PrefixelWrapper, function (props) {
91
- return props.theme.palette['grey-700'];
92
- }, function (props) {
93
- return !props.disabled && css(["&:focus:active,&:active{background:", ";&&{color:", ";.ds-menu-prefix{", " > svg{fill:", ";}}}}"], props.theme.palette['grey-100'], props.theme.palette['blue-600'], IconContainer, props.theme.palette['blue-600']);
94
- }, function (props) {
95
- return props.theme.palette['blue-050'];
96
- }, PrefixelWrapper, function (props) {
97
- return !props.disabled && "\n fill: " + props.theme.palette['grey-600'] + ";\n ";
98
- }, function (props) {
99
- return props.description ? props.theme.palette['blue-600'] + " !important" : 'inherit';
100
- }, ArrowRight, function (props) {
101
- return props.disabled ? props.theme.palette['grey-700'] : props.theme.palette['blue-600'];
102
- }, ArrowRight, function (props) {
103
- return props.disabled ? props.theme.palette['grey-600'] : props.theme.palette['blue-600'];
104
- }, function (props) {
105
- return !props.disabled && "\n .ds-menu-prefix { " + IconContainer + " > svg {\n fill: " + props.theme.palette['blue-600'] + " !important;\n }}\n color: " + props.theme.palette['blue-600'] + " !important;\n background: " + props.theme.palette['grey-050'] + ";\n ";
106
- });
107
- export var Content = styled.div.withConfig({
38
+ })(["&&&{", " ", " ", ";color:", ";opacity:", ";cursor:", ";padding-right:12px;font-weight:500;border-radius:3px;display:flex;align-items:center;margin:0;transition:background-color ", ";padding-left:12px;", " ", " > .-title-content,> .ant-menu-title-content{display:flex;flex-grow:1;max-width:100%;}&.ant-menu-item-only-child,&.-item-only-child{margin-bottom:0px;}&.ant-menu-item-selected,&.-item-selected{background:", ";color:", ";.ds-menu-prefix > .ds-icon > svg{fill:", ";}&::before{color:", ";}&:focus,&:active{background:", ";&::before{color:", ";}}&::after{content:none;}}&.ant-menu-item-disabled,&.-item-disabled,&.ant-menu-submenu-disabled,&.-submenu-disabled{color:", " !important;}& .ds-menu-prefix > * > .ant-avatar::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:", ";opacity:0.05;border-radius:inherit;}& .ds-checkbox{padding:0px;}& .ds-checkbox > .ant-checkbox-wrapper{padding:0px;}& .ds-tag{margin:0;}&:focus:not(:active){box-shadow:", ";color:", ";background:", ";", " > .ds-icon > svg{fill:", ";}}", " &:active{&&{background:", ";}}&{.ds-icon{height:18px;display:flex;align-items:center;}}", " > .ds-icon > svg{", "}&:focus{color:", ";", "{opacity:1;svg{fill:", ";}}}&:hover{& .ds-menu-prefix > * > .ant-avatar::before,.ds-menu-prefix > .ant-badge::before,.ds-menu-prefix > .ant-avatar::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:transparent;opacity:0.3;border-radius:inherit;box-sizing:border-box;}& .ds-menu-prefix > * > .ant-avatar::after,.ds-menu-prefix > .ant-badge::after,.ds-menu-prefix > .ant-avatar::after{opacity:0.1;}", "{opacity:1;svg{fill:", ";}}", "}}"], (props) => !props.description && props.size === ItemSize.DEFAULT && `max-height: 32px;`, (props) => props.size === ItemSize.LARGE && `min-height: 50px;`, (props) => props.ordered ? "" : disableOrdering(), (props) => props.theme.palette["grey-700"], (props) => props.disabled ? "0.4" : "1", (props) => props.disabled ? "not-allowed" : "pointer", TRANSITION_FN, (props) => props.disabled ? `
39
+ & > :active {
40
+ pointer-events: none
41
+ }` : "", (props) => props.size && applySizeStyles(props), (props) => props.theme.palette["blue-050"], (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["blue-600"], (props) => props.theme.palette["grey-050"], (props) => props.theme.palette["grey-600"], (props) => props.theme.palette["grey-600"], (props) => props.theme.palette["grey-800"], (props) => !props.disabled && `inset 0 0 0 2px ${props.theme.palette["blue-600"]} `, (props) => props.theme.palette["grey-700"], (props) => props.description ? props.theme.palette.white : props.theme.palette["grey-050"], PrefixelWrapper, (props) => props.theme.palette["grey-700"], (props) => !props.disabled && css(["&:focus:active,&:active{background:", ";&&{color:", ";.ds-menu-prefix{", " > svg{fill:", ";}}}}"], props.theme.palette["grey-100"], props.theme.palette["blue-600"], IconContainer, props.theme.palette["blue-600"]), (props) => props.theme.palette["blue-050"], PrefixelWrapper, (props) => !props.disabled && `
42
+ fill: ${props.theme.palette["grey-600"]};
43
+ `, (props) => props.description ? `${props.theme.palette["blue-600"]} !important` : "inherit", ArrowRight, (props) => props.disabled ? props.theme.palette["grey-700"] : props.theme.palette["blue-600"], ArrowRight, (props) => props.disabled ? props.theme.palette["grey-600"] : props.theme.palette["blue-600"], (props) => !props.disabled && `
44
+ .ds-menu-prefix { ${IconContainer} > svg {
45
+ fill: ${props.theme.palette["blue-600"]} !important;
46
+ }}
47
+ color: ${props.theme.palette["blue-600"]} !important;
48
+ background: ${props.theme.palette["grey-050"]};
49
+ `);
50
+ const Content = /* @__PURE__ */ styled.div.withConfig({
108
51
  displayName: "Textstyles__Content",
109
52
  componentId: "sc-dgb761-4"
110
- })(["text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:13px;line-height:1.39;min-height:18px;align-items:center;flex-wrap:wrap;user-select:none;", ""], function (props) {
111
- return !!props.highlight && "\n font-weight:400;\n & > .search-highlight{\n font-weight:600;\n }\n ";
112
- });
113
- export var Description = styled.div.withConfig({
53
+ })(["text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:13px;line-height:1.39;min-height:18px;align-items:center;flex-wrap:wrap;user-select:none;", ""], (props) => !!props.highlight && `
54
+ font-weight:400;
55
+ & > .search-highlight{
56
+ font-weight:600;
57
+ }
58
+ `);
59
+ const Description = /* @__PURE__ */ styled.div.withConfig({
114
60
  displayName: "Textstyles__Description",
115
61
  componentId: "sc-dgb761-5"
116
- })(["text-overflow:ellipsis;overflow:hidden;color:", ";font-weight:normal;line-height:1.39;font-size:13px;width:100%;"], function (props) {
117
- return props.theme.palette['grey-600'];
118
- });
119
- export var SuffixWraper = styled.div.withConfig({
62
+ })(["text-overflow:ellipsis;overflow:hidden;color:", ";font-weight:normal;line-height:1.39;font-size:13px;width:100%;"], (props) => props.theme.palette["grey-600"]);
63
+ const SuffixWraper = /* @__PURE__ */ styled.div.withConfig({
120
64
  displayName: "Textstyles__SuffixWraper",
121
65
  componentId: "sc-dgb761-6"
122
- })(["justify-content:flex-end;display:flex;transition:opacity ", ";", ";", ";svg{margin-right:-4px;}"], TRANSITION_FN, function (props) {
123
- return props.visible ? visibleElementStyle() : hiddenElementStyle();
124
- }, function (props) {
125
- return !!props.disabled && "svg {\n fill:" + props.theme.palette['grey-600'] + "\n }\n ";
126
- });
127
- export var ContentWrapper = styled.div.withConfig({
66
+ })(["justify-content:flex-end;display:flex;transition:opacity ", ";", ";", ";svg{margin-right:-4px;}"], TRANSITION_FN, (props) => props.visible ? visibleElementStyle() : hiddenElementStyle(), (props) => !!props.disabled && `svg {
67
+ fill:${props.theme.palette["grey-600"]}
68
+ }
69
+ `);
70
+ const ContentWrapper = /* @__PURE__ */ styled.div.withConfig({
128
71
  displayName: "Textstyles__ContentWrapper",
129
72
  componentId: "sc-dgb761-7"
130
73
  })(["padding:7px 0;width:100%;display:flex;align-items:center;flex-wrap:nowrap;user-select:none;"]);
131
- export var ContentDivider = styled.div.withConfig({
74
+ const ContentDivider = /* @__PURE__ */ styled.div.withConfig({
132
75
  displayName: "Textstyles__ContentDivider",
133
76
  componentId: "sc-dgb761-8"
134
77
  })(["flex:1;"]);
135
- export var DynamicLabelMain = styled.div.withConfig({
78
+ const DynamicLabelMain = /* @__PURE__ */ styled.div.withConfig({
136
79
  displayName: "Textstyles__DynamicLabelMain",
137
80
  componentId: "sc-dgb761-9"
138
81
  })([""]);
139
- export var DynamicLabelAlternate = styled.div.withConfig({
82
+ const DynamicLabelAlternate = /* @__PURE__ */ styled.div.withConfig({
140
83
  displayName: "Textstyles__DynamicLabelAlternate",
141
84
  componentId: "sc-dgb761-10"
142
85
  })([""]);
143
- export var DynamicLabelWrapper = styled.div.withConfig({
86
+ const DynamicLabelWrapper = /* @__PURE__ */ styled.div.withConfig({
144
87
  displayName: "Textstyles__DynamicLabelWrapper",
145
88
  componentId: "sc-dgb761-11"
146
- })(["", ""], function (props) {
147
- return props.showAlternative ? css(["", "{height:0;visibility:hidden;}", "{height:auto;visibility:visible;}"], DynamicLabelMain, DynamicLabelAlternate) : css(["", "{height:auto;visibility:visible;}", "{height:0;visibility:hidden;}"], DynamicLabelMain, DynamicLabelAlternate);
148
- });
149
- export var PropagationStopper = styled.div.withConfig({
89
+ })(["", ""], (props) => props.showAlternative ? css(["", "{height:0;visibility:hidden;}", "{height:auto;visibility:visible;}"], DynamicLabelMain, DynamicLabelAlternate) : css(["", "{height:auto;visibility:visible;}", "{height:0;visibility:hidden;}"], DynamicLabelMain, DynamicLabelAlternate));
90
+ const PropagationStopper = /* @__PURE__ */ styled.div.withConfig({
150
91
  displayName: "Textstyles__PropagationStopper",
151
92
  componentId: "sc-dgb761-12"
152
- })(["display:contents;"]);
93
+ })(["display:contents;"]);
94
+ export {
95
+ ArrowRight,
96
+ Content,
97
+ ContentDivider,
98
+ ContentWrapper,
99
+ Description,
100
+ DynamicLabelAlternate,
101
+ DynamicLabelMain,
102
+ DynamicLabelWrapper,
103
+ Inner,
104
+ PrefixelWrapper,
105
+ PropagationStopper,
106
+ SuffixWraper,
107
+ Wrapper
108
+ };
@@ -1,6 +1,6 @@
1
- import type { MenuProps } from 'antd/lib/menu';
2
- import type { CSSProperties, ReactNode } from 'react';
3
- import type { MenuItemProps } from '../../../Menu.types';
1
+ import { MenuProps } from 'antd/lib/menu';
2
+ import { CSSProperties, ReactNode } from 'react';
3
+ import { MenuItemProps } from '../../../Menu.types';
4
4
  export type AddonRenderer = (hovered: boolean) => ReactNode;
5
5
  export type BasicItemProps = {
6
6
  className?: string;
@@ -1 +1 @@
1
- export {};
1
+
@@ -1,6 +1,5 @@
1
- import React from 'react';
2
- import '@synerise/ds-core/dist/js/style';
3
- import { type MenuItemProps, type SubMenuProps, type SubMenuState } from '../../Menu.types';
1
+ import { default as React } from 'react';
2
+ import { MenuItemProps, SubMenuProps, SubMenuState } from '../../Menu.types';
4
3
  declare class SubMenuItem extends React.PureComponent<SubMenuProps & MenuItemProps, SubMenuState> {
5
4
  constructor(props: SubMenuProps & MenuItemProps);
6
5
  render(): React.JSX.Element;
@@ -1,91 +1,46 @@
1
- var _excluded = ["text", "prefixel", "suffixel", "subMenu", "disabled", "danger", "ordered", "onTitleClick", "menuItemKey", "selectedKeys", "suffixVisibilityTrigger", "prefixVisibilityTrigger", "size", "description", "ItemComponent"];
2
- 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); }
3
- 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; }
4
- function _inheritsLoose(t, o) { t.prototype = Object.create(o.prototype), t.prototype.constructor = t, _setPrototypeOf(t, o); }
5
- function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
6
- import classNames from 'classnames';
7
- import React from 'react';
8
- import { v4 as uuid } from 'uuid';
9
- import '@synerise/ds-core/dist/js/style';
10
- import * as S from '../../Menu.styles';
11
- import SubmenuText from '../Item/SubmenuText/SubmenuText';
12
- var SubMenuItem = /*#__PURE__*/function (_React$PureComponent) {
13
- function SubMenuItem(props) {
14
- var _this;
15
- _this = _React$PureComponent.call(this, props) || this;
16
- // eslint-disable-next-line react/state-in-constructor
17
- _this.state = {
18
- uuidKey: uuid()
1
+ import { jsx } from "react/jsx-runtime";
2
+ import classNames from "classnames";
3
+ import React from "react";
4
+ import { v4 } from "uuid";
5
+ import { SubMenuItem as SubMenuItem$1 } from "../../Menu.styles.js";
6
+ import SubmenuText from "../Item/SubmenuText/SubmenuText.js";
7
+ class SubMenuItem extends React.PureComponent {
8
+ constructor(props) {
9
+ super(props);
10
+ this.state = {
11
+ uuidKey: v4()
19
12
  };
20
- return _this;
21
13
  }
22
- _inheritsLoose(SubMenuItem, _React$PureComponent);
23
- var _proto = SubMenuItem.prototype;
24
- _proto.render = function render() {
25
- var _this$props = this.props,
26
- text = _this$props.text,
27
- prefixel = _this$props.prefixel,
28
- suffixel = _this$props.suffixel,
29
- subMenu = _this$props.subMenu,
30
- disabled = _this$props.disabled,
31
- danger = _this$props.danger,
32
- ordered = _this$props.ordered,
33
- onTitleClick = _this$props.onTitleClick,
34
- menuItemKey = _this$props.menuItemKey,
35
- selectedKeys = _this$props.selectedKeys,
36
- suffixVisibilityTrigger = _this$props.suffixVisibilityTrigger,
37
- prefixVisibilityTrigger = _this$props.prefixVisibilityTrigger,
38
- size = _this$props.size,
39
- description = _this$props.description,
40
- ItemComponent = _this$props.ItemComponent,
41
- rest = _objectWithoutPropertiesLoose(_this$props, _excluded);
42
- var uuidKey = this.state.uuidKey;
43
- return /*#__PURE__*/React.createElement(S.SubMenuItem, _extends({
44
- title: /*#__PURE__*/React.createElement(SubmenuText, {
45
- key: (menuItemKey || uuidKey) + "-title",
46
- prefixel: prefixel,
47
- suffixel: suffixel,
48
- onClick: onTitleClick,
49
- disabled: disabled,
50
- suffixVisibilityTrigger: suffixVisibilityTrigger,
51
- prefixVisibilityTrigger: prefixVisibilityTrigger,
52
- size: size,
53
- description: description
54
- }, text),
55
- key: menuItemKey || uuidKey,
56
- onTitleClick: onTitleClick,
57
- danger: danger,
58
- ordered: ordered,
59
- disabled: disabled,
60
- tabIndex: !disabled ? 0 : -1
61
- }, rest, {
62
- className: classNames('ds-menu-item', {
63
- 'ant-menu-item-selected': !!menuItemKey && !!selectedKeys && selectedKeys.includes(menuItemKey)
64
- })
65
- }), Boolean(subMenu) &&
66
- // @ts-expect-error Type 'SubMenuProps' is missing the following properties from type 'MenuInfo': keyPath, item, domEvent
67
- subMenu.map(function (subItem, index) {
68
- return /*#__PURE__*/React.createElement(ItemComponent, _extends({
69
- parent: subItem.parent,
70
- prefixel: subItem.prefixel,
71
- suffixel: subItem.suffixel,
72
- disabled: subItem.disabled,
73
- text: subItem.text,
74
- danger: subItem.danger,
75
- subMenu: subItem.subMenu,
76
- ordered: subItem.ordered === undefined ? ordered : subItem.ordered,
77
- description: subItem.description,
78
- suffixVisibilityTrigger: subItem.suffixVisibilityTrigger,
79
- prefixVisibilityTrigger: subItem.prefixVisibilityTrigger,
80
- onClick: function onClick() {
81
- subItem.onClick && subItem.onClick(subItem);
82
- },
83
- key: subItem.key || uuidKey + "-" + index,
84
- menuItemKey: subItem.key || uuidKey + "-" + index,
85
- selectedKeys: selectedKeys
86
- }, subItem));
87
- }));
88
- };
89
- return SubMenuItem;
90
- }(React.PureComponent);
91
- export default SubMenuItem;
14
+ render() {
15
+ const {
16
+ text,
17
+ prefixel,
18
+ suffixel,
19
+ subMenu,
20
+ disabled,
21
+ danger,
22
+ ordered,
23
+ onTitleClick,
24
+ menuItemKey,
25
+ selectedKeys,
26
+ suffixVisibilityTrigger,
27
+ prefixVisibilityTrigger,
28
+ size,
29
+ description,
30
+ ItemComponent,
31
+ ...rest
32
+ } = this.props;
33
+ const {
34
+ uuidKey
35
+ } = this.state;
36
+ return /* @__PURE__ */ jsx(SubMenuItem$1, { title: /* @__PURE__ */ jsx(SubmenuText, { prefixel, suffixel, onClick: onTitleClick, disabled, suffixVisibilityTrigger, prefixVisibilityTrigger, size, description, children: text }, `${menuItemKey || uuidKey}-title`), onTitleClick, danger, ordered, disabled, tabIndex: !disabled ? 0 : -1, ...rest, className: classNames("ds-menu-item", {
37
+ "ant-menu-item-selected": !!menuItemKey && !!selectedKeys && selectedKeys.includes(menuItemKey)
38
+ }), children: Boolean(subMenu) && // @ts-expect-error Type 'SubMenuProps' is missing the following properties from type 'MenuInfo': keyPath, item, domEvent
39
+ subMenu.map((subItem, index) => /* @__PURE__ */ jsx(ItemComponent, { parent: subItem.parent, prefixel: subItem.prefixel, suffixel: subItem.suffixel, disabled: subItem.disabled, text: subItem.text, danger: subItem.danger, subMenu: subItem.subMenu, ordered: subItem.ordered === void 0 ? ordered : subItem.ordered, description: subItem.description, suffixVisibilityTrigger: subItem.suffixVisibilityTrigger, prefixVisibilityTrigger: subItem.prefixVisibilityTrigger, onClick: () => {
40
+ subItem.onClick && subItem.onClick(subItem);
41
+ }, menuItemKey: subItem.key || `${uuidKey}-${index}`, selectedKeys, ...subItem }, subItem.key || `${uuidKey}-${index}`)) }, menuItemKey || uuidKey);
42
+ }
43
+ }
44
+ export {
45
+ SubMenuItem as default
46
+ };
@@ -1 +1,4 @@
1
- export { default as TextItem } from './Item/Text/Text';
1
+ import { default as default2 } from "./Item/Text/Text.js";
2
+ export {
3
+ default2 as TextItem
4
+ };
package/dist/Menu.d.ts CHANGED
@@ -1,12 +1,10 @@
1
- import { Component, type ReactNode } from 'react';
2
- import '@synerise/ds-core/dist/js/style';
3
- import Breadcrumb from './Elements/Breadcrumb/Breadcrumb';
1
+ import { Component, ReactNode } from 'react';
2
+ import { default as Breadcrumb } from './Elements/Breadcrumb/Breadcrumb';
4
3
  import { Divider } from './Elements/Divider/Divider';
5
- import Header from './Elements/Header/Header';
6
- import MenuItem from './Elements/Item/MenuItem';
4
+ import { default as Header } from './Elements/Header/Header';
5
+ import { default as MenuItem } from './Elements/Item/MenuItem';
6
+ import { AntdMenuProps } from './Menu.types';
7
7
  import * as S from './Menu.styles';
8
- import type { AntdMenuProps } from './Menu.types';
9
- import './style/index.less';
10
8
  export declare class Menu extends Component<AntdMenuProps, {
11
9
  allItemsVisible: boolean;
12
10
  }> {
@@ -14,7 +12,7 @@ export declare class Menu extends Component<AntdMenuProps, {
14
12
  static Breadcrumb: typeof Breadcrumb;
15
13
  static Header: typeof Header;
16
14
  static ItemGroup: typeof S.AntdMenu.ItemGroup;
17
- static SubMenu: typeof import("antd/lib/menu/SubMenu").default;
15
+ static SubMenu: typeof import('antd/lib/menu/SubMenu').default;
18
16
  static Divider: typeof Divider;
19
17
  state: {
20
18
  allItemsVisible: boolean;