@epam/uui 5.13.2-rc.0 → 5.13.2

package/index.esm.js

@@ -63,7 +63,7 @@ var ForwardRef$P = /*#__PURE__*/forwardRef(SvgNotificationDoneOutline);
 
 var _path$O;
 function _extends$O() { return _extends$O = 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$O.apply(null, arguments); }
-var SvgContentMinusOutline = function SvgContentMinusOutline(props, ref) {
+var SvgActionSearchOutline = function SvgActionSearchOutline(props, ref) {
   return /*#__PURE__*/React.createElement("svg", _extends$O({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -71,14 +71,16 @@ var SvgContentMinusOutline = function SvgContentMinusOutline(props, ref) {
     viewBox: "0 0 24 24",
     ref: ref
   }, props), _path$O || (_path$O = /*#__PURE__*/React.createElement("path", {
-    d: "M19 10.5H5v3h14v-3z"
+    fillRule: "evenodd",
+    d: "M17.32 15.906 21.414 20 20 21.414l-4.094-4.094a8 8 0 1 1 1.414-1.414zM11 17a6 6 0 1 0 0-12 6 6 0 0 0 0 12z",
+    clipRule: "evenodd"
   })));
 };
-var ForwardRef$O = /*#__PURE__*/forwardRef(SvgContentMinusOutline);
+var ForwardRef$O = /*#__PURE__*/forwardRef(SvgActionSearchOutline);
 
 var _path$N;
 function _extends$N() { return _extends$N = 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$N.apply(null, arguments); }
-var SvgActionSearchOutline = function SvgActionSearchOutline(props, ref) {
+var SvgActionCalendarFill = function SvgActionCalendarFill(props, ref) {
   return /*#__PURE__*/React.createElement("svg", _extends$N({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -86,16 +88,14 @@ var SvgActionSearchOutline = function SvgActionSearchOutline(props, ref) {
     viewBox: "0 0 24 24",
     ref: ref
   }, props), _path$N || (_path$N = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M17.32 15.906 21.414 20 20 21.414l-4.094-4.094a8 8 0 1 1 1.414-1.414zM11 17a6 6 0 1 0 0-12 6 6 0 0 0 0 12z",
-    clipRule: "evenodd"
+    d: "M5 22a1.93 1.93 0 0 1-1.413-.587A1.928 1.928 0 0 1 3 20V6c0-.55.196-1.02.587-1.412A1.927 1.927 0 0 1 5 4h1V2h2v2h8V2h2v2h1c.55 0 1.021.196 1.413.588.391.391.587.862.587 1.412v14a1.93 1.93 0 0 1-.587 1.413A1.928 1.928 0 0 1 19 22H5zm0-2h14V10H5v10z"
   })));
 };
-var ForwardRef$N = /*#__PURE__*/forwardRef(SvgActionSearchOutline);
+var ForwardRef$N = /*#__PURE__*/forwardRef(SvgActionCalendarFill);
 
 var _path$M;
 function _extends$M() { return _extends$M = 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$M.apply(null, arguments); }
-var SvgActionCalendarFill = function SvgActionCalendarFill(props, ref) {
+var SvgNotificationInfoOutline = function SvgNotificationInfoOutline(props, ref) {
   return /*#__PURE__*/React.createElement("svg", _extends$M({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -103,14 +103,14 @@ var SvgActionCalendarFill = function SvgActionCalendarFill(props, ref) {
     viewBox: "0 0 24 24",
     ref: ref
   }, props), _path$M || (_path$M = /*#__PURE__*/React.createElement("path", {
-    d: "M5 22a1.93 1.93 0 0 1-1.413-.587A1.928 1.928 0 0 1 3 20V6c0-.55.196-1.02.587-1.412A1.927 1.927 0 0 1 5 4h1V2h2v2h8V2h2v2h1c.55 0 1.021.196 1.413.588.391.391.587.862.587 1.412v14a1.93 1.93 0 0 1-.587 1.413A1.928 1.928 0 0 1 19 22H5zm0-2h14V10H5v10z"
+    d: "M11 17h2v-6h-2v6zm1-8a.968.968 0 0 0 .713-.288A.967.967 0 0 0 13 8a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 7a.967.967 0 0 0-.712.287A.968.968 0 0 0 11 8c0 .283.096.52.288.712A.965.965 0 0 0 12 9zm0 13a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22zm0-2c2.233 0 4.125-.775 5.675-2.325C19.225 16.125 20 14.233 20 12c0-2.233-.775-4.125-2.325-5.675C16.125 4.775 14.233 4 12 4c-2.233 0-4.125.775-5.675 2.325C4.775 7.875 4 9.767 4 12c0 2.233.775 4.125 2.325 5.675C7.875 19.225 9.767 20 12 20z"
   })));
 };
-var ForwardRef$M = /*#__PURE__*/forwardRef(SvgActionCalendarFill);
+var ForwardRef$M = /*#__PURE__*/forwardRef(SvgNotificationInfoOutline);
 
 var _path$L;
 function _extends$L() { return _extends$L = 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$L.apply(null, arguments); }
-var SvgNotificationInfoOutline = function SvgNotificationInfoOutline(props, ref) {
+var SvgFileFileWordFill = function SvgFileFileWordFill(props, ref) {
   return /*#__PURE__*/React.createElement("svg", _extends$L({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -118,14 +118,16 @@ var SvgNotificationInfoOutline = function SvgNotificationInfoOutline(props, ref)
     viewBox: "0 0 24 24",
     ref: ref
   }, props), _path$L || (_path$L = /*#__PURE__*/React.createElement("path", {
-    d: "M11 17h2v-6h-2v6zm1-8a.968.968 0 0 0 .713-.288A.967.967 0 0 0 13 8a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 7a.967.967 0 0 0-.712.287A.968.968 0 0 0 11 8c0 .283.096.52.288.712A.965.965 0 0 0 12 9zm0 13a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22zm0-2c2.233 0 4.125-.775 5.675-2.325C19.225 16.125 20 14.233 20 12c0-2.233-.775-4.125-2.325-5.675C16.125 4.775 14.233 4 12 4c-2.233 0-4.125.775-5.675 2.325C4.775 7.875 4 9.767 4 12c0 2.233.775 4.125 2.325 5.675C7.875 19.225 9.767 20 12 20z"
+    fillRule: "evenodd",
+    d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm1.2 18h-1.4L12 13.2 10.2 20H8.8l-2.2-9h1.5l1.4 6.8 1.8-6.8h1.3l1.8 6.8 1.4-6.8h1.5l-2.1 9zM13 9V3.5L18.5 9H13z",
+    clipRule: "evenodd"
   })));
 };
-var ForwardRef$L = /*#__PURE__*/forwardRef(SvgNotificationInfoOutline);
+var ForwardRef$L = /*#__PURE__*/forwardRef(SvgFileFileWordFill);
 
 var _path$K;
 function _extends$K() { return _extends$K = 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$K.apply(null, arguments); }
-var SvgNotificationInfoFill = function SvgNotificationInfoFill(props, ref) {
+var SvgFileFileExcelFill = function SvgFileFileExcelFill(props, ref) {
   return /*#__PURE__*/React.createElement("svg", _extends$K({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -133,154 +135,33 @@ var SvgNotificationInfoFill = function SvgNotificationInfoFill(props, ref) {
     viewBox: "0 0 24 24",
     ref: ref
   }, props), _path$K || (_path$K = /*#__PURE__*/React.createElement("path", {
-    d: "M11 17h2v-6h-2v6zm1-8a.968.968 0 0 0 .713-.288A.967.967 0 0 0 13 8a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 7a.967.967 0 0 0-.712.287A.968.968 0 0 0 11 8c0 .283.096.52.288.712A.965.965 0 0 0 12 9zm0 13a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22z"
+    fillRule: "evenodd",
+    d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm1.8 18H14l-2-3.4-2 3.4H8.2l2.9-4.5L8.2 11H10l2 3.4 2-3.4h1.8l-2.9 4.5 2.9 4.5zM13 9V3.5L18.5 9H13z",
+    clipRule: "evenodd"
   })));
 };
-var ForwardRef$K = /*#__PURE__*/forwardRef(SvgNotificationInfoFill);
+var ForwardRef$K = /*#__PURE__*/forwardRef(SvgFileFileExcelFill);
 
-var _path$J, _path2$5, _path3, _path4, _path5, _path6, _g, _path7, _path8, _path9, _path10, _path11, _path12, _path13, _path14, _path15, _path16, _path17, _path18, _path19, _path20, _path21, _path22, _path23, _path24, _defs;
+var _path$J;
 function _extends$J() { return _extends$J = 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$J.apply(null, arguments); }
-var SvgEmptyTable = function SvgEmptyTable(props, ref) {
+var SvgFileFilePdfFill = function SvgFileFilePdfFill(props, ref) {
   return /*#__PURE__*/React.createElement("svg", _extends$J({
-    width: 232,
-    height: 180,
-    viewBox: "0 0 232 180",
-    fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
     ref: ref
-  }, props), /*#__PURE__*/React.createElement("g", {
-    clipPath: "url(#bx7xymqaor0hb2xlf_a)"
-  }, _path$J || (_path$J = /*#__PURE__*/React.createElement("path", {
-    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",
-    fill: "#F5F6FA"
-  })), _path2$5 || (_path2$5 = /*#__PURE__*/React.createElement("path", {
-    d: "m58.069 136.51-.654 4.238-1.27-5.38a58.934 58.934 0 0 0-11.462-4.965l-.083 5.636-2.545-6.393a55.094 55.094 0 0 0-13.655-1.854l.704 6.178-3.356-6.108c-4.151.183-8.256.946-12.195 2.268l2.33 3.525s-2.173-1.597-4.084-2.896a40.951 40.951 0 0 0-10.833 6.285 85.492 85.492 0 0 0 12.575 10.527c2.482-.637 5.127-1.279 5.127-1.279l-3.261 2.537a69.366 69.366 0 0 0 13.283 6.865c2.346-1.353 5.416-3.269 5.416-3.269l-3.554 3.931a42.226 42.226 0 0 0 15.45 2.359l4.259-4.213-1.697 4.001c7.002-.848 14.144-3.902 20.95-10.344-1.621-3.869-5.768-8.073-11.445-11.649Z",
-    fill: "#9BDEFF"
-  })), _path3 || (_path3 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M.557 136.978a.413.413 0 0 1 .475-.342l68.549 11.118a.414.414 0 0 1-.133.817L.9 137.453a.415.415 0 0 1-.342-.475Z",
-    fill: "#fff"
-  })), _path4 || (_path4 = /*#__PURE__*/React.createElement("path", {
-    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",
-    fill: "#9BDEFF"
-  })), _path5 || (_path5 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    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",
-    fill: "#1D1E26"
-  })), /*#__PURE__*/React.createElement("mask", {
-    id: "bx7xymg6ad8hy0w6p_b",
-    style: {
-      maskType: "alpha"
-    },
-    maskUnits: "userSpaceOnUse",
-    x: 81,
-    y: 22,
-    width: 100,
-    height: 104
-  }, _path6 || (_path6 = /*#__PURE__*/React.createElement("path", {
-    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",
-    fill: "#9BDEFF"
-  }))), _g || (_g = /*#__PURE__*/React.createElement("g", {
-    mask: "url(#bx7xymg6ad8hy0w6p_b)",
+  }, props), _path$J || (_path$J = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
+    d: "M13 9h5.5L13 3.5V9zM6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm4.1 9.4c-.02.04-.29 1.76-2.1 4.69 0 0-3.5 1.82-2.67 3.18.67 1.08 2.32-.04 3.74-2.68 0 0 1.82-.64 4.24-.82 0 0 3.86 1.73 4.39-.11.52-1.86-3.06-1.44-3.7-1.25 0 0-2-1.35-2.5-3.21 0 0 1.14-3.95-.61-3.9-1.75.05-1.09 3.13-.79 4.1zm.81 1.04c.03.01.47 1.21 1.89 2.46 0 0-2.33.46-3.39.9 0 0 1-1.73 1.5-3.36zm3.93 2.72c.58-.16 2.33.15 2.26.48-.06.33-2.26-.48-2.26-.48zM7.77 17c-.53 1.24-1.44 2-1.67 2-.23 0 .7-1.6 1.67-2zm3.14-6.93c0-.07-.36-2.2 0-2.15.54.08 0 2.08 0 2.15z",
     clipRule: "evenodd"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M69.817 99.247a.414.414 0 0 1 .585-.003l50.88 50.483a.414.414 0 0 1-.583.588l-50.88-50.483a.414.414 0 0 1-.002-.585ZM72.802 28.407a.414.414 0 0 1 .553.192l63.6 131.172a.413.413 0 1 1-.745.361L72.61 28.96a.414.414 0 0 1 .192-.553Z",
-    fill: "#fff"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M142.576 6.515a.415.415 0 0 1 .087.58L60.185 118.817a.413.413 0 1 1-.665-.491L141.997 6.603a.414.414 0 0 1 .579-.088ZM197.977 60.314c.181.14.214.4.075.58l-76.734 99.311a.414.414 0 0 1-.655-.506l76.734-99.31a.413.413 0 0 1 .58-.075ZM192.316 43.44a.413.413 0 0 1-.103.576L60.089 135.878a.414.414 0 0 1-.473-.68L191.74 43.336a.414.414 0 0 1 .576.104Z",
-    fill: "#fff"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M91.966 11.532a.414.414 0 0 1 .585-.021l129.252 120a.414.414 0 0 1-.563.606l-129.252-120a.414.414 0 0 1-.022-.585ZM75.232 2.769a.414.414 0 0 1 .568.143l93.554 156.828a.414.414 0 1 1-.711.424L75.089 3.336a.414.414 0 0 1 .143-.567ZM125.643.329a.414.414 0 0 1 .584.041l71.81 82.759a.413.413 0 1 1-.625.542L125.602.913a.414.414 0 0 1 .041-.584Z",
-    fill: "#fff"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M67.271 75.369a.414.414 0 0 1 .547-.209l156.745 70.345a.413.413 0 1 1-.339.755L67.479 75.916a.414.414 0 0 1-.208-.547Z",
-    fill: "#fff"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M159.279 8.938a.414.414 0 0 1 .265.522L101.278 187.39a.413.413 0 1 1-.787-.258l58.266-177.93a.414.414 0 0 1 .522-.265Z",
-    fill: "#fff"
-  }), /*#__PURE__*/React.createElement("path", {
-    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",
-    fill: "#1D1E26"
-  }))), _path7 || (_path7 = /*#__PURE__*/React.createElement("path", {
-    d: "M180.287 30.828H81.39v-3.724a4.966 4.966 0 0 1 4.966-4.966H175.3a4.963 4.963 0 0 1 4.986 4.965v3.725Z",
-    fill: "#fff"
-  })), _path8 || (_path8 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M177.05 22.893a4.548 4.548 0 0 0-1.748-.341H86.356a4.552 4.552 0 0 0-4.552 4.552v3.31h98.069v-3.31a4.55 4.55 0 0 0-2.823-4.211Zm-1.75-1.169a5.375 5.375 0 0 1 4.989 3.316c.272.654.412 1.355.412 2.064v3.724a.414.414 0 0 1-.414.413H81.39a.414.414 0 0 1-.413-.413v-3.724a5.38 5.38 0 0 1 5.379-5.38H175.3Z",
-    fill: "#1D1E26"
-  })), _path9 || (_path9 = /*#__PURE__*/React.createElement("path", {
-    d: "M87.324 28.217a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6ZM93.597 28.217a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6ZM99.866 28.217a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6Z",
-    fill: "#1D1E26"
-  })), _path10 || (_path10 = /*#__PURE__*/React.createElement("path", {
-    d: "M151.71 47.806H63.614a4.986 4.986 0 0 0-4.986 4.986v93.062a4.986 4.986 0 0 0 4.986 4.986h88.096a4.986 4.986 0 0 0 4.987-4.986V52.792a4.987 4.987 0 0 0-4.987-4.986Z",
-    fill: "#fff"
-  })), _path11 || (_path11 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M63.614 48.22a4.572 4.572 0 0 0-4.572 4.572v93.062a4.572 4.572 0 0 0 4.572 4.572h88.096a4.572 4.572 0 0 0 4.573-4.572V52.792a4.572 4.572 0 0 0-4.573-4.573H63.614Zm-5.4 4.572a5.4 5.4 0 0 1 5.4-5.4h88.096a5.4 5.4 0 0 1 5.4 5.4v93.062a5.4 5.4 0 0 1-5.4 5.4H63.614a5.4 5.4 0 0 1-5.4-5.4V52.792Z",
-    fill: "#1D1E26"
-  })), _path12 || (_path12 = /*#__PURE__*/React.createElement("path", {
-    d: "M157.11 56.081H58.214v-3.724a4.986 4.986 0 0 1 4.986-4.965h88.924a4.988 4.988 0 0 1 4.986 4.965v3.724Z",
-    fill: "#008ACE"
-  })), _path13 || (_path13 = /*#__PURE__*/React.createElement("path", {
-    d: "M64.566 53.474a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6ZM70.835 53.474a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6ZM77.103 53.474a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6Z",
-    fill: "#1D1E26"
-  })), _path14 || (_path14 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M48.968 36.067a.414.414 0 0 1 .585.018l7.005 7.448a.414.414 0 1 1-.603.567l-7.005-7.448a.414.414 0 0 1 .018-.585ZM46.99 44.047a.414.414 0 0 1 .554-.188l6.269 3.104a.414.414 0 0 1-.367.742l-6.27-3.104a.414.414 0 0 1-.187-.554ZM183.97 9.366a.414.414 0 0 1 .213.545l-2.896 6.62a.414.414 0 0 1-.759-.331l2.897-6.621a.414.414 0 0 1 .545-.213ZM192.373 9.866a.415.415 0 0 1 0 .585l-8.276 8.276a.414.414 0 1 1-.585-.585l8.275-8.276a.415.415 0 0 1 .586 0ZM192.464 19.108a.413.413 0 0 1-.23.538l-6.207 2.483a.414.414 0 0 1-.308-.768l6.207-2.483a.414.414 0 0 1 .538.23ZM182.977 54.848c.228 0 .413.185.413.414v58.345a.414.414 0 1 1-.827 0V55.262c0-.229.185-.414.414-.414Z",
-    fill: "#1D1E26"
-  })), _path15 || (_path15 = /*#__PURE__*/React.createElement("path", {
-    d: "M133.371 157.945c23.196 0 42-18.804 42-42s-18.804-42-42-42-42 18.804-42 42 18.804 42 42 42Z",
-    fill: "#008ACE"
-  })), _path16 || (_path16 = /*#__PURE__*/React.createElement("path", {
-    d: "M133.371 149.669c18.625 0 33.724-15.099 33.724-33.724 0-18.625-15.099-33.724-33.724-33.724-18.625 0-33.724 15.099-33.724 33.724 0 18.625 15.099 33.724 33.724 33.724Z",
-    fill: "#fff"
-  })), _path17 || (_path17 = /*#__PURE__*/React.createElement("path", {
-    d: "M117.312 113.565a3.807 3.807 0 1 0 0-7.614 3.807 3.807 0 0 0 0 7.614ZM149.435 113.565a3.806 3.806 0 1 0 0-7.612 3.806 3.806 0 0 0 0 7.612Z",
-    fill: "#1D1E26"
-  })), _path18 || (_path18 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M133.38 123.952c-4.592 0-8.525 2.259-10.468 5.423a.827.827 0 1 1-1.41-.866c2.27-3.697 6.762-6.212 11.878-6.212 5.108 0 9.646 2.485 11.882 6.22a.827.827 0 1 1-1.42.85c-1.902-3.176-5.863-5.415-10.462-5.415Z",
-    fill: "#1D1E26"
-  })), _path19 || (_path19 = /*#__PURE__*/React.createElement("path", {
-    d: "m170.965 137.356-7.822 9.777 1.668 1.334 7.822-9.777-1.668-1.334Z",
-    fill: "#1D1E26"
-  })), _path20 || (_path20 = /*#__PURE__*/React.createElement("path", {
-    d: "M200.774 163.345c.579 2.143-3.331 6.852-5.553 6.939-7.035.277-28.73-23.913-28.73-23.913l4.44-5.553s28.122 16.142 29.843 22.527Z",
-    fill: "#9BDEFF"
-  })), _path21 || (_path21 = /*#__PURE__*/React.createElement("path", {
-    d: "M204.424 178.378a6.223 6.223 0 0 0 6.223-6.224 6.224 6.224 0 1 0-6.223 6.224Z",
-    fill: "#9BDEFF"
-  })), _path22 || (_path22 = /*#__PURE__*/React.createElement("path", {
-    d: "M199.586 168.269a6.173 6.173 0 0 1 3.311-2.131l-2.123-1.697c-.464 2.069-2.959 4.995-4.837 5.69l2.296 1.837a6.173 6.173 0 0 1 1.353-3.699Z",
-    fill: "#1D1E26"
-  })), _path23 || (_path23 = /*#__PURE__*/React.createElement("path", {
-    d: "m72.357 138.314-3.5 2.955 2.722-5.317a67.379 67.379 0 0 0-5.958-12.509l-4.014 4.514 2.38-7.076a63.412 63.412 0 0 0-9.932-11.611l-3.724 5.549 1.54-7.448a50.152 50.152 0 0 0-11.628-7.179l-.567 4.605s-.675-2.896-1.333-5.38a44.62 44.62 0 0 0-13.315-2.896 96.722 96.722 0 0 0 2.983 17.856c2.483 1.311 5.119 2.751 5.119 2.751l-4.461-.347a79.474 79.474 0 0 0 6.091 15.385c2.897.637 6.745 1.353 6.745 1.353l-5.677.55c2.871 4.965 6.492 9.6 11.069 13.349l6.45-.269-4.191 1.99c6.356 4.49 14.37 7.3 24.48 7.105 1.398-4.332.902-10.816-1.279-17.93Z",
-    fill: "#008ACE"
-  })), _path24 || (_path24 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    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",
-    fill: "#fff"
-  }))), _defs || (_defs = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
-    id: "bx7xymqaor0hb2xlf_a"
-  }, /*#__PURE__*/React.createElement("path", {
-    fill: "#fff",
-    transform: "translate(.552)",
-    d: "M0 0h230.897v180H0z"
-  })))));
+  })));
 };
-var ForwardRef$J = /*#__PURE__*/forwardRef(SvgEmptyTable);
+var ForwardRef$J = /*#__PURE__*/forwardRef(SvgFileFilePdfFill);
 
 var _path$I;
 function _extends$I() { return _extends$I = 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$I.apply(null, arguments); }
