@teamturing/react-kit 2.19.26 → 2.19.28

package/dist/index.js

@@ -28,8 +28,8 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var styled__default = /*#__PURE__*/_interopDefault(styled);
 var ReactDOM__namespace = /*#__PURE__*/_interopNamespace(ReactDOM);
 
-function _extends$1() {
-  _extends$1 = Object.assign || function (target) {
+function _extends$2() {
+  _extends$2 = Object.assign || function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -40,7 +40,7 @@ function _extends$1() {
     }
     return target;
   };
-  return _extends$1.apply(this, arguments);
+  return _extends$2.apply(this, arguments);
 }
 
 // based on https://github.com/developit/dlv
@@ -166,7 +166,7 @@ var positiveOrNegative = function positiveOrNegative(scale, value) {
 };
 var transforms = ['margin', 'marginTop', 'marginRight', 'marginBottom', 'marginLeft', 'marginX', 'marginY', 'top', 'bottom', 'left', 'right'].reduce(function (acc, curr) {
   var _extends2;
-  return _extends$1({}, acc, (_extends2 = {}, _extends2[curr] = positiveOrNegative, _extends2));
+  return _extends$2({}, acc, (_extends2 = {}, _extends2[curr] = positiveOrNegative, _extends2));
 }, {});
 var responsive = function responsive(styles) {
   return function (theme) {
@@ -201,7 +201,7 @@ var css = function css(args) {
     if (props === void 0) {
       props = {};
     }
-    var theme = _extends$1({}, defaultTheme, {}, props.theme || props);
+    var theme = _extends$2({}, defaultTheme, {}, props.theme || props);
     var result = {};
     var obj = typeof args === 'function' ? args(theme) : args;
     var styles = responsive(obj)(theme);
@@ -210,7 +210,7 @@ var css = function css(args) {
       var val = typeof x === 'function' ? x(theme) : x;
       if (key === 'variant') {
         var variant = css(get$1(theme, val))(theme);
-        result = _extends$1({}, result, {}, variant);
+        result = _extends$2({}, result, {}, variant);
         continue;
       }
       if (val && typeof val === 'object') {
@@ -249,7 +249,7 @@ object-assign
 */
 /* eslint-disable no-unused-vars */
 var getOwnPropertySymbols = Object.getOwnPropertySymbols;
-var hasOwnProperty = Object.prototype.hasOwnProperty;
+var hasOwnProperty$1 = Object.prototype.hasOwnProperty;
 var propIsEnumerable = Object.prototype.propertyIsEnumerable;
 function toObject(val) {
   if (val === null || val === undefined) {
@@ -305,7 +305,7 @@ var objectAssign = shouldUseNative() ? Object.assign : function (target, source)
   for (var s = 1; s < arguments.length; s++) {
     from = Object(arguments[s]);
     for (var key in from) {
-      if (hasOwnProperty.call(from, key)) {
+      if (hasOwnProperty$1.call(from, key)) {
         to[key] = from[key];
       }
     }
@@ -352,7 +352,7 @@ var defaults$4 = {
 var createMediaQuery = function createMediaQuery(n) {
   return "@media screen and (min-width: " + n + ")";
 };
-var getValue = function getValue(n, scale) {
+var getValue$1 = function getValue(n, scale) {
   return get(scale, n, n);
 };
 var get = function get(obj, key, def, p, undef) {
@@ -443,7 +443,7 @@ var createStyleFunction = function createStyleFunction(_ref) {
     property = _ref.property,
     scale = _ref.scale,
     _ref$transform = _ref.transform,
-    transform = _ref$transform === void 0 ? getValue : _ref$transform,
+    transform = _ref$transform === void 0 ? getValue$1 : _ref$transform,
     defaultScale = _ref.defaultScale;
   properties = properties || [property];
   var sx = function sx(value, scale, _props) {
@@ -1063,8 +1063,8 @@ const lineClamp = system({
   }
 });
 
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
+function _extends$1() {
+  _extends$1 = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -1075,10 +1075,10 @@ function _extends() {
     }
     return target;
   };
-  return _extends.apply(this, arguments);
+  return _extends$1.apply(this, arguments);
 }
 
-const SvgAi = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgAi = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1097,7 +1097,7 @@ const SvgAi = props => /*#__PURE__*/React__namespace.createElement("svg", _exten
   d: "M19.68 11.933c0-.38.306-.686.685-.686h.076c1.137 0 2.059.921 2.059 2.058v1.122a2.059 2.059 0 0 1-2.059 2.058h-.076a.686.686 0 0 1-.686-.686v-3.866Z"
 }));
 
-const SvgAiSad = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgAiSad = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1110,7 +1110,7 @@ const SvgAiSad = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgAimPoint = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgAimPoint = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1142,7 +1142,7 @@ const SvgAimPoint = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M7.188 12c0-.347.039-.693.116-1.031H2.031a1.031 1.031 0 1 0 0 2.062h5.273A4.598 4.598 0 0 1 7.187 12ZM16.813 12c0-.347-.04-.693-.117-1.031h5.273a1.031 1.031 0 1 1 0 2.062h-5.273c.077-.338.117-.684.117-1.031Z"
 })));
 
-const SvgAlarm = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgAlarm = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1155,7 +1155,7 @@ const SvgAlarm = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgAppleColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgAppleColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1169,7 +1169,7 @@ const SvgAppleColor = props => /*#__PURE__*/React__namespace.createElement("svg"
   d: "M14.514 11.781c-.01-1.139.952-1.685.995-1.71-.54-.774-1.384-.882-1.683-.895-.718-.07-1.401.413-1.764.413s-.926-.401-1.52-.39a2.263 2.263 0 0 0-1.906 1.127c-.813 1.377-.209 3.418.584 4.535.386.547.847 1.161 1.452 1.14.585-.023.805-.37 1.51-.37.706 0 .904.37 1.521.36.628-.013 1.026-.56 1.409-1.107.443-.634.627-1.248.638-1.28-.014-.006-1.223-.46-1.236-1.823ZM13.354 8.436c.322-.38.54-.91.48-1.436-.463.017-1.024.303-1.356.681-.299.338-.56.878-.49 1.394.516.038 1.046-.257 1.366-.639Z"
 }));
 
-const SvgArrowDown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowDown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1182,7 +1182,7 @@ const SvgArrowDown = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgArrowLeft = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowLeft = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1195,7 +1195,7 @@ const SvgArrowLeft = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgArrowLeftCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowLeftCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1206,7 +1206,7 @@ const SvgArrowLeftCircle = props => /*#__PURE__*/React__namespace.createElement(
   d: "M12 1C5.9 1 1 5.9 1 12s4.9 11 11 11 11-4.9 11-11S18.1 1 12 1Zm4.5 12H9.9l2.3 2.3c.4.4.4 1 0 1.4-.2.2-.5.3-.7.3-.2 0-.5-.1-.7-.3l-4-4c-.4-.4-.4-1 0-1.4l4-4c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4L9.9 11h6.6c.6 0 1 .4 1 1s-.5 1-1 1Z"
 }));
 
-const SvgArrowLeftLimit = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowLeftLimit = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1219,7 +1219,7 @@ const SvgArrowLeftLimit = props => /*#__PURE__*/React__namespace.createElement("
   clipRule: "evenodd"
 }));
 
-const SvgArrowLeftRight = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowLeftRight = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1232,7 +1232,7 @@ const SvgArrowLeftRight = props => /*#__PURE__*/React__namespace.createElement("
   clipRule: "evenodd"
 }));
 
-const SvgArrowRight = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowRight = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1245,7 +1245,7 @@ const SvgArrowRight = props => /*#__PURE__*/React__namespace.createElement("svg"
   clipRule: "evenodd"
 }));
 
-const SvgArrowRightCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowRightCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1256,7 +1256,7 @@ const SvgArrowRightCircle = props => /*#__PURE__*/React__namespace.createElement
   d: "M1 12c0 6.1 4.9 11 11 11s11-4.9 11-11S18.1 1 12 1 1 5.9 1 12Zm5.5 0c0-.6.4-1 1-1h6.6l-2.3-2.3c-.4-.4-.4-1 0-1.4.4-.4 1-.4 1.4 0l4 4c.4.4.4 1 0 1.4l-4 4c-.2.2-.4.3-.7.3-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l2.3-2.3H7.5c-.5 0-1-.4-1-1Z"
 }));
 
-const SvgArrowRightLimit = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowRightLimit = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1269,7 +1269,7 @@ const SvgArrowRightLimit = props => /*#__PURE__*/React__namespace.createElement(
   clipRule: "evenodd"
 }));
 
-const SvgArrowUp = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowUp = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1282,7 +1282,7 @@ const SvgArrowUp = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgArrowUpDown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowUpDown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1295,7 +1295,7 @@ const SvgArrowUpDown = props => /*#__PURE__*/React__namespace.createElement("svg
   clipRule: "evenodd"
 }));
 
-const SvgArrowUpLimit = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgArrowUpLimit = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1308,7 +1308,7 @@ const SvgArrowUpLimit = props => /*#__PURE__*/React__namespace.createElement("sv
   clipRule: "evenodd"
 }));
 
-const SvgBarchart = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgBarchart = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1319,7 +1319,7 @@ const SvgBarchart = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M14 2h5c.6 0 1 .4 1 1v18c0 .6-.4 1-1 1h-5c-.6 0-1-.4-1-1V3c0-.6.4-1 1-1ZM5 12h5c.6 0 1 .4 1 1v8c0 .6-.4 1-1 1H5c-.6 0-1-.4-1-1v-8c0-.6.4-1 1-1Z"
 }));
 
-const SvgBookmark = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgBookmark = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1332,7 +1332,7 @@ const SvgBookmark = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgBox = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgBox = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1352,7 +1352,7 @@ const SvgBox = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   d: "M0 0h24v24H0z"
 }))));
 
-const SvgBusColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgBusColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1384,7 +1384,7 @@ const SvgBusColor = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M36.796 25.602c0-.844.684-1.528 1.528-1.528h.51v3.056h-.51a1.528 1.528 0 0 1-1.528-1.528Z"
 }));
 
-const SvgCalendarCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCalendarCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1397,7 +1397,7 @@ const SvgCalendarCheck = props => /*#__PURE__*/React__namespace.createElement("s
   clipRule: "evenodd"
 }));
 
-const SvgCalendarCheckColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCalendarCheckColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1413,7 +1413,7 @@ const SvgCalendarCheckColor = props => /*#__PURE__*/React__namespace.createEleme
   d: "m11.623 15.999 5.584-5.584a1 1 0 0 0-1.414-1.414l-4.877 4.876-2.709-2.709a1 1 0 0 0-1.414 1.414l3.416 3.417a1 1 0 0 0 1.414 0Z"
 }));
 
-const SvgCalendarColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCalendarColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1445,7 +1445,7 @@ const SvgCalendarColor = props => /*#__PURE__*/React__namespace.createElement("s
   rx: 1
 }));
 
-const SvgCamera = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCamera = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1463,7 +1463,7 @@ const SvgCamera = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgCard = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCard = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1476,7 +1476,7 @@ const SvgCard = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgCardsPercent = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCardsPercent = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1491,7 +1491,7 @@ const SvgCardsPercent = props => /*#__PURE__*/React__namespace.createElement("sv
   d: "M22.67 7.89 19.88 20a2.58 2.58 0 0 1-3.07 1.92l-5.56-1.28a2.54 2.54 0 0 1-1.06-.54h4.48a2.55 2.55 0 0 0 2.58-2.56v-13a2.121 2.121 0 0 0-.1-.54l3.61.83a2.56 2.56 0 0 1 1.91 3.06Z"
 }));
 
-const SvgCardsPercentColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCardsPercentColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1510,7 +1510,7 @@ const SvgCardsPercentColor = props => /*#__PURE__*/React__namespace.createElemen
   clipRule: "evenodd"
 }));
 
-const SvgCaretDown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCaretDown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1521,7 +1521,7 @@ const SvgCaretDown = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M11.294 15.705 5.296 9.708c-.63-.63-.184-1.707.707-1.707H18c.89 0 1.337 1.077.707 1.707l-5.999 5.997a1 1 0 0 1-1.414 0Z"
 }));
 
-const SvgCaretLeft = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCaretLeft = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1532,7 +1532,7 @@ const SvgCaretLeft = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "m8.296 11.293 5.997-5.999c.63-.63 1.707-.184 1.707.707v11.997c0 .891-1.077 1.337-1.707.707l-5.997-5.998a1 1 0 0 1 0-1.415Z"
 }));
 
-const SvgCaretRight = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCaretRight = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1543,7 +1543,7 @@ const SvgCaretRight = props => /*#__PURE__*/React__namespace.createElement("svg"
   d: "M15.707 12.707 9.71 18.705c-.63.63-1.707.184-1.707-.707V6.001c0-.89 1.077-1.337 1.707-.707l5.997 5.999a1 1 0 0 1 0 1.414Z"
 }));
 
-const SvgCaretUp = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCaretUp = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1554,7 +1554,7 @@ const SvgCaretUp = props => /*#__PURE__*/React__namespace.createElement("svg", _
   d: "m12.708 8.294 5.999 5.997c.63.63.184 1.707-.707 1.707H6.003c-.891 0-1.337-1.077-.707-1.707l5.998-5.997a1 1 0 0 1 1.414 0Z"
 }));
 
-const SvgCart = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCart = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1567,7 +1567,7 @@ const SvgCart = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgChatBubble = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChatBubble = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1580,7 +1580,7 @@ const SvgChatBubble = props => /*#__PURE__*/React__namespace.createElement("svg"
   clipRule: "evenodd"
 }));
 
-const SvgChatBubbleBadgeColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChatBubbleBadgeColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1608,7 +1608,7 @@ const SvgChatBubbleBadgeColor = props => /*#__PURE__*/React__namespace.createEle
   d: "M0 .5h64v64H0z"
 }))));
 
-const SvgChatBubbleCorrect = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChatBubbleCorrect = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1628,7 +1628,7 @@ const SvgChatBubbleCorrect = props => /*#__PURE__*/React__namespace.createElemen
   d: "M0 0h24v24H0z"
 }))));
 
-const SvgChatBubbleCorrectColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChatBubbleCorrectColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1646,7 +1646,7 @@ const SvgChatBubbleCorrectColor = props => /*#__PURE__*/React__namespace.createE
   clipRule: "evenodd"
 }));
 
-const SvgChatBubbleDots = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChatBubbleDots = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1659,7 +1659,7 @@ const SvgChatBubbleDots = props => /*#__PURE__*/React__namespace.createElement("
   clipRule: "evenodd"
 }));
 
-const SvgChatBubbleQuestion = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChatBubbleQuestion = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1672,7 +1672,7 @@ const SvgChatBubbleQuestion = props => /*#__PURE__*/React__namespace.createEleme
   clipRule: "evenodd"
 }));
 
