magneto365.ui 2.68.1-beta → 2.69.0-beta

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.
package/dist/cjs/index.js CHANGED
@@ -269,7 +269,7 @@ var useMediaQuery = function (defaultValue, options) {
269
269
  return component;
270
270
  };
271
271
 
272
- var styles$2Y = {"magneto-ui-icon":"mg_icon_magneto-ui-icon_tp25u","magneto-ui-hover":"mg_icon_magneto-ui-hover_tp25u","magneto-ui-rotate":"mg_icon_magneto-ui-rotate_tp25u"};
272
+ var styles$2Z = {"magneto-ui-icon":"mg_icon_magneto-ui-icon_tp25u","magneto-ui-hover":"mg_icon_magneto-ui-hover_tp25u","magneto-ui-rotate":"mg_icon_magneto-ui-rotate_tp25u"};
273
273
 
274
274
  function formatNumber(num) {
275
275
  if (typeof num !== 'number')
@@ -316,7 +316,7 @@ var classNames = {
316
316
  }
317
317
  };
318
318
 
319
- var cx$1d = classNames.bind(styles$2Y);
319
+ var cx$1d = classNames.bind(styles$2Z);
320
320
  var Component$37 = function (_a) {
321
321
  var fallbackIcon = _a.fallbackIcon, _b = _a.showDefaultFallback, showDefaultFallback = _b === void 0 ? true : _b, icon = _a.icon, _c = _a.hover, hover = _c === void 0 ? false : _c, size = _a.size, className = _a.className, alt = _a.alt, isRotate = _a.isRotate;
322
322
  var _d = React.useState(false), imageError = _d[0], setImageError = _d[1];
@@ -335,7 +335,7 @@ var Component$37 = function (_a) {
335
335
  */
336
336
  var IconItem = Component$37;
337
337
 
338
- var styles$2X = {"avatarComponent":"mg_avatar_avatarComponent_1upgt","magneto-ui-default-avatar":"mg_avatar_magneto-ui-default-avatar_1upgt"};
338
+ var styles$2Y = {"avatarComponent":"mg_avatar_avatarComponent_1upgt","magneto-ui-default-avatar":"mg_avatar_magneto-ui-default-avatar_1upgt"};
339
339
 
340
340
  var Add = "https://static.magneto365.com/lib/assets/f738cef7b76c444f.svg";
341
341
 
@@ -377,8 +377,6 @@ var ArrowRight2 = "https://static.magneto365.com/lib/assets/ce1843403fbc32ff.svg
377
377
 
378
378
  var ArrowRightWhite = "https://static.magneto365.com/lib/assets/cc2f903ba305015e.svg";
379
379
 
380
- var ArrowSwapVertical = "https://static.magneto365.com/lib/assets/11314346afd968cf.svg";
381
-
382
380
  var Bell = "https://static.magneto365.com/lib/assets/b8b5d3e12f55ef1a.svg";
383
381
 
384
382
  var BookBlueBold = "https://static.magneto365.com/lib/assets/1d63e2974f98ed3e.svg";
@@ -665,15 +663,17 @@ var YoutubeSolid = "https://static.magneto365.com/lib/assets/cdcc07646d43bd9d.sv
665
663
 
666
664
  var FilterIcon = "https://static.magneto365.com/lib/assets/a9f25ebc43dd2922.svg";
667
665
 
666
+ var SortIcon = "https://static.magneto365.com/lib/assets/3c9ef5949d25901a.svg";
667
+
668
668
  var Component$36 = function (_a) {
669
669
  var userImage = _a.userImage, fallbackImage = _a.fallbackImage, onClick = _a.onClick;
670
670
  var _b = React.useState(false), imageError = _b[0], setImageError = _b[1];
671
671
  var handleError = function () {
672
672
  setImageError(true);
673
673
  };
674
- return (React__default["default"].createElement("div", { className: styles$2X.avatarComponent, onClick: onClick },
674
+ return (React__default["default"].createElement("div", { className: styles$2Y.avatarComponent, onClick: onClick },
675
675
  userImage && !imageError && React__default["default"].createElement("img", { src: userImage, alt: "User Avatar", loading: "lazy", onError: handleError }),
676
- (!userImage || imageError) && (React__default["default"].createElement("div", { className: styles$2X['magneto-ui-default-avatar'] },
676
+ (!userImage || imageError) && (React__default["default"].createElement("div", { className: styles$2Y['magneto-ui-default-avatar'] },
677
677
  React__default["default"].createElement(IconItem, { icon: fallbackImage || User, hover: false })))));
678
678
  };
679
679
  /**
@@ -681,17 +681,17 @@ var Component$36 = function (_a) {
681
681
  */
682
682
  var Avatar = Component$36;
683
683
 
684
- var styles$2W = {"badge-count":"mg_badge_badge-count_15t5z","badge-count__animation":"mg_badge_badge-count_animation_15t5z","pulse":"mg_badge_pulse_15t5z"};
684
+ var styles$2X = {"badge-count":"mg_badge_badge-count_15t5z","badge-count__animation":"mg_badge_badge-count_animation_15t5z","pulse":"mg_badge_pulse_15t5z"};
685
685
 
686
686
  var Component$35 = function (_a) {
687
687
  var _b = _a.number, number = _b === void 0 ? undefined : _b, className = _a.className;
688
- return (React__default["default"].createElement("p", { className: "".concat(styles$2W['badge-count'], " ").concat(className) },
689
- React__default["default"].createElement("span", { className: styles$2W['badge-count__animation'] }),
688
+ return (React__default["default"].createElement("p", { className: "".concat(styles$2X['badge-count'], " ").concat(className) },
689
+ React__default["default"].createElement("span", { className: styles$2X['badge-count__animation'] }),
690
690
  number && number));
691
691
  };
692
692
  var Badge = Component$35;
693
693
 
694
- var styles$2V = {"magneto-ui-chart-bar":"mg_bar_chart_magneto-ui-chart-bar_1jzzq","magneto-ui-chart-bar__point":"mg_bar_chart_magneto-ui-chart-bar_point_1jzzq","magneto-ui-chart-bar__popover":"mg_bar_chart_magneto-ui-chart-bar_popover_1jzzq","popover-left":"mg_bar_chart_popover-left_1jzzq","popover-right":"mg_bar_chart_popover-right_1jzzq"};
694
+ var styles$2W = {"magneto-ui-chart-bar":"mg_bar_chart_magneto-ui-chart-bar_1jzzq","magneto-ui-chart-bar__point":"mg_bar_chart_magneto-ui-chart-bar_point_1jzzq","magneto-ui-chart-bar__popover":"mg_bar_chart_magneto-ui-chart-bar_popover_1jzzq","popover-left":"mg_bar_chart_popover-left_1jzzq","popover-right":"mg_bar_chart_popover-right_1jzzq"};
695
695
 
696
696
  var numberToCurrency = function (currency, withSymbol) {
697
697
  if (withSymbol === void 0) { withSymbol = true; }
@@ -729,14 +729,14 @@ var Component$34 = function (_a) {
729
729
  }
730
730
  }, [isHover]);
731
731
  var popoverContent = React.useMemo(function () {
732
- return isHover && (React__default["default"].createElement("div", { className: "".concat(styles$2V['magneto-ui-chart-bar__popover'], " ").concat(styles$2V["popover-".concat(popoverPosition)]) },
732
+ return isHover && (React__default["default"].createElement("div", { className: "".concat(styles$2W['magneto-ui-chart-bar__popover'], " ").concat(styles$2W["popover-".concat(popoverPosition)]) },
733
733
  React__default["default"].createElement("div", null, "".concat(numberToCurrency(minRange), " - ").concat(numberToCurrency(maxRange))),
734
734
  React__default["default"].createElement("div", null, "".concat(Math.round(percentage * 100), "% ").concat(jobText))));
735
735
  }, [isHover, jobText, maxRange, minRange, percentage, popoverPosition]);
736
736
  return (React__default["default"].createElement("div", { style: {
737
737
  height: Math.max((percentage / maxPercentage) * maxHeight, 1)
738
- }, ref: barRef, className: styles$2V['magneto-ui-chart-bar'], onMouseEnter: function () { return setIsHover(true); }, onMouseLeave: function () { return setIsHover(false); } },
739
- React__default["default"].createElement("div", { className: styles$2V['magneto-ui-chart-bar__point'], style: { backgroundColor: point } }),
738
+ }, ref: barRef, className: styles$2W['magneto-ui-chart-bar'], onMouseEnter: function () { return setIsHover(true); }, onMouseLeave: function () { return setIsHover(false); } },
739
+ React__default["default"].createElement("div", { className: styles$2W['magneto-ui-chart-bar__point'], style: { backgroundColor: point } }),
740
740
  popoverContent));
741
741
  };
742
742
  var BarChart = Component$34;
@@ -1137,7 +1137,7 @@ var menuSortButton = {
1137
1137
  size: 17
1138
1138
  };
1139
1139
  var iconFilterOrder = {
1140
- icon: ArrowSwapVertical,
1140
+ icon: SortIcon,
1141
1141
  hover: false,
1142
1142
  size: 20
1143
1143
  };
@@ -1561,7 +1561,7 @@ var CNM = /** @class */ (function () {
1561
1561
  return CNM;
1562
1562
  }());
1563
1563
 
1564
- var styles$2U = {"magneto-ui-bar-loader":"mg_bar_loader_magneto-ui-bar-loader_1f3jh","magneto-ui-bar-loader__bar":"mg_bar_loader_magneto-ui-bar-loader_bar_1f3jh","magneto-ui-bar-loader__bar--animated":"mg_bar_loader_magneto-ui-bar-loader_bar--animated_1f3jh","progress":"mg_bar_loader_progress_1f3jh","magneto-ui-bar-loader__bar--completed":"mg_bar_loader_magneto-ui-bar-loader_bar--completed_1f3jh"};
1564
+ var styles$2V = {"magneto-ui-bar-loader":"mg_bar_loader_magneto-ui-bar-loader_1f3jh","magneto-ui-bar-loader__bar":"mg_bar_loader_magneto-ui-bar-loader_bar_1f3jh","magneto-ui-bar-loader__bar--animated":"mg_bar_loader_magneto-ui-bar-loader_bar--animated_1f3jh","progress":"mg_bar_loader_progress_1f3jh","magneto-ui-bar-loader__bar--completed":"mg_bar_loader_magneto-ui-bar-loader_bar--completed_1f3jh"};
1565
1565
 
1566
1566
  var Component$33 = function (_a) {
1567
1567
  var className = _a.className, color = _a.color, percent = _a.percent;
@@ -1583,10 +1583,10 @@ var Component$33 = function (_a) {
1583
1583
  var _a;
1584
1584
  return (_a = {}, _a["".concat(BAR_LOADER_PREFIX, "-completed")] = "".concat(validateCompleted(percent), "%"), _a);
1585
1585
  }, [percent, validateCompleted]);
1586
- return (React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2U, cls: [className] }) },
1587
- React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2U, cls: ['bar-loader'] }), style: __assign(__assign({}, barColor), barCompleted) },
1586
+ return (React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2V, cls: [className] }) },
1587
+ React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2V, cls: ['bar-loader'] }), style: __assign(__assign({}, barColor), barCompleted) },
1588
1588
  React__default["default"].createElement("div", { className: CNM.get({
1589
- styles: styles$2U,
1589
+ styles: styles$2V,
1590
1590
  cls: ['bar-loader__bar', percent !== undefined ? 'bar-loader__bar--completed' : 'bar-loader__bar--animated']
1591
1591
  }) }))));
