@thairath/tr-design-system 0.2.6 → 0.2.8

package/dist/index.cjs

@@ -80,13 +80,13 @@ function _toPropertyKey(t) {
   return "symbol" == typeof i ? i : i + "";
 }
 
-var _excluded$1v = ["width", "height"];
+var _excluded$1u = ["width", "height"];
 var HamburgerIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1v);
+    props = _objectWithoutProperties(_ref, _excluded$1u);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -114,13 +114,13 @@ var HamburgerIcon = _ref => {
   })));
 };
 
-var _excluded$1u = ["width", "height"];
+var _excluded$1t = ["width", "height"];
 var SearchIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1u);
+    props = _objectWithoutProperties(_ref, _excluded$1t);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -148,13 +148,13 @@ var SearchIcon = _ref => {
   })));
 };
 
-var _excluded$1t = ["width", "height"];
+var _excluded$1s = ["width", "height"];
 var UserIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1t);
+    props = _objectWithoutProperties(_ref, _excluded$1s);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -182,13 +182,13 @@ var UserIcon = _ref => {
   })));
 };
 
-var _excluded$1s = ["width", "height"];
+var _excluded$1r = ["width", "height"];
 var FacebookIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1s);
+    props = _objectWithoutProperties(_ref, _excluded$1r);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -204,13 +204,13 @@ var FacebookIcon = _ref => {
   }));
 };
 
-var _excluded$1r = ["width", "height"];
+var _excluded$1q = ["width", "height"];
 var SocilaXIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1r);
+    props = _objectWithoutProperties(_ref, _excluded$1q);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -222,13 +222,13 @@ var SocilaXIcon = _ref => {
   }));
 };
 
-var _excluded$1q = ["width", "height"];
+var _excluded$1p = ["width", "height"];
 var InstagramIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1q);
+    props = _objectWithoutProperties(_ref, _excluded$1p);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -252,13 +252,13 @@ var InstagramIcon = _ref => {
   }));
 };
 
-var _excluded$1p = ["width", "height"];
+var _excluded$1o = ["width", "height"];
 var YoutubeIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1p);
+    props = _objectWithoutProperties(_ref, _excluded$1o);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -276,13 +276,13 @@ var YoutubeIcon = _ref => {
   }));
 };
 
-var _excluded$1o = ["width", "height"];
+var _excluded$1n = ["width", "height"];
 var TiktokIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1o);
+    props = _objectWithoutProperties(_ref, _excluded$1n);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -294,13 +294,13 @@ var TiktokIcon = _ref => {
   }));
 };
 
-var _excluded$1n = ["width", "height"];
+var _excluded$1m = ["width", "height"];
 var MessagerIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1n);
+    props = _objectWithoutProperties(_ref, _excluded$1m);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -318,13 +318,13 @@ var MessagerIcon = _ref => {
   }));
 };
 
-var _excluded$1m = ["width", "height"];
+var _excluded$1l = ["width", "height"];
 var LineAppIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1m);
+    props = _objectWithoutProperties(_ref, _excluded$1l);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -342,13 +342,13 @@ var LineAppIcon = _ref => {
   }));
 };
 
-var _excluded$1l = ["width", "height"];
+var _excluded$1k = ["width", "height"];
 var GoogleIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1l);
+    props = _objectWithoutProperties(_ref, _excluded$1k);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -364,13 +364,13 @@ var GoogleIcon = _ref => {
   }));
 };
 
-var _excluded$1k = ["width", "height"];
+var _excluded$1j = ["width", "height"];
 var PublicIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1k);
+    props = _objectWithoutProperties(_ref, _excluded$1j);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -398,13 +398,13 @@ var PublicIcon = _ref => {
   })));
 };
 
-var _excluded$1j = ["width", "height"];
+var _excluded$1i = ["width", "height"];
 var FeedIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1j);
+    props = _objectWithoutProperties(_ref, _excluded$1i);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -432,13 +432,13 @@ var FeedIcon = _ref => {
   })));
 };
 
-var _excluded$1i = ["width", "height"];
+var _excluded$1h = ["width", "height"];
 var DesktopIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1i);
+    props = _objectWithoutProperties(_ref, _excluded$1h);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -466,13 +466,13 @@ var DesktopIcon = _ref => {
   })));
 };
 
-var _excluded$1h = ["width", "height"];
+var _excluded$1g = ["width", "height"];
 var DesktopFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1h);
+    props = _objectWithoutProperties(_ref, _excluded$1g);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -500,13 +500,13 @@ var DesktopFilledIcon = _ref => {
   })));
 };
 
-var _excluded$1g = ["width", "height"];
+var _excluded$1f = ["width", "height"];
 var TROAppIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1g);
+    props = _objectWithoutProperties(_ref, _excluded$1f);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -538,13 +538,13 @@ var TROAppIcon = _ref => {
   })));
 };
 
-var _excluded$1f = ["width", "height"];
+var _excluded$1e = ["width", "height"];
 var UserFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1f);
+    props = _objectWithoutProperties(_ref, _excluded$1e);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -572,13 +572,13 @@ var UserFilledIcon = _ref => {
   })));
 };
 
-var _excluded$1e = ["width", "height"];
+var _excluded$1d = ["width", "height"];
 var HomeIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1e);
+    props = _objectWithoutProperties(_ref, _excluded$1d);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -606,13 +606,13 @@ var HomeIcon = _ref => {
   })));
 };
 
-var _excluded$1d = ["width", "height"];
+var _excluded$1c = ["width", "height"];
 var HomeFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1d);
+    props = _objectWithoutProperties(_ref, _excluded$1c);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -640,13 +640,13 @@ var HomeFilledIcon = _ref => {
   })));
 };
 
-var _excluded$1c = ["width", "height"];
+var _excluded$1b = ["width", "height"];
 var LinkIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1c);
+    props = _objectWithoutProperties(_ref, _excluded$1b);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -674,13 +674,13 @@ var LinkIcon = _ref => {
   })));
 };
 
-var _excluded$1b = ["width", "height"];
+var _excluded$1a = ["width", "height"];
 var LogoutIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1b);
+    props = _objectWithoutProperties(_ref, _excluded$1a);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -708,13 +708,13 @@ var LogoutIcon = _ref => {
   })));
 };
 
-var _excluded$1a = ["width", "height"];
+var _excluded$19 = ["width", "height"];
 var BookmarkIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1a);
+    props = _objectWithoutProperties(_ref, _excluded$19);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -742,13 +742,13 @@ var BookmarkIcon = _ref => {
   })));
 };
 
-var _excluded$19 = ["width", "height"];
+var _excluded$18 = ["width", "height"];
 var BookmarkFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$19);
+    props = _objectWithoutProperties(_ref, _excluded$18);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -776,13 +776,13 @@ var BookmarkFilledIcon = _ref => {
   })));
 };
 
-var _excluded$18 = ["width", "height"];
+var _excluded$17 = ["width", "height"];
 var MailIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$18);
+    props = _objectWithoutProperties(_ref, _excluded$17);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -810,13 +810,13 @@ var MailIcon = _ref => {
   })));
 };
 
-var _excluded$17 = ["width", "height"];
+var _excluded$16 = ["width", "height"];
 var MailFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$17);
+    props = _objectWithoutProperties(_ref, _excluded$16);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -844,13 +844,13 @@ var MailFilledIcon = _ref => {
   })));
 };
 
-var _excluded$16 = ["width", "height"];
+var _excluded$15 = ["width", "height"];
 var CalendarIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$16);
+    props = _objectWithoutProperties(_ref, _excluded$15);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -878,13 +878,13 @@ var CalendarIcon = _ref => {
   })));
 };
 
-var _excluded$15 = ["width", "height"];
+var _excluded$14 = ["width", "height"];
 var CalendarFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$15);
+    props = _objectWithoutProperties(_ref, _excluded$14);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -912,13 +912,13 @@ var CalendarFilledIcon = _ref => {
   })));
 };
 
-var _excluded$14 = ["width", "height"];
+var _excluded$13 = ["width", "height"];
 var ShareIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$14);
+    props = _objectWithoutProperties(_ref, _excluded$13);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -946,13 +946,13 @@ var ShareIcon = _ref => {
   })));
 };
 
-var _excluded$13 = ["width", "height"];
+var _excluded$12 = ["width", "height"];
 var ShareFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$13);
+    props = _objectWithoutProperties(_ref, _excluded$12);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -980,13 +980,13 @@ var ShareFilledIcon = _ref => {
   })));
 };
 
-var _excluded$12 = ["width", "height"];
+var _excluded$11 = ["width", "height"];
 var BedtimeIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$12);
+    props = _objectWithoutProperties(_ref, _excluded$11);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1014,13 +1014,13 @@ var BedtimeIcon = _ref => {
   })));
 };
 
-var _excluded$11 = ["width", "height"];
+var _excluded$10 = ["width", "height"];
 var BedtimeFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$11);
+    props = _objectWithoutProperties(_ref, _excluded$10);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1048,13 +1048,13 @@ var BedtimeFilledIcon = _ref => {
   })));
 };
 