-var SvgTableSortAscOutline = function SvgTableSortAscOutline(props, ref) {
+var SvgFileFileImageFill = function SvgFileFileImageFill(props, ref) {
   return /*#__PURE__*/React.createElement("svg", _extends$I({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -288,14 +169,16 @@ var SvgTableSortAscOutline = function SvgTableSortAscOutline(props, ref) {
     viewBox: "0 0 24 24",
     ref: ref
   }, props), _path$I || (_path$I = /*#__PURE__*/React.createElement("path", {
-    d: "M11 21V6.825L9.4 8.4 8 7l4-4 4 4-1.4 1.4L13 6.825V21h-2z"
+    fillRule: "evenodd",
+    d: "M13 9h5.5L13 3.5V9zM6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2zm0 18h12v-8l-4 4-2-2-6 6zM8 9a2 2 0 1 0 0 4 2 2 0 0 0 0-4z",
+    clipRule: "evenodd"
   })));
 };
-var ForwardRef$I = /*#__PURE__*/forwardRef(SvgTableSortAscOutline);
+var ForwardRef$I = /*#__PURE__*/forwardRef(SvgFileFileImageFill);
 
-var _path$H;
+var _path$H, _path2$5;
 function _extends$H() { return _extends$H = 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$H.apply(null, arguments); }
-var SvgTableSortDescOutline = function SvgTableSortDescOutline(props, ref) {
+var SvgFileFileVideoFill = function SvgFileFileVideoFill(props, ref) {
   return /*#__PURE__*/React.createElement("svg", _extends$H({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
@@ -303,1062 +186,416 @@ var SvgTableSortDescOutline = function SvgTableSortDescOutline(props, ref) {
     viewBox: "0 0 24 24",
     ref: ref
   }, props), _path$H || (_path$H = /*#__PURE__*/React.createElement("path", {
-    d: "M13 3v14.175l1.6-1.575L16 17l-4 4-4-4 1.4-1.4 1.6 1.575V3h2z"
-  })));
-};
-var ForwardRef$H = /*#__PURE__*/forwardRef(SvgTableSortDescOutline);
-
-var _path$G;
-function _extends$G() { return _extends$G = 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$G.apply(null, arguments); }
-var SvgActionDragIndicatorOutline = function SvgActionDragIndicatorOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$G({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$G || (_path$G = /*#__PURE__*/React.createElement("path", {
-    d: "M9 20c-.55 0-1.02-.196-1.412-.587A1.927 1.927 0 0 1 7 18c0-.55.196-1.021.588-1.413A1.925 1.925 0 0 1 9 16c.55 0 1.021.196 1.413.587.391.392.587.863.587 1.413s-.196 1.021-.587 1.413A1.928 1.928 0 0 1 9 20zm6 0c-.55 0-1.02-.196-1.412-.587A1.927 1.927 0 0 1 13 18c0-.55.196-1.021.588-1.413A1.925 1.925 0 0 1 15 16c.55 0 1.021.196 1.413.587.391.392.587.863.587 1.413s-.196 1.021-.587 1.413A1.928 1.928 0 0 1 15 20zm-6-6c-.55 0-1.02-.196-1.412-.588A1.923 1.923 0 0 1 7 12c0-.55.196-1.021.588-1.413A1.925 1.925 0 0 1 9 10c.55 0 1.021.196 1.413.587.391.392.587.863.587 1.413s-.196 1.02-.587 1.412A1.927 1.927 0 0 1 9 14zm6 0c-.55 0-1.02-.196-1.412-.588A1.923 1.923 0 0 1 13 12c0-.55.196-1.021.588-1.413A1.925 1.925 0 0 1 15 10c.55 0 1.021.196 1.413.587.391.392.587.863.587 1.413s-.196 1.02-.587 1.412A1.927 1.927 0 0 1 15 14zM9 8c-.55 0-1.02-.196-1.412-.588A1.923 1.923 0 0 1 7 6c0-.55.196-1.02.588-1.412A1.923 1.923 0 0 1 9 4c.55 0 1.021.196 1.413.588.391.391.587.862.587 1.412 0 .55-.196 1.02-.587 1.412A1.927 1.927 0 0 1 9 8zm6 0c-.55 0-1.02-.196-1.412-.588A1.923 1.923 0 0 1 13 6c0-.55.196-1.02.588-1.412A1.923 1.923 0 0 1 15 4c.55 0 1.021.196 1.413.588.391.391.587.862.587 1.412 0 .55-.196 1.02-.587 1.412A1.927 1.927 0 0 1 15 8z"
-  })));
-};
-var ForwardRef$G = /*#__PURE__*/forwardRef(SvgActionDragIndicatorOutline);
-
-var _path$F;
-function _extends$F() { return _extends$F = 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$F.apply(null, arguments); }
-var SvgNavigationMoreVertOutline = function SvgNavigationMoreVertOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$F({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$F || (_path$F = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$F = /*#__PURE__*/forwardRef(SvgNavigationMoreVertOutline);
-
-var _path$E;
-function _extends$E() { return _extends$E = 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$E.apply(null, arguments); }
-var SvgNavigationRefreshOutline = function SvgNavigationRefreshOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$E({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$E || (_path$E = /*#__PURE__*/React.createElement("path", {
-    d: "M12 20c-2.233 0-4.125-.775-5.675-2.325C4.775 16.125 4 14.233 4 12c0-2.233.775-4.125 2.325-5.675C7.875 4.775 9.767 4 12 4c1.15 0 2.25.238 3.3.713A7.617 7.617 0 0 1 18 6.75V4h2v7h-7V9h4.2a5.837 5.837 0 0 0-2.187-2.2A5.93 5.93 0 0 0 12 6c-1.667 0-3.083.583-4.25 1.75C6.583 8.917 6 10.333 6 12c0 1.667.583 3.083 1.75 4.25C8.917 17.417 10.333 18 12 18a5.863 5.863 0 0 0 3.475-1.1A5.81 5.81 0 0 0 17.65 14h2.1c-.467 1.767-1.417 3.208-2.85 4.325S13.833 20 12 20z"
-  })));
-};
-var ForwardRef$E = /*#__PURE__*/forwardRef(SvgNavigationRefreshOutline);
-
-var _path$D;
-function _extends$D() { return _extends$D = 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$D.apply(null, arguments); }
-var SvgActionLockFill = function SvgActionLockFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$D({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$D || (_path$D = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M12 18a2 2 0 1 0 0-4 2 2 0 0 0 0 4zM7 9V7a5 5 0 0 1 10 0v2h1a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V11a2 2 0 0 1 2-2h1zm2 0h6V7a3 3 0 1 0-6 0v2z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$D = /*#__PURE__*/forwardRef(SvgActionLockFill);
-
-var _path$C, _path2$4;
-function _extends$C() { return _extends$C = 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$C.apply(null, arguments); }
-var SvgTableGroupColumnLeftFill = function SvgTableGroupColumnLeftFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$C({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$C || (_path$C = /*#__PURE__*/React.createElement("path", {
-    d: "M5 3a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h6V3H5z"
-  })), _path2$4 || (_path2$4 = /*#__PURE__*/React.createElement("path", {
+    d: "M14.992 14 9.5 17.138v-6.276L14.992 14z"
+  })), _path2$5 || (_path2$5 = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
-    d: "M13 21V3h6a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-6zm2-16h4v14h-4V5z",
+    d: "M4 4c0-1.11.89-2 2-2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4zm9-.5V9h5.5L13 3.5zM8.5 9.138v9.724L17.008 14 8.5 9.138z",
     clipRule: "evenodd"
-  })));
-};
-var ForwardRef$C = /*#__PURE__*/forwardRef(SvgTableGroupColumnLeftFill);
-
-var _path$B, _path2$3;
-function _extends$B() { return _extends$B = 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$B.apply(null, arguments); }
-var SvgTableGroupColumnRightFill = function SvgTableGroupColumnRightFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$B({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$B || (_path$B = /*#__PURE__*/React.createElement("path", {
-    d: "M13 3h6a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-6V3z"
-  })), _path2$3 || (_path2$3 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M9 5H5v14h4V5zM5 3a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h6V3H5z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$B = /*#__PURE__*/forwardRef(SvgTableGroupColumnRightFill);
-
-var _path$A;
-function _extends$A() { return _extends$A = 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$A.apply(null, arguments); }
-var SvgTableSwapOutline = function SvgTableSwapOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$A({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$A || (_path$A = /*#__PURE__*/React.createElement("path", {
-    d: "M7 6.825V20h2V6.825L10.6 8.4 12 7 8 3 4 7l1.4 1.4L7 6.825zm10 10.35V4h-2v13.175L13.4 15.6 12 17l4 4 4-4-1.4-1.4-1.6 1.575z"
-  })));
-};
-var ForwardRef$A = /*#__PURE__*/forwardRef(SvgTableSwapOutline);
-
-var _path$z;
-function _extends$z() { return _extends$z = 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$z.apply(null, arguments); }
-var SvgContentFiltrationFill = function SvgContentFiltrationFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$z({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$z || (_path$z = /*#__PURE__*/React.createElement("path", {
-    d: "M14 13v8l-4-2v-6L2.95 4h18.1L14 13z"
-  })));
-};
-var ForwardRef$z = /*#__PURE__*/forwardRef(SvgContentFiltrationFill);
-
-var _path$y;
-function _extends$y() { return _extends$y = 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$y.apply(null, arguments); }
-var SvgNavigationChevronUpOutline = function SvgNavigationChevronUpOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$y({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$y || (_path$y = /*#__PURE__*/React.createElement("path", {
-    d: "M18.586 15.914 20 14.5l-8-8-8 8 1.414 1.414L12 9.328l6.586 6.586z"
-  })));
-};
-var ForwardRef$y = /*#__PURE__*/forwardRef(SvgNavigationChevronUpOutline);
-
-var _path$x;
-function _extends$x() { return _extends$x = 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$x.apply(null, arguments); }
-var SvgNavigationCollapseAllOutline = function SvgNavigationCollapseAllOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$x({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$x || (_path$x = /*#__PURE__*/React.createElement("path", {
-    d: "M16.5 4.414 15.086 3 12 6.086 8.914 3 7.5 4.414l4.5 4.5 4.5-4.5zM9 13v-2h6v2H9zm6.086 8 1.414-1.414-4.5-4.5-4.5 4.5L8.914 21 12 17.914 15.086 21z"
-  })));
-};
-var ForwardRef$x = /*#__PURE__*/forwardRef(SvgNavigationCollapseAllOutline);
-
-var _path$w;
-function _extends$w() { return _extends$w = 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$w.apply(null, arguments); }
-var SvgNavigationExpandAllOutline = function SvgNavigationExpandAllOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$w({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$w || (_path$w = /*#__PURE__*/React.createElement("path", {
-    d: "m16.5 7.5-1.414 1.414L12 5.828 8.914 8.914 7.5 7.5 12 3l4.5 4.5zM9 13v-2h6v2H9zm6.086 2.086L16.5 16.5 12 21l-4.5-4.5 1.414-1.414L12 18.17l3.086-3.085z"
-  })));
-};
-var ForwardRef$w = /*#__PURE__*/forwardRef(SvgNavigationExpandAllOutline);
-
-var _path$v;
-function _extends$v() { return _extends$v = 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$v.apply(null, arguments); }
-var SvgActionSettingsFill = function SvgActionSettingsFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$v({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$v || (_path$v = /*#__PURE__*/React.createElement("path", {
-    d: "m9.25 22-.4-3.2a3.771 3.771 0 0 1-.612-.3 8.194 8.194 0 0 1-.563-.375L4.7 19.375l-2.75-4.75 2.575-1.95a2.39 2.39 0 0 1-.025-.338v-.675c0-.108.009-.22.025-.337L1.95 9.375l2.75-4.75 2.975 1.25c.184-.133.375-.258.575-.375.2-.117.4-.217.6-.3l.4-3.2h5.5l.4 3.2c.217.083.421.183.613.3.191.117.379.242.562.375l2.975-1.25 2.75 4.75-2.575 1.95c.017.117.025.229.025.337v.675c0 .109-.017.221-.05.338l2.575 1.95-2.75 4.75-2.95-1.25a6.826 6.826 0 0 1-.575.375c-.2.117-.4.217-.6.3l-.4 3.2h-5.5zm2.8-6.5c.967 0 1.792-.342 2.475-1.025A3.372 3.372 0 0 0 15.55 12c0-.967-.341-1.792-1.025-2.475A3.372 3.372 0 0 0 12.05 8.5c-.983 0-1.813.342-2.488 1.025A3.394 3.394 0 0 0 8.55 12c0 .967.338 1.792 1.012 2.475.676.683 1.505 1.025 2.488 1.025z"
-  })));
-};
-var ForwardRef$v = /*#__PURE__*/forwardRef(SvgActionSettingsFill);
-
-var _path$u;
-function _extends$u() { return _extends$u = 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$u.apply(null, arguments); }
-var SvgNavigationChevronLeftOutline = function SvgNavigationChevronLeftOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$u({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$u || (_path$u = /*#__PURE__*/React.createElement("path", {
-    d: "M15.914 5.414 14.5 4l-8 8 8 8 1.414-1.414L9.328 12l6.586-6.586z"
-  })));
-};
-var ForwardRef$u = /*#__PURE__*/forwardRef(SvgNavigationChevronLeftOutline);
-
-var _path$t;
-function _extends$t() { return _extends$t = 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$t.apply(null, arguments); }
-var SvgNavigationChevronRightOutline = function SvgNavigationChevronRightOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$t({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$t || (_path$t = /*#__PURE__*/React.createElement("path", {
-    d: "M8.086 18.586 9.5 20l8-8-8-8-1.414 1.414L14.672 12l-6.586 6.586z"
-  })));
-};
-var ForwardRef$t = /*#__PURE__*/forwardRef(SvgNavigationChevronRightOutline);
-
-var _path$s;
-function _extends$s() { return _extends$s = 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$s.apply(null, arguments); }
-var SvgActionAddOutline = function SvgActionAddOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$s({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$s || (_path$s = /*#__PURE__*/React.createElement("path", {
-    d: "M13.286 3h-2.572v7.714H3v2.572h7.714V21h2.572v-7.714H21v-2.572h-7.714V3z"
-  })));
-};
-var ForwardRef$s = /*#__PURE__*/forwardRef(SvgActionAddOutline);
-
-var _path$r;
-function _extends$r() { return _extends$r = 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$r.apply(null, arguments); }
-var SvgNotificationDoneFill = function SvgNotificationDoneFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$r({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$r || (_path$r = /*#__PURE__*/React.createElement("path", {
-    d: "m2 12 3.077-3.2 4.615 4.8L18.923 4 22 7.2 9.692 20 2 12z"
-  })));
-};
-var ForwardRef$r = /*#__PURE__*/forwardRef(SvgNotificationDoneFill);
-
-var _path$q;
-function _extends$q() { return _extends$q = 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$q.apply(null, arguments); }
-var SvgRadioDotFill = function SvgRadioDotFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$q({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$q || (_path$q = /*#__PURE__*/React.createElement("path", {
-    d: "M12 19a7 7 0 1 0 0-14 7 7 0 0 0 0 14z"
-  })));
-};
-var ForwardRef$q = /*#__PURE__*/forwardRef(SvgRadioDotFill);
-
-var _path$p;
-function _extends$p() { return _extends$p = 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$p.apply(null, arguments); }
-var SvgNotificationHelpFill = function SvgNotificationHelpFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$p({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$p || (_path$p = /*#__PURE__*/React.createElement("path", {
-    d: "M11.95 18c.35 0 .646-.121.888-.363.241-.241.362-.537.362-.887s-.12-.646-.362-.887a1.208 1.208 0 0 0-.888-.363c-.35 0-.646.121-.888.363a1.206 1.206 0 0 0-.362.887c0 .35.12.646.362.887.242.242.538.363.888.363zm-.9-3.85h1.85c0-.55.063-.983.188-1.3.125-.317.479-.75 1.062-1.3a7.483 7.483 0 0 0 1.025-1.238c.25-.391.375-.862.375-1.412 0-.933-.342-1.65-1.025-2.15-.683-.5-1.492-.75-2.425-.75-.95 0-1.72.25-2.312.75-.592.5-1.005 1.1-1.238 1.8l1.65.65c.083-.3.271-.625.563-.975.291-.35.737-.525 1.337-.525.533 0 .933.146 1.2.437.267.292.4.613.4.963 0 .333-.1.646-.3.937-.2.292-.45.563-.75.813-.733.65-1.183 1.142-1.35 1.475-.167.333-.25.942-.25 1.825zM12 22a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22z"
-  })));
-};
-var ForwardRef$p = /*#__PURE__*/forwardRef(SvgNotificationHelpFill);
-
-var _path$o;
-function _extends$o() { return _extends$o = 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$o.apply(null, arguments); }
-var SvgNotificationCheckFill = function SvgNotificationCheckFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$o({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$o || (_path$o = /*#__PURE__*/React.createElement("path", {
-    d: "m10.6 16.6 7.05-7.05-1.4-1.4-5.65 5.65-2.85-2.85-1.4 1.4 4.25 4.25zM12 22a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22z"
-  })));
-};
-var ForwardRef$o = /*#__PURE__*/forwardRef(SvgNotificationCheckFill);
-
-var _path$n;
-function _extends$n() { return _extends$n = 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$n.apply(null, arguments); }
-var SvgNotificationWarningFill = function SvgNotificationWarningFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$n({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$n || (_path$n = /*#__PURE__*/React.createElement("path", {
-    d: "M1 21 12 2l11 19H1zm11-3a.968.968 0 0 0 .713-.288A.967.967 0 0 0 13 17a.967.967 0 0 0-.287-.712A.968.968 0 0 0 12 16a.965.965 0 0 0-.712.288A.965.965 0 0 0 11 17c0 .283.096.52.288.712A.965.965 0 0 0 12 18zm-1-3h2v-5h-2v5z"
-  })));
-};
-var ForwardRef$n = /*#__PURE__*/forwardRef(SvgNotificationWarningFill);
-
-var _path$m;
-function _extends$m() { return _extends$m = 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$m.apply(null, arguments); }
-var SvgNotificationErrorFill = function SvgNotificationErrorFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$m({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$m || (_path$m = /*#__PURE__*/React.createElement("path", {
-    d: "M12 17a.968.968 0 0 0 .713-.288A.967.967 0 0 0 13 16a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 15a.967.967 0 0 0-.712.287A.968.968 0 0 0 11 16c0 .283.096.52.288.712A.965.965 0 0 0 12 17zm-1-4h2V7h-2v6zm1 9a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22z"
-  })));
-};
-var ForwardRef$m = /*#__PURE__*/forwardRef(SvgNotificationErrorFill);
-
-var _path$l;
-function _extends$l() { return _extends$l = 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$l.apply(null, arguments); }
-var SvgFileFileWordFill = function SvgFileFileWordFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$l({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$l || (_path$l = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm1.2 18h-1.4L12 13.2 10.2 20H8.8l-2.2-9h1.5l1.4 6.8 1.8-6.8h1.3l1.8 6.8 1.4-6.8h1.5l-2.1 9zM13 9V3.5L18.5 9H13z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$l = /*#__PURE__*/forwardRef(SvgFileFileWordFill);
-
-var _path$k;
-function _extends$k() { return _extends$k = 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$k.apply(null, arguments); }
-var SvgFileFileExcelFill = function SvgFileFileExcelFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$k({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$k || (_path$k = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm1.8 18H14l-2-3.4-2 3.4H8.2l2.9-4.5L8.2 11H10l2 3.4 2-3.4h1.8l-2.9 4.5 2.9 4.5zM13 9V3.5L18.5 9H13z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$k = /*#__PURE__*/forwardRef(SvgFileFileExcelFill);
-
-var _path$j;
-function _extends$j() { return _extends$j = 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$j.apply(null, arguments); }
-var SvgFileFilePdfFill = function SvgFileFilePdfFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$j({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$j || (_path$j = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M13 9h5.5L13 3.5V9zM6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm4.1 9.4c-.02.04-.29 1.76-2.1 4.69 0 0-3.5 1.82-2.67 3.18.67 1.08 2.32-.04 3.74-2.68 0 0 1.82-.64 4.24-.82 0 0 3.86 1.73 4.39-.11.52-1.86-3.06-1.44-3.7-1.25 0 0-2-1.35-2.5-3.21 0 0 1.14-3.95-.61-3.9-1.75.05-1.09 3.13-.79 4.1zm.81 1.04c.03.01.47 1.21 1.89 2.46 0 0-2.33.46-3.39.9 0 0 1-1.73 1.5-3.36zm3.93 2.72c.58-.16 2.33.15 2.26.48-.06.33-2.26-.48-2.26-.48zM7.77 17c-.53 1.24-1.44 2-1.67 2-.23 0 .7-1.6 1.67-2zm3.14-6.93c0-.07-.36-2.2 0-2.15.54.08 0 2.08 0 2.15z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$j = /*#__PURE__*/forwardRef(SvgFileFilePdfFill);
-
-var _path$i;
-function _extends$i() { return _extends$i = 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$i.apply(null, arguments); }
-var SvgFileFileImageFill = function SvgFileFileImageFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$i({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$i || (_path$i = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M13 9h5.5L13 3.5V9zM6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2zm0 18h12v-8l-4 4-2-2-6 6zM8 9a2 2 0 1 0 0 4 2 2 0 0 0 0-4z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$i = /*#__PURE__*/forwardRef(SvgFileFileImageFill);
-
-var _path$h, _path2$2;
-function _extends$h() { return _extends$h = 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$h.apply(null, arguments); }
-var SvgFileFileVideoFill = function SvgFileFileVideoFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$h({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$h || (_path$h = /*#__PURE__*/React.createElement("path", {
-    d: "M14.992 14 9.5 17.138v-6.276L14.992 14z"
-  })), _path2$2 || (_path2$2 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M4 4c0-1.11.89-2 2-2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4zm9-.5V9h5.5L13 3.5zM8.5 9.138v9.724L17.008 14 8.5 9.138z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$h = /*#__PURE__*/forwardRef(SvgFileFileVideoFill);
-
-var _path$g;
-function _extends$g() { return _extends$g = 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$g.apply(null, arguments); }
-var SvgFileFileTableFill = function SvgFileFileTableFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$g({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$g || (_path$g = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm-4 17H7v-2h3v2zm0-3H7v-2h3v2zm0-3H7v-2h3v2zm4 6h-3v-2h3v2zm0-3h-3v-2h3v2zm0-3h-3v-2h3v2zm-1-4V3.5L18.5 9H13z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$g = /*#__PURE__*/forwardRef(SvgFileFileTableFill);
-
-var _path$f;
-function _extends$f() { return _extends$f = 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$f.apply(null, arguments); }
-var SvgFileFileTextFill = function SvgFileFileTextFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$f({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$f || (_path$f = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M13 9h5.5L13 3.5V9zM6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2zm9 16v-2H6v2h9zm3-4v-2H6v2h12z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$f = /*#__PURE__*/forwardRef(SvgFileFileTextFill);
-
-var _path$e;
-function _extends$e() { return _extends$e = 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$e.apply(null, arguments); }
-var SvgFileFileEmlFill = function SvgFileFileEmlFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$e({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$e || (_path$e = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M4 4c0-1.11.89-2 2-2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4zm9-.5V9h5.5L13 3.5zM7 18v-4.732l5 3.333 5-3.333V18a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1zm5-2.6 4.688-3.126A.997.997 0 0 0 16 12H8a.997.997 0 0 0-.688.274L12 15.399z",
-    clipRule: "evenodd"
-  })));
-};
-var ForwardRef$e = /*#__PURE__*/forwardRef(SvgFileFileEmlFill);
-
-var _path$d;
-function _extends$d() { return _extends$d = 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$d.apply(null, arguments); }
-var SvgFileFileFill = function SvgFileFileFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$d({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    ref: ref
-  }, props), _path$d || (_path$d = /*#__PURE__*/React.createElement("path", {
-    d: "M6 22c-.55 0-1.02-.196-1.412-.587A1.927 1.927 0 0 1 4 20V4c0-.55.196-1.021.588-1.413A1.925 1.925 0 0 1 6 2h8l6 6v12a1.93 1.93 0 0 1-.587 1.413A1.928 1.928 0 0 1 18 22H6zm7-13h5l-5-5v5z"
-  })));
-};
-var ForwardRef$d = /*#__PURE__*/forwardRef(SvgFileFileFill);
-
-var _path$c;
-function _extends$c() { return _extends$c = 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$c.apply(null, arguments); }
-var SvgStarFilled = function SvgStarFilled(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$c({
-    width: 24,
-    height: 24,
-    viewBox: "0 0 24 24",
-    xmlns: "http://www.w3.org/2000/svg",
-    ref: ref
-  }, props), _path$c || (_path$c = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M8.917 8.268 12.01 2l3.093 6.268 6.917 1.005-5.005 4.878 1.182 6.889-6.187-3.252-6.186 3.252 1.181-6.889L2 9.273z"
-  })));
-};
-var ForwardRef$c = /*#__PURE__*/forwardRef(SvgStarFilled);
-
-var _path$b, _path2$1;
-function _extends$b() { return _extends$b = 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$b.apply(null, arguments); }
-var SvgSearchWithBackground = function SvgSearchWithBackground(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$b({
-    width: 66,
-    height: 67,
-    viewBox: "0 0 66 67",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    ref: ref
-  }, props), _path$b || (_path$b = /*#__PURE__*/React.createElement("path", {
-    d: "M0 33.5C0 15.275 14.775.5 33 .5s33 14.775 33 33-14.775 33-33 33-33-14.775-33-33Z",
-    fill: "#EBEDF5"
-  })), _path2$1 || (_path2$1 = /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "m42.31 40.335 7.165 7.165L47 49.975l-7.165-7.165a13.94 13.94 0 0 1-8.585 2.94c-7.732 0-14-6.268-14-14s6.268-14 14-14 14 6.268 14 14a13.94 13.94 0 0 1-2.94 8.585ZM31.25 42.25c5.799 0 10.5-4.701 10.5-10.5s-4.701-10.5-10.5-10.5-10.5 4.701-10.5 10.5 4.701 10.5 10.5 10.5Z",
-    fill: "#6C6F80"
-  })));
-};
-var ForwardRef$b = /*#__PURE__*/forwardRef(SvgSearchWithBackground);
-
-const fileIcons = {
-    docIcon: ForwardRef$l,
-    exelIcon: ForwardRef$k,
-    pdfIcon: ForwardRef$j,
-    imgIcon: ForwardRef$i,
-    videoIcon: ForwardRef$h,
-    tableIcon: ForwardRef$g,
-    textIcon: ForwardRef$f,
-    mailIcon: ForwardRef$e,
-    fileIcon: ForwardRef$d,
-    closeIcon: ForwardRef$R,
-    errorIcon: ForwardRef$m,
-};
-const accordionSettings = {
-    icons: {
-        dropdownIcon: ForwardRef$Q,
-    },
-};
-const alertSettings = {
-    sizes: {
-        default: '48',
-        actionMap: {
-            36: '24',
-            48: '30',
-        },
-    },
-    icons: {
-        closeIcon: ForwardRef$R,
-        infoIcon: ForwardRef$K,
-        successIcon: ForwardRef$o,
-        warningIcon: ForwardRef$n,
-        errorIcon: ForwardRef$m,
-    },
-};
-const badgeSettings = {
-    icons: {
-        dropdownIcon: ForwardRef$Q,
-    },
-    sizes: {
-        default: '36',
-        countIndicatorMap: {
-            18: '12',
-            24: '18',
-            30: '18',
-            36: '18',
-            42: '24',
-            48: '24',
-        },
-    },
-};
-const buttonSettings = {
-    icons: {
-        clearIcon: ForwardRef$R,
-        dropdownIcon: ForwardRef$Q,
-    },
-    sizes: {
-        default: '36',
-    },
-};
-const checkboxSettings = {
-    icons: {
-        checkIcon: ForwardRef$P,
-        indeterminateIcon: ForwardRef$O,
-    },
-    sizes: {
-        default: '18',
-    },
-};
-const countIndicatorSettings = {
-    sizes: {
-        default: '24',
-    },
-};
-const dataTableSettings = {
-    icons: {
-        emptyTable: ForwardRef$J,
-        header: {
-            configIcon: ForwardRef$v,
-            ascSortIcon: ForwardRef$I,
-            descSortIcon: ForwardRef$H,
-            defaultSortIcon: ForwardRef$A,
-            filterIcon: ForwardRef$z,
-            dropdownIcon: ForwardRef$Q,
-            openedDropdownIcon: ForwardRef$y,
-            foldIcon: ForwardRef$x,
-            unfoldIcon: ForwardRef$w,
-        },
-        columnsConfigurationModal: {
-            dragIndicator: ForwardRef$G,
-            lockIcon: ForwardRef$D,
-            pinLeftIcon: ForwardRef$C,
-            pinRightIcon: ForwardRef$B,
-            collapsedIcon: ForwardRef$t,
-            expandedIcon: ForwardRef$Q,
-            menuIcon: ForwardRef$F,
-            resetIcon: ForwardRef$E,
-        },
-    },
-    sizes: {
-        header: {
-            defaultRow: '36',
-            defaultCell: '36',
-            defaultResizeMarker: '12',
-            defaultCellPadding: '12',
-            defaultCellPaddingEdge: '24',
-            defaultGroupCell: '36',
-            defaultGroupCellPadding: '12',
-            defaultGroupCellPaddingEdge: '24',
-            cellCheckboxMap: {
-                36: '18',
-                48: '18',
-                60: '18',
-            },
-            cellIconMap: {
-                36: '18',
-                48: '18',
-                60: '18',
-            },
-            captionFontSize: '14',
-            captionFontWeight: '400',
-            captionSize: '18',
-            captionUppercase: '12',
-            groupCellCaptionFontSize: '14',
-            groupCellCaptionFontWeight: '400',
-            groupCellCaptionSize: '18',
-            groupCellCaptionUppercase: '12',
-        },
-        body: {
-            defaultRow: '36',
-            defaultCell: '36',
-            defaultCellPadding: '12',
-            defaultCellPaddingEdge: '24',
-            cellTextMap: {
-                24: '24',
-                30: '30',
-                36: '36',
-                42: '42',
-                48: '48',
-                60: '48',
-            },
-        },
-        columnsConfigurationModal: {
-            columnRow: '30',
-            countIndicator: '18',
-            subgroupIcon: '18',
-            menuButton: '30',
-            searchInput: '30',
-            width: 560,
-        },
-    },
-};
-const dropdownMenuSettings = {
-    icons: {
-        acceptIcon: ForwardRef$P,
-        dropdownIcon: ForwardRef$Q,
-    },
-};
-const datePickerSettings = {
-    icons: {
-        body: {
-            prevIcon: ForwardRef$u,
-            nextIcon: ForwardRef$t,
-        },
-        input: {
-            calendarIcon: ForwardRef$M,
-        },
-    },
-    sizes: {
-        default: '36',
-    },
-};
-const fileCardSettings = {
-    icons: {
-        docIcon: ForwardRef$l,
-        exelIcon: ForwardRef$k,
-        pdfIcon: ForwardRef$j,
-        imgIcon: ForwardRef$i,
-        videoIcon: ForwardRef$h,
-        tableIcon: ForwardRef$g,
-        textIcon: ForwardRef$f,
-        mailIcon: ForwardRef$e,
-        fileIcon: ForwardRef$d,
-        closeIcon: ForwardRef$R,
-        errorIcon: ForwardRef$m,
-    },
-};
-const flexRowSettings = {
-    sizes: {
-        default: '36',
-    },
-};
-const filtersPanelSettings = {
-    icons: {
-        addFilterIcon: ForwardRef$s,
-        itemDropdownIcon: ForwardRef$Q,
-    },
-    sizes: {
-        default: '36',
-        pickerInput: {
-            body: {
-                searchInput: '36',
-                row: '36',
-                rowItem: '36',
-                footer: '36',
-            },
-        },
-    },
-};
-const iconButtonSettings = {
-    icons: {
-        dropdownIcon: ForwardRef$Q,
-    },
+  })));
 };
-const labeledInputSettings = {
-    icons: {
-        infoIcon: ForwardRef$L,
-        fillInfoIcon: ForwardRef$K,
-    },
-    sizes: {
-        default: '36',
-    },
+var ForwardRef$H = /*#__PURE__*/forwardRef(SvgFileFileVideoFill);
+
+var _path$G;
+function _extends$G() { return _extends$G = 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$G.apply(null, arguments); }
+var SvgFileFileTableFill = function SvgFileFileTableFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$G({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$G || (_path$G = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm-4 17H7v-2h3v2zm0-3H7v-2h3v2zm0-3H7v-2h3v2zm4 6h-3v-2h3v2zm0-3h-3v-2h3v2zm0-3h-3v-2h3v2zm-1-4V3.5L18.5 9H13z",
+    clipRule: "evenodd"
+  })));
 };
-const linkButtonSettings = {
-    icons: {
-        dropdownIcon: ForwardRef$Q,
-    },
-    sizes: {
-        default: '36',
-        defaultWeight: 'semibold',
-    },
+var ForwardRef$G = /*#__PURE__*/forwardRef(SvgFileFileTableFill);
+
+var _path$F;
+function _extends$F() { return _extends$F = 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$F.apply(null, arguments); }
+var SvgFileFileTextFill = function SvgFileFileTextFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$F({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$F || (_path$F = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M13 9h5.5L13 3.5V9zM6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2zm9 16v-2H6v2h9zm3-4v-2H6v2h12z",
+    clipRule: "evenodd"
+  })));
 };
-const modalSettings = {
-    icons: {
-        closeIcon: ForwardRef$R,
-    },
-    sizes: {
-        defaultWidth: 420,
-        defaultMaxHeight: '80dvh',
-        defaultMobileMaxHeight: '100dvh',
-        defaultHeaderPadding: '24',
-        defaultFooterColumnGap: '12',
-        defaultFooterPadding: '24',
-        defaultFooterVPadding: '24',
-    },
+var ForwardRef$F = /*#__PURE__*/forwardRef(SvgFileFileTextFill);
+
+var _path$E;
+function _extends$E() { return _extends$E = 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$E.apply(null, arguments); }
+var SvgFileFileEmlFill = function SvgFileFileEmlFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$E({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$E || (_path$E = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M4 4c0-1.11.89-2 2-2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4zm9-.5V9h5.5L13 3.5zM7 18v-4.732l5 3.333 5-3.333V18a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1zm5-2.6 4.688-3.126A.997.997 0 0 0 16 12H8a.997.997 0 0 0-.688.274L12 15.399z",
+    clipRule: "evenodd"
+  })));
 };
-const notificationCardSettings = {
-    icons: {
-        closeIcon: ForwardRef$R,
-        hintIcon: ForwardRef$p,
-        successIcon: ForwardRef$o,
-        warningIcon: ForwardRef$n,
-        errorIcon: ForwardRef$m,
-    },
-    sizes: {
-        action: '30',
-    },
+var ForwardRef$E = /*#__PURE__*/forwardRef(SvgFileFileEmlFill);
+
+var _path$D;
+function _extends$D() { return _extends$D = 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$D.apply(null, arguments); }
+var SvgFileFileFill = function SvgFileFileFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$D({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$D || (_path$D = /*#__PURE__*/React.createElement("path", {
+    d: "M6 22c-.55 0-1.02-.196-1.412-.587A1.927 1.927 0 0 1 4 20V4c0-.55.196-1.021.588-1.413A1.925 1.925 0 0 1 6 2h8l6 6v12a1.93 1.93 0 0 1-.587 1.413A1.928 1.928 0 0 1 18 22H6zm7-13h5l-5-5v5z"
+  })));
 };
-const numericInputSettings = {
-    icons: {
-        arrowIcon: ForwardRef$Q,
-    },
-    sizes: {
-        default: '36',
-    },
+var ForwardRef$D = /*#__PURE__*/forwardRef(SvgFileFileFill);
+
+const fileIcons = {
+    docIcon: ForwardRef$L,
+    exelIcon: ForwardRef$K,
+    pdfIcon: ForwardRef$J,
+    imgIcon: ForwardRef$I,
+    videoIcon: ForwardRef$H,
+    tableIcon: ForwardRef$G,
+    textIcon: ForwardRef$F,
+    mailIcon: ForwardRef$E,
+    fileIcon: ForwardRef$D,
+};
+const systemIcons = {
+    clear: ForwardRef$R,
+    foldingArrow: ForwardRef$Q,
+    accept: ForwardRef$P,
+    search: ForwardRef$O,
+    calendar: ForwardRef$N,
+    info: ForwardRef$M,
 };
-const paginatorSettings = {
-    icons: {
-        leftArrowIcon: ForwardRef$u,
-        rightArrowIcon: ForwardRef$t,
-    },
+
+const settings = {
     sizes: {
-        default: '36',
-    },
-};
-const pickerInputSettings = {
-    icons: {
-        toggler: {
-            clearIcon: ForwardRef$R,
-            dropdownIcon: ForwardRef$Q,
-        },
-        body: {
-            selectIcon: ForwardRef$P,
-            boldSelectIcon: ForwardRef$r,
-            pickerBodyMobileHeaderCloseIcon: ForwardRef$R,
-            modalNotFoundSearchIcon: ForwardRef$b,
+        defaults: {
+            alert: '48',
+            badge: '36',
+            button: '36',
+            checkbox: '18',
+            countIndicator: '24',
+            flexRow: '36',
+            filtersPanel: '36',
+            linkButton: '36',
+            numericInput: '36',
+            radioInput: '18',
+            richTextView: '14',
+            switch: '18',
+            tabButton: '48',
+            tag: '36',
+            text: '36',
+            textArea: '36',
+            textInput: '36',
+            rangeDatePicker: '36',
+            datePicker: '36',
+            labeledInput: '36',
+            statusIndicator: '24',
+            paginator: '30',
+            rating: '18',
         },
-    },
-    sizes: {
-        toggler: {
-            default: '36',
-            defaultTag: '36',
-            tagMap: {
-                24: '18',
-                30: '18',
+        alert: {
+            action: {
                 36: '24',
-                42: '30',
-                48: '36',
+                48: '30',
             },
         },
-        body: {
-            maxHeight: 300,
-            minWidth: 360,
-            padding: '12',
-            defaultRow: '36',
-            defaultItem: '36',
-            itemAvatarMap: {
+        notificationCard: {
+            action: '30',
+        },
+        tag: {
+            countIndicator: {
+                18: '12',
                 24: '18',
-                30: '24',
-                36: '30',
-                42: '36',
-                48: '36',
-            },
-            itemAvatarMultilineMap: {
-                24: '30',
-                30: '30',
-                36: '36',
-                42: '42',
-                48: '48',
+                30: '18',
+                36: '18',
+                42: '24',
+                48: '24',
             },
-            itemVerticalPaddingMap: {
-                24: '3',
-                30: '6',
-                36: '9',
-                42: '6',
-                48: '9',
+        },
+        pickerInput: {
+            toggler: {
+                defaults: {
+                    size: '36',
+                    tag: '36',
+                },
+                tag: {
+                    24: '18',
+                    30: '18',
+                    36: '24',
+                    42: '30',
+                    48: '36',
+                    60: '42',
+                },
             },
-            cellIsBoldSelectionIcon: {
-                24: true,
+            body: {
+                dropdown: {
+                    height: 300,
+                    width: 360,
+                    padding: '12',
+                    row: {
+                        default: '36',
+                        cell: {
+                            padding: '24',
+                            text: {
+                                24: '24',
+                                30: '30',
+                                36: '36',
+                                42: '42',
+                                48: '48',
+                                60: '48',
+                            },
+                            icon: {
+                                24: '12',
+                                30: '18',
+                                36: '18',
+                                42: '24',
+                                48: '24',
+                                60: '24',
+                            },
+                            isBoldSelectionIcon: {
+                                24: true,
+                            },
+                            item: {
+                                default: '36',
+                                verticalPadding: {
+                                    24: '3',
+                                    30: '6',
+                                    36: '9',
+                                    42: '6',
+                                    48: '9',
+                                },
+                                avatar: {
+                                    rest: {
+                                        24: '18',
+                                        30: '24',
+                                        36: '30',
+                                        42: '36',
+                                        48: '36', // no design
+                                    },
+                                    multiline: {
+                                        24: '30',
+                                        30: '30',
+                                        36: '36',
+                                        42: '42',
+                                        48: '48', // no design
+                                    },
+                                },
+                            },
+                        },
+                    },
+                    footer: {
+                        switch: {
+                            24: '12',
+                            30: '18',
+                            36: '18',
+                            42: '24',
+                            48: '24',
+                        },
+                        linkButton: {
+                            24: '24',
+                            30: '30',
+                            36: '36',
+                            42: '42',
+                            48: '48',
+                        },
+                    },
+                },
+                mobile: {
+                    header: {
+                        titleSize: '48',
+                    },
+                    footer: {
+                        linkButton: '48',
+                    },
+                    row: '48',
+                    searchInput: '48',
+                },
+                modal: {
+                    row: '36',
+                    padding: '24',
+                },
             },
-            cellTextMap: {
-                24: '24',
-                30: '30',
-                36: '36',
-                42: '42',
-                48: '48',
+        },
+        rowAddons: {
+            defaults: {
+                icon: '18',
+                indentUnit: 24,
+                indentWidth: 18,
             },
-            cellIconMap: {
+            checkbox: {
                 24: '12',
                 30: '18',
                 36: '18',
-                42: '24',
-                48: '24',
+                42: '18',
+                48: '18',
+                60: '18',
             },
-            cellPadding: '24',
-            defaultFooter: '36',
-            footerSwitchMap: {
+            icon: {
                 24: '12',
                 30: '18',
                 36: '18',
                 42: '24',
                 48: '24',
+                60: '24',
+            },
+            indentUnit: {
+                24: 6,
+                30: 12,
+                36: 12,
+                42: 24,
+                48: 24,
+                60: 24,
+            },
+            indentWidth: {
+                24: 12,
+                30: 18,
+                36: 18,
+                42: 24,
+                48: 24,
+                60: 24,
             },
-            mobileHeaderTitleSize: '48',
-            mobileFooterLinkButton: '48',
-            mobileRow: '48',
-            mobileSearchInput: '48',
-            modalRow: '36',
-            modalPadding: '24',
         },
-    },
-};
-const radioInputSettings = {
-    icons: {
-        dotIcon: ForwardRef$q,
-    },
-    sizes: {
-        default: '18',
-    },
-};
-const rangeDatePickerSettings = {
-    icons: {
-        input: {
-            calendarIcon: ForwardRef$M,
+        text: {
+            18: { lineHeight: 12, fontSize: 10 },
+            24: { lineHeight: 18, fontSize: 12 },
+            30: { lineHeight: 18, fontSize: 14 },
+            36: { lineHeight: 18, fontSize: 14 },
+            42: { lineHeight: 24, fontSize: 16 },
+            48: { lineHeight: 24, fontSize: 16 },
+            60: { lineHeight: 30, fontSize: 24 },
         },
-    },
-    sizes: {
-        default: '36',
-    },
-};
-const ratingSettings = {
-    icons: {
-        filledRatingIcon: ForwardRef$c,
-        emptyRatingIcon: ForwardRef$c,
-    },
-    sizes: {
-        default: 18,
-    },
-};
-const richTextViewSettings = {
-    sizes: {
-        default: '14',
-    },
-};
-const rowAddonsSettings = {
-    icons: {
-        foldingIcon: ForwardRef$Q,
-    },
-    sizes: {
-        defaultIcon: '18',
-        defaultIndentUnit: 24,
-        defaultIndentWidth: 18,
-        checkboxMap: {
-            24: '12',
-            30: '18',
-            36: '18',
-            42: '18',
-            48: '18',
-            60: '18',
+        filtersPanel: {
+            pickerInput: {
+                body: {
+                    default: '36',
+                },
+            },
         },
-        iconMap: {
-            24: '12',
-            30: '18',
-            36: '18',
-            42: '24',
-            48: '24',
-            60: '24',
+        labeledInput: {
+            fillIcon: ['24', '30'],
         },
-        indentUnitMap: {
-            24: 6,
-            30: 12,
-            36: 12,
-            42: 24,
-            48: 24,
-            60: 24,
+        badge: {
+            countIndicator: {
+                18: '12',
+                24: '18',
+                30: '18',
+                36: '18',
+                42: '24',
+                48: '24',
+            },
         },
-        indentWidthMap: {
-            24: 12,
-            30: 18,
-            36: 18,
-            42: 24,
-            48: 24,
-            60: 24,
+        dataTable: {
+            header: {
+                row: {
+                    default: '36',
+                    cell: {
+                        defaults: {
+                            size: '36',
+                            resizeMarker: '12',
+                            padding: '12',
+                            paddingEdge: '24',
+                        },
+                        checkbox: {
+                            36: '18',
+                            48: '18',
+                            60: '18',
+                        },
+                        columnCaption: {
+                            fontSize: '14',
+                            fontWeight: '400',
+                            size: '18',
+                            uppercase: '12',
+                        },
+                        iconSize: {
+                            36: '18',
+                            48: '18',
+                            60: '18',
+                        },
+                        truncate: ['48'],
+                    },
+                    groupCell: {
+                        defaults: {
+                            size: '36',
+                            padding: '12',
+                            paddingEdge: '24',
+                        },
+                        columnCaption: {
+                            fontSize: '14',
+                            fontWeight: '400',
+                            size: '18',
+                            uppercase: '12',
+                        },
+                        iconSize: {
+                            36: '18',
+                            48: '18',
+                            60: '18',
+                        },
+                        truncate: ['48'],
+                    },
+                },
+            },
+            body: {
+                row: {
+                    default: '36',
+                    cell: {
+                        defaults: {
+                            size: '36',
+                            padding: '12',
+                            paddingEdge: '24',
+                        },
+                        text: {
+                            18: '18',
+                            24: '24',
+                            30: '30',
+                            36: '36',
+                            42: '42',
+                            48: '48',
+                            60: '48',
+                        },
+                    },
+                },
+            },
+            columnsConfigurationModal: {
+                columnRow: '30',
+                countIndicator: '18',
+                subgroupIcon: '18',
+                search: '30',
+                width: 560,
+            },
         },
-    },
-};
-const statusIndicatorSettings = {
-    sizes: {
-        default: '24',
-    },
-};
-const switchSettings = {
-    sizes: {
-        default: '18',
-    },
-};
-const tabButtonSettings = {
-    icons: {
-        clearIcon: ForwardRef$R,
-        dropdownIcon: ForwardRef$Q,
-    },
-    sizes: {
-        default: '48',
-        countIndicatorMap: {
-            36: '18',
-            48: '18',
-            60: '18',
+        modal: {
+            window: {
+                defaults: {
+                    width: 420,
+                },
+            },
         },
-    },
-};
-const tagSettings = {
-    icons: {
-        clearIcon: ForwardRef$R,
-        dropdownIcon: ForwardRef$Q,
-    },
-    sizes: {
-        default: '36',
-        countIndicatorMap: {
-            18: '12',
-            24: '18',
-            30: '18',
-            36: '18',
-            42: '24',
-            48: '24',
+        tabButton: {
+            countIndicator: {
+                36: '18',
+                48: '18',
+                60: '18',
+            },
         },
     },
 };
-const textSettings = {
-    sizes: {
-        default: '36',
-    },
-};
-const textAreaSettings = {
-    sizes: {
-        default: '36',
-    },
-};
-const textInputSettings = {
-    icons: {
-        acceptIcon: ForwardRef$P,
-        clearIcon: ForwardRef$R,
-        dropdownIcon: ForwardRef$Q,
-        searchIcon: ForwardRef$N,
-    },
-    sizes: {
-        default: '36',
-    },
-};
-const settings = {
-    accordion: accordionSettings,
-    alert: alertSettings,
-    badge: badgeSettings,
-    button: buttonSettings,
-    checkbox: checkboxSettings,
-    countIndicator: countIndicatorSettings,
-    dataTable: dataTableSettings,
-    datePicker: datePickerSettings,
-    dropdownMenu: dropdownMenuSettings,
-    flexRow: flexRowSettings,
-    fileCard: fileCardSettings,
-    filtersPanel: filtersPanelSettings,
-    iconButton: iconButtonSettings,
-    labeledInput: labeledInputSettings,
-    linkButton: linkButtonSettings,
-    modal: modalSettings,
-    notificationCard: notificationCardSettings,
-    numericInput: numericInputSettings,
-    paginator: paginatorSettings,
-    pickerInput: pickerInputSettings,
-    radioInput: radioInputSettings,
-    rangeDatePicker: rangeDatePickerSettings,
-    rating: ratingSettings,
-    richTextView: richTextViewSettings,
-    rowAddons: rowAddonsSettings,
-    statusIndicator: statusIndicatorSettings,
-    switch: switchSettings,
-    tabButton: tabButtonSettings,
-    tag: tagSettings,
-    text: textSettings,
-    textArea: textAreaSettings,
-    textInput: textInputSettings,
-};
 
-var css$1y = {"root":"d-vtb7"};
+var css$1y = {"root":"QSR4oU"};
 
 function applyButtonMods(mods) {
     return [
@@ -1366,17 +603,17 @@ function applyButtonMods(mods) {
         'uui-button',
         `uui-fill-${mods.fill || 'solid'}`,
         `uui-color-${mods.color || 'primary'}`,
-        `uui-size-${mods.size || settings.button.sizes.default}`,
+        `uui-size-${mods.size || settings.sizes.defaults.button}`,
     ];
 }
 const Button = /* @__PURE__ */withMods(uuiComponents.Button, applyButtonMods, () => {
     return {
-        dropdownIcon: settings.button.icons.dropdownIcon,
-        clearIcon: settings.button.icons.clearIcon,
+        dropdownIcon: systemIcons.foldingArrow,
+        clearIcon: systemIcons.clear,
     };
 });
 
-var css$1x = {"root":"NEjHvz"};
+var css$1x = {"root":"jvnTri"};
 
 function applyIconButtonMods(props) {
     return ['uui-icon_button', `uui-color-${props.color || 'neutral'}`, css$1x.root];
@@ -1392,7 +629,7 @@ const IconButton = /* @__PURE__ */withMods(uuiComponents.IconButton, applyIconBu
         });
     }
     return {
-        dropdownIcon: props.dropdownIcon || settings.iconButton.icons.dropdownIcon,
+        dropdownIcon: props.dropdownIcon || systemIcons.foldingArrow,
     };
 });
 
@@ -1413,9 +650,10 @@ function getIconClass(props) {
     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'];
 }
 
-var css$1w = {"root":"Y-9s1L"};
+var css$1w = {"root":"YBF7SX"};
 
 const DEFAULT_COLOR = 'primary';
+const DEFAULT_WEIGHT = 'semibold';
 const LinkButton = /* @__PURE__ */React.forwardRef((props, ref) => {
     if (process.env.NODE_ENV !== "production" && props.color === 'contrast') {
         devLogger.warnAboutDeprecatedPropValue({
@@ -1429,13 +667,13 @@ const LinkButton = /* @__PURE__ */React.forwardRef((props, ref) => {
     const rootStyles = [
         'uui-link_button',
         css$1w.root,
-        `uui-size-${props.size || settings.linkButton.sizes.default}`,
+        `uui-size-${props.size || settings.sizes.defaults.linkButton}`,
         ...getIconClass(props),
         `uui-color-${props.color || DEFAULT_COLOR}`,
         props.cx,
     ];
-    const captionStyles = cx(uuiElement.caption, props.underline && `uui-underline-${props.underline}`, `uui-link-button-weight-${props.weight || settings.linkButton.sizes.defaultWeight}`);
-    const DropdownIcon = props.dropdownIcon ? props.dropdownIcon : settings.linkButton.icons.dropdownIcon;
+    const captionStyles = cx(uuiElement.caption, props.underline && `uui-underline-${props.underline}`, `uui-link-button-weight-${props.weight || DEFAULT_WEIGHT}`);
+    const DropdownIcon = props.dropdownIcon ? props.dropdownIcon : systemIcons.foldingArrow;
     return (React.createElement(Clickable, { ...props, type: "button", cx: rootStyles, ref: ref },
         props.icon && props.iconPosition !== 'right' && (React.createElement(IconContainer, { icon: props.icon, onClick: !props.isDisabled ? props.onIconClick : undefined })),
         props.caption && (React.createElement("div", { className: captionStyles }, props.caption)),
@@ -1443,30 +681,30 @@ const LinkButton = /* @__PURE__ */React.forwardRef((props, ref) => {
         props.isDropdown && (React.createElement(IconContainer, { icon: DropdownIcon, flipY: props.isOpen }))));
 });
 
-var css$1v = {"root":"_4b-Y4f"};
+var css$1v = {"root":"pF3LLf"};
 
 const CountIndicator = /* @__PURE__ */forwardRef((props, ref) => {
     return (React__default.createElement("div", { ref: ref, className: cx([
             css$1v.root,
             'uui-count_indicator',
-            `uui-size-${props.size || settings.countIndicator.sizes.default}`,
+            `uui-size-${props.size || settings.sizes.defaults.countIndicator}`,
             props.color && `uui-color-${props.color}`,
             props.cx,
         ]) }, props.caption));
 });
 
-var css$1u = {"root":"QwgtNI","withNotify":"kmXrqU"};
+var css$1u = {"root":"hjs03n","withNotify":"K6ac8E"};
 
 const TabButton = /* @__PURE__ */React__default.forwardRef((props, ref) => {
     const styles = [
         css$1u.root,
         'uui-tab-button',
-        `uui-size-${props.size || settings.tabButton.sizes.default}`,
+        `uui-size-${props.size || settings.sizes.defaults.tabButton}`,
         ...getIconClass(props),
         props.cx,
     ];
-    const DropdownIcon = props.dropdownIcon ? props.dropdownIcon : settings.tabButton.icons.dropdownIcon;
-    const ClearIcon = props.clearIcon ? props.clearIcon : settings.tabButton.icons.clearIcon;
+    const DropdownIcon = props.dropdownIcon ? props.dropdownIcon : systemIcons.foldingArrow;
+    const ClearIcon = props.clearIcon ? props.clearIcon : systemIcons.clear;
     return (React__default.createElement(Clickable, { ...props, rawProps: {
             role: 'tab',
             'aria-haspopup': props.isDropdown,
@@ -1478,54 +716,86 @@ const TabButton = /* @__PURE__ */React__default.forwardRef((props, ref) => {
             props.caption,
             props.withNotify && React__default.createElement("div", { className: css$1u.withNotify }))),
         props.icon && props.iconPosition === 'right' && (React__default.createElement(IconContainer, { icon: props.icon, onClick: !props.isDisabled ? props.onIconClick : undefined })),
-        props.count !== undefined && props.count !== null && (React__default.createElement(CountIndicator, { color: "neutral", size: settings.tabButton.sizes.countIndicatorMap[props.size || settings.tabButton.sizes.default], caption: props.count })),
+        props.count !== undefined && props.count !== null && (React__default.createElement(CountIndicator, { color: "neutral", size: settings.sizes.tabButton.countIndicator[props.size || settings.sizes.defaults.tabButton], caption: props.count })),
         props.isDropdown && (React__default.createElement(IconContainer, { icon: DropdownIcon, flipY: props.isOpen })),
         props.onClear && !props.isDisabled && (React__default.createElement(IconContainer, { cx: uuiMarkers.clickable, icon: ClearIcon, onClick: props.onClear }))));
 });
 
-var css$1t = {"root":"duYBoK"};
+var css$1t = {"root":"CQJU-T"};
 
 function applyVerticalTabButtonMods() {
     return [css$1t.root, 'uui-vertical-tab-button'];
 }
 const VerticalTabButton = /* @__PURE__ */withMods(TabButton, applyVerticalTabButtonMods);
 
-var css$1s = {"root":"vi8-KJ","mode-cell":"c2YyvB","modeCell":"c2YyvB"};
+var _path$C;
+function _extends$C() { return _extends$C = 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$C.apply(null, arguments); }
+var SvgContentMinusOutline = function SvgContentMinusOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$C({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$C || (_path$C = /*#__PURE__*/React.createElement("path", {
+    d: "M19 10.5H5v3h14v-3z"
+  })));
+};
+var ForwardRef$C = /*#__PURE__*/forwardRef(SvgContentMinusOutline);
+
+var css$1s = {"root":"a8I78W","mode-cell":"dNAMTo","modeCell":"dNAMTo"};
 
 function applyCheckboxMods(mods) {
     return [
         css$1s.root,
-        `uui-size-${mods.size || settings.checkbox.sizes.default}`,
+        `uui-size-${mods.size || settings.sizes.defaults.checkbox}`,
         css$1s['mode-' + (mods.mode || 'form')],
         'uui-color-primary',
     ];
 }
 const applyUUICheckboxProps = (props) => {
+    const defaultIcon = ForwardRef$P;
+    const defaultIndeterminateIcon = ForwardRef$C;
     return {
-        icon: props.icon ? props.icon : settings.checkbox.icons.checkIcon,
-        indeterminateIcon: props.indeterminateIcon ? props.indeterminateIcon : settings.checkbox.icons.indeterminateIcon,
+        icon: props.icon ? props.icon : defaultIcon,
+        indeterminateIcon: props.indeterminateIcon ? props.indeterminateIcon : defaultIndeterminateIcon,
     };
 };
 const Checkbox = /* @__PURE__ */withMods(uuiComponents.Checkbox, applyCheckboxMods, applyUUICheckboxProps);
 
-var css$1r = {"root":"_2e9UJQ"};
+var _path$B;
+function _extends$B() { return _extends$B = 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$B.apply(null, arguments); }
+var SvgRadioDotFill = function SvgRadioDotFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$B({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$B || (_path$B = /*#__PURE__*/React.createElement("path", {
+    d: "M12 19a7 7 0 1 0 0-14 7 7 0 0 0 0 14z"
+  })));
+};
+var ForwardRef$B = /*#__PURE__*/forwardRef(SvgRadioDotFill);
+
+var css$1r = {"root":"R64O52"};
 
 function applyRadioInputMods(mods) {
     return [
         css$1r.root,
-        `uui-size-${mods.size || settings.radioInput.sizes.default}`,
+        `uui-size-${mods.size || settings.sizes.defaults.radioInput}`,
         'uui-radio-input-container',
         'uui-color-primary',
     ];
 }
-const RadioInput = /* @__PURE__ */withMods(RadioInput$1, applyRadioInputMods, (props) => ({ icon: props.icon ? props.icon : settings.radioInput.icons.dotIcon }));
+const RadioInput = /* @__PURE__ */withMods(RadioInput$1, applyRadioInputMods, (props) => ({ icon: props.icon ? props.icon : ForwardRef$B }));
 
-var css$1q = {"root":"jwSD61"};
+var css$1q = {"root":"Dvdp8D"};
 
 function applySwitchMods(mods) {
     return [
         css$1q.root,
-        `uui-size-${mods.size || settings.switch.sizes.default}`,
+        `uui-size-${mods.size || settings.sizes.defaults.switch}`,
         'uui-color-primary',
     ];
 }
@@ -1544,20 +814,20 @@ var EditMode;
     EditMode["INLINE"] = "inline";
 })(EditMode || (EditMode = {}));
 
-var textInputCss = {"root":"xhpwcN","mode-form":"gn91Dj","modeForm":"gn91Dj","mode-inline":"niekkE","modeInline":"niekkE","mode-cell":"EQ0J1q","modeCell":"EQ0J1q"};
+var textInputCss = {"root":"to97Tw","mode-form":"MNm67V","modeForm":"MNm67V","mode-inline":"A-SFpg","modeInline":"A-SFpg","mode-cell":"LR8puL","modeCell":"LR8puL"};
 
 const DEFAULT_MODE$3 = EditMode.FORM;
 function applyTextInputMods(mods) {
     return [
         textInputCss.root,
-        `uui-size-${mods.size || settings.textInput.sizes.default}`,
+        `uui-size-${mods.size || settings.sizes.defaults.textInput}`,
         textInputCss['mode-' + (mods.mode || DEFAULT_MODE$3)],
     ];
 }
 const TextInput = /* @__PURE__ */withMods(TextInput$1, applyTextInputMods, () => ({
-    acceptIcon: settings.textInput.icons.acceptIcon,
-    cancelIcon: settings.textInput.icons.clearIcon,
-    dropdownIcon: settings.textInput.icons.dropdownIcon,
+    acceptIcon: systemIcons.accept,
+    cancelIcon: systemIcons.clear,
+    dropdownIcon: systemIcons.foldingArrow,
 }));
 const SearchInput = /* @__PURE__ */React__default.forwardRef((props, ref) => {
     // analytics events are sending in IEditableDebouncer, so we need to avoid sending events in TextInput
@@ -1565,11 +835,11 @@ const SearchInput = /* @__PURE__ */React__default.forwardRef((props, ref) => {
     delete textInputProps.getValueChangeAnalyticsEvent;
     return (React__default.createElement(IEditableDebouncer, { ...props, render: (iEditable) => {
             const defaultOnCancel = () => iEditable.onValueChange('');
-            return (React__default.createElement(TextInput, { icon: settings.textInput.icons.searchIcon, onCancel: props.onCancel ?? defaultOnCancel, type: "search", inputMode: "search", ref: ref, ...textInputProps, ...iEditable }));
+            return (React__default.createElement(TextInput, { icon: systemIcons.search, onCancel: props.onCancel ?? defaultOnCancel, type: "search", inputMode: "search", ref: ref, ...textInputProps, ...iEditable }));
         } }));
 });
 
-var css$1p = {"root":"cO-Wk7"};
+var css$1p = {"root":"V-JlZM"};
 
 const ControlGroup = /* @__PURE__ */withMods(ControlGroup$1, () => [css$1p.root, 'uui-control-group']);
 
@@ -1585,34 +855,34 @@ function MultiSwitchComponent(props, ref) {
 }
 const MultiSwitch = /* @__PURE__ */React.forwardRef(MultiSwitchComponent);
 
-var css$1o = {"root":"OeiA-z","mode-form":"wVjIe5","modeForm":"wVjIe5","mode-cell":"-aUjVU","modeCell":"-aUjVU"};
+var css$1o = {"root":"Jm2ZIs","mode-form":"AV6TUg","modeForm":"AV6TUg","mode-cell":"PmNN5C","modeCell":"PmNN5C"};
 
 const DEFAULT_MODE$2 = EditMode.FORM;
 function applyNumericInputMods(mods) {
     return [
         textInputCss.root,
         css$1o.root,
-        `uui-size-${mods.size || settings.numericInput.sizes.default}`,
+        `uui-size-${mods.size || settings.sizes.defaults.numericInput}`,
         textInputCss['mode-' + (mods.mode || DEFAULT_MODE$2)],
     ];
 }
 const NumericInput = /* @__PURE__ */withMods(NumericInput$1, applyNumericInputMods, (props) => {
     return {
-        upIcon: settings.numericInput.icons.arrowIcon,
-        downIcon: settings.numericInput.icons.arrowIcon,
+        upIcon: systemIcons.foldingArrow,
+        downIcon: systemIcons.foldingArrow,
         align: props.align ?? (props.mode === 'cell' ? 'right' : 'left'),
         disableArrows: props.disableArrows ?? props.mode === 'cell',
     };
 });
 
-var css$1n = {"root":"_3Wa1M2","mode-form":"TC0tXV","modeForm":"TC0tXV","mode-cell":"rtq1U8","modeCell":"rtq1U8","mode-inline":"DTfoE8","modeInline":"DTfoE8"};
+var css$1n = {"root":"V7sKOK","mode-form":"Bx-XHz","modeForm":"Bx-XHz","mode-cell":"XjgkM4","modeCell":"XjgkM4","mode-inline":"G93570","modeInline":"G93570"};
 
 const DEFAULT_MODE$1 = EditMode.FORM;
 function applyTextAreaMods(mods) {
     return [
         css$1n.root,
         'uui-textarea',
-        'uui-size-' + (mods.size || settings.textArea.sizes.default),
+        'uui-size-' + (mods.size || settings.sizes.defaults.textArea),
         css$1n['mode-' + (mods.mode || DEFAULT_MODE$1)],
     ];
 }
@@ -1646,25 +916,85 @@ function TREE_SHAKEABLE_INIT$1() {
     };
 }
 
-var css$1m = {"root":"VtKLf9","main-path":"_3fUaYd","mainPath":"_3fUaYd","content-wrapper":"XQwD-4","contentWrapper":"XQwD-4","content":"YxjJ-A","action-wrapper":"PC4lfh","actionWrapper":"PC4lfh","icon-wrapper":"j7T0Dt","iconWrapper":"j7T0Dt","icon":"sPXMNQ","close-icon":"_3s0v2Y","closeIcon":"_3s0v2Y"};
+var _path$A;
+function _extends$A() { return _extends$A = 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$A.apply(null, arguments); }
+var SvgNotificationCheckFill = function SvgNotificationCheckFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$A({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$A || (_path$A = /*#__PURE__*/React.createElement("path", {
+    d: "m10.6 16.6 7.05-7.05-1.4-1.4-5.65 5.65-2.85-2.85-1.4 1.4 4.25 4.25zM12 22a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22z"
+  })));
+};
+var ForwardRef$A = /*#__PURE__*/forwardRef(SvgNotificationCheckFill);
+
+var _path$z;
+function _extends$z() { return _extends$z = 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$z.apply(null, arguments); }
+var SvgNotificationWarningFill = function SvgNotificationWarningFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$z({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$z || (_path$z = /*#__PURE__*/React.createElement("path", {
+    d: "M1 21 12 2l11 19H1zm11-3a.968.968 0 0 0 .713-.288A.967.967 0 0 0 13 17a.967.967 0 0 0-.287-.712A.968.968 0 0 0 12 16a.965.965 0 0 0-.712.288A.965.965 0 0 0 11 17c0 .283.096.52.288.712A.965.965 0 0 0 12 18zm-1-3h2v-5h-2v5z"
+  })));
+};
+var ForwardRef$z = /*#__PURE__*/forwardRef(SvgNotificationWarningFill);
+
+var _path$y;
+function _extends$y() { return _extends$y = 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$y.apply(null, arguments); }
+var SvgNotificationErrorFill = function SvgNotificationErrorFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$y({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$y || (_path$y = /*#__PURE__*/React.createElement("path", {
+    d: "M12 17a.968.968 0 0 0 .713-.288A.967.967 0 0 0 13 16a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 15a.967.967 0 0 0-.712.287A.968.968 0 0 0 11 16c0 .283.096.52.288.712A.965.965 0 0 0 12 17zm-1-4h2V7h-2v6zm1 9a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22z"
+  })));
+};
+var ForwardRef$y = /*#__PURE__*/forwardRef(SvgNotificationErrorFill);
+
+var _path$x;
+function _extends$x() { return _extends$x = 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$x.apply(null, arguments); }
+var SvgNotificationInfoFill = function SvgNotificationInfoFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$x({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$x || (_path$x = /*#__PURE__*/React.createElement("path", {
+    d: "M11 17h2v-6h-2v6zm1-8a.968.968 0 0 0 .713-.288A.967.967 0 0 0 13 8a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 7a.967.967 0 0 0-.712.287A.968.968 0 0 0 11 8c0 .283.096.52.288.712A.965.965 0 0 0 12 9zm0 13a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22z"
+  })));
+};
+var ForwardRef$x = /*#__PURE__*/forwardRef(SvgNotificationInfoFill);
+
+var css$1m = {"root":"VrQhCb","main-path":"d-ygX3","mainPath":"d-ygX3","content-wrapper":"v9g4lL","contentWrapper":"v9g4lL","content":"h3I1E9","action-wrapper":"GiryMB","actionWrapper":"GiryMB","icon-wrapper":"_3ij4QT","iconWrapper":"_3ij4QT","icon":"FI-A5A","close-icon":"dC9pjw","closeIcon":"dC9pjw"};
 
-const Alert = /* @__PURE__ */React.forwardRef((props, ref) => (React.createElement("div", { role: "alert", ref: ref, className: cx('uui-alert', css$1m.root, props.color && `uui-color-${props.color}`, props.cx, `uui-size-${props.size || settings.alert.sizes.default}`), ...props.rawProps },
+const Alert = /* @__PURE__ */React.forwardRef((props, ref) => (React.createElement("div", { role: "alert", ref: ref, className: cx('uui-alert', css$1m.root, props.color && `uui-color-${props.color}`, props.cx, `uui-size-${props.size || settings.sizes.defaults.alert}`), ...props.rawProps },
     React.createElement("div", { className: css$1m.mainPath },
         React.createElement("div", { className: css$1m.contentWrapper },
             props.icon && (React.createElement("div", { className: css$1m.iconWrapper },
                 React.createElement(IconContainer, { icon: props.icon, cx: css$1m.icon }))),
             React.createElement("div", { className: css$1m.content },
                 props.children,
-                props.actions && (React.createElement("div", { className: css$1m.actionWrapper }, props.actions.map((action) => (React.createElement(LinkButton, { caption: action.name, onClick: action.action, key: action.name, cx: css$1m.actionLink, size: settings.alert.sizes.actionMap[props.size || settings.alert.sizes.default] }))))))),
-        props.onClose && React.createElement(IconButton, { icon: settings.alert.icons.closeIcon, color: "neutral", onClick: props.onClose, cx: css$1m.closeIcon })))));
-const WarningAlert = /* @__PURE__ */React.forwardRef((props, ref) => React.createElement(Alert, { icon: settings.alert.icons.warningIcon, color: "warning", ref: ref, ...props }));
-const SuccessAlert = /* @__PURE__ */React.forwardRef((props, ref) => React.createElement(Alert, { icon: settings.alert.icons.successIcon, color: "success", ref: ref, ...props }));
-const HintAlert = /* @__PURE__ */React.forwardRef((props, ref) => React.createElement(Alert, { icon: settings.alert.icons.infoIcon, color: "info", ref: ref, ...props }));
-const ErrorAlert = /* @__PURE__ */React.forwardRef((props, ref) => React.createElement(Alert, { icon: settings.alert.icons.errorIcon, color: "error", ref: ref, ...props }));
+                props.actions && (React.createElement("div", { className: css$1m.actionWrapper }, props.actions.map((action) => (React.createElement(LinkButton, { caption: action.name, onClick: action.action, key: action.name, cx: css$1m.actionLink, size: settings.sizes.alert.action[props.size || settings.sizes.defaults.alert] }))))))),
+        props.onClose && React.createElement(IconButton, { icon: ForwardRef$R, color: "neutral", onClick: props.onClose, cx: css$1m.closeIcon })))));
+const WarningAlert = /* @__PURE__ */React.forwardRef((props, ref) => React.createElement(Alert, { icon: ForwardRef$z, color: "warning", ref: ref, ...props }));
+const SuccessAlert = /* @__PURE__ */React.forwardRef((props, ref) => React.createElement(Alert, { icon: ForwardRef$A, color: "success", ref: ref, ...props }));
+const HintAlert = /* @__PURE__ */React.forwardRef((props, ref) => React.createElement(Alert, { icon: ForwardRef$x, color: "info", ref: ref, ...props }));
+const ErrorAlert = /* @__PURE__ */React.forwardRef((props, ref) => React.createElement(Alert, { icon: ForwardRef$y, color: "error", ref: ref, ...props }));
 
 const Dropdown = /* @__PURE__ */withMods(Dropdown$1);
 
-var css$1l = {"root":"SPnwej"};
+var css$1l = {"root":"gisgJG"};
 
 function applyDropdownContainerMods(mods) {
     return [
@@ -1675,7 +1005,7 @@ function applyDropdownContainerMods(mods) {
 }
 const DropdownContainer = /* @__PURE__ */withMods(uuiComponents.DropdownContainer, applyDropdownContainerMods);
 
-var css$1k = {"submenu-root-item-rtl":"x82ltF","submenuRootItemRtl":"x82ltF","icon-after":"-MxcoL","iconAfter":"-MxcoL","submenu-root-item":"NyPR1f","submenuRootItem":"NyPR1f","icon-check":"ESimiz","iconCheck":"ESimiz","splitter-root":"bISovD","splitterRoot":"bISovD","splitter":"Jz38ZD","header-root":"UX-fSE","headerRoot":"UX-fSE","item-root":"yRCQfp","itemRoot":"yRCQfp","icon":"qUolpc","link":"PbM3Tj","indent":"tbRZrm","selected-mark":"VEte4G","selectedMark":"VEte4G"};
+var css$1k = {"submenu-root-item-rtl":"sXS-va","submenuRootItemRtl":"sXS-va","icon-after":"_8TOGsB","iconAfter":"_8TOGsB","submenu-root-item":"SjLiLV","submenuRootItem":"SjLiLV","icon-check":"B-iZ9Y","iconCheck":"B-iZ9Y","splitter-root":"ck4OnD","splitterRoot":"ck4OnD","splitter":"ZneSX-","header-root":"r92v0P","headerRoot":"r92v0P","item-root":"NJ0wVW","itemRoot":"NJ0wVW","icon":"t-k27O","link":"m0MntC","indent":"yhP0wW","selected-mark":"yJSMGY","selectedMark":"yJSMGY"};
 
 var IDropdownControlKeys;
 (function (IDropdownControlKeys) {
@@ -1758,7 +1088,7 @@ const DropdownMenuButton = /* @__PURE__ */React__default.forwardRef((props, ref)
         getMenuButtonContent(),
         isSelected && (React__default.createElement(React__default.Fragment, null,
             React__default.createElement(FlexSpacer, null),
-            React__default.createElement(IconContainer, { icon: settings.dropdownMenu.icons.acceptIcon, cx: css$1k.selectedMark })))));
+            React__default.createElement(IconContainer, { icon: systemIcons.accept, cx: css$1k.selectedMark })))));
 });
 function DropdownMenuSplitter(props) {
     return (React__default.createElement("div", { className: cx$1(props.cx, css$1k.splitterRoot) },
@@ -1786,7 +1116,7 @@ function DropdownSubMenu(props) {
         },
     ];
     const isRtl = getDir() === 'rtl';
-    return (React__default.createElement(Dropdown$1, { openOnHover: props.openOnHover || true, closeOnMouseLeave: "boundary", openDelay: 400, closeDelay: 400, placement: isRtl ? 'left-start' : 'right-start', modifiers: subMenuModifiers, renderBody: (dropdownProps) => !props.isDisabled && (React__default.createElement(DropdownMenuBody, { closeOnKey: IDropdownControlKeys.LEFT_ARROW, ...props, ...dropdownProps })), renderTarget: ({ toggleDropdownOpening, ...targetProps }) => (React__default.createElement(DropdownMenuButton, { cx: cx$1(isRtl ? css$1k.submenuRootItemRtl : css$1k.submenuRootItem), icon: settings.dropdownMenu.icons.dropdownIcon, iconPosition: "right", isDropdown: true, toggleDropdownOpening: toggleDropdownOpening, ...props, ...targetProps })) }));
+    return (React__default.createElement(Dropdown$1, { openOnHover: props.openOnHover || true, closeOnMouseLeave: "boundary", openDelay: 400, closeDelay: 400, placement: isRtl ? 'left-start' : 'right-start', modifiers: subMenuModifiers, renderBody: (dropdownProps) => !props.isDisabled && (React__default.createElement(DropdownMenuBody, { closeOnKey: IDropdownControlKeys.LEFT_ARROW, ...props, ...dropdownProps })), renderTarget: ({ toggleDropdownOpening, ...targetProps }) => (React__default.createElement(DropdownMenuButton, { cx: cx$1(isRtl ? css$1k.submenuRootItemRtl : css$1k.submenuRootItem), icon: systemIcons.foldingArrow, iconPosition: "right", isDropdown: true, toggleDropdownOpening: toggleDropdownOpening, ...props, ...targetProps })) }));
 }
 function DropdownMenuSwitchButton(props) {
     const context = useContext(UuiContext);
@@ -1809,7 +1139,7 @@ function DropdownMenuSwitchButton(props) {
         React__default.createElement(Switch, { value: isSelected, tabIndex: -1, onValueChange: onHandleValueChange })));
 }
 
-var css$1j = {"root":"n4Qxi1","mode-block":"_5E0En6","modeBlock":"_5E0En6","mode-inline":"DXmCyy","modeInline":"DXmCyy","padding-0":"_9pkYkk","padding0":"_9pkYkk","padding-6":"k-pX-X","padding6":"k-pX-X","padding-12":"sb0Ctd","padding12":"sb0Ctd","padding-18":"tK6Rsv","padding18":"tK6Rsv"};
+var css$1j = {"root":"m8V6uo","mode-block":"mYtYTr","modeBlock":"mYtYTr","mode-inline":"ItOdRc","modeInline":"ItOdRc","padding-0":"_3ylD68","padding0":"_3ylD68","padding-6":"voQfuf","padding6":"voQfuf","padding-12":"G2mP1y","padding12":"G2mP1y","padding-18":"HO9eM6","padding18":"HO9eM6"};
 
 function applyAccordionMods(mods) {
     return [
@@ -1819,10 +1149,10 @@ function applyAccordionMods(mods) {
     ];
 }
 const Accordion = /* @__PURE__ */withMods(uuiComponents.Accordion, applyAccordionMods, (mods) => ({
-    dropdownIcon: mods.dropdownIcon !== null && settings.accordion.icons.dropdownIcon,
+    dropdownIcon: mods.dropdownIcon !== null && systemIcons.foldingArrow,
 }));
 
-var css$1i = {"root":"p3SoMF","border-top":"r2rl2H","borderTop":"r2rl2H","border-bottom":"P5sZcb","borderBottom":"P5sZcb","top-shadow":"urNkpU","topShadow":"urNkpU","padding-6":"_68obJF","padding6":"_68obJF","padding-12":"JaeZBO","padding12":"JaeZBO","padding-18":"_22bpfQ","padding18":"_22bpfQ","padding-24":"qo3lI-","padding24":"qo3lI-","margin-24":"szsB9d","margin24":"szsB9d","margin-12":"_35EtG0","margin12":"_35EtG0","vPadding-12":"PF1fJe","vPadding12":"PF1fJe","vPadding-18":"_79yHKt","vPadding18":"_79yHKt","vPadding-24":"e8K1l7","vPadding24":"e8K1l7","vPadding-36":"g3ecEa","vPadding36":"g3ecEa","vPadding-48":"AMABAP","vPadding48":"AMABAP","spacing-6":"IJHJxy","spacing6":"IJHJxy","spacing-12":"pgG52G","spacing12":"pgG52G","spacing-18":"HPlRa3","spacing18":"HPlRa3","uui-surface-main":"_-8YYsY","uuiSurfaceMain":"_-8YYsY"};
+var css$1i = {"root":"XC8PvU","border-top":"u26Rwf","borderTop":"u26Rwf","border-bottom":"TnFBOj","borderBottom":"TnFBOj","top-shadow":"f0Js4k","topShadow":"f0Js4k","padding-6":"a--H3F","padding6":"a--H3F","padding-12":"lvGN-M","padding12":"lvGN-M","padding-18":"PlQ2Kw","padding18":"PlQ2Kw","padding-24":"pLJ7jw","padding24":"pLJ7jw","margin-24":"gBC3G1","margin24":"gBC3G1","margin-12":"rDld9P","margin12":"rDld9P","vPadding-12":"a3Df7U","vPadding12":"a3Df7U","vPadding-18":"vgwMCi","vPadding18":"vgwMCi","vPadding-24":"HtjLwg","vPadding24":"HtjLwg","vPadding-36":"IqVT27","vPadding36":"IqVT27","vPadding-48":"Paj9iV","vPadding48":"Paj9iV","spacing-6":"M0dJd5","spacing6":"M0dJd5","spacing-12":"IPjL3K","spacing12":"IPjL3K","spacing-18":"fEYmEx","spacing18":"fEYmEx","uui-surface-main":"jT3V3U","uuiSurfaceMain":"jT3V3U"};
 
 const FlexCell = /* @__PURE__ */withMods(FlexCell$1, () => [css$1i.flexCell]);
 
@@ -1834,7 +1164,7 @@ const FlexRow = /* @__PURE__ */withMods(FlexRow$1, (props) => {
     }
     return [
         css$1i.root,
-        props.size !== null && 'uui-size-' + (props.size || settings.flexRow.sizes.default),
+        props.size !== null && 'uui-size-' + (props.size || settings.sizes.defaults.flexRow),
         props.padding && css$1i['padding-' + props.padding],
         props.vPadding && css$1i['vPadding-' + props.vPadding],
         props.margin && css$1i['margin-' + props.margin],
@@ -1846,7 +1176,7 @@ const FlexRow = /* @__PURE__ */withMods(FlexRow$1, (props) => {
     ];
 });
 
-var css$1h = {"root":"wTl4-z","margin-24":"_9gWLqd","margin24":"_9gWLqd","padding-12":"oQPlAf","padding12":"oQPlAf","padding-24":"MjNo7N","padding24":"MjNo7N","shadow":"F9srRs","uui-surface-main":"ISvApt","uuiSurfaceMain":"ISvApt"};
+var css$1h = {"root":"-OtOdq","margin-24":"b9QkOx","margin24":"b9QkOx","padding-12":"ostEg6","padding12":"ostEg6","padding-24":"_9Q7mcx","padding24":"_9Q7mcx","shadow":"pvlA-X","uui-surface-main":"bL019v","uuiSurfaceMain":"bL019v"};
 
 const Panel = /* @__PURE__ */withMods(VPanel, (props) => [
     'uui-panel',
@@ -1856,7 +1186,7 @@ const Panel = /* @__PURE__ */withMods(VPanel, (props) => [
     props.background && css$1h[`uui-${props.background}`],
 ]);
 
-var css$1g = {"root":"GCj2tU"};
+var css$1g = {"root":"G2Zset"};
 
 function applyTooltipMods(mods) {
     return [
@@ -1866,24 +1196,21 @@ function applyTooltipMods(mods) {
 }
 const Tooltip = /* @__PURE__ */withMods(uuiComponents.Tooltip, applyTooltipMods);
 
-var css$1f = {"root":"mm3dGl"};
+var css$1f = {"root":"NxERgG"};
 
 function applyLabeledInputMods(mods) {
     return [
         'uui-labeled-input',
         css$1f.root,
-        'uui-size-' + (mods.size || settings.labeledInput.sizes.default),
+        'uui-size-' + (mods.size || settings.sizes.defaults.labeledInput),
     ];
 }
-function applyLabeledInputProps(props) {
-    return ({
-        Tooltip: props.Tooltip || Tooltip,
-        infoIcon: props.infoIcon || props.size <= '30' ? settings.labeledInput.icons.fillInfoIcon : settings.labeledInput.icons.infoIcon,
-    });
-}
-const LabeledInput = /* @__PURE__ */withMods(uuiComponents.LabeledInput, applyLabeledInputMods, applyLabeledInputProps);
+const LabeledInput = /* @__PURE__ */withMods(uuiComponents.LabeledInput, applyLabeledInputMods, (props) => ({
+    Tooltip: props.Tooltip || Tooltip,
+    infoIcon: props.infoIcon || (settings.sizes.labeledInput.fillIcon.includes(props.size) ? ForwardRef$x : ForwardRef$M),
+}));
 
-var css$1e = {"root":"MnJkgX"};
+var css$1e = {"root":"broC2K"};
 
 function RadioGroup(props) {
     const direction = props.direction || 'vertical';
@@ -1898,7 +1225,7 @@ function RadioGroup(props) {
     })));
 }
 
-var css$1d = {"root":"LY2aVp"};
+var css$1d = {"root":"e8lYUP"};
 
 function applyScrollBarsMods() {
     return [
@@ -1907,27 +1234,27 @@ function applyScrollBarsMods() {
 }
 const ScrollBars = /* @__PURE__ */withMods(ScrollBars$1, applyScrollBarsMods);
 
-var css$1c = {"scroll-container":"-U300R","scrollContainer":"-U300R","list-container":"W87Nlo","listContainer":"W87Nlo"};
+var css$1c = {"scroll-container":"f61LEC","scrollContainer":"f61LEC","list-container":"lFVAeX","listContainer":"lFVAeX"};
 
-var css$1b = {"root":"_717rdm"};
+var css$1b = {"root":"PVtRPG"};
 
 const AvatarStack = /* @__PURE__ */withMods(AvatarStack$1, () => [css$1b.root]);
 
-var css$1a = {"root":"HKEOZi"};
+var css$1a = {"root":"d4vdZj"};
 
 const DEFAULT_FILL = 'solid';
 function applyBadgeMods(mods) {
     return [
         'uui-badge',
         css$1a.root,
-        `uui-size-${mods.size || settings.badge.sizes.default}`,
+        `uui-size-${mods.size || settings.sizes.defaults.badge}`,
         `uui-fill-${mods.fill || DEFAULT_FILL}`,
         `uui-color-${mods.color || 'info'}`,
     ];
 }
 const Badge = /* @__PURE__ */React__default.forwardRef((props, ref) => {
     const styles = [applyBadgeMods(props), props.cx];
-    const DropdownIcon = props.dropdownIcon ? props.dropdownIcon : settings.badge.icons.dropdownIcon;
+    const DropdownIcon = props.dropdownIcon ? props.dropdownIcon : systemIcons.foldingArrow;
     return (React__default.createElement(Clickable, { ...props, rawProps: {
             'aria-haspopup': props.isDropdown,
             'aria-expanded': props.isOpen,
@@ -1936,17 +1263,17 @@ const Badge = /* @__PURE__ */React__default.forwardRef((props, ref) => {
         (props.indicator && props.fill === 'outline') && (React__default.createElement("div", { className: "uui-indicator" })),
         props.icon && props.iconPosition !== 'right' && (React__default.createElement(IconContainer, { icon: props.icon, onClick: !props.isDisabled ? props.onIconClick : undefined })),
         props.caption && (React__default.createElement("div", { className: uuiElement.caption }, props.caption)),
-        props.count !== undefined && props.count !== null && (React__default.createElement(CountIndicator, { key: "count-indicator", color: null, size: settings.badge.sizes.countIndicatorMap[props.size || settings.badge.sizes.default], caption: props.count })),
+        props.count !== undefined && props.count !== null && (React__default.createElement(CountIndicator, { key: "count-indicator", color: null, size: settings.sizes.badge.countIndicator[props.size || settings.sizes.defaults.badge], caption: props.count })),
         props.icon && props.iconPosition === 'right' && (React__default.createElement(IconContainer, { icon: props.icon, onClick: !props.isDisabled ? props.onIconClick : undefined })),
         props.isDropdown && (React__default.createElement(IconContainer, { icon: DropdownIcon, flipY: props.isOpen }))));
 });
 
-var css$19 = {"root":"yOJ9YT"};
+var css$19 = {"root":"wQBQLF"};
 
 function applyTagMods(props) {
     return [
         css$19.root,
-        `uui-size-${props.size || settings.tag.sizes.default}`,
+        `uui-size-${props.size || settings.sizes.defaults.tag}`,
         `uui-color-${props.color || 'neutral'}`,
         `uui-fill-${props.fill || 'solid'}`,
         'uui-tag',
@@ -1954,8 +1281,8 @@ function applyTagMods(props) {
 }
 const Tag = /* @__PURE__ */React__default.forwardRef((props, ref) => {
     const styles = [applyTagMods(props), props.cx];
-    const ClearIcon = props.clearIcon ? props.clearIcon : settings.tag.icons.clearIcon;
-    const DropdownIcon = props.dropdownIcon ? props.dropdownIcon : settings.tag.icons.dropdownIcon;
+    const ClearIcon = props.clearIcon ? props.clearIcon : systemIcons.clear;
+    const DropdownIcon = props.dropdownIcon ? props.dropdownIcon : systemIcons.foldingArrow;
     return (React__default.createElement(Clickable, { ...props, rawProps: {
             'aria-haspopup': props.isDropdown,
             'aria-expanded': props.isOpen,
@@ -1963,44 +1290,74 @@ const Tag = /* @__PURE__ */React__default.forwardRef((props, ref) => {
         }, cx: styles, ref: ref },
         props.icon && props.iconPosition !== 'right' && (React__default.createElement(IconContainer, { icon: props.icon, onClick: !props.isDisabled ? props.onIconClick : undefined })),
         props.caption && (React__default.createElement("div", { className: uuiElement.caption }, props.caption)),
-        props.count !== undefined && props.count !== null && (React__default.createElement(CountIndicator, { color: (!props.color || props.color === 'neutral') ? 'white' : props.color, size: settings.tag.sizes.countIndicatorMap[(props.size || settings.tag.sizes.default)], caption: props.count })),
+        props.count !== undefined && props.count !== null && (React__default.createElement(CountIndicator, { color: (!props.color || props.color === 'neutral') ? 'white' : props.color, size: settings.sizes.tag.countIndicator[(props.size || settings.sizes.defaults.tag)], caption: props.count })),
         props.icon && props.iconPosition === 'right' && (React__default.createElement(IconContainer, { icon: props.icon, onClick: !props.isDisabled ? props.onIconClick : undefined })),
         props.isDropdown && (React__default.createElement(IconContainer, { icon: DropdownIcon, flipY: props.isOpen })),
         props.onClear && !props.isDisabled && (React__default.createElement(IconContainer, { cx: uuiMarkers.clickable, icon: ClearIcon, onClick: props.onClear }))));
 });
 
-var css$18 = {"root":"pcqep3","uui-spinner":"K6pzxh","uuiSpinner":"K6pzxh"};
+var css$18 = {"root":"Yefd2r","uui-spinner":"-ll9YV","uuiSpinner":"-ll9YV"};
 
 function applySpinnerMods() {
     return [css$18.root, 'uui-spinner'];
 }
 const Spinner = /* @__PURE__ */withMods(Spinner$1, applySpinnerMods);
 
-var css$17 = {"root":"HIxlcB","page":"NsgjMs","spacer":"FN3yqz","mode-ghost":"qHnrzC","modeGhost":"qHnrzC"};
+var _path$w;
+function _extends$w() { return _extends$w = 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$w.apply(null, arguments); }
+var SvgNavigationChevronLeftOutline = function SvgNavigationChevronLeftOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$w({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$w || (_path$w = /*#__PURE__*/React.createElement("path", {
+    d: "M15.914 5.414 14.5 4l-8 8 8 8 1.414-1.414L9.328 12l6.586-6.586z"
+  })));
+};
+var ForwardRef$w = /*#__PURE__*/forwardRef(SvgNavigationChevronLeftOutline);
+
+var _path$v;
+function _extends$v() { return _extends$v = 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$v.apply(null, arguments); }
+var SvgNavigationChevronRightOutline = function SvgNavigationChevronRightOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$v({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$v || (_path$v = /*#__PURE__*/React.createElement("path", {
+    d: "M8.086 18.586 9.5 20l8-8-8-8-1.414 1.414L14.672 12l-6.586 6.586z"
+  })));
+};
+var ForwardRef$v = /*#__PURE__*/forwardRef(SvgNavigationChevronRightOutline);
+
+var css$17 = {"root":"LxKlHO","page":"c-zdDL","spacer":"xiT7NH","mode-ghost":"TOn93Q","modeGhost":"TOn93Q"};
 
 function Paginator(props) {
-    const renderPaginator = (params) => (React__default.createElement("nav", { role: "navigation", className: cx(css$17.root, 'uui-paginator', `uui-size-${props.size || settings.paginator.sizes.default}`), ...params.rawProps },
-        React__default.createElement(Button, { size: props.size || settings.paginator.sizes.default, icon: settings.paginator.icons.leftArrowIcon, onClick: params.goToPrev, isDisabled: params.isFirst || props.isDisabled, fill: "outline", color: "secondary" }),
+    const renderPaginator = (params) => (React__default.createElement("nav", { role: "navigation", className: cx(css$17.root, 'uui-paginator', `uui-size-${props.size || settings.sizes.defaults.paginator}`), ...params.rawProps },
+        React__default.createElement(Button, { size: props.size || settings.sizes.defaults.paginator, icon: ForwardRef$w, onClick: params.goToPrev, isDisabled: params.isFirst || props.isDisabled, fill: "outline", color: "secondary" }),
         params.pages.map((page, index) => {
             if (page.type === 'spacer') {
-                return (React__default.createElement(Button, { cx: cx(css$17.spacer, css$17.page), size: props.size || settings.paginator.sizes.default, key: `${index}_spacer`, caption: "...", fill: "ghost", color: "secondary", tabIndex: -1, isDisabled: props.isDisabled }));
+                return (React__default.createElement(Button, { cx: cx(css$17.spacer, css$17.page), size: props.size || settings.sizes.defaults.paginator, key: `${index}_spacer`, caption: "...", fill: "ghost", color: "secondary", tabIndex: -1, isDisabled: props.isDisabled }));
             }
             else {
-                return (React__default.createElement(Button, { cx: cx(css$17[`mode-${!page.isActive && 'ghost'}`], css$17.page), size: props.size || settings.paginator.sizes.default, key: page.pageNumber, caption: page.pageNumber, onClick: () => page.onClick?.(), rawProps: { 'aria-current': page.isActive }, fill: (page.isActive && 'outline') || 'ghost', color: "primary", isDisabled: props.isDisabled }));
+                return (React__default.createElement(Button, { cx: cx(css$17[`mode-${!page.isActive && 'ghost'}`], css$17.page), size: props.size || settings.sizes.defaults.paginator, key: page.pageNumber, caption: page.pageNumber, onClick: () => page.onClick?.(), rawProps: { 'aria-current': page.isActive }, fill: (page.isActive && 'outline') || 'ghost', color: "primary", isDisabled: props.isDisabled }));
             }
         }),
-        React__default.createElement(Button, { size: props.size || settings.paginator.sizes.default, icon: settings.paginator.icons.rightArrowIcon, onClick: params.goToNext, isDisabled: params.isLast || props.isDisabled, fill: "outline", color: "secondary" })));
+        React__default.createElement(Button, { size: props.size || settings.sizes.defaults.paginator, icon: ForwardRef$v, onClick: params.goToNext, isDisabled: params.isLast || props.isDisabled, fill: "outline", color: "secondary" })));
     return React__default.createElement(Paginator$1, { ...props, render: renderPaginator });
 }
 
-var css$16 = {"root":"ajyNiA","progress-bar":"_1BPSjb","progressBar":"_1BPSjb","progressBar-indeterminate":"MMO-kI","progressBarIndeterminate":"MMO-kI","size-12":"GinR4e","size12":"GinR4e","size-18":"ANdiFI","size18":"ANdiFI","size-24":"vc-KJr","size24":"vc-KJr"};
+var css$16 = {"root":"_5I5Y1R","progress-bar":"yGkT-C","progressBar":"yGkT-C","progressBar-indeterminate":"h6q4P8","progressBarIndeterminate":"h6q4P8","size-12":"nGsY0z","size12":"nGsY0z","size-18":"-kKH2p","size18":"-kKH2p","size-24":"b5tw8r","size24":"b5tw8r"};
 
 const IndeterminateBar = /* @__PURE__ */React.forwardRef((props, ref) => {
     return (React.createElement("div", { ref: ref, className: cx('uui-indeterminate_bar', props.cx, css$16.root, css$16[`size-${props.size || 12}`]) },
         React.createElement("div", { className: cx(css$16.progressBar) })));
 });
 
-var css$15 = {"root":"s7CpNb","striped":"HPv5f6","animate-stripes":"_5jar3B","animateStripes":"_5jar3B","size-12":"kDHoQC","size12":"kDHoQC","size-18":"YQ-Vpc","size18":"YQ-Vpc","size-24":"oWjJzE","size24":"oWjJzE"};
+var css$15 = {"root":"p9d4oA","striped":"t8wDLx","animate-stripes":"A9qV3D","animateStripes":"A9qV3D","size-12":"_-25wvu","size12":"_-25wvu","size-18":"TZxHUV","size18":"TZxHUV","size-24":"D9j8pp","size24":"D9j8pp"};
 
 const DEFAULT_SIZE = '12';
 function applyProgressBarMods(mods) {
@@ -2015,19 +1372,19 @@ const ProgressBar = /* @__PURE__ */withMods(uuiComponents.ProgressBar, applyProg
     hideLabel: props.hideLabel || props.striped,
 }));
 
-var css$14 = {"root":"k2stgl"};
+var css$14 = {"root":"_7uCHwz"};
 
 const IndicatorBar = /* @__PURE__ */React.forwardRef((props, ref) => {
     const { progress } = props;
     return progress || progress === 0 ? (React.createElement(ProgressBar, { ref: ref, progress: progress, cx: cx(css$14.root, props.cx), hideLabel: true })) : (React.createElement(IndeterminateBar, { ref: ref, cx: cx(css$14.root, props.cx) }));
 });
 
-var css$13 = {"root":"A3-5Xl"};
+var css$13 = {"root":"jfgUlc"};
 
 const StatusIndicator = /* @__PURE__ */forwardRef((props, ref) => {
     return (React__default.createElement("div", { ref: ref, className: cx([
             css$13.root,
-            `uui-size-${props.size || settings.statusIndicator.sizes.default}`,
+            `uui-size-${props.size || settings.sizes.defaults.statusIndicator}`,
             'uui-status_indicator',
             `uui-color-${props.color || 'neutral'}`,
             `uui-fill-${props.fill || 'solid'}`,
@@ -2037,28 +1394,28 @@ const StatusIndicator = /* @__PURE__ */forwardRef((props, ref) => {
         React__default.createElement("p", { className: "uui-status_indicator-caption" }, props.caption)));
 });
 
-var css$12 = {"drag-handle":"lotg-I","dragHandle":"lotg-I","icon-container":"Yvm1XE","iconContainer":"Yvm1XE"};
+var css$12 = {"drag-handle":"O-JuLw","dragHandle":"O-JuLw","icon-container":"KQ-hGd","iconContainer":"KQ-hGd"};
 
 function DataRowAddons(props) {
     const row = props.rowProps;
     const getIndent = () => {
-        return (row.indent - 1) * ((settings.rowAddons.sizes.indentUnitMap[props.size] || settings.rowAddons.sizes.defaultIndentUnit));
+        return (row.indent - 1) * (settings.sizes.rowAddons.indentUnit[props.size] || settings.sizes.rowAddons.defaults.indentUnit);
     };
     const getWidth = () => {
-        return settings.rowAddons.sizes.indentWidthMap[props.size] || settings.rowAddons.sizes.defaultIndentWidth;
+        return settings.sizes.rowAddons.indentWidth[props.size] || settings.sizes.rowAddons.defaults.indentWidth;
     };
     return (React__default.createElement(React__default.Fragment, null,
         row.dnd?.srcData && React__default.createElement(DragHandle, { key: "dh", cx: css$12.dragHandle, rawProps: { ...props.eventHandlers } }),
-        row?.checkbox?.isVisible && (React__default.createElement(Checkbox, { key: "cb", cx: "uui-dr_addons-checkbox", tabIndex: props.tabIndex, size: settings.rowAddons.sizes.checkboxMap[props.size], value: row.isChecked, indeterminate: !row.isChecked && row.isChildrenChecked, onValueChange: () => row.onCheck?.(row), isDisabled: row.checkbox.isDisabled, isInvalid: row.checkbox.isInvalid })),
+        row?.checkbox?.isVisible && (React__default.createElement(Checkbox, { key: "cb", cx: "uui-dr_addons-checkbox", tabIndex: props.tabIndex, size: settings.sizes.rowAddons.checkbox[props.size], value: row.isChecked, indeterminate: !row.isChecked && row.isChildrenChecked, onValueChange: () => row.onCheck?.(row), isDisabled: row.checkbox.isDisabled, isInvalid: row.checkbox.isInvalid })),
         row.indent > 0 && (React__default.createElement("div", { key: "fold", className: cx('uui-dr_addons-indent', `uui-size-${props.size}`), style: { marginInlineStart: getIndent(), width: getWidth() } }, row.isFoldable && (React__default.createElement(IconContainer, { rawProps: {
                 'aria-label': row.isFolded ? 'Unfold' : 'Fold',
                 role: 'button',
-            }, key: "icon", icon: settings.rowAddons.icons.foldingIcon, cx: [
+            }, key: "icon", icon: ForwardRef$Q, cx: [
                 uuiElement.foldingArrow, uuiMarkers.clickable, css$12.iconContainer,
-            ], rotate: row.isFolded ? '90ccw' : '0', onClick: () => row.onFold(row), size: settings.rowAddons.sizes.iconMap[props.size] || settings.rowAddons.sizes.defaultIcon }))))));
+            ], rotate: row.isFolded ? '90ccw' : '0', onClick: () => row.onFold(row), size: settings.sizes.rowAddons.icon[props.size] || settings.sizes.rowAddons.defaults.icon }))))));
 }
 
-var css$11 = {"root":"m18-QY"};
+var css$11 = {"root":"eRrnjQ"};
 
 const Blocker = /* @__PURE__ */withMods(Blocker$1, () => [css$11.root], (cmpProps) => ({ renderSpinner: cmpProps.renderSpinner || (() => React__default.createElement(Spinner, null)) }));
 
@@ -2104,7 +1461,7 @@ const VirtualListView = /* @__PURE__ */React.forwardRef((props, ref) => {
         React.createElement(Blocker, { isEnabled: props.isLoading })));
 });
 
-var css$10 = {"root":"yC5weY"};
+var css$10 = {"root":"Z40E8g"};
 
 function CheckboxGroup(props) {
     const currentValue = props.value || [];
@@ -2126,13 +1483,13 @@ function CheckboxGroup(props) {
     })));
 }
 
-var css$$ = {"root":"Sfup8x","modal-blocker":"tSYcBd","modalBlocker":"tSYcBd","animateModalBlocker":"x9G-Ii","modal":"XqcKfk","modal-footer":"I-fL53","modalFooter":"I-fL53","modal-header":"Ue4kPK","modalHeader":"Ue4kPK"};
+var css$$ = {"root":"kB1xeP","modal-blocker":"YbhskA","modalBlocker":"YbhskA","animateModalBlocker":"ISlK9F","modal":"_-2IL6X","modal-footer":"c09T35","modalFooter":"c09T35","modal-header":"G-OC40","modalHeader":"G-OC40"};
 
 const ModalBlocker = /* @__PURE__ */withMods(ModalBlocker$1, () => [css$$.modalBlocker]);
 const ModalWindow = /* @__PURE__ */withMods(ModalWindow$1, () => [css$$.root, css$$.modal], (props) => {
-    const width = props.width || settings.modal.sizes.defaultWidth;
+    const width = props.width || settings.sizes.modal.window.defaults.width;
     const height = props.height || 'auto';
-    const maxHeight = isMobile() ? settings.modal.sizes.defaultMobileMaxHeight : (props.maxHeight || settings.modal.sizes.defaultMaxHeight);
+    const maxHeight = isMobile() ? '100dvh' : (props.maxHeight || '80dvh');
     return {
         style: {
             ...props.style,
@@ -2144,21 +1501,21 @@ const ModalWindow = /* @__PURE__ */withMods(ModalWindow$1, () => [css$$.root, cs
 });
 class ModalHeader extends React__default.Component {
     render() {
-        return (React__default.createElement(FlexRow, { padding: this.props.padding || settings.modal.sizes.defaultHeaderPadding, size: null, vPadding: "36", borderBottom: this.props.borderBottom, cx: [css$$.root, css$$.modalHeader, this.props.cx], columnGap: "12", rawProps: this.props.rawProps },
+        return (React__default.createElement(FlexRow, { padding: this.props.padding || '24', size: null, vPadding: "36", borderBottom: this.props.borderBottom, cx: [css$$.root, css$$.modalHeader, this.props.cx], columnGap: "12", rawProps: this.props.rawProps },
             this.props.title && (React__default.createElement("div", { className: cx('uui-modal-title', 'uui-typography') }, this.props.title)),
             this.props.children,
             this.props.onClose && React__default.createElement(FlexSpacer, null),
             this.props.onClose && (React__default.createElement(FlexCell, { shrink: 0, width: "auto" },
-                React__default.createElement(IconButton, { rawProps: { 'aria-label': 'Close modal' }, icon: settings.modal.icons.closeIcon, onClick: this.props.onClose })))));
+                React__default.createElement(IconButton, { rawProps: { 'aria-label': 'Close modal' }, icon: ForwardRef$R, onClick: this.props.onClose })))));
     }
 }
 class ModalFooter extends React__default.Component {
     render() {
-        return (React__default.createElement(FlexRow, { columnGap: this.props.columnGap || settings.modal.sizes.defaultFooterColumnGap, cx: [
+        return (React__default.createElement(FlexRow, { columnGap: this.props.columnGap || '12', cx: [
                 css$$.root,
                 css$$.modalFooter,
                 this.props.cx,
-            ], borderTop: this.props.borderTop, padding: this.props.padding || settings.modal.sizes.defaultFooterPadding, vPadding: this.props.vPadding || settings.modal.sizes.defaultFooterVPadding, rawProps: this.props.rawProps }, this.props.children));
+            ], borderTop: this.props.borderTop, padding: this.props.padding || '24', vPadding: this.props.vPadding || '24', rawProps: this.props.rawProps }, this.props.children));
     }
 }
 
@@ -2320,7 +1677,22 @@ const TREE_SHAKEABLE_INIT = () => ({
 });
 const i18n = /* @__PURE__ */TREE_SHAKEABLE_INIT();
 
-var css$_ = {"root":"_9-ko9Y","icon-wrapper":"y4sy76","iconWrapper":"y4sy76","action-wrapper":"nKQVFJ","actionWrapper":"nKQVFJ","action-link":"MwyLMN","actionLink":"MwyLMN","close-icon":"kx2nVN","closeIcon":"kx2nVN","main-path":"Eao98a","mainPath":"Eao98a","content":"ZWD1Nk","close-wrapper":"lMhXTP","closeWrapper":"lMhXTP","notification-wrapper":"tRxpGL","notificationWrapper":"tRxpGL","clear-button":"mjnpje","clearButton":"mjnpje"};
+var _path$u;
+function _extends$u() { return _extends$u = 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$u.apply(null, arguments); }
+var SvgNotificationHelpFill = function SvgNotificationHelpFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$u({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$u || (_path$u = /*#__PURE__*/React.createElement("path", {
+    d: "M11.95 18c.35 0 .646-.121.888-.363.241-.241.362-.537.362-.887s-.12-.646-.362-.887a1.208 1.208 0 0 0-.888-.363c-.35 0-.646.121-.888.363a1.206 1.206 0 0 0-.362.887c0 .35.12.646.362.887.242.242.538.363.888.363zm-.9-3.85h1.85c0-.55.063-.983.188-1.3.125-.317.479-.75 1.062-1.3a7.483 7.483 0 0 0 1.025-1.238c.25-.391.375-.862.375-1.412 0-.933-.342-1.65-1.025-2.15-.683-.5-1.492-.75-2.425-.75-.95 0-1.72.25-2.312.75-.592.5-1.005 1.1-1.238 1.8l1.65.65c.083-.3.271-.625.563-.975.291-.35.737-.525 1.337-.525.533 0 .933.146 1.2.437.267.292.4.613.4.963 0 .333-.1.646-.3.937-.2.292-.45.563-.75.813-.733.65-1.183 1.142-1.35 1.475-.167.333-.25.942-.25 1.825zM12 22a9.733 9.733 0 0 1-3.9-.788 10.092 10.092 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.733 9.733 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.092 10.092 0 0 1 2.137-3.175c.9-.9 1.958-1.613 3.175-2.138A9.743 9.743 0 0 1 12 2a9.74 9.74 0 0 1 3.9.787 10.105 10.105 0 0 1 3.175 2.138c.9.9 1.612 1.958 2.137 3.175A9.733 9.733 0 0 1 22 12a9.733 9.733 0 0 1-.788 3.9 10.092 10.092 0 0 1-2.137 3.175c-.9.9-1.958 1.612-3.175 2.137A9.733 9.733 0 0 1 12 22z"
+  })));
+};
+var ForwardRef$u = /*#__PURE__*/forwardRef(SvgNotificationHelpFill);
+
+var css$_ = {"root":"gsox9r","icon-wrapper":"yiiLqg","iconWrapper":"yiiLqg","action-wrapper":"EAKV7X","actionWrapper":"EAKV7X","action-link":"Xxa0Nj","actionLink":"Xxa0Nj","close-icon":"gtT9lQ","closeIcon":"gtT9lQ","main-path":"_9Glotl","mainPath":"_9Glotl","content":"itsRD7","close-wrapper":"_7F4SlE","closeWrapper":"_7F4SlE","notification-wrapper":"_7u3jhc","notificationWrapper":"_7u3jhc","clear-button":"rhM1wT","clearButton":"rhM1wT"};
 
 const NotificationCard = /* @__PURE__ */React__default.forwardRef((props, ref) => {
     const notificationCardNode = React__default.useRef(null);
@@ -2339,21 +1711,21 @@ const NotificationCard = /* @__PURE__ */React__default.forwardRef((props, ref) =
                 React__default.createElement(IconContainer, { size: 24, icon: props.icon }))),
             React__default.createElement("div", { className: css$_.content },
                 props.children,
-                props.actions && (React__default.createElement("div", { className: css$_.actionWrapper }, props.actions.map((action) => (React__default.createElement(LinkButton, { key: action.name, caption: action.name, onClick: action.action, cx: css$_.actionLink, size: settings.notificationCard.sizes.action, rawProps: action.rawProps })))))),
+                props.actions && (React__default.createElement("div", { className: css$_.actionWrapper }, props.actions.map((action) => (React__default.createElement(LinkButton, { key: action.name, caption: action.name, onClick: action.action, cx: css$_.actionLink, size: settings.sizes.notificationCard.action, rawProps: action.rawProps })))))),
             props.onClose && (React__default.createElement("div", { className: css$_.closeWrapper },
-                React__default.createElement(IconButton, { icon: settings.notificationCard.icons.closeIcon, color: "neutral", onClick: props.onClose, cx: css$_.closeIcon }))))));
+                React__default.createElement(IconButton, { icon: ForwardRef$R, color: "neutral", onClick: props.onClose, cx: css$_.closeIcon }))))));
 });
-const WarningNotification = /* @__PURE__ */React__default.forwardRef((props, ref) => (React__default.createElement(NotificationCard, { icon: settings.notificationCard.icons.warningIcon, color: "warning", ...props, ref: ref, cx: props.cx })));
-const SuccessNotification = /* @__PURE__ */React__default.forwardRef((props, ref) => (React__default.createElement(NotificationCard, { icon: settings.notificationCard.icons.successIcon, color: "success", ...props, ref: ref, cx: props.cx })));
-const HintNotification = /* @__PURE__ */React__default.forwardRef((props, ref) => (React__default.createElement(NotificationCard, { icon: settings.notificationCard.icons.hintIcon, color: "info", ...props, ref: ref, cx: props.cx })));
-const ErrorNotification = /* @__PURE__ */React__default.forwardRef((props, ref) => (React__default.createElement(NotificationCard, { icon: settings.notificationCard.icons.errorIcon, color: "error", ...props, ref: ref, cx: props.cx })));
+const WarningNotification = /* @__PURE__ */React__default.forwardRef((props, ref) => (React__default.createElement(NotificationCard, { icon: ForwardRef$z, color: "warning", ...props, ref: ref, cx: props.cx })));
+const SuccessNotification = /* @__PURE__ */React__default.forwardRef((props, ref) => (React__default.createElement(NotificationCard, { icon: ForwardRef$A, color: "success", ...props, ref: ref, cx: props.cx })));
+const HintNotification = /* @__PURE__ */React__default.forwardRef((props, ref) => (React__default.createElement(NotificationCard, { icon: ForwardRef$u, color: "info", ...props, ref: ref, cx: props.cx })));
+const ErrorNotification = /* @__PURE__ */React__default.forwardRef((props, ref) => (React__default.createElement(NotificationCard, { icon: ForwardRef$y, color: "error", ...props, ref: ref, cx: props.cx })));
 function ClearNotification() {
     const uuiCtx = useUuiContext();
     return (React__default.createElement("div", { className: cx(css$_.notificationWrapper, css$_.clearButton) },
         React__default.createElement(LinkButton, { caption: i18n.notificationCard.closeAllNotificationsButton, onClick: () => uuiCtx.uuiNotifications.clearAll() })));
 }
 
-var css$Z = {"footer":"FyE3N0"};
+var css$Z = {"footer":"BcYdsk"};
 
 class ConfirmationModal extends React.Component {
     render() {
@@ -2395,7 +1767,7 @@ function useReliableForceUpdate() {
     return red[1];
 }
 
-var css$Y = {"root":"_2dVB2V","timepicker-input":"ZYWMFF","timepickerInput":"ZYWMFF","ltr-always":"Hs6h1u","ltrAlways":"Hs6h1u"};
+var css$Y = {"root":"gtRd5k","timepicker-input":"DrIt0T","timepickerInput":"DrIt0T","ltr-always":"iTe8mJ","ltrAlways":"iTe8mJ"};
 
 const uuiTimePicker = {
     container: 'uui-timepicker-container',
@@ -2588,7 +1960,7 @@ function TimePicker(props) {
     return (React__default.createElement(Dropdown, { renderTarget: (targetProps) => (props.renderTarget ? props.renderTarget(targetProps) : renderInput(targetProps)), renderBody: (bodyProps) => !props.isDisabled && !props.isReadonly && renderBody(bodyProps), onValueChange: !props.isDisabled && !props.isReadonly ? onToggle : null, value: state.isOpen, modifiers: [{ name: 'offset', options: { offset: [0, 6] } }], forwardedRef: props.forwardedRef }));
 }
 
-var css$X = {"root":"DZishw"};
+var css$X = {"root":"Ff-Md8"};
 
 function applyInputAddonMods() {
     return [
@@ -2597,29 +1969,43 @@ function applyInputAddonMods() {
 }
 const InputAddon = /* @__PURE__ */withMods(InputAddon$1, applyInputAddonMods);
 
-var css$W = {"root":"_5Fsm0K"};
+var css$W = {"root":"MLN6Wr"};
 
 function applySliderMods() {
     return [css$W.root, 'uui-color-neutral'];
 }
 const Slider = /* @__PURE__ */withMods(Slider$1, applySliderMods);
 
-var css$V = {"root":"lVOxig","tooltip":"O-t7iN"};
+var _path$t;
+function _extends$t() { return _extends$t = 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$t.apply(null, arguments); }
+var SvgStarFilled = function SvgStarFilled(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$t({
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    ref: ref
+  }, props), _path$t || (_path$t = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M8.917 8.268 12.01 2l3.093 6.268 6.917 1.005-5.005 4.878 1.182 6.889-6.187-3.252-6.186 3.252 1.181-6.889L2 9.273z"
+  })));
+};
+var ForwardRef$t = /*#__PURE__*/forwardRef(SvgStarFilled);
+
+var css$V = {"root":"Xp4Y-1","tooltip":"MkecJN"};
 
 function applyRatingMods(mods) {
     return [
         css$V.root,
-        `uui-size-${mods.size || settings.rating.sizes.default}`,
+        `uui-size-${mods.size || settings.sizes.defaults.rating}`,
     ];
 }
 const Rating = /* @__PURE__ */withMods(uuiComponents.Rating, applyRatingMods, (props) => ({
-    filledStarIcon: props.icon || settings.rating.icons.filledRatingIcon,
-    emptyStarIcon: props.icon || settings.rating.icons.emptyRatingIcon,
+    filledStarIcon: props.icon || ForwardRef$t,
+    emptyStarIcon: props.icon || ForwardRef$t,
     Tooltip,
 }));
 
-var css$U = {"root":"ipMd9b","container":"iqcoau"};
-
 const defaultFormat = 'MMM D, YYYY';
 const valueFormat = 'YYYY-MM-DD';
 const supportedDateFormats = (format) => {
@@ -2747,6 +2133,8 @@ const getNextYearsList = (currentDate) => {
     return currentDate.add(16, 'year');
 };
 
+var css$U = {"root":"_600tri","container":"rBv322"};
+
 const uuiHeader = {
     container: 'uui-datepicker-header-container',
     headerNav: 'uui-datepicker-header-nav',
@@ -2824,19 +2212,19 @@ function DatePickerHeader({ navIconLeft, navIconRight, value: { month, view }, o
     const disableNext = view === 'YEAR_SELECTION' && !isYearWithinSoberRange(getNextYearsList(month));
     return (React.createElement("div", { className: cx(css$U.root, uuiHeader.container, cx) },
         React.createElement("header", { className: uuiHeader.headerNav },
-            React.createElement(Button, { icon: navIconLeft || settings.datePicker.icons.body.prevIcon, color: "secondary", fill: "ghost", cx: uuiHeader.navIconLeft, onClick: !isDisabled && (() => onLeftNavigationArrow()), isDisabled: disablePrev }),
+            React.createElement(Button, { icon: navIconLeft || ForwardRef$w, color: "secondary", fill: "ghost", cx: uuiHeader.navIconLeft, onClick: !isDisabled && (() => onLeftNavigationArrow()), isDisabled: disablePrev }),
             React.createElement(Button, { caption: title, fill: "ghost", cx: uuiHeader.navTitle, onClick: !isDisabled && (() => onCaptionClick(view)) }),
-            React.createElement(Button, { icon: navIconRight || settings.datePicker.icons.body.nextIcon, color: "secondary", fill: "ghost", cx: uuiHeader.navIconRight, onClick: !isDisabled && (() => onRightNavigationArrow()), isDisabled: disableNext }))));
+            React.createElement(Button, { icon: navIconRight || ForwardRef$v, color: "secondary", fill: "ghost", cx: uuiHeader.navIconRight, onClick: !isDisabled && (() => onRightNavigationArrow()), isDisabled: disableNext }))));
 }
 
-var css$T = {"root":"_23f3UL"};
+var css$T = {"root":"_27nU7X"};
 
 function applyDateSelectionMods() {
-    return [css$T.root, `uui-size-${settings.datePicker.sizes.default}`];
+    return [css$T.root, `uui-size-${settings.sizes.defaults.datePicker}`];
 }
 const Calendar = /* @__PURE__ */withMods(Calendar$1, applyDateSelectionMods);
 
-var css$S = {"root":"_3e-Sgw"};
+var css$S = {"root":"najTvH"};
 
 const uuiDatePickerBody = {
     wrapper: 'uui-datepicker-body-wrapper',
@@ -2879,7 +2267,7 @@ function StatelessDatePickerBodyComp({ renderDay, isHoliday, cx: classes, filter
                 return (React__default.createElement(Calendar, { value: selectedDate, month: month, onValueChange: onDayClick, filter: filter, renderDay: renderDay, isHoliday: isHoliday, isDisabled: isDisabled }));
         }
     };
-    return (React__default.createElement("div", { ref: ref, className: cx$1(uuiDatePickerBodyBase.container, `uui-size-${settings.datePicker.sizes.default}`, classes), ...rawProps },
+    return (React__default.createElement("div", { ref: ref, className: cx$1(uuiDatePickerBodyBase.container, `uui-size-${settings.sizes.defaults.datePicker}`, classes), ...rawProps },
         React__default.createElement("div", { className: cx$1(css$S.root, uuiDatePickerBody.wrapper) },
             React__default.createElement(DatePickerHeader, { value: {
                     view,
@@ -2897,7 +2285,7 @@ const modifiers$1 = [{
         options: { offset: [0, 6] },
     }];
 function DatePickerComponent(props, ref) {
-    const { format = defaultFormat, value, size = settings.datePicker.sizes.default } = props;
+    const { format = defaultFormat, value, size = settings.sizes.defaults.datePicker } = props;
     const context = useUuiContext();
     const [inputValue, setInputValue] = useState(toCustomDateFormat(value, format));
     const [isBodyOpen, setBodyIsOpen] = useState(false);
@@ -2937,7 +2325,7 @@ function DatePickerComponent(props, ref) {
     };
     const renderInput = (renderProps) => {
         const allowClear = !props.disableClear && !!inputValue;
-        return (React__default.createElement(TextInput, { ...renderProps, isDropdown: false, cx: cx$1(props.inputCx, isBodyOpen && uuiMod.focus), icon: props.mode !== EditMode.CELL ? settings.datePicker.icons.input.calendarIcon : undefined, iconPosition: props.iconPosition || 'left', placeholder: props.placeholder ? props.placeholder : format, size: size, value: inputValue || undefined, onValueChange: (v) => {
+        return (React__default.createElement(TextInput, { ...renderProps, isDropdown: false, cx: cx$1(props.inputCx, isBodyOpen && uuiMod.focus), icon: props.mode !== EditMode.CELL && systemIcons.calendar ? systemIcons.calendar : undefined, iconPosition: props.iconPosition || 'left', placeholder: props.placeholder ? props.placeholder : format, size: size, value: inputValue || undefined, onValueChange: (v) => {
                 setInputValue(v || '');
             }, onCancel: allowClear ? () => {
                 if (!props.disableClear && !!inputValue) {
@@ -2962,7 +2350,7 @@ function DatePickerComponent(props, ref) {
 }
 const DatePicker = /* @__PURE__ */React__default.forwardRef(DatePickerComponent);
 
-var css$R = {"date-input":"SERvmi","dateInput":"SERvmi","root":"VvllfY","separator":"GWz6af","mode-form":"Uy7VHR","modeForm":"Uy7VHR","mode-cell":"EhP6KC","modeCell":"EhP6KC"};
+var css$R = {"date-input":"rsM8Mm","dateInput":"rsM8Mm","root":"_1UPLtY","separator":"ZVsvRD","mode-form":"P66vMX","modeForm":"P66vMX","mode-cell":"_3AeBts","modeCell":"_3AeBts"};
 
 const RangeDatePickerInput = /* @__PURE__ */forwardRef(({ isDisabled, isInvalid, isReadonly, size, disableClear, rawProps, value, inFocus, format, onValueChange, onFocusInput, onBlurInput, onClick, getPlaceholder, filter, onKeyDown, id, cx: classes, }, ref) => {
     const [inputValue, setInputValue] = useState(toCustomDateRangeFormat(value, format));
@@ -3005,15 +2393,15 @@ const RangeDatePickerInput = /* @__PURE__ */forwardRef(({ isDisabled, isInvalid,
     const clearAllowed = !disableClear && inputValue.from && inputValue.to;
     return (
     // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-    React__default.createElement("div", { ref: ref, className: cx$1(`uui-size-${size || settings.rangeDatePicker.sizes.default}`, 'uui-range-date-picker', classes, css$R.root, isDisabled && uuiMod.disabled, isReadonly && uuiMod.readonly, isInvalid && uuiMod.invalid, inFocus && uuiMod.focus), onKeyDown: onKeyDown },
-        React__default.createElement(TextInput, { icon: settings.rangeDatePicker.icons.input.calendarIcon, cx: cx$1(css$R.dateInput, inFocus === 'from' && uuiMod.focus), size: size || settings.rangeDatePicker.sizes.default, placeholder: getPlaceholder ? getPlaceholder('from') : i18n.rangeDatePicker.pickerPlaceholderFrom, value: inputValue.from || undefined, onValueChange: (v) => onInputChange(v || '', 'from'), onFocus: (event) => handleFocus(event, 'from'), onBlur: (event) => handleBlur(event, 'from'), isInvalid: isInvalid, isDisabled: isDisabled, isReadonly: isReadonly, isDropdown: false, rawProps: rawProps?.from, onClick: onClick, onKeyDown: onInputKeyDown, id: id }),
+    React__default.createElement("div", { ref: ref, className: cx$1(`uui-size-${size || settings.sizes.defaults.rangeDatePicker}`, 'uui-range-date-picker', classes, css$R.root, isDisabled && uuiMod.disabled, isReadonly && uuiMod.readonly, isInvalid && uuiMod.invalid, inFocus && uuiMod.focus), onKeyDown: onKeyDown },
+        React__default.createElement(TextInput, { icon: systemIcons.calendar, cx: cx$1(css$R.dateInput, inFocus === 'from' && uuiMod.focus), size: size || settings.sizes.defaults.rangeDatePicker, placeholder: getPlaceholder ? getPlaceholder('from') : i18n.rangeDatePicker.pickerPlaceholderFrom, value: inputValue.from || undefined, onValueChange: (v) => onInputChange(v || '', 'from'), onFocus: (event) => handleFocus(event, 'from'), onBlur: (event) => handleBlur(event, 'from'), isInvalid: isInvalid, isDisabled: isDisabled, isReadonly: isReadonly, isDropdown: false, rawProps: rawProps?.from, onClick: onClick, onKeyDown: onInputKeyDown, id: id }),
         React__default.createElement("div", { className: css$R.separator }),
-        React__default.createElement(TextInput, { cx: cx$1(css$R.dateInput, inFocus === 'to' && uuiMod.focus), placeholder: getPlaceholder ? getPlaceholder('to') : i18n.rangeDatePicker.pickerPlaceholderTo, size: size || settings.rangeDatePicker.sizes.default, value: inputValue.to || undefined, onCancel: clearAllowed ? () => {
+        React__default.createElement(TextInput, { cx: cx$1(css$R.dateInput, inFocus === 'to' && uuiMod.focus), placeholder: getPlaceholder ? getPlaceholder('to') : i18n.rangeDatePicker.pickerPlaceholderTo, size: size || settings.sizes.defaults.rangeDatePicker, value: inputValue.to || undefined, onCancel: clearAllowed ? () => {
                 onValueChange(defaultRangeValue);
             } : undefined, 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 })));
 });
 
-var css$Q = {"root":"CKbaau"};
+var css$Q = {"root":"RRWJNF"};
 
 const uuiPresets = {
     container: 'uui-presets-container',
@@ -3033,7 +2421,7 @@ function CalendarPresets(props) {
         getPresets(props.presets).map((item) => (React.createElement(LinkButton, { key: item.key, caption: item.name, onClick: () => props.onPresetSet(item), size: "24" })))));
 }
 
-var css$P = {"root":"VECXau","container":"yCgn5l","day-selection":"fDXy9w","daySelection":"fDXy9w","from-picker":"CTUZIq","fromPicker":"CTUZIq","to-picker":"v5f7nd","toPicker":"v5f7nd","bodes-wrapper":"nhrnEK","bodesWrapper":"nhrnEK","blocker":"TmBmuf"};
+var css$P = {"root":"lsZRKd","container":"TUeaKh","day-selection":"_65yCc9","daySelection":"_65yCc9","from-picker":"OQcWfb","fromPicker":"OQcWfb","to-picker":"_8u5qpd","toPicker":"_8u5qpd","bodes-wrapper":"Pt0ZoG","bodesWrapper":"Pt0ZoG","blocker":"OoIGjt"};
 
 const uuiRangeDatePickerBody = {
     inRange: 'uui-range-datepicker-in-range',
@@ -3208,14 +2596,14 @@ const getDayCX = (day, selectedDate) => {
     return [cx$1(inRange && uuiRangeDatePickerBody.inRange, isFirst && uuiRangeDatePickerBody.firstDayInRangeWrapper, !inRange && isFirst && uuiRangeDatePickerBody.lastDayInRangeWrapper, isLast && uuiRangeDatePickerBody.lastDayInRangeWrapper, !inRange && isLast && uuiRangeDatePickerBody.firstDayInRangeWrapper, (dayValue === fromValue || dayValue === toValue) && uuiDaySelection.selectedDay)];
 };
 
-var css$O = {"dropdown-container":"jhmh6P","dropdownContainer":"jhmh6P"};
+var css$O = {"dropdown-container":"PDOh3y","dropdownContainer":"PDOh3y"};
 
 const modifiers = [{
         name: 'offset',
         options: { offset: [0, 6] },
     }];
 function RangeDatePickerComponent(props, ref) {
-    const { value: _value, format = defaultFormat, size = settings.rangeDatePicker.sizes.default } = props;
+    const { value: _value, format = defaultFormat, size = settings.sizes.defaults.rangeDatePicker } = props;
     const value = _value || defaultRangeValue; // also handles null in comparison to default value
     const context = useUuiContext();
     const [isOpen, setIsOpen] = useState(false);
@@ -3276,7 +2664,7 @@ function RangeDatePickerComponent(props, ref) {
 }
 const RangeDatePicker = /* @__PURE__ */React__default.forwardRef(RangeDatePickerComponent);
 
-var css$N = {"root":"E1l659","blocker":"VAWa-s","marker":"PBCWhO","top":"M7upTS","bottom":"fs7iju","left":"LVoO26","right":"_0udNUy","inside":"_8FypR-"};
+var css$N = {"root":"L1jcOY","blocker":"i8iQOX","marker":"_6b7v2O","top":"N7QsMo","bottom":"YDlIp2","left":"NlnW7E","right":"AtQaSJ","inside":"ko-aqq"};
 
 function DropMarker(props) {
     return props.isDndInProgress
@@ -3291,13 +2679,13 @@ function DropMarker(props) {
         : null;
 }
 
-var css$M = {"root":"_6tWjqu","line-height":"CdQO7I","lineHeight":"CdQO7I","font-size":"r0gvz-","fontSize":"r0gvz-"};
+var css$M = {"root":"_7EnJI-","line-height":"YsJL0i","lineHeight":"YsJL0i","font-size":"uHcJve","fontSize":"uHcJve"};
 
 function applyTextMods(mods) {
     return [
         css$M.root,
         'uui-text',
-        `uui-size-${mods.size || settings.text.sizes.default}`,
+        `uui-size-${mods.size || settings.sizes.defaults.text}`,
         (mods.size !== 'none' || mods.lineHeight) && css$M.lineHeight,
         (mods.size !== 'none' || mods.fontSize) && css$M.fontSize,
         `uui-color-${mods.color || 'primary'}`,
@@ -3318,7 +2706,7 @@ const Text = /* @__PURE__ */withMods(uuiComponents.Text, applyTextMods, (props)
     };
 });
 
-var css$L = {"root":"R-d9ct","loading-word":"WhQZFc","loadingWord":"WhQZFc","animated-loading":"JD3G0e","animatedLoading":"JD3G0e","skeleton_loading":"MIKvmD","skeletonLoading":"MIKvmD"};
+var css$L = {"root":"-DD56p","loading-word":"Xd3rfs","loadingWord":"Xd3rfs","animated-loading":"QY43Je","animatedLoading":"QY43Je","skeleton_loading":"-bIPQ5","skeletonLoading":"-bIPQ5"};
 
 const TextPlaceholder = (props) => {
     const pattern = '&nbsp;';
@@ -3335,16 +2723,16 @@ const TextPlaceholder = (props) => {
         ]), dangerouslySetInnerHTML: { __html: it } })))));
 };
 
-const RichTextView = /* @__PURE__ */withMods(uuiComponents.RichTextView, (mods) => ['uui-typography', `uui-typography-size-${mods.size || settings.richTextView.sizes.default}`]);
+const RichTextView = /* @__PURE__ */withMods(uuiComponents.RichTextView, (mods) => ['uui-typography', `uui-typography-size-${mods.size || settings.sizes.defaults.richTextView}`]);
 
-var css$K = {"modal":"_3Lcmn6","search-wrapper":"I-k3xo","searchWrapper":"I-k3xo","no-data":"WhA8QV","noData":"WhA8QV","type-search-to-load-size-24":"V2n0vK","typeSearchToLoadSize24":"V2n0vK"};
+var css$K = {"modal":"_91AJIK","search-wrapper":"T-8-RB","searchWrapper":"T-8-RB","no-data":"BbzuTl","noData":"BbzuTl","type-search-to-load-size-24":"_4XQM2X","typeSearchToLoadSize24":"_4XQM2X"};
 
 class DataPickerBody extends PickerBodyBase {
     constructor() {
         super(...arguments);
         this.lens = Lens.onEditableComponent(this);
         this.searchLens = this.lens.prop('search').default('');
-        this.getSearchSize = () => (isMobile() ? settings.pickerInput.sizes.body.mobileSearchInput : this.props.searchSize);
+        this.getSearchSize = () => (isMobile() ? settings.sizes.pickerInput.body.mobile.searchInput : this.props.searchSize);
     }
     renderEmpty() {
         const search = this.searchLens.get();
@@ -3388,11 +2776,11 @@ class DataPickerBody extends PickerBodyBase {
     }
 }
 
-var css$J = {"footer":"_2T8yQQ"};
+var css$J = {"footer":"Lcs8CI"};
 
 function DataPickerFooterImpl(props) {
     const { search, clearSelection, view, showSelected, selectionMode, isSearchTooShort, } = props;
-    const size = isMobile() ? settings.pickerInput.sizes.body.mobileFooterLinkButton : props.size;
+    const size = isMobile() ? settings.sizes.pickerInput.body.mobile.footer.linkButton : props.size;
     const hasSelection = view.getSelectedRowsCount() > 0;
     const rowsCount = view.getListProps().rowsCount;
     const isSinglePicker = selectionMode === 'single';
@@ -3404,7 +2792,7 @@ function DataPickerFooterImpl(props) {
     const showClear = !props.disableClear && (isSinglePicker ? true : (!view.selectAll || hasSelection));
     return !hideFooter && (React__default.createElement(FlexRow, { cx: css$J.footer },
         !isSinglePicker && !isSearchTooShort && ( // Show this switch only for multi mode and when some rows rendered
-        React__default.createElement(Switch, { size: settings.pickerInput.sizes.body.footerSwitchMap[props.size], value: showSelected.value, isDisabled: !hasSelection, onValueChange: showSelected.onValueChange, label: i18n.pickerInput.showOnlySelectedLabel })),
+        React__default.createElement(Switch, { size: settings.sizes.pickerInput.body.dropdown.footer.switch[props.size], value: showSelected.value, isDisabled: !hasSelection, onValueChange: showSelected.onValueChange, label: i18n.pickerInput.showOnlySelectedLabel })),
         React__default.createElement(FlexSpacer, null),
         React__default.createElement(FlexCell, { width: "auto", alignSelf: "center" },
             view.selectAll && !hasSelection && (React__default.createElement(LinkButton, { key: "SelectAll/ClearAll" // We use the same key for these buttons, because we need to leave focus on it after click, so we need to react doesn't remount it.
@@ -3414,17 +2802,32 @@ function DataPickerFooterImpl(props) {
 }
 const DataPickerFooter = /* @__PURE__ */React__default.memo(DataPickerFooterImpl);
 
-var css$I = {"header":"BvOTfY","title":"_74pmbP","close":"GCdOJZ"};
+var css$I = {"header":"_1STOx4","title":"_1jQJh0","close":"H6NdRG"};
 
 const DataPickerHeaderImpl = (props) => {
     const title = props.title && typeof props.title === 'string' ? props.title.charAt(0).toUpperCase() + props.title.slice(1) : '';
     return (React__default.createElement(FlexRow, { alignItems: "center", borderBottom: true, cx: css$I.header },
-        React__default.createElement(Text, { size: settings.pickerInput.sizes.body.mobileHeaderTitleSize, cx: css$I.title }, title),
-        React__default.createElement(IconButton, { icon: settings.pickerInput.icons.body.pickerBodyMobileHeaderCloseIcon, onClick: () => props.close?.(), cx: css$I.close })));
+        React__default.createElement(Text, { size: settings.sizes.pickerInput.body.mobile.header.titleSize, cx: css$I.title }, title),
+        React__default.createElement(IconButton, { icon: ForwardRef$R, onClick: () => props.close?.(), cx: css$I.close })));
 };
 const DataPickerHeader = /* @__PURE__ */React__default.memo(DataPickerHeaderImpl);
 
-var css$H = {"root":"zkAT-O","align-widgets-top":"tBqpnh","alignWidgetsTop":"tBqpnh","align-widgets-center":"_9s0Max","alignWidgetsCenter":"_9s0Max","icon-container":"D2XBBH","iconContainer":"D2XBBH","loading-cell":"hKN5Xl","loadingCell":"hKN5Xl","content-wrapper":"jFO-Uj","contentWrapper":"jFO-Uj","render-item":"Cv43tE","renderItem":"Cv43tE","icon-wrapper":"KDQHv0","iconWrapper":"KDQHv0","icon-default":"_7-zlnP","iconDefault":"_7-zlnP","selected-mark":"cnOS1G","selectedMark":"cnOS1G"};
+var _path$s;
+function _extends$s() { return _extends$s = 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$s.apply(null, arguments); }
+var SvgNotificationDoneFill = function SvgNotificationDoneFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$s({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$s || (_path$s = /*#__PURE__*/React.createElement("path", {
+    d: "m2 12 3.077-3.2 4.615 4.8L18.923 4 22 7.2 9.692 20 2 12z"
+  })));
+};
+var ForwardRef$s = /*#__PURE__*/forwardRef(SvgNotificationDoneFill);
+
+var css$H = {"root":"_1h6hYa","align-widgets-top":"MhDDlA","alignWidgetsTop":"MhDDlA","align-widgets-center":"xec-wJ","alignWidgetsCenter":"xec-wJ","icon-container":"DGsFai","iconContainer":"DGsFai","loading-cell":"pTiZui","loadingCell":"pTiZui","content-wrapper":"ejVFVc","contentWrapper":"ejVFVc","render-item":"Smm29D","renderItem":"Smm29D","icon-wrapper":"dJZulN","iconWrapper":"dJZulN","icon-default":"fgAwJs","iconDefault":"fgAwJs","selected-mark":"Cwy1BO","selectedMark":"Cwy1BO"};
 
 function DataPickerCell(props) {
     const ref = React.useRef();
@@ -3432,21 +2835,18 @@ function DataPickerCell(props) {
     if (props.rowProps.isLoading) {
         content = (
         // remove `css.loadingCell` after` removing `margin: 0 3px 3px 0` from `TextPlaceholder` `loadingWord` class styles.
-        React.createElement(Text, { key: "t", size: settings.pickerInput.sizes.body.cellTextMap[props.size], cx: css$H.loadingCell },
+        React.createElement(Text, { key: "t", size: settings.sizes.pickerInput.body.dropdown.row.cell.text[props.size], cx: css$H.loadingCell },
             React.createElement(TextPlaceholder, null)));
     }
     else if (props.rowProps.isUnknown) {
-        content = (React.createElement(Text, { key: "t", size: settings.pickerInput.sizes.body.cellTextMap[props.size] }, "Unknown"));
+        content = (React.createElement(Text, { key: "t", size: settings.sizes.pickerInput.body.dropdown.row.cell.text[props.size] }, "Unknown"));
     }
     else {
-        const SelectIcon = settings.pickerInput.sizes.body.cellIsBoldSelectionIcon[props.size]
-            ? settings.pickerInput.icons.body.boldSelectIcon
-            : settings.pickerInput.icons.body.selectIcon;
         content = (React.createElement("div", { key: `${props.rowProps.id}`, className: css$H.renderItem },
             props.renderItem(props.rowProps.value, props.rowProps),
             React.createElement(FlexSpacer, null),
             (props.rowProps.isChildrenSelected || props.rowProps.isSelected) && (React.createElement("div", { className: cx$1(css$H.iconWrapper, uuiMod.selected) },
-                React.createElement(IconContainer, { size: settings.pickerInput.sizes.body.cellIconMap[props.size], icon: SelectIcon, cx: props.rowProps.isChildrenSelected ? css$H.iconDefault : css$H.selectedMark, rawProps: { 'aria-label': props.rowProps.isChildrenSelected
+                React.createElement(IconContainer, { size: settings.sizes.pickerInput.body.dropdown.row.cell.icon[props.size], icon: settings.sizes.pickerInput.body.dropdown.row.cell.isBoldSelectionIcon[props.size] ? ForwardRef$s : ForwardRef$P, cx: props.rowProps.isChildrenSelected ? css$H.iconDefault : css$H.selectedMark, rawProps: { 'aria-label': props.rowProps.isChildrenSelected
                             ? 'Child is selected'
                             : 'Selected' } })))));
     }
@@ -3464,13 +2864,13 @@ function DataPickerCell(props) {
         getWrappedContent()));
 }
 
-var css$G = {"picker-row":"u-nkyZ","pickerRow":"u-nkyZ"};
+var css$G = {"picker-row":"HAX13Y","pickerRow":"HAX13Y"};
 
 class DataPickerRow extends React.Component {
     constructor() {
         super(...arguments);
         this.renderContent = () => {
-            return (React.createElement(DataPickerCell, { key: "name", size: this.props.size || settings.pickerInput.sizes.body.defaultRow, padding: this.props.padding || settings.pickerInput.sizes.body.cellPadding, rowProps: this.props, alignActions: this.props.alignActions || 'top', renderItem: this.props.renderItem }));
+            return (React.createElement(DataPickerCell, { key: "name", size: this.props.size || settings.sizes.pickerInput.body.dropdown.row.default, padding: this.props.padding || settings.sizes.pickerInput.body.dropdown.row.cell.padding, rowProps: this.props, alignActions: this.props.alignActions || 'top', renderItem: this.props.renderItem }));
         };
     }
     render() {
@@ -3478,7 +2878,7 @@ class DataPickerRow extends React.Component {
     }
 }
 
-var css$F = {"done":"W5aI5h","container":"gI8IXt"};
+var css$F = {"done":"_3oLJh5","container":"Fk2HoJ"};
 
 const PickerBodyMobileView = (props) => {
     const isMobileView = isMobile();
@@ -3487,8 +2887,32 @@ const PickerBodyMobileView = (props) => {
     return (React__default.createElement(DropdownContainer, { ...props, maxWidth: maxWidth, maxHeight: maxHeight, cx: [css$F.container, props.cx], autoFocus: true },
         isMobileView && React__default.createElement(DataPickerHeader, { title: props.title, close: props.onClose }),
         props.children,
-        isMobileView && (React__default.createElement(LinkButton, { caption: i18n.pickerInput.doneButton, onClick: () => props.onClose?.(), cx: css$F.done, size: settings.pickerInput.sizes.body.mobileFooterLinkButton }))));
+        isMobileView && React__default.createElement(LinkButton, { caption: i18n.pickerInput.doneButton, onClick: () => props.onClose?.(), cx: css$F.done, size: settings.sizes.pickerInput.body.mobile.footer.linkButton })));
+};
+
+var _path$r, _path2$4;
+function _extends$r() { return _extends$r = 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$r.apply(null, arguments); }
+var SvgSearchWithBackground = function SvgSearchWithBackground(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$r({
+    width: 66,
+    height: 67,
+    viewBox: "0 0 66 67",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ref: ref
+  }, props), _path$r || (_path$r = /*#__PURE__*/React.createElement("path", {
+    d: "M0 33.5C0 15.275 14.775.5 33 .5s33 14.775 33 33-14.775 33-33 33-33-14.775-33-33Z",
+    fill: "#EBEDF5"
+  })), _path2$4 || (_path2$4 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "m42.31 40.335 7.165 7.165L47 49.975l-7.165-7.165a13.94 13.94 0 0 1-8.585 2.94c-7.732 0-14-6.268-14-14s6.268-14 14-14 14 6.268 14 14a13.94 13.94 0 0 1-2.94 8.585ZM31.25 42.25c5.799 0 10.5-4.701 10.5-10.5s-4.701-10.5-10.5-10.5-10.5 4.701-10.5 10.5 4.701 10.5 10.5 10.5Z",
+    fill: "#6C6F80"
+  })));
 };
+var ForwardRef$r = /*#__PURE__*/forwardRef(SvgSearchWithBackground);
+
+var css$E = {"sub-header-wrapper":"EKHfcq","subHeaderWrapper":"EKHfcq","switch":"sbjyKx","no-found-modal-container":"_1rk25I","noFoundModalContainer":"_1rk25I","no-found-modal-container-icon":"GU5nBI","noFoundModalContainerIcon":"GU5nBI","no-found-modal-container-text":"QX9EXW","noFoundModalContainerText":"QX9EXW"};
 
 const mergeHighlightRanges = (ranges) => {
     const mergedRanges = [];
@@ -3555,29 +2979,27 @@ const getHighlightedSearchMatches = (str, search) => {
     return getDecoratedText(str, ranges);
 };
 
-var css$E = {"root":"JTgVHZ","column-gap":"UkBcbE","columnGap":"UkBcbE","multiline":"QepdmC","text":"aouOqI"};
+var css$D = {"root":"rmIAMV","column-gap":"HHUTCl","columnGap":"HHUTCl","multiline":"FaX4it","text":"NGUfFT"};
 
 function PickerItem(props) {
     const { highlightSearchMatches = true, size, avatarUrl, isLoading, isDisabled, icon, cx, } = props;
-    const itemSize = size || settings.pickerInput.sizes.body.defaultItem;
+    const itemSize = size || settings.sizes.pickerInput.body.dropdown.row.cell.item.default;
     const isMultiline = !!(props.title && props.subtitle);
     const { search } = props.dataSourceState ?? {};
     const title = highlightSearchMatches ? getHighlightedSearchMatches(props.title, search) : props.title;
     const subtitle = highlightSearchMatches ? getHighlightedSearchMatches(props.subtitle, search) : props.subtitle;
-    return (React.createElement(FlexCell, { width: "auto", cx: [css$E.root, 'uui-typography', cx] },
-        React.createElement(FlexRow, { size: itemSize, cx: [isMultiline && css$E.multiline, css$E.columnGap], rawProps: { style: { '--uui-picker_item-vertical-padding': `${settings.pickerInput.sizes.body.itemVerticalPaddingMap[itemSize]}px` } } },
-            avatarUrl && (React.createElement(Avatar, { isLoading: isLoading, img: avatarUrl, size: getAvatarSize(itemSize, isMultiline) })),
+    return (React.createElement(FlexCell, { width: "auto", cx: [css$D.root, 'uui-typography', cx] },
+        React.createElement(FlexRow, { size: itemSize, cx: [isMultiline && css$D.multiline, css$D.columnGap], rawProps: { style: { '--uui-picker_item-vertical-padding': `${settings.sizes.pickerInput.body.dropdown.row.cell.item.verticalPadding[itemSize]}px` } } },
+            avatarUrl && (React.createElement(Avatar, { isLoading: isLoading, img: avatarUrl, size: getAvatarSize(itemSize, isMultiline).toString() })),
             icon && React.createElement(IconContainer, { icon: icon }),
             React.createElement(FlexCell, { width: "auto" },
-                title && (React.createElement(Text, { size: itemSize, cx: css$E.text, color: isDisabled ? 'disabled' : 'primary' }, isLoading ? React.createElement(TextPlaceholder, { wordsCount: 2 }) : title)),
-                subtitle && (React.createElement(Text, { size: itemSize, color: isDisabled ? 'disabled' : 'secondary', cx: css$E.text }, isLoading ? React.createElement(TextPlaceholder, { wordsCount: 2 }) : subtitle))))));
+                title && (React.createElement(Text, { size: itemSize, cx: css$D.text, color: isDisabled ? 'disabled' : 'primary' }, isLoading ? React.createElement(TextPlaceholder, { wordsCount: 2 }) : title)),
+                subtitle && (React.createElement(Text, { size: itemSize, color: isDisabled ? 'disabled' : 'secondary', cx: css$D.text }, isLoading ? React.createElement(TextPlaceholder, { wordsCount: 2 }) : subtitle))))));
 }
 function getAvatarSize(size, isMultiline) {
-    return settings.pickerInput.sizes.body[isMultiline ? 'itemAvatarMultilineMap' : 'itemAvatarMap'][size];
+    return settings.sizes.pickerInput.body.dropdown.row.cell.item.avatar[isMultiline ? 'multiline' : 'rest'][size];
 }
 
-var css$D = {"sub-header-wrapper":"PpiwMN","subHeaderWrapper":"PpiwMN","switch":"A3CG2M","no-found-modal-container":"GMSmpZ","noFoundModalContainer":"GMSmpZ","no-found-modal-container-icon":"XH-IeQ","noFoundModalContainerIcon":"XH-IeQ","no-found-modal-container-text":"-MjKgw","noFoundModalContainerText":"-MjKgw"};
-
 function PickerModal(props) {
     const { view, selection, dataSourceStateLens, dataSourceState, getDataSourceState, getName, clearSelection, getRows, getListProps, getFooterProps, isSingleSelect, handleDataSourceValueChange, } = usePickerModal(props);
     const getSubtitle = ({ path }, { search }) => {
@@ -3606,17 +3028,17 @@ function PickerModal(props) {
             React__default.createElement(Button, { color: "primary", caption: i18n.pickerModal.selectButton, onClick: () => props.success(selection) })));
     };
     const renderNotFound = () => {
-        return props.renderNotFound ? (props.renderNotFound({ search: dataSourceState.search, onClose: () => props.success(null) })) : (React__default.createElement("div", { className: css$D.noFoundModalContainer },
-            React__default.createElement(IconContainer, { cx: css$D.noFoundModalContainerIcon, icon: settings.pickerInput.icons.body.modalNotFoundSearchIcon }),
-            React__default.createElement(Text, { cx: css$D.noFoundModalContainerText, fontWeight: "600", fontSize: "16", lineHeight: "24", color: "primary", size: "36" }, i18n.dataPickerBody.noRecordsMessage),
-            React__default.createElement(Text, { cx: css$D.noFoundModalContainerText, fontSize: "12", lineHeight: "18", color: "primary", size: "36" }, i18n.dataPickerBody.noRecordsSubTitle)));
+        return props.renderNotFound ? (props.renderNotFound({ search: dataSourceState.search, onClose: () => props.success(null) })) : (React__default.createElement("div", { className: css$E.noFoundModalContainer },
+            React__default.createElement(IconContainer, { cx: css$E.noFoundModalContainerIcon, icon: ForwardRef$r }),
+            React__default.createElement(Text, { cx: css$E.noFoundModalContainerText, fontWeight: "600", fontSize: "16", lineHeight: "24", color: "primary", size: "36" }, i18n.dataPickerBody.noRecordsMessage),
+            React__default.createElement(Text, { cx: css$E.noFoundModalContainerText, fontSize: "12", lineHeight: "18", color: "primary", size: "36" }, i18n.dataPickerBody.noRecordsSubTitle)));
     };
     const dataRows = getRows();
     const rows = dataRows.map((row) => renderRow(row));
     return (React__default.createElement(ModalBlocker, { ...props },
         React__default.createElement(ModalWindow, { width: 600, height: 700 },
             React__default.createElement(ModalHeader, { title: props.caption || i18n.pickerModal.headerTitle, onClose: () => props.abort() }),
-            React__default.createElement(FlexCell, { cx: css$D.subHeaderWrapper },
+            React__default.createElement(FlexCell, { cx: css$E.subHeaderWrapper },
                 React__default.createElement(FlexRow, { vPadding: "24" },
                     React__default.createElement(SearchInput, { ...dataSourceStateLens.prop('search').toProps(), onKeyDown: (e) => handleDataSourceKeyboard({
                             value: getDataSourceState(),
@@ -3625,19 +3047,19 @@ function PickerModal(props) {
                             rows: dataRows,
                             searchPosition: 'body',
                         }, e), autoFocus: true, placeholder: i18n.pickerModal.searchPlaceholder, rawProps: { dir: 'auto' } })),
-                !isSingleSelect() && (React__default.createElement(Switch, { cx: css$D.switch, size: "18", ...getFooterProps().showSelected, isDisabled: view.getSelectedRowsCount() < 1, label: "Show only selected" })),
+                !isSingleSelect() && (React__default.createElement(Switch, { cx: css$E.switch, size: "18", ...getFooterProps().showSelected, isDisabled: view.getSelectedRowsCount() < 1, label: "Show only selected" })),
                 props.renderFilter && React__default.createElement(FlexCell, { grow: 2 }, props.renderFilter(dataSourceStateLens.prop('filter').toProps()))),
             React__default.createElement(DataPickerBody, { ...getListProps(), value: getDataSourceState(), onValueChange: handleDataSourceValueChange, search: dataSourceStateLens.prop('search').toProps(), showSearch: false, rows: rows, renderNotFound: renderNotFound, editMode: "modal" }),
             React__default.createElement(ModalFooter, { padding: "24", vPadding: "24" }, props.renderFooter ? props.renderFooter(getFooterProps()) : renderFooter()))));
 }
 
-var css$C = {"tooltip":"uQ8leb"};
+var css$C = {"tooltip":"c0UAS6"};
 
 const PickerTogglerTag = /* @__PURE__ */React.forwardRef((props, ref) => {
     const tagProps = {
         ...props,
         tabIndex: -1,
-        size: settings.pickerInput.sizes.toggler.tagMap[props.size],
+        size: settings.sizes.pickerInput.toggler.tag[props.size],
         caption: props.rowProps?.isLoading ? React.createElement(TextPlaceholder, null) : props.caption,
     };
     if (props.isCollapsed) {
@@ -3650,26 +3072,26 @@ const PickerTogglerTag = /* @__PURE__ */React.forwardRef((props, ref) => {
     }
 });
 
-var css$B = {"root":"iw-4c8","mode-form":"_5C2Lfe","modeForm":"_5C2Lfe","mode-cell":"QuWc-c","modeCell":"QuWc-c","mode-inline":"CFv0jv","modeInline":"CFv0jv"};
+var css$B = {"root":"Oa-UbH","mode-form":"idn1FV","modeForm":"idn1FV","mode-cell":"LjCQg3","modeCell":"LjCQg3","mode-inline":"trQ9zS","modeInline":"trQ9zS"};
 
 const defaultMode = EditMode.FORM;
 function applyPickerTogglerMods(mods) {
     return [
         css$B.root,
         'uui-picker_toggler',
-        `uui-size-${mods.size || settings.pickerInput.sizes.toggler.default}`,
+        `uui-size-${mods.size || settings.sizes.pickerInput.toggler.defaults.size}`,
         css$B['mode-' + (mods.mode || defaultMode)],
     ];
 }
 function PickerTogglerComponent(props, ref) {
     const renderItem = (itemProps) => {
-        const itemPropsWithSize = { ...itemProps, size: props.size || settings.pickerInput.sizes.toggler.defaultTag };
+        const itemPropsWithSize = { ...itemProps, size: (props.size || settings.sizes.pickerInput.toggler.defaults.tag) };
         if (!!props.renderItem) {
             return props.renderItem(itemPropsWithSize);
         }
         return (React.createElement(PickerTogglerTag, { ...itemPropsWithSize, getName: props.getName }));
     };
-    return (React.createElement(PickerToggler$1, { ...props, ref: ref, cx: [applyPickerTogglerMods(props), props.cx], renderItem: renderItem, getName: props.getName, cancelIcon: settings.pickerInput.icons.toggler.clearIcon, dropdownIcon: settings.pickerInput.icons.toggler.dropdownIcon }));
+    return (React.createElement(PickerToggler$1, { ...props, ref: ref, cx: [applyPickerTogglerMods(props), props.cx], renderItem: renderItem, getName: props.getName, cancelIcon: systemIcons.clear, dropdownIcon: systemIcons.foldingArrow }));
 }
 const PickerToggler = /* @__PURE__ */React.forwardRef(PickerTogglerComponent);
 
@@ -3709,17 +3131,15 @@ function PickerInputComponent({ highlightSearchMatches = true, ...props }, ref)
     };
     const renderFooter = () => {
         const footerProps = getFooterProps();
-        return props.renderFooter
-            ? props.renderFooter(footerProps)
-            : React__default.createElement(DataPickerFooter, { ...footerProps, size: props.size || settings.pickerInput.sizes.body.defaultFooter });
+        return props.renderFooter ? props.renderFooter(footerProps) : React__default.createElement(DataPickerFooter, { ...footerProps, size: props.size });
     };
     const getRowSize = () => {
         if (isMobile()) {
-            return settings.pickerInput.sizes.body.mobileRow;
+            return settings.sizes.pickerInput.body.mobile.row;
         }
         return props.editMode === 'modal'
-            ? settings.pickerInput.sizes.body.modalRow
-            : (props.size || settings.pickerInput.sizes.body.defaultRow);
+            ? settings.sizes.pickerInput.body.modal.row
+            : (props.size || settings.sizes.pickerInput.body.dropdown.row.default);
     };
     const getSubtitle = ({ path }, { search }) => {
         if (!search)
@@ -3734,12 +3154,12 @@ function PickerInputComponent({ highlightSearchMatches = true, ...props }, ref)
         return (React__default.createElement(PickerItem, { title: getName(item), size: getRowSize(), dataSourceState: dsState, highlightSearchMatches: highlightSearchMatches, ...(flattenSearchResults ? { subtitle: getSubtitle(rowProps, dataSourceState) } : {}), ...rowProps }));
     };
     const renderRow = (rowProps, dsState) => {
-        return props.renderRow ? (props.renderRow(rowProps, dsState)) : (React__default.createElement(DataPickerRow, { ...rowProps, key: rowProps.rowKey, size: getRowSize(), padding: props.editMode === 'modal' ? settings.pickerInput.sizes.body.modalPadding : settings.pickerInput.sizes.body.padding, renderItem: (item, itemProps) => renderRowItem(item, itemProps, dsState) }));
+        return props.renderRow ? (props.renderRow(rowProps, dsState)) : (React__default.createElement(DataPickerRow, { ...rowProps, key: rowProps.rowKey, size: getRowSize(), padding: (props.editMode === 'modal' ? settings.sizes.pickerInput.body.modal.padding : settings.sizes.pickerInput.body.dropdown.padding), renderItem: (item, itemProps) => renderRowItem(item, itemProps, dsState) }));
     };
     const renderBody = (bodyProps, rows) => {
         const renderedDataRows = rows.map((row) => renderRow(row, dataSourceState));
-        const bodyHeight = isMobile() ? document.documentElement.clientHeight : props.dropdownHeight || settings.pickerInput.sizes.body.maxHeight;
-        const minBodyWidth = props.minBodyWidth || settings.pickerInput.sizes.body.minWidth;
+        const bodyHeight = isMobile() ? document.documentElement.clientHeight : props.dropdownHeight || settings.sizes.pickerInput.body.dropdown.height;
+        const minBodyWidth = props.minBodyWidth || settings.sizes.pickerInput.body.dropdown.width;
         return (React__default.createElement(PickerBodyMobileView, { title: props.entityName, onClose: () => toggleBodyOpening(false), cx: [props.bodyCx], onKeyDown: bodyProps.onKeyDown, width: bodyProps.togglerWidth > minBodyWidth ? bodyProps.togglerWidth : minBodyWidth, focusLock: getSearchPosition() === 'body' },
             React__default.createElement(DataPickerBody, { ...bodyProps, rows: renderedDataRows, maxHeight: bodyHeight, searchSize: props.size, editMode: "dropdown", selectionMode: props.selectionMode }),
             renderFooter()));
@@ -3753,7 +3173,7 @@ function PickerInputComponent({ highlightSearchMatches = true, ...props }, ref)
 }
 const PickerInput = /* @__PURE__ */React__default.forwardRef(PickerInputComponent);
 
-var css$A = {"row":"VBYHkQ"};
+var css$A = {"row":"G0qSEo"};
 
 function PickerListItem(props) {
     let label;
@@ -3773,7 +3193,7 @@ function PickerListItem(props) {
     return (React__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));
 }
 
-var css$z = {"root":"mn-68G"};
+var css$z = {"root":"hadufp"};
 
 function PickerList(props) {
     const { context, view, onlySelectedView, getName, getEntityName, appendLastSelected, getSelectedIdsArray, buildRowsList, getMaxDefaultItems, dataSourceState, getModalTogglerCaption, } = usePickerList(props);
@@ -3808,7 +3228,7 @@ function PickerList(props) {
             }, selectedRows)));
 }
 
-var css$y = {"root":"yjPYqi","wrapper":"znOeIe","align-widgets-top":"uiBscQ","alignWidgetsTop":"uiBscQ","align-widgets-center":"_6d7CV1","alignWidgetsCenter":"_6d7CV1"};
+var css$y = {"root":"J2oNjb","wrapper":"fnLIqq","align-widgets-top":"mjxRPp","alignWidgetsTop":"mjxRPp","align-widgets-center":"gTcLPA","alignWidgetsCenter":"gTcLPA"};
 
 function DataTableCell(initialProps) {
     const props = { ...initialProps };
@@ -3816,21 +3236,21 @@ function DataTableCell(initialProps) {
         props.addons = React.createElement(DataRowAddons, { size: props.size, ...props });
     }
     props.renderPlaceholder = props.renderPlaceholder
-        || (() => (React.createElement(Text, { key: "t", size: settings.dataTable.sizes.body.cellTextMap[props.size] },
+        || (() => (React.createElement(Text, { key: "t", size: settings.sizes.dataTable.body.row.cell.text[props.size] },
             React.createElement(TextPlaceholder, { isNotAnimated: true }))));
     props.renderUnknown = props.renderUnknown
-        || (() => (React.createElement(Text, { key: "t", size: settings.dataTable.sizes.body.cellTextMap[props.size] }, "Unknown")));
+        || (() => (React.createElement(Text, { key: "t", size: settings.sizes.dataTable.body.row.cell.text[props.size] }, "Unknown")));
     props.renderTooltip = (tooltipProps) => React.createElement(Tooltip, { color: "critical", ...tooltipProps });
     const isEditable = !!props.onValueChange;
     const getLeftPadding = () => {
         const { rowProps: { isLoading }, columnsGap, isFirstColumn } = props;
         if (isFirstColumn && isEditable && !isLoading)
-            return settings.dataTable.sizes.body.defaultCellPadding;
+            return settings.sizes.dataTable.body.row.cell.defaults.padding;
         if (isEditable && !isLoading)
             return '0';
         if (columnsGap)
             return isFirstColumn ? columnsGap : +columnsGap / 2;
-        return isFirstColumn ? settings.dataTable.sizes.body.defaultCellPaddingEdge : settings.dataTable.sizes.body.defaultCellPadding;
+        return isFirstColumn ? settings.sizes.dataTable.body.row.cell.defaults.paddingEdge : settings.sizes.dataTable.body.row.cell.defaults.padding;
     };
     const getRightPadding = () => {
         const { rowProps: { isLoading }, columnsGap, isLastColumn } = props;
@@ -3838,13 +3258,13 @@ function DataTableCell(initialProps) {
             return '0';
         if (columnsGap)
             return isLastColumn ? columnsGap : +columnsGap / 2;
-        return isLastColumn ? settings.dataTable.sizes.body.defaultCellPaddingEdge : settings.dataTable.sizes.body.defaultCellPadding;
+        return isLastColumn ? settings.sizes.dataTable.body.row.cell.defaults.paddingEdge : settings.sizes.dataTable.body.row.cell.defaults.padding;
     };
     props.cx = [
         'data-table-cell',
         css$y.root,
         props.cx,
-        'uui-size-' + (props.size || settings.dataTable.sizes.body.defaultCell),
+        'uui-size-' + (props.size || settings.sizes.dataTable.body.row.cell.defaults.size),
         props.isFirstColumn && 'uui-dt-first-column',
         props.isLastColumn && 'uui-dt-last-column',
         css$y[`align-widgets-${props.alignActions || 'top'}`],
@@ -3857,7 +3277,7 @@ function DataTableCell(initialProps) {
     return React.createElement(DataTableCell$1, { ...props });
 }
 
-var css$x = {"root":"_3kfjJ2"};
+var css$x = {"root":"hZZdB8"};
 
 // Here we define a single instance of the renderCell function to make DataTableRow#shouldComponentUpdate work.
 // 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.
@@ -3869,18 +3289,48 @@ const renderDropMarkers = ({ ref, ...props }) => React.createElement(DropMarker,
 const propsMods = { renderCell, renderDropMarkers };
 const DataTableRow = /* @__PURE__ */withMods(DataTableRow$1, ({ borderBottom = true, size }) => {
     return [
-        css$x.root, 'uui-dt-vars', borderBottom && 'uui-dt-row-border', `uui-size-${size || settings.dataTable.sizes.body.defaultRow}`,
+        css$x.root, 'uui-dt-vars', borderBottom && 'uui-dt-row-border', `uui-size-${size || settings.sizes.dataTable.body.row.default}`,
     ];
 }, () => propsMods);
 
-var css$w = {"sorting-panel-container":"EaTxQB","sortingPanelContainer":"EaTxQB"};
+var css$w = {"sorting-panel-container":"WKx2Kn","sortingPanelContainer":"WKx2Kn"};
+
+var _path$q;
+function _extends$q() { return _extends$q = 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$q.apply(null, arguments); }
+var SvgTableSortAscOutline = function SvgTableSortAscOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$q({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$q || (_path$q = /*#__PURE__*/React.createElement("path", {
+    d: "M11 21V6.825L9.4 8.4 8 7l4-4 4 4-1.4 1.4L13 6.825V21h-2z"
+  })));
+};
+var ForwardRef$q = /*#__PURE__*/forwardRef(SvgTableSortAscOutline);
+
+var _path$p;
+function _extends$p() { return _extends$p = 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$p.apply(null, arguments); }
+var SvgTableSortDescOutline = function SvgTableSortDescOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$p({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$p || (_path$p = /*#__PURE__*/React.createElement("path", {
+    d: "M13 3v14.175l1.6-1.575L16 17l-4 4-4-4 1.4-1.4 1.6 1.575V3h2z"
+  })));
+};
+var ForwardRef$p = /*#__PURE__*/forwardRef(SvgTableSortDescOutline);
 
 const SortingPanelImpl = ({ sortDirection, onSort }) => {
     const sortAsc = useCallback(() => onSort(sortDirection === 'asc' ? undefined : 'asc'), [onSort]);
     const sortDesc = useCallback(() => onSort(sortDirection === 'desc' ? undefined : 'desc'), [onSort]);
     return (React__default.createElement(FlexCell, { cx: cx$1(css$w.sortingPanelContainer, 'uui-dropdownMenu-body') },
-        React__default.createElement(DropdownMenuButton, { isActive: sortDirection === 'asc', caption: i18n.pickerFilterHeader.sortAscending, icon: settings.dataTable.icons.header.ascSortIcon, onClick: sortAsc }),
-        React__default.createElement(DropdownMenuButton, { isActive: sortDirection === 'desc', caption: i18n.pickerFilterHeader.sortDescending, icon: settings.dataTable.icons.header.descSortIcon, onClick: sortDesc })));
+        React__default.createElement(DropdownMenuButton, { isActive: sortDirection === 'asc', caption: i18n.pickerFilterHeader.sortAscending, icon: ForwardRef$q, onClick: sortAsc }),
+        React__default.createElement(DropdownMenuButton, { isActive: sortDirection === 'desc', caption: i18n.pickerFilterHeader.sortDescending, icon: ForwardRef$p, onClick: sortDesc })));
 };
 const SortingPanel = /* @__PURE__ */React__default.memo(SortingPanelImpl);
 
@@ -3898,7 +3348,82 @@ const ColumnHeaderDropdownImpl = (props) => {
 };
 const ColumnHeaderDropdown = /* @__PURE__ */React__default.memo(ColumnHeaderDropdownImpl);
 
-var css$v = {"root":"nGV5We","caption-wrapper":"XtZKmg","captionWrapper":"XtZKmg","sort-icon":"B6qvae","sortIcon":"B6qvae","dropdown-icon":"pbj0lG","dropdownIcon":"pbj0lG","infoIcon":"EdBf1y","resizable":"ZSBoOb","align-right":"e80-HN","alignRight":"e80-HN","align-center":"XFR3t0","alignCenter":"XFR3t0","caption":"_5nTIUl","truncate":"mJvLDD","checkbox":"Cp1qOg","icon":"meOEAd","fold-all-icon":"_2wlRnI","foldAllIcon":"_2wlRnI","cell-tooltip":"A-waSW","cellTooltip":"A-waSW","upper-case":"_0ru6DK","upperCase":"_0ru6DK","resizing-marker":"_4bT4HB","resizingMarker":"_4bT4HB","pinned-right":"QZbIyA","pinnedRight":"QZbIyA","draggable":"_2ucOBE","ghost":"Vf3dAf","is-dragged-out":"GsBooV","isDraggedOut":"GsBooV","dnd-marker-left":"_3rdPlR","dndMarkerLeft":"_3rdPlR","dnd-marker-right":"YuyePp","dndMarkerRight":"YuyePp","cell-tooltip-wrapper":"GyaXSv","cellTooltipWrapper":"GyaXSv","cell-tooltip-text":"fK4yAa","cellTooltipText":"fK4yAa","tooltip-caption":"_2-6cFI","tooltipCaption":"_2-6cFI","tooltip-info":"_5FXT7m","tooltipInfo":"_5FXT7m"};
+var _path$o;
+function _extends$o() { return _extends$o = 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$o.apply(null, arguments); }
+var SvgTableSwapOutline = function SvgTableSwapOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$o({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$o || (_path$o = /*#__PURE__*/React.createElement("path", {
+    d: "M7 6.825V20h2V6.825L10.6 8.4 12 7 8 3 4 7l1.4 1.4L7 6.825zm10 10.35V4h-2v13.175L13.4 15.6 12 17l4 4 4-4-1.4-1.4-1.6 1.575z"
+  })));
+};
+var ForwardRef$o = /*#__PURE__*/forwardRef(SvgTableSwapOutline);
+
+var _path$n;
+function _extends$n() { return _extends$n = 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$n.apply(null, arguments); }
+var SvgContentFiltrationFill = function SvgContentFiltrationFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$n({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$n || (_path$n = /*#__PURE__*/React.createElement("path", {
+    d: "M14 13v8l-4-2v-6L2.95 4h18.1L14 13z"
+  })));
+};
+var ForwardRef$n = /*#__PURE__*/forwardRef(SvgContentFiltrationFill);
+
+var _path$m;
+function _extends$m() { return _extends$m = 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$m.apply(null, arguments); }
+var SvgNavigationChevronUpOutline = function SvgNavigationChevronUpOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$m({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$m || (_path$m = /*#__PURE__*/React.createElement("path", {
+    d: "M18.586 15.914 20 14.5l-8-8-8 8 1.414 1.414L12 9.328l6.586 6.586z"
+  })));
+};
+var ForwardRef$m = /*#__PURE__*/forwardRef(SvgNavigationChevronUpOutline);
+
+var _path$l;
+function _extends$l() { return _extends$l = 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$l.apply(null, arguments); }
+var SvgNavigationCollapseAllOutline = function SvgNavigationCollapseAllOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$l({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$l || (_path$l = /*#__PURE__*/React.createElement("path", {
+    d: "M16.5 4.414 15.086 3 12 6.086 8.914 3 7.5 4.414l4.5 4.5 4.5-4.5zM9 13v-2h6v2H9zm6.086 8 1.414-1.414-4.5-4.5-4.5 4.5L8.914 21 12 17.914 15.086 21z"
+  })));
+};
+var ForwardRef$l = /*#__PURE__*/forwardRef(SvgNavigationCollapseAllOutline);
+
+var _path$k;
+function _extends$k() { return _extends$k = 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$k.apply(null, arguments); }
+var SvgNavigationExpandAllOutline = function SvgNavigationExpandAllOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$k({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$k || (_path$k = /*#__PURE__*/React.createElement("path", {
+    d: "m16.5 7.5-1.414 1.414L12 5.828 8.914 8.914 7.5 7.5 12 3l4.5 4.5zM9 13v-2h6v2H9zm6.086 2.086L16.5 16.5 12 21l-4.5-4.5 1.414-1.414L12 18.17l3.086-3.085z"
+  })));
+};
+var ForwardRef$k = /*#__PURE__*/forwardRef(SvgNavigationExpandAllOutline);
+
+var css$v = {"root":"_7Vfg2P","caption-wrapper":"KQoiQt","captionWrapper":"KQoiQt","sort-icon":"msyKMt","sortIcon":"msyKMt","dropdown-icon":"_6UHrRy","dropdownIcon":"_6UHrRy","infoIcon":"segMLZ","resizable":"oSnigd","align-right":"sdCB39","alignRight":"sdCB39","align-center":"szENV8","alignCenter":"szENV8","caption":"_94V2Oy","truncate":"_1FIucA","checkbox":"I3VulH","icon":"l-rwIs","fold-all-icon":"Wj6vzc","foldAllIcon":"Wj6vzc","cell-tooltip":"uVPbhK","cellTooltip":"uVPbhK","upper-case":"-MDYrj","upperCase":"-MDYrj","resizing-marker":"_5NA14B","resizingMarker":"_5NA14B","pinned-right":"mibPoD","pinnedRight":"mibPoD","draggable":"XbYbAo","ghost":"NsX2ub","is-dragged-out":"_9IkSo6","isDraggedOut":"_9IkSo6","dnd-marker-left":"_9jkea0","dndMarkerLeft":"_9jkea0","dnd-marker-right":"NUkqZ5","dndMarkerRight":"NUkqZ5","cell-tooltip-wrapper":"NwrDBI","cellTooltipWrapper":"NwrDBI","cell-tooltip-text":"-zMpPT","cellTooltipText":"-zMpPT","tooltip-caption":"_7c9W7N","tooltipCaption":"_7c9W7N","tooltip-info":"bruX73","tooltipInfo":"bruX73"};
 
 class DataTableHeaderCell extends React.Component {
     constructor() {
@@ -3915,18 +3440,18 @@ class DataTableHeaderCell extends React.Component {
                 css$v.caption,
                 this.props.textCase === 'upper' && css$v.upperCase,
                 uuiDataTableHeaderCell.uuiTableHeaderCaption,
-                this.props.size >= '48' && css$v.truncate,
+                settings.sizes.dataTable.header.row.cell.truncate.includes(this.props.size) && css$v.truncate,
             ];
             return (React.createElement("div", { className: cx$1(css$v.captionWrapper, css$v['align-' + this.props.column.textAlign], uuiDataTableHeaderCell.uuiTableHeaderCaptionWrapper) },
                 React.createElement(Tooltip, { placement: "top", color: "inverted", content: renderTooltip(this.props.column), cx: css$v.cellTooltip, openDelay: 600 },
-                    React.createElement(Text, { key: "text", fontSize: settings.dataTable.sizes.header[this.props.textCase === 'upper' ? 'captionUppercase' : 'captionFontSize'], size: settings.dataTable.sizes.header.captionSize, cx: captionCx }, this.props.column.caption)),
-                this.props.column.isSortable && (!this.props.column.renderFilter || this.props.sortDirection) && (React.createElement(IconButton, { key: "sort", cx: cx$1(css$v.icon, css$v.sortIcon, this.props.sortDirection && css$v.sortIconActive, uuiDataTableHeaderCell.uuiTableHeaderSortIcon), color: this.props.sortDirection ? 'neutral' : 'secondary', icon: settings.dataTable.icons.header[this.props.sortDirection === 'desc' ? 'descSortIcon' : this.props.sortDirection === 'asc' ? 'ascSortIcon' : 'defaultSortIcon'] })),
-                this.props.isFilterActive && (React.createElement(IconButton, { key: "filter", cx: cx$1(css$v.icon, !this.props.sortDirection && css$v.filterIcon, uuiDataTableHeaderCell.uuiTableHeaderFilterIcon), color: "neutral", icon: settings.dataTable.icons.header.filterIcon })),
-                this.props.column.renderFilter && (React.createElement(IconButton, { key: "dropdown", cx: cx$1(css$v.icon, css$v.dropdownIcon, uuiDataTableHeaderCell.uuiTableHeaderDropdownIcon), color: "secondary", icon: settings.dataTable.icons.header[this.state.isDropdownOpen ? 'openedDropdownIcon' : 'dropdownIcon'] }))));
+                    React.createElement(Text, { key: "text", fontSize: settings.sizes.dataTable.header.row.cell.columnCaption[this.props.textCase === 'upper' ? 'uppercase' : 'fontSize'], size: settings.sizes.dataTable.header.row.cell.columnCaption.size, cx: captionCx }, this.props.column.caption)),
+                this.props.column.isSortable && (!this.props.column.renderFilter || this.props.sortDirection) && (React.createElement(IconButton, { key: "sort", cx: cx$1(css$v.icon, css$v.sortIcon, this.props.sortDirection && css$v.sortIconActive, uuiDataTableHeaderCell.uuiTableHeaderSortIcon), color: this.props.sortDirection ? 'neutral' : 'secondary', icon: this.props.sortDirection === 'desc' ? ForwardRef$p : this.props.sortDirection === 'asc' ? ForwardRef$q : ForwardRef$o })),
+                this.props.isFilterActive && (React.createElement(IconButton, { key: "filter", cx: cx$1(css$v.icon, !this.props.sortDirection && css$v.filterIcon, uuiDataTableHeaderCell.uuiTableHeaderFilterIcon), color: "neutral", icon: ForwardRef$n })),
+                this.props.column.renderFilter && (React.createElement(IconButton, { key: "dropdown", cx: cx$1(css$v.icon, css$v.dropdownIcon, uuiDataTableHeaderCell.uuiTableHeaderDropdownIcon), color: "secondary", icon: this.state.isDropdownOpen ? ForwardRef$m : ForwardRef$Q }))));
         };
         this.renderHeaderCheckbox = () => {
             if (this.props.selectAll && this.props.isFirstColumn) {
-                return (React.createElement(Checkbox, { size: settings.dataTable.sizes.header.cellCheckboxMap[this.props.size], ...this.props.selectAll, cx: cx$1(css$v.checkbox, uuiDataTableHeaderCell.uuiTableHeaderCheckbox) }));
+                return (React.createElement(Checkbox, { size: settings.sizes.dataTable.header.row.cell.checkbox[this.props.size], ...this.props.selectAll, cx: cx$1(css$v.checkbox, uuiDataTableHeaderCell.uuiTableHeaderCheckbox) }));
             }
         };
         this.renderFoldAllIcon = () => {
@@ -3934,7 +3459,7 @@ class DataTableHeaderCell extends React.Component {
                 return (React.createElement(Tooltip, { content: this.props.areAllFolded
                         ? i18n.tables.columnHeader.expandAllTooltip
                         : i18n.tables.columnHeader.collapseAllTooltip },
-                    React.createElement(IconButton, { color: "secondary", cx: cx$1(css$v.icon, css$v.foldAllIcon, uuiDataTableHeaderCell.uuiTableHeaderFoldAllIcon), icon: settings.dataTable.icons.header[this.props.areAllFolded ? 'unfoldIcon' : 'foldIcon'], onClick: this.props.onFoldAll, rawProps: {
+                    React.createElement(IconButton, { color: "secondary", cx: cx$1(css$v.icon, css$v.foldAllIcon, uuiDataTableHeaderCell.uuiTableHeaderFoldAllIcon), icon: this.props.areAllFolded ? ForwardRef$k : ForwardRef$l, onClick: this.props.onFoldAll, rawProps: {
                             'aria-label': this.props.areAllFolded ? 'Expand All' : 'Collapse All',
                             'aria-expanded': !!this.props.areAllFolded,
                         } })));
@@ -3947,23 +3472,23 @@ class DataTableHeaderCell extends React.Component {
             const { columnsGap, isFirstColumn } = this.props;
             if (columnsGap)
                 return isFirstColumn ? columnsGap : +columnsGap / 2;
-            return isFirstColumn ? settings.dataTable.sizes.header.defaultCellPaddingEdge : settings.dataTable.sizes.header.defaultCellPadding;
+            return isFirstColumn ? settings.sizes.dataTable.header.row.cell.defaults.paddingEdge : settings.sizes.dataTable.header.row.cell.defaults.padding;
         };
         this.getRightPadding = () => {
             const { columnsGap, isLastColumn } = this.props;
             if (columnsGap)
                 return isLastColumn ? columnsGap : +columnsGap / 2;
-            return isLastColumn ? settings.dataTable.sizes.header.defaultCellPaddingEdge : settings.dataTable.sizes.header.defaultCellPadding;
+            return isLastColumn ? settings.sizes.dataTable.header.row.cell.defaults.paddingEdge : settings.sizes.dataTable.header.row.cell.defaults.padding;
         };
         this.getResizingMarkerWidth = () => {
             const { columnsGap } = this.props;
-            return columnsGap ? +columnsGap / 2 : settings.dataTable.sizes.header.defaultResizeMarker;
+            return columnsGap ? +columnsGap / 2 : settings.sizes.dataTable.header.row.cell.defaults.resizeMarker;
         };
         this.renderCellContent = (props, dropdownProps) => {
             const isResizable = this.props.column.allowResizing ?? this.props.allowColumnsResizing;
             const onClickEvent = !props.isResizing && (!this.props.column.renderFilter ? props.toggleSort : dropdownProps?.onClick);
             const computeStyles = {
-                '--uui-dt-header-cell-icon-size': `${settings.dataTable.sizes.header.cellIconMap[this.props.size || settings.dataTable.sizes.header.defaultCell]}px`,
+                '--uui-dt-header-cell-icon-size': `${settings.sizes.dataTable.header.row.cell.iconSize[this.props.size || settings.sizes.dataTable.header.row.cell.defaults.size]}px`,
                 '--uui-dt-header-cell-padding-start': `${this.getLeftPadding()}px`,
                 '--uui-dt-header-cell-padding-end': `${this.getRightPadding()}px`,
                 '--uui-dt-header-cell-resizing-marker-width': `${this.getResizingMarkerWidth()}px`,
@@ -3971,7 +3496,7 @@ class DataTableHeaderCell extends React.Component {
             return (React.createElement(DataTableCellContainer, { column: this.props.column, ref: (ref) => {
                     props.ref(ref);
                     dropdownProps?.ref?.(ref);
-                }, cx: cx$1(uuiDataTableHeaderCell.uuiTableHeaderCell, (this.props.column.isSortable || this.props.isDropdown) && uuiMarkers.clickable, css$v.root, `uui-size-${this.props.size || settings.dataTable.sizes.header.defaultCell}`, 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 && css$v.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: {
+                }, cx: cx$1(uuiDataTableHeaderCell.uuiTableHeaderCell, (this.props.column.isSortable || this.props.isDropdown) && uuiMarkers.clickable, css$v.root, `uui-size-${this.props.size || settings.sizes.dataTable.header.row.cell.defaults.size}`, 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 && css$v.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: {
                     role: 'columnheader',
                     'aria-sort': this.props.sortDirection === 'asc' ? 'ascending' : this.props.sortDirection ? 'descending' : 'none',
                     ...props.eventHandlers,
@@ -3991,37 +3516,54 @@ class DataTableHeaderCell extends React.Component {
     }
 }
 
-var css$u = {"root":"GR-Gt5","caption-wrapper":"zidsL6","captionWrapper":"zidsL6","align-center":"OxNrzI","alignCenter":"OxNrzI","caption":"_4nza43","truncate":"JRbAiP","group-cell-tooltip":"poKrOq","groupCellTooltip":"poKrOq","upper-case":"bIO6Ce","upperCase":"bIO6Ce","group-cell-tooltip-wrapper":"oCtpMt","groupCellTooltipWrapper":"oCtpMt","group-cell-tooltip-text":"hyKahy","groupCellTooltipText":"hyKahy","tooltip-caption":"-iZXd2","tooltipCaption":"-iZXd2","tooltip-info":"_0yeZNQ","tooltipInfo":"_0yeZNQ"};
+var _path$j;
+function _extends$j() { return _extends$j = 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$j.apply(null, arguments); }
+var SvgActionSettingsFill = function SvgActionSettingsFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$j({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$j || (_path$j = /*#__PURE__*/React.createElement("path", {
+    d: "m9.25 22-.4-3.2a3.771 3.771 0 0 1-.612-.3 8.194 8.194 0 0 1-.563-.375L4.7 19.375l-2.75-4.75 2.575-1.95a2.39 2.39 0 0 1-.025-.338v-.675c0-.108.009-.22.025-.337L1.95 9.375l2.75-4.75 2.975 1.25c.184-.133.375-.258.575-.375.2-.117.4-.217.6-.3l.4-3.2h5.5l.4 3.2c.217.083.421.183.613.3.191.117.379.242.562.375l2.975-1.25 2.75 4.75-2.575 1.95c.017.117.025.229.025.337v.675c0 .109-.017.221-.05.338l2.575 1.95-2.75 4.75-2.95-1.25a6.826 6.826 0 0 1-.575.375c-.2.117-.4.217-.6.3l-.4 3.2h-5.5zm2.8-6.5c.967 0 1.792-.342 2.475-1.025A3.372 3.372 0 0 0 15.55 12c0-.967-.341-1.792-1.025-2.475A3.372 3.372 0 0 0 12.05 8.5c-.983 0-1.813.342-2.488 1.025A3.394 3.394 0 0 0 8.55 12c0 .967.338 1.792 1.012 2.475.676.683 1.505 1.025 2.488 1.025z"
+  })));
+};
+var ForwardRef$j = /*#__PURE__*/forwardRef(SvgActionSettingsFill);
+
+var css$u = {"root":"_7G-aol"};
+
+var css$t = {"root":"orSNlT","caption-wrapper":"Mvvde7","captionWrapper":"Mvvde7","align-center":"xh7e4K","alignCenter":"xh7e4K","caption":"MibKUx","truncate":"gc499d","group-cell-tooltip":"y53S0v","groupCellTooltip":"y53S0v","upper-case":"lGTyaD","upperCase":"lGTyaD","group-cell-tooltip-wrapper":"fE8qGT","groupCellTooltipWrapper":"fE8qGT","group-cell-tooltip-text":"rgdXwu","groupCellTooltipText":"rgdXwu","tooltip-caption":"_6Thokg","tooltipCaption":"_6Thokg","tooltip-info":"fFlp-1","tooltipInfo":"fFlp-1"};
 
 class DataTableHeaderGroupCell extends React.Component {
     constructor() {
         super(...arguments);
-        this.getTooltipContent = (column) => (React.createElement("div", { className: cx$1(css$u.groupCellTooltipWrapper, uuiDataTableHeaderGroupCell.uuiTableHeaderGroupCaptionTooltip) },
-            React.createElement(Text, { cx: [css$u.groupCellTooltipText, css$u.tooltipCaption] }, column.caption),
-            column.info && (React.createElement(Text, { cx: [css$u.groupCellTooltipText, css$u.tooltipInfo] }, column.info))));
+        this.getTooltipContent = (column) => (React.createElement("div", { className: cx$1(css$t.groupCellTooltipWrapper, uuiDataTableHeaderGroupCell.uuiTableHeaderGroupCaptionTooltip) },
+            React.createElement(Text, { cx: [css$t.groupCellTooltipText, css$t.tooltipCaption] }, column.caption),
+            column.info && (React.createElement(Text, { cx: [css$t.groupCellTooltipText, css$t.tooltipInfo] }, column.info))));
         this.getColumnCaption = () => {
             const renderTooltip = this.props.group.renderTooltip || this.getTooltipContent;
             const captionCx = [
-                css$u.caption,
-                this.props.textCase === 'upper' && css$u.upperCase,
+                css$t.caption,
+                this.props.textCase === 'upper' && css$t.upperCase,
                 uuiDataTableHeaderGroupCell.uuiTableHeaderGroupCaption,
-                this.props.size >= '48' && css$u.truncate,
+                settings.sizes.dataTable.header.row.groupCell.truncate.includes(this.props.size) && css$t.truncate,
             ];
-            return (React.createElement("div", { className: cx$1(css$u.captionWrapper, css$u['align-' + this.props.group.textAlign], uuiDataTableHeaderGroupCell.uuiTableHeaderGroupCaptionWrapper) },
-                React.createElement(Tooltip, { placement: "top", color: "inverted", content: renderTooltip(this.props.group), cx: css$u.groupCellTooltip, openDelay: 600 },
-                    React.createElement(Text, { key: "text", fontSize: settings.dataTable.sizes.header[this.props.textCase === 'upper' ? 'groupCellCaptionUppercase' : 'groupCellCaptionFontSize'], size: settings.dataTable.sizes.header.groupCellCaptionSize, cx: captionCx }, this.props.group.caption))));
+            return (React.createElement("div", { className: cx$1(css$t.captionWrapper, css$t['align-' + this.props.group.textAlign], uuiDataTableHeaderGroupCell.uuiTableHeaderGroupCaptionWrapper) },
+                React.createElement(Tooltip, { placement: "top", color: "inverted", content: renderTooltip(this.props.group), cx: css$t.groupCellTooltip, openDelay: 600 },
+                    React.createElement(Text, { key: "text", fontSize: settings.sizes.dataTable.header.row.groupCell.columnCaption[this.props.textCase === 'upper' ? 'uppercase' : 'fontSize'], size: settings.sizes.dataTable.header.row.groupCell.columnCaption.size, cx: captionCx }, this.props.group.caption))));
         };
         this.getLeftPadding = () => {
             const { columnsGap, isFirstCell } = this.props;
             if (columnsGap)
                 return isFirstCell ? columnsGap : +columnsGap / 2;
-            return isFirstCell ? settings.dataTable.sizes.header.defaultGroupCellPaddingEdge : settings.dataTable.sizes.header.defaultGroupCellPadding;
+            return isFirstCell ? settings.sizes.dataTable.header.row.groupCell.defaults.paddingEdge : settings.sizes.dataTable.header.row.groupCell.defaults.padding;
         };
         this.getRightPadding = () => {
             const { columnsGap, isLastCell } = this.props;
             if (columnsGap)
                 return isLastCell ? columnsGap : +columnsGap / 2;
-            return isLastCell ? settings.dataTable.sizes.header.defaultGroupCellPaddingEdge : settings.dataTable.sizes.header.defaultGroupCellPadding;
+            return isLastCell ? settings.sizes.dataTable.header.row.groupCell.defaults.paddingEdge : settings.sizes.dataTable.header.row.groupCell.defaults.padding;
         };
         this.renderCellContent = (props) => {
             const computeStyles = {
@@ -4030,7 +3572,7 @@ class DataTableHeaderGroupCell extends React.Component {
             };
             return (React.createElement(DataTableCellContainer, { column: this.props.group, ref: (ref) => {
                     props.ref(ref);
-                }, cx: cx$1(uuiDataTableHeaderGroupCell.uuiTableHeaderGroupCell, css$u.root, `uui-size-${this.props.size || settings.dataTable.sizes.header.defaultGroupCell}`, this.props.isFirstCell && 'uui-dt-header-first-column', this.props.isLastCell && 'uui-dt-header-last-column'), rawProps: {
+                }, cx: cx$1(uuiDataTableHeaderGroupCell.uuiTableHeaderGroupCell, css$t.root, `uui-size-${this.props.size || settings.sizes.dataTable.header.row.groupCell.defaults.size}`, this.props.isFirstCell && 'uui-dt-header-first-column', this.props.isLastCell && 'uui-dt-header-last-column'), rawProps: {
                     role: 'columnheader',
                     ...props.eventHandlers,
                 }, style: computeStyles }, this.getColumnCaption()));
@@ -4044,16 +3586,14 @@ class DataTableHeaderGroupCell extends React.Component {
             '--uui-dt-header-group-cell-padding-start': `${this.getLeftPadding()}px`,
             '--uui-dt-header-group-cell-padding-end': `${this.getRightPadding()}px`,
         };
-        return (React.createElement(DataTableCellContainer, { column: this.props.group, cx: cx$1(uuiDataTableHeaderGroupCell.uuiTableHeaderGroupCell, css$u.root, `uui-size-${this.props.size || settings.dataTable.sizes.header.defaultGroupCell}`, this.props.isFirstCell && 'uui-dt-header-first-column', this.props.isLastCell && 'uui-dt-header-last-column'), rawProps: { role: 'columnheader' }, style: computeStyles }, this.getColumnCaption()));
+        return (React.createElement(DataTableCellContainer, { column: this.props.group, cx: cx$1(uuiDataTableHeaderGroupCell.uuiTableHeaderGroupCell, css$t.root, `uui-size-${this.props.size || settings.sizes.dataTable.header.row.groupCell.defaults.size}`, this.props.isFirstCell && 'uui-dt-header-first-column', this.props.isLastCell && 'uui-dt-header-last-column'), rawProps: { role: 'columnheader' }, style: computeStyles }, this.getColumnCaption()));
     }
 }
 
-var css$t = {"root":"LAc08w"};
-
-const DataTableHeaderRow = /* @__PURE__ */withMods(DataTableHeaderRow$1, () => [css$t.root, 'uui-dt-vars'], (mods) => ({
+const DataTableHeaderRow = /* @__PURE__ */withMods(DataTableHeaderRow$1, () => [css$u.root, 'uui-dt-vars'], (mods) => ({
     renderCell: (props) => (React.createElement(DataTableHeaderCell, { ...props, size: mods.size, textCase: mods.textCase || 'normal', key: props.column.key, columnsGap: mods.columnsGap })),
     renderGroupCell: (props) => (React.createElement(DataTableHeaderGroupCell, { ...props, size: mods.size, textCase: mods.textCase || 'normal', key: props.key, columnsGap: mods.columnsGap })),
-    renderConfigButton: () => (React.createElement(IconButton, { key: "configuration", onClick: mods.onConfigButtonClick, cx: ['config-icon', `uui-size-${settings.dataTable.sizes.header.cellIconMap[mods.size || settings.dataTable.sizes.header.defaultRow]}`], color: "neutral", icon: settings.dataTable.icons.header.configIcon })),
+    renderConfigButton: () => (React.createElement(IconButton, { key: "configuration", onClick: mods.onConfigButtonClick, cx: ['config-icon', `uui-size-${settings.sizes.dataTable.header.row.cell.iconSize[mods.size || settings.sizes.dataTable.header.row.default]}`], color: "neutral", icon: ForwardRef$j })),
 }));
 
 const UUI_FILTERS_PANEL_ADD_BUTTON = 'uui-filters-panel-add-button';
@@ -4061,7 +3601,7 @@ const UUI_FILTERS_PANEL_ADD_BUTTON_BODY = 'uui-filters-panel-add-button-body';
 const UUI_FILTERS_PANEL_ITEM_BODY = 'uui-filters-panel-item-body';
 const UUI_FILTERS_PANEL_ITEM_TOGGLER = 'uui-filters-panel-item-toggler';
 
-var css$s = {"root":"_4-TTAQ","title-wrapper":"_5dHCg6","titleWrapper":"_5dHCg6","title":"xkKgNe","text-wrapper":"_5vgl3Q","textWrapper":"_5vgl3Q","selection":"_7buSnJ","postfix":"wqjXGW","selected":"RpYvo9"};
+var css$s = {"root":"C64e-b","title-wrapper":"pEQgEO","titleWrapper":"pEQgEO","title":"-P0wVc","text-wrapper":"gUG2Hi","textWrapper":"gUG2Hi","selection":"Rp1B8x","postfix":"Ux1Zbe","selected":"ZcDAkC"};
 
 const defaultSize = '36';
 const FilterPanelItemToggler = /* @__PURE__ */React.forwardRef((props, ref) => {
@@ -4098,7 +3638,7 @@ const FilterPanelItemToggler = /* @__PURE__ */React.forwardRef((props, ref) => {
             props.selection && (React.createElement("div", { className: css$s.textWrapper },
                 getSelectionText(),
                 props.postfix && (React.createElement(Text, { color: "primary", size: props.size, cx: css$s.postfix }, props.postfix))))),
-        !props.isDisabled && React.createElement(IconContainer, { icon: settings.filtersPanel.icons.itemDropdownIcon, flipY: props.isOpen, cx: "uui-icon-dropdown" })));
+        !props.isDisabled && React.createElement(IconContainer, { icon: systemIcons.foldingArrow, flipY: props.isOpen, cx: "uui-icon-dropdown" })));
 });
 
 const pickerHeight = 300;
@@ -4125,7 +3665,7 @@ function FilterPickerBody({ highlightSearchMatches = true, ...restProps }) {
     };
     const renderItem = (item, rowProps, dsState) => {
         const { flattenSearchResults } = view.getConfig();
-        return (React.createElement(PickerItem, { title: getName(item), highlightSearchMatches: highlightSearchMatches, ...(flattenSearchResults ? { subtitle: getSubtitle(rowProps, dsState) } : {}), dataSourceState: dsState, size: settings.filtersPanel.sizes.pickerInput.body.rowItem, ...rowProps }));
+        return (React.createElement(PickerItem, { title: getName(item), highlightSearchMatches: highlightSearchMatches, ...(flattenSearchResults ? { subtitle: getSubtitle(rowProps, dsState) } : {}), dataSourceState: dsState, size: settings.sizes.filtersPanel.pickerInput.body.default, ...rowProps }));
     };
     const onSelect = (row) => {
         handleDataSourceValueChange((currentDataSourceState) => ({ ...currentDataSourceState, search: '', selectedId: row.id }));
@@ -4134,20 +3674,18 @@ function FilterPickerBody({ highlightSearchMatches = true, ...restProps }) {
         if (rowProps.isSelectable && isSingleSelect() && props.editMode !== 'modal') {
             rowProps.onSelect = onSelect;
         }
-        return props.renderRow ? (props.renderRow(rowProps, dataSourceState)) : (React.createElement(DataPickerRow, { ...rowProps, key: rowProps.rowKey, size: settings.filtersPanel.sizes.pickerInput.body.row, padding: "12", renderItem: (item, itemProps) => renderItem(item, itemProps, dsState) }));
+        return props.renderRow ? (props.renderRow(rowProps, dataSourceState)) : (React.createElement(DataPickerRow, { ...rowProps, key: rowProps.rowKey, size: settings.sizes.filtersPanel.pickerInput.body.default, padding: "12", renderItem: (item, itemProps) => renderItem(item, itemProps, dsState) }));
     };
     const renderFooter = () => {
         const footerProps = getFooterProps();
-        return props.renderFooter
-            ? props.renderFooter(footerProps)
-            : React.createElement(DataPickerFooter, { ...footerProps, size: settings.filtersPanel.sizes.pickerInput.body.footer });
+        return props.renderFooter ? props.renderFooter(footerProps) : React.createElement(DataPickerFooter, { ...footerProps, size: settings.sizes.filtersPanel.pickerInput.body.default });
     };
     const renderBody = (bodyProps, rows) => {
         const renderedDataRows = rows.map((props) => renderRow(props, dataSourceState));
         const maxHeight = isMobile() ? document.documentElement.clientHeight : props.maxBodyHeight || pickerHeight;
         const maxWidth = isMobile() ? undefined : 360;
         return (React.createElement(React.Fragment, null,
-            React.createElement(DataPickerBody, { ...bodyProps, selectionMode: props.selectionMode, rows: renderedDataRows, maxHeight: maxHeight, maxWidth: maxWidth, searchSize: settings.filtersPanel.sizes.pickerInput.body.searchInput, editMode: "dropdown" }),
+            React.createElement(DataPickerBody, { ...bodyProps, selectionMode: props.selectionMode, rows: renderedDataRows, maxHeight: maxHeight, maxWidth: maxWidth, searchSize: settings.sizes.filtersPanel.pickerInput.body.default, editMode: "dropdown" }),
             renderFooter()));
     };
     const rows = getRows();
@@ -4235,7 +3773,7 @@ function FilterRangeDatePickerBody(props) {
                 React__default.createElement(LinkButton, { isDisabled: !value.from && !value.to, caption: i18n.pickerModal.clearAllButton, onClick: () => onValueChange(defaultRangeValue) })))));
 }
 
-var css$r = {"container":"_9cFCcM"};
+var css$r = {"container":"_83NsYD"};
 
 function FilterNumericBody(props) {
     const isInRangePredicate = props?.selectedPredicate === 'inRange' || props?.selectedPredicate === 'notInRange';
@@ -4316,22 +3854,22 @@ function FilterItemBody(props) {
     }
 }
 
-var _path$a;
-function _extends$a() { return _extends$a = 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$a.apply(null, arguments); }
+var _path$i;
+function _extends$i() { return _extends$i = 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$i.apply(null, arguments); }
 var SvgActionDeleteOutline = function SvgActionDeleteOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$a({
+  return /*#__PURE__*/React.createElement("svg", _extends$i({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     ref: ref
-  }, props), _path$a || (_path$a = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$i || (_path$i = /*#__PURE__*/React.createElement("path", {
     d: "M9 3v1H4v2h1v13a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6h1V4h-5V3H9zM7 6h10v13H7V6zm2 2v9h2V8H9zm4 0v9h2V8h-2z"
   })));
 };
-var ForwardRef$a = /*#__PURE__*/forwardRef(SvgActionDeleteOutline);
+var ForwardRef$i = /*#__PURE__*/forwardRef(SvgActionDeleteOutline);
 
-var css$q = {"header":"kEMYyV","removeButton":"MNKO4D","with-search":"zov3Cp","withSearch":"zov3Cp"};
+var css$q = {"header":"_2zDeM3","removeButton":"U-4ZU3","with-search":"YNVaVJ","withSearch":"YNVaVJ"};
 
 function useView(props, value) {
     const forceUpdate = useForceUpdate();
@@ -4420,7 +3958,7 @@ function FiltersToolbarItemImpl(props) {
     };
     const renderHeader = (hideTitle) => (React__default.createElement("div", { className: cx(css$q.header, isPickersType && (props.showSearch ?? css$q.withSearch)) },
         props.predicates ? (React__default.createElement(MultiSwitch, { items: props.predicates.map((i) => ({ id: i.predicate, caption: i.name })), value: predicate, onValueChange: changePredicate, size: "24" })) : (!hideTitle && (React__default.createElement(Text, { color: "secondary", size: "24", fontSize: "14" }, props.title))),
-        !props?.isAlwaysVisible && (React__default.createElement(LinkButton, { cx: css$q.removeButton, caption: i18n.filterToolbar.datePicker.removeCaption, onClick: removeOnclickHandler, size: "24", icon: ForwardRef$a }))));
+        !props?.isAlwaysVisible && (React__default.createElement(LinkButton, { cx: css$q.removeButton, caption: i18n.filterToolbar.datePicker.removeCaption, onClick: removeOnclickHandler, size: "24", icon: ForwardRef$i }))));
     const renderBody = (dropdownProps) => {
         const hideHeaderTitle = isPickersType && isMobileScreen;
         return isPickersType ? (React__default.createElement(PickerBodyMobileView, { ...dropdownProps, cx: UUI_FILTERS_PANEL_ITEM_BODY, title: props.title, width: 360, onClose: () => isOpenChange(false) },
@@ -4509,6 +4047,21 @@ function FiltersToolbarItemImpl(props) {
 }
 const FiltersPanelItem = /* @__PURE__ */React__default.memo(FiltersToolbarItemImpl);
 
+var _path$h;
+function _extends$h() { return _extends$h = 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$h.apply(null, arguments); }
+var SvgActionAddOutline = function SvgActionAddOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$h({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$h || (_path$h = /*#__PURE__*/React.createElement("path", {
+    d: "M13.286 3h-2.572v7.714H3v2.572h7.714V21h2.572v-7.714H21v-2.572h-7.714V3z"
+  })));
+};
+var ForwardRef$h = /*#__PURE__*/forwardRef(SvgActionAddOutline);
+
 const normalizeFilterWithPredicates = (filter) => {
     if (!filter) {
         return {};
@@ -4548,7 +4101,7 @@ const normalizeFilterWithPredicates = (filter) => {
     return result;
 };
 function FiltersToolbarImpl(props) {
-    const { filters, tableState, setTableState, size = (settings.filtersPanel.sizes.default) } = props;
+    const { filters, tableState, setTableState, size = settings.sizes.defaults.filtersPanel } = props;
     const [newFilterId, setNewFilterId] = useState(null);
     const pickerInputRef = useRef(null);
     const dataSource = useArrayDataSource({
@@ -4608,7 +4161,7 @@ function FiltersToolbarImpl(props) {
         return orderBy(selectedFilters, (f) => tableState.filtersConfig?.[f.field]?.order);
     }, [filters, tableState.filtersConfig]);
     const renderAddFilterToggler = useCallback((togglerProps) => {
-        return (React__default.createElement(Button, { size: size, onClick: togglerProps.onClick, ref: togglerProps.ref, caption: i18n.filterToolbar.addCaption, icon: settings.filtersPanel.icons.addFilterIcon, iconPosition: "left", fill: "ghost", color: "primary", cx: UUI_FILTERS_PANEL_ADD_BUTTON }));
+        return (React__default.createElement(Button, { size: size, onClick: togglerProps.onClick, ref: togglerProps.ref, caption: i18n.filterToolbar.addCaption, icon: ForwardRef$h, iconPosition: "left", fill: "ghost", color: "primary", cx: UUI_FILTERS_PANEL_ADD_BUTTON }));
     }, []);
     const getRowOptions = useCallback((item) => ({
         isDisabled: item.isAlwaysVisible,
@@ -4637,88 +4190,120 @@ function FiltersToolbarImpl(props) {
 }
 const FiltersPanel = /* @__PURE__ */React__default.memo(FiltersToolbarImpl);
 
-var css$p = {"divider":"Zydt7Y","dropdownDeleteIcon":"v9tW-G","presetsWrapper":"fh6hFx","addPresetContainer":"xNCudj","dropContainer":"D59x8G"};
+var css$p = {"divider":"Yk71gJ","dropdownDeleteIcon":"YOVnyc","presetsWrapper":"vP8Ge5","addPresetContainer":"ssnA78","dropContainer":"aiUq04"};
+
+var _path$g;
+function _extends$g() { return _extends$g = 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$g.apply(null, arguments); }
+var SvgNavigationMoreVertOutline = function SvgNavigationMoreVertOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$g({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$g || (_path$g = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z",
+    clipRule: "evenodd"
+  })));
+};
+var ForwardRef$g = /*#__PURE__*/forwardRef(SvgNavigationMoreVertOutline);
+
+var _path$f;
+function _extends$f() { return _extends$f = 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$f.apply(null, arguments); }
+var SvgNavigationRefreshOutline = function SvgNavigationRefreshOutline(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$f({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$f || (_path$f = /*#__PURE__*/React.createElement("path", {
+    d: "M12 20c-2.233 0-4.125-.775-5.675-2.325C4.775 16.125 4 14.233 4 12c0-2.233.775-4.125 2.325-5.675C7.875 4.775 9.767 4 12 4c1.15 0 2.25.238 3.3.713A7.617 7.617 0 0 1 18 6.75V4h2v7h-7V9h4.2a5.837 5.837 0 0 0-2.187-2.2A5.93 5.93 0 0 0 12 6c-1.667 0-3.083.583-4.25 1.75C6.583 8.917 6 10.333 6 12c0 1.667.583 3.083 1.75 4.25C8.917 17.417 10.333 18 12 18a5.863 5.863 0 0 0 3.475-1.1A5.81 5.81 0 0 0 17.65 14h2.1c-.467 1.767-1.417 3.208-2.85 4.325S13.833 20 12 20z"
+  })));
+};
+var ForwardRef$f = /*#__PURE__*/forwardRef(SvgNavigationRefreshOutline);
 
-var _path$9;
-function _extends$9() { return _extends$9 = 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$9.apply(null, arguments); }
+var _path$e;
+function _extends$e() { return _extends$e = 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$e.apply(null, arguments); }
 var SvgActionSaveOutline = function SvgActionSaveOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$9({
+  return /*#__PURE__*/React.createElement("svg", _extends$e({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     ref: ref
-  }, props), _path$9 || (_path$9 = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$e || (_path$e = /*#__PURE__*/React.createElement("path", {
     d: "M17 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14c1.1 0 2-.9 2-2V7l-4-4zm2 16H5V5h11.17L19 7.83V19zm-7-7c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3zM6 6h9v4H6V6z"
   })));
 };
-var ForwardRef$9 = /*#__PURE__*/forwardRef(SvgActionSaveOutline);
+var ForwardRef$e = /*#__PURE__*/forwardRef(SvgActionSaveOutline);
 
-var _path$8;
-function _extends$8() { return _extends$8 = 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$8.apply(null, arguments); }
+var _path$d;
+function _extends$d() { return _extends$d = 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$d.apply(null, arguments); }
 var SvgContentEditUndoOutline = function SvgContentEditUndoOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$8({
+  return /*#__PURE__*/React.createElement("svg", _extends$d({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     ref: ref
-  }, props), _path$8 || (_path$8 = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$d || (_path$d = /*#__PURE__*/React.createElement("path", {
     d: "M22.5 15a8.71 8.71 0 0 0-.712-3.513 9.158 9.158 0 0 0-1.926-2.85 9.152 9.152 0 0 0-2.85-1.925A8.709 8.709 0 0 0 13.5 6a8.71 8.71 0 0 0-3.513.712 9.167 9.167 0 0 0-2.85 1.925 9.154 9.154 0 0 0-1.924 2.85A8.705 8.705 0 0 0 4.5 15v.15L2.95 13.6 1.5 15l4 4 4-4-1.45-1.4-1.55 1.55V15c0-1.95.679-3.604 2.037-4.962C9.896 8.679 11.55 8 13.5 8c1.95 0 3.604.68 4.962 2.038C19.821 11.396 20.5 13.05 20.5 15h2z"
   })));
 };
-var ForwardRef$8 = /*#__PURE__*/forwardRef(SvgContentEditUndoOutline);
+var ForwardRef$d = /*#__PURE__*/forwardRef(SvgContentEditUndoOutline);
 
-var _path$7;
-function _extends$7() { return _extends$7 = 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$7.apply(null, arguments); }
+var _path$c;
+function _extends$c() { return _extends$c = 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$c.apply(null, arguments); }
 var SvgActionCopyContentOutline = function SvgActionCopyContentOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$7({
+  return /*#__PURE__*/React.createElement("svg", _extends$c({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     ref: ref
-  }, props), _path$7 || (_path$7 = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$c || (_path$c = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     d: "M19 19H9V9h10M9 7a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2H9zm5-4H5a2 2 0 0 0-2 2v9h2V5h9V3z",
     clipRule: "evenodd"
   })));
 };
-var ForwardRef$7 = /*#__PURE__*/forwardRef(SvgActionCopyContentOutline);
+var ForwardRef$c = /*#__PURE__*/forwardRef(SvgActionCopyContentOutline);
 
-var _path$6;
-function _extends$6() { return _extends$6 = 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$6.apply(null, arguments); }
+var _path$b;
+function _extends$b() { return _extends$b = 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$b.apply(null, arguments); }
 var SvgContentEditFill = function SvgContentEditFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$6({
+  return /*#__PURE__*/React.createElement("svg", _extends$b({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     ref: ref
-  }, props), _path$6 || (_path$6 = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$b || (_path$b = /*#__PURE__*/React.createElement("path", {
     d: "m19.3 8.925-4.25-4.2 1.4-1.4a1.92 1.92 0 0 1 1.413-.575 1.92 1.92 0 0 1 1.412.575l1.4 1.4c.383.383.583.846.6 1.388a1.806 1.806 0 0 1-.55 1.387L19.3 8.925zM17.85 10.4 7.25 21H3v-4.25l10.6-10.6 4.25 4.25z"
   })));
 };
-var ForwardRef$6 = /*#__PURE__*/forwardRef(SvgContentEditFill);
+var ForwardRef$b = /*#__PURE__*/forwardRef(SvgContentEditFill);
 
-var _path$5, _path2;
-function _extends$5() { return _extends$5 = 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$5.apply(null, arguments); }
+var _path$a, _path2$3;
+function _extends$a() { return _extends$a = 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$a.apply(null, arguments); }
 var SvgContentLinkOutline = function SvgContentLinkOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$5({
+  return /*#__PURE__*/React.createElement("svg", _extends$a({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     ref: ref
-  }, props), _path$5 || (_path$5 = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$a || (_path$a = /*#__PURE__*/React.createElement("path", {
     d: "M12 4.93A5 5 0 0 1 19.07 12l-1.06 1.06c.12-.85.022-1.725-.295-2.534a3 3 0 0 0-4.302-4.182l-2.828 2.828a3 3 0 0 0-.07 4.17l.07.073-1.415 1.414a5 5 0 0 1 0-7.071L12 4.929z"
-  })), _path2 || (_path2 = /*#__PURE__*/React.createElement("path", {
+  })), _path2$3 || (_path2$3 = /*#__PURE__*/React.createElement("path", {
     d: "m4.93 12 .989-.99a5.018 5.018 0 0 0 .297 2.54 3 3 0 0 0 4.37 4.107l2.829-2.828a3 3 0 0 0-.828-4.83l1.464-1.463a5 5 0 0 1 .778 7.707L12 19.071a5 5 0 0 1-7.07-7.07z"
   })));
 };
-var ForwardRef$5 = /*#__PURE__*/forwardRef(SvgContentLinkOutline);
+var ForwardRef$a = /*#__PURE__*/forwardRef(SvgContentLinkOutline);
 
-var css$o = {"delete-button":"IL5D3N","deleteButton":"IL5D3N","tab-button":"YQTYfl","tabButton":"YQTYfl","targetOpen":"t2R77m"};
+var css$o = {"delete-button":"bSgP-j","deleteButton":"bSgP-j","tab-button":"aRGW-T","tabButton":"aRGW-T","targetOpen":"FCtTUh"};
 
 function PresetActionsDropdown(props) {
     const { uuiNotifications } = useUuiContext();
@@ -4766,26 +4351,26 @@ function PresetActionsDropdown(props) {
         const isRenameAvailable = props.preset.id === props.activePresetId && !isReadonlyPreset;
         return (React__default.createElement(DropdownMenuBody, { ...dropdownProps },
             isPresetChanged && (React__default.createElement(React__default.Fragment, null,
-                !isReadonlyPreset && (React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-save-in-current`, icon: ForwardRef$E, caption: "Save in current", onClick: () => { dropdownProps.onClose(); saveInCurrentHandler(); } })),
-                React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-save-as-new`, icon: ForwardRef$9, caption: "Save as new", 
+                !isReadonlyPreset && (React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-save-in-current`, icon: ForwardRef$f, caption: "Save in current", onClick: () => { dropdownProps.onClose(); saveInCurrentHandler(); } })),
+                React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-save-as-new`, icon: ForwardRef$e, caption: "Save as new", 
                     // We add setTimeout to call addPreset after dropdown will be closed, since dropdown has focus lock, and it broke autofocus on add new preset input
                     onClick: () => { dropdownProps.onClose(); setTimeout(() => props.addPreset(), 0); } }),
-                React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-discard`, icon: ForwardRef$8, caption: "Discard all changes", onClick: () => { dropdownProps.onClose(); discardAllChangesHandler(); } }),
+                React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-discard`, icon: ForwardRef$d, caption: "Discard all changes", onClick: () => { dropdownProps.onClose(); discardAllChangesHandler(); } }),
                 React__default.createElement(DropdownMenuSplitter, { key: "discard-splitter" }))),
-            isRenameAvailable && (React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-rename`, icon: ForwardRef$6, caption: "Rename", onClick: props.renamePreset })),
-            React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-duplicate`, icon: ForwardRef$7, caption: "Duplicate", onClick: () => { dropdownProps.onClose(); duplicateHandler(); } }),
-            React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-copyLink`, icon: ForwardRef$5, caption: "Copy Link", onClick: copyUrlToClipboard }),
+            isRenameAvailable && (React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-rename`, icon: ForwardRef$b, caption: "Rename", onClick: props.renamePreset })),
+            React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-duplicate`, icon: ForwardRef$c, caption: "Duplicate", onClick: () => { dropdownProps.onClose(); duplicateHandler(); } }),
+            React__default.createElement(DropdownMenuButton, { key: `${props.preset.id}-copyLink`, icon: ForwardRef$a, caption: "Copy Link", onClick: copyUrlToClipboard }),
             !isReadonlyPreset && (React__default.createElement(React__default.Fragment, null,
                 React__default.createElement(DropdownMenuSplitter, { key: "delete-splitter" }),
-                React__default.createElement(DropdownMenuButton, { icon: ForwardRef$a, caption: "Delete", cx: css$o.deleteButton, onClick: deleteHandler })))));
+                React__default.createElement(DropdownMenuButton, { icon: ForwardRef$i, caption: "Delete", cx: css$o.deleteButton, onClick: deleteHandler })))));
     };
     const renderTarget = useCallback((dropdownProps) => {
-        return (React__default.createElement(IconButton, { cx: [css$o.tabButton, dropdownProps.isOpen && css$o.targetOpen], color: props.preset.id === props.activePresetId ? 'primary' : 'neutral', ...dropdownProps, icon: ForwardRef$F, size: "18" }));
+        return (React__default.createElement(IconButton, { cx: [css$o.tabButton, dropdownProps.isOpen && css$o.targetOpen], color: props.preset.id === props.activePresetId ? 'primary' : 'neutral', ...dropdownProps, icon: ForwardRef$g, size: "18" }));
     }, []);
     return (React__default.createElement(Dropdown, { renderBody: renderBody, renderTarget: renderTarget, placement: "bottom-end", modifiers: [{ name: 'offset', options: { offset: [0, 22] } }] }));
 }
 
-var css$n = {"preset-input-cell":"HRpjMj","presetInputCell":"HRpjMj","preset-input":"qZHWNY","presetInput":"qZHWNY"};
+var css$n = {"preset-input-cell":"aRpkq5","presetInputCell":"aRpkq5","preset-input":"W1Pjj5","presetInput":"W1Pjj5"};
 
 const UUI_PRESETS_PANEL_ADD_BUTTON = 'uui-presets-panel-add-button';
 const UUI_PRESETS_PANEL_MORE_BUTTON = 'uui-presets-panel-more-button';
@@ -4817,7 +4402,7 @@ function PresetInput(props) {
         React__default.createElement(TextInput, { cx: css$n.presetInput, onValueChange: setPresetCaption, value: presetCaption, onCancel: cancelActionHandler, onAccept: acceptActionHandler, onBlur: newPresetOnBlurHandler, autoFocus: true, maxLength: 50, isReadonly: readonly })));
 }
 
-var css$m = {"preset":"UNn3-z","activePreset":"_4sWE3X"};
+var css$m = {"preset":"pqIPK6","activePreset":"EqjkKT"};
 
 function Preset(props) {
     const [isRenamePreset, setIsRenamePreset] = useState(false);
@@ -4842,22 +4427,22 @@ function Preset(props) {
     return (React__default.createElement(FlexCell, { key: props.preset.id, alignSelf: "center", width: "auto" }, isRenamePreset ? (React__default.createElement(PresetInput, { onCancel: cancelRenamePreset, onSuccess: handlePresetRename, preset: props.preset })) : (React__default.createElement(TabButton, { caption: props.preset.name, onClick: !isPresetActive && choosePresetHandler, cx: [css$m.preset, isPresetActive && css$m.activePreset, UUI_PRESETS_PANEL_PRESET], size: "60", withNotify: isPresetActive && props.hasPresetChanged(props.preset), icon: PresetActionsDropdownComponent, iconPosition: "right", isLinkActive: isPresetActive }))));
 }
 
-var _path$4;
-function _extends$4() { return _extends$4 = 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$4.apply(null, arguments); }
+var _path$9;
+function _extends$9() { return _extends$9 = 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$9.apply(null, arguments); }
 var SvgActionDeleteForeverFill = function SvgActionDeleteForeverFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$4({
+  return /*#__PURE__*/React.createElement("svg", _extends$9({
     xmlns: "http://www.w3.org/2000/svg",
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     ref: ref
-  }, props), _path$4 || (_path$4 = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$9 || (_path$9 = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     d: "M7 21c-1.1 0-2-.9-2-2V8h14v11c0 1.1-.9 2-2 2H7zm8-17h5v2H4V4h5V3h6v1zM9.4 18.5l2.6-2.6 2.6 2.6 1.4-1.4-2.6-2.6 2.6-2.6-1.4-1.4-2.6 2.6-2.6-2.6L8 11.9l2.6 2.6L8 17.1l1.4 1.4z",
     clipRule: "evenodd"
   })));
 };
-var ForwardRef$4 = /*#__PURE__*/forwardRef(SvgActionDeleteForeverFill);
+var ForwardRef$9 = /*#__PURE__*/forwardRef(SvgActionDeleteForeverFill);
 
 function PresetsPanel(props) {
     const [isAddingPreset, setIsAddingPreset] = useState(false);
@@ -4872,7 +4457,7 @@ function PresetsPanel(props) {
         return React__default.createElement(Preset, { key: preset.id, preset: preset, addPreset: setAddingPreset, ...presetApi });
     };
     const renderAddPresetButton = useCallback(() => {
-        return (React__default.createElement("div", { key: "addingPresetBlock", className: css$p.addPresetContainer }, !isAddingPreset ? (React__default.createElement(Button, { cx: UUI_PRESETS_PANEL_ADD_BUTTON, onClick: setAddingPreset, caption: i18n.presetPanel.addCaption, icon: ForwardRef$s, iconPosition: "left", fill: "ghost", color: "primary" })) : (React__default.createElement(PresetInput, { onCancel: cancelAddingPreset, onSuccess: props.createNewPreset }))));
+        return (React__default.createElement("div", { key: "addingPresetBlock", className: css$p.addPresetContainer }, !isAddingPreset ? (React__default.createElement(Button, { cx: UUI_PRESETS_PANEL_ADD_BUTTON, onClick: setAddingPreset, caption: i18n.presetPanel.addCaption, icon: ForwardRef$h, iconPosition: "left", fill: "ghost", color: "primary" })) : (React__default.createElement(PresetInput, { onCancel: cancelAddingPreset, onSuccess: props.createNewPreset }))));
     }, [isAddingPreset]);
     const onPresetDropdownSelect = (preset) => {
         props.choosePreset(preset.preset);
@@ -4881,7 +4466,7 @@ function PresetsPanel(props) {
         return (React__default.createElement(Dropdown, { key: "more", renderTarget: (props) => (React__default.createElement(FlexRow, null,
                 React__default.createElement("div", { className: css$p.divider }),
                 React__default.createElement(Button, { cx: UUI_PRESETS_PANEL_MORE_BUTTON, fill: "ghost", color: "secondary", caption: `${hiddenItems?.length || ''} more`, ...props }))), renderBody: (propsBody) => (React__default.createElement(DropdownMenuBody, { minWidth: 230, maxHeight: 300, ...propsBody },
-                React__default.createElement(ScrollBars, null, hiddenItems.map((hiddenItem) => (React__default.createElement(DropdownMenuButton, { key: hiddenItem.preset.id, onClick: () => onPresetDropdownSelect(hiddenItem), caption: hiddenItem.preset.name, icon: !hiddenItem.preset.isReadonly && ForwardRef$4, iconPosition: "right", cx: css$p.dropdownDeleteIcon, onIconClick: !hiddenItem.preset.isReadonly && (() => props.deletePreset(hiddenItem.preset)) })))))) }));
+                React__default.createElement(ScrollBars, null, hiddenItems.map((hiddenItem) => (React__default.createElement(DropdownMenuButton, { key: hiddenItem.preset.id, onClick: () => onPresetDropdownSelect(hiddenItem), caption: hiddenItem.preset.name, icon: !hiddenItem.preset.isReadonly && ForwardRef$9, iconPosition: "right", cx: css$p.dropdownDeleteIcon, onIconClick: !hiddenItem.preset.isReadonly && (() => props.deletePreset(hiddenItem.preset)) })))))) }));
     };
     const getPresetPriority = (preset, index) => {
         return preset.id === props.activePresetId ? 100499 : 1000 - index;
@@ -4943,7 +4528,62 @@ const useColumnsWithFilters = (initialColumns, filters) => {
     return columns;
 };
 
-var css$l = {"unpin-icon":"vhOhyL","unpinIcon":"vhOhyL","pin-toggler-icon":"NHCZXo","pinTogglerIcon":"NHCZXo"};
+var _path$8;
+function _extends$8() { return _extends$8 = 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$8.apply(null, arguments); }
+var SvgActionLockFill = function SvgActionLockFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$8({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$8 || (_path$8 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M12 18a2 2 0 1 0 0-4 2 2 0 0 0 0 4zM7 9V7a5 5 0 0 1 10 0v2h1a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V11a2 2 0 0 1 2-2h1zm2 0h6V7a3 3 0 1 0-6 0v2z",
+    clipRule: "evenodd"
+  })));
+};
+var ForwardRef$8 = /*#__PURE__*/forwardRef(SvgActionLockFill);
+
+var _path$7, _path2$2;
+function _extends$7() { return _extends$7 = 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$7.apply(null, arguments); }
+var SvgTableGroupColumnLeftFill = function SvgTableGroupColumnLeftFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$7({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$7 || (_path$7 = /*#__PURE__*/React.createElement("path", {
+    d: "M5 3a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h6V3H5z"
+  })), _path2$2 || (_path2$2 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M13 21V3h6a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-6zm2-16h4v14h-4V5z",
+    clipRule: "evenodd"
+  })));
+};
+var ForwardRef$7 = /*#__PURE__*/forwardRef(SvgTableGroupColumnLeftFill);
+
+var _path$6, _path2$1;
+function _extends$6() { return _extends$6 = 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$6.apply(null, arguments); }
+var SvgTableGroupColumnRightFill = function SvgTableGroupColumnRightFill(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$6({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    ref: ref
+  }, props), _path$6 || (_path$6 = /*#__PURE__*/React.createElement("path", {
+    d: "M13 3h6a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-6V3z"
+  })), _path2$1 || (_path2$1 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M9 5H5v14h4V5zM5 3a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h6V3H5z",
+    clipRule: "evenodd"
+  })));
+};
+var ForwardRef$6 = /*#__PURE__*/forwardRef(SvgTableGroupColumnRightFill);
+
+var css$l = {"unpin-icon":"_85FnOD","unpinIcon":"_85FnOD","pin-toggler-icon":"_96FQli","pinTogglerIcon":"_96FQli"};
 
 function PinIconButton(props) {
     const i18nLocal = i18n.tables.columnsConfigurationModal;
@@ -4961,23 +4601,23 @@ function PinIconButton(props) {
     else {
         pinUnpinNode = (React.createElement(React.Fragment, null,
             React.createElement(Tooltip, { content: i18nLocal.pinColumnToTheLeftButton, placement: "bottom", color: "inverted" },
-                React.createElement(IconButton, { cx: css$l.pinTogglerIcon, icon: settings.dataTable.icons.columnsConfigurationModal.pinLeftIcon, onClick: () => onTogglePin('left'), isDisabled: isPinnedAlways })),
+                React.createElement(IconButton, { cx: css$l.pinTogglerIcon, icon: ForwardRef$7, onClick: () => onTogglePin('left'), isDisabled: isPinnedAlways })),
             React.createElement(Tooltip, { content: i18nLocal.pinColumnToTheRightButton, placement: "bottom", color: "inverted" },
-                React.createElement(IconButton, { cx: css$l.pinTogglerIcon, icon: settings.dataTable.icons.columnsConfigurationModal.pinRightIcon, onClick: () => onTogglePin('right'), isDisabled: isPinnedAlways }))));
+                React.createElement(IconButton, { cx: css$l.pinTogglerIcon, icon: ForwardRef$6, onClick: () => onTogglePin('right'), isDisabled: isPinnedAlways }))));
     }
     return pinUnpinNode;
 }
 function getUnpinIcon(params) {
     const { isPinnedAlways, pinPosition } = params;
     if (isPinnedAlways) {
-        return settings.dataTable.icons.columnsConfigurationModal.lockIcon;
+        return ForwardRef$8;
     }
     switch (pinPosition) {
         case 'left': {
-            return settings.dataTable.icons.columnsConfigurationModal.pinLeftIcon;
+            return ForwardRef$7;
         }
         case 'right': {
-            return settings.dataTable.icons.columnsConfigurationModal.pinRightIcon;
+            return ForwardRef$6;
         }
         default: {
             return;
@@ -4985,7 +4625,24 @@ function getUnpinIcon(params) {
     }
 }
 
-var css$k = {"row-wrapper":"ZC1pIB","rowWrapper":"ZC1pIB","pin-icon-button":"_5wpIYf","pinIconButton":"_5wpIYf","not-pinned":"AMJFRE","notPinned":"AMJFRE","checkbox":"-hrr9u","drag-handle":"MZzGEf","dragHandle":"MZzGEf","dnd-disabled":"W2i6zu","dndDisabled":"W2i6zu"};
+var _path$5;
+function _extends$5() { return _extends$5 = 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$5.apply(null, arguments); }
+var SvgActionDragIndicator18 = function SvgActionDragIndicator18(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$5({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 18,
+    height: 18,
+    viewBox: "0 0 18 18",
+    ref: ref
+  }, props), _path$5 || (_path$5 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M8 13.5c0 .825-.675 1.5-1.5 1.5S5 14.325 5 13.5 5.675 12 6.5 12s1.5.675 1.5 1.5zm-1.5-6C5.675 7.5 5 8.175 5 9s.675 1.5 1.5 1.5S8 9.825 8 9s-.675-1.5-1.5-1.5zm0-4.5C5.675 3 5 3.675 5 4.5S5.675 6 6.5 6 8 5.325 8 4.5 7.325 3 6.5 3zm5 3c.825 0 1.5-.675 1.5-1.5S12.325 3 11.5 3 10 3.675 10 4.5 10.675 6 11.5 6zm0 1.5c-.825 0-1.5.675-1.5 1.5s.675 1.5 1.5 1.5S13 9.825 13 9s-.675-1.5-1.5-1.5zm0 4.5c-.825 0-1.5.675-1.5 1.5s.675 1.5 1.5 1.5 1.5-.675 1.5-1.5-.675-1.5-1.5-1.5z",
+    clipRule: "evenodd"
+  })));
+};
+var ForwardRef$5 = /*#__PURE__*/forwardRef(SvgActionDragIndicator18);
+
+var css$k = {"row-wrapper":"qnxzLP","rowWrapper":"qnxzLP","pin-icon-button":"SC8GS4","pinIconButton":"SC8GS4","not-pinned":"g46j1h","notPinned":"g46j1h","checkbox":"ugUK-4","drag-handle":"HXYO-8","dragHandle":"HXYO-8","dnd-disabled":"_5CvVv0","dndDisabled":"_5CvVv0"};
 
 const ColumnRow = /* @__PURE__ */React.memo(function ColumnRow(props) {
     const { column } = props;
@@ -4998,8 +4655,8 @@ const ColumnRow = /* @__PURE__ */React.memo(function ColumnRow(props) {
         const wrapperClasses = cx$1(css$k.rowWrapper, !isPinned && css$k.notPinned, dndActorParams.isDragGhost && uuiDndState.dragGhost, 'uui-dt-columns-config-row');
         const { onTouchStart, onPointerDown, ...restEventHandlers } = dndActorParams.eventHandlers;
         const { ref, ...dndActorPropsWithoutRef } = dndActorParams;
-        return (React.createElement(FlexRow, { size: settings.dataTable.sizes.columnsConfigurationModal.columnRow, cx: wrapperClasses, ref: dndActorParams.ref, rawProps: { ...restEventHandlers }, alignItems: "top" },
-            React.createElement(DragHandle, { dragHandleIcon: settings.dataTable.icons.columnsConfigurationModal.dragIndicator, rawProps: { onTouchStart, onPointerDown }, isDisabled: !isDndAllowed, cx: cx$1(css$k.dragHandle, !isDndAllowed && css$k.dndDisabled) }),
+        return (React.createElement(FlexRow, { size: settings.sizes.dataTable.columnsConfigurationModal.columnRow, cx: wrapperClasses, ref: dndActorParams.ref, rawProps: { ...restEventHandlers }, alignItems: "top" },
+            React.createElement(DragHandle, { dragHandleIcon: ForwardRef$5, rawProps: { onTouchStart, onPointerDown }, isDisabled: !isDndAllowed, cx: cx$1(css$k.dragHandle, !isDndAllowed && css$k.dndDisabled) }),
             React.createElement(Checkbox, { key: column.key, label: props.renderItem ? props.renderItem(props.column) : column.caption, value: isVisible, onValueChange: toggleVisibility, isReadonly: column.isAlwaysVisible || column.isLocked, cx: css$k.checkbox }),
             React.createElement(FlexRow, { size: null, cx: css$k.pinIconButton },
                 React.createElement(PinIconButton, { pinPosition: pinPosition, canUnpin: !isPinnedAlways, onTogglePin: togglePin })),
@@ -5008,11 +4665,11 @@ const ColumnRow = /* @__PURE__ */React.memo(function ColumnRow(props) {
     return (React.createElement(DndActor, { key: column.key, srcData: isDndAllowed && data, dstData: data, canAcceptDrop: onCanAcceptDrop, onDrop: onDrop, render: renderContent }));
 });
 
-var css$j = {"root":"Wh76Zc","main-panel":"oJYp9R","mainPanel":"oJYp9R","group":"mWeg2x","group-title":"EFhdsz","groupTitle":"EFhdsz","group-items":"MVZ73D","groupItems":"MVZ73D","no-data":"mNP6av","noData":"mNP6av","no-data-title":"calT1B","noDataTitle":"calT1B","no-data-sub-title":"BsTl1I","noDataSubTitle":"BsTl1I","h-divider":"T-1Fiu","hDivider":"T-1Fiu","search-area":"A3kOG5","searchArea":"A3kOG5","subgroup-accordion":"aCKxpA","subgroupAccordion":"aCKxpA","subgroup":"mbgIvd","subgroup-title":"N9CAvG","subgroupTitle":"N9CAvG"};
+var css$j = {"root":"gCav-U","main-panel":"_0fXcOs","mainPanel":"_0fXcOs","group":"_43jszA","group-title":"_1eHeYN","groupTitle":"_1eHeYN","group-items":"qrrLNn","groupItems":"qrrLNn","no-data":"ZJZyaF","noData":"ZJZyaF","no-data-title":"KzZir7","noDataTitle":"KzZir7","no-data-sub-title":"_6r36vR","noDataSubTitle":"_6r36vR","h-divider":"_490NyC","hDivider":"_490NyC","search-area":"XG-TEp","searchArea":"XG-TEp","subgroup-accordion":"kxwucb","subgroupAccordion":"kxwucb","subgroup":"O7kjf2","subgroup-title":"ioJahS","subgroupTitle":"ioJahS"};
 
 const renderGroupTitle = (title, amount) => (React.createElement(FlexRow, { cx: css$j.group },
     React.createElement(Text, { size: "none", cx: css$j.groupTitle }, title),
-    React.createElement(CountIndicator, { caption: amount, color: "neutral", size: settings.dataTable.sizes.columnsConfigurationModal.countIndicator }),
+    React.createElement(CountIndicator, { caption: amount, color: "neutral", size: settings.sizes.dataTable.columnsConfigurationModal.countIndicator }),
     React.createElement(FlexSpacer, null)));
 function ColumnsConfigurationModal(props) {
     const i18n$1 = i18n.tables.columnsConfigurationModal;
@@ -5057,13 +4714,13 @@ function ColumnsConfigurationModal(props) {
     };
     const applyButton = React.createElement(Button, { caption: i18n$1.applyButton, isDisabled: !hasAnySelectedColumns, color: "primary", onClick: apply });
     return (React.createElement(ModalBlocker, { ...modalProps },
-        React.createElement(ModalWindow, { cx: css$j.root, height: "95dvh", maxHeight: "95dvh", width: settings.dataTable.sizes.columnsConfigurationModal.width },
+        React.createElement(ModalWindow, { cx: css$j.root, height: "95dvh", maxHeight: "95dvh", width: settings.sizes.dataTable.columnsConfigurationModal.width },
             React.createElement(ModalHeader, { title: i18n$1.configureColumnsTitle, onClose: close }),
             React.createElement(FlexRow, { borderBottom: true, cx: css$j.searchArea },
-                React.createElement(SearchInput, { size: settings.dataTable.sizes.columnsConfigurationModal.searchInput, value: searchValue, onValueChange: setSearchValue, placeholder: i18n$1.searchPlaceholder }),
+                React.createElement(SearchInput, { size: settings.sizes.dataTable.columnsConfigurationModal.search, value: searchValue, onValueChange: setSearchValue, placeholder: i18n$1.searchPlaceholder }),
                 React.createElement(Dropdown, { closeOnTargetClick: true, renderBody: () => (React.createElement(DropdownMenuBody, { minWidth: 100 },
                         React.createElement(DropdownMenuButton, { caption: i18n$1.clearAllButton, onClick: uncheckAll }),
-                        React.createElement(DropdownMenuButton, { caption: i18n$1.selectAllButton, onClick: checkAll }))), renderTarget: (props) => (React.createElement(Button, { ...props, fill: "none", icon: settings.dataTable.icons.columnsConfigurationModal.menuIcon, size: settings.dataTable.sizes.columnsConfigurationModal.menuButton, color: "secondary", isDropdown: false })) })),
+                        React.createElement(DropdownMenuButton, { caption: i18n$1.selectAllButton, onClick: checkAll }))), renderTarget: (props) => (React.createElement(Button, { ...props, fill: "none", icon: ForwardRef$g, size: settings.sizes.dataTable.columnsConfigurationModal.search, color: "secondary", isDropdown: false })) })),
             React.createElement(Panel, { background: "surface-main", cx: css$j.mainPanel },
                 React.createElement(ScrollBars, null,
                     renderVisible(),
@@ -5072,7 +4729,7 @@ function ColumnsConfigurationModal(props) {
                         React.createElement(Text, { cx: css$j.noDataTitle }, i18n$1.noResultsFound.title),
                         React.createElement(Text, { cx: css$j.noDataSubTitle }, i18n$1.noResultsFound.subTitle))))),
             React.createElement(ModalFooter, { borderTop: true },
-                React.createElement(LinkButton, { icon: settings.dataTable.icons.columnsConfigurationModal.resetIcon, caption: i18n$1.resetToDefaultButton, onClick: reset }),
+                React.createElement(LinkButton, { icon: ForwardRef$f, caption: i18n$1.resetToDefaultButton, onClick: reset }),
                 React.createElement(FlexSpacer, null),
                 React.createElement(Button, { fill: "none", color: "secondary", caption: i18n$1.cancelButton, onClick: close }),
                 !hasAnySelectedColumns ? (React.createElement(Tooltip, { content: i18n$1.enableAtLeastOneColumnMessage, placement: "top-end", color: "critical" }, applyButton)) : (applyButton)))));
@@ -5082,12 +4739,12 @@ function SubGroup(props) {
     const { title, items, renderItem } = props;
     const isCollapsible = !!title;
     if (items.length) {
-        const content = (React.createElement(FlexRow, { cx: css$j.groupItems, size: settings.dataTable.sizes.columnsConfigurationModal.columnRow }, items.map((c) => (React.createElement(ColumnRow, { column: c, key: c.key, renderItem: renderItem })))));
+        const content = (React.createElement(FlexRow, { cx: css$j.groupItems, size: settings.sizes.dataTable.columnsConfigurationModal.columnRow }, items.map((c) => (React.createElement(ColumnRow, { column: c, key: c.key, renderItem: renderItem })))));
         if (isCollapsible) {
             const renderTitle = (isOpened) => {
-                const toggleIcon = settings.dataTable.icons.columnsConfigurationModal[isOpened ? 'expandedIcon' : 'collapsedIcon'];
+                const toggleIcon = isOpened ? ForwardRef$Q : ForwardRef$v;
                 return (React.createElement(FlexRow, { cx: cx$1(css$j.subgroup) },
-                    React.createElement(IconContainer, { size: settings.dataTable.sizes.columnsConfigurationModal.subgroupIcon, icon: toggleIcon }),
+                    React.createElement(IconContainer, { size: settings.sizes.dataTable.columnsConfigurationModal.subgroupIcon, icon: toggleIcon }),
                     React.createElement(Text, { size: "none", color: "tertiary", cx: css$j.subgroupTitle }, title)));
             };
             return (React.createElement(Accordion$1, { value: isExpanded, onValueChange: setIsExpanded, renderTitle: renderTitle, cx: css$j.subgroupAccordion }, content));
@@ -5097,6 +4754,8 @@ function SubGroup(props) {
     return null;
 }
 
+var css$i = {"listContainer":"TAGA8J","header":"ZRooRZ","group":"zlLPEf","stickyHeader":"Ip-fvE"};
+
 const getChildrenAndRest = (row, rows) => {
     const firstNotChildIndex = rows.findIndex((other) => other.depth < row.depth || (row.depth === other.depth && other.isPinned));
     if (firstNotChildIndex === -1) {
@@ -5110,8 +4769,6 @@ const getChildrenAndRest = (row, rows) => {
     return [children, rest];
 };
 
-var css$i = {"listContainer":"RA6UbP","header":"cvTF-t","group":"OU4QQA","stickyHeader":"bBSS0x"};
-
 function DataRowsGroup({ row, childRows, renderRow, top = 1, }) {
     const rowRef = useRef();
     const childrenPinnedTop = row.isPinned ? (top + (rowRef.current?.clientHeight ?? 0)) : top;
@@ -5150,7 +4807,147 @@ function DataRowsContainer({ estimatedHeight, listContainerRef, offsetY, rows, r
             React__default.createElement(DataRowsGroups, { rows: rows, renderRow: renderRow, top: headerRef?.current?.clientHeight }))));
 }
 
-var css$h = {"root":"aSH4Bk","sticky-header":"k8lJ07","stickyHeader":"k8lJ07","no-results":"Jx4-eV","noResults":"Jx4-eV","icon":"S88CWT","title":"R89Pm8"};
+var _path$4, _path2, _path3, _path4, _path5, _path6, _g, _path7, _path8, _path9, _path10, _path11, _path12, _path13, _path14, _path15, _path16, _path17, _path18, _path19, _path20, _path21, _path22, _path23, _path24, _defs;
+function _extends$4() { return _extends$4 = 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$4.apply(null, arguments); }
+var SvgEmptyTable = function SvgEmptyTable(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$4({
+    width: 232,
+    height: 180,
+    viewBox: "0 0 232 180",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ref: ref
+  }, props), /*#__PURE__*/React.createElement("g", {
+    clipPath: "url(#upoqav6dlx0k3kfhr_a)"
+  }, _path$4 || (_path$4 = /*#__PURE__*/React.createElement("path", {
+    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",
+    fill: "#F5F6FA"
+  })), _path2 || (_path2 = /*#__PURE__*/React.createElement("path", {
+    d: "m58.069 136.51-.654 4.238-1.27-5.38a58.934 58.934 0 0 0-11.462-4.965l-.083 5.636-2.545-6.393a55.094 55.094 0 0 0-13.655-1.854l.704 6.178-3.356-6.108c-4.151.183-8.256.946-12.195 2.268l2.33 3.525s-2.173-1.597-4.084-2.896a40.951 40.951 0 0 0-10.833 6.285 85.492 85.492 0 0 0 12.575 10.527c2.482-.637 5.127-1.279 5.127-1.279l-3.261 2.537a69.366 69.366 0 0 0 13.283 6.865c2.346-1.353 5.416-3.269 5.416-3.269l-3.554 3.931a42.226 42.226 0 0 0 15.45 2.359l4.259-4.213-1.697 4.001c7.002-.848 14.144-3.902 20.95-10.344-1.621-3.869-5.768-8.073-11.445-11.649Z",
+    fill: "#9BDEFF"
+  })), _path3 || (_path3 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M.557 136.978a.413.413 0 0 1 .475-.342l68.549 11.118a.414.414 0 0 1-.133.817L.9 137.453a.415.415 0 0 1-.342-.475Z",
+    fill: "#fff"
+  })), _path4 || (_path4 = /*#__PURE__*/React.createElement("path", {
+    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",
+    fill: "#9BDEFF"
+  })), _path5 || (_path5 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    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",
+    fill: "#1D1E26"
+  })), /*#__PURE__*/React.createElement("mask", {
+    id: "upoqavaqvlvzl1j0o_b",
+    style: {
+      maskType: "alpha"
+    },
+    maskUnits: "userSpaceOnUse",
+    x: 81,
+    y: 22,
+    width: 100,
+    height: 104
+  }, _path6 || (_path6 = /*#__PURE__*/React.createElement("path", {
+    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",
+    fill: "#9BDEFF"
+  }))), _g || (_g = /*#__PURE__*/React.createElement("g", {
+    mask: "url(#upoqavaqvlvzl1j0o_b)",
+    fillRule: "evenodd",
+    clipRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M69.817 99.247a.414.414 0 0 1 .585-.003l50.88 50.483a.414.414 0 0 1-.583.588l-50.88-50.483a.414.414 0 0 1-.002-.585ZM72.802 28.407a.414.414 0 0 1 .553.192l63.6 131.172a.413.413 0 1 1-.745.361L72.61 28.96a.414.414 0 0 1 .192-.553Z",
+    fill: "#fff"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M142.576 6.515a.415.415 0 0 1 .087.58L60.185 118.817a.413.413 0 1 1-.665-.491L141.997 6.603a.414.414 0 0 1 .579-.088ZM197.977 60.314c.181.14.214.4.075.58l-76.734 99.311a.414.414 0 0 1-.655-.506l76.734-99.31a.413.413 0 0 1 .58-.075ZM192.316 43.44a.413.413 0 0 1-.103.576L60.089 135.878a.414.414 0 0 1-.473-.68L191.74 43.336a.414.414 0 0 1 .576.104Z",
+    fill: "#fff"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M91.966 11.532a.414.414 0 0 1 .585-.021l129.252 120a.414.414 0 0 1-.563.606l-129.252-120a.414.414 0 0 1-.022-.585ZM75.232 2.769a.414.414 0 0 1 .568.143l93.554 156.828a.414.414 0 1 1-.711.424L75.089 3.336a.414.414 0 0 1 .143-.567ZM125.643.329a.414.414 0 0 1 .584.041l71.81 82.759a.413.413 0 1 1-.625.542L125.602.913a.414.414 0 0 1 .041-.584Z",
+    fill: "#fff"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M67.271 75.369a.414.414 0 0 1 .547-.209l156.745 70.345a.413.413 0 1 1-.339.755L67.479 75.916a.414.414 0 0 1-.208-.547Z",
+    fill: "#fff"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M159.279 8.938a.414.414 0 0 1 .265.522L101.278 187.39a.413.413 0 1 1-.787-.258l58.266-177.93a.414.414 0 0 1 .522-.265Z",
+    fill: "#fff"
+  }), /*#__PURE__*/React.createElement("path", {
+    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",
+    fill: "#1D1E26"
+  }))), _path7 || (_path7 = /*#__PURE__*/React.createElement("path", {
+    d: "M180.287 30.828H81.39v-3.724a4.966 4.966 0 0 1 4.966-4.966H175.3a4.963 4.963 0 0 1 4.986 4.965v3.725Z",
+    fill: "#fff"
+  })), _path8 || (_path8 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M177.05 22.893a4.548 4.548 0 0 0-1.748-.341H86.356a4.552 4.552 0 0 0-4.552 4.552v3.31h98.069v-3.31a4.55 4.55 0 0 0-2.823-4.211Zm-1.75-1.169a5.375 5.375 0 0 1 4.989 3.316c.272.654.412 1.355.412 2.064v3.724a.414.414 0 0 1-.414.413H81.39a.414.414 0 0 1-.413-.413v-3.724a5.38 5.38 0 0 1 5.379-5.38H175.3Z",
+    fill: "#1D1E26"
+  })), _path9 || (_path9 = /*#__PURE__*/React.createElement("path", {
+    d: "M87.324 28.217a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6ZM93.597 28.217a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6ZM99.866 28.217a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6Z",
+    fill: "#1D1E26"
+  })), _path10 || (_path10 = /*#__PURE__*/React.createElement("path", {
+    d: "M151.71 47.806H63.614a4.986 4.986 0 0 0-4.986 4.986v93.062a4.986 4.986 0 0 0 4.986 4.986h88.096a4.986 4.986 0 0 0 4.987-4.986V52.792a4.987 4.987 0 0 0-4.987-4.986Z",
+    fill: "#fff"
+  })), _path11 || (_path11 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M63.614 48.22a4.572 4.572 0 0 0-4.572 4.572v93.062a4.572 4.572 0 0 0 4.572 4.572h88.096a4.572 4.572 0 0 0 4.573-4.572V52.792a4.572 4.572 0 0 0-4.573-4.573H63.614Zm-5.4 4.572a5.4 5.4 0 0 1 5.4-5.4h88.096a5.4 5.4 0 0 1 5.4 5.4v93.062a5.4 5.4 0 0 1-5.4 5.4H63.614a5.4 5.4 0 0 1-5.4-5.4V52.792Z",
+    fill: "#1D1E26"
+  })), _path12 || (_path12 = /*#__PURE__*/React.createElement("path", {
+    d: "M157.11 56.081H58.214v-3.724a4.986 4.986 0 0 1 4.986-4.965h88.924a4.988 4.988 0 0 1 4.986 4.965v3.724Z",
+    fill: "#008ACE"
+  })), _path13 || (_path13 = /*#__PURE__*/React.createElement("path", {
+    d: "M64.566 53.474a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6ZM70.835 53.474a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6ZM77.103 53.474a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6Z",
+    fill: "#1D1E26"
+  })), _path14 || (_path14 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M48.968 36.067a.414.414 0 0 1 .585.018l7.005 7.448a.414.414 0 1 1-.603.567l-7.005-7.448a.414.414 0 0 1 .018-.585ZM46.99 44.047a.414.414 0 0 1 .554-.188l6.269 3.104a.414.414 0 0 1-.367.742l-6.27-3.104a.414.414 0 0 1-.187-.554ZM183.97 9.366a.414.414 0 0 1 .213.545l-2.896 6.62a.414.414 0 0 1-.759-.331l2.897-6.621a.414.414 0 0 1 .545-.213ZM192.373 9.866a.415.415 0 0 1 0 .585l-8.276 8.276a.414.414 0 1 1-.585-.585l8.275-8.276a.415.415 0 0 1 .586 0ZM192.464 19.108a.413.413 0 0 1-.23.538l-6.207 2.483a.414.414 0 0 1-.308-.768l6.207-2.483a.414.414 0 0 1 .538.23ZM182.977 54.848c.228 0 .413.185.413.414v58.345a.414.414 0 1 1-.827 0V55.262c0-.229.185-.414.414-.414Z",
+    fill: "#1D1E26"
+  })), _path15 || (_path15 = /*#__PURE__*/React.createElement("path", {
+    d: "M133.371 157.945c23.196 0 42-18.804 42-42s-18.804-42-42-42-42 18.804-42 42 18.804 42 42 42Z",
+    fill: "#008ACE"
+  })), _path16 || (_path16 = /*#__PURE__*/React.createElement("path", {
+    d: "M133.371 149.669c18.625 0 33.724-15.099 33.724-33.724 0-18.625-15.099-33.724-33.724-33.724-18.625 0-33.724 15.099-33.724 33.724 0 18.625 15.099 33.724 33.724 33.724Z",
+    fill: "#fff"
+  })), _path17 || (_path17 = /*#__PURE__*/React.createElement("path", {
+    d: "M117.312 113.565a3.807 3.807 0 1 0 0-7.614 3.807 3.807 0 0 0 0 7.614ZM149.435 113.565a3.806 3.806 0 1 0 0-7.612 3.806 3.806 0 0 0 0 7.612Z",
+    fill: "#1D1E26"
+  })), _path18 || (_path18 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M133.38 123.952c-4.592 0-8.525 2.259-10.468 5.423a.827.827 0 1 1-1.41-.866c2.27-3.697 6.762-6.212 11.878-6.212 5.108 0 9.646 2.485 11.882 6.22a.827.827 0 1 1-1.42.85c-1.902-3.176-5.863-5.415-10.462-5.415Z",
+    fill: "#1D1E26"
+  })), _path19 || (_path19 = /*#__PURE__*/React.createElement("path", {
+    d: "m170.965 137.356-7.822 9.777 1.668 1.334 7.822-9.777-1.668-1.334Z",
+    fill: "#1D1E26"
+  })), _path20 || (_path20 = /*#__PURE__*/React.createElement("path", {
+    d: "M200.774 163.345c.579 2.143-3.331 6.852-5.553 6.939-7.035.277-28.73-23.913-28.73-23.913l4.44-5.553s28.122 16.142 29.843 22.527Z",
+    fill: "#9BDEFF"
+  })), _path21 || (_path21 = /*#__PURE__*/React.createElement("path", {
+    d: "M204.424 178.378a6.223 6.223 0 0 0 6.223-6.224 6.224 6.224 0 1 0-6.223 6.224Z",
+    fill: "#9BDEFF"
+  })), _path22 || (_path22 = /*#__PURE__*/React.createElement("path", {
+    d: "M199.586 168.269a6.173 6.173 0 0 1 3.311-2.131l-2.123-1.697c-.464 2.069-2.959 4.995-4.837 5.69l2.296 1.837a6.173 6.173 0 0 1 1.353-3.699Z",
+    fill: "#1D1E26"
+  })), _path23 || (_path23 = /*#__PURE__*/React.createElement("path", {
+    d: "m72.357 138.314-3.5 2.955 2.722-5.317a67.379 67.379 0 0 0-5.958-12.509l-4.014 4.514 2.38-7.076a63.412 63.412 0 0 0-9.932-11.611l-3.724 5.549 1.54-7.448a50.152 50.152 0 0 0-11.628-7.179l-.567 4.605s-.675-2.896-1.333-5.38a44.62 44.62 0 0 0-13.315-2.896 96.722 96.722 0 0 0 2.983 17.856c2.483 1.311 5.119 2.751 5.119 2.751l-4.461-.347a79.474 79.474 0 0 0 6.091 15.385c2.897.637 6.745 1.353 6.745 1.353l-5.677.55c2.871 4.965 6.492 9.6 11.069 13.349l6.45-.269-4.191 1.99c6.356 4.49 14.37 7.3 24.48 7.105 1.398-4.332.902-10.816-1.279-17.93Z",
+    fill: "#008ACE"
+  })), _path24 || (_path24 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    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",
+    fill: "#fff"
+  }))), _defs || (_defs = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "upoqav6dlx0k3kfhr_a"
+  }, /*#__PURE__*/React.createElement("path", {
+    fill: "#fff",
+    transform: "translate(.552)",
+    d: "M0 0h230.897v180H0z"
+  })))));
+};
+var ForwardRef$4 = /*#__PURE__*/forwardRef(SvgEmptyTable);
+
+var css$h = {"root":"-Wsx-o","sticky-header":"VVVx-t","stickyHeader":"VVVx-t","no-results":"q05n7h","noResults":"q05n7h","icon":"th6CT5","title":"InW1ks"};
 
 function DataTable(props) {
     const { uuiModals } = useUuiContext();
@@ -5158,13 +4955,13 @@ function DataTable(props) {
     const columnsWithFilters = useColumnsWithFilters(props.columns, props.filters);
     const { columns, config, defaultConfig } = useColumnsConfig(columnsWithFilters, props.value?.columnsConfig);
     const defaultRenderRow = React.useCallback((rowProps) => {
-        return (React.createElement(DataTableRow, { size: props.size || settings.dataTable.sizes.body.defaultRow, columnsGap: props.columnsGap, borderBottom: props.border, ...rowProps, key: rowProps.rowKey, cx: css$h.cell }));
+        return (React.createElement(DataTableRow, { size: props.size || settings.sizes.dataTable.body.row.default, columnsGap: props.columnsGap, borderBottom: props.border, ...rowProps, key: rowProps.rowKey, cx: css$h.cell }));
     }, []);
     const renderRow = (row) => (props.renderRow ?? defaultRenderRow)({ ...row, columns });
     const rows = props.getRows?.() ?? props.rows ?? [];
     const renderNoResultsBlock = React.useCallback(() => {
         return (React.createElement("div", { className: css$h.noResults }, props.renderNoResultsBlock ? (props.renderNoResultsBlock?.()) : (React.createElement(React.Fragment, null,
-            React.createElement(IconContainer, { cx: css$h.icon, icon: settings.dataTable.icons.emptyTable }),
+            React.createElement(IconContainer, { cx: css$h.icon, icon: ForwardRef$4 }),
             React.createElement(Text, { cx: css$h.title, fontSize: "24", lineHeight: "30", color: "primary", fontWeight: "600" }, i18n.tables.noResultsBlock.title),
             React.createElement(Text, { fontSize: "16", lineHeight: "24", color: "primary" }, i18n.tables.noResultsBlock.message)))));
     }, [props.renderNoResultsBlock]);
@@ -5183,7 +4980,7 @@ function DataTable(props) {
     ]);
     const renderRowsContainer = React.useCallback(({ listContainerRef, estimatedHeight, offsetY, scrollShadows }) => (React.createElement(React.Fragment, null,
         React.createElement("div", { className: css$h.stickyHeader, ref: headerRef },
-            React.createElement(DataTableHeaderRow, { columns: columns, columnGroups: props.columnGroups, onConfigButtonClick: props.showColumnsConfig && onConfigurationButtonClick, selectAll: props.selectAll, size: props.headerSize || settings.dataTable.sizes.header.defaultRow, textCase: props.headerTextCase, allowColumnsReordering: props.allowColumnsReordering, allowColumnsResizing: props.allowColumnsResizing, showFoldAll: props.showFoldAll, value: { ...props.value, columnsConfig: config }, onValueChange: props.onValueChange, columnsGap: props.columnsGap }),
+            React.createElement(DataTableHeaderRow, { columns: columns, columnGroups: props.columnGroups, onConfigButtonClick: props.showColumnsConfig && onConfigurationButtonClick, selectAll: props.selectAll, size: props.headerSize || settings.sizes.dataTable.header.row.default, textCase: props.headerTextCase, allowColumnsReordering: props.allowColumnsReordering, allowColumnsResizing: props.allowColumnsResizing, showFoldAll: props.showFoldAll, value: { ...props.value, columnsConfig: config }, onValueChange: props.onValueChange, columnsGap: props.columnsGap }),
             React.createElement("div", { className: cx$1(uuiScrollShadows.top, {
                     [uuiScrollShadows.topVisible]: scrollShadows.verticalTop,
                 }) })),
@@ -5199,9 +4996,9 @@ function DataTable(props) {
                 } }))));
 }
 
-var css$g = {"root":"a2VPjY"};
+var css$g = {"root":"Fv8a0i"};
 
-var css$f = {"root":"-DwxTl","burger-content":"pTOuuJ","burgerContent":"pTOuuJ"};
+var css$f = {"root":"_3M1cyW","burger-content":"JhJ70o","burgerContent":"JhJ70o"};
 
 var _path$3;
 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); }
@@ -5244,7 +5041,7 @@ var SvgNavigationArrowDownOutline = function SvgNavigationArrowDownOutline(props
 };
 var ForwardRef$2 = /*#__PURE__*/forwardRef(SvgNavigationArrowDownOutline);
 
-var css$e = {"root":"sOZLeJ","button-primary":"LAS5hC","buttonPrimary":"LAS5hC","button-secondary":"H2BEcr","buttonSecondary":"H2BEcr","hasIcon":"-BnKQc","dropdown":"BQFur-"};
+var css$e = {"root":"V-PEkP","button-primary":"R-ZpjN","buttonPrimary":"R-ZpjN","button-secondary":"S5F1bc","buttonSecondary":"S5F1bc","hasIcon":"pMNLn9","dropdown":"M-r24o"};
 
 const BurgerButton = /* @__PURE__ */withMods(Button$1, (props) => [
     css$e.root,
@@ -5255,13 +5052,13 @@ const BurgerButton = /* @__PURE__ */withMods(Button$1, (props) => [
     props.icon && css$e.hasIcon,
 ], () => ({ dropdownIcon: ForwardRef$2, dropdownIconPosition: 'left', role: 'menuitem' }));
 
-var css$d = {"search-input":"_1jP03B","searchInput":"_1jP03B"};
+var css$d = {"search-input":"dSu2-S","searchInput":"dSu2-S"};
 
 function BurgerSearch(props) {
-    return (React.createElement(TextInput$1, { cx: cx(css$d.searchInput, 'uui-main_menu-burger-search'), iconPosition: "left", icon: ForwardRef$N, placeholder: props.placeholder, value: props.value, onValueChange: props.onValueChange, onCancel: props.onCancel, cancelIcon: props.value && ForwardRef$R }));
+    return (React.createElement(TextInput$1, { cx: cx(css$d.searchInput, 'uui-main_menu-burger-search'), iconPosition: "left", icon: ForwardRef$O, placeholder: props.placeholder, value: props.value, onValueChange: props.onValueChange, onCancel: props.onCancel, cancelIcon: props.value && ForwardRef$R }));
 }
 
-var css$c = {"root":"akLzdR","group-header":"TVrMPz","groupHeader":"TVrMPz","group-name":"KPcrEo","groupName":"KPcrEo","line":"_369njl"};
+var css$c = {"root":"aouls7","group-header":"_5oJ6QY","groupHeader":"_5oJ6QY","group-name":"uxEDJz","groupName":"uxEDJz","line":"D2M3zb"};
 
 function BurgerGroupHeader(props) {
     return (React.createElement("div", { className: cx(css$c.root, css$c.groupHeader, 'uui-burger-group-header') },
@@ -5269,7 +5066,7 @@ function BurgerGroupHeader(props) {
         React.createElement("span", { className: css$c.groupName }, props.caption)));
 }
 
-var css$b = {"root":"z0rrqG","type-primary":"_-23vmZ","typePrimary":"_-23vmZ","type-secondary":"CKUDIJ","typeSecondary":"CKUDIJ"};
+var css$b = {"root":"rNt2eI","type-primary":"HxHWoa","typePrimary":"HxHWoa","type-secondary":"SRXvwy","typeSecondary":"SRXvwy"};
 
 const MainMenuButton = /* @__PURE__ */React.forwardRef((props, ref) => {
     const { type, ...clickableProps } = props;
@@ -5291,7 +5088,7 @@ const MainMenuButton = /* @__PURE__ */React.forwardRef((props, ref) => {
         props.isDropdown && (React.createElement(IconContainer, { icon: ForwardRef$Q, flipY: props.isOpen }))));
 });
 
-var css$a = {"dropdown-body":"JAwx6Z","dropdownBody":"JAwx6Z"};
+var css$a = {"dropdown-body":"OlG0t6","dropdownBody":"OlG0t6"};
 
 class MainMenuDropdown extends React.Component {
     render() {
@@ -5349,12 +5146,12 @@ var SvgNavigationGlobalMenuOutlineOutline = function SvgNavigationGlobalMenuOutl
 };
 var ForwardRef$1 = /*#__PURE__*/forwardRef(SvgNavigationGlobalMenuOutlineOutline);
 
-var css$9 = {"global-menu-btn":"r1-gpT","globalMenuBtn":"r1-gpT","global-menu-icon":"fV84DJ","globalMenuIcon":"fV84DJ"};
+var css$9 = {"global-menu-btn":"TcKBbH","globalMenuBtn":"TcKBbH","global-menu-icon":"k2dxyB","globalMenuIcon":"k2dxyB"};
 
 const GlobalMenu = /* @__PURE__ */React.forwardRef((props, ref) => (React.createElement("button", { ref: ref, id: "global_menu_toggle", className: cx(css$9.globalMenuBtn, props.cx), ...props.rawProps },
     React.createElement(IconContainer, { size: 36, icon: ForwardRef$1, cx: css$9.globalMenuIcon }))));
 
-var css$8 = {"container":"oYH7w9","open":"UzfID-","folding-arrow":"mS0HxC","foldingArrow":"mS0HxC"};
+var css$8 = {"container":"krCV6I","open":"SOaoRN","folding-arrow":"bFHzHw","foldingArrow":"bFHzHw"};
 
 const MainMenuAvatar = /* @__PURE__ */React.forwardRef((props, ref) => (React.createElement("button", { ref: ref, className: cx(css$8.container, props.isDropdown && css$8.dropdown, props.isOpen && css$8.open, props.onClick && uuiMarkers.clickable, props.cx), onClick: props.onClick, ...props.rawProps },
     React.createElement(Avatar, { size: "36", img: props.avatarUrl }),
@@ -5362,15 +5159,15 @@ const MainMenuAvatar = /* @__PURE__ */React.forwardRef((props, ref) => (React.cr
     props.isDropdown && (React.createElement("div", null,
         React.createElement(IconContainer, { size: 18, icon: ForwardRef$Q, flipY: props.isOpen, cx: css$8.foldingArrow }))))));
 
-var css$7 = {"search-input":"ddCIhJ","searchInput":"ddCIhJ"};
+var css$7 = {"search-input":"f-2w7y","searchInput":"f-2w7y"};
 
-const MainMenuSearch = /* @__PURE__ */React.forwardRef((props, ref) => (React.createElement(IEditableDebouncer, { ...props, render: (iEditable) => (React.createElement(TextInput$1, { iconPosition: "left", icon: ForwardRef$N, cancelIcon: props.value?.length > 0 && ForwardRef$R, ...props, ...iEditable, ref: ref, cx: cx$1(css$7.searchInput, props.cx), ...props.rawProps })) })));
+const MainMenuSearch = /* @__PURE__ */React.forwardRef((props, ref) => (React.createElement(IEditableDebouncer, { ...props, render: (iEditable) => (React.createElement(TextInput$1, { iconPosition: "left", icon: ForwardRef$O, cancelIcon: props.value?.length > 0 && ForwardRef$R, ...props, ...iEditable, ref: ref, cx: cx$1(css$7.searchInput, props.cx), ...props.rawProps })) })));
 
-var css$6 = {"container":"EmQgH6"};
+var css$6 = {"container":"FS1ziC"};
 
 const MainMenuIcon = /* @__PURE__ */React.forwardRef((props, ref) => (React.createElement(IconButton, { ref: ref, icon: props.icon, cx: cx$1(props.cx, css$6.container), ...props })));
 
-var css$5 = {"root":"Vo0gnh"};
+var css$5 = {"root":"Y9V9YU"};
 
 const Anchor = /* @__PURE__ */withMods(Anchor$1, () => [css$5.root]);
 
@@ -5428,7 +5225,7 @@ var SvgFileCloudUploadFill = function SvgFileCloudUploadFill(props, ref) {
 };
 var ForwardRef = /*#__PURE__*/forwardRef(SvgFileCloudUploadFill);
 
-var css$4 = {"root":"XQhZb0","drop-start":"DF41Ui","dropStart":"DF41Ui","drop-over":"DJBlJv","dropOver":"DJBlJv","link":"X--gLn","drop-area":"eASNOa","dropArea":"eASNOa","drop-caption":"NqH7qk","dropCaption":"NqH7qk","icon-blue":"azbwTy","iconBlue":"azbwTy"};
+var css$4 = {"root":"NH-gIi","drop-start":"Uu6HFG","dropStart":"Uu6HFG","drop-over":"KuV25T","dropOver":"KuV25T","link":"Lcy7g5","drop-area":"ZJU9Pi","dropArea":"ZJU9Pi","drop-caption":"kcZjcC","dropCaption":"kcZjcC","icon-blue":"JiJAim","iconBlue":"JiJAim"};
 
 function DropSpot(props) {
     const getInfoText = typeof props.infoText === 'string'
@@ -5446,19 +5243,19 @@ function DropSpot(props) {
     return React.createElement(DropSpot$1, { render: renderAttachmentArea, onFilesDropped: props.onUploadFiles });
 }
 
-var css$3 = {"root":"RJ8vpw"};
+var css$3 = {"root":"_4GU78u","file-name":"fdnQFO","fileName":"fdnQFO","default-color":"BQRZDm","defaultColor":"BQRZDm","doc-color":"yZFCfs","docColor":"yZFCfs","xls-color":"EYCqa-","xlsColor":"EYCqa-","pdf-color":"_5KxLS5","pdfColor":"_5KxLS5","movie-color":"eK5RDd","movieColor":"eK5RDd","img-color":"bZAjoj","imgColor":"bZAjoj","mov-color":"hA3Fz7","movColor":"hA3Fz7","error-block":"g7Vrkd","errorBlock":"g7Vrkd","icons-block":"h0sflS","iconsBlock":"h0sflS"};
+
+var css$2 = {"root":"_6Q0-FW"};
 
 const SvgCircleProgress = /* @__PURE__ */React.forwardRef((props, ref) => {
     const outsetRadius = props.size / 2 - 1;
     const insetRadius = props.size / 2 - 3;
     const circumference = insetRadius * Math.PI;
-    return (React.createElement("svg", { className: css$3.root, width: props.size, height: props.size, ref: ref, ...props.rawProps },
+    return (React.createElement("svg", { className: css$2.root, width: props.size, height: props.size, ref: ref, ...props.rawProps },
         React.createElement("circle", { strokeDasharray: circumference, strokeDashoffset: circumference - (props.progress / 100) * circumference, strokeWidth: insetRadius, fill: "transparent", r: insetRadius / 2, cx: props.size / 2, cy: props.size / 2 }),
         React.createElement("circle", { strokeWidth: 1, fill: "transparent", r: outsetRadius, cx: props.size / 2, cy: props.size / 2 })));
 });
 
-var css$2 = {"root":"AE3yh0","file-name":"cLg4vL","fileName":"cLg4vL","default-color":"_8b83gk","defaultColor":"_8b83gk","doc-color":"_6kjFLz","docColor":"_6kjFLz","xls-color":"xngFtw","xlsColor":"xngFtw","pdf-color":"CZz5ky","pdfColor":"CZz5ky","movie-color":"YN8MFh","movieColor":"YN8MFh","img-color":"dr0XFS","imgColor":"dr0XFS","mov-color":"UCPMyh","movColor":"UCPMyh","error-block":"_8VNSKN","errorBlock":"_8VNSKN","icons-block":"rokHlV","iconsBlock":"rokHlV"};
-
 const FileCard = /* @__PURE__ */React.forwardRef((props, ref) => {
     const [isLoadingShow, setIsLoadingShow] = React.useState(true);
     const { file } = props;
@@ -5466,36 +5263,36 @@ const FileCard = /* @__PURE__ */React.forwardRef((props, ref) => {
         switch (extension) {
             case 'doc':
             case 'docx':
-                return React.createElement(IconContainer, { size: 24, icon: settings.fileCard.icons.docIcon, cx: css$2.docColor });
+                return React.createElement(IconContainer, { size: 24, icon: fileIcons.docIcon, cx: css$3.docColor });
             case 'xls':
             case 'xlsx':
-                return React.createElement(IconContainer, { size: 24, icon: settings.fileCard.icons.exelIcon, cx: css$2.xlsColor });
+                return React.createElement(IconContainer, { size: 24, icon: fileIcons.exelIcon, cx: css$3.xlsColor });
             case 'pdf':
-                return React.createElement(IconContainer, { size: 24, icon: settings.fileCard.icons.pdfIcon, cx: css$2.pdfColor });
+                return React.createElement(IconContainer, { size: 24, icon: fileIcons.pdfIcon, cx: css$3.pdfColor });
             case 'gif':
             case 'jpg':
             case 'jpeg':
             case 'svg':
             case 'png':
             case 'webp':
-                return React.createElement(IconContainer, { size: 24, icon: settings.fileCard.icons.imgIcon, cx: css$2.imgColor });
+                return React.createElement(IconContainer, { size: 24, icon: fileIcons.imgIcon, cx: css$3.imgColor });
             case 'avi':
             case 'mov':
             case 'mp4':
             case 'wmw':
             case 'mkv':
-                return React.createElement(IconContainer, { size: 24, icon: settings.fileCard.icons.videoIcon, cx: css$2.movColor });
+                return React.createElement(IconContainer, { size: 24, icon: fileIcons.videoIcon, cx: css$3.movColor });
             case 'csv':
             case 'xml':
-                return React.createElement(IconContainer, { size: 24, icon: settings.fileCard.icons.tableIcon, cx: css$2.defaultColor });
+                return React.createElement(IconContainer, { size: 24, icon: fileIcons.tableIcon, cx: css$3.defaultColor });
             case 'rtf':
             case 'txt':
-                return React.createElement(IconContainer, { size: 24, icon: settings.fileCard.icons.textIcon, cx: css$2.defaultColor });
+                return React.createElement(IconContainer, { size: 24, icon: fileIcons.textIcon, cx: css$3.defaultColor });
             case 'eml':
             case 'emlx':
-                return React.createElement(IconContainer, { size: 24, icon: settings.fileCard.icons.mailIcon, cx: css$2.defaultColor });
+                return React.createElement(IconContainer, { size: 24, icon: fileIcons.mailIcon, cx: css$3.defaultColor });
             default:
-                return React.createElement(IconContainer, { size: 24, icon: settings.fileCard.icons.fileIcon, cx: css$2.defaultColor });
+                return React.createElement(IconContainer, { size: 24, icon: fileIcons.fileIcon, cx: css$3.defaultColor });
         }
     };
     const { cx: componentCx, width, file: { progress, size, name, extension, error, abortXHR, }, onClick, } = props;
@@ -5512,8 +5309,8 @@ const FileCard = /* @__PURE__ */React.forwardRef((props, ref) => {
         setIsLoadingShow(() => false);
     };
     const renderErrorContent = () => (React.createElement(Tooltip, { content: file.error.message, placement: "bottom-start" },
-        React.createElement("div", { className: css$2.errorBlock },
-            React.createElement(IconContainer, { icon: settings.fileCard.icons.errorIcon, size: 12 }),
+        React.createElement("div", { className: css$3.errorBlock },
+            React.createElement(IconContainer, { icon: ForwardRef$y, size: 12 }),
             i18n.fileCard.failedUploadErrorMessage)));
     const renderSuccessfulContent = () => (React.createElement(Text, { size: "18", fontSize: "14", lineHeight: "18", color: "tertiary" },
         fileExtension && `${fileExtension.toUpperCase()}, `,
@@ -5523,15 +5320,15 @@ const FileCard = /* @__PURE__ */React.forwardRef((props, ref) => {
         progress && progress < 100 && abortXHR();
         onClick();
     };
-    return (React.createElement(FlexCell, { ref: ref, cx: cx$1(css$2.root, 'uui-file_card', (isLoading || error?.isError) && uuiMod.loading, componentCx, error?.isError && uuiMod.error), minWidth: width, width: !width ? '100%' : undefined },
+    return (React.createElement(FlexCell, { ref: ref, cx: cx$1(css$3.root, 'uui-file_card', (isLoading || error?.isError) && uuiMod.loading, componentCx, error?.isError && uuiMod.error), minWidth: width, width: !width ? '100%' : undefined },
         React.createElement(FlexRow, { alignItems: "top", columnGap: "6" },
             fileExtension && getIcon(fileExtension),
             React.createElement(FlexCell, { width: "100%" },
-                React.createElement(Text, { size: "18", fontSize: "14", lineHeight: "18", color: (progress < 100 || error?.isError) ? 'tertiary' : 'primary', cx: css$2.fileName }, fileName),
+                React.createElement(Text, { size: "18", fontSize: "14", lineHeight: "18", color: (progress < 100 || error?.isError) ? 'tertiary' : 'primary', cx: css$3.fileName }, fileName),
                 error?.isError ? renderErrorContent() : renderSuccessfulContent()),
-            React.createElement("div", { className: cx$1(css$2.iconsBlock), onMouseEnter: mouseEnterHandler, onMouseLeave: mouseLeaveHandler },
+            React.createElement("div", { className: cx$1(css$3.iconsBlock), onMouseEnter: mouseEnterHandler, onMouseLeave: mouseLeaveHandler },
                 isLoadingShow && isLoading && React.createElement(SvgCircleProgress, { progress: progress, size: 18 }),
-                isCrossShow && React.createElement(IconButton, { icon: settings.fileCard.icons.closeIcon, onClick: removeHandler })))));
+                isCrossShow && React.createElement(IconButton, { icon: ForwardRef$R, onClick: removeHandler })))));
 });
 
 const getRecoveryMessageConfig = () => ({
@@ -5576,7 +5373,7 @@ const getErrorPageConfig = () => ({
     },
 });
 
-var css$1 = {"container":"ocFUlp"};
+var css$1 = {"container":"kzzEgD"};
 
 const ErrorPage = (props) => {
     const isMobileScreen = isMobile();
@@ -5588,7 +5385,7 @@ const ErrorPage = (props) => {
             props?.supportLink && React__default.createElement("div", { className: "uui-error-support-link" }, props?.supportLink))));
 };
 
-var css = {"recovery-spinner":"Gzt5ws","recoverySpinner":"Gzt5ws","recovery-message":"pU12Nu","recoveryMessage":"pU12Nu","modal-blocker":"XewWBa","modalBlocker":"XewWBa","modalFadeIn":"TwhGIO"};
+var css = {"recovery-spinner":"BAsWwf","recoverySpinner":"BAsWwf","recovery-message":"k-WYea","recoveryMessage":"k-WYea","modal-blocker":"U4zMV9","modalBlocker":"U4zMV9","modalFadeIn":"x2hKDO"};
 
 function ErrorHandler(props) {
     const { uuiNotifications, uuiModals, uuiApi } = useUuiContext();
@@ -5639,5 +5436,5 @@ function ErrorHandler(props) {
         errorType === 'recovery' && renderRecoveryBlocker(errorInfo)));
 }
 
-export { Accordion, Alert, Anchor, AvatarStack, Badge, Blocker, Burger, BurgerButton, BurgerGroupHeader, BurgerSearch, Button, Calendar, Checkbox, CheckboxGroup, ClearNotification, ColumnHeaderDropdown, ColumnsConfigurationModal, ConfirmationModal, ControlGroup, CountIndicator, DataPickerBody, DataPickerCell, DataPickerFooter, DataPickerHeader, DataPickerRow, DataRowAddons, DataRowsContainer, DataTable, DataTableCell, DataTableHeaderCell, DataTableHeaderRow, DataTableRow, DatePicker, DatePickerBody, DatePickerComponent, DropMarker, DropSpot, Dropdown, DropdownContainer, DropdownMenuBody, DropdownMenuButton, DropdownMenuHeader, DropdownMenuSplitter, DropdownMenuSwitchButton, DropdownSubMenu, ErrorAlert, ErrorHandler, ErrorNotification, ErrorPage, FileCard, FilterItemBody, FilterPickerBody, FiltersPanel, FlexCell, FlexRow, Form, GlobalMenu, HintAlert, HintNotification, IDropdownControlKeys, IconButton, IndeterminateBar, IndicatorBar, InputAddon, LabeledInput, LinkButton, MainMenu, MainMenuAvatar, MainMenuButton, MainMenuDropdown, MainMenuIcon, MainMenuSearch, ModalBlocker, ModalFooter, ModalHeader, ModalWindow, MultiSwitch, NotificationCard, NumericInput, Paginator, Panel, PickerBodyMobileView, PickerInput, PickerItem, PickerList, PickerListItem, PickerModal, PickerToggler, PickerTogglerTag, PresetsPanel, ProgressBar, RadioGroup, RadioInput, RangeDatePicker, RangeDatePickerBody, RangeDatePickerInput, Rating, RichTextView, ScrollBars, SearchInput, Slider, Snackbar, Spinner, StatusIndicator, SuccessAlert, SuccessNotification, SvgCircleProgress, Switch, TabButton, Tag, Text, TextArea, TextInput, TextPlaceholder, TimePicker, TimePickerBody, Tooltip, VerticalTabButton, VirtualList, WarningAlert, WarningNotification, applyDateSelectionMods, defaultPredicates, fileIcons, getErrorPageConfig, getHighlightRanges, getHighlightedSearchMatches, getRecoveryMessageConfig, i18n, propsMods, rangeDatePickerPresets, renderCell, renderDropMarkers, settings, useColumnsWithFilters, useForm, uuiDatePickerBody, uuiRangeDatePickerBody, uuiTimePicker };
+export { Accordion, Alert, Anchor, AvatarStack, Badge, Blocker, Burger, BurgerButton, BurgerGroupHeader, BurgerSearch, Button, Calendar, Checkbox, CheckboxGroup, ClearNotification, ColumnHeaderDropdown, ColumnsConfigurationModal, ConfirmationModal, ControlGroup, CountIndicator, DataPickerBody, DataPickerFooter, DataPickerHeader, DataPickerRow, DataRowAddons, DataRowsContainer, DataTable, DataTableCell, DataTableHeaderCell, DataTableHeaderRow, DataTableRow, DatePicker, DatePickerBody, DatePickerComponent, DropMarker, DropSpot, Dropdown, DropdownContainer, DropdownMenuBody, DropdownMenuButton, DropdownMenuHeader, DropdownMenuSplitter, DropdownMenuSwitchButton, DropdownSubMenu, ErrorAlert, ErrorHandler, ErrorNotification, ErrorPage, FileCard, FilterItemBody, FilterPickerBody, FiltersPanel, FlexCell, FlexRow, Form, GlobalMenu, HintAlert, HintNotification, IDropdownControlKeys, IconButton, IndeterminateBar, IndicatorBar, InputAddon, LabeledInput, LinkButton, MainMenu, MainMenuAvatar, MainMenuButton, MainMenuDropdown, MainMenuIcon, MainMenuSearch, ModalBlocker, ModalFooter, ModalHeader, ModalWindow, MultiSwitch, NotificationCard, NumericInput, Paginator, Panel, PickerBodyMobileView, PickerInput, PickerItem, PickerList, PickerListItem, PickerModal, PickerToggler, PickerTogglerTag, PresetsPanel, ProgressBar, RadioGroup, RadioInput, RangeDatePicker, RangeDatePickerBody, RangeDatePickerInput, Rating, RichTextView, ScrollBars, SearchInput, Slider, Snackbar, Spinner, StatusIndicator, SuccessAlert, SuccessNotification, SvgCircleProgress, Switch, TabButton, Tag, Text, TextArea, TextInput, TextPlaceholder, TimePicker, TimePickerBody, Tooltip, VerticalTabButton, VirtualList, WarningAlert, WarningNotification, applyDateSelectionMods, defaultPredicates, getErrorPageConfig, getHighlightRanges, getHighlightedSearchMatches, getRecoveryMessageConfig, i18n, propsMods, rangeDatePickerPresets, renderCell, renderDropMarkers, settings, useColumnsWithFilters, useForm, uuiDatePickerBody, uuiRangeDatePickerBody, uuiTimePicker };
 //# sourceMappingURL=index.esm.js.map