1592
1592
  };
@@ -1595,7 +1595,7 @@ var Component$33 = function (_a) {
1595
1595
  */
1596
1596
  var BarLoader = Component$33;
1597
1597
 
1598
- var styles$2T = {"breadcrumbComponent":"mg_breadcrumb_breadcrumbComponent_vlbg8","magneto-ui-bc":"mg_breadcrumb_magneto-ui-bc_vlbg8","magneto-ui-bc-active":"mg_breadcrumb_magneto-ui-bc-active_vlbg8","no-transform":"mg_breadcrumb_no-transform_vlbg8"};
1598
+ var styles$2U = {"breadcrumbComponent":"mg_breadcrumb_breadcrumbComponent_vlbg8","magneto-ui-bc":"mg_breadcrumb_magneto-ui-bc_vlbg8","magneto-ui-bc-active":"mg_breadcrumb_magneto-ui-bc-active_vlbg8","no-transform":"mg_breadcrumb_no-transform_vlbg8"};
1599
1599
 
1600
1600
  var Component$32 = function (_a) {
1601
1601
  var breadcrumbText = _a.breadcrumbText, breadcrumbCustomText = _a.breadcrumbCustomText, queryParams = _a.queryParams, _b = _a.haveRedirect, haveRedirect = _b === void 0 ? true : _b, _c = _a.detailTitle, detailTitle = _c === void 0 ? '' : _c, breadCrumbFromServer = _a.breadCrumbFromServer, urlFromServer = _a.urlFromServer;
@@ -1603,7 +1603,7 @@ var Component$32 = function (_a) {
1603
1603
  var breadcrumbSplitText = breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.split('/');
1604
1604
  var lastIndexBC = (breadcrumbSplitText === null || breadcrumbSplitText === void 0 ? void 0 : breadcrumbSplitText.length) - 1;
1605
1605
  var haveDetailTitle = detailTitle !== '';
1606
- var detailTileStyle = detailTitle ? styles$2T['no-transform'] : '';
1606
+ var detailTileStyle = detailTitle ? styles$2U['no-transform'] : '';
1607
1607
  var regexBase4 = /[0-9a-f]{8} [0-9a-f]{4} [0-9a-f]{4} [0-9a-f]{4} [0-9a-f]{12}/g;
1608
1608
  // This removes the base64 from the vacancy breadcrumbs
1609
1609
  var title = breadcrumbSplitText[lastIndexBC].replace(/-/g, ' ').replace(regexBase4, '');
@@ -1615,9 +1615,9 @@ var Component$32 = function (_a) {
1615
1615
  "/ ",
1616
1616
  href)));
1617
1617
  }),
1618
- React__default["default"].createElement("p", { className: "".concat(styles$2T['magneto-ui-bc-active'], " ").concat(detailTileStyle) },
1618
+ React__default["default"].createElement("p", { className: "".concat(styles$2U['magneto-ui-bc-active'], " ").concat(detailTileStyle) },
1619
1619
  "/ ",
1620
- haveDetailTitle ? detailTitle : title))) : (React__default["default"].createElement(React__default["default"].Fragment, null, breadcrumbSplitText.map(function (bc, i) { return (React__default["default"].createElement("p", { className: "".concat(lastIndexBC == i ? styles$2T['magneto-ui-bc-active'] : '', " ").concat(styles$2T['magneto-ui-bc']), key: i },
1620
+ haveDetailTitle ? detailTitle : title))) : (React__default["default"].createElement(React__default["default"].Fragment, null, breadcrumbSplitText.map(function (bc, i) { return (React__default["default"].createElement("p", { className: "".concat(lastIndexBC == i ? styles$2U['magneto-ui-bc-active'] : '', " ").concat(styles$2U['magneto-ui-bc']), key: i },
1621
1621
  i > 0 && '/',
1622
1622
  " ",
1623
1623
  bc)); })));
@@ -1633,28 +1633,28 @@ var Component$32 = function (_a) {
1633
1633
  queryParams,
1634
1634
  lastIndexBC
1635
1635
  ]);
1636
- return React__default["default"].createElement("div", { className: styles$2T.breadcrumbComponent }, breadCrumbsRender);
1636
+ return React__default["default"].createElement("div", { className: styles$2U.breadcrumbComponent }, breadCrumbsRender);
1637
1637
  };
1638
1638
  /**
1639
1639
  * Atom UI of breadcrumb
1640
1640
  */
1641
1641
  var Breadcrumb = Component$32;
1642
1642
 
1643
- var styles$2S = {"magneto-ui-button":"mg_button_magneto-ui-button_2zrcl","magneto-ui-button__mobile-text":"mg_button_magneto-ui-button_mobile-text_2zrcl","magneto-ui-button__icon":"mg_button_magneto-ui-button_icon_2zrcl","hover-effect":"mg_button_hover-effect_2zrcl"};
1643
+ var styles$2T = {"magneto-ui-button":"mg_button_magneto-ui-button_2zrcl","magneto-ui-button__mobile-text":"mg_button_magneto-ui-button_mobile-text_2zrcl","magneto-ui-button__icon":"mg_button_magneto-ui-button_icon_2zrcl","hover-effect":"mg_button_hover-effect_2zrcl"};
1644
1644
 
1645
1645
  var Component$31 = function (_a) {
1646
1646
  var buttonText = _a.buttonText, buttonTitle = _a.buttonTitle, addHover = _a.addHover, onClick = _a.onClick, suffixIcon = _a.suffixIcon, prefixIcon = _a.prefixIcon, className = _a.className, _b = _a.iconSize, iconSize = _b === void 0 ? 20 : _b;
1647
- return (React__default["default"].createElement("button", { className: "".concat(className, " ").concat(styles$2S['magneto-ui-button'], " ").concat(addHover ? styles$2S['hover-effect'] : '', " "), type: "button", onClick: onClick, title: buttonTitle },
1648
- typeof suffixIcon === 'string' ? (React__default["default"].createElement(IconItem, { size: iconSize, icon: suffixIcon, hover: addHover, className: styles$2S['magneto-ui-button__icon'] })) : (suffixIcon),
1649
- buttonText && React__default["default"].createElement("p", { className: styles$2S['magneto-ui-button__mobile-text'] }, buttonText),
1650
- typeof prefixIcon === 'string' ? (React__default["default"].createElement(IconItem, { size: iconSize, icon: prefixIcon, hover: addHover, className: styles$2S['magneto-ui-button__icon'] })) : (prefixIcon)));
1647
+ return (React__default["default"].createElement("button", { className: "".concat(className, " ").concat(styles$2T['magneto-ui-button'], " ").concat(addHover ? styles$2T['hover-effect'] : '', " "), type: "button", onClick: onClick, title: buttonTitle },
1648
+ typeof suffixIcon === 'string' ? (React__default["default"].createElement(IconItem, { size: iconSize, icon: suffixIcon, hover: addHover, className: styles$2T['magneto-ui-button__icon'] })) : (suffixIcon),
1649
+ buttonText && React__default["default"].createElement("p", { className: styles$2T['magneto-ui-button__mobile-text'] }, buttonText),
1650
+ typeof prefixIcon === 'string' ? (React__default["default"].createElement(IconItem, { size: iconSize, icon: prefixIcon, hover: addHover, className: styles$2T['magneto-ui-button__icon'] })) : (prefixIcon)));
1651
1651
  };
1652
1652
  /**
1653
1653
  * UI Atom Component of Save Button
1654
1654
  */
1655
1655
  var Button = Component$31;
1656
1656
 
1657
- var styles$2R = {"button-link":"mg_button_link_button-link_1iyy1","button-link__text":"mg_button_link_button-link_text_1iyy1"};
1657
+ var styles$2S = {"button-link":"mg_button_link_button-link_1iyy1","button-link__text":"mg_button_link_button-link_text_1iyy1"};
1658
1658
 
1659
1659
  var Component$30 = function (_a) {
1660
1660
  var buttonText = _a.buttonText, onClick = _a.onClick, suffixIcon = _a.suffixIcon, prefixIcon = _a.prefixIcon, className = _a.className, _b = _a.iconSize, iconSize = _b === void 0 ? 20 : _b, href = _a.href, rel = _a.rel, target = _a.target;
@@ -1664,19 +1664,19 @@ var Component$30 = function (_a) {
1664
1664
  onClick();
1665
1665
  }
1666
1666
  }, [onClick]);
1667
- return (React__default["default"].createElement("a", { className: "".concat(className ? className : styles$2R['button-link']), type: "button", onClick: handleClick, href: href, rel: rel, target: target },
1668
- suffixIcon && (React__default["default"].createElement(IconItem, { size: iconSize, icon: suffixIcon, hover: true, className: styles$2R['button-link__icon'] })),
1669
- buttonText && React__default["default"].createElement("p", { className: styles$2R['button-link__text'] }, buttonText),
1670
- prefixIcon && (React__default["default"].createElement(IconItem, { size: iconSize, icon: prefixIcon, hover: true, className: styles$2R['button-link__icon'] }))));
1667
+ return (React__default["default"].createElement("a", { className: "".concat(className ? className : styles$2S['button-link']), type: "button", onClick: handleClick, href: href, rel: rel, target: target },
1668
+ suffixIcon && (React__default["default"].createElement(IconItem, { size: iconSize, icon: suffixIcon, hover: true, className: styles$2S['button-link__icon'] })),
1669
+ buttonText && React__default["default"].createElement("p", { className: styles$2S['button-link__text'] }, buttonText),
1670
+ prefixIcon && (React__default["default"].createElement(IconItem, { size: iconSize, icon: prefixIcon, hover: true, className: styles$2S['button-link__icon'] }))));
1671
1671
  };
1672
1672
  /**
1673
1673
  * UI Atom Component of Save Button
1674
1674
  */
1675
1675
  var ButtonLink = Component$30;
1676
1676
 
1677
- var styles$2Q = {"checkbox":"mg_checkbox_checkbox_1w9e7","checkbox--inline":"mg_checkbox_checkbox--inline_1w9e7","checkbox--block":"mg_checkbox_checkbox--block_1w9e7","checkbox--background":"mg_checkbox_checkbox--background_1w9e7","checkbox--checked":"mg_checkbox_checkbox--checked_1w9e7","custom-checked":"mg_checkbox_custom-checked_1w9e7","checkbox__box":"mg_checkbox_checkbox_box_1w9e7","checkbox__box--checked":"mg_checkbox_checkbox_box--checked_1w9e7"};
1677
+ var styles$2R = {"checkbox":"mg_checkbox_checkbox_1w9e7","checkbox--inline":"mg_checkbox_checkbox--inline_1w9e7","checkbox--block":"mg_checkbox_checkbox--block_1w9e7","checkbox--background":"mg_checkbox_checkbox--background_1w9e7","checkbox--checked":"mg_checkbox_checkbox--checked_1w9e7","custom-checked":"mg_checkbox_custom-checked_1w9e7","checkbox__box":"mg_checkbox_checkbox_box_1w9e7","checkbox__box--checked":"mg_checkbox_checkbox_box--checked_1w9e7"};
1678
1678
 