-const SvgCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1683,7 +1683,7 @@ const SvgCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   d: "M10.6 17.2c-.3 0-.6-.1-.8-.4l-4.6-4.6c-.5-.5-.5-1.2 0-1.7s1.2-.5 1.7 0l3.7 3.7 6.6-6.6c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-7.4 7.4c-.3.4-.6.5-.9.5Z"
 }));
 
-const SvgCheckInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCheckInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1696,7 +1696,7 @@ const SvgCheckInCircle = props => /*#__PURE__*/React__namespace.createElement("s
   clipRule: "evenodd"
 }));
 
-const SvgCheckInCircleColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCheckInCircleColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1712,7 +1712,7 @@ const SvgCheckInCircleColor = props => /*#__PURE__*/React__namespace.createEleme
   d: "m11.623 15.79 5.584-5.583a.999.999 0 1 0-1.414-1.414l-4.877 4.876-2.709-2.71a1.001 1.001 0 0 0-1.707.708 1 1 0 0 0 .293.707l3.416 3.417a1 1 0 0 0 1.414 0Z"
 }));
 
-const SvgCheckInCircleLine = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCheckInCircleLine = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1728,7 +1728,7 @@ const SvgCheckInCircleLine = props => /*#__PURE__*/React__namespace.createElemen
   d: "M12 3c5 0 9 4 9 9s-4 9-9 9-9-4-9-9 4-9 9-9Zm0-2C5.9 1 1 5.9 1 12s4.9 11 11 11 11-4.9 11-11S18.1 1 12 1Z"
 }));
 
-const SvgChevronDown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChevronDown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1741,7 +1741,7 @@ const SvgChevronDown = props => /*#__PURE__*/React__namespace.createElement("svg
   clipRule: "evenodd"
 }));
 
-const SvgChevronDownTwo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChevronDownTwo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1760,7 +1760,7 @@ const SvgChevronDownTwo = props => /*#__PURE__*/React__namespace.createElement("
   opacity: 0.6
 }));
 
-const SvgChevronLeft = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChevronLeft = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1773,7 +1773,7 @@ const SvgChevronLeft = props => /*#__PURE__*/React__namespace.createElement("svg
   clipRule: "evenodd"
 }));
 
-const SvgChevronRight = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChevronRight = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1786,7 +1786,7 @@ const SvgChevronRight = props => /*#__PURE__*/React__namespace.createElement("sv
   clipRule: "evenodd"
 }));
 
-const SvgChevronRightTwo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChevronRightTwo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1805,7 +1805,7 @@ const SvgChevronRightTwo = props => /*#__PURE__*/React__namespace.createElement(
   opacity: 0.6
 }));
 
-const SvgChevronUp = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChevronUp = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1818,7 +1818,7 @@ const SvgChevronUp = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgChevronUpTwo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgChevronUpTwo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1837,7 +1837,7 @@ const SvgChevronUpTwo = props => /*#__PURE__*/React__namespace.createElement("sv
   opacity: 0.6
 }));
 
-const SvgCircles = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCircles = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1850,7 +1850,7 @@ const SvgCircles = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgClip = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgClip = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1860,7 +1860,7 @@ const SvgClip = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   d: "M8.4 21.6c-1.9 0-3.9-.7-5.3-2.2-2.9-2.9-2.9-7.7 0-10.7l4.5-4.5c.4-.4 1.1-.4 1.6 0 .4.4.4 1.1 0 1.6l-4.5 4.5c-2.1 2.1-2.1 5.5 0 7.5 2.1 2.1 5.5 2.1 7.5 0L20 10c1.2-1.2 1.2-3.3 0-4.5-1.2-1.2-3.3-1.2-4.5 0l-7.1 7.1c-.4.4-.4 1.1 0 1.5.4.4 1.1.4 1.5 0l4.8-4.8c.4-.4 1.1-.4 1.6 0 .4.4.4 1.1 0 1.6l-4.8 4.8C10.1 17 8 17 6.8 15.7c-1.3-1.3-1.3-3.3 0-4.6L13.9 4c2.1-2.1 5.5-2.1 7.6 0 2.1 2.1 2.1 5.5 0 7.6l-7.8 7.8c-1.4 1.4-3.3 2.2-5.3 2.2Z"
 }));
 
-const SvgClose = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgClose = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1873,7 +1873,7 @@ const SvgClose = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgCloseInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCloseInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1886,7 +1886,7 @@ const SvgCloseInCircle = props => /*#__PURE__*/React__namespace.createElement("s
   clipRule: "evenodd"
 }));
 
-const SvgCoin = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCoin = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1899,7 +1899,7 @@ const SvgCoin = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgContact = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgContact = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1912,7 +1912,7 @@ const SvgContact = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgCopy = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCopy = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1930,7 +1930,7 @@ const SvgCopy = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgCorrect = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCorrect = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1942,7 +1942,7 @@ const SvgCorrect = props => /*#__PURE__*/React__namespace.createElement("svg", _
   d: "M2.7 12a9.3 9.3 0 1 1 18.6 0 9.3 9.3 0 0 1-18.6 0Z"
 }));
 
-const SvgCoupon = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCoupon = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1955,7 +1955,7 @@ const SvgCoupon = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgCrown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCrown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1968,7 +1968,7 @@ const SvgCrown = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgCurriculum = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCurriculum = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -1995,7 +1995,7 @@ const SvgCurriculum = props => /*#__PURE__*/React__namespace.createElement("svg"
   rx: 3.755
 }));
 
-const SvgCurriculumColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgCurriculumColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2029,7 +2029,7 @@ const SvgCurriculumColor = props => /*#__PURE__*/React__namespace.createElement(
   d: "M0 .5h32v32H0z"
 }))));
 
-const SvgDelete = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgDelete = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2042,7 +2042,7 @@ const SvgDelete = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgDocument = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgDocument = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2060,7 +2060,7 @@ const SvgDocument = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgDots = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgDots = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2073,7 +2073,7 @@ const SvgDots = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgDownload = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgDownload = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2087,7 +2087,7 @@ const SvgDownload = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M21.38 13.09c-.61 0-1.1.49-1.1 1.1v4.21c0 .72-.58 1.3-1.3 1.3H5c-.72 0-1.3-.58-1.3-1.3v-4.21c0-.61-.49-1.1-1.1-1.1-.61 0-1.1.49-1.1 1.1v4.21c0 1.93 1.57 3.5 3.5 3.5h13.98c1.93 0 3.5-1.57 3.5-3.5v-4.21c0-.61-.49-1.1-1.1-1.1Z"
 }));
 
-const SvgEmoji = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgEmoji = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2100,7 +2100,7 @@ const SvgEmoji = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgEng = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgEng = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2116,7 +2116,7 @@ const SvgEng = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   d: "M8.431 17.573c.516 0 .971-.335 1.125-.827l.582-1.866h4.04l.583 1.87a1.172 1.172 0 1 0 2.23-.716l-2.879-8.72a2.06 2.06 0 0 0-3.91-.003l-2.889 8.713a1.178 1.178 0 0 0 1.118 1.549Zm2.293-4.58 1.395-4.465h.077l1.395 4.466h-2.867Z"
 }));
 
-const SvgEqual = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgEqual = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2129,7 +2129,7 @@ const SvgEqual = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgEraser = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgEraser = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2142,7 +2142,7 @@ const SvgEraser = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgExclamationPointInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgExclamationPointInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2155,7 +2155,7 @@ const SvgExclamationPointInCircle = props => /*#__PURE__*/React__namespace.creat
   clipRule: "evenodd"
 }));
 
-const SvgEyeOff = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgEyeOff = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2166,7 +2166,7 @@ const SvgEyeOff = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   d: "M14.779 4.672A11.89 11.89 0 0 0 12 4.324c-4.212 0-8.195 2.261-10.818 6.028a2.905 2.905 0 0 0 0 3.297c.64.919 1.363 1.744 2.148 2.473l11.449-11.45ZM22.819 10.352a14.722 14.722 0 0 0-3.74-3.733l2.569-2.569a1.2 1.2 0 1 0-1.697-1.697L2.352 19.95a1.2 1.2 0 1 0 1.698 1.697l3.044-3.044c1.549.691 3.206 1.073 4.906 1.073 4.213 0 8.196-2.261 10.819-6.028a2.907 2.907 0 0 0 0-3.296Zm-10.82 5.622a3.887 3.887 0 0 1-1.819-.458l5.335-5.335c.287.545.458 1.159.458 1.818a3.978 3.978 0 0 1-3.974 3.975Z"
 }));
 
-const SvgEyeOn = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgEyeOn = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2184,7 +2184,7 @@ const SvgEyeOn = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgFaceHappy = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgFaceHappy = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2197,7 +2197,7 @@ const SvgFaceHappy = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgFaceSad = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgFaceSad = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2210,7 +2210,7 @@ const SvgFaceSad = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgFacebook = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgFacebook = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2221,7 +2221,7 @@ const SvgFacebook = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M17 2.119v3.168c-.301-.02-1.145-.05-2.108 0-1.205.063-1.386 1.026-1.386 1.491v2.486h3.373l-.451 3.541h-2.922V22H9.952v-9.195H7V9.264h2.952c-.01-.736-.024-2.293 0-2.64.03-.436-.12-1.989.994-3.2 1.114-1.212 1.897-1.305 2.952-1.398.843-.075 2.42.03 3.102.093Z"
 }));
 
-const SvgFacebookColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgFacebookColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2237,7 +2237,7 @@ const SvgFacebookColor = props => /*#__PURE__*/React__namespace.createElement("s
   clipRule: "evenodd"
 }));
 
-const SvgFilter = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgFilter = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2250,7 +2250,7 @@ const SvgFilter = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgFire = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgFire = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2261,7 +2261,7 @@ const SvgFire = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   d: "M10.373 2.847c-.021.287-.22 2.173-1.773 3.754-.144.145-.3.279-.465.4-.227.169-.616.462-1.021.787-.537.431-2.966 2.7-3.104 5.86 0 0-.586 7.212 7.136 8.276 0 0 2.5.531 5.223-1.214.061-.04.123-.078.187-.115.438-.257 2.76-1.767 3.368-5.192 0 0 .433-2.773-.768-4.942-.034-.06-.072-.117-.104-.177-.144-.273-.65-1.176-1.366-1.86a.699.699 0 0 0-.377-.191.565.565 0 0 0-.569.253c-.127.19-.761 1.139-1.045 1.49 0 0-.159.194-.12-.08 0 0 .515-2.576-1.264-5.153 0 0-1.107-1.719-2.807-2.578 0 0-.434-.273-.79-.117 0 0-.248.105-.325.66a1.583 1.583 0 0 0-.016.14Z"
 }));
 
-const SvgFolder = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgFolder = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2274,7 +2274,7 @@ const SvgFolder = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgFrame = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgFrame = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2287,7 +2287,7 @@ const SvgFrame = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgGlasses = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgGlasses = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2300,7 +2300,7 @@ const SvgGlasses = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgGraph = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgGraph = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2313,7 +2313,7 @@ const SvgGraph = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgGun = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgGun = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2324,7 +2324,7 @@ const SvgGun = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   d: "M23 10.5v-6a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6.25v1.75a3 3 0 0 0 3 3h4.13l.51 3.88a1 1 0 0 0 1 .87h5a1.002 1.002 0 0 0 1-1.13l-1.13-8.37H22a1 1 0 0 0 1-1ZM11.25 14a.76.76 0 0 1-.75-.75V11.5h4.26l.33 2.5h-3.84Z"
 }));
 
-const SvgGunColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgGunColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2338,7 +2338,7 @@ const SvgGunColor = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M19.771 12h-2.68a.3.3 0 0 0-.297.339l.899 6.9a.3.3 0 0 0 .297.261h2.692a.3.3 0 0 0 .298-.34l-.911-6.9a.3.3 0 0 0-.297-.26Z"
 }));
 
-const SvgHair = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgHair = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2351,7 +2351,7 @@ const SvgHair = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgHeadphone = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgHeadphone = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2364,7 +2364,7 @@ const SvgHeadphone = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgHeart = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgHeart = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2377,7 +2377,7 @@ const SvgHeart = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgInfinite = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgInfinite = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2388,7 +2388,7 @@ const SvgInfinite = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M17.802 6.972a4.393 4.393 0 0 0-3.123-1.136c-2.008.066-3.247 1.335-4.683 2.804l-.008.007-.008-.007C8.545 7.17 7.313 5.902 5.297 5.836a4.374 4.374 0 0 0-3.099 1.136A4.085 4.085 0 0 0 .833 9.997a4.05 4.05 0 0 0 1.35 3.033 4.414 4.414 0 0 0 2.973 1.137h.157C7.32 14.1 8.56 12.83 9.996 11.363v-.008l.008.008c1.435 1.468 2.667 2.737 4.683 2.804h.157a4.379 4.379 0 0 0 2.973-1.137 4.05 4.05 0 0 0 1.35-3.033 4.085 4.085 0 0 0-1.365-3.025Zm-12.56 5.35c-.635.022-1.24-.2-1.694-.613a2.31 2.31 0 0 1 .008-3.416 2.388 2.388 0 0 1 1.6-.62h.086c1.138.037 1.922.782 3.31 2.206.032.037.071.074.103.104l-.008.014.008.008c-.032.037-.071.074-.102.103-1.389 1.432-2.173 2.177-3.311 2.214Zm11.21-.613a2.392 2.392 0 0 1-1.694.613c-1.138-.037-1.922-.782-3.31-2.206-.032-.037-.071-.074-.103-.104l.008-.015h-.008c.032-.036.07-.073.102-.103 1.389-1.424 2.173-2.17 3.31-2.206.62-.008 1.225.2 1.687.62.495.442.761 1.048.761 1.704 0 .65-.266 1.255-.753 1.697Z"
 }));
 
-const SvgInfoInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgInfoInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2401,7 +2401,7 @@ const SvgInfoInCircle = props => /*#__PURE__*/React__namespace.createElement("sv
   clipRule: "evenodd"
 }));
 
-const SvgInstagram = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgInstagram = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2414,7 +2414,7 @@ const SvgInstagram = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgKakaoColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgKakaoColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2430,7 +2430,7 @@ const SvgKakaoColor = props => /*#__PURE__*/React__namespace.createElement("svg"
   clipRule: "evenodd"
 }));
 
-const SvgKor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgKor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2446,7 +2446,7 @@ const SvgKor = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   d: "M13.902 6.822v10.357a1.021 1.021 0 0 0 2.043 0V12.2h.761a.894.894 0 1 0 0-1.788h-.761v-3.59a1.021 1.021 0 1 0-2.043 0ZM8.022 15.776c3.188-1.833 4.52-4.486 4.762-7.528.054-.68-.502-1.219-1.162-1.219H7.755a.887.887 0 0 0 0 1.775h2.981c-.318 2.232-1.502 3.905-3.644 5.21-.501.305-.677.98-.325 1.475a.958.958 0 0 0 1.255.287Z"
 }));
 
