linear-react-components-ui 1.1.20-beta.10 → 1.1.20-beta.12

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 (155) hide show
  1. package/lib/alerts/BaseAlert.js +1 -1
  2. package/lib/alerts/Message.js +1 -1
  3. package/lib/assets/styles/button.scss +1 -0
  4. package/lib/assets/styles/select.scss +1 -2
  5. package/lib/assets/styles/table.scss +6 -10
  6. package/lib/assets/styles/toolbar.scss +0 -3
  7. package/lib/avatar/index.js +9 -8
  8. package/lib/badge/index.js +4 -4
  9. package/lib/buttons/DangerButton.js +1 -1
  10. package/lib/buttons/DefaultButton.js +17 -5
  11. package/lib/buttons/InfoButton.js +1 -1
  12. package/lib/buttons/PrimaryButton.js +1 -1
  13. package/lib/buttons/SuccessButton.js +1 -1
  14. package/lib/buttons/WarningButton.js +1 -1
  15. package/lib/buttons/button_container/index.js +1 -1
  16. package/lib/buttons/split_button/index.js +1 -1
  17. package/lib/buttons/types.d.ts +1 -0
  18. package/lib/calendar/base/Day.js +1 -1
  19. package/lib/calendar/base/Month.js +1 -1
  20. package/lib/calendar/base/helpers.js +2 -2
  21. package/lib/calendar/base/index.js +1 -1
  22. package/lib/dialog/Custom.js +1 -1
  23. package/lib/dialog/base/Content.d.ts +1 -1
  24. package/lib/dialog/base/Content.js +2 -3
  25. package/lib/dialog/base/Header.js +2 -2
  26. package/lib/dialog/base/index.js +4 -6
  27. package/lib/dialog/form/index.js +3 -8
  28. package/lib/dialog/types.d.ts +4 -34
  29. package/lib/drawer/Drawer.js +3 -3
  30. package/lib/drawer/Header.js +1 -1
  31. package/lib/dropdown/Popup.d.ts +1 -1
  32. package/lib/dropdown/Popup.js +43 -22
  33. package/lib/dropdown/helper.js +1 -1
  34. package/lib/dropdown/types.d.ts +6 -2
  35. package/lib/dropdown/withDropdown.js +7 -6
  36. package/lib/fieldset/index.js +7 -7
  37. package/lib/form/Field.js +24 -11
  38. package/lib/form/FieldArray.js +25 -10
  39. package/lib/form/FieldNumber.js +21 -9
  40. package/lib/form/FieldPeriod.js +5 -5
  41. package/lib/form/index.js +6 -9
  42. package/lib/form/types.d.ts +6 -10
  43. package/lib/form/withFieldHOC.js +2 -2
  44. package/lib/gridlayout/GridCol.js +5 -5
  45. package/lib/gridlayout/GridRow.js +4 -1
  46. package/lib/gridlayout/types.d.ts +1 -1
  47. package/lib/hint/index.js +7 -1
  48. package/lib/icons/helper.d.ts +0 -20
  49. package/lib/icons/helper.js +0 -20
  50. package/lib/icons/index.js +24 -27
  51. package/lib/inputs/base/InputTextBase.js +6 -9
  52. package/lib/inputs/base/Label.js +1 -1
  53. package/lib/inputs/base/helpers.js +7 -3
  54. package/lib/inputs/date/helpers.js +4 -1
  55. package/lib/inputs/date/index.js +9 -15
  56. package/lib/inputs/errorMessage/index.js +1 -1
  57. package/lib/inputs/file/DefaultFile.js +5 -6
  58. package/lib/inputs/file/DragDropFile.js +15 -17
  59. package/lib/inputs/file/File.js +3 -4
  60. package/lib/inputs/mask/BaseMask.js +1 -1
  61. package/lib/inputs/multiSelect/Dropdown.js +9 -10
  62. package/lib/inputs/multiSelect/helper.js +1 -2
  63. package/lib/inputs/multiSelect/index.js +7 -9
  64. package/lib/inputs/number/BaseNumber.d.ts +1 -1
  65. package/lib/inputs/number/BaseNumber.js +9 -2
  66. package/lib/inputs/number/Currency.d.ts +1 -1
  67. package/lib/inputs/number/Currency.js +11 -4
  68. package/lib/inputs/number/index.js +1 -1
  69. package/lib/inputs/period/PeriodList.js +1 -1
  70. package/lib/inputs/period/helper.js +3 -1
  71. package/lib/inputs/period/index.js +9 -14
  72. package/lib/inputs/search/index.js +1 -1
  73. package/lib/inputs/select/Dropdown.js +1 -1
  74. package/lib/inputs/select/helper.js +10 -13
  75. package/lib/inputs/select/multiple/Selecteds.js +1 -1
  76. package/lib/inputs/select/multiple/index.js +12 -19
  77. package/lib/inputs/select/simple/index.js +13 -22
  78. package/lib/inputs/select/types.d.ts +0 -1
  79. package/lib/inputs/textarea/index.js +1 -1
  80. package/lib/internals/withTooltip.js +9 -9
  81. package/lib/labelMessages/index.js +4 -3
  82. package/lib/labels/DefaultLabel.js +4 -1
  83. package/lib/labels/label_container/index.js +1 -1
  84. package/lib/list/Header.js +1 -1
  85. package/lib/list/Item.js +9 -7
  86. package/lib/list/index.js +1 -1
  87. package/lib/menus/float/MenuItem.js +2 -2
  88. package/lib/menus/float/SubMenuContainer.js +1 -1
  89. package/lib/menus/float/index.js +1 -1
  90. package/lib/menus/sidenav/ExpandMenu.js +1 -1
  91. package/lib/menus/sidenav/NavMenuGroup.js +1 -1
  92. package/lib/menus/sidenav/NavMenuItem.js +7 -9
  93. package/lib/menus/sidenav/NavSubMenuItem.js +1 -1
  94. package/lib/menus/sidenav/helpers.js +1 -1
  95. package/lib/menus/sidenav/index.js +5 -5
  96. package/lib/panel/Content.js +5 -7
  97. package/lib/panel/Default.js +2 -2
  98. package/lib/panel/Header.js +3 -3
  99. package/lib/permissionValidations.js +1 -1
  100. package/lib/popover/PopoverText.d.ts +3 -2
  101. package/lib/popover/PopoverText.js +5 -8
  102. package/lib/popover/PopoverTitle.d.ts +1 -0
  103. package/lib/popover/index.d.ts +3 -5
  104. package/lib/popover/index.js +20 -14
  105. package/lib/popover/types.d.ts +12 -1
  106. package/lib/progress/Bar.js +6 -6
  107. package/lib/radio/index.js +2 -2
  108. package/lib/shortcuts/index.js +1 -1
  109. package/lib/skeleton/SkeletonContainer.js +2 -1
  110. package/lib/skeleton/index.js +4 -1
  111. package/lib/spinner/index.js +2 -2
  112. package/lib/split/Split.js +1 -1
  113. package/lib/split/SplitSide.js +3 -3
  114. package/lib/table/Body.js +3 -3
  115. package/lib/table/Header.js +8 -11
  116. package/lib/table/HeaderColumn.d.ts +1 -1
  117. package/lib/table/HeaderColumn.js +6 -7
  118. package/lib/table/Row.js +3 -3
  119. package/lib/table/RowColumn.js +2 -3
  120. package/lib/table/index.js +6 -1
  121. package/lib/table/types.d.ts +2 -4
  122. package/lib/tabs/DropdownTabs.js +1 -1
  123. package/lib/tabs/Menu.js +1 -1
  124. package/lib/tabs/MenuTabs.js +2 -2
  125. package/lib/tabs/Panel.js +5 -7
  126. package/lib/tabs/context.js +3 -6
  127. package/lib/textContent/index.js +1 -1
  128. package/lib/toolbar/ButtonBar.js +1 -1
  129. package/lib/toolbar/index.js +1 -1
  130. package/lib/tooltip/index.js +7 -7
  131. package/lib/treetable/Body.js +1 -1
  132. package/lib/treetable/Header.js +2 -2
  133. package/lib/treetable/Row.js +8 -8
  134. package/lib/treeview/Header.js +1 -1
  135. package/lib/treeview/Node.js +11 -15
  136. package/lib/treeview/index.js +7 -11
  137. package/lib/treeview/types.d.ts +0 -4
  138. package/lib/uitour/index.js +6 -8
  139. package/package.json +2 -2
  140. package/lib/assets/styles/wizard.scss +0 -125
  141. package/lib/dialog/wizard/index.d.ts +0 -13
  142. package/lib/dialog/wizard/index.js +0 -74
  143. package/lib/dialog/wizard/progressbar.d.ts +0 -13
  144. package/lib/dialog/wizard/progressbar.js +0 -36
  145. package/lib/dialog/wizard/step.d.ts +0 -9
  146. package/lib/dialog/wizard/step.js +0 -22
  147. package/lib/dialog/wizard/useWizard.d.ts +0 -9
  148. package/lib/dialog/wizard/useWizard.js +0 -48
  149. package/lib/inputs/mask/imaskHOC.js +0 -203
  150. package/lib/menus/sidenav/popup_menu_help/index.js +0 -85
  151. package/lib/tabs/DropdownItems.js +0 -62
  152. package/lib/tabs/MenuItems.js +0 -70
  153. package/lib/treeview_old/Header.js +0 -29
  154. package/lib/treeview_old/Node.js +0 -68
  155. package/lib/treeview_old/index.js +0 -43