-var _excluded$10 = ["width", "height"];
+var _excluded$$ = ["width", "height"];
 var ClearDayIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$10);
+    props = _objectWithoutProperties(_ref, _excluded$$);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1082,13 +1082,13 @@ var ClearDayIcon = _ref => {
   })));
 };
 
-var _excluded$$ = ["width", "height"];
+var _excluded$_ = ["width", "height"];
 var ClearDayFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$$);
+    props = _objectWithoutProperties(_ref, _excluded$_);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1116,13 +1116,13 @@ var ClearDayFilledIcon = _ref => {
   })));
 };
 
-var _excluded$_ = ["width", "height"];
+var _excluded$Z = ["width", "height"];
 var AddCircleIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$_);
+    props = _objectWithoutProperties(_ref, _excluded$Z);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1150,13 +1150,13 @@ var AddCircleIcon = _ref => {
   })));
 };
 
-var _excluded$Z = ["width", "height"];
+var _excluded$Y = ["width", "height"];
 var AddCircleFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$Z);
+    props = _objectWithoutProperties(_ref, _excluded$Y);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1184,13 +1184,13 @@ var AddCircleFilledIcon = _ref => {
   })));
 };
 
-var _excluded$Y = ["width", "height"];
+var _excluded$X = ["width", "height"];
 var NotifationFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$Y);
+    props = _objectWithoutProperties(_ref, _excluded$X);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1218,13 +1218,13 @@ var NotifationFilledIcon = _ref => {
   })));
 };
 
-var _excluded$X = ["width", "height"];
+var _excluded$W = ["width", "height"];
 var NotifationIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$X);
+    props = _objectWithoutProperties(_ref, _excluded$W);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1252,13 +1252,13 @@ var NotifationIcon = _ref => {
   })));
 };
 
-var _excluded$W = ["width", "height"];
+var _excluded$V = ["width", "height"];
 var VisibilityIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$W);
+    props = _objectWithoutProperties(_ref, _excluded$V);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1286,13 +1286,13 @@ var VisibilityIcon = _ref => {
   })));
 };
 
-var _excluded$V = ["width", "height"];
+var _excluded$U = ["width", "height"];
 var VisibilityFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$V);
+    props = _objectWithoutProperties(_ref, _excluded$U);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1320,13 +1320,13 @@ var VisibilityFilledIcon = _ref => {
   })));
 };
 
-var _excluded$U = ["width", "height"];
+var _excluded$T = ["width", "height"];
 var VisibilityOffIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$U);
+    props = _objectWithoutProperties(_ref, _excluded$T);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1354,13 +1354,13 @@ var VisibilityOffIcon = _ref => {
   })));
 };
 
-var _excluded$T = ["width", "height"];
+var _excluded$S = ["width", "height"];
 var VisibilityOffFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$T);
+    props = _objectWithoutProperties(_ref, _excluded$S);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1388,13 +1388,13 @@ var VisibilityOffFilledIcon = _ref => {
   })));
 };
 
-var _excluded$S = ["width", "height"];
+var _excluded$R = ["width", "height"];
 var LockIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$S);
+    props = _objectWithoutProperties(_ref, _excluded$R);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1422,13 +1422,13 @@ var LockIcon = _ref => {
   })));
 };
 
-var _excluded$R = ["width", "height"];
+var _excluded$Q = ["width", "height"];
 var LockFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$R);
+    props = _objectWithoutProperties(_ref, _excluded$Q);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1456,13 +1456,13 @@ var LockFilledIcon = _ref => {
   })));
 };
 
-var _excluded$Q = ["width", "height"];
+var _excluded$P = ["width", "height"];
 var MobileIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$Q);
+    props = _objectWithoutProperties(_ref, _excluded$P);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1490,13 +1490,13 @@ var MobileIcon = _ref => {
   })));
 };
 
-var _excluded$P = ["width", "height"];
+var _excluded$O = ["width", "height"];
 var MobileFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$P);
+    props = _objectWithoutProperties(_ref, _excluded$O);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1524,13 +1524,13 @@ var MobileFilledIcon = _ref => {
   })));
 };
 
-var _excluded$O = ["width", "height"];
+var _excluded$N = ["width", "height"];
 var CloudDownloadIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$O);
+    props = _objectWithoutProperties(_ref, _excluded$N);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1558,13 +1558,13 @@ var CloudDownloadIcon = _ref => {
   })));
 };
 
-var _excluded$N = ["width", "height"];
+var _excluded$M = ["width", "height"];
 var CloudDownloadFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$N);
+    props = _objectWithoutProperties(_ref, _excluded$M);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1592,13 +1592,13 @@ var CloudDownloadFilledIcon = _ref => {
   })));
 };
 
-var _excluded$M = ["width", "height"];
+var _excluded$L = ["width", "height"];
 var CloudUpLoadIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$M);
+    props = _objectWithoutProperties(_ref, _excluded$L);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1626,13 +1626,13 @@ var CloudUpLoadIcon = _ref => {
   })));
 };
 
-var _excluded$L = ["width", "height"];
+var _excluded$K = ["width", "height"];
 var CloudUpLoadFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$L);
+    props = _objectWithoutProperties(_ref, _excluded$K);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1660,13 +1660,13 @@ var CloudUpLoadFilledIcon = _ref => {
   })));
 };
 
-var _excluded$K = ["width", "height"];
+var _excluded$J = ["width", "height"];
 var CloudDoneIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$K);
+    props = _objectWithoutProperties(_ref, _excluded$J);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1694,13 +1694,13 @@ var CloudDoneIcon = _ref => {
   })));
 };
 
-var _excluded$J = ["width", "height"];
+var _excluded$I = ["width", "height"];
 var CloudDoneFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$J);
+    props = _objectWithoutProperties(_ref, _excluded$I);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1728,13 +1728,13 @@ var CloudDoneFilledIcon = _ref => {
   })));
 };
 
-var _excluded$I = ["width", "height"];
+var _excluded$H = ["width", "height"];
 var NotificationsActiveIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$I);
+    props = _objectWithoutProperties(_ref, _excluded$H);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1762,13 +1762,13 @@ var NotificationsActiveIcon = _ref => {
   })));
 };
 
-var _excluded$H = ["width", "height"];
+var _excluded$G = ["width", "height"];
 var NotificationsActiveFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$H);
+    props = _objectWithoutProperties(_ref, _excluded$G);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1796,13 +1796,13 @@ var NotificationsActiveFilledIcon = _ref => {
   })));
 };
 
-var _excluded$G = ["width", "height"];
+var _excluded$F = ["width", "height"];
 var NotificationsOffIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$G);
+    props = _objectWithoutProperties(_ref, _excluded$F);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1830,13 +1830,13 @@ var NotificationsOffIcon = _ref => {
   })));
 };
 
-var _excluded$F = ["width", "height"];
+var _excluded$E = ["width", "height"];
 var NotificationsOffFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$F);
+    props = _objectWithoutProperties(_ref, _excluded$E);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1864,13 +1864,13 @@ var NotificationsOffFilledIcon = _ref => {
   })));
 };
 
-var _excluded$E = ["width", "height"];
+var _excluded$D = ["width", "height"];
 var NotificationsUnreadIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$E);
+    props = _objectWithoutProperties(_ref, _excluded$D);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1898,13 +1898,13 @@ var NotificationsUnreadIcon = _ref => {
   })));
 };
 
-var _excluded$D = ["width", "height"];
+var _excluded$C = ["width", "height"];
 var NotificationsUnreadFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$D);
+    props = _objectWithoutProperties(_ref, _excluded$C);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1932,13 +1932,13 @@ var NotificationsUnreadFilledIcon = _ref => {
   })));
 };
 
-var _excluded$C = ["width", "height"];
+var _excluded$B = ["width", "height"];
 var GoogleColorIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$C);
+    props = _objectWithoutProperties(_ref, _excluded$B);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1964,13 +1964,13 @@ var GoogleColorIcon = _ref => {
   }));
 };
 
-var _excluded$B = ["width", "height"];
+var _excluded$A = ["width", "height"];
 var FacebookColorIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$B);
+    props = _objectWithoutProperties(_ref, _excluded$A);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1987,13 +1987,13 @@ var FacebookColorIcon = _ref => {
   }));
 };
 
-var _excluded$A = ["width", "height"];
+var _excluded$z = ["width", "height"];
 var InstagramColorIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$A);
+    props = _objectWithoutProperties(_ref, _excluded$z);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2060,13 +2060,13 @@ var InstagramColorIcon = _ref => {
   }))));
 };
 
-var _excluded$z = ["width", "height"];
+var _excluded$y = ["width", "height"];
 var TiktokColorIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$z);
+    props = _objectWithoutProperties(_ref, _excluded$y);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2089,13 +2089,13 @@ var TiktokColorIcon = _ref => {
   }));
 };
 
-var _excluded$y = ["width", "height"];
+var _excluded$x = ["width", "height"];
 var MessagerColorIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$y);