-const SvgLetter = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLetter = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2459,7 +2459,7 @@ const SvgLetter = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgLetterCrownColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLetterCrownColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2481,7 +2481,7 @@ const SvgLetterCrownColor = props => /*#__PURE__*/React__namespace.createElement
   clipRule: "evenodd"
 }));
 
-const SvgLetterHeartColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLetterHeartColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2503,7 +2503,7 @@ const SvgLetterHeartColor = props => /*#__PURE__*/React__namespace.createElement
   clipRule: "evenodd"
 }));
 
-const SvgLineThree = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLineThree = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2516,7 +2516,7 @@ const SvgLineThree = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgLink = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLink = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2534,7 +2534,7 @@ const SvgLink = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgLock = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLock = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2547,7 +2547,7 @@ const SvgLock = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgLockColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLockColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2575,7 +2575,7 @@ const SvgLockColor = props => /*#__PURE__*/React__namespace.createElement("svg",
   stopColor: "#F14BFF"
 }))));
 
-const SvgLogoApple = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLogoApple = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2588,7 +2588,7 @@ const SvgLogoApple = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgLogoColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLogoColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2606,7 +2606,7 @@ const SvgLogoColor = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgLogoFacebook = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLogoFacebook = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2619,7 +2619,7 @@ const SvgLogoFacebook = props => /*#__PURE__*/React__namespace.createElement("sv
   clipRule: "evenodd"
 }));
 
-const SvgLogoKakao = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLogoKakao = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2632,7 +2632,7 @@ const SvgLogoKakao = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgLogoNaver = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgLogoNaver = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2643,7 +2643,7 @@ const SvgLogoNaver = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M14.865 4v8.073L9.163 4H3v16h6.135v-8.073L14.837 20H21V4h-6.135Z"
 }));
 
-const SvgMaxsize = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgMaxsize = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2654,7 +2654,7 @@ const SvgMaxsize = props => /*#__PURE__*/React__namespace.createElement("svg", _
   d: "M4.65 8.9h-2.4V5.2c0-1.8 1.4-3.2 3.2-3.2h3.8v2.4h-3.8c-.4 0-.8.4-.8.8v3.7Zm4.5 12.7h-3.7c-1.8 0-3.2-1.4-3.2-3.2v-3.8h2.4v3.8c0 .4.4.8.8.8h3.8v2.4h-.1Zm9.5 0h-3.8v-2.4h3.8c.4 0 .8-.4.8-.8v-3.8h2.4v3.8c0 1.8-1.4 3.2-3.2 3.2Zm3.2-12.7h-2.4V5.2c0-.4-.4-.8-.8-.8h-3.8V2h3.8c1.8 0 3.2 1.4 3.2 3.2v3.7Z"
 }));
 
-const SvgMinsize = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgMinsize = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2667,7 +2667,7 @@ const SvgMinsize = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgMinus = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgMinus = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2680,7 +2680,7 @@ const SvgMinus = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgMinusInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgMinusInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2693,7 +2693,7 @@ const SvgMinusInCircle = props => /*#__PURE__*/React__namespace.createElement("s
   clipRule: "evenodd"
 }));
 
-const SvgMoneybag = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgMoneybag = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2706,7 +2706,7 @@ const SvgMoneybag = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgMoneybagColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgMoneybagColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2722,7 +2722,7 @@ const SvgMoneybagColor = props => /*#__PURE__*/React__namespace.createElement("s
   d: "M16.1 13.6c.3 0 .6.3.6.6s-.3.6-.6.6h-1.5l-.4 1.4c-.1.2-.3.4-.6.4s-.5-.2-.6-.4l-.8-2.2-.8 2.2c-.1.2-.3.4-.6.4s-.5-.1-.6-.4l-.4-1.4H8.3c-.3 0-.6-.3-.6-.6s.3-.6.6-.6h1.1L9 12.2c-.1-.4.1-.7.4-.8.4-.1.7.1.8.4l.5 2.3.8-2c.1-.2.3-.4.6-.4s.5.2.6.4l.8 2 .7-2.3c.1-.3.5-.5.8-.4.3.1.5.5.4.8l-.4 1.4h1.1Z"
 }));
 
-const SvgMore = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgMore = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2735,7 +2735,7 @@ const SvgMore = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgMyBubble = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgMyBubble = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2748,7 +2748,7 @@ const SvgMyBubble = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgNaverColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNaverColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2762,7 +2762,7 @@ const SvgNaverColor = props => /*#__PURE__*/React__namespace.createElement("svg"
   d: "M13.305 8.125v3.91l-2.68-3.91H7.73v7.75h2.883v-3.91l2.68 3.91h2.896v-7.75h-2.883Z"
 }));
 
-const SvgNew = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNew = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2780,7 +2780,7 @@ const SvgNew = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   d: "M0 0h24v24H0z"
 }))));
 
-const SvgNote = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNote = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2793,7 +2793,7 @@ const SvgNote = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgNoteColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNoteColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2807,7 +2807,7 @@ const SvgNoteColor = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M6 7a1 1 0 0 1 1-1h5a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1ZM6 11a1 1 0 0 1 1-1h10a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1Z"
 }));
 
-const SvgNotePenColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNotePenColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2849,7 +2849,7 @@ const SvgNotePenColor = props => /*#__PURE__*/React__namespace.createElement("sv
   clipRule: "evenodd"
 }));
 
-const SvgNumberFiveFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberFiveFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2862,7 +2862,7 @@ const SvgNumberFiveFilled = props => /*#__PURE__*/React__namespace.createElement
   clipRule: "evenodd"
 }));
 
-const SvgNumberFiveOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberFiveOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2878,7 +2878,7 @@ const SvgNumberFiveOutlined = props => /*#__PURE__*/React__namespace.createEleme
   d: "M12.11 17.137c2.228 0 3.745-1.429 3.745-3.432 0-1.9-1.353-3.26-3.171-3.254-.869-.007-1.62.349-1.983.834h-.082l.274-2.502h4.402V7.102H9.197l-.533 5.7h1.86c.293-.553.813-.833 1.558-.833 1.04.007 1.784.738 1.777 1.79.007 1.033-.724 1.758-1.75 1.75-.861.008-1.565-.526-1.613-1.298H8.5c.034 1.709 1.545 2.926 3.61 2.926Z"
 }));
 
-const SvgNumberFourFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberFourFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2891,7 +2891,7 @@ const SvgNumberFourFilled = props => /*#__PURE__*/React__namespace.createElement
   clipRule: "evenodd"
 }));
 
-const SvgNumberFourOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberFourOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2907,7 +2907,7 @@ const SvgNumberFourOutlined = props => /*#__PURE__*/React__namespace.createEleme
   d: "M8 15.25h4.813V17h1.955v-1.75h1.257v-1.654h-1.257V7.102h-2.584L8 13.623v1.627Zm2.078-1.654v-.082l2.666-4.157h.096v4.239h-2.762Z"
 }));
 
-const SvgNumberOneFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberOneFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2920,7 +2920,7 @@ const SvgNumberOneFilled = props => /*#__PURE__*/React__namespace.createElement(
   clipRule: "evenodd"
 }));
 
-const SvgNumberOneOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberOneOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2936,7 +2936,7 @@ const SvgNumberOneOutlined = props => /*#__PURE__*/React__namespace.createElemen
   d: "M13.264 7.102h-1.942L8.875 8.66v1.819l2.27-1.422h.054V17h2.065V7.102Z"
 }));
 
-const SvgNumberThreeFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberThreeFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2949,7 +2949,7 @@ const SvgNumberThreeFilled = props => /*#__PURE__*/React__namespace.createElemen
   clipRule: "evenodd"
 }));
 
-const SvgNumberThreeOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberThreeOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2965,7 +2965,7 @@ const SvgNumberThreeOutlined = props => /*#__PURE__*/React__namespace.createElem
   d: "M11.773 17.137c2.236 0 3.842-1.217 3.829-2.912.013-1.238-.787-2.12-2.243-2.297v-.082c1.108-.198 1.88-.985 1.873-2.092.007-1.566-1.367-2.79-3.431-2.79-2.03 0-3.562 1.183-3.596 2.886h1.969c.034-.76.752-1.251 1.627-1.245.875-.006 1.456.513 1.449 1.272.007.78-.677 1.313-1.654 1.313h-.916v1.517h.916c1.162.007 1.88.574 1.873 1.38.007.8-.697 1.348-1.682 1.354-.957-.006-1.675-.492-1.709-1.23H8c.041 1.73 1.6 2.926 3.773 2.926Z"
 }));
 
-const SvgNumberTwoFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberTwoFilled = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2978,7 +2978,7 @@ const SvgNumberTwoFilled = props => /*#__PURE__*/React__namespace.createElement(
   clipRule: "evenodd"
 }));
 
-const SvgNumberTwoOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgNumberTwoOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -2994,7 +2994,7 @@ const SvgNumberTwoOutlined = props => /*#__PURE__*/React__namespace.createElemen
   d: "M8.396 17.035h7.082V15.34h-4.225v-.055l1.504-1.463c2.037-1.845 2.584-2.768 2.584-3.896C15.341 8.21 13.933 7 11.814 7 9.729 7 8.294 8.237 8.3 10.172h1.955c-.007-.95.602-1.538 1.531-1.531.91-.007 1.573.54 1.573 1.421 0 .787-.5 1.334-1.422 2.215l-3.555 3.268.014 1.49Z"
 }));
 
-const SvgOut = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgOut = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3012,7 +3012,7 @@ const SvgOut = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   clipRule: "evenodd"
 }));
 
-const SvgPalmTreeColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPalmTreeColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3049,7 +3049,7 @@ const SvgPalmTreeColor = props => /*#__PURE__*/React__namespace.createElement("s
   d: "M21.263 18.25c-.782 1.645-2.528 2.45-3.899 1.799-1.37-.652-1.848-2.515-1.066-4.16.783-1.645 2.528-2.45 3.9-1.799 1.37.652 1.848 2.515 1.065 4.16Z"
 }));
 
-const SvgPaperCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPaperCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3081,7 +3081,7 @@ const SvgPaperCheck = props => /*#__PURE__*/React__namespace.createElement("svg"
   d: "M15.766 16.327H31.44V32H15.766z"
 }))));
 
-const SvgPause = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPause = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3094,7 +3094,7 @@ const SvgPause = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgPen = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPen = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3107,7 +3107,7 @@ const SvgPen = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   clipRule: "evenodd"
 }));
 
-const SvgPercentInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPercentInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3125,7 +3125,7 @@ const SvgPercentInCircle = props => /*#__PURE__*/React__namespace.createElement(
   clipRule: "evenodd"
 }));
 
-const SvgPicture = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPicture = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3138,7 +3138,7 @@ const SvgPicture = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgPin = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPin = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3151,7 +3151,7 @@ const SvgPin = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   clipRule: "evenodd"
 }));
 
-const SvgPinColorRed = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPinColorRed = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3173,7 +3173,7 @@ const SvgPinColorRed = props => /*#__PURE__*/React__namespace.createElement("svg
   d: "M0 .5h16v16H0z"
 }))));
 
-const SvgPlay = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPlay = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3184,7 +3184,7 @@ const SvgPlay = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   d: "M18.88 10.037c1.493.872 1.493 3.053 0 3.926l-11.52 6.73C5.867 21.565 4 20.475 4 18.73V5.27c0-1.745 1.867-2.835 3.36-1.963l11.52 6.73Z"
 }));
 
-const SvgPlug = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPlug = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3213,7 +3213,7 @@ const SvgPlug = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   d: "M10.426 11.111h11.951v10.864H10.426z"
 }))));
 
-const SvgPlugColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPlugColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3245,7 +3245,7 @@ const SvgPlugColor = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M10.426 11.111h11.951v10.864H10.426z"
 }))));
 
-const SvgPlus = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPlus = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3258,7 +3258,7 @@ const SvgPlus = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgPlusInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPlusInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3271,7 +3271,7 @@ const SvgPlusInCircle = props => /*#__PURE__*/React__namespace.createElement("sv
   clipRule: "evenodd"
 }));
 
-const SvgPointInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPointInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3289,7 +3289,7 @@ const SvgPointInCircle = props => /*#__PURE__*/React__namespace.createElement("s
   clipRule: "evenodd"
 }));
 
-const SvgPointInCircleColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPointInCircleColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3312,7 +3312,7 @@ const SvgPointInCircleColor = props => /*#__PURE__*/React__namespace.createEleme
   d: "M0 0h24v24H0z"
 }))));
 
-const SvgPresent = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPresent = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3328,7 +3328,7 @@ const SvgPresent = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgPresentColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgPresentColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3344,7 +3344,7 @@ const SvgPresentColor = props => /*#__PURE__*/React__namespace.createElement("sv
   clipRule: "evenodd"
 }));
 
-const SvgProblem = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgProblem = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3355,7 +3355,7 @@ const SvgProblem = props => /*#__PURE__*/React__namespace.createElement("svg", _
   d: "m20.73 2.357-6.89 1.938a1 1 0 0 0-.729.963V20.68a1 1 0 0 0 1.27.963l6.89-1.938a1 1 0 0 0 .729-.962V3.32a1 1 0 0 0-1.27-.963ZM3.27 2.357l6.89 1.938a1 1 0 0 1 .729.963V20.68a1 1 0 0 1-1.27.963l-6.89-1.938A1 1 0 0 1 2 18.743V3.32a1 1 0 0 1 1.27-.963Z"
 }));
 
-const SvgProfile = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgProfile = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3368,7 +3368,7 @@ const SvgProfile = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgProgressGradient = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgProgressGradient = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3405,7 +3405,7 @@ const SvgProgressGradient = props => /*#__PURE__*/React__namespace.createElement
   opacity: 0.72
 }));
 
-const SvgQuestionMarkInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgQuestionMarkInCircle = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3418,7 +3418,7 @@ const SvgQuestionMarkInCircle = props => /*#__PURE__*/React__namespace.createEle
   clipRule: "evenodd"
 }));
 
-const SvgQuestionMarkInCircleOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgQuestionMarkInCircleOutlined = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3434,7 +3434,7 @@ const SvgQuestionMarkInCircleOutlined = props => /*#__PURE__*/React__namespace.c
   d: "M13.652 12.569c.629-.403 1.487-.953 1.774-2.201.224-.974.016-1.927-.586-2.683-.681-.855-1.817-1.385-2.966-1.385A3.578 3.578 0 0 0 8.3 9.874a.9.9 0 1 0 1.8 0c0-.978.796-1.775 1.774-1.775.605 0 1.216.278 1.558.707.261.328.341.718.24 1.16-.117.507-.42.722-.992 1.087l-.002.001c-.72.461-1.704 1.091-1.704 2.695a.9.9 0 1 0 1.8 0c0-.589.225-.763.876-1.179l.002-.001ZM11.041 17.756a1.2 1.2 0 1 0 1.697-1.697 1.2 1.2 0 0 0-1.697 1.697Z"
 }));
 
