@epam/uui 6.4.2 → 6.4.4

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 (43) hide show
  1. package/assets/styles/clickable.scss +26 -26
  2. package/assets/styles/dnd.scss +9 -9
  3. package/assets/styles/effects.scss +6 -6
  4. package/assets/styles/helpers.scss +12 -0
  5. package/assets/styles/index.scss +6 -6
  6. package/assets/styles/typography.scss +184 -184
  7. package/components/buttons/VerticalTabButton.d.ts.map +1 -1
  8. package/components/datePickers/DatePicker.d.ts.map +1 -1
  9. package/components/datePickers/RangeDatePickerInput.d.ts.map +1 -1
  10. package/components/filters/FilterNumericBody.d.ts +3 -3
  11. package/components/filters/FilterNumericBody.d.ts.map +1 -1
  12. package/components/filters/helpers/predicateHelpers.d.ts +11 -0
  13. package/components/filters/helpers/predicateHelpers.d.ts.map +1 -1
  14. package/components/inputs/timePicker/TimePicker.d.ts.map +1 -1
  15. package/components/inputs/timePicker/TimePickerBody.d.ts.map +1 -1
  16. package/components/layout/Blocker.d.ts +2 -1
  17. package/components/layout/Blocker.d.ts.map +1 -1
  18. package/components/layout/ScrollBars.d.ts +11 -1
  19. package/components/layout/ScrollBars.d.ts.map +1 -1
  20. package/components/layout/VirtualList.d.ts +1 -1
  21. package/components/layout/VirtualList.d.ts.map +1 -1
  22. package/components/overlays/DropdownMenu.d.ts +2 -2
  23. package/components/overlays/DropdownMenu.d.ts.map +1 -1
  24. package/components/pickers/DataPickerBody.d.ts.map +1 -1
  25. package/components/tables/ColumnHeaderDropdown/SortingPanel.d.ts.map +1 -1
  26. package/components/tables/DataTable.d.ts +3 -2
  27. package/components/tables/DataTable.d.ts.map +1 -1
  28. package/components/tables/DataTableHeaderCell.d.ts +2 -21
  29. package/components/tables/DataTableHeaderCell.d.ts.map +1 -1
  30. package/components/tables/columnsConfigurationModal/ColumnsConfigurationModal.d.ts +1 -1
  31. package/components/tables/columnsConfigurationModal/ColumnsConfigurationModal.d.ts.map +1 -1
  32. package/components/widgets/DataRowAddons.d.ts.map +1 -1
  33. package/i18n.d.ts +1 -0
  34. package/i18n.d.ts.map +1 -1
  35. package/index.esm.js +322 -242
  36. package/index.esm.js.map +1 -1
  37. package/index.js +320 -240
  38. package/index.js.map +1 -1
  39. package/package.json +5 -5
  40. package/readme.md +9 -9
  41. package/stats.html +1 -1
  42. package/styles.css +1043 -1024
  43. package/styles.css.map +1 -1
package/index.js CHANGED
@@ -190,7 +190,7 @@ var SvgEmptyTable = function SvgEmptyTable(props, ref) {
190
190
  xmlns: "http://www.w3.org/2000/svg",
191
191
  ref: ref
192
192
  }, props), /*#__PURE__*/React__namespace.createElement("g", {
193
- clipPath: "url(#5ijuogspqkuhn1rg_a)"
193
+ clipPath: "url(#g3sdanswhqkvot7f_a)"
194
194
  }, _path$I || (_path$I = /*#__PURE__*/React__namespace.createElement("path", {
195
195
  d: "M150.585 1.535C49.483-11.495 27.481 61.805 45.725 97.481c10.581 20.69-39.64 70.792 17.744 81.468 27.538 5.123 36-13.341 62.433-10.655 35.4 3.6 148.167-4.73 88.349-78.915-31.713-39.335 1.026-79.506-63.666-87.844Z",
196
196
  fill: "#F5F6FA"
@@ -211,7 +211,7 @@ var SvgEmptyTable = function SvgEmptyTable(props, ref) {
211
211
  d: "M86.786 22.982c-2.55 0-4.965 2.07-4.965 4.552V120.6c0 2.484 2.4 4.572 4.965 4.572h88.101c2.582 0 4.986-2.089 4.986-4.572V27.534c0-2.464-2.418-4.552-4.986-4.552h-88.1Zm-5.793 4.552c0-3.022 2.874-5.38 5.793-5.38h88.101c2.935 0 5.814 2.374 5.814 5.38V120.6c0 3.021-2.86 5.4-5.814 5.4h-88.1c-2.94 0-5.794-2.381-5.794-5.4V27.534Z",
212
212
  fill: "#1D1E26"
213
213
  })), /*#__PURE__*/React__namespace.createElement("mask", {
214
- id: "5ijuogtu6oq6pwj4_b",
214
+ id: "g3sdancilj2tzyi46_b",
215
215
  style: {
216
216
  maskType: "alpha"
217
217
  },
@@ -224,7 +224,7 @@ var SvgEmptyTable = function SvgEmptyTable(props, ref) {
224
224
  d: "M174.887 125.586h-88.1c-2.752 0-5.38-2.234-5.38-4.986V27.534c0-2.752 2.644-4.966 5.38-4.966h88.1c2.752 0 5.4 2.23 5.4 4.966V120.6c0 2.752-2.632 4.986-5.4 4.986Z",
225
225
  fill: "#9BDEFF"
226
226
  }))), _g || (_g = /*#__PURE__*/React__namespace.createElement("g", {
227
- mask: "url(#5ijuogtu6oq6pwj4_b)",
227
+ mask: "url(#g3sdancilj2tzyi46_b)",
228
228
  fillRule: "evenodd",
229
229
  clipRule: "evenodd"
230
230
  }, /*#__PURE__*/React__namespace.createElement("path", {
@@ -310,7 +310,7 @@ var SvgEmptyTable = function SvgEmptyTable(props, ref) {
310
310
  d: "M24.73 96.184a.414.414 0 0 1 .581.06l48.646 59.751a.413.413 0 1 1-.642.523L24.67 96.766a.414.414 0 0 1 .06-.582Z",
311
311
  fill: "#fff"
312
312
  }))), _defs || (_defs = /*#__PURE__*/React__namespace.createElement("defs", null, /*#__PURE__*/React__namespace.createElement("clipPath", {
313
- id: "5ijuogspqkuhn1rg_a"
313
+ id: "g3sdanswhqkvot7f_a"
314
314
  }, /*#__PURE__*/React__namespace.createElement("path", {
315
315
  fill: "#fff",
316
316
  transform: "translate(.552)",
@@ -961,14 +961,14 @@ var SvgSearchWithBackground = function SvgSearchWithBackground(props, ref) {
961
961
  };
962
962
  var ForwardRef$4 = /*#__PURE__*/React.forwardRef(SvgSearchWithBackground);
963
963
 
964
- var css$1w = {"root":"_9QN1yi","uui-spinner":"_2TpjB9","uuiSpinner":"_2TpjB9"};
964
+ var css$1w = {"root":"UE27xC","uui-spinner":"JZ8Uv5","uuiSpinner":"JZ8Uv5"};
965
965
 
966
966
  function applySpinnerMods() {
967
967
  return [css$1w.root, 'uui-spinner'];
968
968
  }
969
969
  const Spinner = /* @__PURE__ */uuiCore.withMods(uuiComponents.Spinner, applySpinnerMods);
970
970
 
971
- var css$1v = {"root":"DLs1Il","loading-word":"IbALyA","loadingWord":"IbALyA","animated-loading":"_6WhCoy","animatedLoading":"_6WhCoy","skeleton_loading":"yp4oCW","skeletonLoading":"yp4oCW"};
971
+ var css$1v = {"root":"vlgrhq","loading-word":"RxXHQu","loadingWord":"RxXHQu","animated-loading":"vIsykU","animatedLoading":"vIsykU","skeleton_loading":"MTpfbj","skeletonLoading":"MTpfbj"};
972
972
 
973
973
  const TextPlaceholder = (props) => {
974
974
  const pattern = ' ';
@@ -985,7 +985,7 @@ const TextPlaceholder = (props) => {
985
985
  ]), dangerouslySetInnerHTML: { __html: it } })))));
986
986
  };
987
987
 
988
- var css$1u = {"root":"ADkaQX","line-height":"QtSITm","lineHeight":"QtSITm","font-size":"fcVzfk","fontSize":"fcVzfk"};
988
+ var css$1u = {"root":"GDTy8P","line-height":"uxBDY-","lineHeight":"uxBDY-","font-size":"Jfl4Kx","fontSize":"Jfl4Kx"};
989
989
 
990
990
  function applyTextMods(mods) {
991
991
  return [
@@ -1012,7 +1012,7 @@ const Text = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.Text, appl
1012
1012
  };
1013
1013
  });
1014
1014
 
1015
- var css$1t = {"root":"pqcU0t"};
1015
+ var css$1t = {"root":"tP39oV"};
1016
1016
 
1017
1017
  const Blocker = /* @__PURE__ */uuiCore.withMods(uuiComponents.Blocker, () => [css$1t.root], () => ({ renderSpinner: settings.blocker.renderSpinner }));
1018
1018
 
@@ -1517,7 +1517,7 @@ const settings = {
1517
1517
  textInput: textInputSettings,
1518
1518
  };
1519
1519
 
1520
- var css$1s = {"root":"krR-kO"};
1520
+ var css$1s = {"root":"UngvQG"};
1521
1521
 
1522
1522
  function applyButtonMods(mods) {
1523
1523
  return [
@@ -1535,7 +1535,7 @@ const Button = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.Button,
1535
1535
  };
1536
1536
  });
1537
1537
 
1538
- var css$1r = {"root":"_6yrG-R"};
1538
+ var css$1r = {"root":"WpOWm9"};
1539
1539
 
1540
1540
  function applyIconButtonMods(props) {
1541
1541
  return ['uui-icon_button', `uui-color-${props.color || 'neutral'}`, css$1r.root];
@@ -1572,7 +1572,7 @@ function getIconClass(props) {
1572
1572
  return [classList['has-left-icon'] ? 'uui-has-left-icon' : 'uui-no-left-icon', classList['has-right-icon'] ? 'uui-has-right-icon' : 'uui-no-right-icon'];
1573
1573
  }
1574
1574
 
1575
- var css$1q = {"root":"vUSh6-"};
1575
+ var css$1q = {"root":"-wCqo3"};
1576
1576
 
1577
1577
  const DEFAULT_COLOR = 'primary';
1578
1578
  const LinkButton = /* @__PURE__ */React__namespace.forwardRef((props, ref) => {
@@ -1602,7 +1602,7 @@ const LinkButton = /* @__PURE__ */React__namespace.forwardRef((props, ref) => {
1602
1602
  props.isDropdown && (React__namespace.createElement(uuiComponents.IconContainer, { icon: DropdownIcon, flipY: props.isOpen }))));
1603
1603
  });
1604
1604
 
1605
- var css$1p = {"root":"_48OcY9"};
1605
+ var css$1p = {"root":"Nn9bGc"};
1606
1606
 
1607
1607
  const CountIndicator = /* @__PURE__ */React.forwardRef((props, ref) => {
1608
1608
  return (React__namespace.default.createElement("div", { ref: ref, className: cx__default.default([
@@ -1614,7 +1614,7 @@ const CountIndicator = /* @__PURE__ */React.forwardRef((props, ref) => {
1614
1614
  ]) }, props.caption));
1615
1615
  });
1616
1616
 
1617
- var css$1o = {"root":"_3PsUxa","withNotify":"_9B2HrO"};
1617
+ var css$1o = {"root":"HB7Csf","withNotify":"_73xN8N"};
1618
1618
 
1619
1619
  const TabButton = /* @__PURE__ */React__namespace.default.forwardRef((props, refExternal) => {
1620
1620
  const refLocal = React__namespace.default.useRef(null);
@@ -1661,13 +1661,13 @@ const TabButton = /* @__PURE__ */React__namespace.default.forwardRef((props, ref
1661
1661
  props.onClear && !props.isDisabled && (React__namespace.default.createElement(uuiComponents.IconContainer, { cx: uuiCore.uuiMarkers.clickable, icon: ClearIcon, onClick: props.onClear }))));
1662
1662
  });
1663
1663
 
1664
- var css$1n = {"root":"peObWc","noLeftPadding":"M9oM9m","foldingArea":"O3E-QD","onlyFoldable":"GKSVwK","captionWrapper":"PXXAOU","withNotify":"yiUC4M"};
1664
+ var css$1n = {"root":"DjEb16","noLeftPadding":"vFYbua","foldingArea":"d2FFaF","onlyFoldable":"F6gy36","captionWrapper":"_92Ln4t","withNotify":"tqso6T"};
1665
1665
 
1666
- var css$1m = {"root":"_0F5xqb"};
1666
+ var css$1m = {"root":"e0-jaV"};
1667
1667
 
1668
1668
  const AvatarStack = /* @__PURE__ */uuiCore.withMods(uuiComponents.AvatarStack, () => [css$1m.root]);
1669
1669
 
1670
- var css$1l = {"root":"nh4MZv"};
1670
+ var css$1l = {"root":"MoXaMB"};
1671
1671
 
1672
1672
  const DEFAULT_FILL = 'solid';
1673
1673
  function applyBadgeMods(mods) {
@@ -1695,7 +1695,7 @@ const Badge = /* @__PURE__ */React__namespace.default.forwardRef((props, ref) =>
1695
1695
  props.isDropdown && (React__namespace.default.createElement(uuiComponents.IconContainer, { icon: DropdownIcon, flipY: props.isOpen }))));
1696
1696
  });
1697
1697
 
1698
- var css$1k = {"root":"kXKR1s"};
1698
+ var css$1k = {"root":"EluYH6"};
1699
1699
 
1700
1700
  function applyTagMods(props) {
1701
1701
  return [
@@ -1728,7 +1728,7 @@ const Tag = /* @__PURE__ */React__namespace.default.forwardRef((props, ref) => {
1728
1728
  } }))));
1729
1729
  });
1730
1730
 
1731
- var css$1j = {"root":"JNufGU","page":"mZ5zUd","spacer":"XjssZB","mode-ghost":"MjgFZy","modeGhost":"MjgFZy"};
1731
+ var css$1j = {"root":"dGyt7a","page":"Ir6nO6","spacer":"I3NMdL","mode-ghost":"_4xtqr6","modeGhost":"_4xtqr6"};
1732
1732
 