+    props = _objectWithoutProperties(_ref, _excluded$x);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2132,13 +2132,13 @@ var MessagerColorIcon = _ref => {
   }))));
 };
 
-var _excluded$x = ["width", "height"];
+var _excluded$w = ["width", "height"];
 var LineAppColorIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$x);
+    props = _objectWithoutProperties(_ref, _excluded$w);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2157,13 +2157,13 @@ var LineAppColorIcon = _ref => {
   }));
 };
 
-var _excluded$w = ["width", "height"];
+var _excluded$v = ["width", "height"];
 var ArrowCircleLeftIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$w);
+    props = _objectWithoutProperties(_ref, _excluded$v);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2191,13 +2191,13 @@ var ArrowCircleLeftIcon = _ref => {
   })));
 };
 
-var _excluded$v = ["width", "height"];
+var _excluded$u = ["width", "height"];
 var ArrowCircleRightIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$v);
+    props = _objectWithoutProperties(_ref, _excluded$u);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2225,13 +2225,13 @@ var ArrowCircleRightIcon = _ref => {
   })));
 };
 
-var _excluded$u = ["width", "height"];
+var _excluded$t = ["width", "height"];
 var ArrowCircleUpIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$u);
+    props = _objectWithoutProperties(_ref, _excluded$t);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2259,13 +2259,13 @@ var ArrowCircleUpIcon = _ref => {
   })));
 };
 
-var _excluded$t = ["width", "height"];
+var _excluded$s = ["width", "height"];
 var ArrowCircleDownIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$t);
+    props = _objectWithoutProperties(_ref, _excluded$s);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2293,13 +2293,13 @@ var ArrowCircleDownIcon = _ref => {
   })));
 };
 
-var _excluded$s = ["width", "height"];
+var _excluded$r = ["width", "height"];
 var ArrowCircleLeftFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$s);
+    props = _objectWithoutProperties(_ref, _excluded$r);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2327,13 +2327,13 @@ var ArrowCircleLeftFilledIcon = _ref => {
   })));
 };
 
-var _excluded$r = ["width", "height"];
+var _excluded$q = ["width", "height"];
 var ArrowCircleRightFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$r);
+    props = _objectWithoutProperties(_ref, _excluded$q);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2361,13 +2361,13 @@ var ArrowCircleRightFilledIcon = _ref => {
   })));
 };
 
-var _excluded$q = ["width", "height"];
+var _excluded$p = ["width", "height"];
 var ArrowCircleUpFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$q);
+    props = _objectWithoutProperties(_ref, _excluded$p);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2395,13 +2395,13 @@ var ArrowCircleUpFilledIcon = _ref => {
   })));
 };
 
-var _excluded$p = ["width", "height"];
+var _excluded$o = ["width", "height"];
 var ArrowCircleDownFilledIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$p);
+    props = _objectWithoutProperties(_ref, _excluded$o);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2429,13 +2429,13 @@ var ArrowCircleDownFilledIcon = _ref => {
   })));
 };
 
-var _excluded$o = ["width", "height"];
+var _excluded$n = ["width", "height"];
 var ArrowLeftAltIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$o);
+    props = _objectWithoutProperties(_ref, _excluded$n);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2463,13 +2463,13 @@ var ArrowLeftAltIcon = _ref => {
   })));
 };
 
-var _excluded$n = ["width", "height"];
+var _excluded$m = ["width", "height"];
 var ArrowRightAltIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$n);
+    props = _objectWithoutProperties(_ref, _excluded$m);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2497,13 +2497,13 @@ var ArrowRightAltIcon = _ref => {
   })));
 };
 
-var _excluded$m = ["width", "height"];
+var _excluded$l = ["width", "height"];
 var ArrowDownwardAltIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$m);
+    props = _objectWithoutProperties(_ref, _excluded$l);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2531,13 +2531,13 @@ var ArrowDownwardAltIcon = _ref => {
   })));
 };
 
-var _excluded$l = ["width", "height"];
+var _excluded$k = ["width", "height"];
 var ArrowUpwardAltIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$l);
+    props = _objectWithoutProperties(_ref, _excluded$k);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2565,13 +2565,13 @@ var ArrowUpwardAltIcon = _ref => {
   })));
 };
 
-var _excluded$k = ["width", "height"];
+var _excluded$j = ["width", "height"];
 var KeyboardArrowLeftIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$k);
+    props = _objectWithoutProperties(_ref, _excluded$j);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2599,13 +2599,13 @@ var KeyboardArrowLeftIcon = _ref => {
   })));
 };
 
-var _excluded$j = ["width", "height"];
+var _excluded$i = ["width", "height"];
 var KeyboardArrowRightIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$j);
+    props = _objectWithoutProperties(_ref, _excluded$i);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2633,13 +2633,13 @@ var KeyboardArrowRightIcon = _ref => {
   })));
 };
 
-var _excluded$i = ["width", "height"];
+var _excluded$h = ["width", "height"];
 var KeyboardArrowUpIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$i);
+    props = _objectWithoutProperties(_ref, _excluded$h);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2667,13 +2667,13 @@ var KeyboardArrowUpIcon = _ref => {
   })));
 };
 
-var _excluded$h = ["width", "height"];
+var _excluded$g = ["width", "height"];
 var KeyboardArrowDownIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$h);
+    props = _objectWithoutProperties(_ref, _excluded$g);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2701,13 +2701,13 @@ var KeyboardArrowDownIcon = _ref => {
   })));
 };
 
-var _excluded$g = ["width", "height"];
+var _excluded$f = ["width", "height"];
 var LastPageIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$g);
+    props = _objectWithoutProperties(_ref, _excluded$f);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2735,13 +2735,13 @@ var LastPageIcon = _ref => {
   })));
 };
 
-var _excluded$f = ["width", "height"];
+var _excluded$e = ["width", "height"];
 var FirstPageIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$f);
+    props = _objectWithoutProperties(_ref, _excluded$e);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2769,13 +2769,13 @@ var FirstPageIcon = _ref => {
   })));
 };
 
-var _excluded$e = ["width", "height"];
+var _excluded$d = ["width", "height"];
 var InfoIcon = _ref => {
   var {
       width,
       height
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$e);
+    props = _objectWithoutProperties(_ref, _excluded$d);
   var size = width || height || 24;
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -2933,12 +2933,12 @@ var getColorOpposite = (defaultColor, fill) => {
   }
 };
 
-var _excluded$d = ["fill"];
+var _excluded$c = ["fill"];
 var TROlineLogo = _ref => {
   var {
       fill
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$d);
+    props = _objectWithoutProperties(_ref, _excluded$c);
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 114 40"
@@ -3086,12 +3086,12 @@ var TROlineENLogo = _a => {
   }), /*#__PURE__*/React.createElement("title", null, "Logo Thairath"));
 };
 
-var _excluded$c = ["fill"];
+var _excluded$b = ["fill"];
 var TRMoneyLogo = _ref => {
   var {
       fill
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$c);
+    props = _objectWithoutProperties(_ref, _excluded$b);
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 126 40"
@@ -3148,12 +3148,12 @@ var TRMoneyLogo = _ref => {
   }), /*#__PURE__*/React.createElement("title", null, "Logo TR Money"));
 };
 
-var _excluded$b = ["fill"];
+var _excluded$a = ["fill"];
 var TRTVLogo = _ref => {
   var {
       fill
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$b);
+    props = _objectWithoutProperties(_ref, _excluded$a);
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 164 40"
@@ -3255,12 +3255,12 @@ var TRPlusLogo = _a => {
   }), /*#__PURE__*/React.createElement("title", null, "Logo TR Plus"));
 };
 
-var _excluded$a = ["fill"];
+var _excluded$9 = ["fill"];
 var TRLogisticsLogo = _ref => {
   var {
       fill
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$a);
+    props = _objectWithoutProperties(_ref, _excluded$9);
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 112 40"
@@ -3523,12 +3523,12 @@ var TRFutureperfectLogo = _ref => {
   }))), /*#__PURE__*/React.createElement("title", null, "Logo Futureperfect"));
 };
 
-var _excluded$9 = ["fill"];
+var _excluded$8 = ["fill"];
 var TRSportLogo = _ref => {
   var {
       fill
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$9);
+    props = _objectWithoutProperties(_ref, _excluded$8);
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 118 40"
@@ -3628,12 +3628,12 @@ var TRSportLogo = _ref => {
   }), /*#__PURE__*/React.createElement("title", null, "Logo TR Sport"));
 };
 
-var _excluded$8 = ["fill"];
+var _excluded$7 = ["fill"];
 var MirrorLogo = _ref => {
   var {
       fill
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$8);
+    props = _objectWithoutProperties(_ref, _excluded$7);
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 205 40"
@@ -3658,12 +3658,12 @@ var MirrorLogo = _ref => {
   }), /*#__PURE__*/React.createElement("title", null, "Logo Mirror"));
 };
 