-const SvgRaffleColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgRaffleColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3543,7 +3543,7 @@ const SvgRaffleColor = props => /*#__PURE__*/React__namespace.createElement("svg
   result: "effect1_innerShadow_12781_25756"
 }))));
 
-const SvgReceipt = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgReceipt = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3556,7 +3556,7 @@ const SvgReceipt = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgRefresh = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgRefresh = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3569,7 +3569,7 @@ const SvgRefresh = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgRepeat = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgRepeat = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3580,7 +3580,7 @@ const SvgRepeat = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   d: "M4.3 12.37v-1.01c0-2.79 2.27-5.06 5.06-5.06h7.59l-.56.56a1.202 1.202 0 0 0 1.7 1.7l2.61-2.61c.22-.23.35-.53.35-.85 0-.32-.13-.62-.35-.85l-2.61-2.61a1.201 1.201 0 1 0-1.7 1.7l.56.56H9.36c-4.11 0-7.46 3.35-7.46 7.46v1.01c0 .66.54 1.2 1.2 1.2.66 0 1.2-.53 1.2-1.2Zm16.6-1.94c-.66 0-1.2.54-1.2 1.2v1.01c0 2.79-2.27 5.06-5.06 5.06H7.05l.56-.56a1.202 1.202 0 0 0-1.7-1.7L3.3 18.05c-.23.22-.35.53-.35.85 0 .32.13.62.35.85l2.61 2.61a1.204 1.204 0 0 0 1.7 0c.47-.47.47-1.23 0-1.7l-.56-.56h7.59c4.11 0 7.46-3.35 7.46-7.46v-1.01c0-.67-.54-1.2-1.2-1.2Z"
 }));
 
-const SvgSchool = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSchool = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3596,7 +3596,7 @@ const SvgSchool = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgSchoolColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSchoolColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3619,7 +3619,7 @@ const SvgSchoolColor = props => /*#__PURE__*/React__namespace.createElement("svg
   d: "M0 0h32v32H0z"
 }))));
 
-const SvgSearch = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSearch = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3630,7 +3630,7 @@ const SvgSearch = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   d: "m22.049 20.352-4.607-4.607a8.53 8.53 0 0 0 1.736-5.156C19.178 5.853 15.324 2 10.589 2 5.853 2.001 2 5.854 2 10.59c0 4.735 3.853 8.589 8.589 8.589a8.533 8.533 0 0 0 5.156-1.736l4.607 4.607a1.196 1.196 0 0 0 1.697-.001 1.201 1.201 0 0 0 0-1.697ZM4.4 10.59a6.196 6.196 0 0 1 6.189-6.189 6.195 6.195 0 0 1 6.188 6.188 6.195 6.195 0 0 1-6.188 6.188A6.194 6.194 0 0 1 4.4 10.59Z"
 }));
 
-const SvgSet = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSet = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3646,7 +3646,7 @@ const SvgSet = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   clipRule: "evenodd"
 }));
 
-const SvgSetting = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSetting = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3659,7 +3659,7 @@ const SvgSetting = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgShare = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgShare = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3677,7 +3677,7 @@ const SvgShare = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgShieldCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgShieldCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3688,7 +3688,7 @@ const SvgShieldCheck = props => /*#__PURE__*/React__namespace.createElement("svg
   d: "M21.1 4.3 12.4.7c-.2-.1-.5-.1-.8 0L2.9 4.3c-.4.1-.6.5-.6.9v8.3c0 3.8 4.8 7.5 9.3 9.8.3.1.6.1.9 0 4.5-2.3 9.3-6 9.3-9.8V5.2c-.1-.4-.3-.8-.7-.9Zm-3.7 5.5-5.8 5.8c-.2.2-.5.3-.7.3-.2 0-.5-.1-.7-.3L6.6 12c-.4-.4-.4-1.1 0-1.5.4-.4 1.1-.4 1.5 0l2.8 2.8 5.1-5c.4-.4 1.1-.4 1.5 0 .4.4.4 1.1-.1 1.5Z"
 }));
 
-const SvgSiren = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSiren = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3701,7 +3701,7 @@ const SvgSiren = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgSkipback = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSkipback = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3714,7 +3714,7 @@ const SvgSkipback = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgSkipforward = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSkipforward = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3727,7 +3727,7 @@ const SvgSkipforward = props => /*#__PURE__*/React__namespace.createElement("svg
   clipRule: "evenodd"
 }));
 
-const SvgSoundOff = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSoundOff = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3738,7 +3738,7 @@ const SvgSoundOff = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M16.894 5.553a1 1 0 0 0-1.788.894l3.026 6.053-3.026 6.053a1 1 0 1 0 1.789.894l2.355-4.71 2.355 4.71a1 1 0 0 0 1.79-.894L20.367 12.5l3.027-6.053a1 1 0 0 0-1.79-.894l-2.355 4.711-2.356-4.711ZM1 16.487V8.693c0-.43.349-.78.78-.78h3.184a.78.78 0 0 0 .55-.227l5.457-5.456a.78.78 0 0 1 1.33.55v19.303a.78.78 0 0 1-1.314.567l-5.475-5.17a.78.78 0 0 0-.535-.213H1.779a.78.78 0 0 1-.779-.78Z"
 }));
 
-const SvgSoundOn = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSoundOn = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3759,7 +3759,7 @@ const SvgSoundOn = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgSpeaker = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSpeaker = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3772,7 +3772,7 @@ const SvgSpeaker = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgStackup = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgStackup = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3795,7 +3795,7 @@ const SvgStackup = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgStar = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgStar = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3808,7 +3808,7 @@ const SvgStar = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgStore = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgStore = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3819,7 +3819,7 @@ const SvgStore = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgSync = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgSync = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3832,7 +3832,7 @@ const SvgSync = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgTestUploadColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgTestUploadColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3854,7 +3854,7 @@ const SvgTestUploadColor = props => /*#__PURE__*/React__namespace.createElement(
   d: "m12.484 13.449 4.338-3.88a.328.328 0 0 1 .435-.003l4.43 3.88c.228.2.087.575-.216.575h-2.005a.34.34 0 0 0-.333.331c-.158 4.863-3.811 6.125-6.202 6.177-.287.007-.407-.341-.206-.546 2.16-2.194 2.613-4.543 2.478-5.705a.298.298 0 0 0-.304-.257h-2.196a.328.328 0 0 1-.219-.572Z"
 }));
 
-const SvgThumbdown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgThumbdown = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3867,7 +3867,7 @@ const SvgThumbdown = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgThumbup = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgThumbup = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3880,7 +3880,7 @@ const SvgThumbup = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgThunder = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgThunder = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3893,7 +3893,7 @@ const SvgThunder = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgTicket = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgTicket = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3906,7 +3906,7 @@ const SvgTicket = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgTicketColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgTicketColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3931,7 +3931,7 @@ const SvgTicketColor = props => /*#__PURE__*/React__namespace.createElement("svg
   stopColor: "#595959"
 }))));
 
-const SvgTime = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgTime = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3944,7 +3944,7 @@ const SvgTime = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgTop = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgTop = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3957,7 +3957,7 @@ const SvgTop = props => /*#__PURE__*/React__namespace.createElement("svg", _exte
   clipRule: "evenodd"
 }));
 
-const SvgTrash = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgTrash = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3970,7 +3970,7 @@ const SvgTrash = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgTreasurebox = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgTreasurebox = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -3988,7 +3988,7 @@ const SvgTreasurebox = props => /*#__PURE__*/React__namespace.createElement("svg
   clipRule: "evenodd"
 }));
 
-const SvgTrophy = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgTrophy = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4001,7 +4001,7 @@ const SvgTrophy = props => /*#__PURE__*/React__namespace.createElement("svg", _e
   clipRule: "evenodd"
 }));
 
-const SvgUndo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgUndo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4014,7 +4014,7 @@ const SvgUndo = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgUniversity = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgUniversity = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4036,7 +4036,7 @@ const SvgUniversity = props => /*#__PURE__*/React__namespace.createElement("svg"
   d: "M21.426 15.401a.92.92 0 1 1-1.841 0 .92.92 0 0 1 1.841 0Z"
 }));
 
-const SvgUserBlocked = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgUserBlocked = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4049,7 +4049,7 @@ const SvgUserBlocked = props => /*#__PURE__*/React__namespace.createElement("svg
   clipRule: "evenodd"
 }));
 
-const SvgUserCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgUserCheck = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4062,7 +4062,7 @@ const SvgUserCheck = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgUserPlus = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgUserPlus = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4075,7 +4075,7 @@ const SvgUserPlus = props => /*#__PURE__*/React__namespace.createElement("svg",
   clipRule: "evenodd"
 }));
 
-const SvgUserTwo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgUserTwo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4094,7 +4094,7 @@ const SvgUserTwo = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgVideo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgVideo = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4107,7 +4107,7 @@ const SvgVideo = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgVideoColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgVideoColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4121,7 +4121,7 @@ const SvgVideoColor = props => /*#__PURE__*/React__namespace.createElement("svg"
   d: "M15.507 11.474c.39.234.39.818 0 1.052l-4.829 2.892c-.39.233-.878-.059-.878-.526V9.108c0-.467.488-.76.878-.526l4.83 2.892Z"
 }));
 
-const SvgVoteColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgVoteColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4141,7 +4141,7 @@ const SvgVoteColor = props => /*#__PURE__*/React__namespace.createElement("svg",
   d: "M3.256 3.719A1 1 0 0 1 4.216 3h15.569a1 1 0 0 1 .96.719L22 8H2l1.256-4.281Z"
 }));
 
-const SvgWarning = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgWarning = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4154,7 +4154,7 @@ const SvgWarning = props => /*#__PURE__*/React__namespace.createElement("svg", _
   clipRule: "evenodd"
 }));
 
-const SvgWifi = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgWifi = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4177,7 +4177,7 @@ const SvgWifi = props => /*#__PURE__*/React__namespace.createElement("svg", _ext
   clipRule: "evenodd"
 }));
 
-const SvgWorkbookColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgWorkbookColor = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4202,7 +4202,7 @@ const SvgWorkbookColor = props => /*#__PURE__*/React__namespace.createElement("s
   rx: 1.546
 }));
 
-const SvgWrong = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgWrong = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4218,7 +4218,7 @@ const SvgWrong = props => /*#__PURE__*/React__namespace.createElement("svg", _ex
   clipRule: "evenodd"
 }));
 
-const SvgYoutube = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+const SvgYoutube = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
   height: "1em",
@@ -4431,6 +4431,15 @@ var icons = /*#__PURE__*/Object.freeze({
   YoutubeIcon: SvgYoutube
 });
 
+/**
+ * 숫자를 콤마(,)로 구분해서 반환합니다.
+ */
+function commaizeNumber(value) {
+  const parts = value.toString().split('.');
+  parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+  return parts.join('.');
+}
+
 /**
  * CSS에서 사용할 수 있는 픽셀값으로 강제합니다.
  */
@@ -4438,16 +4447,16 @@ const forcePixelValue = value => {
   return typeof value === 'string' ? value : `${value}px`;
 };
 
-const isArray = value => Array.isArray(value);
+const isArray$1 = value => Array.isArray(value);
 
-const isFunction = value => typeof value === 'function';
+const isFunction$1 = value => typeof value === 'function';
 
 const isNullable = value => value === null || value === undefined;
 
 /**
  * 아무 행위도 하지 않는 함수입니다.
  */