1733
1733
  function Paginator(props) {
1734
1734
  const renderPaginator = (params) => (React__namespace.default.createElement("nav", { role: "navigation", className: cx__default.default('uui-paginator', `uui-size-${props.size || settings.paginator.sizes.default}`), ...params.rawProps },
@@ -1754,14 +1754,14 @@ function Paginator(props) {
1754
1754
  return React__namespace.default.createElement(uuiComponents.Paginator, { ...props, render: renderPaginator });
1755
1755
  }
1756
1756
 
1757
- var css$1i = {"root":"quYrc5","progress-bar":"_1IjHFJ","progressBar":"_1IjHFJ","progressBar-indeterminate":"x38wjI","progressBarIndeterminate":"x38wjI","size-12":"zCDLL5","size12":"zCDLL5","size-18":"_4B7SXr","size18":"_4B7SXr","size-24":"x1p-IV","size24":"x1p-IV"};
1757
+ var css$1i = {"root":"C4JxUr","progress-bar":"nJiiRt","progressBar":"nJiiRt","progressBar-indeterminate":"Un-0I3","progressBarIndeterminate":"Un-0I3","size-12":"J-wweH","size12":"J-wweH","size-18":"YaxwGL","size18":"YaxwGL","size-24":"gljeGl","size24":"gljeGl"};
1758
1758
 
1759
1759
  const IndeterminateBar = /* @__PURE__ */React__namespace.forwardRef((props, ref) => {
1760
1760
  return (React__namespace.createElement("div", { ref: ref, className: cx__default.default('uui-indeterminate_bar', props.cx, css$1i.root, css$1i[`size-${props.size || 12}`]) },
1761
1761
  React__namespace.createElement("div", { className: cx__default.default(css$1i.progressBar) })));
1762
1762
  });
1763
1763
 
1764
- var css$1h = {"root":"vwMiei","striped":"BxBzcl","animate-stripes":"rXqbPX","animateStripes":"rXqbPX","size-12":"omUXKt","size12":"omUXKt","size-18":"oUm4No","size18":"oUm4No","size-24":"QZW1ld","size24":"QZW1ld"};
1764
+ var css$1h = {"root":"ClOpVp","striped":"_8YBwrZ","animate-stripes":"-jpz57","animateStripes":"-jpz57","size-12":"tNDqAh","size12":"tNDqAh","size-18":"EolQHk","size18":"EolQHk","size-24":"JYY2Ik","size24":"JYY2Ik"};
1765
1765
 
1766
1766
  const DEFAULT_SIZE = '12';
1767
1767
  function applyProgressBarMods(mods) {
@@ -1776,14 +1776,14 @@ const ProgressBar = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.Pro
1776
1776
  hideLabel: props.hideLabel || props.striped,
1777
1777
  }));
1778
1778
 
1779
- var css$1g = {"root":"kyVEb9"};
1779
+ var css$1g = {"root":"_0mbooH"};
1780
1780
 
1781
1781
  const IndicatorBar = /* @__PURE__ */React__namespace.forwardRef((props, ref) => {
1782
1782
  const { progress } = props;
1783
1783
  return progress || progress === 0 ? (React__namespace.createElement(ProgressBar, { ref: ref, progress: progress, cx: cx__default.default(css$1g.root, props.cx), hideLabel: true })) : (React__namespace.createElement(IndeterminateBar, { ref: ref, cx: cx__default.default(css$1g.root, props.cx) }));
1784
1784
  });
1785
1785
 
1786
- var css$1f = {"root":"_1QTGJ9"};
1786
+ var css$1f = {"root":"-Ez8OP"};
1787
1787
 
1788
1788
  const StatusIndicator = /* @__PURE__ */React.forwardRef((props, ref) => {
1789
1789
  return (React__namespace.default.createElement("div", { ref: ref, className: cx__default.default([
@@ -1798,7 +1798,7 @@ const StatusIndicator = /* @__PURE__ */React.forwardRef((props, ref) => {
1798
1798
  React__namespace.default.createElement("p", { className: "uui-status_indicator-caption" }, props.caption)));
1799
1799
  });
1800
1800
 
1801
- var css$1e = {"root":"CvX6eY"};
1801
+ var css$1e = {"root":"ONuItu"};
1802
1802
 
1803
1803
  function applyCheckboxMods(mods) {
1804
1804
  return [
@@ -1816,7 +1816,7 @@ const applyUUICheckboxProps = (props) => {
1816
1816
  };
1817
1817
  const Checkbox = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.Checkbox, applyCheckboxMods, applyUUICheckboxProps);
1818
1818
 
1819
- var css$1d = {"root":"Bw2K4o"};
1819
+ var css$1d = {"root":"JmMFgU"};
1820
1820
 
1821
1821
  function applyRadioInputMods(mods) {
1822
1822
  return [
@@ -1828,7 +1828,7 @@ function applyRadioInputMods(mods) {
1828
1828
  }
1829
1829
  const RadioInput = /* @__PURE__ */uuiCore.withMods(uuiComponents.RadioInput, applyRadioInputMods, (props) => ({ icon: props.icon ? props.icon : settings.radioInput.icons.dotIcon }));
1830
1830
 
1831
- var css$1c = {"root":"_5-bml2"};
1831
+ var css$1c = {"root":"XQzutj"};
1832
1832
 
1833
1833
  function applySwitchMods(mods) {
1834
1834
  return [
@@ -1852,7 +1852,7 @@ var EditMode;
1852
1852
  EditMode["INLINE"] = "inline";
1853
1853
  })(EditMode || (EditMode = {}));
1854
1854
 
1855
- var textInputCss = {"root":"Ach0D5"};
1855
+ var textInputCss = {"root":"hMCzBl"};
1856
1856
 
1857
1857
  const DEFAULT_MODE$3 = EditMode.FORM;
1858
1858
  function applyTextInputMods(mods) {
@@ -1877,7 +1877,7 @@ const SearchInput = /* @__PURE__ */React__namespace.default.forwardRef((props, r
1877
1877
  } }));
1878
1878
  });
1879
1879
 
1880
- var css$1b = {"root":"qfc1b8"};
1880
+ var css$1b = {"root":"BPv3vl"};
1881
1881
 
1882
1882
  const ControlGroup = /* @__PURE__ */uuiCore.withMods(uuiComponents.ControlGroup, () => [css$1b.root, 'uui-control-group']);
1883
1883
 
@@ -1893,7 +1893,7 @@ function MultiSwitchComponent(props, ref) {
1893
1893
  }
1894
1894
  const MultiSwitch = /* @__PURE__ */React__namespace.forwardRef(MultiSwitchComponent);
1895
1895
 
1896
- var css$1a = {"root":"Bh6hQu"};
1896
+ var css$1a = {"root":"MPAM05"};
1897
1897
 
1898
1898
  const DEFAULT_MODE$2 = EditMode.FORM;
1899
1899
  function applyNumericInputMods(mods) {
@@ -1913,7 +1913,7 @@ const NumericInput = /* @__PURE__ */uuiCore.withMods(uuiComponents.NumericInput,
1913
1913
  };
1914
1914
  });
1915
1915
 
1916
- var css$19 = {"root":"GRmenM"};
1916
+ var css$19 = {"root":"NvBVoj"};
1917
1917
 
1918
1918
  const DEFAULT_MODE$1 = EditMode.FORM;
1919
1919
  function applyTextAreaMods(mods) {
@@ -1954,7 +1954,7 @@ function TREE_SHAKEABLE_INIT$1() {
1954
1954
  };
1955
1955
  }
1956
1956
 
1957
- var css$18 = {"root":"_89PZB-"};
1957
+ var css$18 = {"root":"wZvAB2"};
1958
1958
 
1959
1959
  function applyDropdownContainerMods(mods) {
1960
1960
  return [
@@ -1965,7 +1965,7 @@ function applyDropdownContainerMods(mods) {
1965
1965
  }
1966
1966
  const DropdownContainer = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.DropdownContainer, applyDropdownContainerMods);
1967
1967
 
1968
- var css$17 = {"root":"NkryVu","timepicker-input":"m7KbGC","timepickerInput":"m7KbGC","ltr-always":"Q6F-0V","ltrAlways":"Q6F-0V"};
1968
+ var css$17 = {"root":"uQskY7","timepicker-input":"pyHstO","timepickerInput":"pyHstO","ltr-always":"wGaM07","ltrAlways":"wGaM07"};
1969
1969
 
1970
1970
  const uuiTimePicker = {
1971
1971
  container: 'uui-timepicker-container',
@@ -2010,11 +2010,11 @@ function TimePickerBody(props) {
2010
2010
  React__namespace.createElement(uuiComponents.IconContainer, { size: 18, rawProps: { 'aria-label': 'Increment hours' }, cx: uuiTimePicker.iconUp, icon: ForwardRef$P, onClick: () => onHoursChange(uuiDayjs.dayjs().set(props.value).add(1, 'h').hour()) }),
2011
2011
  React__namespace.createElement(uuiComponents.NumericInput, { cx: uuiTimePicker.input, onValueChange: onHoursChange, value: +(uuiDayjs.dayjs()
2012
2012
  .set(props.value)
2013
- .format(MAX_HOURS === FORMAT_12H ? 'hh' : 'HH')), isReadonly: true, min: MIN_HOURS, max: MAX_HOURS }),
2013
+ .format(MAX_HOURS === FORMAT_12H ? 'hh' : 'HH')), formatValue: (v) => String(v).padStart(2, '0'), isReadonly: true, min: MIN_HOURS, max: MAX_HOURS }),
2014
2014
  React__namespace.createElement(uuiComponents.IconContainer, { size: 18, rawProps: { 'aria-label': 'Decrement hours' }, cx: uuiTimePicker.iconDown, icon: ForwardRef$P, onClick: () => onHoursChange(uuiDayjs.dayjs().set(props.value).subtract(1, 'h').hour()) })),
2015
2015
  React__namespace.createElement("div", { className: uuiTimePicker.elementContainer },
2016
2016
  React__namespace.createElement(uuiComponents.IconContainer, { size: 18, rawProps: { 'aria-label': 'Increment minutes' }, cx: uuiTimePicker.iconUp, icon: ForwardRef$P, onClick: handleMinutesUpClick }),
2017
- React__namespace.createElement(uuiComponents.NumericInput, { cx: uuiTimePicker.input, onValueChange: onMinutesChange, value: +uuiDayjs.dayjs().set(props.value).format('m'), isReadonly: true, min: MIN_MINUTES, max: MAX_MINUTES }),
2017
+ React__namespace.createElement(uuiComponents.NumericInput, { cx: uuiTimePicker.input, onValueChange: onMinutesChange, value: +uuiDayjs.dayjs().set(props.value).format('m'), formatValue: (v) => String(v).padStart(2, '0'), isReadonly: true, min: MIN_MINUTES, max: MAX_MINUTES }),
2018
2018
  React__namespace.createElement(uuiComponents.IconContainer, { size: 18, rawProps: { 'aria-label': 'Decrement minutes' }, cx: uuiTimePicker.iconDown, icon: ForwardRef$P, onClick: handleMinutesDownClick }))),
2019
2019
  MAX_HOURS === FORMAT_12H && (React__namespace.createElement("div", { className: uuiTimePicker.elementContainer },
2020
2020
  React__namespace.createElement(uuiComponents.IconContainer, { size: 18, cx: uuiTimePicker.iconUp, icon: ForwardRef$P, onClick: onTimeTypeChange }),
@@ -2138,11 +2138,15 @@ function TimePickerComponent(props, ref) {
2138
2138
  if (isTimeValid(result)) {
2139
2139
  setState((prevState) => ({ ...prevState, value: result }));
2140
2140
  }
2141
+ // save time immediately if the input value is valid
2142
+ if (isTimeValid(newValue)) {
2143
+ saveTime(newValue);
2144
+ }
2141
2145
  }
2142
2146
  };
2143
2147
  const handleBlur = (e) => {
2144
2148
  props.onBlur?.(e);
2145
- if (state.value === '' || state.inputValue === '') {
2149
+ if (state.value === '' || state.inputValue === '' || state.value === null) {
2146
2150
  props.onValueChange(null);
2147
2151
  setState((prevState) => ({ ...prevState, value: null, inputValue: null }));
2148
2152
  }
@@ -2162,6 +2166,8 @@ function TimePickerComponent(props, ref) {
2162
2166
  };
2163
2167
  const renderInput = (inputProps) => {
2164
2168
  return (React__namespace.default.createElement(TextInput, { ...inputProps, size: props.size, isDisabled: props.isDisabled, isReadonly: props.isReadonly, isInvalid: props.isInvalid, cx: [css$17.root, css$17.timepickerInput, props.inputCx], value: state.inputValue, onValueChange: handleInputChange, onCancel: !props.disableClear && onClear, onKeyDown: onKeyDown, onFocus: handleFocus, onBlur: handleBlur, isDropdown: false, placeholder: props.placeholder ? props.placeholder : getFormat(), mode: props.mode || DEFAULT_MODE, rawProps: props.rawProps?.input, ref: (node) => {
2169
+ if (!node)
2170
+ return;
2165
2171
  targetRef.current = node;
2166
2172
  if (typeof inputProps.ref === 'function') {
2167
2173
  inputProps.ref(node);
@@ -2180,7 +2186,7 @@ function TimePickerComponent(props, ref) {
2180
2186
  }
2181
2187
  const TimePicker = /* @__PURE__ */React__namespace.default.forwardRef(TimePickerComponent);
2182
2188
 
2183
- var css$16 = {"root":"Wc-ttN"};
2189
+ var css$16 = {"root":"mSYQeQ"};
2184
2190
 
2185
2191
  function applyInputAddonMods() {
2186
2192
  return [
@@ -2189,14 +2195,14 @@ function applyInputAddonMods() {
2189
2195
  }
2190
2196
  const InputAddon = /* @__PURE__ */uuiCore.withMods(uuiComponents.InputAddon, applyInputAddonMods);
2191
2197
 
2192
- var css$15 = {"root":"_2th2mG"};
2198
+ var css$15 = {"root":"_0T9jml"};
2193
2199
 
2194
2200
  function applySliderMods() {
2195
2201
  return [css$15.root, 'uui-color-neutral'];
2196
2202
  }
2197
2203
  const Slider = /* @__PURE__ */uuiCore.withMods(uuiComponents.Slider, applySliderMods);
2198
2204
 
2199
- var css$14 = {"root":"_2woU-o"};
2205
+ var css$14 = {"root":"OySA86"};
2200
2206
 
2201
2207
  function applyTooltipMods(mods) {
2202
2208
  return [
@@ -2206,7 +2212,7 @@ function applyTooltipMods(mods) {
2206
2212
  }
2207
2213
  const Tooltip = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.Tooltip, applyTooltipMods);
2208
2214
 
2209
- var css$13 = {"root":"PdX32A","tooltip":"YFejA1"};
2215
+ var css$13 = {"root":"OqYx-a","tooltip":"-VZob5"};
2210
2216
 
2211
2217
  function applyRatingMods(mods) {
2212
2218
  return [
@@ -2220,10 +2226,13 @@ const Rating = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.Rating,
2220
2226
  Tooltip,
2221
2227
  }));
2222
2228
 
2223
- var css$12 = {"drag-handle-wrapper":"PyemR7","dragHandleWrapper":"PyemR7","with-indent":"LxfPDK","withIndent":"LxfPDK","drag-handle":"nJn50K","dragHandle":"nJn50K","icon-container":"QsPd8n","iconContainer":"QsPd8n"};
2229
+ var css$12 = {"drag-handle-wrapper":"RZxDvE","dragHandleWrapper":"RZxDvE","with-indent":"_6omlAl","withIndent":"_6omlAl","drag-handle":"qN7vvv","dragHandle":"qN7vvv","icon-container":"Y7UjiS","iconContainer":"Y7UjiS"};
2224
2230
 
2225
2231
  function DataRowAddons(props) {
2226
2232
  const row = props.rowProps;
2233
+ const checkboxSize = settings.dataTable.sizes.body.checkboxMap[props.size];
2234
+ const isCheckboxVisible = row?.checkbox?.isVisible;
2235
+ const reserveCheckboxSpace = row?.checkbox?.reserveSpace;
2227
2236
  const getIndent = () => {
2228
2237
  return (row.indent - 1) * settings.dataTable.sizes.body.indentUnitMap[props.size || settings.dataTable.sizes.body.row];
2229
2238
  };
@@ -2244,7 +2253,8 @@ function DataRowAddons(props) {
2244
2253
  };
2245
2254
  return (React__namespace.default.createElement(React__namespace.default.Fragment, null,
2246
2255
  row.dnd?.srcData && renderDragHandle(),
2247
- row?.checkbox?.isVisible && (React__namespace.default.createElement(Checkbox, { key: "cb", cx: "uui-dr_addons-checkbox", tabIndex: props.tabIndex, size: settings.dataTable.sizes.body.checkboxMap[props.size], value: row.isChecked, indeterminate: !row.isChecked && row.isChildrenChecked, onValueChange: () => row.onCheck?.(row), isDisabled: row.checkbox.isDisabled, isInvalid: row.checkbox.isInvalid })),
2256
+ isCheckboxVisible && (React__namespace.default.createElement(Checkbox, { key: "cb", cx: "uui-dr_addons-checkbox", tabIndex: props.tabIndex, size: checkboxSize, value: row.isChecked, indeterminate: !row.isChecked && row.isChildrenChecked, onValueChange: () => row.onCheck?.(row), isDisabled: row.checkbox.isDisabled, isInvalid: row.checkbox.isInvalid, rawProps: { 'aria-label': 'Select' } })),
2257
+ !isCheckboxVisible && reserveCheckboxSpace && (React__namespace.default.createElement("div", { key: "cb-spacer", className: cx__default.default('uui-checkbox-container', 'uui-dr_addons-checkbox-spacer', `uui-size-${checkboxSize}`), "aria-hidden": "true" })),
2248
2258
  row.indent > 0 && (React__namespace.default.createElement("div", { key: "fold", className: cx__default.default('uui-dr_addons-indent', `uui-size-${props.size || settings.dataTable.sizes.body.row}`), style: { marginInlineStart: getIndent(), width: getWidth() } }, row.isFoldable && (React__namespace.default.createElement(uuiComponents.ControlIcon, { rawProps: {
2249
2259
  'aria-label': row.isFolded ? 'Unfold' : 'Fold',
2250
2260
  role: 'button',
@@ -2282,6 +2292,7 @@ function VerticalTabButtonComponent(props, ref) {
2282
2292
  const ClearIcon = props.clearIcon ? props.clearIcon : settings.verticalTabButton.icons.clearIcon;
2283
2293
  return (React__namespace.default.createElement(uuiComponents.Clickable, { ...props, onClick: props.onClick || props.onFold, rawProps: {
2284
2294
  role: 'tab',
2295
+ 'aria-selected': isActive,
2285
2296
  ...props.rawProps,
2286
2297
  }, cx: styles, ref: ref },
2287
2298
  props.indent > 0 && (React__namespace.default.createElement("div", { key: "fold", className: uuiCore.cx(css$1n.foldingArea, props.onFold && uuiCore.uuiMarkers.clickable), style: { '--uui-folding-indent': `${props.indent - 1}` }, onClick: props.onFold }, props.isFoldable && (React__namespace.default.createElement(uuiComponents.IconContainer, { rawProps: {
@@ -2302,7 +2313,7 @@ function VerticalTabButtonComponent(props, ref) {
2302
2313
  }
2303
2314
  const VerticalTabButton = /* @__PURE__ */React__namespace.default.forwardRef(VerticalTabButtonComponent);
2304
2315
 
2305
- var css$11 = {"root":"vDGcoJ","main-path":"u5IAID","mainPath":"u5IAID","content-wrapper":"ZrnhH5","contentWrapper":"ZrnhH5","content":"TsKAY8","action-wrapper":"_3T4NBj","actionWrapper":"_3T4NBj","icon-wrapper":"OqmFMf","iconWrapper":"OqmFMf","icon":"maEFhr","close-icon":"pBvrmI","closeIcon":"pBvrmI"};
2316
+ var css$11 = {"root":"suPfV7","main-path":"GqksXy","mainPath":"GqksXy","content-wrapper":"-N7JSJ","contentWrapper":"-N7JSJ","content":"sn-tUw","action-wrapper":"pAzBw1","actionWrapper":"pAzBw1","icon-wrapper":"JdDOMV","iconWrapper":"JdDOMV","icon":"Bp4zdQ","close-icon":"sSZgE3","closeIcon":"sSZgE3"};
2306
2317
 
2307
2318
  const Alert = /* @__PURE__ */React__namespace.forwardRef((props, ref) => (React__namespace.createElement("div", { role: "alert", ref: ref, className: cx__default.default('uui-alert', css$11.root, props.color && `uui-color-${props.color}`, props.cx, `uui-size-${props.size || settings.alert.sizes.default}`), ...props.rawProps },
2308
2319
  React__namespace.createElement("div", { className: css$11.mainPath },
@@ -2320,7 +2331,7 @@ const ErrorAlert = /* @__PURE__ */React__namespace.forwardRef((props, ref) => Re
2320
2331
 
2321
2332
  const Dropdown = /* @__PURE__ */uuiCore.withMods(uuiComponents.Dropdown);
2322
2333
 
2323
- var css$10 = {"submenu-root-item-rtl":"GdZ1Yl","submenuRootItemRtl":"GdZ1Yl","icon-after":"z-UhE0","iconAfter":"z-UhE0","submenu-root-item":"_4moyb-","submenuRootItem":"_4moyb-","icon-check":"xcPEVJ","iconCheck":"xcPEVJ","splitter-root":"bYmh0w","splitterRoot":"bYmh0w","splitter":"cTqUUx","header-root":"vBx3qt","headerRoot":"vBx3qt","item-root":"xEPcY7","itemRoot":"xEPcY7","icon":"UD6uJy","link":"zoDMK2","indent":"_9jYkfR","selected-mark":"iF9nNV","selectedMark":"iF9nNV"};
2334
+ var css$10 = {"submenu-root-item-rtl":"_8sezyH","submenuRootItemRtl":"_8sezyH","icon-after":"_2tkap9","iconAfter":"_2tkap9","submenu-root-item":"_7b-9d4","submenuRootItem":"_7b-9d4","icon-check":"K4cfYl","iconCheck":"K4cfYl","splitter-root":"gUr7g6","splitterRoot":"gUr7g6","splitter":"A6ftY9","header-root":"_85nMHp","headerRoot":"_85nMHp","item-root":"m-YPSQ","itemRoot":"m-YPSQ","icon":"_0nKtmu","link":"nvd2aA","indent":"yJQ5rE","selected-mark":"T6eITy","selectedMark":"T6eITy"};
2324
2335
 
2325
2336
  exports.IDropdownControlKeys = void 0;
2326
2337
  (function (IDropdownControlKeys) {
@@ -2337,7 +2348,7 @@ function DropdownMenuContainer(props) {
2337
2348
  const getMenuItems = () => {
2338
2349
  if (!menuRef.current)
2339
2350
  return [];
2340
- return Array.from(menuRef.current.querySelectorAll(`[role="menuitem"]:not(.${uuiCore.uuiMod.disabled})`));
2351
+ return Array.from(menuRef.current.querySelectorAll(`[role^="menuitem"]:not(.${uuiCore.uuiMod.disabled})`));
2341
2352
  };
2342
2353
  const changeFocus = (nextFocusedIndex) => {
2343
2354
  const menuItems = getMenuItems();
@@ -2404,7 +2415,7 @@ const DropdownMenuButton = /* @__PURE__ */React__namespace.default.forwardRef((p
2404
2415
  };
2405
2416
  const isAnchor = Boolean(link || href);
2406
2417
  const itemClassNames = uuiCore.cx(props.cx, css$10.itemRoot, isDisabled && uuiCore.uuiMod.disabled, isActive && uuiCore.uuiMod.active, isOpen && uuiCore.uuiMod.opened, (!isDisabled && onClick) && uuiCore.uuiMarkers.clickable);
2407
- return isAnchor ? (React__namespace.default.createElement(uuiComponents.Anchor, { cx: uuiCore.cx(css$10.link, itemClassNames), link: link, href: href, rawProps: { role: 'menuitem', tabIndex: isDisabled ? -1 : 0 }, onClick: handleClick, isDisabled: isDisabled, target: target }, getMenuButtonContent())) : (React__namespace.default.createElement("div", { tabIndex: isDisabled ? -1 : 0, role: "menuitem", onKeyDown: isDisabled ? null : handleOpenDropdown, className: itemClassNames, onClick: handleClick, ref: ref },
2418
+ return isAnchor ? (React__namespace.default.createElement(uuiComponents.Anchor, { cx: uuiCore.cx(css$10.link, itemClassNames), link: link, href: href, rawProps: { role: 'menuitem', tabIndex: isDisabled ? -1 : 0, ...props.rawProps }, onClick: handleClick, isDisabled: isDisabled, target: target }, getMenuButtonContent())) : (React__namespace.default.createElement("div", { tabIndex: isDisabled ? -1 : 0, role: "menuitem", onKeyDown: isDisabled ? null : handleOpenDropdown, className: itemClassNames, onClick: handleClick, ref: ref, ...props.rawProps },
2408
2419
  getMenuButtonContent(),
2409
2420
  isSelected && (React__namespace.default.createElement(React__namespace.default.Fragment, null,
2410
2421
  React__namespace.default.createElement(uuiComponents.FlexSpacer, null),
@@ -2435,6 +2446,7 @@ function DropdownSubMenu(props) {
2435
2446
  }
2436
2447
  function DropdownMenuSwitchButton(props) {
2437
2448
  const context = React.useContext(uuiCore.UuiContext);
2449
+ const switchRef = React.useRef(null);
2438
2450
  const { icon, caption, isDisabled, isSelected, onValueChange, } = props;
2439
2451
  const onHandleValueChange = (value) => {
2440
2452
  if (isDisabled || !onValueChange)
@@ -2447,14 +2459,20 @@ function DropdownMenuSwitchButton(props) {
2447
2459
  onHandleValueChange(!isSelected);
2448
2460
  }
2449
2461
  };
2450
- return (React__namespace.default.createElement("div", { className: uuiCore.cx(props.cx, css$10.itemRoot, isDisabled && uuiCore.uuiMod.disabled, (!isDisabled || onValueChange) && uuiCore.uuiMarkers.clickable), onClick: () => onHandleValueChange(!isSelected), role: "menuitem", onKeyDown: handleKeySelect, tabIndex: isDisabled ? -1 : 0 },
2462
+ const handleClick = (event) => {
2463
+ const isSwitchClicked = switchRef.current?.contains(event.target);
2464
+ if (isSwitchClicked)
2465
+ return;
2466
+ onHandleValueChange(!isSelected);
2467
+ };
2468
+ return (React__namespace.default.createElement("div", { className: uuiCore.cx(props.cx, css$10.itemRoot, isDisabled && uuiCore.uuiMod.disabled, (!isDisabled || onValueChange) && uuiCore.uuiMarkers.clickable), onClick: handleClick, role: "menuitem", onKeyDown: handleKeySelect, tabIndex: isDisabled ? -1 : 0 },
2451
2469
  icon && React__namespace.default.createElement(uuiComponents.IconContainer, { icon: icon, cx: css$10.iconBefore }),
2452
2470
  React__namespace.default.createElement(uuiComponents.Text, null, caption),
2453
2471
  React__namespace.default.createElement(uuiComponents.FlexSpacer, null),
2454
- React__namespace.default.createElement(Switch, { value: isSelected, tabIndex: -1, onValueChange: onHandleValueChange })));
2472
+ React__namespace.default.createElement(Switch, { value: isSelected, tabIndex: -1, onValueChange: onHandleValueChange, ref: switchRef })));
2455
2473
  }
2456
2474
 
2457
- var css$$ = {"root":"cEesEV","mode-block":"VLbDlI","modeBlock":"VLbDlI","mode-inline":"hYgMBY","modeInline":"hYgMBY","padding-0":"DQl1jM","padding0":"DQl1jM","padding-6":"DiKBDb","padding6":"DiKBDb","padding-12":"esdG0F","padding12":"esdG0F","padding-18":"Ic1Rmq","padding18":"Ic1Rmq"};
2475
+ var css$$ = {"root":"PcyFZ3","mode-block":"-hovKu","modeBlock":"-hovKu","mode-inline":"_7uG285","modeInline":"_7uG285","padding-0":"MsI11x","padding0":"MsI11x","padding-6":"xfO-1U","padding6":"xfO-1U","padding-12":"jQJc2I","padding12":"jQJc2I","padding-18":"dEVGd2","padding18":"dEVGd2"};
2458
2476
 
2459
2477
  function applyAccordionMods(mods) {
2460
2478
  return [
@@ -2467,7 +2485,7 @@ const Accordion = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.Accor
2467
2485
  dropdownIcon: mods.dropdownIcon !== null && settings.accordion.icons.dropdownIcon,
2468
2486
  }));
2469
2487
 
2470
- var css$_ = {"root":"ODQHa4","align-items":"surmIX","alignItems":"surmIX","justify-content":"DQ-ne5","justifyContent":"DQ-ne5","border-top":"ZtUM1z","borderTop":"ZtUM1z","border-bottom":"_9pcqCN","borderBottom":"_9pcqCN","top-shadow":"nBkTqc","topShadow":"nBkTqc","padding":"fs4htr","margin":"bZWSj8","vPadding":"tX8H6b","column-gap":"H4uI4w","columnGap":"H4uI4w","row-gap":"rEP9ii","rowGap":"rEP9ii","spacing":"AazSkr"};
2488
+ var css$_ = {"root":"ikdE6t","align-items":"NQh8KE","alignItems":"NQh8KE","justify-content":"_8UUkKu","justifyContent":"_8UUkKu","border-top":"E1eUd7","borderTop":"E1eUd7","border-bottom":"FpoPsZ","borderBottom":"FpoPsZ","top-shadow":"i8Vw0o","topShadow":"i8Vw0o","padding":"cbGu2X","margin":"OqFcqI","vPadding":"lcmsET","column-gap":"_4jB8Qh","columnGap":"_4jB8Qh","row-gap":"CNZhiF","rowGap":"CNZhiF","spacing":"TrD3JA"};
2471
2489
 
2472
2490
  const FlexCell = /* @__PURE__ */uuiCore.withMods(uuiComponents.FlexCell, () => [css$_.flexCell]);
2473
2491
 
@@ -2519,7 +2537,7 @@ const FlexRow = /* @__PURE__ */React.forwardRef((props, ref) => {
2519
2537
  } }, props.children));
2520
2538
  });
2521
2539
 
2522
- var css$Z = {"root":"DZ-DpS","margin-24":"V2DlJV","margin24":"V2DlJV","padding-12":"_9QuAOU","padding12":"_9QuAOU","padding-24":"_8YrjFF","padding24":"_8YrjFF","shadow":"-o08Ej","uui-surface-main":"Twz9Mp","uuiSurfaceMain":"Twz9Mp"};
2540
+ var css$Z = {"root":"mdSWEE","margin-24":"_2nytQ-","margin24":"_2nytQ-","padding-12":"GMGJf2","padding12":"GMGJf2","padding-24":"u-TmU9","padding24":"u-TmU9","shadow":"GJha7t","uui-surface-main":"BHP0Yp","uuiSurfaceMain":"BHP0Yp"};
2523
2541
 
2524
2542
  const Panel = /* @__PURE__ */uuiCore.withMods(uuiComponents.VPanel, (props) => [
2525
2543
  'uui-panel',
@@ -2529,7 +2547,7 @@ const Panel = /* @__PURE__ */uuiCore.withMods(uuiComponents.VPanel, (props) => [
2529
2547
  props.background && css$Z[`uui-${props.background}`],
2530
2548
  ]);
2531
2549
 
2532
- var css$Y = {"root":"u1v2GM"};
2550
+ var css$Y = {"root":"a0b0i-"};
2533
2551
 
2534
2552
  function applyLabeledInputMods(mods) {
2535
2553
  return [
@@ -2551,7 +2569,7 @@ function applyLabeledInputProps(props) {
2551
2569
  }
2552
2570
  const LabeledInput = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.LabeledInput, applyLabeledInputMods, applyLabeledInputProps);
2553
2571
 
2554
- var css$X = {"root":"_3WD8id"};
2572
+ var css$X = {"root":"cKPomo"};
2555
2573
 
2556
2574
  function RadioGroup(props) {
2557
2575
  const direction = props.direction || 'vertical';
@@ -2566,7 +2584,7 @@ function RadioGroup(props) {
2566
2584
  })));
2567
2585
  }
2568
2586
 
2569
- var css$W = {"root":"yZjICs","viewport":"flAqGS"};
2587
+ var css$W = {"root":"Yc1hqI","viewport":"AR-rKK"};
2570
2588
 
2571
2589
  var uuiScrollbars;
2572
2590
  (function (uuiScrollbars) {
@@ -2576,16 +2594,25 @@ var uuiScrollbars;
2576
2594
  uuiScrollbars["uuiLineBottom"] = "uui-line-bottom";
2577
2595
  })(uuiScrollbars || (uuiScrollbars = {}));
2578
2596
  const ScrollBars = /* @__PURE__ */React.forwardRef((props, ref) => {
2579
- const { cx: outerCx, children, overflowTopEffect = 'none', overflowBottomEffect = 'none', onScroll, autoHide = 'never', autoHideDelay, rawProps, ...rest } = props;
2597
+ const { cx: outerCx, children, overflowTopEffect = 'none', overflowBottomEffect = 'none', onScroll, autoHide = 'never', autoHideDelay, elementEvents, rawProps, ...rest } = props;
2580
2598
  const [shadowElements, setShadowElements] = React.useState({
2581
2599
  host: null,
2582
2600
  viewport: null,
2583
2601
  });
2584
2602
  const hostRef = React.useRef(null);
2585
2603
  const viewportRef = React.useRef(null);
2586
- const containerRef = React.useRef(null);
2604
+ const elementEventsEffective = React.useMemo(() => {
2605
+ const result = [['img', 'load']]; // this is default
2606
+ if (elementEvents && elementEvents.length > 0) {
2607
+ result.push(...elementEvents);
2608
+ }
2609
+ return result;
2610
+ }, [elementEvents]);
2587
2611
  const [initialize, osInstance] = overlayscrollbarsReact.useOverlayScrollbars({
2588
2612
  options: {
2613
+ update: {
2614
+ elementEvents: elementEventsEffective,
2615
+ },
2589
2616
  scrollbars: {
2590
2617
  theme: 'uui-scroll-bars',
2591
2618
  autoHide: autoHide,
@@ -2627,7 +2654,7 @@ const ScrollBars = /* @__PURE__ */React.forwardRef((props, ref) => {
2627
2654
  uuiCore.useScrollShadows(shadowElements.host, shadowElements.viewport);
2628
2655
  React.useImperativeHandle(ref, () => {
2629
2656
  return {
2630
- container: containerRef.current,
2657
+ container: hostRef.current,
2631
2658
  view: viewportRef.current,
2632
2659
  };
2633
2660
  }, []);
@@ -2636,7 +2663,7 @@ const ScrollBars = /* @__PURE__ */React.forwardRef((props, ref) => {
2636
2663
  });
2637
2664
  ScrollBars.displayName = 'ScrollBars';
2638
2665
 
2639
- var css$V = {"scroll-container":"sMbo8E","scrollContainer":"sMbo8E","list-container":"m3vbi0","listContainer":"m3vbi0"};
2666
+ var css$V = {"scroll-container":"gugpxO","scrollContainer":"gugpxO","list-container":"DtcsB0","listContainer":"DtcsB0"};
2640
2667
 
2641
2668
  const VirtualList = /* @__PURE__ */React__namespace.default.forwardRef((props, ref) => {
2642
2669
  const { listContainerRef, offsetY, handleScroll, estimatedHeight, scrollContainerRef, } = uuiCore.useVirtualList({
@@ -2645,8 +2672,11 @@ const VirtualList = /* @__PURE__ */React__namespace.default.forwardRef((props, r
2645
2672
  onScroll: props.onScroll,
2646
2673
  rowsCount: props.rowsCount,
2647
2674
  rowsSelector: props.rowsSelector,
2675
+ rowHeight: props.rowHeight,
2676
+ rowGap: props.rowGap,
2648
2677
  });
2649
2678
  React__namespace.default.useImperativeHandle(ref, () => scrollContainerRef.current, [scrollContainerRef.current]);
2679
+ const [blockerInset, setBlockerInset] = React__namespace.default.useState(null);
2650
2680
  const renderRows = () => props.renderRows?.({
2651
2681
  listContainerRef, estimatedHeight, offsetY,
2652
2682
  }) || (React__namespace.default.createElement("div", { className: css$V.listContainer, style: { minHeight: `${estimatedHeight}px` } },
@@ -2656,9 +2686,28 @@ const VirtualList = /* @__PURE__ */React__namespace.default.forwardRef((props, r
2656
2686
  return;
2657
2687
  scrollContainerRef.current = scrollbars.view;
2658
2688
  }, []);
2659
- return (React__namespace.default.createElement(ScrollBars, { cx: uuiCore.cx(css$V.scrollContainer, props.cx), onScroll: handleScroll, ref: scrollBarsRef, rawProps: props.rawProps, overflowTopEffect: props.overflowTopEffect, overflowBottomEffect: props.overflowBottomEffect },
2689
+ const rawProps = React__namespace.default.useMemo(() => ({
2690
+ ...(props.rawProps ?? {}),
2691
+ style: {
2692
+ ...(props.rawProps?.style ?? {}),
2693
+ overflow: props.isLoading ? 'hidden' : props.rawProps?.style?.overflow,
2694
+ },
2695
+ }), [props.rawProps, props.isLoading]);
2696
+ const updateBlockerInset = React__namespace.default.useCallback(() => {
2697
+ const scrollContainer = scrollContainerRef.current;
2698
+ if (!scrollContainer)
2699
+ return;
2700
+ const { scrollTop, scrollLeft } = scrollContainer;
2701
+ setBlockerInset({ top: scrollTop, left: scrollLeft, right: -scrollLeft, bottom: -scrollTop });
2702
+ }, [setBlockerInset]);
2703
+ React__namespace.default.useEffect(() => {
2704
+ if (props.isLoading) {
2705
+ updateBlockerInset();
2706
+ }
2707
+ }, [props.isLoading, updateBlockerInset]);
2708
+ return (React__namespace.default.createElement(ScrollBars, { cx: uuiCore.cx(css$V.scrollContainer, props.cx), onScroll: handleScroll, ref: scrollBarsRef, rawProps: rawProps, overflowTopEffect: props.overflowTopEffect, overflowBottomEffect: props.overflowBottomEffect, autoHide: props.isLoading ? 'scroll' : undefined },
2660
2709
  renderRows(),
2661
- React__namespace.default.createElement(Blocker, { isEnabled: props.isLoading })));
2710
+ React__namespace.default.createElement(Blocker, { isEnabled: props.isLoading, inset: blockerInset })));
2662
2711
  });
2663
2712
 
2664
2713
  const RichTextView = /* @__PURE__ */uuiCore.withMods(uuiComponents__namespace.RichTextView, (mods) => ['uui-typography', `uui-typography-size-${mods.size || settings.richTextView.sizes.default}`]);
@@ -2689,7 +2738,7 @@ function Tree(props) {
2689
2738
  return (React__namespace.createElement(VirtualList, { value: value, onValueChange: onValueChange, rowsCount: rowsCount, rows: renderedRows, cx: uuiCore.cx(propsCx), role: "tree" }));
2690
2739
  }
2691
2740
 
2692
- var css$U = {"root":"hHTDG7"};
2741
+ var css$U = {"root":"lMXYuJ"};
2693
2742
 
2694
2743
  function CheckboxGroup(props) {
2695
2744
  const currentValue = props.value || [];
@@ -2791,7 +2840,7 @@ const Tabs = /* @__PURE__ */React.forwardRef((props, ref) => {
2791
2840
  });
2792
2841
  Tabs.displayName = 'Tabs';
2793
2842
 
2794
- var css$T = {"root":"ThyT4m","modal-blocker":"V6snqm","modalBlocker":"V6snqm","animateModalBlocker":"op2kJ9","modal":"_98HlxR","modal-footer":"o03RoT","modalFooter":"o03RoT","border-top":"ZKegJj","borderTop":"ZKegJj","modal-header":"okK-NK","modalHeader":"okK-NK","border-bottom":"bZ-p4H","borderBottom":"bZ-p4H"};
2843
+ var css$T = {"root":"_4yUjfz","modal-blocker":"TX5p8-","modalBlocker":"TX5p8-","animateModalBlocker":"qsInCo","modal":"_2Ks58T","modal-footer":"qmTu-7","modalFooter":"qmTu-7","border-top":"_6W15ve","borderTop":"_6W15ve","modal-header":"kBqnuN","modalHeader":"kBqnuN","border-bottom":"mGXFEu","borderBottom":"mGXFEu"};
2795
2844
 
2796
2845
  const ModalBlocker = /* @__PURE__ */uuiCore.withMods(uuiComponents.ModalBlocker, () => [css$T.modalBlocker]);
2797
2846
  const ModalWindow = /* @__PURE__ */uuiCore.withMods(uuiComponents.ModalWindow, () => [css$T.root, css$T.modal], (props) => {
@@ -2898,6 +2947,7 @@ const TREE_SHAKEABLE_INIT = () => ({
2898
2947
  columnHeader: {
2899
2948
  collapseAllTooltip: 'Collapse All',
2900
2949
  expandAllTooltip: 'Expand All',
2950
+ filterActiveLabel: 'filter active',
2901
2951
  },
2902
2952
  },
2903
2953
  pickerFilterHeader: {
@@ -2983,7 +3033,7 @@ const TREE_SHAKEABLE_INIT = () => ({
2983
3033
  });
2984
3034
  const i18n = /* @__PURE__ */TREE_SHAKEABLE_INIT();
2985
3035
 
2986
- var css$S = {"root":"JOmpvW","icon-wrapper":"Rk3Kg6","iconWrapper":"Rk3Kg6","action-wrapper":"AT1sud","actionWrapper":"AT1sud","close-icon":"NIkRYj","closeIcon":"NIkRYj","main-path":"ZVWwAW","mainPath":"ZVWwAW","content":"CTMRj-","close-wrapper":"AW90dt","closeWrapper":"AW90dt","clear-notifications":"bZiaDZ","clearNotifications":"bZiaDZ"};
3036
+ var css$S = {"root":"VCuR5k","icon-wrapper":"prqZvp","iconWrapper":"prqZvp","action-wrapper":"X-IzMp","actionWrapper":"X-IzMp","close-icon":"_3EZ22P","closeIcon":"_3EZ22P","main-path":"QDcskl","mainPath":"QDcskl","content":"J9j7nF","close-wrapper":"Cq64U-","closeWrapper":"Cq64U-","clear-notifications":"M5PhB8","clearNotifications":"M5PhB8"};
2987
3037
 
2988
3038
  const NotificationCard = /* @__PURE__ */React__namespace.default.forwardRef((props, ref) => {
2989
3039
  const notificationCardNode = React__namespace.default.useRef(null);
@@ -3016,7 +3066,7 @@ function ClearNotification() {
3016
3066
  React__namespace.default.createElement(LinkButton, { caption: i18n.notificationCard.closeAllNotificationsButton, onClick: () => uuiCtx.uuiNotifications.clearAll() })));
3017
3067
  }
3018
3068
 
3019
- var css$R = {"footer":"D--Nqm"};
3069
+ var css$R = {"footer":"J56wd0"};
3020
3070
 
3021
3071
  class ConfirmationModal extends React__namespace.Component {
3022
3072
  render() {
@@ -3058,7 +3108,7 @@ function useReliableForceUpdate() {
3058
3108
  return red[1];
3059
3109
  }
3060
3110
 
3061
- var css$Q = {"root":"JxMpHI","container":"La8OdX"};
3111
+ var css$Q = {"root":"CGEeiF","container":"vi-Ish"};
3062
3112
 
3063
3113
  const defaultFormat = 'MMM D, YYYY';
3064
3114
  const valueFormat = 'YYYY-MM-DD';
@@ -3285,14 +3335,14 @@ function DatePickerHeader({ navIconLeft, navIconRight, value: { month, view }, o
3285
3335
  React__namespace.createElement(Button, { icon: navIconRight || settings.datePicker.icons.body.nextIcon, color: "secondary", fill: "ghost", cx: uuiHeader.navIconRight, onClick: !isDisabled && (() => onRightNavigationArrow()), isDisabled: disableNext }))));
3286
3336
  }
3287
3337
 
3288
- var css$P = {"root":"hiodii"};
3338
+ var css$P = {"root":"EXKo7e"};
3289
3339
 
3290
3340
  function applyDateSelectionMods() {
3291
3341
  return [css$P.root, `uui-size-${settings.datePicker.sizes.body}`];
3292
3342
  }
3293
3343
  const Calendar = /* @__PURE__ */uuiCore.withMods(uuiComponents.Calendar, applyDateSelectionMods);
3294
3344
 
3295
- var css$O = {"root":"FkKbOC"};
3345
+ var css$O = {"root":"fM4MRI"};
3296
3346
 
3297
3347
  const uuiDatePickerBody = {
3298
3348
  wrapper: 'uui-datepicker-body-wrapper',
@@ -3358,7 +3408,8 @@ function DatePickerComponent(props, ref) {
3358
3408
  setInputValue(toCustomDateFormat(value, format));
3359
3409
  }, [value, setInputValue]);
3360
3410
  const onValueChange = (newValue) => {
3361
- if (value !== newValue) {
3411
+ const isValueChanged = (value || '') !== (newValue || '');
3412
+ if (isValueChanged) {
3362
3413
  props.onValueChange(newValue);
3363
3414
  if (props.getValueChangeAnalyticsEvent) {
3364
3415
  const event = props.getValueChangeAnalyticsEvent(newValue, value);
@@ -3373,6 +3424,10 @@ function DatePickerComponent(props, ref) {
3373
3424
  };
3374
3425
  const onBlur = (e) => {
3375
3426
  props.onBlur?.(e);
3427
+ const formattedValue = toCustomDateFormat(value, format);
3428
+ if (inputValue === formattedValue) {
3429
+ return; // No changes made to the field, skip validation
3430
+ }
3376
3431
  if (isValidDate(inputValue, format, props.filter)) {
3377
3432
  setInputValue(toCustomDateFormat(inputValue, format));
3378
3433
  onValueChange(toValueDateFormat(inputValue, format));
@@ -3401,7 +3456,7 @@ function DatePickerComponent(props, ref) {
3401
3456
  props.onFocus?.(e);
3402
3457
  }, onKeyDown: onInputKeyDown, onBlur: onBlur, mode: props.mode || defaultMode$1, rawProps: props.rawProps?.input, id: props.id }));
3403
3458
  };
3404
- const renderBody = React.useMemo(() => (renderProps) => {
3459
+ const renderBody = React.useMemo(() => function (renderProps) {
3405
3460
  return (React__namespace.default.createElement(DropdownContainer, { ...renderProps },
3406
3461
  React__namespace.default.createElement(DatePickerBody, { value: value, onValueChange: onBodyValueChange, cx: uuiCore.cx(props.bodyCx), filter: props.filter, isHoliday: props.isHoliday, renderDay: props.renderDay, rawProps: props.rawProps?.body, initialViewMonth: props.initialViewMonth }),
3407
3462
  props.renderFooter?.()));
@@ -3414,7 +3469,7 @@ function DatePickerComponent(props, ref) {
3414
3469
  }
3415
3470
  const DatePicker = /* @__PURE__ */React__namespace.default.forwardRef(DatePickerComponent);
3416
3471
 
3417
- var css$N = {"date-input":"Jqv8iS","dateInput":"Jqv8iS","root":"Li5E8E","separator":"AbfuiE"};
3472
+ var css$N = {"date-input":"f61-sG","dateInput":"f61-sG","root":"g7GnjG","separator":"awlDd6"};
3418
3473
 
3419
3474
  const RangeDatePickerInput = /* @__PURE__ */React.forwardRef(({ isDisabled, isInvalid, isReadonly, size, disableClear, rawProps, value, inFocus, format, onValueChange, onFocusInput, onBlurInput, onClick, getPlaceholder, filter, onKeyDown, preventEmptyFromDate, preventEmptyToDate, id, cx: classes, }, ref) => {
3420
3475
  const [inputValue, setInputValue] = React.useState(toCustomDateRangeFormat(value, format));
@@ -3437,6 +3492,10 @@ const RangeDatePickerInput = /* @__PURE__ */React.forwardRef(({ isDisabled, isIn
3437
3492
  };
3438
3493
  const handleBlur = (event, inputType) => {
3439
3494
  onBlurInput?.(event, inputType);
3495
+ const formattedValue = toCustomDateRangeFormat(value, format);
3496
+ if (inputValue[inputType] === formattedValue[inputType]) {
3497
+ return; // No changes made to this field, skip validation
3498
+ }
3440
3499
  const canBeEmpty = {
3441
3500
  from: !preventEmptyFromDate,
3442
3501
  to: !preventEmptyToDate,
@@ -3487,7 +3546,7 @@ const RangeDatePickerInput = /* @__PURE__ */React.forwardRef(({ isDisabled, isIn
3487
3546
  React__namespace.default.createElement(TextInput, { cx: uuiCore.cx(css$N.dateInput, inFocus === 'to' && uuiCore.uuiMod.focus), placeholder: getPlaceholder ? getPlaceholder('to') : i18n.rangeDatePicker.pickerPlaceholderTo, size: size || settings.rangeDatePicker.sizes.default, value: inputValue.to || undefined, icon: clearAllowed && ForwardRef$Q, iconPosition: "right", iconLabel: "Clear selected date range", onIconClick: onClear, onValueChange: (v) => onInputChange(v || '', 'to'), onFocus: (e) => handleFocus(e, 'to'), onBlur: (e) => handleBlur(e, 'to'), isInvalid: isInvalid, isDisabled: isDisabled, isReadonly: isReadonly, isDropdown: false, rawProps: rawProps?.to, onClick: onClick, onKeyDown: onInputKeyDown })));
3488
3547
  });
3489
3548
 
3490
- var css$M = {"root":"J3GYr2"};
3549
+ var css$M = {"root":"FE5uLX"};
3491
3550
 
3492
3551
  const uuiPresets = {
3493
3552
  container: 'uui-presets-container',
@@ -3507,7 +3566,7 @@ function CalendarPresets(props) {
3507
3566
  getPresets(props.presets).map((item) => (React__namespace.createElement(LinkButton, { key: item.key, caption: item.name, onClick: () => props.onPresetSet(item), size: settings.rangeDatePicker.sizes.preset })))));
3508
3567
  }
3509
3568
 
3510
- var css$L = {"root":"Q1L-Gc","container":"-pb3gQ","day-selection":"i7elKX","daySelection":"i7elKX","from-picker":"tzjsB8","fromPicker":"tzjsB8","to-picker":"K0f3uP","toPicker":"K0f3uP","bodes-wrapper":"a8Nkk5","bodesWrapper":"a8Nkk5","blocker":"VuM7dV"};
3569
+ var css$L = {"root":"g-Uh-a","container":"chyhsa","day-selection":"o1UhI-","daySelection":"o1UhI-","from-picker":"_9tzbXn","fromPicker":"_9tzbXn","to-picker":"wJloKY","toPicker":"wJloKY","bodes-wrapper":"R7HbPd","bodesWrapper":"R7HbPd","blocker":"VyzdAJ"};
3511
3570
 
3512
3571
  const uuiRangeDatePickerBody = {
3513
3572
  inRange: 'uui-range-datepicker-in-range',
@@ -3709,7 +3768,7 @@ const getDayState = (day, selectedDate) => {
3709
3768
  };
3710
3769
  };
3711
3770
 
3712
- var css$K = {"dropdown-container":"jqgyaD","dropdownContainer":"jqgyaD"};
3771
+ var css$K = {"dropdown-container":"uKTNuw","dropdownContainer":"uKTNuw"};
3713
3772
 
3714
3773
  function RangeDatePickerComponent(props, ref) {
3715
3774
  const { value: _value, format = defaultFormat, size = settings.rangeDatePicker.sizes.default } = props;
@@ -3777,7 +3836,7 @@ function RangeDatePickerComponent(props, ref) {
3777
3836
  }
3778
3837
  const RangeDatePicker = /* @__PURE__ */React__namespace.default.forwardRef(RangeDatePickerComponent);
3779
3838
 
3780
- var css$J = {"root":"KWXYFs","blocker":"_34prcH","marker":"_84dtsR","top":"UhZzgZ","bottom":"DCwbkt","left":"R8GNRF","right":"lCnSoV","inside":"bodQRa"};
3839
+ var css$J = {"root":"u7dZKH","blocker":"Uk3hQU","marker":"xeke1m","top":"B0TIVy","bottom":"_85B0uh","left":"ePl0zr","right":"_4R6YIi","inside":"gEBKHQ"};
3781
3840
 
3782
3841
  function DropMarker(props) {
3783
3842
  return props.isDndInProgress
@@ -3792,9 +3851,9 @@ function DropMarker(props) {
3792
3851
  : null;
3793
3852
  }
3794
3853
 
3795
- var css$I = {"root":"sO-4YH","search-wrapper":"ZNucT4","searchWrapper":"ZNucT4","no-data":"aWayXT","noData":"aWayXT"};
3854
+ var css$I = {"root":"tMJiQm","search-wrapper":"fhZFAT","searchWrapper":"fhZFAT","no-data":"WMkNix","noData":"WMkNix","empty-status-announcer":"bvtPB7","emptyStatusAnnouncer":"bvtPB7"};
3796
3855
 
3797
- var css$H = {"picker-row":"OEG3Tc","pickerRow":"OEG3Tc","align-widgets-top":"r1NAZC","alignWidgetsTop":"r1NAZC","row-content":"L7cFY8","rowContent":"L7cFY8","align-widgets-center":"iHarv9","alignWidgetsCenter":"iHarv9","icon-container":"AgdYH7","iconContainer":"AgdYH7","content-wrapper":"AEh42m","contentWrapper":"AEh42m","icon-wrapper":"RgkYBk","iconWrapper":"RgkYBk","icon-default":"IHAUy-","iconDefault":"IHAUy-","selected-mark":"C-1TQK","selectedMark":"C-1TQK"};
3856
+ var css$H = {"picker-row":"AznH1Z","pickerRow":"AznH1Z","align-widgets-top":"XPma4m","alignWidgetsTop":"XPma4m","row-content":"JwKtND","rowContent":"JwKtND","align-widgets-center":"JHmBNU","alignWidgetsCenter":"JHmBNU","icon-container":"oPKubC","iconContainer":"oPKubC","content-wrapper":"Pz-8SD","contentWrapper":"Pz-8SD","icon-wrapper":"lOXhs1","iconWrapper":"lOXhs1","icon-default":"zkdtCU","iconDefault":"zkdtCU","selected-mark":"Rfykaj","selectedMark":"Rfykaj"};
3798
3857
 
3799
3858
  const mergeHighlightRanges = (ranges) => {
3800
3859
  const mergedRanges = [];
@@ -3861,7 +3920,7 @@ const getHighlightedSearchMatches = (str, search) => {
3861
3920
  return getDecoratedText(str, ranges);
3862
3921
  };
3863
3922
 
3864
- var css$G = {"root":"bNoqr-","column-gap":"Ig-s0L","columnGap":"Ig-s0L","title":"_8OsPQb","subtitle":"kYPPOS","disabled":"o62R-I","multiline":"xzbnMo"};
3923
+ var css$G = {"root":"OpXQJD","column-gap":"_2jvmWR","columnGap":"_2jvmWR","title":"vhbNHi","subtitle":"BAV0Du","disabled":"-byJT0","multiline":"_7FoW3u"};
3865
3924
 
3866
3925
  function PickerItem(props) {
3867
3926
  const { highlightSearchMatches = true, size, avatarUrl, isLoading, isDisabled, icon, } = props;
@@ -3950,6 +4009,15 @@ function DataPickerBody({ highlightSearchMatches = true, autoFocusSearch = true,
3950
4009
  const prevProps = uuiCore.usePrevious(props);
3951
4010
  const showSearch = props.showSearch === 'auto' ? props.totalCount > 10 : Boolean(props.showSearch);
3952
4011
  const [isKeyboardNavigation, setIsKeyboardNavigation] = React__namespace.default.useState(false);
4012
+ const [emptyMessage, setEmptyMessage] = React__namespace.default.useState('');
4013
+ // We need to also ensure that topIndex === 0, because we can have state were there is no rows but topIndex > 0, in case when we scrolled lover than we have rows
4014
+ // we fix this state on next render and shouldn't show empty state.
4015
+ const isEmptyList = props.rows.length === 0 && props.value.topIndex === 0;
4016
+ React.useEffect(() => {
4017
+ if (!isEmptyList) {
4018
+ setEmptyMessage('');
4019
+ }
4020
+ }, [isEmptyList]);
3953
4021
  React.useEffect(() => {
3954
4022
  if (props.rows.length !== prevProps?.rows.length || (!isEqual__default.default(prevProps?.value.checked, props.value.checked) && !props.fixedBodyPosition)) {
3955
4023
  props.scheduleUpdate?.();
@@ -4039,12 +4107,11 @@ function DataPickerBody({ highlightSearchMatches = true, autoFocusSearch = true,
4039
4107
  : settings.pickerInput.sizes.body.getSearchSize({ pickerSize: props.searchSize });
4040
4108
  const renderedDataRows = React.useMemo(() => props.rows.map((row) => renderRow(row, props.value)), [props.rows, props.value, isKeyboardNavigation]);
4041
4109
  return (React__namespace.default.createElement(React__namespace.default.Fragment, null,
4110
+ React__namespace.default.createElement("div", { className: css$I.emptyStatusAnnouncer, role: "status", "aria-live": "polite", "aria-atomic": "true" }, emptyMessage),
4042
4111
  showSearch && (React__namespace.default.createElement("div", { key: "search", className: uuiCore.cx(css$I.searchWrapper, 'uui-picker_input-body-search') },
4043
4112
  React__namespace.default.createElement(uuiComponents.FlexCell, { grow: 1 }, autoFocusSearch ? React__namespace.default.createElement(FocusLock.MoveFocusInside, null, renderSearchInput()) : renderSearchInput()))),
4044
- React__namespace.default.createElement(FlexRow, { key: "body", cx: uuiCore.cx('uui-picker_input-body'), rawProps: { style: { maxHeight: props.maxHeight, maxWidth: props.maxWidth }, tabIndex: -1 } }, props.rows.length === 0 && props.value.topIndex === 0
4045
- // We need to also ensure that topIndex === 0, because we can have state were there is no rows but topIndex > 0, in case when we scrolled lover than we have rows
4046
- // we fix this state on next render and shouldn't show empty state.
4047
- ? renderEmpty() : (React__namespace.default.createElement(VirtualList, { value: props.value, onValueChange: props.onValueChange, rows: renderedDataRows, role: "listbox", cx: css$I.root, rawProps: {
4113
+ React__namespace.default.createElement(FlexRow, { key: "body", cx: uuiCore.cx('uui-picker_input-body'), rawProps: { style: { maxHeight: props.maxHeight, maxWidth: props.maxWidth }, tabIndex: -1 } }, isEmptyList
4114
+ ? (React__namespace.default.createElement("div", { ref: (el) => el && setEmptyMessage(el.textContent ?? '') }, renderEmpty())) : (React__namespace.default.createElement(VirtualList, { value: props.value, onValueChange: props.onValueChange, rows: renderedDataRows, role: "listbox", cx: css$I.root, rawProps: {
4048
4115
  'aria-multiselectable': props.selectionMode === 'multi' ? true : null,
4049
4116
  'aria-orientation': 'vertical',
4050
4117
  tabIndex: 0,
@@ -4079,7 +4146,7 @@ function DataPickerFooterImpl(props) {
4079
4146
  }
4080
4147
  const DataPickerFooter = /* @__PURE__ */React__namespace.default.memo(DataPickerFooterImpl);
4081
4148
 
4082
- var css$F = {"header":"D-mQSm","title":"c9DZwj","close":"DKAZa7"};
4149
+ var css$F = {"header":"dcE--O","title":"KTqdQx","close":"ish9jy"};
4083
4150
 
4084
4151
  const DataPickerMobileHeaderImpl = (props) => {
4085
4152
  const title = props.title && typeof props.title === 'string' ? props.title.charAt(0).toUpperCase() + props.title.slice(1) : '';
@@ -4089,7 +4156,7 @@ const DataPickerMobileHeaderImpl = (props) => {
4089
4156
  };
4090
4157
  const DataPickerMobileHeader = /* @__PURE__ */React__namespace.default.memo(DataPickerMobileHeaderImpl);
4091
4158
 
4092
- var css$E = {"done":"jDyBhQ","container":"Oyqjup"};
4159
+ var css$E = {"done":"zlooV9","container":"_4TbYLa"};
4093
4160
 
4094
4161
  const PickerBodyMobileView = (props) => {
4095
4162
  const isMobileView = uuiCore.isMobile();
@@ -4101,7 +4168,7 @@ const PickerBodyMobileView = (props) => {
4101
4168
  isMobileView && (React__namespace.default.createElement(LinkButton, { caption: i18n.pickerInput.doneButton, onClick: () => props.onClose?.(), cx: css$E.done, size: settings.pickerInput.sizes.body.mobileFooterLinkButton }))));
4102
4169
  };
4103
4170
 
4104
- var css$D = {"sub-header-wrapper":"r9yNqY","subHeaderWrapper":"r9yNqY","switch":"ThMdDP","search":"HCA2V7","no-found-modal-container":"jHdJU4","noFoundModalContainer":"jHdJU4","no-found-modal-container-icon":"_8ijOrr","noFoundModalContainerIcon":"_8ijOrr","no-found-modal-container-text":"I8ZOZj","noFoundModalContainerText":"I8ZOZj","body":"CMCOxZ"};
4171
+ var css$D = {"sub-header-wrapper":"DctblX","subHeaderWrapper":"DctblX","switch":"nxAIRh","search":"gA8hqk","no-found-modal-container":"OK1ls2","noFoundModalContainer":"OK1ls2","no-found-modal-container-icon":"OkqEpQ","noFoundModalContainerIcon":"OkqEpQ","no-found-modal-container-text":"AHOgpq","noFoundModalContainerText":"AHOgpq","body":"aioejM"};
4105
4172
 
4106
4173
  function PickerModal(props) {
4107
4174
  const { view, selection, dataSourceStateLens, dataSourceState, getName, clearSelection, getRows, getListProps, getFooterProps, isSingleSelect, handleDataSourceValueChange, } = uuiComponents.usePickerModal(props);
@@ -4162,7 +4229,7 @@ function PickerModal(props) {
4162
4229
  React__namespace.default.createElement(ModalFooter, null, props.renderFooter ? props.renderFooter(getFooterProps()) : renderFooter()))));
4163
4230
  }
4164
4231
 
4165
- var css$C = {"tooltip":"T8WmWD","noShrink":"B6xHyj"};
4232
+ var css$C = {"tooltip":"_4Treuu","noShrink":"rR7TvO"};
4166
4233
 
4167
4234
  const PickerTogglerTag = /* @__PURE__ */React__namespace.forwardRef((props, ref) => {
4168
4235
  const tagProps = {
@@ -4181,7 +4248,7 @@ const PickerTogglerTag = /* @__PURE__ */React__namespace.forwardRef((props, ref)
4181
4248
  }
4182
4249
  });
4183
4250
 
4184
- var css$B = {"root":"CqpEUb"};
4251
+ var css$B = {"root":"QGtLbJ"};
4185
4252
 
4186
4253
  const defaultMode = EditMode.FORM;
4187
4254
  function applyPickerTogglerMods(mods) {
@@ -4263,7 +4330,7 @@ function PickerInputComponent(props, ref) {
4263
4330
  }
4264
4331
  const PickerInput = /* @__PURE__ */React__namespace.default.forwardRef(PickerInputComponent);
4265
4332
 
4266
- var css$A = {"row":"Fhrl5-"};
4333
+ var css$A = {"row":"hWRm8c"};
4267
4334
 
4268
4335
  function PickerListRow(props) {
4269
4336
  let label;
@@ -4283,7 +4350,7 @@ function PickerListRow(props) {
4283
4350
  return (React__namespace.default.createElement("div", { role: "option", "aria-selected": props.isSelectable ? props.isSelected : undefined, "aria-busy": props.isLoading, "aria-posinset": props.index + 1, ...(props.checkbox?.isVisible && { 'aria-checked': props.isChecked }), className: css$A.row }, component));
4284
4351
  }
4285
4352
 
4286
- var css$z = {"root":"W0z1ys"};
4353
+ var css$z = {"root":"BM9No7"};
4287
4354
 
4288
4355
  function PickerList(props) {
4289
4356
  const { context, view, onlySelectedView, getName, getEntityName, appendLastSelected, getSelectedIdsArray, buildRowsList, getMaxDefaultItems, getModalTogglerCaption, } = uuiComponents.usePickerList(props);
@@ -4318,7 +4385,7 @@ function PickerList(props) {
4318
4385
  }, selectedRows)));
4319
4386
  }
4320
4387
 
4321
- var css$y = {"root":"R-YzH1","wrapper":"P-Ka0T","align-widgets-top":"PDiAt1","alignWidgetsTop":"PDiAt1","align-widgets-center":"g8d-g-","alignWidgetsCenter":"g8d-g-"};
4388
+ var css$y = {"root":"djeBSr","wrapper":"_2xF4NN","align-widgets-top":"-mnZme","alignWidgetsTop":"-mnZme","align-widgets-center":"DCXMuu","alignWidgetsCenter":"DCXMuu"};
4322
4389
 
4323
4390
  function DataTableCell(initialProps) {
4324
4391
  const props = { ...initialProps };
@@ -4368,7 +4435,7 @@ function DataTableCell(initialProps) {
4368
4435
  return React__namespace.createElement(uuiComponents.DataTableCell, { ...props });
4369
4436
  }
4370
4437
 
4371
- var css$x = {"root":"t6V8fH"};
4438
+ var css$x = {"root":"_-58jb7"};
4372
4439
 
4373
4440
  // Here we define a single instance of the renderCell function to make DataTableRow#shouldComponentUpdate work.
4374
4441
  // As we need our mods to style the cell properly, we extract them from DataTableCellProps.rowProps, which is a hack, but it's reliable enough.
@@ -4384,14 +4451,16 @@ const DataTableRow = /* @__PURE__ */uuiCore.withMods(uuiComponents.DataTableRow,
4384
4451
  ];
4385
4452
  }, () => propsMods);
4386
4453
 
4387
- var css$w = {"sorting-panel-container":"Hpbjih","sortingPanelContainer":"Hpbjih"};
4454
+ var css$w = {"sorting-panel-container":"vLpv8O","sortingPanelContainer":"vLpv8O"};
4388
4455
 
4389
4456
  const SortingPanelImpl = ({ sortDirection, onSort }) => {
4390
4457
  const sortAsc = React.useCallback(() => onSort(sortDirection === 'asc' ? undefined : 'asc'), [onSort]);
4391
4458
  const sortDesc = React.useCallback(() => onSort(sortDirection === 'desc' ? undefined : 'desc'), [onSort]);
4459
+ const isAscSelected = sortDirection === 'asc';
4460
+ const isDescSelected = sortDirection === 'desc';
4392
4461
  return (React__namespace.default.createElement(FlexCell, { cx: uuiCore.cx(css$w.sortingPanelContainer, 'uui-dropdownMenu-body') },
4393
- React__namespace.default.createElement(DropdownMenuButton, { isActive: sortDirection === 'asc', caption: i18n.pickerFilterHeader.sortAscending, icon: settings.dataTable.icons.header.ascSortIcon, onClick: sortAsc }),
4394
- React__namespace.default.createElement(DropdownMenuButton, { isActive: sortDirection === 'desc', caption: i18n.pickerFilterHeader.sortDescending, icon: settings.dataTable.icons.header.descSortIcon, onClick: sortDesc })));
4462
+ React__namespace.default.createElement(DropdownMenuButton, { isActive: isAscSelected, caption: i18n.pickerFilterHeader.sortAscending, icon: settings.dataTable.icons.header.ascSortIcon, onClick: sortAsc, rawProps: { role: 'menuitemradio', 'aria-checked': isAscSelected } }),
4463
+ React__namespace.default.createElement(DropdownMenuButton, { isActive: isDescSelected, caption: i18n.pickerFilterHeader.sortDescending, icon: settings.dataTable.icons.header.descSortIcon, onClick: sortDesc, rawProps: { role: 'menuitemradio', 'aria-checked': isDescSelected } })));
4395
4464
  };
4396
4465
  const SortingPanel = /* @__PURE__ */React__namespace.default.memo(SortingPanelImpl);
4397
4466
 
@@ -4404,113 +4473,114 @@ const ColumnHeaderDropdownImpl = (props) => {
4404
4473
  };
4405
4474
  const ColumnHeaderDropdown = /* @__PURE__ */React__namespace.default.memo(ColumnHeaderDropdownImpl);
4406
4475
 
4407
- var css$v = {"root":"xOjbS5","caption-wrapper":"nSzmnq","captionWrapper":"nSzmnq","sort-icon":"tBrExv","sortIcon":"tBrExv","dropdown-icon":"_9YzAp3","dropdownIcon":"_9YzAp3","infoIcon":"xj-i7M","sortInActive":"LHLh8z","align-right":"dcEwZw","alignRight":"dcEwZw","align-center":"H0AKL0","alignCenter":"H0AKL0","caption":"YCnKYe","truncate":"kGBPHG","upper-case":"_2u1c58","upperCase":"_2u1c58","checkbox":"PdIaNC","icon":"Y8tF4z","fold-all-icon":"V4sJIA","foldAllIcon":"V4sJIA","cell-tooltip":"IjJPRW","cellTooltip":"IjJPRW","resizing-marker":"-kLxwb","resizingMarker":"-kLxwb","pinned-right":"o4M0td","pinnedRight":"o4M0td","draggable":"OM6j-K","ghost":"aeKzhL","is-dragged-out":"Lr1C-Q","isDraggedOut":"Lr1C-Q","dnd-marker-left":"AOczTV","dndMarkerLeft":"AOczTV","dnd-marker-right":"o1qyDz","dndMarkerRight":"o1qyDz","cell-tooltip-wrapper":"g6tjqL","cellTooltipWrapper":"g6tjqL","cell-tooltip-text":"_2xcQes","cellTooltipText":"_2xcQes","tooltip-caption":"_0Ula0-","tooltipCaption":"_0Ula0-","tooltip-info":"uEyohm","tooltipInfo":"uEyohm"};
4476
+ var css$v = {"root":"MlPbCS","caption-wrapper":"NiopQP","captionWrapper":"NiopQP","sort-icon":"UO6JkM","sortIcon":"UO6JkM","dropdown-icon":"iRU0zZ","dropdownIcon":"iRU0zZ","infoIcon":"L7egmt","sortInActive":"gfP7KI","align-right":"uk9YRV","alignRight":"uk9YRV","align-center":"hOepfI","alignCenter":"hOepfI","caption":"iW3U6O","truncate":"_7SBpJX","upper-case":"ub6mi-","upperCase":"ub6mi-","checkbox":"NO-b1J","icon":"GFDAeS","fold-all-icon":"x5NQJW","foldAllIcon":"x5NQJW","cell-tooltip":"FZW2AN","cellTooltip":"FZW2AN","resizing-marker":"w8Dc-z","resizingMarker":"w8Dc-z","pinned-right":"_3OcRs0","pinnedRight":"_3OcRs0","draggable":"z-n-KL","ghost":"nSsP-w","is-dragged-out":"n7UC4E","isDraggedOut":"n7UC4E","dnd-marker-left":"iYrgv0","dndMarkerLeft":"iYrgv0","dnd-marker-right":"dx-azV","dndMarkerRight":"dx-azV","cell-tooltip-wrapper":"PGSC1n","cellTooltipWrapper":"PGSC1n","cell-tooltip-text":"h3gfus","cellTooltipText":"h3gfus","tooltip-caption":"ChZNkP","tooltipCaption":"ChZNkP","tooltip-info":"hMScDw","tooltipInfo":"hMScDw"};
4408
4477
 
4409
- class DataTableHeaderCell extends React__namespace.Component {
4410
- constructor() {
4411
- super(...arguments);
4412
- this.state = {
4413
- isDropdownOpen: null,
4414
- };
4415
- this.getTooltipContent = (column) => (React__namespace.createElement("div", { className: uuiCore.cx(css$v.cellTooltipWrapper, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCaptionTooltip) },
4416
- React__namespace.createElement(Text, { cx: [css$v.cellTooltipText, css$v.tooltipCaption] }, column.caption),
4417
- column.info && (React__namespace.createElement(Text, { cx: [css$v.cellTooltipText, css$v.tooltipInfo] }, column.info))));
4418
- this.getColumnCaption = (props, dropdownProps) => {
4419
- const renderTooltip = this.props.column.renderTooltip || this.getTooltipContent;
4420
- const captionCx = uuiCore.cx([
4421
- css$v.caption,
4422
- this.props.textCase === 'upper' && css$v.upperCase,
4423
- uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCaption,
4424
- 'uui-typography-inline',
4425
- this.props.size >= '48' && css$v.truncate,
4426
- ]);
4427
- const handleFilterOpen = (e) => {
4428
- if (e.key === 'Enter' || e.key === ' ') {
4429
- dropdownProps.onClick(e);
4430
- e.preventDefault();
4431
- }
4432
- };
4433
- const handleSort = (e) => {
4434
- if (e.key === 'Enter' || e.key === ' ') {
4435
- props.toggleSort(e);
4436
- e.preventDefault();
4437
- }
4438
- };
4439
- return (React__namespace.createElement("div", { className: uuiCore.cx(css$v.captionWrapper, css$v['align-' + this.props.column.textAlign], uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCaptionWrapper) },
4440
- React__namespace.createElement(Tooltip, { placement: "top", color: "inverted", content: renderTooltip(this.props.column), cx: [css$v.cellTooltip, 'uui-dt-header-tooltip'], openDelay: 600, closeOnMouseLeave: "boundary" },
4441
- React__namespace.createElement("div", { key: "text", className: captionCx }, this.props.column.caption)),
4442
- this.props.column.isSortable && (!this.props.column.renderFilter || this.props.sortDirection) && (React__namespace.createElement(uuiComponents.ControlIcon, { key: "sort", cx: uuiCore.cx(css$v.icon, css$v.sortIcon, !this.props.sortDirection && css$v.sortInActive, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderSortIcon), icon: settings.dataTable.icons.header[this.props.sortDirection === 'desc' ? 'descSortIcon' : this.props.sortDirection === 'asc' ? 'ascSortIcon' : 'defaultSortIcon'], onKeyDown: !this.props.column.renderFilter ? handleSort : undefined })),
4443
- this.props.isFilterActive && (React__namespace.createElement(IconButton, { key: "filter", cx: uuiCore.cx(css$v.icon, !this.props.sortDirection && css$v.filterIcon, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderFilterIcon), color: "neutral", icon: settings.dataTable.icons.header.filterIcon })),
4444
- this.props.column.renderFilter && (React__namespace.createElement(uuiComponents.ControlIcon, { key: "dropdown", cx: uuiCore.cx(css$v.icon, css$v.dropdownIcon, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderDropdownIcon), icon: settings.dataTable.icons.header[this.state.isDropdownOpen ? 'openedDropdownIcon' : 'dropdownIcon'], onKeyDown: handleFilterOpen }))));
4445
- };
4446
- this.renderHeaderCheckbox = () => {
4447
- if (this.props.selectAll && this.props.isFirstColumn) {
4448
- return (React__namespace.createElement(Checkbox, { size: settings.dataTable.sizes.body.checkboxMap[this.props.size], rawProps: { 'aria-label': 'Select All' }, ...this.props.selectAll, cx: uuiCore.cx(css$v.checkbox, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCheckbox) }));
4478
+ function DefaultTooltipContent(column) {
4479
+ return (React__namespace.default.createElement("div", { className: uuiCore.cx(css$v.cellTooltipWrapper, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCaptionTooltip) },
4480
+ React__namespace.default.createElement(Text, { cx: [css$v.cellTooltipText, css$v.tooltipCaption] }, column.caption),
4481
+ column.info && (React__namespace.default.createElement(Text, { cx: [css$v.cellTooltipText, css$v.tooltipInfo] }, column.info))));
4482
+ }
4483
+ function DataTableHeaderCell(props) {
4484
+ const [isDropdownOpen, setIsDropdownOpen] = React.useState(null);
4485
+ const id = React.useId();
4486
+ const captionId = `uui-dt-header-caption-${id}-${props.column.key}`;
4487
+ const captionAriaProps = {
4488
+ 'aria-labelledby': captionId,
4489
+ 'aria-description': props.isFilterActive ? i18n.tables.columnHeader.filterActiveLabel : undefined,
4490
+ };
4491
+ const getColumnCaption = (contentProps, dropdownProps) => {
4492
+ const renderTooltip = props.column.renderTooltip || DefaultTooltipContent;
4493
+ const captionCx = uuiCore.cx([
4494
+ css$v.caption,
4495
+ props.textCase === 'upper' && css$v.upperCase,
4496
+ uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCaption,
4497
+ 'uui-typography-inline',
4498
+ props.size >= '48' && css$v.truncate,
4499
+ ]);
4500
+ const handleFilterOpen = (e) => {
4501
+ if (e.key === 'Enter' || e.key === ' ') {
4502
+ dropdownProps.onClick(e);
4503
+ e.preventDefault();
4449
4504
  }
4450
4505
  };
4451
- this.renderFoldAllIcon = () => {
4452
- if (this.props.isFirstColumn && this.props.showFoldAll) {
4453
- return (React__namespace.createElement(Tooltip, { content: this.props.areAllFolded
4454
- ? i18n.tables.columnHeader.expandAllTooltip
4455
- : i18n.tables.columnHeader.collapseAllTooltip },
4456
- React__namespace.createElement(uuiComponents.ControlIcon, { cx: uuiCore.cx(css$v.icon, css$v.foldAllIcon, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderFoldAllIcon), icon: settings.dataTable.icons.header[this.props.areAllFolded ? 'unfoldIcon' : 'foldIcon'], onClick: this.props.onFoldAll, rawProps: {
4457
- 'aria-label': this.props.areAllFolded ? 'Expand All' : 'Collapse All',
4458
- 'aria-expanded': !!this.props.areAllFolded,
4459
- } })));
4506
+ const handleSort = (e) => {
4507
+ if (e.key === 'Enter' || e.key === ' ') {
4508
+ contentProps.toggleSort(e);
4509
+ e.preventDefault();
4460
4510
  }
4461
4511
  };
4462
- this.renderResizingMarker = (props) => {
4463
- return (React__namespace.createElement("div", { role: "separator", onMouseDown: props.onResizeStart, className: uuiCore.cx(css$v.resizingMarker, uuiCore.uuiMarkers.draggable, uuiCore.uuiMarkers.clickable) }));
4464
- };
4465
- this.getLeftPadding = () => {
4466
- const { columnsGap, isFirstColumn } = this.props;
4467
- if (columnsGap)
4468
- return isFirstColumn ? `${columnsGap}px` : `${+columnsGap / 2}px`;
4469
- return `var(--uui-dt-header-cell-padding${isFirstColumn ? '-edge' : ''})`;
4470
- };
4471
- this.getRightPadding = () => {
4472
- const { columnsGap, isLastColumn } = this.props;
4473
- if (columnsGap)
4474
- return isLastColumn ? `${columnsGap}px` : `${+columnsGap / 2}px`;
4475
- return `var(--uui-dt-header-cell-padding${isLastColumn ? '-edge' : ''})`;
4476
- };
4477
- this.getResizingMarkerWidth = () => {
4478
- const { columnsGap } = this.props;
4479
- return columnsGap ? `${+columnsGap / 2}px` : 'var(--uui-resize-marker-width)';
4480
- };
4481
- this.renderCellContent = (props, dropdownProps) => {
4482
- const isResizable = this.props.column.allowResizing ?? this.props.allowColumnsResizing;
4483
- const onClickEvent = !props.isResizing && (!this.props.column.renderFilter ? props.toggleSort : dropdownProps?.onClick);
4484
- const computeStyles = {
4485
- '--uui-dt-header-cell-icon-size': `${settings.dataTable.sizes.header.iconMap[this.props.size || settings.dataTable.sizes.header.row]}px`,
4486
- '--uui-dt-header-cell-padding-start': this.getLeftPadding(),
4487
- '--uui-dt-header-cell-padding-end': this.getRightPadding(),
4488
- '--uui-dt-header-cell-resizing-marker-width': this.getResizingMarkerWidth(),
4489
- };
4490
- return (React__namespace.createElement(uuiComponents.DataTableCellContainer, { column: this.props.column, ref: (ref) => {
4491
- props.ref(ref);
4492
- dropdownProps?.ref?.(ref);
4493
- }, cx: uuiCore.cx(uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCell, (this.props.column.isSortable || this.props.isDropdown) && uuiCore.uuiMarkers.clickable, css$v.root, `uui-size-${this.props.size || settings.dataTable.sizes.header.row}`, this.props.isFirstColumn && 'uui-dt-header-first-column', this.props.isLastColumn && 'uui-dt-header-last-column', this.props.column.fix && css$v['pinned-' + this.props.column.fix], isResizable && uuiCore.uuiMarkers.resizable, props.isDraggable && css$v.draggable, props.isDragGhost && css$v.ghost, props.isDraggedOut && css$v.isDraggedOut, props.isDndInProgress && css$v['dnd-marker-' + props.position]), onClick: onClickEvent, rawProps: {
4494
- role: 'columnheader',
4495
- 'aria-sort': this.props.sortDirection === 'asc' ? 'ascending' : this.props.sortDirection ? 'descending' : 'none',
4496
- ...props.eventHandlers,
4497
- }, style: computeStyles },
4498
- this.renderHeaderCheckbox(),
4499
- this.renderFoldAllIcon(),
4500
- this.getColumnCaption(props, dropdownProps),
4501
- isResizable && this.renderResizingMarker(props)));
4502
- };
4503
- this.renderCellWithFilter = (props) => (React__namespace.createElement(ColumnHeaderDropdown, { isOpen: this.state.isDropdownOpen, isSortable: this.props.column.isSortable, renderTarget: (dropdownProps) => this.renderCellContent(props, dropdownProps), renderFilter: this.props.renderFilter, onSort: this.props.onSort, sortDirection: this.props.sortDirection, onOpenChange: (isDropdownOpen) => this.setState({ isDropdownOpen }), title: this.props.column.caption }));
4504
- }
4505
- render() {
4506
- if (this.props.column.renderHeaderCell) {
4507
- return this.props.column.renderHeaderCell(this.props);
4512
+ return (React__namespace.default.createElement("div", { className: uuiCore.cx(css$v.captionWrapper, css$v['align-' + props.column.textAlign], uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCaptionWrapper) },
4513
+ React__namespace.default.createElement(Tooltip, { placement: "top", color: "inverted", content: renderTooltip(props.column), cx: [css$v.cellTooltip, 'uui-dt-header-tooltip'], openDelay: 600, closeOnMouseLeave: "boundary" },
4514
+ React__namespace.default.createElement("div", { key: "text", id: captionId, className: captionCx }, props.column.caption)),
4515
+ props.column.isSortable && (!props.column.renderFilter || props.sortDirection) && (React__namespace.default.createElement(uuiComponents.ControlIcon, { key: "sort", cx: uuiCore.cx(css$v.icon, css$v.sortIcon, !props.sortDirection && css$v.sortInActive, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderSortIcon), icon: settings.dataTable.icons.header[props.sortDirection === 'desc' ? 'descSortIcon' : props.sortDirection === 'asc' ? 'ascSortIcon' : 'defaultSortIcon'], onKeyDown: !props.column.renderFilter ? handleSort : undefined, rawProps: { ...captionAriaProps, 'aria-hidden': !!props.column.renderFilter } })),
4516
+ props.isFilterActive && (React__namespace.default.createElement(IconButton, { key: "filter", cx: uuiCore.cx(css$v.icon, !props.sortDirection && css$v.filterIcon, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderFilterIcon), color: "neutral", icon: settings.dataTable.icons.header.filterIcon, rawProps: { 'aria-hidden': true } })),
4517
+ props.column.renderFilter && (React__namespace.default.createElement(uuiComponents.ControlIcon, { key: "dropdown", cx: uuiCore.cx(css$v.icon, css$v.dropdownIcon, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderDropdownIcon), icon: settings.dataTable.icons.header[isDropdownOpen ? 'openedDropdownIcon' : 'dropdownIcon'], onKeyDown: handleFilterOpen, rawProps: captionAriaProps }))));
4518
+ };
4519
+ const renderHeaderCheckbox = () => {
4520
+ if (props.selectAll && props.isFirstColumn) {
4521
+ return (React__namespace.default.createElement(Checkbox, { size: settings.dataTable.sizes.body.checkboxMap[props.size], rawProps: { 'aria-label': 'Select All' }, ...props.selectAll, cx: uuiCore.cx(css$v.checkbox, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCheckbox) }));
4508
4522
  }
4509
- return (React__namespace.createElement(uuiComponents.DataTableHeaderCell, { ...this.props, renderCellContent: this.props.column.renderFilter ? this.renderCellWithFilter : this.renderCellContent }));
4523
+ };
4524
+ const renderFoldAllIcon = () => {
4525
+ if (props.isFirstColumn && props.showFoldAll) {
4526
+ return (React__namespace.default.createElement(Tooltip, { content: props.areAllFolded
4527
+ ? i18n.tables.columnHeader.expandAllTooltip
4528
+ : i18n.tables.columnHeader.collapseAllTooltip },
4529
+ React__namespace.default.createElement(uuiComponents.ControlIcon, { cx: uuiCore.cx(css$v.icon, css$v.foldAllIcon, uuiCore.uuiDataTableHeaderCell.uuiTableHeaderFoldAllIcon), icon: settings.dataTable.icons.header[props.areAllFolded ? 'unfoldIcon' : 'foldIcon'], onClick: props.onFoldAll, rawProps: {
4530
+ 'aria-label': props.areAllFolded ? 'Expand All' : 'Collapse All',
4531
+ 'aria-expanded': !!props.areAllFolded,
4532
+ } })));
4533
+ }
4534
+ };
4535
+ const renderResizingMarker = (contentProps) => {
4536
+ return (React__namespace.default.createElement("div", { role: "separator", onMouseDown: contentProps.onResizeStart, className: uuiCore.cx(css$v.resizingMarker, uuiCore.uuiMarkers.draggable, uuiCore.uuiMarkers.clickable) }));
4537
+ };
4538
+ const getLeftPadding = () => {
4539
+ const { columnsGap, isFirstColumn } = props;
4540
+ if (columnsGap)
4541
+ return isFirstColumn ? `${columnsGap}px` : `${+columnsGap / 2}px`;
4542
+ return `var(--uui-dt-header-cell-padding${isFirstColumn ? '-edge' : ''})`;
4543
+ };
4544
+ const getRightPadding = () => {
4545
+ const { columnsGap, isLastColumn } = props;
4546
+ if (columnsGap)
4547
+ return isLastColumn ? `${columnsGap}px` : `${+columnsGap / 2}px`;
4548
+ return `var(--uui-dt-header-cell-padding${isLastColumn ? '-edge' : ''})`;
4549
+ };
4550
+ const getResizingMarkerWidth = () => {
4551
+ const { columnsGap } = props;
4552
+ return columnsGap ? `${+columnsGap / 2}px` : 'var(--uui-resize-marker-width)';
4553
+ };
4554
+ const renderCellContent = (contentProps, dropdownProps) => {
4555
+ const isResizable = props.column.allowResizing ?? props.allowColumnsResizing;
4556
+ const onClickEvent = !contentProps.isResizing && (!props.column.renderFilter ? contentProps.toggleSort : dropdownProps?.onClick);
4557
+ const computeStyles = {
4558
+ '--uui-dt-header-cell-icon-size': `${settings.dataTable.sizes.header.iconMap[props.size || settings.dataTable.sizes.header.row]}px`,
4559
+ '--uui-dt-header-cell-padding-start': getLeftPadding(),
4560
+ '--uui-dt-header-cell-padding-end': getRightPadding(),
4561
+ '--uui-dt-header-cell-resizing-marker-width': getResizingMarkerWidth(),
4562
+ };
4563
+ return (React__namespace.default.createElement(uuiComponents.DataTableCellContainer, { column: props.column, ref: (ref) => {
4564
+ contentProps.ref(ref);
4565
+ dropdownProps?.ref?.(ref);
4566
+ }, cx: uuiCore.cx(uuiCore.uuiDataTableHeaderCell.uuiTableHeaderCell, (props.column.isSortable || props.isDropdown) && uuiCore.uuiMarkers.clickable, css$v.root, `uui-size-${props.size || settings.dataTable.sizes.header.row}`, props.isFirstColumn && 'uui-dt-header-first-column', props.isLastColumn && 'uui-dt-header-last-column', props.column.fix && css$v['pinned-' + props.column.fix], isResizable && uuiCore.uuiMarkers.resizable, contentProps.isDraggable && css$v.draggable, contentProps.isDragGhost && css$v.ghost, contentProps.isDraggedOut && css$v.isDraggedOut, contentProps.isDndInProgress && css$v['dnd-marker-' + contentProps.position]), onClick: onClickEvent, rawProps: {
4567
+ role: 'columnheader',
4568
+ 'aria-sort': props.sortDirection === 'asc' ? 'ascending' : props.sortDirection ? 'descending' : 'none',
4569
+ ...contentProps.eventHandlers,
4570
+ }, style: computeStyles },
4571
+ renderHeaderCheckbox(),
4572
+ renderFoldAllIcon(),
4573
+ getColumnCaption(contentProps, dropdownProps),
4574
+ isResizable && renderResizingMarker(contentProps)));
4575
+ };
4576
+ const renderCellWithFilter = (contentProps) => (React__namespace.default.createElement(ColumnHeaderDropdown, { isOpen: isDropdownOpen, isSortable: props.column.isSortable, renderTarget: (dropdownProps) => renderCellContent(contentProps, dropdownProps), renderFilter: props.renderFilter, onSort: props.onSort, sortDirection: props.sortDirection, onOpenChange: setIsDropdownOpen, title: props.column.caption }));
4577
+ if (props.column.renderHeaderCell) {
4578
+ return props.column.renderHeaderCell(props);
4510
4579
  }
4580
+ return (React__namespace.default.createElement(uuiComponents.DataTableHeaderCell, { ...props, renderCellContent: props.column.renderFilter ? renderCellWithFilter : renderCellContent }));
4511
4581
  }
4512
4582
 
4513
- var css$u = {"root":"ldCRrm","caption-wrapper":"VLvvJA","captionWrapper":"VLvvJA","align-center":"JMCmnW","alignCenter":"JMCmnW","caption":"Gs68vM","truncate":"_0Ys-Yz","upper-case":"b3VenJ","upperCase":"b3VenJ","group-cell-tooltip":"Dpkedv","groupCellTooltip":"Dpkedv","group-cell-tooltip-wrapper":"cdyOuP","groupCellTooltipWrapper":"cdyOuP","group-cell-tooltip-text":"_68z4kR","groupCellTooltipText":"_68z4kR","tooltip-caption":"yZncE9","tooltipCaption":"yZncE9","tooltip-info":"TBSzrL","tooltipInfo":"TBSzrL"};
4583
+ var css$u = {"root":"_2uQD0I","caption-wrapper":"DCW1wE","captionWrapper":"DCW1wE","align-center":"OOZAi0","alignCenter":"OOZAi0","caption":"RJC3aU","truncate":"Ik27Fy","upper-case":"h7yYCr","upperCase":"h7yYCr","group-cell-tooltip":"Gtpssv","groupCellTooltip":"Gtpssv","group-cell-tooltip-wrapper":"Mx2RxI","groupCellTooltipWrapper":"Mx2RxI","group-cell-tooltip-text":"Rd2QDK","groupCellTooltipText":"Rd2QDK","tooltip-caption":"lj18gK","tooltipCaption":"lj18gK","tooltip-info":"_8tibXu","tooltipInfo":"_8tibXu"};
4514
4584
 
4515
4585
  class DataTableHeaderGroupCell extends React__namespace.Component {
4516
4586
  constructor() {
@@ -4550,7 +4620,7 @@ class DataTableHeaderGroupCell extends React__namespace.Component {
4550
4620
  }
4551
4621
  }
4552
4622
 
4553
- var css$t = {"root":"MXEMfI"};
4623
+ var css$t = {"root":"_5cSIAT"};
4554
4624
 
4555
4625
  const DataTableHeaderRow = /* @__PURE__ */uuiCore.withMods(uuiComponents.DataTableHeaderRow, () => [css$t.root, 'uui-dt-vars'], (mods) => {
4556
4626
  return ({
@@ -4562,6 +4632,20 @@ const DataTableHeaderRow = /* @__PURE__ */uuiCore.withMods(uuiComponents.DataTab
4562
4632
  });
4563
4633
  });
4564
4634
 
4635
+ /**
4636
+ * Checks if the value is a range object with at least one boundary property defined
4637
+ */
4638
+ const isValidRangeValue = (range) => {
4639
+ return range != null && (range.from != null || range.to != null);
4640
+ };
4641
+ const isFilledArray = (arr) => {
4642
+ return Array.isArray(arr) && arr.length > 0;
4643
+ };
4644
+ const hasSomeNullishProp = (obj) => {
4645
+ return Object.keys(obj).some((prop) => obj[prop] == null);
4646
+ };
4647
+ const isValidArrayValue = isFilledArray;
4648
+ const hasSomeNullishPredicate = hasSomeNullishProp;
4565
4649
  const normalizeFilterWithPredicates = (filter) => {
4566
4650
  if (!filter) {
4567
4651
  return {};
@@ -4579,27 +4663,21 @@ const normalizeFilterWithPredicates = (filter) => {
4579
4663
  if ('from' in filterValue && 'to' in filterValue) {
4580
4664
  continue;
4581
4665
  }
4582
- if ('in' in filterValue && (!Array.isArray(filterValue.in) || !filterValue.in.length)) {
4666
+ if ('in' in filterValue && !isValidArrayValue(filterValue.in)) {
4583
4667
  delete filter[key];
4584
4668
  }
4585
- if ('nin' in filterValue && (!Array.isArray(filterValue.nin) || !filterValue.nin.length)) {
4669
+ if ('nin' in filterValue && !isValidArrayValue(filterValue.nin)) {
4586
4670
  delete filter[key];
4587
4671
  }
4588
- if ('inRange' in filterValue) {
4589
- if (!filterValue.inRange || (!filterValue.inRange.from && !filterValue.inRange.to)) {
4590
- delete filter[key];
4591
- }
4672
+ if ('inRange' in filterValue && !isValidRangeValue(filterValue.inRange)) {
4673
+ delete filter[key];
4592
4674
  }
4593
- if ('notInRange' in filterValue) {
4594
- if (!filterValue.notInRange || (!filterValue.notInRange.from && !filterValue.notInRange.to)) {
4595
- delete filter[key];
4596
- }
4675
+ if ('notInRange' in filterValue && !isValidRangeValue(filterValue.notInRange)) {
4676
+ delete filter[key];
4677
+ }
4678
+ if (hasSomeNullishPredicate(filterValue)) {
4679
+ delete filter[key];
4597
4680
  }
4598
- Object.keys(filterValue).forEach((predicate) => {
4599
- if (filterValue[predicate] === null || filterValue[predicate] === undefined) {
4600
- delete filter[key];
4601
- }
4602
- });
4603
4681
  }
4604
4682
  }
4605
4683
  return result;
@@ -4650,7 +4728,7 @@ const UUI_FILTERS_PANEL_ITEM_TOGGLER_SELECTION = 'uui-filters-panel-item-toggler
4650
4728
  const UUI_FILTERS_PANEL_ITEM_TOGGLER_POSTFIX = 'uui-filters-panel-item-toggler-postfix';
4651
4729
  const UUI_FILTERS_PANEL_BODY_FOOTER = 'uui-filters-panel-item-footer';
4652
4730
 
4653
- var css$s = {"body":"hJV7Av","header":"Bsf-i0","title":"JQ3UZf","removeButton":"_55kuB5","with-search":"uPNb0E","withSearch":"uPNb0E"};
4731
+ var css$s = {"body":"Oeq3L5","header":"eMTe8I","title":"q4z-t1","removeButton":"-mPrB9","with-search":"_5ZXgMR","withSearch":"_5ZXgMR"};
4654
4732
 
4655
4733
  function FilterColumnBody(props) {
4656
4734
  const [predicate, setPredicate] = React.useState(getDefaultPredicate(props.predicates, props.value));
@@ -4711,7 +4789,7 @@ const useColumnsWithFilters = (initialColumns, filters) => {
4711
4789
  return columns;
4712
4790
  };
4713
4791
 
4714
- var css$r = {"unpin-icon":"zjpIcN","unpinIcon":"zjpIcN","pin-toggler-icon":"Hm4zy0","pinTogglerIcon":"Hm4zy0"};
4792
+ var css$r = {"unpin-icon":"BnhK--","unpinIcon":"BnhK--","pin-toggler-icon":"d2W-Dd","pinTogglerIcon":"d2W-Dd"};
4715
4793
 
4716
4794
  function PinIconButton(props) {
4717
4795
  const i18nLocal = i18n.tables.columnsConfigurationModal;
@@ -4762,7 +4840,7 @@ function getUnpinIcon(params) {
4762
4840
  }
4763
4841
  }
4764
4842
 
4765
- var css$q = {"row-wrapper":"BpfHqa","rowWrapper":"BpfHqa","pin-icon-button":"sPah20","pinIconButton":"sPah20","not-pinned":"_6I0PKw","notPinned":"_6I0PKw","checkbox":"JUJr-Q","drag-handle":"jFOEbm","dragHandle":"jFOEbm","dnd-disabled":"F9W28O","dndDisabled":"F9W28O"};
4843
+ var css$q = {"row-wrapper":"c9H8oz","rowWrapper":"c9H8oz","pin-icon-button":"yaZ9Zn","pinIconButton":"yaZ9Zn","not-pinned":"hpuUvH","notPinned":"hpuUvH","checkbox":"iJa3dS","drag-handle":"QzxqNA","dragHandle":"QzxqNA","dnd-disabled":"PZUp2w","dndDisabled":"PZUp2w"};
4766
4844
 
4767
4845
  const ColumnRow = /* @__PURE__ */React__namespace.memo(function ColumnRow(props) {
4768
4846
  const { column } = props;
@@ -4796,7 +4874,7 @@ const ColumnRow = /* @__PURE__ */React__namespace.memo(function ColumnRow(props)
4796
4874
  return (React__namespace.createElement(uuiCore.DndActor, { key: column.key, srcData: isDndAllowed && data, dstData: data, canAcceptDrop: onCanAcceptDrop, onDrop: onDrop, render: renderContent }));
4797
4875
  });
4798
4876
 
4799
- var css$p = {"root":"_3o74w8","main-panel":"wKjF9K","mainPanel":"wKjF9K","group":"tkiRP7","group-title":"k79tZk","groupTitle":"k79tZk","group-items":"DGRSsd","groupItems":"DGRSsd","no-data":"yv7Udo","noData":"yv7Udo","no-data-title":"XRblv5","noDataTitle":"XRblv5","no-data-sub-title":"F8TxEL","noDataSubTitle":"F8TxEL","h-divider":"zJYD8d","hDivider":"zJYD8d","search-area":"SqSC-s","searchArea":"SqSC-s","subgroup-accordion":"oN9ika","subgroupAccordion":"oN9ika","subgroup":"jEh7Ao","subgroup-title":"jHaw0V","subgroupTitle":"jHaw0V"};
4877
+ var css$p = {"root":"I8e28f","main-panel":"w7Zcli","mainPanel":"w7Zcli","group":"-JPNp5","group-title":"L-MM9V","groupTitle":"L-MM9V","group-items":"uN10Jg","groupItems":"uN10Jg","no-data":"-l34C5","noData":"-l34C5","no-data-title":"C6xq4x","noDataTitle":"C6xq4x","no-data-sub-title":"mcfBS1","noDataSubTitle":"mcfBS1","h-divider":"_91tlWq","hDivider":"_91tlWq","search-area":"Mm3qTT","searchArea":"Mm3qTT","subgroup-accordion":"AALvgz","subgroupAccordion":"AALvgz","subgroup":"vsKUIZ","subgroup-title":"FiM4NP","subgroupTitle":"FiM4NP"};
4800
4878
 
4801
4879
  const renderGroupTitle = (title, amount) => (React__namespace.createElement(FlexRow, { cx: css$p.group },
4802
4880
  React__namespace.createElement(Text, { size: "none", cx: css$p.groupTitle }, title),
@@ -4899,7 +4977,7 @@ const getChildrenAndRest = (row, rows) => {
4899
4977
  return [children, rest];
4900
4978
  };
4901
4979
 
4902
- var css$o = {"listContainer":"m0mjZ6","header":"HUDNFM","group":"ShPCEZ","stickyHeader":"_0K0By-"};
4980
+ var css$o = {"listContainer":"-gBDgo","header":"uPVX4r","group":"Nlg0US","stickyHeader":"P-aC-C"};
4903
4981
 
4904
4982
  function DataRowsGroup({ row, childRows, renderRow, top = 1, }) {
4905
4983
  const rowRef = React.useRef(undefined);
@@ -4939,7 +5017,7 @@ function DataRowsContainer({ estimatedHeight, listContainerRef, offsetY, rows, r
4939
5017
  React__namespace.default.createElement(DataRowsGroups, { rows: rows, renderRow: renderRow, top: headerRef?.current?.clientHeight }))));
4940
5018
  }
4941
5019
 
4942
- var css$n = {"root":"D4yDhP","sticky-header":"ZG49tM","stickyHeader":"ZG49tM","no-results":"CkMZyb","noResults":"CkMZyb","icon":"TvyS5a","title":"_7GBkj2"};
5020
+ var css$n = {"root":"Rt6x9-","sticky-header":"qKF0-g","stickyHeader":"qKF0-g","no-results":"fSp-H-","noResults":"fSp-H-","icon":"EpGowY","title":"ImAAqn"};
4943
5021
 
4944
5022
  function DataTable(props) {
4945
5023
  const { uuiModals } = uuiCore.useUuiContext();
@@ -4981,6 +5059,7 @@ function DataTable(props) {
4981
5059
  role: 'table',
4982
5060
  'aria-colcount': columns.length,
4983
5061
  'aria-rowcount': props.rowsCount,
5062
+ ...props.rawProps,
4984
5063
  };
4985
5064
  return (React__namespace.createElement(uuiComponents.DataTableSelectionProvider, { onCopy: props.onCopy, rows: rows, columns: columns },
4986
5065
  React__namespace.createElement(uuiComponents.DataTableFocusProvider, { dataTableFocusManager: props.dataTableFocusManager }, props.disableVirtualization === true
@@ -4988,7 +5067,7 @@ function DataTable(props) {
4988
5067
  : (React__namespace.createElement(VirtualList, { value: props.value, onValueChange: props.onValueChange, onScroll: props.onScroll, rowsCount: props.rowsCount, renderRows: renderTableBody, cx: classes, isLoading: props.isReloading, rowsSelector: "[role=row]", rawProps: rawProps })))));
4989
5068
  }
4990
5069
 
4991
- var css$m = {"root":"ziQWZ9","title-wrapper":"BqFAg6","titleWrapper":"BqFAg6","title":"Mh-jwA","text-wrapper":"MJdOLd","textWrapper":"MJdOLd","selection":"IcVvsm","postfix":"SHvUrH","selected":"hvJnhD"};
5070
+ var css$m = {"root":"bEq-Qb","title-wrapper":"iUPJXI","titleWrapper":"iUPJXI","title":"h6zCAh","text-wrapper":"AAQtxj","textWrapper":"AAQtxj","selection":"v2oaFP","postfix":"_5Ql-LF","selected":"O-rh-V"};
4992
5071
 
4993
5072
  const FilterPanelItemToggler = /* @__PURE__ */React__namespace.forwardRef((props, ref) => {
4994
5073
  const togglerPickerOpened = (e) => {
@@ -5213,9 +5292,10 @@ function FilterRangeDatePickerBody(props) {
5213
5292
  renderFooter()));
5214
5293
  }
5215
5294
 
5216
- var css$l = {"container":"UrxYgl"};
5295
+ var css$l = {"container":"xeqrCL"};
5217
5296
 
5218
- function FilterNumericBody(props) {
5297
+ function FilterNumericBody({ min, max, step, ...props }) {
5298
+ const numericInputProps = { min, max, step };
5219
5299
  const isInRangePredicate = props?.selectedPredicate === 'inRange' || props?.selectedPredicate === 'notInRange';
5220
5300
  const isWrongRange = (from, to) => {
5221
5301
  if (!to && to !== 0)
@@ -5264,15 +5344,15 @@ function FilterNumericBody(props) {
5264
5344
  return (React__namespace.default.createElement("div", null,
5265
5345
  React__namespace.default.createElement(FlexRow, { padding: "12", alignItems: "center", columnGap: "12", borderBottom: true, cx: css$l.container },
5266
5346
  React__namespace.default.createElement(FlexCell, { width: "100%" },
5267
- React__namespace.default.createElement(NumericInput, { size: settings.filtersPanel.sizes.default, value: value?.from ?? null, onValueChange: rangeValueHandler('from'), placeholder: "Min", formatOptions: { maximumFractionDigits: 2 } })),
5347
+ React__namespace.default.createElement(NumericInput, { size: settings.filtersPanel.sizes.default, value: value?.from ?? null, onValueChange: rangeValueHandler('from'), placeholder: "Min", formatOptions: { maximumFractionDigits: 2 }, ...numericInputProps })),
5268
5348
  React__namespace.default.createElement(FlexCell, { width: "100%" },
5269
- React__namespace.default.createElement(NumericInput, { size: settings.filtersPanel.sizes.default, value: value?.to ?? null, onValueChange: rangeValueHandler('to'), placeholder: "Max", formatOptions: { maximumFractionDigits: 2 }, isInvalid: isWrongRange(value?.from, value?.to) }))),
5349
+ React__namespace.default.createElement(NumericInput, { size: settings.filtersPanel.sizes.default, value: value?.to ?? null, onValueChange: rangeValueHandler('to'), placeholder: "Max", formatOptions: { maximumFractionDigits: 2 }, isInvalid: isWrongRange(value?.from, value?.to), ...numericInputProps }))),
5270
5350
  renderFooter()));
5271
5351
  }
5272
5352
  return (React__namespace.default.createElement("div", null,
5273
5353
  React__namespace.default.createElement(FlexRow, { padding: "12", alignItems: "center", borderBottom: true, cx: css$l.container },
5274
5354
  React__namespace.default.createElement(FlexCell, { width: 130 },
5275
- React__namespace.default.createElement(NumericInput, { size: settings.filtersPanel.sizes.default, value: typeof props.value === 'number' ? props.value : null, onValueChange: props.onValueChange, placeholder: "Enter a number", formatOptions: { maximumFractionDigits: 2 } }))),
5355
+ React__namespace.default.createElement(NumericInput, { size: settings.filtersPanel.sizes.default, value: typeof props.value === 'number' ? props.value : null, onValueChange: props.onValueChange, placeholder: "Enter a number", formatOptions: { maximumFractionDigits: 2 }, ...numericInputProps }))),
5276
5356
  renderFooter()));
5277
5357
  }
5278
5358
 
@@ -5351,9 +5431,9 @@ function FiltersToolbarItemImpl(props) {
5351
5431
  props.predicates ? (React__namespace.default.createElement(FilterPredicatePanel, { predicates: props.predicates, predicate: predicate, type: props.type, onValueChange: props.onValueChange, value: props.value, setPredicate: setPredicate })) : (!hideTitle && (React__namespace.default.createElement("div", { className: css$s.title }, props.title))),
5352
5432
  !props?.isAlwaysVisible && (React__namespace.default.createElement(LinkButton, { cx: css$s.removeButton, caption: i18n.filterToolbar.datePicker.removeCaption, onClick: removeOnclickHandler, size: settings.filtersPanel.sizes.pickerBodyLinkButton, icon: settings.filtersPanel.icons.pickerBodyRemoveIcon }))));
5353
5433
  const renderBody = (dropdownProps) => {
5354
- return isPickersType ? (React__namespace.default.createElement(PickerBodyMobileView, { ...dropdownProps, rawProps: { ...dropdownProps.arrowProps, 'aria-modal': true }, cx: [css$s.body, UUI_FILTERS_PANEL_ITEM_BODY], title: props.title, width: settings.filtersPanel.sizes.pickerBodyMinWidth, onClose: () => isOpenChange(false) },
5434
+ return isPickersType ? (React__namespace.default.createElement(PickerBodyMobileView, { ...dropdownProps, rawProps: { 'aria-modal': true }, cx: [css$s.body, UUI_FILTERS_PANEL_ITEM_BODY], title: props.title, width: settings.filtersPanel.sizes.pickerBodyMinWidth, onClose: () => isOpenChange(false) },
5355
5435
  renderHeader(hideHeaderTitle),
5356
- React__namespace.default.createElement(FilterItemBody, { ...props, ...dropdownProps, selectedPredicate: predicate, value: getValue(predicate, props.value), onValueChange: onValueChange }))) : (React__namespace.default.createElement(DropdownContainer, { cx: [css$s.body, UUI_FILTERS_PANEL_ITEM_BODY], ...dropdownProps, rawProps: { ...dropdownProps.arrowProps, 'aria-modal': true } },
5436
+ React__namespace.default.createElement(FilterItemBody, { ...props, ...dropdownProps, selectedPredicate: predicate, value: getValue(predicate, props.value), onValueChange: onValueChange }))) : (React__namespace.default.createElement(DropdownContainer, { cx: [css$s.body, UUI_FILTERS_PANEL_ITEM_BODY], ...dropdownProps, rawProps: { 'aria-modal': true } },
5357
5437
  renderHeader(hideHeaderTitle),
5358
5438
  React__namespace.default.createElement(FilterItemBody, { ...props, ...dropdownProps, selectedPredicate: predicate, value: getValue(predicate, props.value), onValueChange: onValueChange })));
5359
5439
  };
@@ -5524,7 +5604,7 @@ function FiltersToolbarImpl(props) {
5524
5604
  }
5525
5605
  const FiltersPanel = /* @__PURE__ */React__namespace.default.memo(FiltersToolbarImpl);
5526
5606
 
5527
- var css$k = {"delete-button":"PIqhJl","deleteButton":"PIqhJl","tab-button":"ifUJRi","tabButton":"ifUJRi","targetOpen":"tvmfFZ"};
5607
+ var css$k = {"delete-button":"frGXqP","deleteButton":"frGXqP","tab-button":"_5COuq7","tabButton":"_5COuq7","targetOpen":"zE5K4c"};
5528
5608
 
5529
5609
  function PresetActionsDropdown(props) {
5530
5610
  const { uuiNotifications } = uuiCore.useUuiContext();
@@ -5600,7 +5680,7 @@ const UUI_PRESETS_PANEL_MORE_BUTTON = 'uui-presets-panel-more-button';
5600
5680
  const UUI_PRESETS_PANEL_INPUT = 'uui-presets-panel-input';
5601
5681
  const UUI_PRESETS_PANEL_PRESET = 'uui-presets-panel-preset';
5602
5682
 
5603
- var css$j = {"preset-input-cell":"_7LiJBJ","presetInputCell":"_7LiJBJ","preset-input":"zWZL0y","presetInput":"zWZL0y"};
5683
+ var css$j = {"preset-input-cell":"CX--BX","presetInputCell":"CX--BX","preset-input":"Pc-ija","presetInput":"Pc-ija"};
5604
5684
 
5605
5685
  function PresetInput(props) {
5606
5686
  const [presetCaption, setPresetCaption] = React.useState(props.preset?.name || '');
@@ -5627,7 +5707,7 @@ function PresetInput(props) {
5627
5707
  React__namespace.default.createElement(TextInput, { cx: css$j.presetInput, onValueChange: setPresetCaption, value: presetCaption, onCancel: cancelActionHandler, onAccept: acceptActionHandler, onBlur: newPresetOnBlurHandler, autoFocus: true, maxLength: 50, isReadonly: readonly })));
5628
5708
  }
5629
5709
 
5630
- var css$i = {"preset":"B5tRsk","activePreset":"xvxfJk"};
5710
+ var css$i = {"preset":"_7-CwRy","activePreset":"I-Hd6X"};
5631
5711
 
5632
5712
  function Preset(props) {
5633
5713
  const [isRenamePreset, setIsRenamePreset] = React.useState(false);
@@ -5652,7 +5732,7 @@ function Preset(props) {
5652
5732
  return (React__namespace.default.createElement(FlexCell, { key: props.preset.id, alignSelf: "center", width: "auto" }, isRenamePreset ? (React__namespace.default.createElement(PresetInput, { onCancel: cancelRenamePreset, onSuccess: handlePresetRename, preset: props.preset })) : (React__namespace.default.createElement(TabButton, { caption: props.preset.name, onClick: !isPresetActive && choosePresetHandler, cx: [css$i.preset, isPresetActive && css$i.activePreset, UUI_PRESETS_PANEL_PRESET], size: settings.presetsPanel.sizes.tabButton, withNotify: isPresetActive && props.hasPresetChanged(props.preset), icon: PresetActionsDropdownComponent, iconPosition: "right", isActive: isPresetActive }))));
5653
5733
  }
5654
5734
 
5655
- var css$h = {"divider":"ykJF2A","dropdownDeleteIcon":"_8MYSu-","presetsWrapper":"_4SR-mK","addPresetContainer":"_7fxQxH","dropContainer":"YWqtWe"};
5735
+ var css$h = {"divider":"eB2z47","dropdownDeleteIcon":"_8t-mZX","presetsWrapper":"xc27q1","addPresetContainer":"wrmFxW","dropContainer":"iqVuNd"};
5656
5736
 
5657
5737
  function PresetsPanel(props) {
5658
5738
  const [isAddingPreset, setIsAddingPreset] = React.useState(false);
@@ -5701,9 +5781,9 @@ function PresetsPanel(props) {
5701
5781
  React__namespace.default.createElement(uuiComponents.AdaptivePanel, { items: getPanelItems() }))));
5702
5782
  }
5703
5783
 
5704
- var css$g = {"root":"N5dccP"};
5784
+ var css$g = {"root":"LJp6vz"};
5705
5785
 
5706
- var css$f = {"root":"ZsbsVl","burger-content":"R0uvXx","burgerContent":"R0uvXx"};
5786
+ var css$f = {"root":"_6gLsRs","burger-content":"rkuFY6","burgerContent":"rkuFY6"};
5707
5787
 
5708
5788
  var _path$3;
5709
5789
  function _extends$3() { return _extends$3 = 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$3.apply(null, arguments); }
@@ -5746,7 +5826,7 @@ var SvgNavigationArrowDownOutline = function SvgNavigationArrowDownOutline(props
5746
5826
  };
5747
5827
  var ForwardRef$2 = /*#__PURE__*/React.forwardRef(SvgNavigationArrowDownOutline);
5748
5828
 
5749
- var css$e = {"root":"F6m8xD","button-primary":"ZOdCEL","buttonPrimary":"ZOdCEL","button-secondary":"_4qZv9-","buttonSecondary":"_4qZv9-","hasIcon":"h0Cxtm","dropdown":"fCSs75"};
5829
+ var css$e = {"root":"OZQczq","button-primary":"wx8yiu","buttonPrimary":"wx8yiu","button-secondary":"gy-75D","buttonSecondary":"gy-75D","hasIcon":"QjBofk","dropdown":"qLwDDX"};
5750
5830
 
5751
5831
  function applyBurgerButtonMods(props) {
5752
5832
  return [
@@ -5771,13 +5851,13 @@ const BurgerButton = /* @__PURE__ */React__namespace.default.forwardRef((props,
5771
5851
  }, dropdownIcon: ForwardRef$2 }));
5772
5852
  });
5773
5853
 
5774
- var css$d = {"search-input":"JJCAdZ","searchInput":"JJCAdZ"};
5854
+ var css$d = {"search-input":"gQLAWs","searchInput":"gQLAWs"};
5775
5855
 
5776
5856
  function BurgerSearch(props) {
5777
5857
  return (React__namespace.createElement(uuiComponents.TextInput, { cx: cx__default.default(css$d.searchInput, 'uui-main_menu-burger-search'), iconPosition: "left", icon: ForwardRef$M, placeholder: props.placeholder, value: props.value, onValueChange: props.onValueChange, onCancel: props.onCancel, cancelIcon: props.value && ForwardRef$Q }));
5778
5858
  }
5779
5859
 
5780
- var css$c = {"root":"EMudHy","group-header":"nu5Js0","groupHeader":"nu5Js0","group-name":"uERjYv","groupName":"uERjYv","line":"XZ86-f"};
5860
+ var css$c = {"root":"w-S8L1","group-header":"YGKwqA","groupHeader":"YGKwqA","group-name":"mbcwfp","groupName":"mbcwfp","line":"YjM1L5"};
5781
5861
 
5782
5862
  function BurgerGroupHeader(props) {
5783
5863
  return (React__namespace.createElement("div", { className: cx__default.default(css$c.root, css$c.groupHeader, 'uui-burger-group-header') },
@@ -5785,7 +5865,7 @@ function BurgerGroupHeader(props) {
5785
5865
  React__namespace.createElement("span", { className: css$c.groupName }, props.caption)));
5786
5866
  }
5787
5867
 
5788
- var css$b = {"root":"AV361g","type-primary":"LF75wV","typePrimary":"LF75wV","type-secondary":"K3lGww","typeSecondary":"K3lGww"};
5868
+ var css$b = {"root":"C1udgy","type-primary":"LMLYUT","typePrimary":"LMLYUT","type-secondary":"_1NwAKU","typeSecondary":"_1NwAKU"};
5789
5869
 
5790
5870
  const MainMenuButton = /* @__PURE__ */React__namespace.forwardRef((props, ref) => {
5791
5871
  const { type, ...clickableProps } = props;
@@ -5813,7 +5893,7 @@ const MainMenuButton = /* @__PURE__ */React__namespace.forwardRef((props, ref) =
5813
5893
  props.isDropdown && (React__namespace.createElement(uuiComponents.IconContainer, { icon: ForwardRef$P, flipY: props.isOpen }))));
5814
5894
  });
5815
5895
 
5816
- var css$a = {"dropdown-body":"_243Ac5","dropdownBody":"_243Ac5"};
5896
+ var css$a = {"dropdown-body":"PB-SfU","dropdownBody":"PB-SfU"};
5817
5897
 
5818
5898
  function MainMenuDropdown(props) {
5819
5899
  const handleEscape = (e, onClose, isOpen) => {
@@ -5859,12 +5939,12 @@ var SvgNavigationGlobalMenuOutlineOutline = function SvgNavigationGlobalMenuOutl
5859
5939
  };
5860
5940
  var ForwardRef$1 = /*#__PURE__*/React.forwardRef(SvgNavigationGlobalMenuOutlineOutline);
5861
5941
 
5862
- var css$9 = {"global-menu-btn":"Burn52","globalMenuBtn":"Burn52","global-menu-icon":"IAqwXr","globalMenuIcon":"IAqwXr"};
5942
+ var css$9 = {"global-menu-btn":"A39zfo","globalMenuBtn":"A39zfo","global-menu-icon":"iMqHXL","globalMenuIcon":"iMqHXL"};
5863
5943
 
5864
5944
  const GlobalMenu = /* @__PURE__ */React__namespace.forwardRef((props, ref) => (React__namespace.createElement("button", { ref: ref, id: "global_menu_toggle", className: cx__default.default(css$9.globalMenuBtn, props.cx), ...props.rawProps },
5865
5945
  React__namespace.createElement(uuiComponents.IconContainer, { size: 36, icon: ForwardRef$1, cx: css$9.globalMenuIcon }))));
5866
5946
 
5867
- var css$8 = {"container":"iy5whG","open":"VUDSkM","folding-arrow":"_2SBx7F","foldingArrow":"_2SBx7F"};
5947
+ var css$8 = {"container":"Vfxej-","open":"_6xCWfp","folding-arrow":"Vw00hX","foldingArrow":"Vw00hX"};
5868
5948
 
5869
5949
  const MainMenuAvatar = /* @__PURE__ */React__namespace.forwardRef((props, ref) => (React__namespace.createElement("button", { ref: ref, className: cx__default.default(css$8.container, props.isDropdown && css$8.dropdown, props.isOpen && css$8.open, props.onClick && uuiCore.uuiMarkers.clickable, props.cx), onClick: props.onClick, ...props.rawProps },
5870
5950
  React__namespace.createElement(uuiComponents.Avatar, { size: "36", img: props.avatarUrl }),
@@ -5872,15 +5952,15 @@ const MainMenuAvatar = /* @__PURE__ */React__namespace.forwardRef((props, ref) =
5872
5952
  props.isDropdown && (React__namespace.createElement("div", null,
5873
5953
  React__namespace.createElement(uuiComponents.IconContainer, { size: 18, icon: ForwardRef$P, flipY: props.isOpen, cx: css$8.foldingArrow }))))));
5874
5954
 
5875
- var css$7 = {"search-input":"Uu9zeo","searchInput":"Uu9zeo"};
5955
+ var css$7 = {"search-input":"_67jSLc","searchInput":"_67jSLc"};
5876
5956
 
5877
5957
  const MainMenuSearch = /* @__PURE__ */React__namespace.forwardRef((props, ref) => (React__namespace.createElement(uuiCore.IEditableDebouncer, { ...props, render: (iEditable) => (React__namespace.createElement(uuiComponents.TextInput, { iconPosition: "left", icon: ForwardRef$M, cancelIcon: props.value?.length > 0 && ForwardRef$Q, ...props, ...iEditable, ref: ref, cx: uuiCore.cx(css$7.searchInput, props.cx), ...props.rawProps })) })));
5878
5958
 
5879
- var css$6 = {"container":"-ZN7sD"};
5959
+ var css$6 = {"container":"CuJETf"};
5880
5960
 
5881
5961
  const MainMenuIcon = /* @__PURE__ */React__namespace.forwardRef((props, ref) => (React__namespace.createElement(IconButton, { ref: ref, icon: props.icon, cx: uuiCore.cx(props.cx, css$6.container), ...props })));
5882
5962
 
5883
- var css$5 = {"root":"_1QDE4-"};
5963
+ var css$5 = {"root":"b0P50j"};
5884
5964
 
5885
5965
  const Anchor = /* @__PURE__ */uuiCore.withMods(uuiComponents.Anchor, () => [css$5.root]);
5886
5966
 
@@ -5938,7 +6018,7 @@ var SvgFileCloudUploadFill = function SvgFileCloudUploadFill(props, ref) {
5938
6018
  };
5939
6019
  var ForwardRef = /*#__PURE__*/React.forwardRef(SvgFileCloudUploadFill);
5940
6020
 
5941
- var css$4 = {"root":"A-Muqt","drop-start":"RrP3N2","dropStart":"RrP3N2","drop-over":"LXa2lh","dropOver":"LXa2lh","link":"dUNgjr","drop-area":"T-W1s5","dropArea":"T-W1s5","drop-caption":"hj9LDg","dropCaption":"hj9LDg","icon-blue":"PgO6qQ","iconBlue":"PgO6qQ"};
6021
+ var css$4 = {"root":"s2hV5Q","drop-start":"B8kpCs","dropStart":"B8kpCs","drop-over":"MXcGrP","dropOver":"MXcGrP","link":"_1RYnw-","drop-area":"jz8iwH","dropArea":"jz8iwH","drop-caption":"_1IWZzH","dropCaption":"_1IWZzH","icon-blue":"rnKR0s","iconBlue":"rnKR0s"};
5942
6022
 
5943
6023
  function DropSpot(props) {
5944
6024
  const getInfoText = typeof props.infoText === 'string'
@@ -5956,7 +6036,7 @@ function DropSpot(props) {
5956
6036
  return React__namespace.createElement(uuiComponents.DropSpot, { render: renderAttachmentArea, onFilesDropped: props.onUploadFiles });
5957
6037
  }
5958
6038
 
5959
- var css$3 = {"root":"q4Jmgj"};
6039
+ var css$3 = {"root":"nksM9G"};
5960
6040
 
5961
6041
  const SvgCircleProgress = /* @__PURE__ */React__namespace.forwardRef((props, ref) => {
5962
6042
  const outsetRadius = props.size / 2 - 1;
@@ -5967,7 +6047,7 @@ const SvgCircleProgress = /* @__PURE__ */React__namespace.forwardRef((props, ref
5967
6047
  React__namespace.createElement("circle", { strokeWidth: 1, fill: "transparent", r: outsetRadius, cx: props.size / 2, cy: props.size / 2 })));
5968
6048
  });
5969
6049
 
5970
- var css$2 = {"root":"nzEzgt","file-name":"LZ4Va8","fileName":"LZ4Va8","default-color":"ZrSeeV","defaultColor":"ZrSeeV","doc-color":"jMf4SE","docColor":"jMf4SE","xls-color":"ZSNzXO","xlsColor":"ZSNzXO","pdf-color":"Dw0ZHV","pdfColor":"Dw0ZHV","movie-color":"_0-NDhd","movieColor":"_0-NDhd","img-color":"Kb2jDC","imgColor":"Kb2jDC","mov-color":"zaIixU","movColor":"zaIixU","error-block":"sTLkU3","errorBlock":"sTLkU3","icons-block":"gybRn-","iconsBlock":"gybRn-"};
6050
+ var css$2 = {"root":"vLjTKy","file-name":"_6HkxLE","fileName":"_6HkxLE","default-color":"_2IV72d","defaultColor":"_2IV72d","doc-color":"jEY6Ye","docColor":"jEY6Ye","xls-color":"PNefNe","xlsColor":"PNefNe","pdf-color":"_-1OcsO","pdfColor":"_-1OcsO","movie-color":"CFmzjL","movieColor":"CFmzjL","img-color":"s7NiFu","imgColor":"s7NiFu","mov-color":"ZfaPOA","movColor":"ZfaPOA","error-block":"YS16lt","errorBlock":"YS16lt","icons-block":"sJWOvu","iconsBlock":"sJWOvu"};
5971
6051
 
5972
6052
  const FileCard = /* @__PURE__ */React__namespace.forwardRef((props, ref) => {
5973
6053
  const [isLoadingShow, setIsLoadingShow] = React__namespace.useState(true);
@@ -6087,7 +6167,7 @@ const getErrorPageConfig = () => ({
6087
6167
  },
6088
6168
  });
6089
6169
 
6090
- var css$1 = {"container":"qzBFgp"};
6170
+ var css$1 = {"container":"p7VA34"};
6091
6171
 
6092
6172
  const ErrorPage = (props) => {
6093
6173
  const isMobileScreen = uuiCore.isMobile();
@@ -6099,7 +6179,7 @@ const ErrorPage = (props) => {
6099
6179
  props?.supportLink && React__namespace.default.createElement("div", { className: "uui-error-support-link" }, props?.supportLink))));
6100
6180
  };
6101
6181
 
6102
- var css = {"recovery-spinner":"_6teYUO","recoverySpinner":"_6teYUO","recovery-message":"ton-8f","recoveryMessage":"ton-8f","modal-blocker":"f3NULg","modalBlocker":"f3NULg","modalFadeIn":"XN-DN3"};
6182
+ var css = {"recovery-spinner":"qpWq9b","recoverySpinner":"qpWq9b","recovery-message":"_8tB95V","recoveryMessage":"_8tB95V","modal-blocker":"DWNCZ1","modalBlocker":"DWNCZ1","modalFadeIn":"-rCBak"};
6103
6183
 
6104
6184
  function ErrorHandler(props) {
6105
6185
  const { uuiNotifications, uuiModals, uuiApi } = uuiCore.useUuiContext();