-var _excluded$7 = ["fill"];
+var _excluded$6 = ["fill"];
 var TrenVG3Logo = _ref => {
   var {
       fill
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$7);
+    props = _objectWithoutProperties(_ref, _excluded$6);
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 177 40"
@@ -4408,7 +4408,7 @@ var TRO_Button = /*#__PURE__*/_styled("button", process.env.NODE_ENV === "produc
   return iconPosition === 'Left' ? 'flex-direction: row-reverse;' : 'flex-direction: row;';
 }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImJ1dHRvblN0eWxlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFd0MiLCJmaWxlIjoiYnV0dG9uU3R5bGUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLy8gYnV0dG9uU3R5bGUudHN4XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmV4cG9ydCBjb25zdCBUUk9fQnV0dG9uID0gc3R5bGVkLmJ1dHRvbiBgXG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1ib3JkZXItcmFkaXVzLWZ1bGwpO1xuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1kZWZhdWx0KTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDY1MDtcbiAgICBsaW5lLWhlaWdodDogMTAwJTtcblxuICAgICR7KHsgdmFyaWFudCB9KSA9PiB7XG4gICAgc3dpdGNoICh2YXJpYW50KSB7XG4gICAgICAgIGNhc2UgJ1ByaW1hcnknOlxuICAgICAgICAgICAgcmV0dXJuIGBcbiAgICAgICAgICAgICAgICAgICAgY29sb3I6IHZhcigtLWNvbXBvbmVudHMtYnV0dG9uLXRleHQtd2hpdGUpO1xuICAgICAgICAgICAgICAgICAgICBib3JkZXI6IHZhcigtLWJvcmRlci1zbSkgc29saWQgdmFyKC0tY29tcG9uZW50cy1idXR0b24tYm9yZGVyLWdyZWVuLXByaW1hcnkpO1xuICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoLS1jb21wb25lbnRzLWJ1dHRvbi1iYWNrZ3JvdW5kLWdyZWVuLXByaW1hcnkpO1xuICAgICAgICAgICAgICAgIGA7XG4gICAgICAgIGNhc2UgJ1NlY29uZGFyeSc6XG4gICAgICAgICAgICByZXR1cm4gYFxuICAgICAgICAgICAgICAgICAgICBjb2xvcjogdmFyKC0tY29tcG9uZW50cy1idXR0b24tdGV4dC1ncmVlbi1wcmltYXJ5KTtcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyOiB2YXIoLS1ib3JkZXItc20pIHNvbGlkIHZhcigtLWNvbXBvbmVudHMtYnV0dG9uLWJvcmRlci1ncmVlbi1wcmltYXJ5KTtcbiAgICAgICAgICAgICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29tcG9uZW50cy1idXR0b24tYmFja2dyb3VuZC13aGl0ZSk7XG4gICAgICAgICAgICAgICAgYDtcbiAgICAgICAgY2FzZSAnRGlzYWJsZSc6XG4gICAgICAgICAgICByZXR1cm4gYFxuICAgICAgICAgICAgICAgICAgICBjb2xvcjogdmFyKC0tY29tcG9uZW50cy1idXR0b24tdGV4dC1kaXNhYmxlKTtcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyOiB2YXIoLS1ib3JkZXItc20pIHNvbGlkIHZhcigtLWNvbXBvbmVudHMtYnV0dG9uLWJvcmRlci1kaXNhYmxlKTtcbiAgICAgICAgICAgICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29tcG9uZW50cy1idXR0b24tYmFja2dyb3VuZC1kaXNhYmxlKTtcbiAgICAgICAgICAgICAgICAgICAgY3Vyc29yOiBub3QtYWxsb3dlZDtcbiAgICAgICAgICAgICAgICBgO1xuICAgICAgICBkZWZhdWx0OlxuICAgICAgICAgICAgcmV0dXJuICcnO1xuICAgIH1cbn19XG5cbiAgICAkeyh7IHZhcmlhbnQgfSkgPT4gdmFyaWFudCAhPT0gJ0Rpc2FibGUnICYmIGBcblxuICAgICAgICA6aG92ZXJ7XG4gICAgICAgICAgICBjb2xvcjogdmFyKC0tY29tcG9uZW50cy1idXR0b24tdGV4dC13aGl0ZSk7XG4gICAgICAgICAgICBib3JkZXI6IHZhcigtLWJvcmRlci1zbSkgc29saWQgdmFyKC0tY29tcG9uZW50cy1idXR0b24tYm9yZGVyLWdyZWVuLWRhcmspO1xuICAgICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29tcG9uZW50cy1idXR0b24tYmFja2dyb3VuZC1ncmVlbi1kYXJrKTtcblxuICAgICAgICAgICAgLmJ1dHRvbi1pY29ue1xuICAgICAgICAgICAgICAgIGZpbGw6IHZhcigtLWNvbXBvbmVudHMtYnV0dG9uLWljb24td2hpdGUpO1xuICAgICAgICAgICAgfVxuICAgICAgICB9XG4gICAgYH1cblxuICAgICR7KHsgc2l6ZSB9KSA9PiB7XG4gICAgc3dpdGNoIChzaXplKSB7XG4gICAgICAgIGNhc2UgJ1NtYWxsJzpcbiAgICAgICAgICAgIHJldHVybiBgXG4gICAgICAgICAgICAgICAgICAgIHBhZGRpbmc6IHZhcigtLWdhcC14cykgdmFyKC0tZ2FwLXNtKTtcbiAgICAgICAgICAgICAgICAgICAgZ2FwOiB2YXIoLS1nYXAtMnhzKTtcbiAgICAgICAgICAgICAgICAgICAgZm9udC1zaXplOjEycHg7XG4gICAgICAgICAgICAgICAgYDtcbiAgICAgICAgY2FzZSAnTWVkaXVtJzpcbiAgICAgICAgICAgIHJldHVybiBgXG4gICAgICAgICAgICAgICAgICAgIHBhZGRpbmc6IHZhcigtLWdhcC14cykgdmFyKC0tZ2FwLWxnKTtcbiAgICAgICAgICAgICAgICAgICAgZ2FwOiB2YXIoLS1nYXAtMnhzKTtcbiAgICAgICAgICAgICAgICAgICAgZm9udC1zaXplOjE2cHg7XG4gICAgICAgICAgICAgICAgYDtcbiAgICAgICAgY2FzZSAnTGFyZ2UnOlxuICAgICAgICAgICAgcmV0dXJuIGBcbiAgICAgICAgICAgICAgICAgICAgcGFkZGluZzogdmFyKC0tZ2FwLXNtKSB2YXIoLS1nYXAteGwpO1xuICAgICAgICAgICAgICAgICAgICBnYXA6IHZhcigtLWdhcC0yeHMpO1xuICAgICAgICAgICAgICAgICAgICBmb250LXNpemU6IDIwcHg7XG4gICAgICAgICAgICAgICAgYDtcbiAgICAgICAgY2FzZSAnWC1MYXJnZSc6XG4gICAgICAgICAgICByZXR1cm4gYFxuICAgICAgICAgICAgICAgICAgICBwYWRkaW5nOiB2YXIoLS1nYXAtc20pIHZhcigtLWdhcC0yeGwpO1xuICAgICAgICAgICAgICAgICAgICBnYXA6IHZhcigtLWdhcC1zbSk7XG4gICAgICAgICAgICAgICAgICAgIGZvbnQtc2l6ZTogMjZweDtcbiAgICAgICAgICAgICAgICBgO1xuICAgICAgICBkZWZhdWx0OlxuICAgICAgICAgICAgcmV0dXJuICcnO1xuICAgIH1cbn19XG5cbiAgICAkeyh7IGljb25Qb3NpdGlvbiB9KSA9PiBpY29uUG9zaXRpb24gPT09ICdMZWZ0JyA/ICdmbGV4LWRpcmVjdGlvbjogcm93LXJldmVyc2U7JyA6ICdmbGV4LWRpcmVjdGlvbjogcm93Oyd9XG4gIFxuYDtcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPWJ1dHRvblN0eWxlLmpzeC5tYXAiXX0= */"));
 
-var _excluded$6 = ["variant", "size", "label", "icon", "iconPosition", "href", "target", "ariaLabel", "rel", "onClick"];
+var _excluded$5 = ["variant", "size", "label", "icon", "iconPosition", "href", "target", "ariaLabel", "rel", "onClick"];
 var buttonSizeMap = {
   Small: 18,
   Medium: 20,
@@ -4428,7 +4428,7 @@ var Button = _ref => {
       rel,
       onClick
     } = _ref,
-    restProps = _objectWithoutProperties(_ref, _excluded$6);
+    restProps = _objectWithoutProperties(_ref, _excluded$5);
   var fillColor = getFillColorFromVariant(variant !== null && variant !== void 0 ? variant : 'Primary');
   var iconSize = buttonSizeMap[size !== null && size !== void 0 ? size : 'Small'];
   var isDisabled = variant === 'Disable';
@@ -4664,7 +4664,7 @@ var Form = _ref => {
   }))), children, description && /*#__PURE__*/React.createElement(TRO_FormDescription, null, description));
 };
 