@@ -87,23 +87,23 @@ const withTooltip = WrappedComponent => {
87
87
  const targetDimensions = targetElement.current.getBoundingClientRect();
88
88
  const targetVerticalCenter = (targetDimensions.top + targetDimensions.bottom) / 2;
89
89
  const tooltipClientWidth = tooltipElement.current.clientWidth;
90
- let style = "width: ".concat(typeof width === 'string' ? width : "".concat(width, "px"));
90
+ let style = `width: ${typeof width === 'string' ? width : `${width}px`}`;
91
91
  let left = targetDimensions.left + targetDimensions.width / 2 - tooltipClientWidth / 2;
92
92
  left = Math.min(left, document.body.clientWidth - tooltipClientWidth - space);
93
- style += "; left: ".concat(Math.max(space, left), "px");
93
+ style += `; left: ${Math.max(space, left)}px`;
94
94
  switch (stateTooltipPosition) {
95
95
  case 'top':
96
96
  if (targetDimensions.top < height) {
97
97
  setStateTooltipPosition('bottom');
98
98
  } else {
99
- style += "; top: ".concat(targetDimensions.top + window.scrollY - height - 5, "px");
99
+ style += `; top: ${targetDimensions.top + window.scrollY - height - 5}px`;
100
100
  }
101
101
  break;
102
102
  case 'bottom':
103
103
  if (window.innerHeight - targetDimensions.bottom < height) {
104
104
  setStateTooltipPosition('top');
105
105
  } else {
106
- style += "; top: ".concat(targetDimensions.top + window.scrollY + targetDimensions.height + 5, "px");
106
+ style += `; top: ${targetDimensions.top + window.scrollY + targetDimensions.height + 5}px`;
107
107
  }
108
108
  break;
109
109
  case 'left':
@@ -114,16 +114,16 @@ const withTooltip = WrappedComponent => {
114
114
  setStateTooltipPosition('right');
115
115
  }
116
116
  } else {
117
- style += "; top: ".concat(targetVerticalCenter + window.scrollY - height / 2, "px");
118
- style += "; left: ".concat(targetDimensions.left - tooltipClientWidth - 6, "px");
117
+ style += `; top: ${targetVerticalCenter + window.scrollY - height / 2}px`;
118
+ style += `; left: ${targetDimensions.left - tooltipClientWidth - 6}px`;
119
119
  }
120
120
  break;
121
121
  case 'right':
122
122
  if (window.innerWidth - targetDimensions.right < tooltipClientWidth) {
123
123
  setStateTooltipPosition('left');
124
124
  } else {
125
- style += "; top: ".concat(targetVerticalCenter + window.scrollY - height / 2, "px");
126
- style += "; left: ".concat(targetDimensions.left + targetDimensions.width + 5, "px");
125
+ style += `; top: ${targetVerticalCenter + window.scrollY - height / 2}px`;
126
+ style += `; left: ${targetDimensions.left + targetDimensions.width + 5}px`;
127
127
  }
128
128
  break;
129
129
  default:
@@ -166,7 +166,7 @@ const withTooltip = WrappedComponent => {
166
166
  targetRef: getTarget
167
167
  })), showTooltip && getTooltip());