-function noop$2() {}
+function noop$3() {}
 
 const scrollIntoView = ({
   childrenRef,
@@ -6830,12 +6839,12 @@ const BaseGrid = styled__default.default(View)({
   }
 }));
 const mapValueToResponsiveValueProps = (value, propsAccessor) => {
-  if (isNullable(value) || typeof value === 'object' && !isArray(value)) return null;
-  if (!isArray(value)) return propsAccessor(value);
+  if (isNullable(value) || typeof value === 'object' && !isArray$1(value)) return null;
+  if (!isArray$1(value)) return propsAccessor(value);
   return value.reduce((acc, cur) => {
     const curProps = propsAccessor(cur);
     const curPropKeys = Object.keys(curProps);
-    return Object.fromEntries(curPropKeys.map(curPropKey => [curPropKey, acc[curPropKey] === undefined || acc[curPropKey] === null ? [curProps[curPropKey]] : isArray(acc[curPropKey]) ? [...acc[curPropKey], curProps[curPropKey]] : [acc[curPropKey], curProps[curPropKey]]]));
+    return Object.fromEntries(curPropKeys.map(curPropKey => [curPropKey, acc[curPropKey] === undefined || acc[curPropKey] === null ? [curProps[curPropKey]] : isArray$1(acc[curPropKey]) ? [...acc[curPropKey], curProps[curPropKey]] : [acc[curPropKey], curProps[curPropKey]]]));
   }, {});
 };
 const Unit = ({
@@ -6989,7 +6998,7 @@ const ActionListItem = ({
       }) : null : selectionVariant === 'multiple' ? /*#__PURE__*/jsxRuntimeExports.jsx(FakeCheckbox, {
         "aria-checked": selected,
         checked: selected,
-        onChange: noop$2,
+        onChange: noop$3,
         "aria-disabled": disabled,
         disabled: disabled
       }) : null
@@ -7301,7 +7310,7 @@ const BaseActionList = styled__default.default.ul`
 
   ${sx}
 `;
-var index$a = Object.assign(ActionList, {
+var index$b = Object.assign(ActionList, {
   Item: ActionListItem,
   SectionDivider: ActionListSectionDivider,
   SectionHeader: ActionListSectionHeader
@@ -7816,12 +7825,12 @@ const sanitize = (v) => Math.round(v * 100000) / 100000;
 const floatRegex = /(-)?([\d]*\.?[\d])+/g;
 const colorRegex = /(#[0-9a-f]{3,8}|(rgb|hsl)a?\((-?[\d\.]+%?[,\s]+){2}(-?[\d\.]+%?)\s*[\,\/]?\s*[\d\.]*%?\))/gi;
 const singleColorRegex = /^(#[0-9a-f]{3,8}|(rgb|hsl)a?\((-?[\d\.]+%?[,\s]+){2}(-?[\d\.]+%?)\s*[\,\/]?\s*[\d\.]*%?\))$/i;
-function isString(v) {
+function isString$1(v) {
     return typeof v === "string";
 }
 
 const createUnitType = (unit) => ({
-    test: (v) => isString(v) && v.endsWith(unit) && v.split(" ").length === 1,
+    test: (v) => isString$1(v) && v.endsWith(unit) && v.split(" ").length === 1,
     parse: parseFloat,
     transform: (v) => `${v}${unit}`,
 });
@@ -8496,7 +8505,7 @@ function makeLatestValues(props, context, presenceContext, scrapeMotionValues) {
     return values;
 }
 
-const noop$1 = (any) => any;
+const noop$2 = (any) => any;
 
 class Queue {
     constructor() {
@@ -8658,7 +8667,7 @@ function createRenderBatcher(scheduleNextBatch, allowKeepAlive) {
     return { schedule, cancel, state, steps };
 }
 
-const { schedule: frame, cancel: cancelFrame, state: frameData, steps, } = createRenderBatcher(typeof requestAnimationFrame !== "undefined" ? requestAnimationFrame : noop$1, true);
+const { schedule: frame, cancel: cancelFrame, state: frameData, steps, } = createRenderBatcher(typeof requestAnimationFrame !== "undefined" ? requestAnimationFrame : noop$2, true);
 
 const svgMotionConfig = {
     useVisualState: makeUseVisualState({
@@ -8908,9 +8917,9 @@ function fireSyntheticPointerEvent(name, handler) {
 class PressGesture extends Feature {
     constructor() {
         super(...arguments);
-        this.removeStartListeners = noop$1;
-        this.removeEndListeners = noop$1;
-        this.removeAccessibleListeners = noop$1;
+        this.removeStartListeners = noop$2;
+        this.removeEndListeners = noop$2;
+        this.removeAccessibleListeners = noop$2;
         this.startPointerPress = (startEvent, startInfo) => {
             this.removeEndListeners();
             if (this.isPressing)
@@ -9176,8 +9185,8 @@ function resolveVariant(visualElement, definition, custom) {
 const optimizedAppearDataId = "framerAppearId";
 const optimizedAppearDataAttribute = "data-" + camelToDash(optimizedAppearDataId);
 
-let warning = noop$1;
-let invariant = noop$1;
+let warning = noop$2;
+let invariant = noop$2;
 if (process.env.NODE_ENV !== "production") {
     warning = (check, message) => {
         if (!check && typeof console !== "undefined") {
@@ -9303,7 +9312,7 @@ function binarySubdivide(x, lowerBound, upperBound, mX1, mX2) {
 function cubicBezier(mX1, mY1, mX2, mY2) {
     // If this is a linear gradient, return linear easing
     if (mX1 === mY1 && mX2 === mY2)
-        return noop$1;
+        return noop$2;
     const getTForX = (aX) => binarySubdivide(aX, 0, 1, mX1, mX2);
     // If animation is at start/end, return t without easing
     return (t) => t === 0 || t === 1 ? t : calcBezier(getTForX(t), mY1, mY2);
@@ -9336,7 +9345,7 @@ const backInOut = mirrorEasing(backIn);
 const anticipate = (p) => (p *= 2) < 1 ? 0.5 * backIn(p) : 0.5 * (2 - Math.pow(2, -10 * (p - 1)));
 
 const easingLookup = {
-    linear: noop$1,
+    linear: noop$2,
     easeIn,
     easeInOut,
     easeOut,
@@ -9368,11 +9377,11 @@ const easingDefinitionToFunction = (definition) => {
  * but false if a number or multiple colors
  */
 const isColorString = (type, testProp) => (v) => {
-    return Boolean((isString(v) && singleColorRegex.test(v) && v.startsWith(type)) ||
+    return Boolean((isString$1(v) && singleColorRegex.test(v) && v.startsWith(type)) ||
         (testProp && Object.prototype.hasOwnProperty.call(v, testProp)));
 };
 const splitColor = (aName, bName, cName) => (v) => {
-    if (!isString(v))
+    if (!isString$1(v))
         return v;
     const [a, b, c, alpha] = v.match(floatRegex);
     return {
@@ -9468,7 +9477,7 @@ const color = {
         }
     },
     transform: (v) => {
-        return isString(v)
+        return isString$1(v)
             ? v
             : v.hasOwnProperty("red")
                 ? rgba.transform(v)
@@ -9575,7 +9584,7 @@ const mixColor = (from, to) => {
 function test(v) {
     var _a, _b;
     return (isNaN(v) &&
-        isString(v) &&
+        isString$1(v) &&
         (((_a = v.match(floatRegex)) === null || _a === void 0 ? void 0 : _a.length) || 0) +
             (((_b = v.match(colorRegex)) === null || _b === void 0 ? void 0 : _b.length) || 0) >
             0);
@@ -9584,7 +9593,7 @@ const cssVarTokeniser = {
     regex: cssVariableRegex,
     countKey: "Vars",
     token: "${v}",
-    parse: noop$1,
+    parse: noop$2,
 };
 const colorTokeniser = {
     regex: colorRegex,
@@ -9753,7 +9762,7 @@ function createMixers(output, ease, customMixer) {
     for (let i = 0; i < numMixers; i++) {
         let mixer = mixerFactory(output[i], output[i + 1]);
         if (ease) {
-            const easingFunction = Array.isArray(ease) ? ease[i] || noop$1 : ease;
+            const easingFunction = Array.isArray(ease) ? ease[i] || noop$2 : ease;
             mixer = pipe(easingFunction, mixer);
         }
         mixers.push(mixer);
@@ -10644,7 +10653,7 @@ function createAcceleratedAnimation(value, valueName, { onUpdate, onComplete, ..
         attachTimeline(timeline) {
             animation.timeline = timeline;
             animation.onfinish = null;
-            return noop$1;
+            return noop$2;
         },
         get time() {
             return millisecondsToSeconds(animation.currentTime || 0);
@@ -10714,15 +10723,15 @@ function createInstantAnimation({ keyframes, delay, onUpdate, onComplete, }) {
             time: 0,
             speed: 1,
             duration: 0,
-            play: (noop$1),
-            pause: (noop$1),
-            stop: (noop$1),
+            play: (noop$2),
+            pause: (noop$2),
+            stop: (noop$2),
             then: (resolve) => {
                 resolve();
                 return Promise.resolve();
             },
-            cancel: (noop$1),
-            complete: (noop$1),
+            cancel: (noop$2),
+            complete: (noop$2),
         };
     };
     return delay
@@ -13000,8 +13009,8 @@ function getCurrentDirection(offset, lockThreshold = 10) {
 class DragGesture extends Feature {
     constructor(node) {
         super(node);
-        this.removeGroupControls = noop$1;
-        this.removeListeners = noop$1;
+        this.removeGroupControls = noop$2;
+        this.removeListeners = noop$2;
         this.controls = new VisualElementDragControls(node);
     }
     mount() {
@@ -13011,7 +13020,7 @@ class DragGesture extends Feature {
         if (dragControls) {
             this.removeGroupControls = dragControls.subscribe(this.controls);
         }
-        this.removeListeners = this.controls.addListeners() || noop$1;
+        this.removeListeners = this.controls.addListeners() || noop$2;
     }
     unmount() {
         this.removeGroupControls();
@@ -13027,7 +13036,7 @@ const asyncHandler = (handler) => (event, info) => {
 class PanGesture extends Feature {
     constructor() {
         super(...arguments);
-        this.removePointerDownListener = noop$1;
+        this.removePointerDownListener = noop$2;
     }
     onPointerDown(pointerDownEvent) {
         this.session = new PanSession(pointerDownEvent, this.createPanHandlers(), { transformPagePoint: this.node.getTransformPagePoint() });
@@ -13375,7 +13384,7 @@ function getRadius(values, radiusName) {
 //     )(p)
 // }
 const easeCrossfadeIn = compress(0, 0.5, circOut);
-const easeCrossfadeOut = compress(0.5, 0.95, noop$1);
+const easeCrossfadeOut = compress(0.5, 0.95, noop$2);
 function compress(min, max, easing) {
     return (p) => {
         // Could replace ifs with clamp
@@ -15132,7 +15141,7 @@ const userAgentContains = (string) => typeof navigator !== "undefined" &&
  */
 const roundPoint = userAgentContains("applewebkit/") && !userAgentContains("chrome/")
     ? Math.round
-    : noop$1;
+    : noop$2;
 function roundAxis(axis) {
     // Round to the nearest .5 pixels to support subpixel layouts
     axis.min = roundPoint(axis.min);
@@ -16572,7 +16581,7 @@ const BaseAvatar = styled__default.default(Image)`
 })}
   ${sx}
 `;
-var index$9 = /*#__PURE__*/React.forwardRef(Avatar);
+var index$a = /*#__PURE__*/React.forwardRef(Avatar);
 
 const BadgeAttacher = ({
   children,
@@ -16982,7 +16991,7 @@ const BreadcrumbsItemWrapper = styled__default.default.span`
     }
   }
 `;
-var index$8 = Object.assign(Breadcrumbs, {
+var index$9 = Object.assign(Breadcrumbs, {
   Item: BreadcrumbsItem
 });
 
@@ -17281,7 +17290,7 @@ const BaseButton = styled__default.default(UnstyledButton)(({
         outlineOffset: 2
       },
       ...($disabled ? {
-        'backgroundColor': color$1['bg/disabled'],
+        'backgroundColor': color$1['bg/disabled/subtlest'],
         'color': color$1['text/disabled'],
         '& svg': {
           color: color$1['icon/disabled']
@@ -17928,7 +17937,7 @@ const DatagridWrapper = styled__default.default.div`
 const BaseDatagrid = styled__default.default.div`
   width: inherit;
 `;
-var index$7 = Object.assign(Datagrid, {
+var index$8 = Object.assign(Datagrid, {
   Header: DatagridHeader,
   Subheader: DatagridSubheader,
   Body: DatagridBody,
@@ -18275,7 +18284,7 @@ function isTabbable(elem, strict = false) {
 }
 
 let signalSupported = false;
-function noop() {}
+function noop$1() {}
 try {
   const options = Object.create({}, {
     signal: {
@@ -18284,8 +18293,8 @@ try {
       }
     }
   });
-  window.addEventListener('test', noop, options);
-  window.removeEventListener('test', noop, options);
+  window.addEventListener('test', noop$1, options);
+  window.removeEventListener('test', noop$1, options);
 } catch (e) {}
 function featureSupported() {
   return signalSupported;
@@ -19110,7 +19119,7 @@ const BaseDialog = styled__default.default.div(() => ({
   overflow: 'hidden',
   margin: 'auto'
 }), sx);
-var index$6 = Object.assign( /*#__PURE__*/React.forwardRef(Dialog), {
+var index$7 = Object.assign( /*#__PURE__*/React.forwardRef(Dialog), {
   UnstyledHeader: UnstyledDialogHeader,
   UnstyledBody: UnstyledDialogBody,
   UnstyledFooter: UnstyledDialogFooter,
@@ -20687,7 +20696,7 @@ const computePosition = (reference, floating, options) => {
   });
 };
 
-var index$5 = typeof document !== 'undefined' ? React.useLayoutEffect : React.useEffect;
+var index$6 = typeof document !== 'undefined' ? React.useLayoutEffect : React.useEffect;
 
 // Fork of `fast-deep-equal` that only does the comparisons we need and compares
 // functions
@@ -20752,7 +20761,7 @@ function roundByDPR(element, value) {
 
 function useLatestRef(value) {
   const ref = React__namespace.useRef(value);
-  index$5(() => {
+  index$6(() => {
     ref.current = value;
   });
   return ref;
@@ -20837,7 +20846,7 @@ function useFloating(options) {
       }
     });
   }, [latestMiddleware, placement, strategy, platformRef]);
-  index$5(() => {
+  index$6(() => {
     if (open === false && dataRef.current.isPositioned) {
       dataRef.current.isPositioned = false;
       setData(data => ({
@@ -20847,13 +20856,13 @@ function useFloating(options) {
     }
   }, [open]);
   const isMountedRef = React__namespace.useRef(false);
-  index$5(() => {
+  index$6(() => {
     isMountedRef.current = true;
     return () => {
       isMountedRef.current = false;
     };
   }, []);
-  index$5(() => {
+  index$6(() => {
     if (referenceEl) referenceRef.current = referenceEl;
     if (floatingEl) floatingRef.current = floatingEl;
     if (referenceEl && floatingEl) {
@@ -21016,7 +21025,7 @@ const OverlayPopper = ({
       ref: refs.setReference
     }
   };
-  const children = isFunction(propChildren) ? propChildren({
+  const children = isFunction$1(propChildren) ? propChildren({
     ...defaultPopperProps
   }, {
     isOpen,
@@ -21139,7 +21148,7 @@ const TextInput = ({
       children: typeof LeadingVisual !== 'string' && reactIsExports.isValidElementType(LeadingVisual) ? /*#__PURE__*/jsxRuntimeExports.jsx(LeadingVisual, {}) : LeadingVisual
     }), /*#__PURE__*/jsxRuntimeExports.jsx(BaseInput$1, {
       ref: e => {
-        isFunction(ref) ? ref(e) : null;
+        isFunction$1(ref) ? ref(e) : null;
         inputRef.current = e;
       },
       type: type,
@@ -21502,7 +21511,7 @@ const SearchSelectInput = ({
           id: id,
           ref: labelInputRef,
           readOnly: true,
-          onChange: noop$2,
+          onChange: noop$3,
           autoComplete: 'off',
           tabIndex: -1,
           onClick: e => {
@@ -21523,7 +21532,7 @@ const SearchSelectInput = ({
         size: 16
       }), /*#__PURE__*/jsxRuntimeExports.jsx(BaseInput, {
         ref: e => {
-          isFunction(ref) ? ref(e) : null;
+          isFunction$1(ref) ? ref(e) : null;
           valueInputRef.current = e;
         },
         type: 'hidden',
@@ -21710,7 +21719,7 @@ const Select = ({
       children: typeof LeadingVisual !== 'string' && reactIsExports.isValidElementType(LeadingVisual) ? /*#__PURE__*/jsxRuntimeExports.jsx(LeadingVisual, {}) : LeadingVisual
     }), /*#__PURE__*/jsxRuntimeExports.jsxs(BaseSelect, {
       ref: e => {
-        isFunction(ref) ? ref(e) : null;
+        isFunction$1(ref) ? ref(e) : null;
         selectRef.current = e;
       },
       placeholder: placeholder,
@@ -21894,187 +21903,1298 @@ var Select$1 = Object.assign( /*#__PURE__*/React.forwardRef(Select), {
   Option: SelectOption
 });
 
-const FormControlCaption = ({
-  children
-}) => {
-  const {
-    id
-  } = React.useContext(FormControlContext);
-  return /*#__PURE__*/jsxRuntimeExports.jsx(Text, {
-    as: 'span',
-    id: id,
-    typography: 'xxs',
-    color: 'text/neutral/subtlest',
-    children: children
-  });
-};
+/**
+ * lodash (Custom Build) <https://lodash.com/>
+ * Build: `lodash modularize exports="npm" -o ./`
+ * Copyright jQuery Foundation and other contributors <https://jquery.org/>
+ * Released under MIT license <https://lodash.com/license>
+ * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
+ * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
+ */
 
-const FormControlErrorMessage = ({
-  children
-}) => {
-  const {
-    id
-  } = React.useContext(FormControlContext);
-  return /*#__PURE__*/jsxRuntimeExports.jsx(StyledText$1, {
-    id: id,
-    typography: 'xxs',
-    color: 'text/danger',
-    children: children
-  });
-};
-const errorMessageKeyframe = styled.keyframes`
-  0% {
-    opacity: 0;
-    transform: translateY(-100%);
+/** Used as references for various `Number` constants. */
+var MAX_SAFE_INTEGER = 9007199254740991;
+
+/** `Object#toString` result references. */
+var argsTag = '[object Arguments]',
+  funcTag = '[object Function]',
+  genTag = '[object GeneratorFunction]',
+  mapTag = '[object Map]',
+  objectTag = '[object Object]',
+  promiseTag = '[object Promise]',
+  setTag = '[object Set]',
+  stringTag = '[object String]',
+  weakMapTag = '[object WeakMap]';
+var dataViewTag = '[object DataView]';
+
+/**
+ * Used to match `RegExp`
+ * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).
+ */
+var reRegExpChar = /[\\^$.*+?()[\]{}|]/g;
+
+/** Used to detect host constructors (Safari). */
+var reIsHostCtor = /^\[object .+?Constructor\]$/;
+
+/** Used to detect unsigned integer values. */
+var reIsUint = /^(?:0|[1-9]\d*)$/;
+
+/** Used to compose unicode character classes. */
+var rsAstralRange = '\\ud800-\\udfff',
+  rsComboMarksRange = '\\u0300-\\u036f\\ufe20-\\ufe23',
+  rsComboSymbolsRange = '\\u20d0-\\u20f0',
+  rsVarRange = '\\ufe0e\\ufe0f';
+
+/** Used to compose unicode capture groups. */
+var rsAstral = '[' + rsAstralRange + ']',
+  rsCombo = '[' + rsComboMarksRange + rsComboSymbolsRange + ']',
+  rsFitz = '\\ud83c[\\udffb-\\udfff]',
+  rsModifier = '(?:' + rsCombo + '|' + rsFitz + ')',
+  rsNonAstral = '[^' + rsAstralRange + ']',
+  rsRegional = '(?:\\ud83c[\\udde6-\\uddff]){2}',
+  rsSurrPair = '[\\ud800-\\udbff][\\udc00-\\udfff]',
+  rsZWJ = '\\u200d';
+
+/** Used to compose unicode regexes. */
+var reOptMod = rsModifier + '?',
+  rsOptVar = '[' + rsVarRange + ']?',
+  rsOptJoin = '(?:' + rsZWJ + '(?:' + [rsNonAstral, rsRegional, rsSurrPair].join('|') + ')' + rsOptVar + reOptMod + ')*',
+  rsSeq = rsOptVar + reOptMod + rsOptJoin,
+  rsSymbol = '(?:' + [rsNonAstral + rsCombo + '?', rsCombo, rsRegional, rsSurrPair, rsAstral].join('|') + ')';
+
+/** Used to match [string symbols](https://mathiasbynens.be/notes/javascript-unicode). */
+var reUnicode = RegExp(rsFitz + '(?=' + rsFitz + ')|' + rsSymbol + rsSeq, 'g');
+
+/** Used to detect strings with [zero-width joiners or code points from the astral planes](http://eev.ee/blog/2015/09/12/dark-corners-of-unicode/). */
+var reHasUnicode = RegExp('[' + rsZWJ + rsAstralRange + rsComboMarksRange + rsComboSymbolsRange + rsVarRange + ']');
+
+/** Detect free variable `global` from Node.js. */
+var freeGlobal$2 = typeof commonjsGlobal == 'object' && commonjsGlobal && commonjsGlobal.Object === Object && commonjsGlobal;
+
+/** Detect free variable `self`. */
+var freeSelf$2 = typeof self == 'object' && self && self.Object === Object && self;
+
+/** Used as a reference to the global object. */
+var root$2 = freeGlobal$2 || freeSelf$2 || Function('return this')();
+
+/**
+ * A specialized version of `_.map` for arrays without support for iteratee
+ * shorthands.
+ *
+ * @private
+ * @param {Array} [array] The array to iterate over.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Array} Returns the new mapped array.
+ */
+function arrayMap(array, iteratee) {
+  var index = -1,
+    length = array ? array.length : 0,
+    result = Array(length);
+  while (++index < length) {
+    result[index] = iteratee(array[index], index, array);
   }
-  100% {
-    opacity: 1;
-    transform: translateY(0);
+  return result;
+}
+
+/**
+ * Converts an ASCII `string` to an array.
+ *
+ * @private
+ * @param {string} string The string to convert.
+ * @returns {Array} Returns the converted array.
+ */
+function asciiToArray(string) {
+  return string.split('');
+}
+
+/**
+ * The base implementation of `_.times` without support for iteratee shorthands
+ * or max array length checks.
+ *
+ * @private
+ * @param {number} n The number of times to invoke `iteratee`.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Array} Returns the array of results.
+ */
+function baseTimes(n, iteratee) {
+  var index = -1,
+    result = Array(n);
+  while (++index < n) {
+    result[index] = iteratee(index);
   }
-`;
-const StyledText$1 = styled__default.default(Text)`
-  animation: 170ms ${errorMessageKeyframe} cubic-bezier(0.44, 0.74, 0.36, 1);
-`;
+  return result;
+}
 
-const FormControlLabel = ({
-  children,
-  visuallyHidden,
-  ...props
-}) => {
-  const {
-    id,
-    disabled,
-    required
-  } = React.useContext(FormControlContext);
-  return /*#__PURE__*/jsxRuntimeExports.jsx(VisuallyHidden, {
-    as: 'label',
-    htmlFor: id,
-    isVisible: !visuallyHidden,
-    children: /*#__PURE__*/jsxRuntimeExports.jsxs(LabelWrapper, {
-      ...props,
-      disabled: disabled,
-      children: [children, required ? /*#__PURE__*/jsxRuntimeExports.jsx(View, {
-        as: 'span',
-        "aria-hidden": "true",
-        children: ' *'
-      }) : null]
-    })
+/**
+ * The base implementation of `_.values` and `_.valuesIn` which creates an
+ * array of `object` property values corresponding to the property names
+ * of `props`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {Array} props The property names to get values for.
+ * @returns {Object} Returns the array of property values.
+ */
+function baseValues(object, props) {
+  return arrayMap(props, function (key) {
+    return object[key];
   });
-};
-const VisuallyHidden = styled__default.default.span`
-  ${({
-  isVisible = false
-}) => {
-  if (isVisible) {
-    return sx;
-  }
-  return `
-      position: absolute;
-      width: 1px;
-      height: 1px;
-      padding: 0;
-      margin: -1px;
-      overflow: hidden;
-      clip: rect(0, 0, 0, 0);
-      white-space: nowrap;
-      border-width: 0;
-    `;
-}}
-`;
-const LabelWrapper = styled__default.default(View)`
-  display: block;
-  align-self: flex-start;
+}
 
-  font-size: ${({
-  theme
-}) => forcePixelValue(theme.fontSizes.xs)};
-  font-weight: ${({
-  theme
-}) => theme.fontWeights.medium};
-  line-height: ${({
-  theme
-}) => theme.lineHeights[2]};
+/**
+ * Gets the value at `key` of `object`.
+ *
+ * @private
+ * @param {Object} [object] The object to query.
+ * @param {string} key The key of the property to get.
+ * @returns {*} Returns the property value.
+ */
+function getValue(object, key) {
+  return object == null ? undefined : object[key];
+}
 
-  color: ${({
-  theme
-}) => theme.colors['text/neutral/subtle']};
+/**
+ * Checks if `string` contains Unicode symbols.
+ *
+ * @private
+ * @param {string} string The string to inspect.
+ * @returns {boolean} Returns `true` if a symbol is found, else `false`.
+ */
+function hasUnicode(string) {
+  return reHasUnicode.test(string);
+}
 
-  cursor: ${({
-  disabled
-}) => disabled ? 'not-allowed' : 'pointer'};
+/**
+ * Checks if `value` is a host object in IE < 9.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a host object, else `false`.
+ */
+function isHostObject(value) {
+  // Many host objects are `Object` objects that can coerce to strings
+  // despite having improperly defined `toString` methods.
+  var result = false;
+  if (value != null && typeof value.toString != 'function') {
+    try {
+      result = !!(value + '');
+    } catch (e) {}
+  }
+  return result;
+}
 
-  ${sx};
-`;
+/**
+ * Converts `iterator` to an array.
+ *
+ * @private
+ * @param {Object} iterator The iterator to convert.
+ * @returns {Array} Returns the converted array.
+ */
+function iteratorToArray(iterator) {
+  var data,
+    result = [];
+  while (!(data = iterator.next()).done) {
+    result.push(data.value);
+  }
+  return result;
+}
 
-const FormControlSuccessMessage = ({
-  children
-}) => {
-  const {
-    id
-  } = React.useContext(FormControlContext);
-  return /*#__PURE__*/jsxRuntimeExports.jsx(StyledText, {
-    id: id,
-    typography: 'xxs',
-    color: 'text/success',
-    children: children
+/**
+ * Converts `map` to its key-value pairs.
+ *
+ * @private
+ * @param {Object} map The map to convert.
+ * @returns {Array} Returns the key-value pairs.
+ */
+function mapToArray(map) {
+  var index = -1,
+    result = Array(map.size);
+  map.forEach(function (value, key) {
+    result[++index] = [key, value];
   });
-};
-const successMessageKeyframe = styled.keyframes`
-  0% {
-    opacity: 0;
-    transform: translateY(-100%);
-  }
-  100% {
-    opacity: 1;
-    transform: translateY(0);
-  }
-`;
-const StyledText = styled__default.default(Text)`
-  animation: 170ms ${successMessageKeyframe} cubic-bezier(0.44, 0.74, 0.36, 1);
-`;
+  return result;
+}
 
-const FormControlContext = /*#__PURE__*/React.createContext({});
-const FormControl = ({
-  children: propChildren,
-  id,
-  disabled,
-  required,
-  additionalInputComponentCandidates = []
-}, ref) => {
-  const [relocatableComponentsObject, restComponents] = useRelocation({
-    children: propChildren,
-    config: {
-      label: FormControlLabel,
-      caption: FormControlCaption,
-      errorMessage: FormControlErrorMessage,
-      successMessage: FormControlSuccessMessage
-    }
+/**
+ * Creates a unary function that invokes `func` with its argument transformed.
+ *
+ * @private
+ * @param {Function} func The function to wrap.
+ * @param {Function} transform The argument transform.
+ * @returns {Function} Returns the new function.
+ */
+function overArg(func, transform) {
+  return function (arg) {
+    return func(transform(arg));
+  };
+}
+
+/**
+ * Converts `set` to an array of its values.
+ *
+ * @private
+ * @param {Object} set The set to convert.
+ * @returns {Array} Returns the values.
+ */
+function setToArray(set) {
+  var index = -1,
+    result = Array(set.size);
+  set.forEach(function (value) {
+    result[++index] = value;
   });
-  const inputComponentCandidates = [TextInput$1, Select$1, SearchSelectInput$1, Checkbox$1, ...additionalInputComponentCandidates];
-  const InputComponent = restComponents.find(component => inputComponentCandidates.some(candidate => /*#__PURE__*/React.isValidElement(component) && component.type === candidate));
-  const isHorizontalLayoutNeeded = /*#__PURE__*/React.isValidElement(InputComponent) && InputComponent.type === Checkbox$1;
-  return /*#__PURE__*/jsxRuntimeExports.jsx(FormControlContext.Provider, {
-    value: {
-      id,
-      disabled,
-      required
-    },
-    children: isHorizontalLayoutNeeded ? /*#__PURE__*/jsxRuntimeExports.jsxs(View, {
-      ref: ref,
-      display: 'flex',
-      sx: {
-        columnGap: 2
-      },
-      children: [/*#__PURE__*/jsxRuntimeExports.jsx(View, {
-        children: /*#__PURE__*/React.cloneElement(InputComponent, {
-          id,
-          disabled,
-          required
-        })
-      }), /*#__PURE__*/jsxRuntimeExports.jsxs(View, {
-        sx: {
-          '& > span': {
-            mt: 0.5
+  return result;
+}
+
+/**
+ * Converts `string` to an array.
+ *
+ * @private
+ * @param {string} string The string to convert.
+ * @returns {Array} Returns the converted array.
+ */
+function stringToArray(string) {
+  return hasUnicode(string) ? unicodeToArray(string) : asciiToArray(string);
+}
+
+/**
+ * Converts a Unicode `string` to an array.
+ *
+ * @private
+ * @param {string} string The string to convert.
+ * @returns {Array} Returns the converted array.
+ */
+function unicodeToArray(string) {
+  return string.match(reUnicode) || [];
+}
+
+/** Used for built-in method references. */
+var funcProto = Function.prototype,
+  objectProto$2 = Object.prototype;
+
+/** Used to detect overreaching core-js shims. */
+var coreJsData = root$2['__core-js_shared__'];
+
+/** Used to detect methods masquerading as native. */
+var maskSrcKey = function () {
+  var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || '');
+  return uid ? 'Symbol(src)_1.' + uid : '';
+}();
+
+/** Used to resolve the decompiled source of functions. */
+var funcToString = funcProto.toString;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto$2.hasOwnProperty;
+
+/**
+ * Used to resolve the
+ * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
+ * of values.
+ */
+var objectToString$2 = objectProto$2.toString;
+
+/** Used to detect if a method is native. */
+var reIsNative = RegExp('^' + funcToString.call(hasOwnProperty).replace(reRegExpChar, '\\$&').replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, '$1.*?') + '$');
+
+/** Built-in value references. */
+var Symbol$1 = root$2.Symbol,
+  iteratorSymbol = Symbol$1 ? Symbol$1.iterator : undefined,
+  propertyIsEnumerable = objectProto$2.propertyIsEnumerable;
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeKeys = overArg(Object.keys, Object);
+
+/* Built-in method references that are verified to be native. */
+var DataView = getNative(root$2, 'DataView'),
+  Map$1 = getNative(root$2, 'Map'),
+  Promise$1 = getNative(root$2, 'Promise'),
+  Set$1 = getNative(root$2, 'Set'),
+  WeakMap$1 = getNative(root$2, 'WeakMap');
+
+/** Used to detect maps, sets, and weakmaps. */
+var dataViewCtorString = toSource(DataView),
+  mapCtorString = toSource(Map$1),
+  promiseCtorString = toSource(Promise$1),
+  setCtorString = toSource(Set$1),
+  weakMapCtorString = toSource(WeakMap$1);
+
+/**
+ * Creates an array of the enumerable property names of the array-like `value`.
+ *
+ * @private
+ * @param {*} value The value to query.
+ * @param {boolean} inherited Specify returning inherited property names.
+ * @returns {Array} Returns the array of property names.
+ */
+function arrayLikeKeys(value, inherited) {
+  // Safari 8.1 makes `arguments.callee` enumerable in strict mode.
+  // Safari 9 makes `arguments.length` enumerable in strict mode.
+  var result = isArray(value) || isArguments(value) ? baseTimes(value.length, String) : [];
+  var length = result.length,
+    skipIndexes = !!length;
+  for (var key in value) {
+    if ((inherited || hasOwnProperty.call(value, key)) && !(skipIndexes && (key == 'length' || isIndex(key, length)))) {
+      result.push(key);
+    }
+  }
+  return result;
+}
+
+/**
+ * The base implementation of `getTag`.
+ *
+ * @private
+ * @param {*} value The value to query.
+ * @returns {string} Returns the `toStringTag`.
+ */
+function baseGetTag(value) {
+  return objectToString$2.call(value);
+}
+
+/**
+ * The base implementation of `_.isNative` without bad shim checks.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a native function,
+ *  else `false`.
+ */
+function baseIsNative(value) {
+  if (!isObject$2(value) || isMasked(value)) {
+    return false;
+  }
+  var pattern = isFunction(value) || isHostObject(value) ? reIsNative : reIsHostCtor;
+  return pattern.test(toSource(value));
+}
+
+/**
+ * The base implementation of `_.keys` which doesn't treat sparse arrays as dense.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of property names.
+ */
+function baseKeys(object) {
+  if (!isPrototype(object)) {
+    return nativeKeys(object);
+  }
+  var result = [];
+  for (var key in Object(object)) {
+    if (hasOwnProperty.call(object, key) && key != 'constructor') {
+      result.push(key);
+    }
+  }
+  return result;
+}
+
+/**
+ * Copies the values of `source` to `array`.
+ *
+ * @private
+ * @param {Array} source The array to copy values from.
+ * @param {Array} [array=[]] The array to copy values to.
+ * @returns {Array} Returns `array`.
+ */
+function copyArray(source, array) {
+  var index = -1,
+    length = source.length;
+  array || (array = Array(length));
+  while (++index < length) {
+    array[index] = source[index];
+  }
+  return array;
+}
+
+/**
+ * Gets the native function at `key` of `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {string} key The key of the method to get.
+ * @returns {*} Returns the function if it's native, else `undefined`.
+ */
+function getNative(object, key) {
+  var value = getValue(object, key);
+  return baseIsNative(value) ? value : undefined;
+}
+
+/**
+ * Gets the `toStringTag` of `value`.
+ *
+ * @private
+ * @param {*} value The value to query.
+ * @returns {string} Returns the `toStringTag`.
+ */
+var getTag = baseGetTag;
+
+// Fallback for data views, maps, sets, and weak maps in IE 11,
+// for data views in Edge < 14, and promises in Node.js.
+if (DataView && getTag(new DataView(new ArrayBuffer(1))) != dataViewTag || Map$1 && getTag(new Map$1()) != mapTag || Promise$1 && getTag(Promise$1.resolve()) != promiseTag || Set$1 && getTag(new Set$1()) != setTag || WeakMap$1 && getTag(new WeakMap$1()) != weakMapTag) {
+  getTag = function (value) {
+    var result = objectToString$2.call(value),
+      Ctor = result == objectTag ? value.constructor : undefined,
+      ctorString = Ctor ? toSource(Ctor) : undefined;
+    if (ctorString) {
+      switch (ctorString) {
+        case dataViewCtorString:
+          return dataViewTag;
+        case mapCtorString:
+          return mapTag;
+        case promiseCtorString:
+          return promiseTag;
+        case setCtorString:
+          return setTag;
+        case weakMapCtorString:
+          return weakMapTag;
+      }
+    }
+    return result;
+  };
+}
+
+/**
+ * Checks if `value` is a valid array-like index.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.
+ * @returns {boolean} Returns `true` if `value` is a valid index, else `false`.
+ */
+function isIndex(value, length) {
+  length = length == null ? MAX_SAFE_INTEGER : length;
+  return !!length && (typeof value == 'number' || reIsUint.test(value)) && value > -1 && value % 1 == 0 && value < length;
+}
+
+/**
+ * Checks if `func` has its source masked.
+ *
+ * @private
+ * @param {Function} func The function to check.
+ * @returns {boolean} Returns `true` if `func` is masked, else `false`.
+ */
+function isMasked(func) {
+  return !!maskSrcKey && maskSrcKey in func;
+}
+
+/**
+ * Checks if `value` is likely a prototype object.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a prototype, else `false`.
+ */
+function isPrototype(value) {
+  var Ctor = value && value.constructor,
+    proto = typeof Ctor == 'function' && Ctor.prototype || objectProto$2;
+  return value === proto;
+}
+
+/**
+ * Converts `func` to its source code.
+ *
+ * @private
+ * @param {Function} func The function to process.
+ * @returns {string} Returns the source code.
+ */
+function toSource(func) {
+  if (func != null) {
+    try {
+      return funcToString.call(func);
+    } catch (e) {}
+    try {
+      return func + '';
+    } catch (e) {}
+  }
+  return '';
+}
+
+/**
+ * Checks if `value` is likely an `arguments` object.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an `arguments` object,
+ *  else `false`.
+ * @example
+ *
+ * _.isArguments(function() { return arguments; }());
+ * // => true
+ *
+ * _.isArguments([1, 2, 3]);
+ * // => false
+ */
+function isArguments(value) {
+  // Safari 8.1 makes `arguments.callee` enumerable in strict mode.
+  return isArrayLikeObject(value) && hasOwnProperty.call(value, 'callee') && (!propertyIsEnumerable.call(value, 'callee') || objectToString$2.call(value) == argsTag);
+}
+
+/**
+ * Checks if `value` is classified as an `Array` object.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an array, else `false`.
+ * @example
+ *
+ * _.isArray([1, 2, 3]);
+ * // => true
+ *
+ * _.isArray(document.body.children);
+ * // => false
+ *
+ * _.isArray('abc');
+ * // => false
+ *
+ * _.isArray(_.noop);
+ * // => false
+ */
+var isArray = Array.isArray;
+
+/**
+ * Checks if `value` is array-like. A value is considered array-like if it's
+ * not a function and has a `value.length` that's an integer greater than or
+ * equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is array-like, else `false`.
+ * @example
+ *
+ * _.isArrayLike([1, 2, 3]);
+ * // => true
+ *
+ * _.isArrayLike(document.body.children);
+ * // => true
+ *
+ * _.isArrayLike('abc');
+ * // => true
+ *
+ * _.isArrayLike(_.noop);
+ * // => false
+ */
+function isArrayLike(value) {
+  return value != null && isLength(value.length) && !isFunction(value);
+}
+
+/**
+ * This method is like `_.isArrayLike` except that it also checks if `value`
+ * is an object.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an array-like object,
+ *  else `false`.
+ * @example
+ *
+ * _.isArrayLikeObject([1, 2, 3]);
+ * // => true
+ *
+ * _.isArrayLikeObject(document.body.children);
+ * // => true
+ *
+ * _.isArrayLikeObject('abc');
+ * // => false
+ *
+ * _.isArrayLikeObject(_.noop);
+ * // => false
+ */
+function isArrayLikeObject(value) {
+  return isObjectLike$2(value) && isArrayLike(value);
+}
+
+/**
+ * Checks if `value` is classified as a `Function` object.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a function, else `false`.
+ * @example
+ *
+ * _.isFunction(_);
+ * // => true
+ *
+ * _.isFunction(/abc/);
+ * // => false
+ */
+function isFunction(value) {
+  // The use of `Object#toString` avoids issues with the `typeof` operator
+  // in Safari 8-9 which returns 'object' for typed array and other constructors.
+  var tag = isObject$2(value) ? objectToString$2.call(value) : '';
+  return tag == funcTag || tag == genTag;
+}
+
+/**
+ * Checks if `value` is a valid array-like length.
+ *
+ * **Note:** This method is loosely based on
+ * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a valid length, else `false`.
+ * @example
+ *
+ * _.isLength(3);
+ * // => true
+ *
+ * _.isLength(Number.MIN_VALUE);
+ * // => false
+ *
+ * _.isLength(Infinity);
+ * // => false
+ *
+ * _.isLength('3');
+ * // => false
+ */
+function isLength(value) {
+  return typeof value == 'number' && value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
+}
+
+/**
+ * Checks if `value` is the
+ * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
+ * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an object, else `false`.
+ * @example
+ *
+ * _.isObject({});
+ * // => true
+ *
+ * _.isObject([1, 2, 3]);
+ * // => true
+ *
+ * _.isObject(_.noop);
+ * // => true
+ *
+ * _.isObject(null);
+ * // => false
+ */
+function isObject$2(value) {
+  var type = typeof value;
+  return !!value && (type == 'object' || type == 'function');
+}
+
+/**
+ * Checks if `value` is object-like. A value is object-like if it's not `null`
+ * and has a `typeof` result of "object".
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
+ * @example
+ *
+ * _.isObjectLike({});
+ * // => true
+ *
+ * _.isObjectLike([1, 2, 3]);
+ * // => true
+ *
+ * _.isObjectLike(_.noop);
+ * // => false
+ *
+ * _.isObjectLike(null);
+ * // => false
+ */
+function isObjectLike$2(value) {
+  return !!value && typeof value == 'object';
+}
+
+/**
+ * Checks if `value` is classified as a `String` primitive or object.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a string, else `false`.
+ * @example
+ *
+ * _.isString('abc');
+ * // => true
+ *
+ * _.isString(1);
+ * // => false
+ */
+function isString(value) {
+  return typeof value == 'string' || !isArray(value) && isObjectLike$2(value) && objectToString$2.call(value) == stringTag;
+}
+
+/**
+ * Converts `value` to an array.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Lang
+ * @param {*} value The value to convert.
+ * @returns {Array} Returns the converted array.
+ * @example
+ *
+ * _.toArray({ 'a': 1, 'b': 2 });
+ * // => [1, 2]
+ *
+ * _.toArray('abc');
+ * // => ['a', 'b', 'c']
+ *
+ * _.toArray(1);
+ * // => []
+ *
+ * _.toArray(null);
+ * // => []
+ */
+function toArray(value) {
+  if (!value) {
+    return [];
+  }
+  if (isArrayLike(value)) {
+    return isString(value) ? stringToArray(value) : copyArray(value);
+  }
+  if (iteratorSymbol && value[iteratorSymbol]) {
+    return iteratorToArray(value[iteratorSymbol]());
+  }
+  var tag = getTag(value),
+    func = tag == mapTag ? mapToArray : tag == setTag ? setToArray : values;
+  return func(value);
+}
+
+/**
+ * Creates an array of the own enumerable property names of `object`.
+ *
+ * **Note:** Non-object values are coerced to objects. See the
+ * [ES spec](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)
+ * for more details.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Object
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of property names.
+ * @example
+ *
+ * function Foo() {
+ *   this.a = 1;
+ *   this.b = 2;
+ * }
+ *
+ * Foo.prototype.c = 3;
+ *
+ * _.keys(new Foo);
+ * // => ['a', 'b'] (iteration order is not guaranteed)
+ *
+ * _.keys('hi');
+ * // => ['0', '1']
+ */
+function keys(object) {
+  return isArrayLike(object) ? arrayLikeKeys(object) : baseKeys(object);
+}
+
+/**
+ * Creates an array of the own enumerable string keyed property values of `object`.
+ *
+ * **Note:** Non-object values are coerced to objects.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Object
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of property values.
+ * @example
+ *
+ * function Foo() {
+ *   this.a = 1;
+ *   this.b = 2;
+ * }
+ *
+ * Foo.prototype.c = 3;
+ *
+ * _.values(new Foo);
+ * // => [1, 2] (iteration order is not guaranteed)
+ *
+ * _.values('hi');
+ * // => ['h', 'i']
+ */
+function values(object) {
+  return object ? baseValues(object, keys(object)) : [];
+}
+var lodash_toarray = toArray;
+var toArray$1 = /*@__PURE__*/getDefaultExportFromCjs(lodash_toarray);
+
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+
+var updateRef = function updateRef(ref, value) {
+  if (typeof ref === 'function') {
+    ref(value);
+    return;
+  }
+  ref.current = value;
+};
+var useComposedRef = function useComposedRef(libRef, userRef) {
+  var prevUserRef = React.useRef();
+  return React.useCallback(function (instance) {
+    libRef.current = instance;
+    if (prevUserRef.current) {
+      updateRef(prevUserRef.current, null);
+    }
+    prevUserRef.current = userRef;
+    if (!userRef) {
+      return;
+    }
+    updateRef(userRef, instance);
+  }, [userRef]);
+};
+
+var noop = function noop() {};
+var _excluded = ["cacheMeasurements", "maxRows", "minRows", "onChange", "onHeightChange"];
+var TextareaAutosize = function TextareaAutosize(_ref, userRef) {
+  _ref.cacheMeasurements;
+  _ref.maxRows;
+  _ref.minRows;
+  var _ref$onChange = _ref.onChange,
+    onChange = _ref$onChange === void 0 ? noop : _ref$onChange;
+  _ref.onHeightChange;
+  var props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  props.value !== undefined;
+  var libRef = React__namespace.useRef(null);
+  var ref = useComposedRef(libRef, userRef);
+  React__namespace.useRef(0);
+  React__namespace.useRef();
+  return /*#__PURE__*/React__namespace.createElement("textarea", _extends({}, props, {
+    onChange: onChange,
+    ref: ref
+  }));
+};
+var index$5 = /* #__PURE__ */React__namespace.forwardRef(TextareaAutosize);
+
+const Textarea = /*#__PURE__*/React.forwardRef(({
+  validationStatus,
+  disabled,
+  ...props
+}, ref) => {
+  const inputRef = useProvidedOrCreatedRef(ref);
+  const focusInput = () => {
+    inputRef.current?.focus();
+  };
+  const getTextareaLength = value => {
+    return toArray$1(value).length;
+  };
+  const [count, setCount] = React.useState(0);
+  const handleChange = e => {
+    setCount(getTextareaLength(e.target.value));
+    props.onChange?.(e);
+  };
+  React.useEffect(() => {
+    if (inputRef.current) {
+      setCount(getTextareaLength(inputRef.current.value));
+    }
+  }, [ref]);
+  return /*#__PURE__*/jsxRuntimeExports.jsxs(TextareaWrapper, {
+    disabled: disabled,
+    onClick: focusInput,
+    validationStatus: validationStatus,
+    children: [/*#__PURE__*/jsxRuntimeExports.jsx(index$5, {
+      ...props,
+      ref: e => {
+        isFunction$1(ref) ? ref(e) : null;
+        inputRef.current = e;
+      },
+      disabled: disabled,
+      minRows: 7,
+      onChange: handleChange
+    }), /*#__PURE__*/jsxRuntimeExports.jsxs(TextareaCount, {
+      children: [commaizeNumber(count), "\uC790"]
+    })]
+  });
+});
+const TextareaWrapper = styled__default.default.div`
+  position: relative;
+  width: ${forcePixelValue('100%')};
+  border-width: ${forcePixelValue(1)};
+  border-style: solid;
+  border-radius: ${({
+  theme
+}) => forcePixelValue(theme.radii.xs)};
+  border-color: ${({
+  theme
+}) => theme.colors['border/input']};
+  background-color: ${({
+  theme
+}) => theme.colors['bg/input']};
+  cursor: text;
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+
+  font-size: ${({
+  theme
+}) => forcePixelValue(theme.fontSizes.xs)};
+  font-weight: ${({
+  theme
+}) => theme.fontWeights.medium};
+  line-height: ${({
+  theme
+}) => theme.lineHeights[2]};
+  color: ${({
+  theme
+}) => theme.colors['text/neutral']};
+  textarea::placeholder {
+    color: ${({
+  theme
+}) => theme.colors['text/neutral/subtlest']};
+  }
+  textarea {
+    font-size: inherit;
+    font-weight: inherit;
+    line-height: inherit;
+    font-family: inherit;
+    border-radius: inherit;
+    color: inherit;
+    transition: inherit;
+
+    border: 0;
+    background-color: transparent;
+    width: 100%;
+    &:focus {
+      outline: 0;
+    }
+    resize: none;
+
+    padding-top: ${({
+  theme
+}) => forcePixelValue(theme.space['3'])};
+    padding-right: ${({
+  theme
+}) => forcePixelValue(theme.space['4'])};
+    padding-bottom: ${({
+  theme
+}) => forcePixelValue(theme.space['3'])};
+    padding-left: ${({
+  theme
+}) => forcePixelValue(theme.space['4'])};
+  }
+
+  &:after {
+    content: '';
+    position: absolute;
+    top: ${forcePixelValue(-1)};
+    right: ${forcePixelValue(-1)};
+    bottom: ${forcePixelValue(-1)};
+    left: ${forcePixelValue(-1)};
+
+    border: ${forcePixelValue(2)} solid transparent;
+    border-radius: ${({
+  theme
+}) => forcePixelValue(theme.radii.xs)};
+    pointer-events: none;
+  }
+
+  ${props => props.validationStatus !== 'error' && !props.disabled && styled.css`
+      &:hover:not(:focus-within) {
+        &:after {
+          border-color: ${({
+  theme
+}) => theme.colors['border/hovered']};
+        }
+      }
+    `}
+
+  ${props => props.validationStatus === 'error' && styled.css`
+      &:after {
+        border-color: ${({
+  theme
+}) => theme.colors['border/danger']};
+      }
+    `}
+
+  ${props => props.validationStatus !== 'error' && styled.css`
+      &:focus-within {
+        &:after {
+          border-color: ${({
+  theme
+}) => theme.colors['border/focused']};
+        }
+      }
+    `}
+
+  ${props => props.disabled && styled.css`
+      border-color: ${props.theme.colors['border/input']};
+      background-color: ${props.theme.colors['bg/disabled']};
+      color: ${props.theme.colors['text/disabled']};
+
+      textarea::placeholder {
+        color: ${props.theme.colors['text/disabled']};
+      }
+
+      &,
+      textarea {
+        cursor: not-allowed;
+      }
+    `};
+`;
+const TextareaCount = styled__default.default.div`
+  width: 100%;
+
+  padding-right: ${({
+  theme
+}) => forcePixelValue(theme.space[4])};
+  padding-bottom: ${({
+  theme
+}) => forcePixelValue(theme.space[3])};
+  padding-left: ${({
+  theme
+}) => forcePixelValue(theme.space[4])};
+
+  font-size: ${({
+  theme
+}) => forcePixelValue(theme.fontSizes.xxs)};
+  font-weight: ${({
+  theme
+}) => forcePixelValue(theme.fontWeights.medium)};
+  line-height: ${({
+  theme
+}) => theme.lineHeights[2]};
+  color: ${({
+  theme
+}) => theme.colors['text/neutral/subtlest']};
+  text-align: end;
+`;
+
+const FormControlCaption = ({
+  children
+}) => {
+  const {
+    id
+  } = React.useContext(FormControlContext);
+  return /*#__PURE__*/jsxRuntimeExports.jsx(Text, {
+    as: 'span',
+    id: id,
+    typography: 'xxs',
+    color: 'text/neutral/subtlest',
+    children: children
+  });
+};
+
+const FormControlErrorMessage = ({
+  children
+}) => {
+  const {
+    id
+  } = React.useContext(FormControlContext);
+  return /*#__PURE__*/jsxRuntimeExports.jsx(StyledText$1, {
+    id: id,
+    typography: 'xxs',
+    color: 'text/danger',
+    children: children
+  });
+};
+const errorMessageKeyframe = styled.keyframes`
+  0% {
+    opacity: 0;
+    transform: translateY(-100%);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+`;
+const StyledText$1 = styled__default.default(Text)`
+  animation: 170ms ${errorMessageKeyframe} cubic-bezier(0.44, 0.74, 0.36, 1);
+`;
+
+const FormControlLabel = ({
+  children,
+  visuallyHidden,
+  ...props
+}) => {
+  const {
+    id,
+    disabled,
+    required
+  } = React.useContext(FormControlContext);
+  return /*#__PURE__*/jsxRuntimeExports.jsx(VisuallyHidden, {
+    as: 'label',
+    htmlFor: id,
+    isVisible: !visuallyHidden,
+    children: /*#__PURE__*/jsxRuntimeExports.jsxs(LabelWrapper, {
+      ...props,
+      disabled: disabled,
+      children: [children, required ? /*#__PURE__*/jsxRuntimeExports.jsx(View, {
+        as: 'span',
+        "aria-hidden": "true",
+        children: ' *'
+      }) : null]
+    })
+  });
+};
+const VisuallyHidden = styled__default.default.span`
+  ${({
+  isVisible = false
+}) => {
+  if (isVisible) {
+    return sx;
+  }
+  return `
+      position: absolute;
+      width: 1px;
+      height: 1px;
+      padding: 0;
+      margin: -1px;
+      overflow: hidden;
+      clip: rect(0, 0, 0, 0);
+      white-space: nowrap;
+      border-width: 0;
+    `;
+}}
+`;
+const LabelWrapper = styled__default.default(View)`
+  display: block;
+  align-self: flex-start;
+
+  font-size: ${({
+  theme
+}) => forcePixelValue(theme.fontSizes.xs)};
+  font-weight: ${({
+  theme
+}) => theme.fontWeights.medium};
+  line-height: ${({
+  theme
+}) => theme.lineHeights[2]};
+
+  color: ${({
+  theme
+}) => theme.colors['text/neutral/subtle']};
+
+  cursor: ${({
+  disabled
+}) => disabled ? 'not-allowed' : 'pointer'};
+
+  ${sx};
+`;
+
+const FormControlSuccessMessage = ({
+  children
+}) => {
+  const {
+    id
+  } = React.useContext(FormControlContext);
+  return /*#__PURE__*/jsxRuntimeExports.jsx(StyledText, {
+    id: id,
+    typography: 'xxs',
+    color: 'text/success',
+    children: children
+  });
+};
+const successMessageKeyframe = styled.keyframes`
+  0% {
+    opacity: 0;
+    transform: translateY(-100%);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+`;
+const StyledText = styled__default.default(Text)`
+  animation: 170ms ${successMessageKeyframe} cubic-bezier(0.44, 0.74, 0.36, 1);
+`;
+
+const FormControlContext = /*#__PURE__*/React.createContext({});
+const FormControl = ({
+  children: propChildren,
+  id,
+  disabled,
+  required,
+  additionalInputComponentCandidates = []
+}, ref) => {
+  const [relocatableComponentsObject, restComponents] = useRelocation({
+    children: propChildren,
+    config: {
+      label: FormControlLabel,
+      caption: FormControlCaption,
+      errorMessage: FormControlErrorMessage,
+      successMessage: FormControlSuccessMessage
+    }
+  });
+  const inputComponentCandidates = [TextInput$1, Textarea, Select$1, SearchSelectInput$1, Checkbox$1, ...additionalInputComponentCandidates];
+  const InputComponent = restComponents.find(component => inputComponentCandidates.some(candidate => /*#__PURE__*/React.isValidElement(component) && component.type === candidate));
+  const isHorizontalLayoutNeeded = /*#__PURE__*/React.isValidElement(InputComponent) && InputComponent.type === Checkbox$1;
+  return /*#__PURE__*/jsxRuntimeExports.jsx(FormControlContext.Provider, {
+    value: {
+      id,
+      disabled,
+      required
+    },
+    children: isHorizontalLayoutNeeded ? /*#__PURE__*/jsxRuntimeExports.jsxs(View, {
+      ref: ref,
+      display: 'flex',
+      sx: {
+        columnGap: 2
+      },
+      children: [/*#__PURE__*/jsxRuntimeExports.jsx(View, {
+        children: /*#__PURE__*/React.cloneElement(InputComponent, {
+          id,
+          disabled,
+          required
+        })
+      }), /*#__PURE__*/jsxRuntimeExports.jsxs(View, {
+        sx: {
+          '& > span': {
+            mt: 0.5
           }
         },
         children: [relocatableComponentsObject.label, relocatableComponentsObject.caption, relocatableComponentsObject.errorMessage, relocatableComponentsObject.successMessage]
@@ -22221,9 +23341,9 @@ const Pagination = ({
   edgePageCount = 1,
   type = 'default',
   sx,
-  onPageClick = noop$2,
-  onPreviousClick = noop$2,
-  onNextClick = noop$2,
+  onPageClick = noop$3,
+  onPreviousClick = noop$3,
+  onNextClick = noop$3,
   renderPage = (page, i) => /*#__PURE__*/jsxRuntimeExports.jsx(PaginationPage, {
     type: 'button',
     onClick: () => onPageClick(page, i),
@@ -23870,156 +24990,6 @@ var index$1 = Object.assign(Tab, {
   Item: TabItem
 });
 
-const Textarea = /*#__PURE__*/React.forwardRef(({
-  disabled,
-  ...props
-}, ref) => {
-  const inputRef = useProvidedOrCreatedRef(ref);
-  const focusInput = () => {
-    inputRef.current?.focus();
-  };
-  return /*#__PURE__*/jsxRuntimeExports.jsx(TextareaWrapper, {
-    disabled: disabled,
-    onClick: focusInput,
-    children: /*#__PURE__*/jsxRuntimeExports.jsx(BaseTextarea, {
-      ref: e => {
-        isFunction(ref) ? ref(e) : null;
-        inputRef.current = e;
-      },
-      disabled: disabled,
-      ...props
-    })
-  });
-});
-const TextareaWrapper = styled__default.default.div`
-  position: relative;
-  width: ${forcePixelValue('100%')};
-  border-width: ${forcePixelValue(1)};
-  border-style: solid;
-  border-radius: ${({
-  theme
-}) => forcePixelValue(theme.radii.xs)};
-  border-color: ${({
-  theme
-}) => theme.colors['border/input']};
-  background-color: ${({
-  theme
-}) => theme.colors['bg/input']};
-  cursor: text;
-  display: inline-flex;
-  align-items: center;
-
-  padding-top: ${({
-  theme
-}) => forcePixelValue(theme.space['3'])};
-  padding-right: ${({
-  theme
-}) => forcePixelValue(theme.space['4'])};
-  padding-bottom: ${({
-  theme
-}) => forcePixelValue(theme.space['3'])};
-  padding-left: ${({
-  theme
-}) => forcePixelValue(theme.space['4'])};
-
-  font-size: ${({
-  theme
-}) => forcePixelValue(theme.fontSizes.xs)};
-  font-weight: ${({
-  theme
-}) => theme.fontWeights.medium};
-  line-height: ${({
-  theme
-}) => theme.lineHeights[2]};
-  color: ${({
-  theme
-}) => theme.colors['text/neutral']};
-  input::placeholder {
-    color: ${({
-  theme
-}) => theme.colors['text/neutral/subtlest']};
-  }
-
-  height: 74px;
-
-  &:after {
-    content: '';
-    position: absolute;
-    top: ${forcePixelValue(-1)};
-    right: ${forcePixelValue(-1)};
-    bottom: ${forcePixelValue(-1)};
-    left: ${forcePixelValue(-1)};
-
-    border: ${forcePixelValue(2)} solid transparent;
-    border-radius: ${({
-  theme
-}) => forcePixelValue(theme.radii.xs)};
-    pointer-events: none;
-  }
-
-  ${props => props.validationStatus !== 'error' && !props.disabled && styled.css`
-      &:hover:not(:focus-within) {
-        &:after {
-          border-color: ${({
-  theme
-}) => theme.colors['border/hovered']};
-        }
-      }
-    `}
-
-  ${props => props.validationStatus === 'error' && styled.css`
-      &:after {
-        border-color: ${({
-  theme
-}) => theme.colors['border/danger']};
-      }
-    `}
-
-  ${props => props.validationStatus !== 'error' && styled.css`
-      &:focus-within {
-        &:after {
-          border-color: ${({
-  theme
-}) => theme.colors['border/focused']};
-        }
-      }
-    `}
-
-  ${props => props.disabled && styled.css`
-      border-color: ${props.theme.colors['border/input']};
-      background-color: ${props.theme.colors['bg/disabled']};
-      color: ${props.theme.colors['text/disabled']};
-
-      textarea::placeholder {
-        color: ${props.theme.colors['text/disabled']};
-      }
-
-      &,
-      textarea {
-        cursor: not-allowed;
-      }
-    `};
-`;
-const UnstyledTextarea = styled__default.default.textarea`
-  font-size: inherit;
-  font-weight: inherit;
-  line-height: inherit;
-  font-family: inherit;
-  border-radius: inherit;
-  color: inherit;
-  transition: inherit;
-
-  border: 0;
-  background-color: transparent;
-  width: 100%;
-  &:focus {
-    outline: 0;
-  }
-`;
-const BaseTextarea = styled__default.default(UnstyledTextarea)`
-  resize: none;
-`;
-
 const theme = {
   breakpoints,
   space,
@@ -24449,18 +25419,18 @@ const useOutsideClick = ({
   });
 };
 
-exports.ActionList = index$a;
+exports.ActionList = index$b;
 exports.AnimatePresence = AnimatePresence;
-exports.Avatar = index$9;
+exports.Avatar = index$a;
 exports.BadgeAttacher = BadgeAttacher;
-exports.Breadcrumbs = index$8;
+exports.Breadcrumbs = index$9;
 exports.Button = Button;
 exports.Checkbox = Checkbox$1;
 exports.Chip = Chip;
 exports.CounterBadge = CounterBadge;
-exports.Datagrid = index$7;
+exports.Datagrid = index$8;
 exports.DescriptionList = DescriptionList;
-exports.Dialog = index$6;
+exports.Dialog = index$7;
 exports.EmptyState = EmptyState;
 exports.EnigmaUI = index;
 exports.Flash = Flash;