-var _excluded$5 = ["variant", "label", "placeholder", "description", "value", "info"];
+var _excluded$4 = ["variant", "label", "placeholder", "description", "value", "info"];
 var Textbox = _ref => {
   var {
       variant = "Default",
@@ -4674,7 +4674,7 @@ var Textbox = _ref => {
       value,
       info
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$5);
+    props = _objectWithoutProperties(_ref, _excluded$4);
   return /*#__PURE__*/React.createElement(Form, {
     variant: variant,
     label: label,
@@ -4687,7 +4687,7 @@ var Textbox = _ref => {
   })));
 };
 
-var _excluded$4 = ["variant", "label", "placeholder", "description", "info", "value"];
+var _excluded$3 = ["variant", "label", "placeholder", "description", "info", "value"];
 var Textarea = _ref => {
   var {
       variant = "Default",
@@ -4697,7 +4697,7 @@ var Textarea = _ref => {
       info,
       value
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$4);
+    props = _objectWithoutProperties(_ref, _excluded$3);
   return /*#__PURE__*/React.createElement(Form, {
     variant: variant,
     label: label,
@@ -4710,7 +4710,7 @@ var Textarea = _ref => {
   })));
 };
 
-var _excluded$3 = ["variant", "label", "placeholder", "description", "info", "value", "icon", "children"];
+var _excluded$2 = ["variant", "label", "placeholder", "description", "info", "value", "icon", "children"];
 var Select = _ref => {
   var {
       variant = "Default",
@@ -4722,7 +4722,7 @@ var Select = _ref => {
       icon,
       children
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$3);
+    props = _objectWithoutProperties(_ref, _excluded$2);
   return /*#__PURE__*/React.createElement(Form, {
     variant: variant,
     label: label,
@@ -4803,7 +4803,7 @@ var TRO_StyledRadio = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "pro
   }
 }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInJhZGlvU3R5bGUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW9Dc0UiLCJmaWxlIjoicmFkaW9TdHlsZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvLyByYWRpb1N0eWxlLnRzeFxuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBSYWRpb1ZhcmlhbnQgfSBmcm9tIFwiLi4vdXRpbHNGb3JtXCI7XG5cbmV4cG9ydCBjb25zdCBUUk9fUmFkaW8gPSBzdHlsZWQuZGl2PHsgZGlzYWJsZWQ/OiBib29sZWFuIH0+YFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBnYXA6IDEwcHg7XG4gICAgY3Vyc29yOiAkeyh7IGRpc2FibGVkIH0pID0+IChkaXNhYmxlZCA/IFwibm90LWFsbG93ZWRcIiA6IFwicG9pbnRlclwiKX07XG5gO1xuXG5leHBvcnQgY29uc3QgVFJPX0hpZGRlblJhZGlvID0gc3R5bGVkLmlucHV0YFxuICAgIGRpc3BsYXk6IG5vbmU7XG5gO1xuZXhwb3J0IGNvbnN0IFRST19SYWRpb0xhYmVsID0gc3R5bGVkLmxhYmVsPHsgdmFyaWFudD86IFJhZGlvVmFyaWFudCB9PmBcbiAgICBmb250LWZhbWlseTogdmFyKC0tZm9udC1mYW1pbHktZGVmYXVsdCwgXCJLYUxhVGVYYSBEaXNwbGF5XCIpO1xuICAgIGZvbnQtc2l6ZTogdmFyKC0tc2l6ZS1ub3JtYWwtc20sIDE0cHgpO1xuICAgIGZvbnQtc3R5bGU6IG5vcm1hbDtcbiAgICBmb250LXdlaWdodDogNDAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxMDAlO1xuXG4gICAgJHsoeyB2YXJpYW50IH0pID0+IHtcbiAgICAgICAgXG4gICAgICAgIHN3aXRjaCAodmFyaWFudCkge1xuICAgICAgICAgICAgY2FzZSAnZXJyb3InOlxuICAgICAgICAgICAgICAgIHJldHVybiBgXG4gICAgICAgICAgICAgICAgICAgIGNvbG9yOiB2YXIoLS1jb21wb25lbnRzLWZvcm0tdGV4dC1lcnJvcik7XG4gICAgICAgICAgICAgICAgYDtcbiAgICAgICAgICAgIGNhc2UgJ2Rpc2FibGVkJzpcbiAgICAgICAgICAgICAgICByZXR1cm4gYGNvbG9yOiB2YXIoLS1jb21wb25lbnRzLWZvcm0tdGV4dC1kaXNhYmxlKTtgXG4gICAgICAgICAgICBkZWZhdWx0OlxuICAgICAgICAgICAgICAgIHJldHVybiBgY29sb3I6IHZhcigtLWNvbXBvbmVudHMtZm9ybS10ZXh0LWJsYWNrKTtgO1xuICAgICAgICB9XG4gICAgfX07XG5gXG5cbmV4cG9ydCBjb25zdCBUUk9fU3R5bGVkUmFkaW8gPSBzdHlsZWQuc3Bhbjx7IHZhcmlhbnQ/OiBSYWRpb1ZhcmlhbnQgfT5gXG4gICAgd2lkdGg6IDE4cHg7XG4gICAgaGVpZ2h0OiAxOHB4O1xuICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWJvcmRlci1yYWRpdXMtZnVsbCk7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuXG4gICAgJHsoeyB2YXJpYW50IH0pID0+IHtcbiAgICAgICAgXG4gICAgICAgIHN3aXRjaCAodmFyaWFudCkge1xuICAgICAgICAgICAgY2FzZSAnZXJyb3InOlxuICAgICAgICAgICAgICAgIHJldHVybiBgXG4gICAgICAgICAgICAgICAgICAgIGJvcmRlcjogMXB4IHNvbGlkIHZhcigtLWNvbXBvbmVudHMtZm9ybS1ib3JkZXItZXJyb3IpO1xuICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoLS1jb21wb25lbnRzLWZvcm0taWNvbi13aGl0ZSk7XG4gICAgICAgICAgICAgICAgYDtcbiAgICAgICAgICAgIGNhc2UgJ3NlbGVjdGVkJzpcbiAgICAgICAgICAgICAgICByZXR1cm4gYFxuICAgICAgICAgICAgICAgICAgICBib3JkZXI6IDFweCBzb2xpZCB2YXIoLS1jb21wb25lbnRzLWZvcm0tYm9yZGVyLWdyZWVuLXByaW1hcnkpO1xuICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoLS1jb21wb25lbnRzLWZvcm0tYmFja2dyb3VuZC13aGl0ZSk7XG5cbiAgICAgICAgICAgICAgICAgICAgJjo6YWZ0ZXIge1xuICAgICAgICAgICAgICAgICAgICAgICAgY29udGVudDogXCJcIjtcbiAgICAgICAgICAgICAgICAgICAgICAgIHdpZHRoOiA4cHg7XG4gICAgICAgICAgICAgICAgICAgICAgICBoZWlnaHQ6IDhweDtcbiAgICAgICAgICAgICAgICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDUwJTtcbiAgICAgICAgICAgICAgICAgICAgICAgIGJhY2tncm91bmQ6ICMwNGJjMDA7XG4gICAgICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICBgXG4gICAgICAgICAgICBjYXNlICdkaXNhYmxlZCc6XG4gICAgICAgICAgICAgICAgcmV0dXJuIGBcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyOiAxcHggc29saWQgdmFyKC0tY29tcG9uZW50cy1mb3JtLWJvcmRlci1kaXNhYmxlKTtcbiAgICAgICAgICAgICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29tcG9uZW50cy1mb3JtLWJhY2tncm91bmQtZGlzYWJsZSk7XG4gICAgICAgICAgICAgICAgYFxuICAgICAgICAgICAgZGVmYXVsdDpcbiAgICAgICAgICAgICAgICByZXR1cm4gYFxuICAgICAgICAgICAgICAgICAgICBib3JkZXI6IDFweCBzb2xpZCB2YXIoLS1jb21wb25lbnRzLWZvcm0tYm9yZGVyLWJsYWNrKTtcbiAgICAgICAgICAgICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29tcG9uZW50cy1mb3JtLWJhY2tncm91bmQtd2hpdGUpO1xuICAgICAgICAgICAgICAgIGA7XG4gICAgICAgIH1cbiAgICB9fTtcbmA7Il19 */"));
 
-var _excluded$2 = ["id", "label", "value", "variant", "disabled", "onChange", "checked"];
+var _excluded$1 = ["id", "label", "value", "variant", "disabled", "onChange", "checked"];
 var RadioButton = _ref => {
   var {
       id = 'label',
@@ -4814,7 +4814,7 @@ var RadioButton = _ref => {
       onChange,
       checked = false
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$2);
+    props = _objectWithoutProperties(_ref, _excluded$1);
   var isDisabled = variant === "disabled" ? true : disabled;
   var isChecked = variant === "selected" ? true : checked;
   var handleChange = () => {
@@ -4905,7 +4905,7 @@ var TRO_StyledCheckbox = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "
   }
 }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNoZWNrYm94U3R5bGUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1DeUUiLCJmaWxlIjoiY2hlY2tib3hTdHlsZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvLyBzcmMvY29tcG9uZW50cy9hdG9tcy9mb3JtL3N0eWxlcy9jaGVja2JveFN0eWxlLnRzeFxuXG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IFJhZGlvVmFyaWFudCB9IGZyb20gXCIuLi91dGlsc0Zvcm1cIjtcblxuZXhwb3J0IGNvbnN0IFRST19DaGVja2JveCA9IHN0eWxlZC5kaXY8eyBkaXNhYmxlZD86IGJvb2xlYW4gfT5gXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGdhcDogMTBweDtcbiAgICBjdXJzb3I6ICR7KHsgZGlzYWJsZWQgfSkgPT4gKGRpc2FibGVkID8gXCJub3QtYWxsb3dlZFwiIDogXCJwb2ludGVyXCIpfTtcbmBcbmV4cG9ydCBjb25zdCBUUk9fSGlkZGVuQ2hlY2tib3g9IHN0eWxlZC5pbnB1dGBcbiAgICBkaXNwbGF5OiBub25lO1xuYDtcbmV4cG9ydCBjb25zdCBUUk9fQ2hlY2tib3hMYWJlbCA9IHN0eWxlZC5sYWJlbDx7IHZhcmlhbnQ/OiBSYWRpb1ZhcmlhbnQgfT5gXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWRlZmF1bHQsIFwiS2FMYVRlWGEgRGlzcGxheVwiKTtcbiAgICBmb250LXNpemU6IHZhcigtLXNpemUtbm9ybWFsLXNtLCAxNHB4KTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDQwMDtcbiAgICBsaW5lLWhlaWdodDogMTAwJTtcblxuICAgICR7KHsgdmFyaWFudCB9KSA9PiB7XG4gICAgICAgIFxuICAgICAgICBzd2l0Y2ggKHZhcmlhbnQpIHtcbiAgICAgICAgICAgIGNhc2UgJ2Vycm9yJzpcbiAgICAgICAgICAgICAgICByZXR1cm4gYFxuICAgICAgICAgICAgICAgICAgICBjb2xvcjogdmFyKC0tY29tcG9uZW50cy1mb3JtLXRleHQtZXJyb3IpO1xuICAgICAgICAgICAgICAgIGA7XG4gICAgICAgICAgICBjYXNlICdkaXNhYmxlZCc6XG4gICAgICAgICAgICAgICAgcmV0dXJuIGBjb2xvcjogdmFyKC0tY29tcG9uZW50cy1mb3JtLXRleHQtZGlzYWJsZSk7IGN1cnNvcjogbm90LWFsbG93ZWQ7YFxuICAgICAgICAgICAgZGVmYXVsdDpcbiAgICAgICAgICAgICAgICByZXR1cm4gYGNvbG9yOiB2YXIoLS1jb21wb25lbnRzLWZvcm0tdGV4dC1ibGFjayk7YDtcbiAgICAgICAgfVxuICAgIH19O1xuYFxuZXhwb3J0IGNvbnN0IFRST19TdHlsZWRDaGVja2JveCA9IHN0eWxlZC5zcGFuPHsgdmFyaWFudD86IFJhZGlvVmFyaWFudCB9PmBcbiAgICB3aWR0aDogMThweDtcbiAgICBoZWlnaHQ6IDE4cHg7XG4gICAgYm9yZGVyLXJhZGl1czogdmFyKC0tYm9yZGVyLXJhZGl1cy14cyk7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuXG4gICAgJHsoeyB2YXJpYW50IH0pID0+IHtcbiAgICAgICAgXG4gICAgICAgIHN3aXRjaCAodmFyaWFudCkge1xuICAgICAgICAgICAgY2FzZSAnZXJyb3InOlxuICAgICAgICAgICAgICAgIHJldHVybiBgXG4gICAgICAgICAgICAgICAgICAgIGJvcmRlcjogMXB4IHNvbGlkIHZhcigtLWNvbXBvbmVudHMtZm9ybS1ib3JkZXItZXJyb3IpO1xuICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoLS1jb21wb25lbnRzLWZvcm0taWNvbi13aGl0ZSk7XG4gICAgICAgICAgICAgICAgYDtcbiAgICAgICAgICAgIGNhc2UgJ3NlbGVjdGVkJzpcbiAgICAgICAgICAgICAgICByZXR1cm4gYFxuICAgICAgICAgICAgICAgICAgICBib3JkZXI6IDFweCBzb2xpZCB2YXIoLS1jb21wb25lbnRzLWZvcm0tYm9yZGVyLWdyZWVuLXByaW1hcnkpO1xuICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoLS1jb21wb25lbnRzLWZvcm0tYmFja2dyb3VuZC13aGl0ZSk7XG5cbiAgICAgICAgICAgICAgICAgICAgJjo6YWZ0ZXIge1xuICAgICAgICAgICAgICAgICAgICAgICAgY29udGVudDogXCJcIjtcbiAgICAgICAgICAgICAgICAgICAgICAgIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgICAgICAgICAgICAgICAgICAgICAgIHdpZHRoOiAxMHB4O1xuICAgICAgICAgICAgICAgICAgICAgICAgaGVpZ2h0OiA4cHg7XG4gICAgICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kLWltYWdlOiB1cmwoJ2RhdGE6aW1hZ2Uvc3ZnK3htbDt1dGY4LDxzdmcgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiIHdpZHRoPVwiMTBcIiBoZWlnaHQ9XCI4XCIgdmlld0JveD1cIjAgMCAxMCA4XCIgZmlsbD1cIm5vbmVcIj48cGF0aCBkPVwiTTMuMzMzMzMgNS42Mjk4MUw4LjM5NDE3IDAuNTYwODU2QzguNTA5MTcgMC40NDU1NzggOC42NTU0MSAwLjM4NzkzOSA4LjgzMjkyIDAuMzg3OTM5QzkuMDEwNTUgMC4zODc5MzkgOS4xNTcwOCAwLjQ0NTQ0IDkuMjcyNSAwLjU2MDQ0QzkuMzg3NzggMC42NzU0NCA5LjQ0NTQyIDAuODIxNzU4IDkuNDQ1NDIgMC45OTkzOTdDOS40NDU0MiAxLjE3NzE4IDkuMzg3NzggMS4zMjM3NyA5LjI3MjUgMS40MzkxOUwzLjg2MDYyIDYuODQyOTRDMy43MDk5MyA2Ljk5MzYzIDMuNTM0MTYgNy4wNjg5OCAzLjMzMzMzIDcuMDY4OThDMy4xMzI1IDcuMDY4OTggMi45NTY3MyA2Ljk5MzYzIDIuODA2MDQgNi44NDI5NEwwLjcyNzQ5OCA0Ljc3MjUyQzAuNjEyMjIgNC42NTc1MiAwLjU1NDU4MSA0LjUxMTI3IDAuNTU0NTgxIDQuMzMzNzdDMC41NTQ1ODEgNC4xNTYxMyAwLjYxMjA4MSA0LjAwOTYxIDAuNzI3MDgxIDMuODk0MTlDMC44NDIwODEgMy43Nzg5MSAwLjk4ODQgMy43MjEyNyAxLjE2NjA0IDMuNzIxMjdDMS4zNDM4MiAzLjcyMTI3IDEuNDkwNDEgMy43Nzg5MSAxLjYwNTgzIDMuODk0MTlMMy4zMzMzMyA1LjYyOTgxWlwiIGZpbGw9XCIlMjMwMEI0MDBcIi8+PC9zdmc+Jyk7XG4gICAgICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kLXNpemU6IGNvbnRhaW47XG4gICAgICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kLXJlcGVhdDogbm8tcmVwZWF0O1xuICAgICAgICAgICAgICAgICAgICB9XG5cbiAgICAgICAgICAgICAgICBgXG4gICAgICAgICAgICBjYXNlICdkaXNhYmxlZCc6XG4gICAgICAgICAgICAgICAgcmV0dXJuIGBcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyOiAxcHggc29saWQgdmFyKC0tY29tcG9uZW50cy1mb3JtLWJvcmRlci1kaXNhYmxlKTtcbiAgICAgICAgICAgICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29tcG9uZW50cy1mb3JtLWJhY2tncm91bmQtZGlzYWJsZSk7XG4gICAgICAgICAgICAgICAgICAgIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gICAgICAgICAgICAgICAgYFxuICAgICAgICAgICAgZGVmYXVsdDpcbiAgICAgICAgICAgICAgICByZXR1cm4gYFxuICAgICAgICAgICAgICAgICAgICBib3JkZXI6IDFweCBzb2xpZCB2YXIoLS1jb21wb25lbnRzLWZvcm0tYm9yZGVyLWJsYWNrKTtcbiAgICAgICAgICAgICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29tcG9uZW50cy1mb3JtLWJhY2tncm91bmQtd2hpdGUpO1xuICAgICAgICAgICAgICAgIGA7XG4gICAgICAgIH1cbiAgICB9fTtcbmA7Il19 */"));
 
-var _excluded$1 = ["id", "label", "value", "variant", "disabled", "onChange", "checked"];
+var _excluded = ["id", "label", "value", "variant", "disabled", "onChange", "checked"];
 var Checkbox = _ref => {
   var {
       id = 'label',
@@ -4916,7 +4916,7 @@ var Checkbox = _ref => {
       onChange,
       checked = false
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$1);
+    props = _objectWithoutProperties(_ref, _excluded);
   var isDisabled = variant === "disabled" ? true : disabled;
   var isChecked = variant === "selected" ? true : checked;
   var handleChange = () => {
@@ -4986,16 +4986,29 @@ var Thumbnail = _ref => {
 
 function _EMOTION_STRINGIFIED_CSS_ERROR__$9() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 var TRO_Title = /*#__PURE__*/_styled("h3", process.env.NODE_ENV === "production" ? {
+  target: "e1lm6nwo3"
+} : {
+  target: "e1lm6nwo3",
+  label: "TRO_Title"
+})(process.env.NODE_ENV === "production" ? {
+  name: "9pb8x7",
+  styles: "font-family:var(--font-family-graphik, \"Graphik TH\");font-style:normal;font-weight:700;line-height:150%;margin:0"
+} : {
+  name: "9pb8x7",
+  styles: "font-family:var(--font-family-graphik, \"Graphik TH\");font-style:normal;font-weight:700;line-height:150%;margin:0/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRleHRTdHlsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ21DIiwiZmlsZSI6InRleHRTdHlsZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5leHBvcnQgY29uc3QgVFJPX1RpdGxlID0gc3R5bGVkLmgzIGBcbiAgICBmb250LWZhbWlseTogdmFyKC0tZm9udC1mYW1pbHktZ3JhcGhpaywgXCJHcmFwaGlrIFRIXCIpO1xuICAgIGZvbnQtc3R5bGU6IG5vcm1hbDtcbiAgICBmb250LXdlaWdodDogNzAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxNTAlO1xuICAgIG1hcmdpbjogMDtcbmA7XG5leHBvcnQgY29uc3QgVFJPX0hlYWRpbmcgPSBzdHlsZWQuaDMgYFxuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1oZWFkaW5nLCBcIktvbmRvbGFyIFRoYWlcIik7XG4gICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgIGZvbnQtd2VpZ2h0OiA3MDA7XG4gICAgbGluZS1oZWlnaHQ6IDE1MCU7XG4gICAgbWFyZ2luOiAwO1xuYDtcbmV4cG9ydCBjb25zdCBUUk9fRGVzY3JpcHRpb24gPSBzdHlsZWQucCBgXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWRlZmF1bHQsIFwiS2FMYVRlWGEgRGlzcGxheVwiKTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDQwMDtcbiAgICBsaW5lLWhlaWdodDogMTUwJTtcbiAgICBtYXJnaW46IDA7XG5gO1xuZXhwb3J0IGNvbnN0IFRST19JbmZvID0gc3R5bGVkLnNwYW4gYFxuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1kZWZhdWx0LCBcIkthTGFUZVhhIERpc3BsYXlcIik7XG4gICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgIGZvbnQtd2VpZ2h0OiA0MDA7XG4gICAgbGluZS1oZWlnaHQ6IDE1MCU7XG5gO1xuLy8jIHNvdXJjZU1hcHBpbmdVUkw9dGV4dFN0eWxlLmpzeC5tYXAiXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$9
+});
+var TRO_Heading = /*#__PURE__*/_styled("h3", process.env.NODE_ENV === "production" ? {
   target: "e1lm6nwo2"
 } : {
   target: "e1lm6nwo2",
-  label: "TRO_Title"
+  label: "TRO_Heading"
 })(process.env.NODE_ENV === "production" ? {
   name: "14cjv5",
   styles: "font-family:var(--font-family-heading, \"Kondolar Thai\");font-style:normal;font-weight:700;line-height:150%;margin:0"
 } : {
   name: "14cjv5",
-  styles: "font-family:var(--font-family-heading, \"Kondolar Thai\");font-style:normal;font-weight:700;line-height:150%;margin:0/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRleHRTdHlsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRWtDIiwiZmlsZSI6InRleHRTdHlsZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmV4cG9ydCBjb25zdCBUUk9fVGl0bGUgPSBzdHlsZWQuaDNgXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWhlYWRpbmcsIFwiS29uZG9sYXIgVGhhaVwiKTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDcwMDtcbiAgICBsaW5lLWhlaWdodDogMTUwJTtcbiAgICBtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVFJPX0Rlc2NyaXB0aW9uID0gc3R5bGVkLnBgXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWRlZmF1bHQsIFwiS2FMYVRlWGEgRGlzcGxheVwiKTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDQwMDtcbiAgICBsaW5lLWhlaWdodDogMTUwJTtcbiAgICBtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVFJPX0luZm8gPSBzdHlsZWQuc3BhbmBcbiAgICBmb250LWZhbWlseTogdmFyKC0tZm9udC1mYW1pbHktZGVmYXVsdCwgXCJLYUxhVGVYYSBEaXNwbGF5XCIpO1xuICAgIGZvbnQtc3R5bGU6IG5vcm1hbDtcbiAgICBmb250LXdlaWdodDogNDAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxNTAlO1xuYDsiXX0= */",
+  styles: "font-family:var(--font-family-heading, \"Kondolar Thai\");font-style:normal;font-weight:700;line-height:150%;margin:0/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRleHRTdHlsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUXFDIiwiZmlsZSI6InRleHRTdHlsZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5leHBvcnQgY29uc3QgVFJPX1RpdGxlID0gc3R5bGVkLmgzIGBcbiAgICBmb250LWZhbWlseTogdmFyKC0tZm9udC1mYW1pbHktZ3JhcGhpaywgXCJHcmFwaGlrIFRIXCIpO1xuICAgIGZvbnQtc3R5bGU6IG5vcm1hbDtcbiAgICBmb250LXdlaWdodDogNzAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxNTAlO1xuICAgIG1hcmdpbjogMDtcbmA7XG5leHBvcnQgY29uc3QgVFJPX0hlYWRpbmcgPSBzdHlsZWQuaDMgYFxuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1oZWFkaW5nLCBcIktvbmRvbGFyIFRoYWlcIik7XG4gICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgIGZvbnQtd2VpZ2h0OiA3MDA7XG4gICAgbGluZS1oZWlnaHQ6IDE1MCU7XG4gICAgbWFyZ2luOiAwO1xuYDtcbmV4cG9ydCBjb25zdCBUUk9fRGVzY3JpcHRpb24gPSBzdHlsZWQucCBgXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWRlZmF1bHQsIFwiS2FMYVRlWGEgRGlzcGxheVwiKTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDQwMDtcbiAgICBsaW5lLWhlaWdodDogMTUwJTtcbiAgICBtYXJnaW46IDA7XG5gO1xuZXhwb3J0IGNvbnN0IFRST19JbmZvID0gc3R5bGVkLnNwYW4gYFxuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1kZWZhdWx0LCBcIkthTGFUZVhhIERpc3BsYXlcIik7XG4gICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgIGZvbnQtd2VpZ2h0OiA0MDA7XG4gICAgbGluZS1oZWlnaHQ6IDE1MCU7XG5gO1xuLy8jIHNvdXJjZU1hcHBpbmdVUkw9dGV4dFN0eWxlLmpzeC5tYXAiXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__$9
 });
 var TRO_Description = /*#__PURE__*/_styled("p", process.env.NODE_ENV === "production" ? {
@@ -5008,7 +5021,7 @@ var TRO_Description = /*#__PURE__*/_styled("p", process.env.NODE_ENV === "produc
   styles: "font-family:var(--font-family-default, \"KaLaTeXa Display\");font-style:normal;font-weight:400;line-height:150%;margin:0"
 } : {
   name: "w44oy1",
-  styles: "font-family:var(--font-family-default, \"KaLaTeXa Display\");font-style:normal;font-weight:400;line-height:150%;margin:0/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRleHRTdHlsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBVXVDIiwiZmlsZSI6InRleHRTdHlsZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmV4cG9ydCBjb25zdCBUUk9fVGl0bGUgPSBzdHlsZWQuaDNgXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWhlYWRpbmcsIFwiS29uZG9sYXIgVGhhaVwiKTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDcwMDtcbiAgICBsaW5lLWhlaWdodDogMTUwJTtcbiAgICBtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVFJPX0Rlc2NyaXB0aW9uID0gc3R5bGVkLnBgXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWRlZmF1bHQsIFwiS2FMYVRlWGEgRGlzcGxheVwiKTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDQwMDtcbiAgICBsaW5lLWhlaWdodDogMTUwJTtcbiAgICBtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVFJPX0luZm8gPSBzdHlsZWQuc3BhbmBcbiAgICBmb250LWZhbWlseTogdmFyKC0tZm9udC1mYW1pbHktZGVmYXVsdCwgXCJLYUxhVGVYYSBEaXNwbGF5XCIpO1xuICAgIGZvbnQtc3R5bGU6IG5vcm1hbDtcbiAgICBmb250LXdlaWdodDogNDAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxNTAlO1xuYDsiXX0= */",
+  styles: "font-family:var(--font-family-default, \"KaLaTeXa Display\");font-style:normal;font-weight:400;line-height:150%;margin:0/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRleHRTdHlsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZXdDIiwiZmlsZSI6InRleHRTdHlsZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5leHBvcnQgY29uc3QgVFJPX1RpdGxlID0gc3R5bGVkLmgzIGBcbiAgICBmb250LWZhbWlseTogdmFyKC0tZm9udC1mYW1pbHktZ3JhcGhpaywgXCJHcmFwaGlrIFRIXCIpO1xuICAgIGZvbnQtc3R5bGU6IG5vcm1hbDtcbiAgICBmb250LXdlaWdodDogNzAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxNTAlO1xuICAgIG1hcmdpbjogMDtcbmA7XG5leHBvcnQgY29uc3QgVFJPX0hlYWRpbmcgPSBzdHlsZWQuaDMgYFxuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1oZWFkaW5nLCBcIktvbmRvbGFyIFRoYWlcIik7XG4gICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgIGZvbnQtd2VpZ2h0OiA3MDA7XG4gICAgbGluZS1oZWlnaHQ6IDE1MCU7XG4gICAgbWFyZ2luOiAwO1xuYDtcbmV4cG9ydCBjb25zdCBUUk9fRGVzY3JpcHRpb24gPSBzdHlsZWQucCBgXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWRlZmF1bHQsIFwiS2FMYVRlWGEgRGlzcGxheVwiKTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDQwMDtcbiAgICBsaW5lLWhlaWdodDogMTUwJTtcbiAgICBtYXJnaW46IDA7XG5gO1xuZXhwb3J0IGNvbnN0IFRST19JbmZvID0gc3R5bGVkLnNwYW4gYFxuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1kZWZhdWx0LCBcIkthTGFUZVhhIERpc3BsYXlcIik7XG4gICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgIGZvbnQtd2VpZ2h0OiA0MDA7XG4gICAgbGluZS1oZWlnaHQ6IDE1MCU7XG5gO1xuLy8jIHNvdXJjZU1hcHBpbmdVUkw9dGV4dFN0eWxlLmpzeC5tYXAiXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__$9
 });
 var TRO_Info = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "production" ? {
@@ -5021,20 +5034,21 @@ var TRO_Info = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "production
   styles: "font-family:var(--font-family-default, \"KaLaTeXa Display\");font-style:normal;font-weight:400;line-height:150%"
 } : {
   name: "36qrt",
-  styles: "font-family:var(--font-family-default, \"KaLaTeXa Display\");font-style:normal;font-weight:400;line-height:150%/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRleHRTdHlsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0JtQyIsImZpbGUiOiJ0ZXh0U3R5bGUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5leHBvcnQgY29uc3QgVFJPX1RpdGxlID0gc3R5bGVkLmgzYFxuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1oZWFkaW5nLCBcIktvbmRvbGFyIFRoYWlcIik7XG4gICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgIGZvbnQtd2VpZ2h0OiA3MDA7XG4gICAgbGluZS1oZWlnaHQ6IDE1MCU7XG4gICAgbWFyZ2luOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRST19EZXNjcmlwdGlvbiA9IHN0eWxlZC5wYFxuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1kZWZhdWx0LCBcIkthTGFUZVhhIERpc3BsYXlcIik7XG4gICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgIGZvbnQtd2VpZ2h0OiA0MDA7XG4gICAgbGluZS1oZWlnaHQ6IDE1MCU7XG4gICAgbWFyZ2luOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRST19JbmZvID0gc3R5bGVkLnNwYW5gXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWRlZmF1bHQsIFwiS2FMYVRlWGEgRGlzcGxheVwiKTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDQwMDtcbiAgICBsaW5lLWhlaWdodDogMTUwJTtcbmA7Il19 */",
+  styles: "font-family:var(--font-family-default, \"KaLaTeXa Display\");font-style:normal;font-weight:400;line-height:150%/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRleHRTdHlsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc0JvQyIsImZpbGUiOiJ0ZXh0U3R5bGUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuZXhwb3J0IGNvbnN0IFRST19UaXRsZSA9IHN0eWxlZC5oMyBgXG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5LWdyYXBoaWssIFwiR3JhcGhpayBUSFwiKTtcbiAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgZm9udC13ZWlnaHQ6IDcwMDtcbiAgICBsaW5lLWhlaWdodDogMTUwJTtcbiAgICBtYXJnaW46IDA7XG5gO1xuZXhwb3J0IGNvbnN0IFRST19IZWFkaW5nID0gc3R5bGVkLmgzIGBcbiAgICBmb250LWZhbWlseTogdmFyKC0tZm9udC1mYW1pbHktaGVhZGluZywgXCJLb25kb2xhciBUaGFpXCIpO1xuICAgIGZvbnQtc3R5bGU6IG5vcm1hbDtcbiAgICBmb250LXdlaWdodDogNzAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxNTAlO1xuICAgIG1hcmdpbjogMDtcbmA7XG5leHBvcnQgY29uc3QgVFJPX0Rlc2NyaXB0aW9uID0gc3R5bGVkLnAgYFxuICAgIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1kZWZhdWx0LCBcIkthTGFUZVhhIERpc3BsYXlcIik7XG4gICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgIGZvbnQtd2VpZ2h0OiA0MDA7XG4gICAgbGluZS1oZWlnaHQ6IDE1MCU7XG4gICAgbWFyZ2luOiAwO1xuYDtcbmV4cG9ydCBjb25zdCBUUk9fSW5mbyA9IHN0eWxlZC5zcGFuIGBcbiAgICBmb250LWZhbWlseTogdmFyKC0tZm9udC1mYW1pbHktZGVmYXVsdCwgXCJLYUxhVGVYYSBEaXNwbGF5XCIpO1xuICAgIGZvbnQtc3R5bGU6IG5vcm1hbDtcbiAgICBmb250LXdlaWdodDogNDAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxNTAlO1xuYDtcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPXRleHRTdHlsZS5qc3gubWFwIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__$9
 });
 
-var _excluded = ["children", "variant"];
-var Text = _ref => {
+var Text = _a => {
   var {
       children,
       variant = 'description'
-    } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded);
+    } = _a,
+    props = __rest(_a, ["children", "variant"]);
   switch (variant) {
     case 'title':
       return /*#__PURE__*/React.createElement(TRO_Title, props, children);
+    case 'heading':
+      return /*#__PURE__*/React.createElement(TRO_Heading, props, children);
     case 'description':
       return /*#__PURE__*/React.createElement(TRO_Description, props, children);
     case 'info':
@@ -5910,6 +5924,7 @@ var TROHeader = _ref => {
     isLoggedIn,
     username,
     userPhoto,
+    logoColor = 'Color',
     onLogin,
     onLogout,
     dataFile
@@ -5952,7 +5967,7 @@ var TROHeader = _ref => {
     href: 'https://www.thairath.co.th/home',
     className: "tro--header--icon"
   }, /*#__PURE__*/React.createElement(Logo, {
-    fill: "Color",
+    fill: logoColor,
     name: "tr_online"
   })), /*#__PURE__*/React.createElement(TRO_HeaderInner, null, /*#__PURE__*/React.createElement(TRO_WrapIcon, {
     onClick: isLoggedIn ? handleUserDropdown : onLogin
@@ -6551,7 +6566,9 @@ var TROEN_SlidebarNavOther = /*#__PURE__*/_styled("div", process.env.NODE_ENV ==
 // src/components/organisms/HeaderEN/headerEN.tsx
 var TROENHeader = _ref => {
   var {
-    dataFile = '/data/menuEN.json'
+    dataFile = '/data/menuEN.json',
+    logoColor = 'Color',
+    loading
   } = _ref;
   var [data, setData] = React.useState(null);
   var [isOpen, setIsOpen] = React.useState(false);
@@ -6635,9 +6652,9 @@ var TROENHeader = _ref => {
     window.addEventListener('scroll', handleScroll);
     return () => window.removeEventListener('scroll', handleScroll);
   }, [isMobileView]);
-  if (!data) return /*#__PURE__*/React.createElement("div", null, "Loading...");
+  if (!data) return /*#__PURE__*/React.createElement("div", null, loading);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TROEN_Header, null, /*#__PURE__*/React.createElement(TROEN_HeaderTOP, null, /*#__PURE__*/React.createElement(TROEN_WrapIcon, null, /*#__PURE__*/React.createElement(Logo, {
-    fill: "Color",
+    fill: logoColor,
     mode: "auto-width",
     name: "tr_online_en",
     size: "24"