168
168
  };
169
- EnhancedComponent.displayName = "withTooltip(".concat(getDisplayName(WrappedComponent), ")");
169
+ EnhancedComponent.displayName = `withTooltip(${getDisplayName(WrappedComponent)})`;
170
170
  return EnhancedComponent;
171
171
  };
172
172
  var _default = exports.default = withTooltip;
@@ -25,7 +25,8 @@ const LabelMessages = _ref => {
25
25
  showCloseButton = false
26
26
  } = _ref;
27
27
  const [closed, setClosed] = (0, _react.useState)(false);
28
- const getClass = () => "labelmessages-component -".concat(type, " ").concat(customClass, "\n ").concat(square && '-square', " ").concat(flat && '-flat');
28
+ const getClass = () => `labelmessages-component -${type} ${customClass}
29
+ ${square && '-square'} ${flat && '-flat'}`;
29
30
  const getIcon = () => {
30
31
  if (icon) {
31
32
  return icon;
@@ -34,14 +35,14 @@ const LabelMessages = _ref => {
34
35
  name: iconName,
35
36
  size: 16,
36
37
  color: "#ffffff",
37
- customClass: "-".concat(type, "svg")
38
+ customClass: `-${type}svg`
38
39
  });
39
40
  }
40
41
  return null;
41
42
  };
42
43
  if (closed || !visible) return null;
43
44
  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
44
- className: "".concat(getClass(), " ").concat(customClass),
45
+ className: `${getClass()} ${customClass}`,
45
46
  style: style
46
47
  }, /*#__PURE__*/_react.default.createElement("div", {
47
48
  className: "labelmessagesitem text"
@@ -30,7 +30,10 @@ const DefaultLabel = _ref => {
30
30
  } = _ref;
31
31
  const options = [_permissionValidations.OPTIONS_ON_DENIED.disabled, _permissionValidations.OPTIONS_ON_DENIED.unvisible];
32
32
  const [onDenied] = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)(options, permissionAttr));