1679
- var cx$1c = classNames.bind(styles$2Q);
1679
+ var cx$1c = classNames.bind(styles$2R);
1680
1680
  var defaultCheck = function (_a) {
1681
1681
  var type = _a.type, checked = _a.checked;
1682
1682
  if (type === 'background')
@@ -1728,9 +1728,9 @@ var context$2 = /*#__PURE__*/Object.freeze({
1728
1728
  useCollapse: useCollapse
1729
1729
  });
1730
1730
 
1731
- var styles$2P = {"magneto-ui-collapse-body":"mg_collapse_body_magneto-ui-collapse-body_1sj1m","magneto-ui-collapse-body--visible":"mg_collapse_body_magneto-ui-collapse-body--visible_1sj1m","magneto-ui-collapse-body__container":"mg_collapse_body_magneto-ui-collapse-body_container_1sj1m","magneto-ui-collapse-body__container--visible":"mg_collapse_body_magneto-ui-collapse-body_container--visible_1sj1m","magneto-ui-collapse-body__content":"mg_collapse_body_magneto-ui-collapse-body_content_1sj1m","magneto-ui-collapse-body__content--visible":"mg_collapse_body_magneto-ui-collapse-body_content--visible_1sj1m"};
1731
+ var styles$2Q = {"magneto-ui-collapse-body":"mg_collapse_body_magneto-ui-collapse-body_1sj1m","magneto-ui-collapse-body--visible":"mg_collapse_body_magneto-ui-collapse-body--visible_1sj1m","magneto-ui-collapse-body__container":"mg_collapse_body_magneto-ui-collapse-body_container_1sj1m","magneto-ui-collapse-body__container--visible":"mg_collapse_body_magneto-ui-collapse-body_container--visible_1sj1m","magneto-ui-collapse-body__content":"mg_collapse_body_magneto-ui-collapse-body_content_1sj1m","magneto-ui-collapse-body__content--visible":"mg_collapse_body_magneto-ui-collapse-body_content--visible_1sj1m"};
1732
1732
 
1733
- var cx$1b = classNames.bind(styles$2P);
1733
+ var cx$1b = classNames.bind(styles$2Q);
1734
1734
  var Component$2_ = function (_a) {
1735
1735
  var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
1736
1736
  var open = useCollapse().open;
@@ -1749,9 +1749,9 @@ var Component$2_ = function (_a) {
1749
1749
  */
1750
1750
  var CollapseBody = Component$2_;
1751
1751
 
1752
- var styles$2O = {"magneto-ui-collapse-header":"mg_collapse_header_magneto-ui-collapse-header_1wc3x"};
1752
+ var styles$2P = {"magneto-ui-collapse-header":"mg_collapse_header_magneto-ui-collapse-header_1wc3x"};
1753
1753
 
1754
- var cx$1a = classNames.bind(styles$2O);
1754
+ var cx$1a = classNames.bind(styles$2P);
1755
1755
  var Component$2Z = function (_a) {
1756
1756
  var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
1757
1757
  return (React__default["default"].createElement("header", __assign({ className: cx$1a('magneto-ui-collapse-header', className) }, props), children));
@@ -1761,9 +1761,9 @@ var Component$2Z = function (_a) {
1761
1761
  */
1762
1762
  var CollapseHeader = Component$2Z;
1763
1763
 
1764
- var styles$2N = {"magneto-ui-collapse-toggler":"mg_collapse_toggler_magneto-ui-collapse-toggler_1ngmx"};
1764
+ var styles$2O = {"magneto-ui-collapse-toggler":"mg_collapse_toggler_magneto-ui-collapse-toggler_1ngmx"};
1765
1765
 
1766
- var cx$19 = classNames.bind(styles$2N);
1766
+ var cx$19 = classNames.bind(styles$2O);
1767
1767
  var Component$2Y = function (_a) {
1768
1768
  var children = _a.children, className = _a.className, onClick = _a.onClick, props = __rest(_a, ["children", "className", "onClick"]);
1769
1769
  var _b = useCollapse(), open = _b.open, onChangeOpen = _b.onChangeOpen;
@@ -1789,7 +1789,7 @@ var Component$2X = function (_a) {
1789
1789
  */
1790
1790
  var Collapse = Object.assign(Component$2X, __assign({ Body: CollapseBody, Header: CollapseHeader, Toggler: CollapseToggler }, context$2));
1791
1791
 
1792
- var styles$2M = {"magneto-ui-comparative-counter":"mg_comparative_counter_magneto-ui-comparative-counter_1ue4r","error-label":"mg_comparative_counter_error-label_1ue4r"};
1792
+ var styles$2N = {"magneto-ui-comparative-counter":"mg_comparative_counter_magneto-ui-comparative-counter_1ue4r","error-label":"mg_comparative_counter_error-label_1ue4r"};
1793
1793
 
1794
1794
  var nf = new Intl.NumberFormat('de-DE');
1795
1795
  var Component$2W = function (_a) {
@@ -1797,7 +1797,7 @@ var Component$2W = function (_a) {
1797
1797
  var currentHigherMax = React.useMemo(function () {
1798
1798
  return current > max;
1799
1799
  }, [current, max]);
1800
- return (React__default["default"].createElement("p", { style: { textAlign: position }, className: "".concat(styles$2M["".concat(classMUI, "-comparative-counter")], " ").concat(currentHigherMax ? styles$2M['error-label'] : '') },
1800
+ return (React__default["default"].createElement("p", { style: { textAlign: position }, className: "".concat(styles$2N["".concat(classMUI, "-comparative-counter")], " ").concat(currentHigherMax ? styles$2N['error-label'] : '') },
1801
1801
  nf.format(current),
1802
1802
  React__default["default"].createElement("span", null,
1803
1803
  " / ",
@@ -1805,23 +1805,23 @@ var Component$2W = function (_a) {
1805
1805
  };
1806
1806
  var ComparativeCounter = Component$2W;
1807
1807
 
1808
- var styles$2L = {"magneto-ui--date-dropdown__icon":"mg_date_dropdown_magneto-ui--date-dropdown_icon_1xs1p","magneto-ui--date-dropdown__wrapper":"mg_date_dropdown_magneto-ui--date-dropdown_wrapper_1xs1p","magneto-ui--date-dropdown__select":"mg_date_dropdown_magneto-ui--date-dropdown_select_1xs1p","magneto-ui--date-dropdown__option":"mg_date_dropdown_magneto-ui--date-dropdown_option_1xs1p"};
1808
+ var styles$2M = {"magneto-ui--date-dropdown__icon":"mg_date_dropdown_magneto-ui--date-dropdown_icon_1xs1p","magneto-ui--date-dropdown__wrapper":"mg_date_dropdown_magneto-ui--date-dropdown_wrapper_1xs1p","magneto-ui--date-dropdown__select":"mg_date_dropdown_magneto-ui--date-dropdown_select_1xs1p","magneto-ui--date-dropdown__option":"mg_date_dropdown_magneto-ui--date-dropdown_option_1xs1p"};
1809
1809
 
1810
1810
  var Component$2V = function (_a) {
1811
1811
  var placeholderLabel = _a.placeholderLabel, dateOptions = _a.dateOptions, _b = _a.selectedOption, selectedOption = _b === void 0 ? '' : _b, onOptionChanged = _a.onOptionChanged, _c = _a.disabled, disabled = _c === void 0 ? false : _c;
1812
1812
  var disabledArrow = React.useMemo(function () {
1813
1813
  if (disabled)
1814
- return (React__default["default"].createElement(IconItem, { className: styles$2L['magneto-ui--date-dropdown__icon'], icon: ArrowDown2, alt: "arrow-icon", size: 24 }));
1814
+ return (React__default["default"].createElement(IconItem, { className: styles$2M['magneto-ui--date-dropdown__icon'], icon: ArrowDown2, alt: "arrow-icon", size: 24 }));
1815
1815
  return React__default["default"].createElement(IconItem, { icon: ArrowDown3, alt: "arrow-icon", size: 24 });
1816
1816
  }, [disabled]);
1817
- return (React__default["default"].createElement("div", { className: styles$2L['magneto-ui--date-dropdown__wrapper'] },
1818
- React__default["default"].createElement("select", { className: styles$2L["magneto-ui--date-dropdown__select"], value: selectedOption, onChange: onOptionChanged, disabled: disabled },
1819
- React__default["default"].createElement("option", { className: styles$2L['magneto-ui--date-dropdown__option'], value: "", disabled: true, hidden: true }, placeholderLabel), dateOptions === null || dateOptions === void 0 ? void 0 :
1817
+ return (React__default["default"].createElement("div", { className: styles$2M['magneto-ui--date-dropdown__wrapper'] },
1818
+ React__default["default"].createElement("select", { className: styles$2M["magneto-ui--date-dropdown__select"], value: selectedOption, onChange: onOptionChanged, disabled: disabled },
1819
+ React__default["default"].createElement("option", { className: styles$2M['magneto-ui--date-dropdown__option'], value: "", disabled: true, hidden: true }, placeholderLabel), dateOptions === null || dateOptions === void 0 ? void 0 :
1820
1820
  dateOptions.map(function (_a) {
1821
1821
  var optionValue = _a.optionValue, optionLabel = _a.optionLabel;
1822
- return (React__default["default"].createElement("option", { className: styles$2L['magneto-ui--date-dropdown__option'], key: optionValue, value: optionValue }, optionLabel));
1822
+ return (React__default["default"].createElement("option", { className: styles$2M['magneto-ui--date-dropdown__option'], key: optionValue, value: optionValue }, optionLabel));
1823
1823
  })),
1824
- React__default["default"].createElement("span", { className: styles$2L['magneto-ui--date-dropdown__icon'] }, disabledArrow)));
1824
+ React__default["default"].createElement("span", { className: styles$2M['magneto-ui--date-dropdown__icon'] }, disabledArrow)));
1825
1825
  };
1826
1826
  var DateDropdown = Component$2V;
1827
1827
 
@@ -1878,7 +1878,7 @@ var fixArrayDate = function (array) {
1878
1878
  return dateArray.setArray(array).fixMonth().getArray();
1879
1879
  };
1880
1880
 
1881
- var styles$2K = {"date-input":"mg_date_input_date-input_1o5wy","date-input__input":"mg_date_input_date-input_input_1o5wy","date-input__separator":"mg_date_input_date-input_separator_1o5wy","date-input__separator--filled":"mg_date_input_date-input_separator--filled_1o5wy","date-input--fit":"mg_date_input_date-input--fit_1o5wy","date-input--error":"mg_date_input_date-input--error_1o5wy","date-input__left":"mg_date_input_date-input_left_1o5wy","date-input__right":"mg_date_input_date-input_right_1o5wy"};
1881
+ var styles$2L = {"date-input":"mg_date_input_date-input_1o5wy","date-input__input":"mg_date_input_date-input_input_1o5wy","date-input__separator":"mg_date_input_date-input_separator_1o5wy","date-input__separator--filled":"mg_date_input_date-input_separator--filled_1o5wy","date-input--fit":"mg_date_input_date-input--fit_1o5wy","date-input--error":"mg_date_input_date-input--error_1o5wy","date-input__left":"mg_date_input_date-input_left_1o5wy","date-input__right":"mg_date_input_date-input_right_1o5wy"};
1882
1882
 
1883
1883
  // placeholder to every input.
1884
1884
  var placeholder = ['D', 'D', 'M', 'M', 'A', 'A', 'A', 'A'];
@@ -1989,50 +1989,50 @@ var Component$2U = function (_a) {
1989
1989
  }
1990
1990
  }, []);
1991
1991
  return (React__default["default"].createElement("div", { className: [
1992
- styles$2K['date-input'],
1992
+ styles$2L['date-input'],
1993
1993
  className,
1994
- fit ? styles$2K['date-input--fit'] : '',
1995
- hasError ? styles$2K['date-input--error'] : ''
1994
+ fit ? styles$2L['date-input--fit'] : '',
1995
+ hasError ? styles$2L['date-input--error'] : ''
1996
1996
  ].join(' ') },
1997
- React__default["default"].createElement("div", { className: styles$2K['date-input__left'], onClick: function () {
1997
+ React__default["default"].createElement("div", { className: styles$2L['date-input__left'], onClick: function () {
1998
1998
  var _a;
1999
1999
  (_a = inputsRef.current[0]) === null || _a === void 0 ? void 0 : _a.focus();
2000
2000
  } }),
2001
2001
  internalValues.map(function (value, index) { return (React__default["default"].createElement(React__default["default"].Fragment, { key: index },
2002
2002
  [2, 4].includes(index) ? (
2003
2003
  // include / separator in date (DD / MM / YYYY)
2004
- React__default["default"].createElement("span", { className: [styles$2K['date-input__separator'], value ? styles$2K['date-input__separator--filled'] : ''].join(' ') }, "/")) : null,
2005
- React__default["default"].createElement("input", { className: styles$2K['date-input__input'], style: { width: width }, type: "text", maxLength: 1, value: value, placeholder: placeholder[index], onChange: function (e) { return handleChange(index, e.target.value); }, onKeyDown: function (e) { return handleKeyDown(index, e.key); }, onPaste: function (e) { return handlePaste(index, e); }, ref: function (el) { return (inputsRef.current[index] = el); }, inputMode: "numeric" }))); }),
2006
- React__default["default"].createElement("div", { className: styles$2K['date-input__right'], onClick: function () {
2004
+ React__default["default"].createElement("span", { className: [styles$2L['date-input__separator'], value ? styles$2L['date-input__separator--filled'] : ''].join(' ') }, "/")) : null,
2005
+ React__default["default"].createElement("input", { className: styles$2L['date-input__input'], style: { width: width }, type: "text", maxLength: 1, value: value, placeholder: placeholder[index], onChange: function (e) { return handleChange(index, e.target.value); }, onKeyDown: function (e) { return handleKeyDown(index, e.key); }, onPaste: function (e) { return handlePaste(index, e); }, ref: function (el) { return (inputsRef.current[index] = el); }, inputMode: "numeric" }))); }),
2006
+ React__default["default"].createElement("div", { className: styles$2L['date-input__right'], onClick: function () {
2007
2007
  var _a;
2008
2008
  (_a = inputsRef.current[inputsRef.current.length - 1]) === null || _a === void 0 ? void 0 : _a.focus();
2009
2009
  } })));
2010
2010
  };
2011
2011
  var DateInput = Component$2U;
2012
2012
 
2013
- var style$15 = {"divider":"mg_divider_divider_1vn87"};
2013
+ var style$14 = {"divider":"mg_divider_divider_1vn87"};
2014
2014
 
2015
2015
  var Component$2T = function (_a) {
2016
2016
  var _b = _a.direction, direction = _b === void 0 ? 'HORIZONTAL' : _b, _c = _a.spacing, spacing = _c === void 0 ? 0 : _c;
2017
2017
  var inlineStyle = direction == 'HORIZONTAL'
2018
2018
  ? { width: 'calc(100% - 10px)', height: 1, margin: "".concat(spacing, "px 0px") }
2019
2019
  : { width: 1, margin: "0px ".concat(spacing, "px ") };
2020
- return React__default["default"].createElement("div", { style: inlineStyle, className: style$15.divider });
2020
+ return React__default["default"].createElement("div", { style: inlineStyle, className: style$14.divider });
2021
2021
  };
2022
2022
  /**
2023
2023
  * Atom UI Divider Component
2024
2024
  */
2025
2025
  var Divider = Component$2T;
2026
2026
 
2027
- var styles$2J = {"dots-loader":"mg_dots_loader_dots-loader_zwly0","dots-loader__dot":"mg_dots_loader_dots-loader_dot_zwly0","bounce":"mg_dots_loader_bounce_zwly0"};
2027
+ var styles$2K = {"dots-loader":"mg_dots_loader_dots-loader_zwly0","dots-loader__dot":"mg_dots_loader_dots-loader_dot_zwly0","bounce":"mg_dots_loader_bounce_zwly0"};
2028
2028
 
2029
2029
  var Component$2S = function (_a) {
2030
2030
  var _b = _a.count, count = _b === void 0 ? 3 : _b, _c = _a.color, color = _c === void 0 ? '#000' : _c;
2031
- return (React__default["default"].createElement("div", { className: styles$2J['dots-loader'] }, Array.from({ length: count }).map(function (_, index) { return (React__default["default"].createElement("span", { key: index, className: styles$2J['dots-loader__dot'], style: { animationDelay: "".concat(index * 0.2, "s"), backgroundColor: color } })); })));
2031
+ return (React__default["default"].createElement("div", { className: styles$2K['dots-loader'] }, Array.from({ length: count }).map(function (_, index) { return (React__default["default"].createElement("span", { key: index, className: styles$2K['dots-loader__dot'], style: { animationDelay: "".concat(index * 0.2, "s"), backgroundColor: color } })); })));
2032
2032
  };
2033
2033
  var DotsLoader = Component$2S;
2034
2034
 
2035
- var styles$2I = {"magneto-ui-flat-loader":"mg_flat_loader_magneto-ui-flat-loader_q96bq","rotation":"mg_flat_loader_rotation_q96bq"};
2035
+ var styles$2J = {"magneto-ui-flat-loader":"mg_flat_loader_magneto-ui-flat-loader_q96bq","rotation":"mg_flat_loader_rotation_q96bq"};
2036
2036
 
2037
2037
  var Component$2R = function (_a) {
2038
2038
  var color = _a.color, size = _a.size, secondColor = _a.secondColor;
@@ -2048,38 +2048,38 @@ var Component$2R = function (_a) {
2048
2048
  height: '15px'
2049
2049
  };
2050
2050
  }, [size]);
2051
- return (React__default["default"].createElement("div", { style: __assign(__assign({}, loadingSize), { border: "2px solid ".concat(color || '#090467'), borderBottomColor: secondColor || 'white' }), className: styles$2I["".concat(classMUI, "-flat-loader")] }));
2051
+ return (React__default["default"].createElement("div", { style: __assign(__assign({}, loadingSize), { border: "2px solid ".concat(color || '#090467'), borderBottomColor: secondColor || 'white' }), className: styles$2J["".concat(classMUI, "-flat-loader")] }));
2052
2052
  };
2053
2053
  var FlatLoader = Component$2R;
2054
2054
 
2055
- var styles$2H = {"headerTabComponent":"mg_header_tab_headerTabComponent_1mp3q","headerTabComponent__count":"mg_header_tab_headerTabComponent_count_1mp3q","headerTabComponent__text":"mg_header_tab_headerTabComponent_text_1mp3q"};
2055
+ var styles$2I = {"headerTabComponent":"mg_header_tab_headerTabComponent_1mp3q","headerTabComponent__count":"mg_header_tab_headerTabComponent_count_1mp3q","headerTabComponent__text":"mg_header_tab_headerTabComponent_text_1mp3q"};
2056
2056
 
2057
2057
  var Component$2Q = function (_a) {
2058
2058
  var tabType = _a.tabType, tabText = _a.tabText, url = _a.url, isActive = _a.isActive, _b = _a.count, count = _b === void 0 ? 0 : _b;
2059
2059
  var TabLink = tabType === 'tabOption' ? url : '';
2060
- return (React__default["default"].createElement(React__default["default"].Fragment, null, tabType === 'tabTitle' ? (React__default["default"].createElement("div", { className: styles$2H.headerTabComponent, "data-tab-type": "tabTitle" },
2061
- count > 0 && React__default["default"].createElement(Badge, { number: count, className: styles$2H['headerTabComponent__count'] }),
2062
- React__default["default"].createElement("p", { className: styles$2H['headerTabComponent__text'] }, tabText))) : (React__default["default"].createElement("a", { className: styles$2H.headerTabComponent, href: TabLink, "data-tab-type": "tabOption", "data-is-active": isActive },
2063
- count > 0 && React__default["default"].createElement(Badge, { number: count, className: styles$2H['headerTabComponent__count'] }),
2064
- React__default["default"].createElement("p", { className: styles$2H['headerTabComponent__text'] }, tabText)))));
2060
+ return (React__default["default"].createElement(React__default["default"].Fragment, null, tabType === 'tabTitle' ? (React__default["default"].createElement("div", { className: styles$2I.headerTabComponent, "data-tab-type": "tabTitle" },
2061
+ count > 0 && React__default["default"].createElement(Badge, { number: count, className: styles$2I['headerTabComponent__count'] }),
2062
+ React__default["default"].createElement("p", { className: styles$2I['headerTabComponent__text'] }, tabText))) : (React__default["default"].createElement("a", { className: styles$2I.headerTabComponent, href: TabLink, "data-tab-type": "tabOption", "data-is-active": isActive },
2063
+ count > 0 && React__default["default"].createElement(Badge, { number: count, className: styles$2I['headerTabComponent__count'] }),
2064
+ React__default["default"].createElement("p", { className: styles$2I['headerTabComponent__text'] }, tabText)))));
2065
2065
  };
2066
2066
  /**
2067
2067
  * UI Atom component for HeaderTab
2068
2068
  */
2069
2069
  var HeaderTab = Component$2Q;
2070
2070
 
2071
- var styles$2G = {"magneto-ui-play-button":"mg_image_magneto-ui-play-button_7q9yc"};
2071
+ var styles$2H = {"magneto-ui-play-button":"mg_image_magneto-ui-play-button_7q9yc"};
2072
2072
 
2073
2073
  var Image = function (_a) {
2074
2074
  var image = _a.image, alt = _a.alt, playIcon = _a.playIcon, className = _a.className;
2075
2075
  return (React__default["default"].createElement(React__default["default"].Fragment, null,
2076
2076
  React__default["default"].createElement("img", { src: image, alt: alt, loading: "lazy", className: className }),
2077
- playIcon && React__default["default"].createElement("div", { className: styles$2G['magneto-ui-play-button'] }, playIcon)));
2077
+ playIcon && React__default["default"].createElement("div", { className: styles$2H['magneto-ui-play-button'] }, playIcon)));
2078
2078
  };
2079
2079
 
2080
- var style$14 = {"magneto-ui-input-file-button":"mg_input_file_button_magneto-ui-input-file-button_18zx0"};
2080
+ var style$13 = {"magneto-ui-input-file-button":"mg_input_file_button_magneto-ui-input-file-button_18zx0"};
2081
2081
 
2082
- var cx$18 = classNames.bind(style$14);
2082
+ var cx$18 = classNames.bind(style$13);
2083
2083
  var Component$2P = function (_a) {
2084
2084
  var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
2085
2085
  return (React__default["default"].createElement("button", __assign({ className: cx$18('magneto-ui-input-file-button', className) }, props), children));
@@ -2089,9 +2089,9 @@ var Component$2P = function (_a) {
2089
2089
  */
2090
2090
  var InputFileButton = Component$2P;
2091
2091
 
2092
- var style$13 = {"magneto-ui-input-file-container":"mg_input_file_container_magneto-ui-input-file-container_1b7ef"};
2092
+ var style$12 = {"magneto-ui-input-file-container":"mg_input_file_container_magneto-ui-input-file-container_1b7ef"};
2093
2093
 
2094
- var cx$17 = classNames.bind(style$13);
2094
+ var cx$17 = classNames.bind(style$12);
2095
2095
  var Component$2O = function (_a) {
2096
2096
  var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
2097
2097
  return (React__default["default"].createElement("div", __assign({ className: cx$17('magneto-ui-input-file-container', className) }, props), children));
@@ -2101,9 +2101,9 @@ var Component$2O = function (_a) {
2101
2101
  */
2102
2102
  var InputFileContainer = Component$2O;
2103
2103
 
2104
- var style$12 = {"magneto-ui-input-file":"mg_input_file_magneto-ui-input-file_18kpr"};
2104
+ var style$11 = {"magneto-ui-input-file":"mg_input_file_magneto-ui-input-file_18kpr"};
2105
2105
 
2106
- var cx$16 = classNames.bind(style$12);
2106
+ var cx$16 = classNames.bind(style$11);
2107
2107
  var Component$2N = function (_a) {
2108
2108
  var children = _a.children, className = _a.className, onChange = _a.onChange, props = __rest(_a, ["children", "className", "onChange"]);
2109
2109
  var inputFileRef = React.useRef(null);
@@ -2139,39 +2139,39 @@ var InputFile = Object.assign(Component$2N, {
2139
2139
  Container: InputFileContainer
2140
2140
  });
2141
2141
 
2142
- var style$11 = {"magneto-ui-container":"mg_input_search_magneto-ui-container_171v5","magneto-ui-container__input-search":"mg_input_search_magneto-ui-container_input-search_171v5","magneto-ui-container__input-search--btn":"mg_input_search_magneto-ui-container_input-search--btn_171v5","magneto-ui-container__input-search--icon":"mg_input_search_magneto-ui-container_input-search--icon_171v5"};
2142
+ var style$10 = {"magneto-ui-container":"mg_input_search_magneto-ui-container_171v5","magneto-ui-container__input-search":"mg_input_search_magneto-ui-container_input-search_171v5","magneto-ui-container__input-search--btn":"mg_input_search_magneto-ui-container_input-search--btn_171v5","magneto-ui-container__input-search--icon":"mg_input_search_magneto-ui-container_input-search--icon_171v5"};
2143
2143
 
2144
2144
  var InputSearch = function (_a) {
2145
2145
  var _b = _a.inputValue, inputValue = _b === void 0 ? '' : _b, onChange = _a.onChange, closeOnClick = _a.closeOnClick, placeholder = _a.placeholder, searchOnClick = _a.searchOnClick;
2146
2146
  var hasASearchFunction = React.useMemo(function () {
2147
2147
  if (searchOnClick) {
2148
- return (React__default["default"].createElement("button", { className: style$11["".concat(classMUI, "-container__input-search--btn")], onClick: searchOnClick },
2149
- React__default["default"].createElement(IconItem, { className: style$11["".concat(classMUI, "-container__input-search--icon")], icon: SearchIcon, alt: "search-icon" })));
2148
+ return (React__default["default"].createElement("button", { className: style$10["".concat(classMUI, "-container__input-search--btn")], onClick: searchOnClick },
2149
+ React__default["default"].createElement(IconItem, { className: style$10["".concat(classMUI, "-container__input-search--icon")], icon: SearchIcon, alt: "search-icon" })));
2150
2150
  }
2151
- return (React__default["default"].createElement(IconItem, { className: style$11["".concat(classMUI, "-container__input-search--icon")], icon: SearchIcon, alt: "search-icon" }));
2151
+ return (React__default["default"].createElement(IconItem, { className: style$10["".concat(classMUI, "-container__input-search--icon")], icon: SearchIcon, alt: "search-icon" }));
2152
2152
  }, [searchOnClick]);
2153
- return (React__default["default"].createElement("div", { className: style$11["".concat(classMUI, "-container")] },
2154
- React__default["default"].createElement("input", { className: style$11["".concat(classMUI, "-container__input-search")], placeholder: placeholder, style: { flex: 1 }, value: inputValue, onChange: onChange, type: "text" }),
2155
- inputValue.length !== 0 ? (React__default["default"].createElement("button", { className: style$11["".concat(classMUI, "-container__input-search--btn")], onClick: closeOnClick },
2153
+ return (React__default["default"].createElement("div", { className: style$10["".concat(classMUI, "-container")] },
2154
+ React__default["default"].createElement("input", { className: style$10["".concat(classMUI, "-container__input-search")], placeholder: placeholder, style: { flex: 1 }, value: inputValue, onChange: onChange, type: "text" }),
2155
+ inputValue.length !== 0 ? (React__default["default"].createElement("button", { className: style$10["".concat(classMUI, "-container__input-search--btn")], onClick: closeOnClick },
2156
2156
  React__default["default"].createElement(IconItem, { icon: Close, alt: "search-icon" }))) : (hasASearchFunction)));
2157
2157
  };
2158
2158
 
2159
- var styles$2F = {"magneto-ui-job-company-logo":"mg_job_company_logo_magneto-ui-job-company-logo_roy42"};
2159
+ var styles$2G = {"magneto-ui-job-company-logo":"mg_job_company_logo_magneto-ui-job-company-logo_roy42"};
2160
2160
 
2161
2161
  var Component$2M = function (_a) {
2162
2162
  var offerCompanyLogo = _a.offerCompanyLogo;
2163
2163
  if (typeof offerCompanyLogo === 'string' || !offerCompanyLogo) {
2164
- return (React__default["default"].createElement("div", { className: styles$2F['magneto-ui-job-company-logo'] },
2164
+ return (React__default["default"].createElement("div", { className: styles$2G['magneto-ui-job-company-logo'] },
2165
2165
  React__default["default"].createElement("img", { src: offerCompanyLogo ? offerCompanyLogo : NoLogo, loading: "lazy", width: '100px', height: '100px' })));
2166
2166
  }
2167
- return React__default["default"].createElement("div", { className: styles$2F['magneto-ui-job-company-logo'] }, offerCompanyLogo);
2167
+ return React__default["default"].createElement("div", { className: styles$2G['magneto-ui-job-company-logo'] }, offerCompanyLogo);
2168
2168
  };
2169
2169
  /**
2170
2170
  * UI Atom component of Company Logo
2171
2171
  */
2172
2172
  var JobCompanyLogo = Component$2M;
2173
2173
 
2174
- var styles$2E = {"magneto-ui-job-header":"mg_job_header_magneto-ui-job-header_vn7ok","magneto-ui-job-header__title":"mg_job_header_magneto-ui-job-header_title_vn7ok","magneto-ui-job-header__subtitle":"mg_job_header_magneto-ui-job-header_subtitle_vn7ok","magneto-ui-job-header__link":"mg_job_header_magneto-ui-job-header_link_vn7ok"};
2174
+ var styles$2F = {"magneto-ui-job-header":"mg_job_header_magneto-ui-job-header_vn7ok","magneto-ui-job-header__title":"mg_job_header_magneto-ui-job-header_title_vn7ok","magneto-ui-job-header__subtitle":"mg_job_header_magneto-ui-job-header_subtitle_vn7ok","magneto-ui-job-header__link":"mg_job_header_magneto-ui-job-header_link_vn7ok"};
2175
2175
 
2176
2176
  var Component$2L = function (_a) {
2177
2177
  var title = _a.title, styles = _a.styles;
@@ -2197,16 +2197,16 @@ var Component$2J = function (_a) {
2197
2197
  if (isHidden || !offerCompanyName)
2198
2198
  return React__default["default"].createElement(React.Fragment, null);
2199
2199
  if (offerCompanyLink) {
2200
- return (React__default["default"].createElement("a", { className: styles$2E['magneto-ui-job-header__link'], href: offerCompanyLink, title: offerCompanyName }, offerCompanyName));
2200
+ return (React__default["default"].createElement("a", { className: styles$2F['magneto-ui-job-header__link'], href: offerCompanyLink, title: offerCompanyName }, offerCompanyName));
2201
2201
  }
2202
- return React__default["default"].createElement("h2", { className: styles$2E['magneto-ui-job-header__subtitle'] }, offerCompanyName);
2202
+ return React__default["default"].createElement("h2", { className: styles$2F['magneto-ui-job-header__subtitle'] }, offerCompanyName);
2203
2203
  }, [isHidden, offerCompanyLink, offerCompanyName]);
2204
2204
  var GenerateTitle = function () {
2205
2205
  if (typeTitle === TYPE_TITLE.SUB_TITLE)
2206
- return React__default["default"].createElement(SubTitleJobDetails, { styles: styles$2E['magneto-ui-job-header__title'], title: String(offerTitle) });
2207
- return React__default["default"].createElement(MainTitleJobDetails, { styles: styles$2E['magneto-ui-job-header__title'], title: String(offerTitle) });
2206
+ return React__default["default"].createElement(SubTitleJobDetails, { styles: styles$2F['magneto-ui-job-header__title'], title: String(offerTitle) });
2207
+ return React__default["default"].createElement(MainTitleJobDetails, { styles: styles$2F['magneto-ui-job-header__title'], title: String(offerTitle) });
2208
2208
  };
2209
- return (React__default["default"].createElement("div", { className: styles$2E['magneto-ui-job-header'] },
2209
+ return (React__default["default"].createElement("div", { className: styles$2F['magneto-ui-job-header'] },
2210
2210
  GenerateTitle(),
2211
2211
  showCompanyName));
2212
2212
  };
@@ -2215,7 +2215,7 @@ var Component$2J = function (_a) {
2215
2215
  */
2216
2216
  var JobHeader = Component$2J;
2217
2217
 
2218
- var styles$2D = {"linkComponent":"mg_link_linkComponent_1sftl"};
2218
+ var styles$2E = {"linkComponent":"mg_link_linkComponent_1sftl"};
2219
2219
 
2220
2220
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
2221
2221
  var toCSSVariables = function (input) {
@@ -2234,7 +2234,7 @@ var toCSSVariables = function (input) {
2234
2234
  var Component$2I = function (_a) {
2235
2235
  var type = _a.type, href = _a.href, text = _a.text, title = _a.title, iconProps = _a.iconProps, linkStyles = _a.linkStyles, isMobile = _a.isMobile, rel = _a.rel, target = _a.target;
2236
2236
  var stylesValue = React.useMemo(function () { return toCSSVariables(linkStyles); }, [linkStyles]);
2237
- return (React__default["default"].createElement("a", { className: styles$2D.linkComponent, style: stylesValue, href: href, title: title ? title : text, "data-link-type": type, "data-is-mobile": isMobile, rel: rel, target: target },
2237
+ return (React__default["default"].createElement("a", { className: styles$2E.linkComponent, style: stylesValue, href: href, title: title ? title : text, "data-link-type": type, "data-is-mobile": isMobile, rel: rel, target: target },
2238
2238
  iconProps && React__default["default"].createElement(IconItem, __assign({}, iconProps)),
2239
2239
  !isMobile && React__default["default"].createElement("p", null, text)));
2240
2240
  };
@@ -2243,11 +2243,11 @@ var Component$2I = function (_a) {
2243
2243
  */
2244
2244
  var Link = Component$2I;
2245
2245
 
2246
- var styles$2C = {"loadingComponent":"mg_loading_loadingComponent_qi83n","animate":"mg_loading_animate_qi83n"};
2246
+ var styles$2D = {"loadingComponent":"mg_loading_loadingComponent_qi83n","animate":"mg_loading_animate_qi83n"};
2247
2247
 
2248
2248
  var Component$2H = function (_a) {
2249
2249
  var loadingIcon = _a.loadingIcon;
2250
- return (React__default["default"].createElement("div", { className: styles$2C.loadingComponent },
2250
+ return (React__default["default"].createElement("div", { className: styles$2D.loadingComponent },
2251
2251
  React__default["default"].createElement(IconItem, __assign({}, loadingIcon))));
2252
2252
  };
2253
2253
  /**
@@ -2255,7 +2255,7 @@ var Component$2H = function (_a) {
2255
2255
  */
2256
2256
  var Loading = Component$2H;
2257
2257
 
2258
- var style$10 = {"magneto-ui-logo":"mg_logo_magneto-ui-logo_e7jog","magneto-ui-isologo":"mg_logo_magneto-ui-isologo_e7jog"};
2258
+ var style$$ = {"magneto-ui-logo":"mg_logo_magneto-ui-logo_e7jog","magneto-ui-isologo":"mg_logo_magneto-ui-isologo_e7jog"};
2259
2259
 
2260
2260
  var Component$2G = function (_a) {
2261
2261
  var fallbackImage = _a.fallbackImage, _b = _a.showDefaultFallback, showDefaultFallback = _b === void 0 ? true : _b, _c = _a.isoView, isoView = _c === void 0 ? false : _c, logo = _a.logo, isoType = _a.isoType, alt = _a.alt;
@@ -2267,11 +2267,11 @@ var Component$2G = function (_a) {
2267
2267
  var logoWidth = React.useMemo(function () { return (isoView ? 'magneto-ui-isologo' : 'magneto-ui-logo'); }, [isoView]);
2268
2268
  if (!logoSrc && !showDefaultFallback)
2269
2269
  return null;
2270
- return (React__default["default"].createElement("img", { className: style$10[logoWidth], src: logoSrc, alt: alt, width: isoView ? '25px' : '110px', height: "auto", loading: "lazy", onError: handleError }));
2270
+ return (React__default["default"].createElement("img", { className: style$$[logoWidth], src: logoSrc, alt: alt, width: isoView ? '25px' : '110px', height: "auto", loading: "lazy", onError: handleError }));
2271
2271
  };
2272
2272
  var LogoComponent = Component$2G;
2273
2273
 
2274
- var styles$2B = {"MainButtonComponent":"mg_main_button_MainButtonComponent_lh5z0","disabled":"mg_main_button_disabled_lh5z0"};
2274
+ var styles$2C = {"MainButtonComponent":"mg_main_button_MainButtonComponent_lh5z0","disabled":"mg_main_button_disabled_lh5z0"};
2275
2275
 
2276
2276
  var Component$2F = function (_a) {
2277
2277
  var buttonType = _a.buttonType, buttonSize = _a.buttonSize, buttonText = _a.buttonText, buttonStyles = _a.buttonStyles, loadingState = _a.loadingState, iconProps = _a.iconProps, isMobile = _a.isMobile, className = _a.className, _b = _a.title, title = _b === void 0 ? '' : _b, disabled = _a.disabled, onClick = _a.onClick;
@@ -2286,21 +2286,21 @@ var Component$2F = function (_a) {
2286
2286
  iconProps && React__default["default"].createElement(IconItem, __assign({}, iconProps)),
2287
2287
  !isMobile && React__default["default"].createElement("p", null, buttonText)));
2288
2288
  };
2289
- return (React__default["default"].createElement("button", { className: "".concat(styles$2B.MainButtonComponent, " ").concat(className, " ").concat(disabled ? styles$2B.disabled : ''), type: buttonType, style: stylesValue, onClick: onClick, "data-button-size": buttonSize, "data-is-mobile": isMobile, title: title ? title : buttonText, disabled: disabled }, renderContent()));
2289
+ return (React__default["default"].createElement("button", { className: "".concat(styles$2C.MainButtonComponent, " ").concat(className, " ").concat(disabled ? styles$2C.disabled : ''), type: buttonType, style: stylesValue, onClick: onClick, "data-button-size": buttonSize, "data-is-mobile": isMobile, title: title ? title : buttonText, disabled: disabled }, renderContent()));
2290
2290
  };
2291
2291
  /**
2292
2292
  * Atom UI component of button for general purpose
2293
2293
  */
2294
2294
  var MainButton = Component$2F;
2295
2295
 
2296
- var styles$2A = {"magneto-ui-mega-menu-tab":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_f61nm","magneto-ui-mega-menu-tab__icon":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_icon_f61nm","magneto-ui-mega-menu-tab__selected":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_selected_f61nm","magneto-ui-mega-menu-tab__label":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_label_f61nm","magneto-ui-mega-menu-tab__label-selected":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_label-selected_f61nm"};
2296
+ var styles$2B = {"magneto-ui-mega-menu-tab":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_f61nm","magneto-ui-mega-menu-tab__icon":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_icon_f61nm","magneto-ui-mega-menu-tab__selected":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_selected_f61nm","magneto-ui-mega-menu-tab__label":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_label_f61nm","magneto-ui-mega-menu-tab__label-selected":"mg_mega_menu_tab_magneto-ui-mega-menu-tab_label-selected_f61nm"};
2297
2297
 
2298
- var styles$2z = {"magneto-ui--search-item":"mg_search_item_magneto-ui--search-item_15w47","magneto-ui--search-item__text":"mg_search_item_magneto-ui--search-item_text_15w47"};
2298
+ var styles$2A = {"magneto-ui--search-item":"mg_search_item_magneto-ui--search-item_15w47","magneto-ui--search-item__text":"mg_search_item_magneto-ui--search-item_text_15w47"};
2299
2299
 
2300
2300
  var Component$2E = function (_a) {
2301
2301
  var tag = _a.tag, url = _a.url, className = _a.className, _b = _a.icon, icon = _b === void 0 ? ArrowRight2 : _b;
2302
- return (React__default["default"].createElement("a", { title: tag, className: "".concat(className ? className : styles$2z['magneto-ui--search-item']), href: url },
2303
- React__default["default"].createElement("p", { className: styles$2z['magneto-ui--search-item__text'] }, tag),
2302
+ return (React__default["default"].createElement("a", { title: tag, className: "".concat(className ? className : styles$2A['magneto-ui--search-item']), href: url },
2303
+ React__default["default"].createElement("p", { className: styles$2A['magneto-ui--search-item__text'] }, tag),
2304
2304
  React__default["default"].createElement(IconItem, { alt: "arrow icon", hover: false, icon: icon, size: 14 })));
2305
2305
  };
2306
2306
  /**
@@ -2315,21 +2315,21 @@ var MegaMenuTab = function (_a) {
2315
2315
  return '';
2316
2316
  return ArrowDown2;
2317
2317
  }, [selected, showArrow]);
2318
- return (React__default["default"].createElement("div", { className: "".concat(styles$2A["".concat(classMUI, "-mega-menu-tab")], " ").concat(selected ? styles$2A["".concat(classMUI, "-mega-menu-tab__selected")] : '') },
2319
- React__default["default"].createElement(SearchItem, { tag: label, url: url, icon: icon, className: "".concat(styles$2A["".concat(classMUI, "-mega-menu-tab__label")], " ").concat(selected ? styles$2A["".concat(classMUI, "-mega-menu-tab__label-selected")] : '') })));
2318
+ return (React__default["default"].createElement("div", { className: "".concat(styles$2B["".concat(classMUI, "-mega-menu-tab")], " ").concat(selected ? styles$2B["".concat(classMUI, "-mega-menu-tab__selected")] : '') },
2319
+ React__default["default"].createElement(SearchItem, { tag: label, url: url, icon: icon, className: "".concat(styles$2B["".concat(classMUI, "-mega-menu-tab__label")], " ").concat(selected ? styles$2B["".concat(classMUI, "-mega-menu-tab__label-selected")] : '') })));
2320
2320
  };
2321
2321
 
2322
- var styles$2y = {"magneto-ui-menu-dropdown-list":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_18usg","magneto-ui-menu-dropdown-list--visible":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list--visible_18usg","magneto-ui-menu-dropdown-list__container":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_container_18usg","magneto-ui-menu-dropdown-list__container--visible":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_container--visible_18usg","magneto-ui-menu-dropdown-list__children":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_children_18usg","magneto-ui-menu-dropdown-list__children--visible":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_children--visible_18usg"};
2322
+ var styles$2z = {"magneto-ui-menu-dropdown-list":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_18usg","magneto-ui-menu-dropdown-list--visible":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list--visible_18usg","magneto-ui-menu-dropdown-list__container":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_container_18usg","magneto-ui-menu-dropdown-list__container--visible":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_container--visible_18usg","magneto-ui-menu-dropdown-list__children":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_children_18usg","magneto-ui-menu-dropdown-list__children--visible":"mg_menu_dropdown_list_magneto-ui-menu-dropdown-list_children--visible_18usg"};
2323
2323
 
2324
2324
  var Component$2D = function (_a) {
2325
2325
  var children = _a.children, listClassName = _a.listClassName, opened = _a.opened;
2326
- return (React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2y, cls: ['menu-dropdown-list', opened && 'menu-dropdown-list--visible'] }) },
2326
+ return (React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2z, cls: ['menu-dropdown-list', opened && 'menu-dropdown-list--visible'] }) },
2327
2327
  React__default["default"].createElement("div", { className: CNM.get({
2328
- styles: styles$2y,
2328
+ styles: styles$2z,
2329
2329
  cls: ['menu-dropdown-list__container', opened && 'menu-dropdown-list__container--visible']
2330
2330
  }) },
2331
2331
  React__default["default"].createElement("div", { className: CNM.get({
2332
- styles: styles$2y,
2332
+ styles: styles$2z,
2333
2333
  cls: ['menu-dropdown-list__children', opened && 'menu-dropdown-list__children--visible', listClassName]
2334
2334
  }) }, children))));
2335
2335
  };
@@ -2338,7 +2338,7 @@ var Component$2D = function (_a) {
2338
2338
  */
2339
2339
  var MenuDropdownList = Component$2D;
2340
2340
 
2341
- var styles$2x = {"magneto-ui-menu-dropdown__content":"mg_menu_dropdown_magneto-ui-menu-dropdown_content_v03jf","magneto-ui-menu-dropdown__container":"mg_menu_dropdown_magneto-ui-menu-dropdown_container_v03jf","magneto-ui-menu-dropdown__title":"mg_menu_dropdown_magneto-ui-menu-dropdown_title_v03jf","magneto-ui-menu-dropdown__suffix":"mg_menu_dropdown_magneto-ui-menu-dropdown_suffix_v03jf","magneto-ui-menu-dropdown__suffix--visible":"mg_menu_dropdown_magneto-ui-menu-dropdown_suffix--visible_v03jf"};
2341
+ var styles$2y = {"magneto-ui-menu-dropdown__content":"mg_menu_dropdown_magneto-ui-menu-dropdown_content_v03jf","magneto-ui-menu-dropdown__container":"mg_menu_dropdown_magneto-ui-menu-dropdown_container_v03jf","magneto-ui-menu-dropdown__title":"mg_menu_dropdown_magneto-ui-menu-dropdown_title_v03jf","magneto-ui-menu-dropdown__suffix":"mg_menu_dropdown_magneto-ui-menu-dropdown_suffix_v03jf","magneto-ui-menu-dropdown__suffix--visible":"mg_menu_dropdown_magneto-ui-menu-dropdown_suffix--visible_v03jf"};
2342
2342
 
2343
2343
  var Component$2C = function (_a) {
2344
2344
  var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.listClassName, listClassName = _c === void 0 ? '' : _c, onClick = _a.onClick, opened = _a.opened, prefixIcon = _a.prefixIcon, _d = _a.suffixIcon, suffixIcon = _d === void 0 ? { icon: ArrowDownWhite } : _d, title = _a.title;
@@ -2355,13 +2355,13 @@ var Component$2C = function (_a) {
2355
2355
  var handleButtonClick = React.useCallback(function (e) {
2356
2356
  e.stopPropagation();
2357
2357
  }, []);
2358
- return (React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2x, cls: ['menu-dropdown', className] }), onClick: toggleOptions },
2359
- React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2x, cls: ['menu-dropdown__content'] }) },
2360
- React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2x, cls: ['menu-dropdown__container'] }) },
2358
+ return (React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2y, cls: ['menu-dropdown', className] }), onClick: toggleOptions },
2359
+ React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2y, cls: ['menu-dropdown__content'] }) },
2360
+ React__default["default"].createElement("div", { className: CNM.get({ styles: styles$2y, cls: ['menu-dropdown__container'] }) },
2361
2361
  prefixIcon && React__default["default"].createElement(IconItem, __assign({ size: 18 }, prefixIcon)),
2362
- React__default["default"].createElement("span", { className: CNM.get({ styles: styles$2x, cls: ['menu-dropdown__title'] }) }, title),
2362
+ React__default["default"].createElement("span", { className: CNM.get({ styles: styles$2y, cls: ['menu-dropdown__title'] }) }, title),
2363
2363
  React__default["default"].createElement("div", { className: CNM.get({
2364
- styles: styles$2x,
2364
+ styles: styles$2y,
2365
2365
  cls: ['menu-dropdown__suffix', localOpened && 'menu-dropdown__suffix--visible']
2366
2366
  }) },
2367
2367
  React__default["default"].createElement(IconItem, __assign({ size: 18 }, suffixIcon)))),
@@ -2373,18 +2373,18 @@ var Component$2C = function (_a) {
2373
2373
  */
2374
2374
  var MenuDropdown = Component$2C;
2375
2375
 
2376
- var style$$ = {"magneto-ui-menu-item":"mg_menu_items_magneto-ui-menu-item_1dxy3","is-active":"mg_menu_items_is-active_1dxy3"};
2376
+ var style$_ = {"magneto-ui-menu-item":"mg_menu_items_magneto-ui-menu-item_1dxy3","is-active":"mg_menu_items_is-active_1dxy3"};
2377
2377
 
2378
2378
  var MenuItem = function (_a) {
2379
2379
  var _b = _a.url, url = _b === void 0 ? '#' : _b, _c = _a.text, text = _c === void 0 ? '' : _c, isActive = _a.isActive;
2380
- var menuActive = isActive ? style$$['is-active'] : '';
2380
+ var menuActive = isActive ? style$_['is-active'] : '';
2381
2381
  return (React__default["default"].createElement("div", null,
2382
- React__default["default"].createElement("a", { href: url, className: "".concat(style$$['magneto-ui-menu-item'], " ").concat(menuActive) },
2382
+ React__default["default"].createElement("a", { href: url, className: "".concat(style$_['magneto-ui-menu-item'], " ").concat(menuActive) },
2383
2383
  React__default["default"].createElement(IconItem, { icon: ArrowRight2, hover: false }),
2384
2384
  React__default["default"].createElement("p", null, text))));
2385
2385
  };
2386
2386
 
2387
- var styles$2w = {"container":"mg_multi_range_slider_container_y44v2","slider":"mg_multi_range_slider_slider_y44v2","track":"mg_multi_range_slider_track_y44v2","range":"mg_multi_range_slider_range_y44v2","values":"mg_multi_range_slider_values_y44v2","left_value":"mg_multi_range_slider_left_value_y44v2","right_value":"mg_multi_range_slider_right_value_y44v2","thumb":"mg_multi_range_slider_thumb_y44v2","zIndex_3":"mg_multi_range_slider_zIndex_3_y44v2","zIndex_4":"mg_multi_range_slider_zIndex_4_y44v2","zIndex_5":"mg_multi_range_slider_zIndex_5_y44v2"};
2387
+ var styles$2x = {"container":"mg_multi_range_slider_container_y44v2","slider":"mg_multi_range_slider_slider_y44v2","track":"mg_multi_range_slider_track_y44v2","range":"mg_multi_range_slider_range_y44v2","values":"mg_multi_range_slider_values_y44v2","left_value":"mg_multi_range_slider_left_value_y44v2","right_value":"mg_multi_range_slider_right_value_y44v2","thumb":"mg_multi_range_slider_thumb_y44v2","zIndex_3":"mg_multi_range_slider_zIndex_3_y44v2","zIndex_4":"mg_multi_range_slider_zIndex_4_y44v2","zIndex_5":"mg_multi_range_slider_zIndex_5_y44v2"};
2388
2388
 
2389
2389
  var MultiRangeSlider = function (_a) {
2390
2390
  var min = _a.min, max = _a.max, currentMin = _a.currentMin, currentMax = _a.currentMax, _b = _a.showValues, showValues = _b === void 0 ? true : _b, onChange = _a.onChange, currency = _a.currency, _c = _a.steps, steps = _c === void 0 ? 0 : _c, _d = _a.size, size = _d === void 0 ? 260 : _d, defaultMin = _a.defaultMin, defaultMax = _a.defaultMax;
@@ -2442,39 +2442,39 @@ var MultiRangeSlider = function (_a) {
2442
2442
  var handleMouseUpValues = React.useCallback(function () {
2443
2443
  onChange({ min: minVal, max: maxVal });
2444
2444
  }, [minVal, maxVal, onChange]);
2445
- return (React__default["default"].createElement("div", { className: styles$2w.container },
2445
+ return (React__default["default"].createElement("div", { className: styles$2x.container },
2446
2446
  React__default["default"].createElement("input", { style: { width: size }, type: "range", min: min, max: max, step: steps, value: minVal, ref: minValRef, onMouseUp: handleMouseUpValues, onChange: function (event) {
2447
2447
  var value = Math.min(+event.target.value, maxVal - 1);
2448
2448
  setMinVal(value);
2449
2449
  event.target.value = value.toString();
2450
- }, className: "\n ".concat(styles$2w.thumb, " \n ").concat(styles$2w.zIndex_3, " \n ").concat(minVal > max - 100 ? styles$2w.zIndex_5 : '', "\n ") }),
2450
+ }, className: "\n ".concat(styles$2x.thumb, " \n ").concat(styles$2x.zIndex_3, " \n ").concat(minVal > max - 100 ? styles$2x.zIndex_5 : '', "\n ") }),
2451
2451
  React__default["default"].createElement("input", { type: "range", style: { width: size }, min: min, max: max, step: steps, value: maxVal, ref: maxValRef, onMouseUp: handleMouseUpValues, onChange: function (event) {
2452
2452
  var value = Math.max(+event.target.value, minVal + 1);
2453
2453
  setMaxVal(value);
2454
2454
  event.target.value = value.toString();
2455
- }, className: "".concat(styles$2w.thumb, " ").concat(styles$2w.zIndex_4) }),
2456
- React__default["default"].createElement("div", { style: { width: size }, className: styles$2w.slider },
2457
- React__default["default"].createElement("div", { className: styles$2w.track }),
2458
- React__default["default"].createElement("div", { ref: range, className: styles$2w.range }),
2459
- showValues && (React__default["default"].createElement("div", { className: styles$2w.values },
2460
- React__default["default"].createElement("div", { className: styles$2w.left_value }, hasCurrency),
2461
- React__default["default"].createElement("div", { className: styles$2w.right_value }, maxVal.toLocaleString()))))));
2455
+ }, className: "".concat(styles$2x.thumb, " ").concat(styles$2x.zIndex_4) }),
2456
+ React__default["default"].createElement("div", { style: { width: size }, className: styles$2x.slider },
2457
+ React__default["default"].createElement("div", { className: styles$2x.track }),
2458
+ React__default["default"].createElement("div", { ref: range, className: styles$2x.range }),
2459
+ showValues && (React__default["default"].createElement("div", { className: styles$2x.values },
2460
+ React__default["default"].createElement("div", { className: styles$2x.left_value }, hasCurrency),
2461
+ React__default["default"].createElement("div", { className: styles$2x.right_value }, maxVal.toLocaleString()))))));
2462
2462
  };
2463
2463
 
2464
- var styles$2v = {"content":"mg_paragraph_content_1mtnz"};
2464
+ var styles$2w = {"content":"mg_paragraph_content_1mtnz"};
2465
2465
 
2466
2466
  var Component$2B = function (_a) {
2467
2467
  var paragraph = _a.paragraph;
2468
- return React__default["default"].createElement("p", { className: styles$2v.content }, paragraph);
2468
+ return React__default["default"].createElement("p", { className: styles$2w.content }, paragraph);
2469
2469
  };
2470
2470
  var Paragraph = React.memo(Component$2B);
2471
2471
 
2472
- var style$_ = {"magneto-ui-popover-container":"mg_popover_magneto-ui-popover-container_h7qn6","magneto-ui-popover":"mg_popover_magneto-ui-popover_h7qn6","magneto-ui-popover-children":"mg_popover_magneto-ui-popover-children_h7qn6","left":"mg_popover_left_h7qn6","right":"mg_popover_right_h7qn6","center":"mg_popover_center_h7qn6","top":"mg_popover_top_h7qn6","bottom":"mg_popover_bottom_h7qn6","show":"mg_popover_show_h7qn6","static-content":"mg_popover_static-content_h7qn6","hidden":"mg_popover_hidden_h7qn6"};
2472
+ var styles$2v = {"magneto-ui-popover-container":"mg_popover_magneto-ui-popover-container_h7qn6","magneto-ui-popover":"mg_popover_magneto-ui-popover_h7qn6","magneto-ui-popover-children":"mg_popover_magneto-ui-popover-children_h7qn6","left":"mg_popover_left_h7qn6","right":"mg_popover_right_h7qn6","center":"mg_popover_center_h7qn6","top":"mg_popover_top_h7qn6","bottom":"mg_popover_bottom_h7qn6","show":"mg_popover_show_h7qn6","static-content":"mg_popover_static-content_h7qn6","hidden":"mg_popover_hidden_h7qn6"};
2473
2473
 
2474
2474
  var Component$2A = function (_a) {
2475
- var children = _a.children, content = _a.content, positionX = _a.positionX, positionY = _a.positionY, show = _a.show, widthBase = _a.widthBase, staticContent = _a.staticContent, _b = _a.className, className = _b === void 0 ? '' : _b;
2475
+ var children = _a.children, content = _a.content, positionX = _a.positionX, positionY = _a.positionY, show = _a.show, widthBase = _a.widthBase, staticContent = _a.staticContent, _b = _a.className, className = _b === void 0 ? '' : _b, style = _a.style;
2476
2476
  var showMenu = show ? 'show' : 'hidden';
2477
- var staticContentClass = staticContent ? style$_['static-content'] : '';
2477
+ var staticContentClass = staticContent ? styles$2v['static-content'] : '';
2478
2478
  var _c = React.useState(false), hideComponent = _c[0], setHideComponent = _c[1];
2479
2479
  React.useEffect(function () {
2480
2480
  if (show) {
@@ -2486,9 +2486,9 @@ var Component$2A = function (_a) {
2486
2486
  }, 300);
2487
2487
  return function () { return clearTimeout(timer); };
2488
2488
  }, [show]);
2489
- return (React__default["default"].createElement("div", { style: { width: widthBase }, className: [style$_['magneto-ui-popover-container'], staticContentClass, className].join(' ') },
2490
- React__default["default"].createElement("div", { className: "".concat(style$_['magneto-ui-popover'], " ").concat(style$_[positionX], " ").concat(style$_[positionY], " ").concat(style$_[showMenu]) }, hideComponent && content),
2491
- React__default["default"].createElement("div", { className: style$_['magneto-ui-popover-children'] }, children)));
2489
+ return (React__default["default"].createElement("div", { style: { width: widthBase }, className: [styles$2v['magneto-ui-popover-container'], staticContentClass, className].join(' ') },
2490
+ React__default["default"].createElement("div", { className: "".concat(styles$2v['magneto-ui-popover'], " ").concat(styles$2v[positionX], " ").concat(styles$2v[positionY], " ").concat(styles$2v[showMenu]) }, hideComponent && content),
2491
+ React__default["default"].createElement("div", { style: style, className: styles$2v['magneto-ui-popover-children'] }, children)));
2492
2492
  };
2493
2493
  /**
2494
2494
  * Atom Ui component of popover
@@ -5695,10 +5695,11 @@ var SimilarJobsCard = function (_a) {
5695
5695
  React__default["default"].createElement(IconItem, { className: "".concat(styles$1e["".concat(classMUI, "-similar-jobs__arrow")]), icon: ArrowRight2, alt: "arow-right-icon" })));
5696
5696
  };
5697
5697
 
5698
- var style$z = {"magneto-ui-btn-menu":"mg_sort_menu_magneto-ui-btn-menu_lw7uc","magneto-ui-btn-text":"mg_sort_menu_magneto-ui-btn-text_lw7uc","disabled":"mg_sort_menu_disabled_lw7uc"};
5698
+ var style$z = {"magneto-ui-btn-menu":"mg_sort_menu_magneto-ui-btn-menu_1g7nr","magneto-ui-btn-text":"mg_sort_menu_magneto-ui-btn-text_1g7nr","disabled":"mg_sort_menu_disabled_1g7nr"};
5699
5699
 
5700
5700
  var SortMenu = function (_a) {
5701
5701
  var orderFields = _a.orderFields, textOrderFilter = _a.textOrderFilter, setFilter = _a.setFilter, _b = _a.clickOut, clickOut = _b === void 0 ? false : _b, loading = _a.loading, _c = _a.setClickOut, setClickOut = _c === void 0 ? function () { return ({}); } : _c;
5702
+ var buttonTextRef = React.useRef(null);
5702
5703
  var listMenuProps = React.useMemo(function () {
5703
5704
  return {
5704
5705
  orderFields: orderFields,
@@ -5707,9 +5708,16 @@ var SortMenu = function (_a) {
5707
5708
  textOrderFilter: textOrderFilter
5708
5709
  };
5709
5710
  }, [orderFields, textOrderFilter, setFilter, setClickOut]);
5710
- return (React__default["default"].createElement(Popover, { widthBase: 180, show: clickOut, content: React__default["default"].createElement(ListSortMenu, __assign({}, listMenuProps)), positionX: "left", positionY: "bottom" },
5711
+ var getButtonWidth = function () {
5712
+ if (buttonTextRef.current) {
5713
+ var rect = buttonTextRef.current.getBoundingClientRect();
5714
+ return rect.width + 42;
5715
+ }
5716
+ return 180;
5717
+ };
5718
+ return (React__default["default"].createElement(Popover, { widthBase: getButtonWidth(), show: clickOut, content: React__default["default"].createElement(ListSortMenu, __assign({}, listMenuProps)), positionX: "left", positionY: "bottom", style: { height: '75%' } },
5711
5719
  React__default["default"].createElement("button", { className: "".concat(style$z['magneto-ui-btn-menu'], " ").concat(loading && style$z.disabled), title: textOrderFilter, onClick: function () { return setClickOut(!clickOut); }, disabled: loading },
5712
- React__default["default"].createElement("p", { className: style$z['magneto-ui-btn-text'] }, textOrderFilter),
5720
+ React__default["default"].createElement("p", { className: style$z['magneto-ui-btn-text'], ref: buttonTextRef }, textOrderFilter),
5713
5721
  React__default["default"].createElement(IconItem, __assign({}, menuSortButton, { isRotate: clickOut })))));
5714
5722
  };
5715
5723
  var SortMenu$1 = withClickOut(SortMenu);
@@ -9593,11 +9601,12 @@ var SideFilter = function (_a) {
9593
9601
  displayBackground));
9594
9602
  };
9595
9603
 
9596
- var styles = {"magneto-ui-sort-menu":"mg_sort_bar_magneto-ui-sort-menu_11tya","magneto-ui-section-filter":"mg_sort_bar_magneto-ui-section-filter_11tya","magneto-ui-main-title":"mg_sort_bar_magneto-ui-main-title_11tya","magneto-ui-btn-text":"mg_sort_bar_magneto-ui-btn-text_11tya","magneto-ui-tooltip-quotas":"mg_sort_bar_magneto-ui-tooltip-quotas_11tya","magneto-ui-btn-menu":"mg_sort_bar_magneto-ui-btn-menu_11tya","magneto-ui-section-menu":"mg_sort_bar_magneto-ui-section-menu_11tya","magneto-ui-btn-order":"mg_sort_bar_magneto-ui-btn-order_11tya","hidden":"mg_sort_bar_hidden_11tya"};
9604
+ var styles = {"magneto-ui-sort-menu":"mg_sort_bar_magneto-ui-sort-menu_1i5rn","magneto-ui-section-filter":"mg_sort_bar_magneto-ui-section-filter_1i5rn","magneto-ui-main-title":"mg_sort_bar_magneto-ui-main-title_1i5rn","magneto-ui-btn-text":"mg_sort_bar_magneto-ui-btn-text_1i5rn","magneto-ui-tooltip-quotas":"mg_sort_bar_magneto-ui-tooltip-quotas_1i5rn","magneto-ui-btn-menu":"mg_sort_bar_magneto-ui-btn-menu_1i5rn","magneto-ui-section-menu":"mg_sort_bar_magneto-ui-section-menu_1i5rn","magneto-ui-btn-order":"mg_sort_bar_magneto-ui-btn-order_1i5rn","hidden":"mg_sort_bar_hidden_1i5rn"};
9597
9605
 
9598
9606
  var SortBar = function (_a) {
9599
9607
  var textSortButton = _a.textSortButton, mainTitle = _a.mainTitle, filterSummary = _a.filterSummary, textOrderFilter = _a.textOrderFilter, orderFields = _a.orderFields, orderByText = _a.orderByText, loading = _a.loading, _b = _a.titleBtnOrder, titleBtnOrder = _b === void 0 ? '' : _b, setIsFiltersOpen = _a.setIsFiltersOpen, orderFilter = _a.orderFilter, setFilter = _a.setFilter, emptyVacant = _a.emptyVacant, infoMessageQuotas = _a.infoMessageQuotas, widthInfoMessage = _a.widthInfoMessage;
9600
9608
  var _c = React.useState(false), showMenu = _c[0], setShowMenu = _c[1];
9609
+ var _d = React.useState(false), rotateOrderIcon = _d[0], setRotateOrderIcon = _d[1];
9601
9610
  var tooltip = useMediaQuery(React__default["default"].createElement(Tooltip, { title: infoMessageQuotas || '', position: "bottom", width: widthInfoMessage },
9602
9611
  React__default["default"].createElement("div", { className: "".concat(styles['magneto-ui-tooltip-quotas']) },
9603
9612
  React__default["default"].createElement("span", null, "?"))), { sm: React__default["default"].createElement(React.Fragment, null) });
@@ -9609,14 +9618,18 @@ var SortBar = function (_a) {
9609
9618
  var mainTitleByMediaQuery = useMediaQuery(React__default["default"].createElement("h1", { className: styles['magneto-ui-main-title'] }, mainTitle), {
9610
9619
  md: React__default["default"].createElement(React.Fragment, null)
9611
9620
  });
9621
+ var handleOrder = React.useCallback(function () {
9622
+ orderFilter();
9623
+ setRotateOrderIcon(!rotateOrderIcon);
9624
+ }, [rotateOrderIcon, orderFilter]);
9612
9625
  var sortBarButtonAltRender = React.useMemo(function () {
9613
9626
  if (emptyVacant)
9614
9627
  return;
9615
9628
  return (React__default["default"].createElement("div", { className: styles['magneto-ui-section-menu'] },
9616
9629
  sortMenu,
9617
- React__default["default"].createElement("button", { className: "".concat(styles['magneto-ui-btn-order'], " ").concat(styles.hidden), title: titleBtnOrder, onClick: orderFilter },
9618
- React__default["default"].createElement(IconItem, __assign({}, iconFilterOrder)))));
9619
- }, [emptyVacant, orderFilter, sortMenu, titleBtnOrder]);
9630
+ React__default["default"].createElement("button", { className: "".concat(styles['magneto-ui-btn-order'], " ").concat(styles.hidden), title: titleBtnOrder, onClick: handleOrder },
9631
+ React__default["default"].createElement(IconItem, __assign({ isRotate: rotateOrderIcon }, iconFilterOrder)))));
9632
+ }, [emptyVacant, sortMenu, titleBtnOrder, handleOrder, rotateOrderIcon]);
9620
9633
  return (React__default["default"].createElement(React.Fragment, null,
9621
9634
  React__default["default"].createElement("div", { className: styles['magneto-ui-sort-menu'] },
9622
9635
  React__default["default"].createElement("div", { className: styles['magneto-ui-section-filter'] },