33
- const getClass = () => "label-component ".concat(className, " ").concat(customClass, " ").concat(bordered ? '-bordered' : '', " ").concat(disabled ? '-disabled' : '', "\n ").concat(skeletonize ? '-skeletonized' : '', "\n ").concat(size ? "-".concat(size) : '', "\n ").concat(iconAlign ? "icon-".concat(iconAlign) : '');
33
+ const getClass = () => `label-component ${className} ${customClass} ${bordered ? '-bordered' : ''} ${disabled ? '-disabled' : ''}
34
+ ${skeletonize ? '-skeletonized' : ''}
35
+ ${size ? `-${size}` : ''}
36
+ ${iconAlign ? `icon-${iconAlign}` : ''}`;
34
37
  const getIcon = () => {
35
38
  if (icon) {
36
39
  return icon;
@@ -13,7 +13,7 @@ const LabelContainer = _ref => {
13
13
  children
14
14
  } = _ref;
15
15
  return /*#__PURE__*/_react.default.createElement("div", {
16
- className: "lbl-container ".concat(customClass),
16
+ className: `lbl-container ${customClass}`,
17
17
  style: {
18
18
  float: position
19
19
  }
@@ -14,7 +14,7 @@ const Header = _ref => {
14
14
  customClass
15
15
  } = _ref;
16
16
  return /*#__PURE__*/_react.default.createElement("li", {
17
- className: "list-header ".concat(customClass),
17
+ className: `list-header ${customClass}`,
18
18
  style: style
19
19
  }, /*#__PURE__*/_react.default.createElement("h1", {
20
20
  className: "title"
package/lib/list/Item.js CHANGED
@@ -54,7 +54,8 @@ const Item = props => {
54
54
  const disabledByPermission = onDenied.disabled;
55
55
  const shouldDisable = () => disabled || onDenied.disabled;
56
56
  const disabledIconColor = 'rgb(193, 193, 193)';
57
- const getClass = () => "item ".concat(customClass, " ").concat(separator && 'list-separator', " ").concat(shouldDisable() && 'disabled', "\n ").concat(displayCheckbox && 'list-checkbox');
57
+ const getClass = () => `item ${customClass} ${separator && 'list-separator'} ${shouldDisable() && 'disabled'}
58
+ ${displayCheckbox && 'list-checkbox'}`;
58
59
  const getIcon = (iconName, icon) => {
59
60
  const noIconDisabledByPermission = !icon && !displayCheckbox && !leftElement && !leftIconName && !leftIcon && onDenied.disabled;
60
61
  if (icon) {
@@ -119,22 +120,23 @@ const Item = props => {
119
120
  return /*#__PURE__*/_react.default.createElement("li", _extends({
120
121
  ref: itemId && selectedItemId === itemId ? selectedItemRef : null,
121
122
  style: style,
122
- className: "item-container ".concat(hovered && 'hovered', "\n ").concat(itemId && selectedItemId === itemId ? '-activedlist' : '')
123
+ className: `item-container ${hovered && 'hovered'}
124
+ ${itemId && selectedItemId === itemId ? '-activedlist' : ''}`
123
125
  }, getProps(), {
124
126
  key: itemId
125
127
  }), url && !shouldDisable() && /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, {
126
128
  className: "linkitem",
127
129
  to: url
128
130
  }), (displayCheckbox || leftElement || leftIconName || leftIcon) && /*#__PURE__*/_react.default.createElement("div", {
129
- className: "".concat(getClass(), " -icon-left")
131
+ className: `${getClass()} -icon-left`
130
132
  }, renderCheckBox, leftElement, getIcon(leftIconName, leftIcon)), (text || subText || children) && /*#__PURE__*/_react.default.createElement("div", {
131
- className: "".concat(getClass())
133
+ className: `${getClass()}`
132
134
  }, /*#__PURE__*/_react.default.createElement("p", {
133
- className: "".concat(text && 'text')
135
+ className: `${text && 'text'}`
134
136
  }, text), /*#__PURE__*/_react.default.createElement("p", {
135
- className: "".concat(subText && 'subtext')
137
+ className: `${subText && 'subtext'}`
136
138
  }, subText), children), (rightIconName || rightIcon || rightElement || disabledByPermission) && /*#__PURE__*/_react.default.createElement("div", {
137
- className: "".concat(getClass(), " -icon-right")
139
+ className: `${getClass()} -icon-right`
138
140
  }, getIcon(rightIconName, rightIcon), rightElement));
139
141
  };
140
142
  var _default = exports.default = Item;
package/lib/list/index.js CHANGED
@@ -175,7 +175,7 @@ const List = props => {
175
175
  "data-testid": "list-component",
176
176
  style: style,
177
177
  ref: listRef,
178
- className: "list-component ".concat(condensed && '-condensed', " ").concat(!transparent && '-listbackground', " ").concat(customClass)
178
+ className: `list-component ${condensed && '-condensed'} ${!transparent && '-listbackground'} ${customClass}`
179
179
  }, newChildren));
180
180
  };
181
181
  var _default = exports.default = List;
@@ -29,7 +29,7 @@ const MenuItem = _ref => {
29
29
  const dropdownContext = (0, _react.useContext)(_withDropdown.WithDropdownContext);
30
30
  const handleOnClick = () => {
31
31
  if (onClick) {
32
- onClick(dropdownContext === null || dropdownContext === void 0 ? void 0 : dropdownContext.handleDropdownClose);
32
+ onClick(dropdownContext?.handleDropdownClose);
33
33
  return;
34
34
  }
35
35
  if (dropdownContext) dropdownContext.handleDropdownClose();
@@ -37,7 +37,7 @@ const MenuItem = _ref => {
37
37
  return /*#__PURE__*/_react.default.createElement("div", {
38
38
  className: "floatmenuitem"
39
39
  }, /*#__PURE__*/_react.default.createElement("div", {
40
- className: "".concat(customClassMenuItem, " -items")
40
+ className: `${customClassMenuItem} -items`
41
41
  }, !_lodash.default.isEmpty(dropdownMenu) && !onClick && /*#__PURE__*/_react.default.createElement(_buttons.default, {
42
42
  customClass: "floatmenudropdown",
43
43
  iconName: "more1",
@@ -46,7 +46,7 @@ const SubMenuContainer = _ref => {
46
46
  handlerGoBack();
47
47
  }, []);
48
48
  return /*#__PURE__*/_react.default.createElement("div", {
49
- className: "floatsubmenu ".concat(customClass)
49
+ className: `floatsubmenu ${customClass}`
50
50
  }, /*#__PURE__*/_react.default.createElement("div", {
51
51
  className: "submenuheader"
52
52
  }, /*#__PURE__*/_react.default.createElement(_icons.default, {
@@ -47,7 +47,7 @@ const FloatMenu = props => {
47
47
  return /*#__PURE__*/_react.default.createElement(_helpers.default.Provider, {
48
48
  value: contextValues
49
49
  }, /*#__PURE__*/_react.default.createElement("div", {
50
- className: "floatmenu-component ".concat(customClass)
50
+ className: `floatmenu-component ${customClass}`
51
51
  }, /*#__PURE__*/_react.default.createElement(_buttons.default, {
52
52
  transparent: true,
53
53
  key: "button-",
@@ -14,7 +14,7 @@ const ExpandMenu = _ref => {
14
14
  iconName
15
15
  } = _ref;
16
16
  return /*#__PURE__*/_react.default.createElement("div", {
17
- className: "openclosemenu ".concat(expandMenuCustomClass),
17
+ className: `openclosemenu ${expandMenuCustomClass}`,
18
18
  role: "button",
19
19
  tabIndex: 0,
20
20
  onClick: onExpandMenu,
@@ -20,7 +20,7 @@ const NavMenuGroup = _ref => {
20
20
  } = (0, _react.useContext)(_helpers.SideNavContext);
21
21
  return /*#__PURE__*/_react.default.createElement("ul", {
22
22
  style: style,
23
- className: "".concat(scrollable && 'customscroll', " ").concat((0, _helpers.default)(isExpanded, menuSize))
23
+ className: `${scrollable && 'customscroll'} ${(0, _helpers.default)(isExpanded, menuSize)}`
24
24
  }, children);
25
25
  };
26
26
  var _default = exports.default = NavMenuGroup;
@@ -76,19 +76,17 @@ const NavMenuItem = props => {
76
76
  (0, _react.useEffect)(() => {
77
77
  if (showSubMenu && showDropdownOnClick) {
78
78
  document.addEventListener('click', e => {
79
- var _menuItemRef$current;
80
79
  const target = e.target;
81
- const insideMenu = (_menuItemRef$current = menuItemRef.current) === null || _menuItemRef$current === void 0 ? void 0 : _menuItemRef$current.contains(target);
80
+ const insideMenu = menuItemRef.current?.contains(target);
82
81
  if (!insideMenu) setShowSubMenu(false);
83
82
  });
84
83
  }
85
84
  }, [showSubMenu, showDropdownOnClick]);
86
85
  (0, _react.useEffect)(() => {
87
- var _submenuContainerRef$, _submenuContentRef$cu, _submenuContentRef$cu2;
88
- const heigthSubmenuContainer = ((_submenuContainerRef$ = submenuContainerRef.current) === null || _submenuContainerRef$ === void 0 ? void 0 : _submenuContainerRef$.clientHeight) || 0;
89
- const heigthSubmenuContent = ((_submenuContentRef$cu = submenuContentRef.current) === null || _submenuContentRef$cu === void 0 ? void 0 : _submenuContentRef$cu.clientHeight) || 0;
86
+ const heigthSubmenuContainer = submenuContainerRef.current?.clientHeight || 0;
87
+ const heigthSubmenuContent = submenuContentRef.current?.clientHeight || 0;
90
88
  const maxHeigthSubMenu = isOnEndWindow ? '100%' : (window.innerHeight - targetDimensions.top - (heigthSubmenuContainer - heigthSubmenuContent) - 1).toString().concat('px') || '0px';
91
- (_submenuContentRef$cu2 = submenuContentRef.current) === null || _submenuContentRef$cu2 === void 0 ? void 0 : _submenuContentRef$cu2.style.setProperty('max-height', maxHeigthSubMenu);
89
+ submenuContentRef.current?.style.setProperty('max-height', maxHeigthSubMenu);
92
90
  }, [showSubMenu]);
93
91
  if (unvisible) return null;
94
92
  return /*#__PURE__*/_react.default.createElement(_helpers.SubMenuContext.Provider, {
@@ -99,7 +97,7 @@ const NavMenuItem = props => {
99
97
  menuItemRef.current = r;
100
98
  if (targetRef) targetRef(r);
101
99
  },
102
- className: "item ".concat(url && !disabled && '-withlink', " ").concat(customClass, " ").concat(disabled && '-disabled'),
100
+ className: `item ${url && !disabled && '-withlink'} ${customClass} ${disabled && '-disabled'}`,
103
101
  onMouseEnter: onMouseEnter,
104
102
  onMouseLeave: () => {
105
103
  if (showDropdownOnClick) return;
@@ -123,7 +121,7 @@ const NavMenuItem = props => {
123
121
  className: "title"
124
122
  }, title), !childrenIsSubMenu && children)), showSubMenu && children && childrenIsSubMenu && !disabled && !openSearchMenuPopup && /*#__PURE__*/_react.default.createElement("div", {
125
123
  ref: submenuContainerRef,
126
- className: "".concat(customClassForDropdown, " ").concat(disableDefaultStyle ? '' : 'submenu-container'),
124
+ className: `${customClassForDropdown} ${disableDefaultStyle ? '' : 'submenu-container'}`,
127
125
  style: isOnEndWindow ? {
128
126
  marginLeft: targetDimensions.width,
129
127
  bottom: '0',
@@ -141,7 +139,7 @@ const NavMenuItem = props => {
141
139
  ref: submenuContentRef,
142
140
  className: "submenu",
143
141
  style: {
144
- gridTemplateColumns: "repeat(".concat(columnsQtty, ", 1fr)")
142
+ gridTemplateColumns: `repeat(${columnsQtty}, 1fr)`
145
143
  }
146
144
  }, children))));
147
145
  };
@@ -28,7 +28,7 @@ const NavSubMenuItem = _ref => {
28
28
  } = onDenied;
29
29
  if (unvisible) return null;
30
30
  return /*#__PURE__*/_react.default.createElement("div", {
31
- className: "item hvr-forward ".concat(disabled && '-disabled'),
31
+ className: `item hvr-forward ${disabled && '-disabled'}`,
32
32
  onKeyDown: () => {},
33
33
  role: "button",
34
34
  tabIndex: -1,
@@ -9,7 +9,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
9
9
  const getCssClassMenu = (isExpanded, size) => {
10
10
  let cssClass = 'expandedmenu';
11
11
  if (!isExpanded) {
12
- cssClass = "collapsedmenu -".concat(size);
12
+ cssClass = `collapsedmenu -${size}`;
13
13
  }
14
14
  return cssClass;
15
15
  };
@@ -70,7 +70,7 @@ const SideNav = props => {
70
70
  width,
71
71
  height
72
72
  } = sideNavDimensions;
73
- const style = "left: ".concat(left + width + 5, "px; top: ").concat(top + 1, "px; height: ").concat(height - 8, "px;");
73
+ const style = `left: ${left + width + 5}px; top: ${top + 1}px; height: ${height - 8}px;`;
74
74
  return style;
75
75
  };
76
76
  const closeSearchMenuPopup = () => {
@@ -82,7 +82,7 @@ const SideNav = props => {
82
82
  } = child;
83
83
  if ((type === _NavMenuItem.default || type === _NavSubMenuItem.default) && !child.props.children) {
84
84
  setMenuItemsContent(prevState => [...prevState, {
85
- id: "".concat(child.props.title, "-").concat(uuid.v1()),
85
+ id: `${child.props.title}-${uuid.v1()}`,
86
86
  content: child.props.title,
87
87
  url: child.props.url
88
88
  }]);
@@ -127,7 +127,7 @@ const SideNav = props => {
127
127
  }, [expanded]);
128
128
  const returnMenuItems = () => menuItemsContent.filter(item => item.content !== '');
129
129
  const getPopupMenuSearch = () => /*#__PURE__*/_react.default.createElement(_NavMenuGroup.default, {
130
- key: "popup-menusearch-".concat(uuid.v1())
130
+ key: `popup-menusearch-${uuid.v1()}`
131
131
  }, /*#__PURE__*/_react.default.createElement(_NavMenuItem.default, {
132
132
  childrenIsSubMenu: false,
133
133
  customClass: "-customsidenavitem",
@@ -165,10 +165,10 @@ const SideNav = props => {
165
165
  return /*#__PURE__*/_react.default.createElement(_helpers.SideNavContext.Provider, {
166
166
  value: contextValues
167
167
  }, /*#__PURE__*/_react.default.createElement("div", {
168
- className: "sidenav-component ".concat(isExpanded ? '-expanded' : '', " ").concat(openSearchMenuPopup ? '-blocked' : '', " ").concat(customClass),
168
+ className: `sidenav-component ${isExpanded ? '-expanded' : ''} ${openSearchMenuPopup ? '-blocked' : ''} ${customClass}`,
169
169
  ref: sideNavRef
170
170
  }, showExpandMenu && /*#__PURE__*/_react.default.createElement(_ExpandMenu.default, {
171
- expandMenuCustomClass: "".concat(isExpanded && 'closefromexpanded', " ").concat(expandMenuCustomClass),
171
+ expandMenuCustomClass: `${isExpanded && 'closefromexpanded'} ${expandMenuCustomClass}`,
172
172
  onExpandMenu: onHeaderClick,
173
173
  iconName: isExpanded ? 'arrow_left' : 'arrow_right'
174
174
  }), getSideNavContent()));
@@ -56,9 +56,8 @@ const PanelContent = _ref => {
56
56
  scrollHeight
57
57
  } = rootElementRef.current;
58
58
  if (scrollHeight !== lastScrollHeight.current) {
59
- var _observer;
60
59
  enableOnEndReached.current = true;
61
- (_observer = observer) === null || _observer === void 0 ? void 0 : _observer.disconnect();
60
+ observer?.disconnect();
62
61
  }
63
62
  });
64
63
  observer.observe(rootElementRef.current);
@@ -66,16 +65,15 @@ const PanelContent = _ref => {
66
65
  rootElementRef.current.addEventListener('resize', onScrollEndReached);
67
66
  }
68
67
  return () => {
69
- var _rootElementRef$curre, _rootElementRef$curre2, _observer2;
70
- (_rootElementRef$curre = rootElementRef.current) === null || _rootElementRef$curre === void 0 ? void 0 : _rootElementRef$curre.removeEventListener('scroll', onScrollEndReached);
71
- (_rootElementRef$curre2 = rootElementRef.current) === null || _rootElementRef$curre2 === void 0 ? void 0 : _rootElementRef$curre2.removeEventListener('resize', onScrollEndReached);
72
- (_observer2 = observer) === null || _observer2 === void 0 ? void 0 : _observer2.disconnect();
68
+ rootElementRef.current?.removeEventListener('scroll', onScrollEndReached);
69
+ rootElementRef.current?.removeEventListener('resize', onScrollEndReached);
70
+ observer?.disconnect();
73
71
  };
74
72
  }, [onScrollEndReached]);
75
73
  if (!opened) return null;
76
74
  return hideContent ? /*#__PURE__*/_react.default.createElement(_noPermission.default, null) : /*#__PURE__*/_react.default.createElement("div", _extends({
77
75
  ref: rootElementRef,
78
- className: "panel-content ".concat(customClass !== null && customClass !== void 0 ? customClass : '')
76
+ className: `panel-content ${customClass ?? ''}`
79
77
  }, rest), opened && children);
80
78
  };
81
79
  var _default = exports.default = PanelContent;
@@ -37,8 +37,8 @@ const DefaultPanel = _ref => {
37
37
  } = _permissionValidations.OPTIONS_ON_DENIED;
38
38
  const [onDenied] = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)([hideContent, unvisible], permissionAttr));
39
39
  const getCssClass = () => {
40
- let cssClass = "panel-component ".concat(customClass);
41
- cssClass += colorStyle !== '' ? " -".concat(colorStyle) : '';
40
+ let cssClass = `panel-component ${customClass}`;
41
+ cssClass += colorStyle !== '' ? ` -${colorStyle}` : '';
42
42
  return cssClass;
43
43
  };
44
44
  const renderContent = () => /*#__PURE__*/_react.default.createElement("div", _extends({
@@ -32,7 +32,7 @@ const getClassName = _ref => {
32
32
  customClass,
33
33
  headerColored = true
34
34
  } = _ref;
35
- let className = "panel-header ".concat(customClass !== null && customClass !== void 0 ? customClass : '');
35
+ let className = `panel-header ${customClass ?? ''}`;
36
36
  if (!headerColored) className += ' -uncolored';
37
37
  return className;
38
38
  };
@@ -56,9 +56,9 @@ const PanelHeader = props => {
56
56
  return /*#__PURE__*/_react.default.createElement("div", _extends({
57
57
  className: getClassName(props)
58
58
  }, rest), (icon || titleIcon) && /*#__PURE__*/_react.default.createElement("div", {
59
- className: "".concat(icon !== null || titleIcon !== null ? 'icon-left-panel' : '')
59
+ className: `${icon !== null || titleIcon !== null ? 'icon-left-panel' : ''}`
60
60
  }, getIcon(titleIcon, icon)), title && /*#__PURE__*/_react.default.createElement("h1", {
61
- className: "title ".concat(customClassForTitle !== null && customClassForTitle !== void 0 ? customClassForTitle : ''),
61
+ className: `title ${customClassForTitle ?? ''}`,
62
62
  style: styleForTitle
63
63
  }, title), toggleable && /*#__PURE__*/_react.default.createElement(_buttons.ButtonContainer, {
64
64
  position: "right"
@@ -45,7 +45,7 @@ const actionsOnPermissionDenied = (options, permissionAttr) => {
45
45
  }
46
46
  const result = {};
47
47
  options.forEach(option => {
48
- result[option] = hasPermission ? false : option === (permissionsAttr === null || permissionsAttr === void 0 ? void 0 : permissionsAttr[0].onDenied);
48
+ result[option] = hasPermission ? false : option === permissionsAttr?.[0].onDenied;
49
49
  });
50
50
  return result;
51
51
  };
@@ -1,10 +1,11 @@
1
- import React__default from 'react';
2
1
  import { PopoverTextProps } from './types.js';
2
+ import 'react';
3
3
  import '../@types/Position.js';
4
4
  import '../@types/SizePixels.js';
5
5
  import '../@types/Icon.js';
6
6
  import '../icons/helper.js';
7
+ import '../@types/PermissionAttr.js';
7
8
 
8
- declare const PopoverText: React__default.ForwardRefExoticComponent<PopoverTextProps & React__default.RefAttributes<HTMLParagraphElement>>;
9
+ declare const PopoverText: ({ children }: PopoverTextProps) => JSX.Element;
9
10
 
10
11
  export { PopoverText as default };
@@ -4,17 +4,14 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
9
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
10
- const PopoverText = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
7
+ var _react = _interopRequireDefault(require("react"));
8
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
9
+ const PopoverText = _ref => {
11
10
  let {
12
11
  children
13
12
  } = _ref;
14
13
  return /*#__PURE__*/_react.default.createElement("p", {
15
- className: "text",
16
- ref: ref
14
+ className: "text"
17
15
  }, children);
18
- });
19
- PopoverText.displayName = 'PopoverText';
16
+ };
20
17
  var _default = exports.default = PopoverText;
@@ -4,6 +4,7 @@ import '../@types/Position.js';
4
4
  import '../@types/SizePixels.js';
5
5
  import '../@types/Icon.js';
6
6
  import '../icons/helper.js';
7
+ import '../@types/PermissionAttr.js';
7
8
 
8
9
  declare const PopoverTitle: ({ children }: PopoverTitleProps) => JSX.Element;
9
10
 
@@ -6,10 +6,8 @@ import '../@types/Position.js';
6
6
  import '../@types/SizePixels.js';
7
7
  import '../@types/Icon.js';
8
8
  import '../icons/helper.js';
9
+ import '../@types/PermissionAttr.js';
9
10
 
10
- declare const _default: {
11
- (props: IPopoverProps): JSX.Element;
12
- displayName: string;
13
- };
11
+ declare const Popover: ({ children, align, theme, iconName, iconSize, iconColor, customClass, customStyle, ...rest }: IPopoverProps) => JSX.Element;
14
12
 
15
- export { _default as default };
13
+ export { Popover as default };
@@ -21,20 +21,25 @@ var _buttons = _interopRequireDefault(require("../buttons"));
21
21
  var _icons = _interopRequireDefault(require("../icons"));
22
22
  var _PopoverText = _interopRequireDefault(require("./PopoverText"));
23
23
  var _PopoverTitle = _interopRequireDefault(require("./PopoverTitle"));
24
- var _withDropdown = _interopRequireDefault(require("../dropdown/withDropdown"));
25
24
  require("../assets/styles/popover.scss");
25
+ const _excluded = ["children", "align", "theme", "iconName", "iconSize", "iconColor", "customClass", "customStyle"];
26
26
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
27
+ 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); }
28
+ function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
29
+ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
27
30
  const Popover = _ref => {
28
31
  let {
29
- children,
30
- align = 'left',
31
- theme = 'dark',
32
- iconName,
33
- iconSize = 16,
34
- iconColor = '',
35
- customClass = ''
36
- } = _ref;
37
- return /*#__PURE__*/_react.default.createElement(_buttons.default, {
32
+ children,
33
+ align = 'left',
34
+ theme = 'dark',
35
+ iconName,
36
+ iconSize = 16,
37
+ iconColor = '',
38
+ customClass = '',
39
+ customStyle
40
+ } = _ref,
41
+ rest = _objectWithoutProperties(_ref, _excluded);
42
+ return /*#__PURE__*/_react.default.createElement(_buttons.default, _extends({
38
43
  round: true,
39
44
  dropdown: true,
40
45
  transparent: true,
@@ -57,9 +62,10 @@ const Popover = _ref => {
57
62
  onClick: e => {
58
63
  e.preventDefault();
59
64
  }
60
- }, /*#__PURE__*/_react.default.createElement("div", {
61
- className: "".concat(customClass, " popovercontainer -").concat(theme),
62
- "data-testid": "popover-container"
65
+ }, rest), /*#__PURE__*/_react.default.createElement("div", {
66
+ className: `popovercontainer -${theme} ${customClass}`,
67
+ "data-testid": "popover-container",
68
+ style: customStyle
63
69
  }, children));
64
70
  };
65
- var _default = exports.default = (0, _withDropdown.default)(Popover);
71
+ var _default = exports.default = Popover;
@@ -1,7 +1,8 @@
1
- import { ReactNode } from 'react';
1
+ import { ReactNode, CSSProperties } from 'react';
2
2
  import { Position } from '../@types/Position.js';
3
3
  import { SizePixels } from '../@types/SizePixels.js';
4
4
  import { IconNames } from '../@types/Icon.js';
5
+ import { PermissionAttr } from '../@types/PermissionAttr.js';
5
6
  import '../icons/helper.js';
6
7
 
7
8
  interface PopoverTitleProps {
@@ -18,6 +19,16 @@ interface IPopoverProps {
18
19
  theme?: 'light' | 'dark';
19
20
  align?: Extract<Position, 'left' | 'right'>;
20
21
  iconSize?: Extract<SizePixels, 10 | 16 | 24 | 32 | 40 | 64>;
22
+ disabled?: boolean;
23
+ customStyle?: CSSProperties;
24
+ isLoading?: boolean;
25
+ visible?: boolean;
26
+ skeletonize?: boolean;
27
+ tooltipPosition?: Exclude<Position, 'center'>;
28
+ tooltipWidth?: string | number;
29
+ tooltip?: string;
30
+ handlerClose?: (cb: () => void) => void;
31
+ permissionAttr?: PermissionAttr | PermissionAttr[];
21
32
  }
22
33
 
23
34
  export { IPopoverProps, PopoverTextProps, PopoverTitleProps };
@@ -18,8 +18,8 @@ const getPercentage = _ref => {
18
18
  };
19
19
  const getClass = props => {
20
20
  let style = 'bar';
21
- if (props.customClass) style += "".concat(props.customClass);
22
- if (props.type) style += " -".concat(props.type);
21
+ if (props.customClass) style += `${props.customClass}`;
22
+ if (props.type) style += ` -${props.type}`;
23
23
  if (props.effect) style += ' -effect';
24
24
  if (props.animated) style += ' -animated';
25
25
  if (props.indeterminate) style += ' -indeterminate';
@@ -28,7 +28,7 @@ const getClass = props => {
28
28
  const getLabel = progress => {
29
29
  let value = progress.label;
30
30
  if (!progress.label) {
31
- value = "".concat(getPercentage(progress), "%");
31
+ value = `${getPercentage(progress)}%`;
32
32
  }
33
33
  return /*#__PURE__*/_react.default.createElement("span", {
34
34
  className: "progressbar-label "
@@ -46,12 +46,12 @@ const getStyle = props => {
46
46
  return {
47
47
  width: progressWidth,
48
48
  height,
49
- animationDuration: "".concat(indeterminateDuration, "s"),
50
- animationDelay: "".concat(indeterminateDelay, "s")
49
+ animationDuration: `${indeterminateDuration}s`,
50
+ animationDelay: `${indeterminateDelay}s`
51
51
  };
52
52
  }
53
53
  return {
54
- width: "".concat(getPercentage(props), "%"),
54
+ width: `${getPercentage(props)}%`,
55
55
  height
56
56
  };
57
57
  };
@@ -64,7 +64,7 @@ const Radio = _ref => {
64
64
  };
65
65
  if (onDenied.unvisible) return null;
66
66
  return /*#__PURE__*/_react.default.createElement("div", {
67
- className: "radio-button ".concat(disabled ? 'disabled' : '', " ").concat(skeletonize ? '-skeletonized' : '')
67
+ className: `radio-button ${disabled ? 'disabled' : ''} ${skeletonize ? '-skeletonized' : ''}`
68
68
  }, /*#__PURE__*/_react.default.createElement("input", _extends({}, getCustomProps(), {
69
69
  ref: forwardedRef,
70
70
  className: "radio-component",
@@ -75,7 +75,7 @@ const Radio = _ref => {
75
75
  required: required,
76
76
  disabled: shouldDisable()
77
77
  })), /*#__PURE__*/_react.default.createElement("label", {
78
- className: "description ".concat(size && "-".concat(size)),
78
+ className: `description ${size && `-${size}`}`,
79
79
  htmlFor: id
80
80
  }, /*#__PURE__*/_react.default.createElement("span", null, label)));
81
81
  };