@majoo-ui/react 1.48.3 → 1.48.4

package/index.umd.js

@@ -56,7 +56,7 @@
   var request__default = /*#__PURE__*/_interopDefaultLegacy(request);
   var ReactCrop__default = /*#__PURE__*/_interopDefaultLegacy(ReactCrop);
 
-  var _jsxFileName$_ = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\majoo-provider\\ThemeProvider.js";
+  var _jsxFileName$$ = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\majoo-provider\\ThemeProvider.js";
 
   function ThemeProvider({
     theme,
@@ -66,7 +66,7 @@
       className: theme,
       __self: this,
       __source: {
-        fileName: _jsxFileName$_,
+        fileName: _jsxFileName$$,
         lineNumber: 5,
         columnNumber: 10
       }
@@ -2350,9 +2350,9 @@
   };
   Flex$1.displayName = 'Flex';
 
-  const _excluded$y = ["children"],
+  const _excluded$z = ["children"],
         _excluded2$1 = ["children"];
-  var _jsxFileName$Z = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\layout\\grid\\Grid.js";
+  var _jsxFileName$_ = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\layout\\grid\\Grid.js";
   const GridComponent = styled('div', {
     display: 'grid',
     variants: {
@@ -2526,7 +2526,7 @@
     let {
       children
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$y);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$z);
 
     return /*#__PURE__*/React__default["default"].createElement(GridComponent, _extends({}, props, {
       css: Object.assign({}, props.css, {
@@ -2537,7 +2537,7 @@
       }),
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$Z,
+        fileName: _jsxFileName$_,
         lineNumber: 178,
         columnNumber: 5
       }
@@ -2593,7 +2593,7 @@
       }),
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$Z,
+        fileName: _jsxFileName$_,
         lineNumber: 232,
         columnNumber: 5
       }
@@ -2610,8 +2610,8 @@
   };
   GridItem.displayName = 'Grid Item';
 
-  const _excluded$x = ["children", "isCollapse", "css", "contentHeader"];
-  var _jsxFileName$Y = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\layout\\pageContainer\\PageContainer.js";
+  const _excluded$y = ["children", "isCollapse", "css", "contentHeader"];
+  var _jsxFileName$Z = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\layout\\pageContainer\\PageContainer.js";
   const StyledDiv$3 = styled(Flex$1, {
     justifyContent: 'center',
     marginLeft: 'auto',
@@ -2640,7 +2640,7 @@
       css,
       contentHeader
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$x);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$y);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledDiv$3, _extends({
       id: "retina-container",
@@ -2650,7 +2650,7 @@
     }, props, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$Y,
+        fileName: _jsxFileName$Z,
         lineNumber: 28,
         columnNumber: 5
       }
@@ -2928,8 +2928,8 @@
     }), void 0);
   });
 
-  const _excluded$w = ["id", "title", "description", "position", "dismissAfter", "variant", "onClick", "onRemove", "isExternalOfAction", "onClickOfAction", "captionOfAction", "hrefOfAction"];
-  var _jsxFileName$X = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\toast\\Toast.js";
+  const _excluded$x = ["id", "title", "description", "position", "dismissAfter", "variant", "onClick", "onRemove", "isExternalOfAction", "onClickOfAction", "captionOfAction", "hrefOfAction"];
+  var _jsxFileName$Y = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\toast\\Toast.js";
   const TOAST_WIDTH = 576;
   const ANIMATION_DURATION = 400;
   const TOP_RIGHT_POSITION = 'top-right';
@@ -3094,7 +3094,7 @@
       captionOfAction,
       hrefOfAction
     } = _ref,
-        rest = _objectWithoutPropertiesLoose(_ref, _excluded$w);
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded$x);
 
     const [isOpen, setIsOpen] = React__namespace.useState(false);
     const close = React__namespace.useCallback(() => {
@@ -3123,7 +3123,7 @@
       onExited: onRemove,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 205,
         columnNumber: 5
       }
@@ -3135,7 +3135,7 @@
     }, rest, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 216,
         columnNumber: 9
       }
@@ -3145,7 +3145,7 @@
       onClick: onClick,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 223,
         columnNumber: 11
       }
@@ -3153,7 +3153,7 @@
       direction: "column",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 224,
         columnNumber: 13
       }
@@ -3161,7 +3161,7 @@
       direction: "row",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 225,
         columnNumber: 15
       }
@@ -3169,7 +3169,7 @@
       variant: variant,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 226,
         columnNumber: 17
       }
@@ -3181,7 +3181,7 @@
       },
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 227,
         columnNumber: 17
       }
@@ -3189,7 +3189,7 @@
       justify: "between",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 235,
         columnNumber: 21
       }
@@ -3204,7 +3204,7 @@
       },
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 236,
         columnNumber: 23
       }
@@ -3213,7 +3213,7 @@
       color: "secondary",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 250,
         columnNumber: 19
       }
@@ -3228,7 +3228,7 @@
       hasTitle: !!title,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 254,
         columnNumber: 17
       }
@@ -3237,7 +3237,7 @@
       size: "16px",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 264,
         columnNumber: 19
       }
@@ -3252,7 +3252,7 @@
       },
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$X,
+        fileName: _jsxFileName$Y,
         lineNumber: 268,
         columnNumber: 17
       }
@@ -3276,7 +3276,7 @@
 
   const ToastContext = /*#__PURE__*/React__namespace.createContext({});
 
-  var _jsxFileName$W = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\toast\\ToastContainer.js";
+  var _jsxFileName$X = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\toast\\ToastContainer.js";
   const ToastBox = styled(Flex$1, {
     position: 'fixed',
     variants: {
@@ -3318,7 +3318,7 @@
     return /*#__PURE__*/React__namespace.createElement(helpers.Portal, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$W,
+        fileName: _jsxFileName$X,
         lineNumber: 43,
         columnNumber: 5
       }
@@ -3326,7 +3326,7 @@
       position: position,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$W,
+        fileName: _jsxFileName$X,
         lineNumber: 44,
         columnNumber: 7
       }
@@ -3337,7 +3337,7 @@
       }, toast, {
         __self: undefined,
         __source: {
-          fileName: _jsxFileName$W,
+          fileName: _jsxFileName$X,
           lineNumber: 46,
           columnNumber: 18
         }
@@ -3345,8 +3345,8 @@
     })));
   };
 
-  const _excluded$v = ["id"];
-  var _jsxFileName$V = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\toast\\context\\ToastProvider.js";
+  const _excluded$w = ["id"];
+  var _jsxFileName$W = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\toast\\context\\ToastProvider.js";
   let toastCount = 0;
 
   const ToastProvider = ({
@@ -3358,7 +3358,7 @@
       const {
         id
       } = toast,
-            rest = _objectWithoutPropertiesLoose(toast, _excluded$v); // eslint-disable-next-line no-plusplus
+            rest = _objectWithoutPropertiesLoose(toast, _excluded$w); // eslint-disable-next-line no-plusplus
 
 
       const uniqueId = ++toastCount;
@@ -3388,7 +3388,7 @@
       },
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$V,
+        fileName: _jsxFileName$W,
         lineNumber: 43,
         columnNumber: 5
       }
@@ -3397,7 +3397,7 @@
       position: TOP_RIGHT_POSITION,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$V,
+        fileName: _jsxFileName$W,
         lineNumber: 45,
         columnNumber: 7
       }
@@ -3406,7 +3406,7 @@
       position: TOP_LEFT_POSITION,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$V,
+        fileName: _jsxFileName$W,
         lineNumber: 49,
         columnNumber: 7
       }
@@ -3415,7 +3415,7 @@
       position: BOTTOM_RIGHT_POSITION,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$V,
+        fileName: _jsxFileName$W,
         lineNumber: 53,
         columnNumber: 7
       }
@@ -3424,14 +3424,14 @@
       position: BOTTOM_LEFT_POSITION,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$V,
+        fileName: _jsxFileName$W,
         lineNumber: 57,
         columnNumber: 7
       }
     }));
   };
 
-  var _jsxFileName$U = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\majoo-provider\\MajooProvider.js";
+  var _jsxFileName$V = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\majoo-provider\\MajooProvider.js";
 
   function MajooProvider({
     children,
@@ -3444,14 +3444,14 @@
       theme: theme$1,
       __self: this,
       __source: {
-        fileName: _jsxFileName$U,
+        fileName: _jsxFileName$V,
         lineNumber: 15,
         columnNumber: 10
       }
     }, /*#__PURE__*/React__default["default"].createElement(ToastProvider, {
       __self: this,
       __source: {
-        fileName: _jsxFileName$U,
+        fileName: _jsxFileName$V,
         lineNumber: 16,
         columnNumber: 5
       }
@@ -3465,8 +3465,8 @@
     disableGlobalStyle: PropTypes__default["default"].bool
   };
 
-  const _excluded$u = ["title", "description", "variant", "link", "linkText", "onClick", "onRemove", "children", "bannerBlock"];
-  var _jsxFileName$T = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\banner\\Banner.js";
+  const _excluded$v = ["title", "description", "variant", "link", "linkText", "onClick", "onRemove", "children", "bannerBlock"];
+  var _jsxFileName$U = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\banner\\Banner.js";
   const Context$2 = /*#__PURE__*/React__namespace.createContext();
   const StyledBanner = styled(Flex$1, {
     maxWidth: '100%',
@@ -3548,7 +3548,7 @@
   }, props, {
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$T,
+      fileName: _jsxFileName$U,
       lineNumber: 91,
       columnNumber: 3
     }
@@ -3570,7 +3570,7 @@
   }, props, {
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$T,
+      fileName: _jsxFileName$U,
       lineNumber: 108,
       columnNumber: 3
     }
@@ -3593,7 +3593,7 @@
   }) => /*#__PURE__*/React__namespace.createElement(Context$2.Consumer, {
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$T,
+      fileName: _jsxFileName$U,
       lineNumber: 125,
       columnNumber: 3
     }
@@ -3605,7 +3605,7 @@
     },
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$T,
+      fileName: _jsxFileName$U,
       lineNumber: 127,
       columnNumber: 7
     }
@@ -3632,7 +3632,7 @@
   const BannerClose = () => /*#__PURE__*/React__namespace.createElement(Context$2.Consumer, {
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$T,
+      fileName: _jsxFileName$U,
       lineNumber: 154,
       columnNumber: 3
     }
@@ -3640,11 +3640,11 @@
     onClick: e => {
       e.preventDefault();
       e.stopPropagation();
-      value === null || value === void 0 ? void 0 : value.onRemove();
+      value == null ? void 0 : value.onRemove();
     },
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$T,
+      fileName: _jsxFileName$U,
       lineNumber: 156,
       columnNumber: 7
     }
@@ -3653,7 +3653,7 @@
     size: "16px",
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$T,
+      fileName: _jsxFileName$U,
       lineNumber: 163,
       columnNumber: 9
     }
@@ -3663,7 +3663,7 @@
     return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 171,
         columnNumber: 5
       }
@@ -3673,7 +3673,7 @@
       align: "end",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 172,
         columnNumber: 7
       }
@@ -3686,21 +3686,21 @@
       },
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 173,
         columnNumber: 9
       }
     }, props.title && /*#__PURE__*/React__namespace.createElement(BannerTitle, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 181,
         columnNumber: 27
       }
     }, props.title), props.description && /*#__PURE__*/React__namespace.createElement(BannerDescription, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 182,
         columnNumber: 33
       }
@@ -3709,7 +3709,7 @@
       variant: props.variant,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 185,
         columnNumber: 11
       }
@@ -3717,12 +3717,12 @@
       onClick: e => {
         e.preventDefault();
         e.stopPropagation();
-        props === null || props === void 0 ? void 0 : props.onRemove();
+        props == null ? void 0 : props.onRemove();
       },
       closeCenter: !props.title && !props.link,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 190,
         columnNumber: 7
       }
@@ -3731,7 +3731,7 @@
       size: "16px",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 198,
         columnNumber: 9
       }
@@ -3750,7 +3750,7 @@
       children,
       bannerBlock
     } = _ref,
-        rest = _objectWithoutPropertiesLoose(_ref, _excluded$u);
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded$v);
 
     return /*#__PURE__*/React__namespace.createElement(StyledBanner, _extends({
       variant: variant,
@@ -3760,7 +3760,7 @@
     }, rest, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 206,
         columnNumber: 5
       }
@@ -3777,7 +3777,7 @@
       },
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 208,
         columnNumber: 9
       }
@@ -3788,7 +3788,7 @@
       },
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 215,
         columnNumber: 11
       }
@@ -3802,7 +3802,7 @@
       onRemove: onRemove,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$T,
+        fileName: _jsxFileName$U,
         lineNumber: 218,
         columnNumber: 9
       }
@@ -4115,8 +4115,8 @@
     }), void 0);
   });
 
-  const _excluded$t = ["className", "children", "color", "shadow", "radius", "padding", "title", "width", "textColor", "icon"];
-  var _jsxFileName$S = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\card\\Card.js";
+  const _excluded$u = ["className", "children", "color", "shadow", "radius", "padding", "title", "width", "textColor", "icon"];
+  var _jsxFileName$T = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\card\\Card.js";
   const CardComponent = styled('div', {
     padding: '12px',
     height: 'auto',
@@ -4253,7 +4253,7 @@
       textColor,
       icon
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$t);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$u);
 
     return /*#__PURE__*/React__default["default"].createElement(CardComponent, {
       className: className,
@@ -4266,7 +4266,7 @@
       }, props.css),
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$S,
+        fileName: _jsxFileName$T,
         lineNumber: 102,
         columnNumber: 5
       }
@@ -4274,14 +4274,14 @@
       color: color,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$S,
+        fileName: _jsxFileName$T,
         lineNumber: 113,
         columnNumber: 7
       }
     }), title !== '' ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, icon !== undefined ? /*#__PURE__*/React__default["default"].createElement(StyledTitle$2, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$S,
+        fileName: _jsxFileName$T,
         lineNumber: 117,
         columnNumber: 13
       }
@@ -4290,14 +4290,14 @@
       iconColor: color,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$S,
+        fileName: _jsxFileName$T,
         lineNumber: 118,
         columnNumber: 15
       }
     }, icon), title) : /*#__PURE__*/React__default["default"].createElement(StyledTitle$2, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$S,
+        fileName: _jsxFileName$T,
         lineNumber: 124,
         columnNumber: 13
       }
@@ -4319,12 +4319,12 @@
     color: 'green',
     shadow: false,
     radius: '$lg',
-    padding: '20px',
+    padding: '12px',
     title: ''
   };
 
-  const _excluded$s = ["children"];
-  var _jsxFileName$R = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\breadcrumb\\Breadcrumb.js";
+  const _excluded$t = ["children"];
+  var _jsxFileName$S = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\breadcrumb\\Breadcrumb.js";
   const BreadcrumbStyle = styled('nav', {
     wordWrap: 'break-word',
     '& li+li:before': {
@@ -4370,7 +4370,7 @@
     return /*#__PURE__*/React__default["default"].createElement(BreadcrumbLinkStyle, _extends({}, props, aria, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$R,
+        fileName: _jsxFileName$S,
         lineNumber: 42,
         columnNumber: 10
       }
@@ -4381,20 +4381,20 @@
     let {
       children
     } = _ref,
-        rest = _objectWithoutPropertiesLoose(_ref, _excluded$s);
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded$t);
 
     return /*#__PURE__*/React__default["default"].createElement(BreadcrumbStyle, _extends({}, rest, {
       "aria-label": "breadcrumb",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$R,
+        fileName: _jsxFileName$S,
         lineNumber: 47,
         columnNumber: 5
       }
     }), /*#__PURE__*/React__default["default"].createElement(Ol, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$R,
+        fileName: _jsxFileName$S,
         lineNumber: 48,
         columnNumber: 7
       }
@@ -4597,8 +4597,8 @@
   };
   Badge.displayName = 'Badge';
 
-  const _excluded$r = ["className", "img", "children", "onLoadingStatusChange", "delayMs", "onClick", "css"];
-  var _jsxFileName$Q = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\avatar\\Avatar.js";
+  const _excluded$s = ["className", "img", "children", "onLoadingStatusChange", "delayMs", "onClick", "css"];
+  var _jsxFileName$R = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\avatar\\Avatar.js";
   const StyledAvatar = styled(AvatarPrimitive__namespace.Root, {
     width: '32px',
     height: '32px',
@@ -4642,7 +4642,7 @@
       onClick,
       css
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$r);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$s);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledAvatar, _extends({
       className: className,
@@ -4651,7 +4651,7 @@
     }, props, {
       __self: this,
       __source: {
-        fileName: _jsxFileName$Q,
+        fileName: _jsxFileName$R,
         lineNumber: 46,
         columnNumber: 5
       }
@@ -4661,7 +4661,7 @@
       onLoadingStatusChange: onLoadingStatusChange,
       __self: this,
       __source: {
-        fileName: _jsxFileName$Q,
+        fileName: _jsxFileName$R,
         lineNumber: 47,
         columnNumber: 21
       }
@@ -4669,21 +4669,21 @@
       delayMs: delayMs,
       __self: this,
       __source: {
-        fileName: _jsxFileName$Q,
+        fileName: _jsxFileName$R,
         lineNumber: 48,
         columnNumber: 7
       }
     }, children !== undefined ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, children) : /*#__PURE__*/React__default["default"].createElement(StyledIcon, {
       __self: this,
       __source: {
-        fileName: _jsxFileName$Q,
+        fileName: _jsxFileName$R,
         lineNumber: 52,
         columnNumber: 11
       }
     }, /*#__PURE__*/React__default["default"].createElement(icons.UserFilled, {
       __self: this,
       __source: {
-        fileName: _jsxFileName$Q,
+        fileName: _jsxFileName$R,
         lineNumber: 53,
         columnNumber: 13
       }
@@ -4700,8 +4700,8 @@
     delayMs: 0
   };
 
-  const _excluded$q = ["className", "src", "alt", "width", "height", "objectFit", "fallback", "fallbackTitle", "css", "cssFallback", "rounded"];
-  var _jsxFileName$P = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\image\\Image.js";
+  const _excluded$r = ["className", "src", "alt", "width", "height", "objectFit", "fallback", "fallbackTitle", "css", "cssFallback", "rounded"];
+  var _jsxFileName$Q = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\image\\Image.js";
   const ContainerFallback = styled(Flex$1, {
     boxSizing: 'border-box',
     border: '2px dashed #C0C4C4',
@@ -4750,7 +4750,7 @@
       cssFallback,
       rounded
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$q);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$r);
 
     if (src || fallback) {
       return /*#__PURE__*/React__default["default"].createElement(StyledImage, _extends({
@@ -4767,7 +4767,7 @@
       }, props, {
         __self: this,
         __source: {
-          fileName: _jsxFileName$P,
+          fileName: _jsxFileName$Q,
           lineNumber: 59,
           columnNumber: 7
         }
@@ -4783,14 +4783,14 @@
         }, cssFallback),
         __self: this,
         __source: {
-          fileName: _jsxFileName$P,
+          fileName: _jsxFileName$Q,
           lineNumber: 73,
           columnNumber: 7
         }
       }, /*#__PURE__*/React__default["default"].createElement(TextFallback, {
         __self: this,
         __source: {
-          fileName: _jsxFileName$P,
+          fileName: _jsxFileName$Q,
           lineNumber: 74,
           columnNumber: 9
         }
@@ -4858,8 +4858,8 @@
     fallbackTitle: 'Tidak ada foto'
   };
 
-  const _excluded$p = ["children", "label", "color", "css", "withClick", "side", "align"];
-  var _jsxFileName$O = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\tooltip\\Tooltip.js";
+  const _excluded$q = ["children", "label", "color", "css", "withClick", "side", "align"];
+  var _jsxFileName$P = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\tooltip\\Tooltip.js";
   const slideUpAndFade$1 = keyframes({
     '0%': {
       opacity: 0,
@@ -4967,14 +4967,14 @@
       side,
       align
     } = _ref,
-        rest = _objectWithoutPropertiesLoose(_ref, _excluded$p);
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded$q);
 
     const [open, setOpen] = React.useState(false);
     return /*#__PURE__*/React__default["default"].createElement(TooltipBase, _extends({}, rest, {
       open: withClick ? open : undefined,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$O,
+        fileName: _jsxFileName$P,
         lineNumber: 89,
         columnNumber: 5
       }
@@ -4982,7 +4982,7 @@
       asChild: true,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$O,
+        fileName: _jsxFileName$P,
         lineNumber: 90,
         columnNumber: 7
       }
@@ -4990,7 +4990,7 @@
       onClick: () => withClick ? setOpen(!open) : undefined,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$O,
+        fileName: _jsxFileName$P,
         lineNumber: 91,
         columnNumber: 9
       }
@@ -5001,7 +5001,7 @@
       css: color === 'dark' ? Object.assign({}, dark, css) : Object.assign({}, ligth, css),
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$O,
+        fileName: _jsxFileName$P,
         lineNumber: 93,
         columnNumber: 7
       }
@@ -5010,7 +5010,7 @@
       css: color === 'dark' ? darkArrow : lightArrow,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$O,
+        fileName: _jsxFileName$P,
         lineNumber: 100,
         columnNumber: 9
       }
@@ -5032,15 +5032,15 @@
     children: /*#__PURE__*/React__default["default"].createElement("div", {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$O,
+        fileName: _jsxFileName$P,
         lineNumber: 119,
         columnNumber: 13
       }
     })
   };
 
-  const _excluded$o = ["className", "value", "max", "getValueLabel", "color", "size", "rounded", "width"];
-  var _jsxFileName$N = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\progress\\Progress.js";
+  const _excluded$p = ["className", "value", "max", "getValueLabel", "color", "size", "rounded", "width"];
+  var _jsxFileName$O = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\progress\\Progress.js";
   const StyledProgress$1 = react.styled(ProgressPrimitive__namespace.Root, {
     position: 'relative',
     overflow: 'hidden',
@@ -5158,7 +5158,7 @@
       rounded,
       width
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$o);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$p);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledProgress$1, _extends({
       className: className,
@@ -5174,7 +5174,7 @@
     }, props, {
       __self: this,
       __source: {
-        fileName: _jsxFileName$N,
+        fileName: _jsxFileName$O,
         lineNumber: 88,
         columnNumber: 5
       }
@@ -5187,7 +5187,7 @@
       },
       __self: this,
       __source: {
-        fileName: _jsxFileName$N,
+        fileName: _jsxFileName$O,
         lineNumber: 89,
         columnNumber: 7
       }
@@ -5300,8 +5300,8 @@
   });
   FormGroup.displayName = 'FormGroup';
 
-  const _excluded$n = ["children", "htmlFor", "variant", "tooltipLabel", "count", "maxCount", "labelCss"];
-  var _jsxFileName$M = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\FormLabel\\Label.js";
+  const _excluded$o = ["children", "htmlFor", "variant", "tooltipLabel", "count", "maxCount", "labelCss"];
+  var _jsxFileName$N = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\FormLabel\\Label.js";
   const StyledLabel$1 = styled(LabelPrimitive__namespace.Root, Text$1, {
     display: 'inline-block',
     fontSize: '$label',
@@ -5333,14 +5333,14 @@
       maxCount,
       labelCss
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$n);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$o);
 
     return /*#__PURE__*/React__default["default"].createElement(Flex$1, {
       justify: "between",
       className: "form-label",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$M,
+        fileName: _jsxFileName$N,
         lineNumber: 36,
         columnNumber: 5
       }
@@ -5350,7 +5350,7 @@
     }, props, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$M,
+        fileName: _jsxFileName$N,
         lineNumber: 37,
         columnNumber: 7
       }
@@ -5360,7 +5360,7 @@
       css: labelCss,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$M,
+        fileName: _jsxFileName$N,
         lineNumber: 38,
         columnNumber: 9
       }
@@ -5375,7 +5375,7 @@
       },
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$M,
+        fileName: _jsxFileName$N,
         lineNumber: 42,
         columnNumber: 11
       }
@@ -5383,14 +5383,14 @@
       label: tooltipLabel,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$M,
+        fileName: _jsxFileName$N,
         lineNumber: 56,
         columnNumber: 11
       }
     }, /*#__PURE__*/React__default["default"].createElement(StyledHelpIcon, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$M,
+        fileName: _jsxFileName$N,
         lineNumber: 57,
         columnNumber: 13
       }
@@ -5399,7 +5399,7 @@
       color: "disable",
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$M,
+        fileName: _jsxFileName$N,
         lineNumber: 62,
         columnNumber: 9
       }
@@ -5415,8 +5415,8 @@
   };
   FormLabel.displayName = 'FormLabel';
 
-  const _excluded$m = ["children", "error"];
-  var _jsxFileName$L = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\FormHelper\\Helper.js";
+  const _excluded$n = ["children", "error"];
+  var _jsxFileName$M = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\FormHelper\\Helper.js";
   const StyledHelper = styled(Text$1, {
     display: 'inline-block',
     color: '$textSecondary',
@@ -5434,7 +5434,7 @@
       children,
       error
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$m);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$n);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledHelper, _extends({
       error: error,
@@ -5443,7 +5443,7 @@
     }, props, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$L,
+        fileName: _jsxFileName$M,
         lineNumber: 19,
         columnNumber: 3
       }
@@ -5455,7 +5455,7 @@
   };
   FormHelper.displayName = 'FormHelper';
 
-  var _jsxFileName$K = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputCheckbox\\CheckboxGroup.js";
+  var _jsxFileName$L = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputCheckbox\\CheckboxGroup.js";
   const CheckboxContext = /*#__PURE__*/React.createContext();
 
   const CheckboxGroup = ({
@@ -5500,7 +5500,7 @@
       value: values,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$K,
+        fileName: _jsxFileName$L,
         lineNumber: 35,
         columnNumber: 5
       }
@@ -5518,7 +5518,7 @@
   };
   CheckboxGroup.displayName = 'CheckboxGroup';
 
-  var _jsxFileName$J = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputCheckbox\\icon\\CheckOutline.js";
+  var _jsxFileName$K = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputCheckbox\\icon\\CheckOutline.js";
 
   const CheckOutline$1 = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -5536,7 +5536,7 @@
   }, props, {
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$J,
+      fileName: _jsxFileName$K,
       lineNumber: 4,
       columnNumber: 3
     }
@@ -5548,7 +5548,7 @@
     },
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$J,
+      fileName: _jsxFileName$K,
       lineNumber: 19,
       columnNumber: 5
     }
@@ -5560,13 +5560,13 @@
     },
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$J,
+      fileName: _jsxFileName$K,
       lineNumber: 26,
       columnNumber: 5
     }
   }));
 
-  var _jsxFileName$I = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputCheckbox\\icon\\MinusOutline.js";
+  var _jsxFileName$J = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputCheckbox\\icon\\MinusOutline.js";
 
   const SvgMinusOutline = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -5584,7 +5584,7 @@
   }, props, {
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$I,
+      fileName: _jsxFileName$J,
       lineNumber: 4,
       columnNumber: 3
     }
@@ -5596,7 +5596,7 @@
     },
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$I,
+      fileName: _jsxFileName$J,
       lineNumber: 19,
       columnNumber: 5
     }
@@ -5608,14 +5608,14 @@
     d: "M14.31 10.41H3.9v-2.6h10.41z",
     __self: undefined,
     __source: {
-      fileName: _jsxFileName$I,
+      fileName: _jsxFileName$J,
       lineNumber: 26,
       columnNumber: 5
     }
   }));
 
-  const _excluded$l = ["id", "checked", "indeterminate", "disabled", "onCheckedChange", "label", "index", "value"];
-  var _jsxFileName$H = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputCheckbox\\InputCheckbox.js";
+  const _excluded$m = ["id", "checked", "indeterminate", "disabled", "onCheckedChange", "label", "index", "value"];
+  var _jsxFileName$I = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputCheckbox\\InputCheckbox.js";
   const StyledIndicator$2 = styled(CheckboxPrimitive__namespace.Indicator, {
     alignItems: 'center',
     display: 'flex',
@@ -5674,13 +5674,13 @@
       index,
       value
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$l);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$m);
 
     const context = React.useContext(CheckboxContext);
     const [isChecked, setChecked] = React.useState(false);
     React.useEffect(() => {
       const checkValue = context && context.checkedItems.includes(value) || checked || indeterminate;
-      setChecked(checkValue !== null && checkValue !== void 0 ? checkValue : false);
+      setChecked(checkValue != null ? checkValue : false);
     }, [checked, indeterminate, context]);
     return /*#__PURE__*/React__default["default"].createElement(StyledCheckbox, _extends({
       id: id,
@@ -5697,28 +5697,28 @@
     }, props, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$H,
+        fileName: _jsxFileName$I,
         lineNumber: 64,
         columnNumber: 5
       }
     }), /*#__PURE__*/React__default["default"].createElement(StyledIndicator$2, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$H,
+        fileName: _jsxFileName$I,
         lineNumber: 77,
         columnNumber: 7
       }
     }, indeterminate ? /*#__PURE__*/React__default["default"].createElement(SvgMinusOutline, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$H,
+        fileName: _jsxFileName$I,
         lineNumber: 77,
         columnNumber: 41
       }
     }) : /*#__PURE__*/React__default["default"].createElement(CheckOutline$1, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$H,
+        fileName: _jsxFileName$I,
         lineNumber: 77,
         columnNumber: 60
       }
@@ -5732,14 +5732,14 @@
       gap: 4,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$H,
+        fileName: _jsxFileName$I,
         lineNumber: 84,
         columnNumber: 5
       }
     }, /*#__PURE__*/React__default["default"].createElement(Checkbox, _extends({}, props, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$H,
+        fileName: _jsxFileName$I,
         lineNumber: 85,
         columnNumber: 7
       }
@@ -5755,14 +5755,14 @@
       },
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$H,
+        fileName: _jsxFileName$I,
         lineNumber: 86,
         columnNumber: 7
       }
     }, props.label)) : /*#__PURE__*/React__default["default"].createElement(Checkbox, _extends({}, props, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$H,
+        fileName: _jsxFileName$I,
         lineNumber: 101,
         columnNumber: 5
       }
@@ -5780,8 +5780,8 @@
   };
   InputCheckbox.displayName = 'InputCheckbox';
 
-  const _excluded$k = ["children", "size"];
-  var _jsxFileName$G = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputGroup\\InputGroup.js";
+  const _excluded$l = ["children", "size"];
+  var _jsxFileName$H = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputGroup\\InputGroup.js";
   const InputGroupStyle = styled('div', {
     display: 'flex',
     width: '100%',
@@ -5897,7 +5897,7 @@
       children,
       size = 'lg'
     } = _ref,
-        rest = _objectWithoutPropertiesLoose(_ref, _excluded$k);
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded$l);
 
     const isLetter = children.some(child => child.type.name === 'InputPrefix' || child.type.name === 'InputSuffix' || child.type.name === 'InputLeftElement' || child.type.name === 'InputRightElement');
     const isElement = children.some(child => child.type.name === 'InputLeftElement' || child.type.name === 'InputRightElement');
@@ -5921,7 +5921,7 @@
       isElement: isElement,
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$G,
+        fileName: _jsxFileName$H,
         lineNumber: 146,
         columnNumber: 10
       }
@@ -6067,8 +6067,8 @@
     children: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].node])
   };
 
-  const _excluded$j = ["disabled", "readOnly"];
-  var _jsxFileName$F = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputText\\InputText.js";
+  const _excluded$k = ["disabled", "readOnly"];
+  var _jsxFileName$G = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputText\\InputText.js";
   const disabledStyle = {
     backgroundColor: '$formDisable',
     color: '$textDisable',
@@ -6080,7 +6080,7 @@
       border: '1px solid $colors$gray300'
     }
   };
-  const StyledInput = styled('input', {
+  const StyledInput$1 = styled('input', {
     // Reset
     appearance: 'none',
     boxSizing: 'border-box',
@@ -6210,9 +6210,9 @@
       disabled,
       readOnly
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$j);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$k);
 
-    return /*#__PURE__*/React__default["default"].createElement(StyledInput, _extends({
+    return /*#__PURE__*/React__default["default"].createElement(StyledInput$1, _extends({
       ref: ref,
       disabled: disabled,
       isDisabled: disabled,
@@ -6221,7 +6221,7 @@
     }, props, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$F,
+        fileName: _jsxFileName$G,
         lineNumber: 151,
         columnNumber: 3
       }
@@ -6229,9 +6229,9 @@
   });
   InputText.displayName = 'InputText';
 
-  const _excluded$i = ["disabled", "readOnly"];
-  var _jsxFileName$E = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputTextArea\\InputTextArea.js";
-  const StyledTextArea = styled(StyledInput, {
+  const _excluded$j = ["disabled", "readOnly"];
+  var _jsxFileName$F = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputTextArea\\InputTextArea.js";
+  const StyledTextArea = styled(StyledInput$1, {
     variants: {
       size: {
         sm: {
@@ -6251,7 +6251,7 @@
       disabled,
       readOnly
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$i);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$j);
 
     return /*#__PURE__*/React__default["default"].createElement(StyledTextArea, _extends({
       ref: ref,
@@ -6262,7 +6262,7 @@
     }, props, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$E,
+        fileName: _jsxFileName$F,
         lineNumber: 22,
         columnNumber: 3
       }
@@ -6275,25 +6275,25 @@
 
   const InputRadioContext = /*#__PURE__*/React__default["default"].createContext();
 
-  var _jsxFileName$D = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputRadio\\InputRadioGroup.js";
+  var _jsxFileName$E = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputRadio\\InputRadioGroup.js";
   const RadioGroup = styled(RadioGroupPrimitive__namespace.Root, Flex$1);
   function InputRadioGroup(props) {
-    return (props === null || props === void 0 ? void 0 : props.children) && /*#__PURE__*/React__default["default"].createElement(InputRadioContext.Provider, {
+    return (props == null ? void 0 : props.children) && /*#__PURE__*/React__default["default"].createElement(InputRadioContext.Provider, {
       value: props,
       __self: this,
       __source: {
-        fileName: _jsxFileName$D,
+        fileName: _jsxFileName$E,
         lineNumber: 13,
         columnNumber: 7
       }
     }, /*#__PURE__*/React__default["default"].createElement(RadioGroup, _extends({}, props, {
       __self: this,
       __source: {
-        fileName: _jsxFileName$D,
+        fileName: _jsxFileName$E,
         lineNumber: 14,
         columnNumber: 9
       }
-    }), React__default["default"].Children.map(props === null || props === void 0 ? void 0 : props.children, child => /*#__PURE__*/React__default["default"].cloneElement(child, {
+    }), React__default["default"].Children.map(props == null ? void 0 : props.children, child => /*#__PURE__*/React__default["default"].cloneElement(child, {
       style: Object.assign({}, child.props.style, {
         opacity: 1
       })
@@ -6307,8 +6307,8 @@
   };
   InputRadioGroup.displayName = 'InputRadioGroup';
 
-  const _excluded$h = ["id", "disabled", "css", "inputType", "inputProps"];
-  var _jsxFileName$C = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputRadio\\InputRadio.js";
+  const _excluded$i = ["id", "disabled", "css", "inputType", "inputProps"];
+  var _jsxFileName$D = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputRadio\\InputRadio.js";
   const INDICATOR_BASE_STYLES = {
     alignItems: 'center',
     display: 'flex',
@@ -6424,7 +6424,7 @@
       inputType,
       inputProps
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, _excluded$h);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$i);
 
     function renderInputType(type, checked) {
       switch (type) {
@@ -6433,7 +6433,7 @@
             disabled: disabled || checked !== props.value,
             __self: this,
             __source: {
-              fileName: _jsxFileName$C,
+              fileName: _jsxFileName$D,
               lineNumber: 124,
               columnNumber: 16
             }
@@ -6444,7 +6444,7 @@
             disabled: disabled || checked !== props.value,
             __self: this,
             __source: {
-              fileName: _jsxFileName$C,
+              fileName: _jsxFileName$D,
               lineNumber: 127,
               columnNumber: 16
             }
@@ -6464,7 +6464,7 @@
             },
             __self: this,
             __source: {
-              fileName: _jsxFileName$C,
+              fileName: _jsxFileName$D,
               lineNumber: 131,
               columnNumber: 11
             }
@@ -6475,7 +6475,7 @@
     return /*#__PURE__*/React__default["default"].createElement(InputRadioContext.Consumer, {
       __self: undefined,
       __source: {
-        fileName: _jsxFileName$C,
+        fileName: _jsxFileName$D,
         lineNumber: 150,
         columnNumber: 5
       }
@@ -6484,7 +6484,7 @@
       value,
       outlined
     }) => {
-      const checked = value !== null && value !== void 0 ? value : defaultValue;
+      const checked = value != null ? value : defaultValue;
       return /*#__PURE__*/React__default["default"].createElement(Container$6, {
         align: "center",
         gap: 4,
@@ -6494,7 +6494,7 @@
         css: css,
         __self: undefined,
         __source: {
-          fileName: _jsxFileName$C,
+          fileName: _jsxFileName$D,
           lineNumber: 155,
           columnNumber: 11
         }
@@ -6504,14 +6504,14 @@
       }, props, {
         __self: undefined,
         __source: {
-          fileName: _jsxFileName$C,
+          fileName: _jsxFileName$D,
           lineNumber: 163,
           columnNumber: 13
         }
       }), /*#__PURE__*/React__default["default"].createElement(StyledIndicator$1, {
         __self: undefined,
         __source: {
-          fileName: _jsxFileName$C,
+          fileName: _jsxFileName$D,
           lineNumber: 164,
           columnNumber: 15
         }
@@ -6558,7 +6558,9 @@
   };
   InputRightElement.name = 'InputRightElement';
 
-  const InputNumber = styled(NumberFormat__default["default"], {
+  const _excluded$h = ["placeholder", "value", "size", "isInvalid", "readOnly", "disabled"];
+  var _jsxFileName$C = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputNumber\\InputNumber.js";
+  const StyledInput = styled(NumberFormat__default["default"], {
     // Reset
     appearance: 'none',
     boxSizing: 'border-box',
@@ -6621,7 +6623,7 @@
       }
     }],
     variants: {
-      readOnly: {
+      isReadOnly: {
         true: {
           backgroundColor: '$formDisable'
         }
@@ -6687,6 +6689,35 @@
       size: 'lg'
     }
   });
+  const InputNumber = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
+    let {
+      placeholder,
+      value,
+      size,
+      isInvalid,
+      readOnly,
+      disabled
+    } = _ref,
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$h);
+
+    return /*#__PURE__*/React__default["default"].createElement(StyledInput, _extends({
+      ref: ref,
+      placeholder: placeholder,
+      value: value,
+      size: size,
+      isInvalid: isInvalid,
+      readOnly: readOnly,
+      isReadOnly: readOnly,
+      disabled: disabled
+    }, props, {
+      __self: undefined,
+      __source: {
+        fileName: _jsxFileName$C,
+        lineNumber: 147,
+        columnNumber: 3
+      }
+    }));
+  });
   InputNumber.propTypes = {
     placeholder: PropTypes__default["default"].string,
     value: PropTypes__default["default"].string,
@@ -7492,7 +7523,7 @@
           return;
         }
 
-        if (pattern && pattern !== null && pattern !== void 0 && pattern.regex) {
+        if (pattern && pattern != null && pattern.regex) {
           const regex = new RegExp(pattern.regex);
 
           if (!regex.test(event.target.value)) {
@@ -7558,7 +7589,7 @@
         lineNumber: 173,
         columnNumber: 9
       }
-    })), regexError && pattern && (pattern !== null && pattern !== void 0 && pattern.errorMessage ? /*#__PURE__*/React__default["default"].createElement(FormHelper, {
+    })), regexError && pattern && (pattern != null && pattern.errorMessage ? /*#__PURE__*/React__default["default"].createElement(FormHelper, {
       color: "red",
       __self: this,
       __source: {
@@ -10491,8 +10522,8 @@
       ref: floating,
       style: Object.assign({
         position: strategy,
-        top: isMobile ? 0 : y !== null && y !== void 0 ? y : '',
-        left: isMobile ? 0 : x !== null && x !== void 0 ? x : '',
+        top: isMobile ? 0 : y != null ? y : '',
+        left: isMobile ? 0 : x != null ? x : '',
         zIndex: zIndices.popover
       }, style)
     }), {
@@ -11486,7 +11517,7 @@
         props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
 
     const getValue = () => {
-      let value = props === null || props === void 0 ? void 0 : props.value;
+      let value = props == null ? void 0 : props.value;
 
       if (typeof value === 'number' || parseInt(value)) {
         if (Math.sign(value) === 1 || Math.sign(value) === 0) {
@@ -16110,6 +16141,11 @@
       }
     }, /*#__PURE__*/React__default["default"].createElement(Text$1, {
       variant: "caption",
+      css: {
+        fontSize: 12,
+        fontWeight: 400,
+        color: '$textPrimary'
+      },
       __self: undefined,
       __source: {
         fileName: _jsxFileName$i,
@@ -16140,7 +16176,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$i,
-        lineNumber: 170,
+        lineNumber: 172,
         columnNumber: 9
       }
     })));
@@ -16441,6 +16477,7 @@
                     unsortable: column.unsortable
                   }, {
                     children: jsxRuntime.jsx(TableHeadCellContent, __assign({
+                      isMobile: true,
                       heading: "headerTable",
                       color: "secondary"
                     }, {
@@ -16610,7 +16647,7 @@
   var TableHeaderCellContainer = styled(Flex$1, {
     flexDirection: 'row',
     alignItems: 'center',
-    justifyContent: 'space-between',
+    gap: '$spacing-03',
     userSelect: 'none',
     size: '100%',
     minWidth: 0,
@@ -16680,14 +16717,15 @@
       },
       isMobile: {
         true: {
-          padding: '0'
+          padding: '0',
+          justifyContent: 'space-between',
+          gap: 0
         }
       }
     }
   });
   var TableHeadCellContent = styled(Heading, {
     userSelect: 'none',
-    width: '100%',
     textAlign: 'start',
     position: 'relative',
     '& > *': {
@@ -16695,6 +16733,13 @@
     },
     '& > span:last-child': {
       paddingLeft: '$spacing-03'
+    },
+    variants: {
+      isMobile: {
+        true: {
+          width: '100%'
+        }
+      }
     }
   });
   var TableBody$2 = styled('tbody', {});
@@ -18641,7 +18686,7 @@
         if (!props.onOpenAutoFocus) {
           e.preventDefault();
         } else {
-          props === null || props === void 0 ? void 0 : props.onOpenAutoFocus();
+          props == null ? void 0 : props.onOpenAutoFocus();
         }
       },
       __self: undefined,
@@ -18764,8 +18809,8 @@
       size: "sm",
       onClick: buttonConfirm,
       buttonType: props.dialogType,
-      disabled: props === null || props === void 0 ? void 0 : props.disabledButton
-    }, props === null || props === void 0 ? void 0 : props.actionButtonProps, {
+      disabled: props == null ? void 0 : props.disabledButton
+    }, props == null ? void 0 : props.actionButtonProps, {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$b,
@@ -18788,8 +18833,8 @@
         flex: props.isMobile && 1
       },
       buttonType: "ghost",
-      disabled: props === null || props === void 0 ? void 0 : props.disabledButton
-    }, props === null || props === void 0 ? void 0 : props.cancelButtonProps, {
+      disabled: props == null ? void 0 : props.disabledButton
+    }, props == null ? void 0 : props.cancelButtonProps, {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$b,
@@ -18811,8 +18856,8 @@
       css: {
         flex: props.isMobile && 1
       },
-      disabled: props === null || props === void 0 ? void 0 : props.disabledButton
-    }, props === null || props === void 0 ? void 0 : props.actionButtonProps, {
+      disabled: props == null ? void 0 : props.disabledButton
+    }, props == null ? void 0 : props.actionButtonProps, {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$b,
@@ -18974,8 +19019,8 @@
       css: {
         flex: props.isMobile && 1
       },
-      disabled: props === null || props === void 0 ? void 0 : props.disabledButton
-    }, props === null || props === void 0 ? void 0 : props.actionButtonProps, {
+      disabled: props == null ? void 0 : props.disabledButton
+    }, props == null ? void 0 : props.actionButtonProps, {
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
@@ -18998,8 +19043,8 @@
         flex: props.isMobile && 1
       },
       buttonType: "ghost",
-      disabled: props === null || props === void 0 ? void 0 : props.disabledButton
-    }, props === null || props === void 0 ? void 0 : props.cancelButtonProps, {
+      disabled: props == null ? void 0 : props.disabledButton
+    }, props == null ? void 0 : props.cancelButtonProps, {
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
@@ -19021,8 +19066,8 @@
       css: {
         flex: props.isMobile && 1
       },
-      disabled: props === null || props === void 0 ? void 0 : props.disabledButton
-    }, props === null || props === void 0 ? void 0 : props.actionButtonProps, {
+      disabled: props == null ? void 0 : props.disabledButton
+    }, props == null ? void 0 : props.actionButtonProps, {
       __self: this,
       __source: {
         fileName: _jsxFileName$b,
@@ -21533,7 +21578,7 @@
                 file: fileProgress,
                 indexReplace: indexReplace.current,
                 isReplace: indexReplace.current !== null
-              })) === null || _onChange === void 0 ? void 0 : (_onChange$then = _onChange.then(() => setError(null))) === null || _onChange$then === void 0 ? void 0 : _onChange$then.catch(error => setError(error.message));
+              })) == null ? void 0 : (_onChange$then = _onChange.then(() => setError(null))) == null ? void 0 : _onChange$then.catch(error => setError(error.message));
             }
           }).then(result => {
             var _onChange2, _onChange2$then;
@@ -21555,7 +21600,7 @@
               file: fileSuccess,
               indexReplace: indexReplace.current,
               isReplace: indexReplace.current !== null
-            })) === null || _onChange2 === void 0 ? void 0 : (_onChange2$then = _onChange2.then(() => setError(null))) === null || _onChange2$then === void 0 ? void 0 : _onChange2$then.catch(error => setError(error.message));
+            })) == null ? void 0 : (_onChange2$then = _onChange2.then(() => setError(null))) == null ? void 0 : _onChange2$then.catch(error => setError(error.message));
           }).catch(error => {
             var _onChange3, _onChange3$then;
 
@@ -21576,7 +21621,7 @@
               file: fileError,
               indexReplace: indexReplace.current,
               isReplace: indexReplace.current !== null
-            })) === null || _onChange3 === void 0 ? void 0 : (_onChange3$then = _onChange3.then(() => setError(null))) === null || _onChange3$then === void 0 ? void 0 : _onChange3$then.catch(error => setError(error.message));
+            })) == null ? void 0 : (_onChange3$then = _onChange3.then(() => setError(null))) == null ? void 0 : _onChange3$then.catch(error => setError(error.message));
           });
         } else {
           var _onChange4, _onChange4$then;
@@ -21586,7 +21631,7 @@
             file: newFile,
             indexReplace: indexReplace.current,
             isReplace: indexReplace.current !== null
-          })) === null || _onChange4 === void 0 ? void 0 : (_onChange4$then = _onChange4.then(() => setError(null))) === null || _onChange4$then === void 0 ? void 0 : _onChange4$then.catch(error => setError(error.message));
+          })) == null ? void 0 : (_onChange4$then = _onChange4.then(() => setError(null))) == null ? void 0 : _onChange4$then.catch(error => setError(error.message));
         }
 
         if (indexReplace.current !== null) {
@@ -21613,9 +21658,9 @@
     }
 
     function handleCrop() {
-      if (completedCrop !== null && completedCrop !== void 0 && completedCrop.width && completedCrop !== null && completedCrop !== void 0 && completedCrop.height && imgRef.current) {
+      if (completedCrop != null && completedCrop.width && completedCrop != null && completedCrop.height && imgRef.current) {
         imgPreview(imgRef.current, completedCrop).then(blob => {
-          const file = new File([blob], fileState === null || fileState === void 0 ? void 0 : fileState.name, {
+          const file = new File([blob], fileState == null ? void 0 : fileState.name, {
             type: blob.type
           });
           handleUpload([file]);
@@ -21683,22 +21728,22 @@
     function handleOpenFile(file) {
       var _String, _file$name;
 
-      let extension = (_String = String(file === null || file === void 0 ? void 0 : (_file$name = file.name) === null || _file$name === void 0 ? void 0 : _file$name.split('.').pop())) === null || _String === void 0 ? void 0 : _String.toLowerCase();
+      let extension = (_String = String(file == null ? void 0 : (_file$name = file.name) == null ? void 0 : _file$name.split('.').pop())) == null ? void 0 : _String.toLowerCase();
 
       if (extension === 'pdf') {
-        window.open(file === null || file === void 0 ? void 0 : file.url);
+        window.open(file == null ? void 0 : file.url);
       } else {
-        request__default["default"].get(file === null || file === void 0 ? void 0 : file.url).end((err, res) => {
+        request__default["default"].get(file == null ? void 0 : file.url).end((err, res) => {
           if (err) {
             console.error(err.message);
           }
 
-          if (res && res !== null && res !== void 0 && res.ok) {
-            const response = res === null || res === void 0 ? void 0 : res.text;
+          if (res && res != null && res.ok) {
+            const response = res == null ? void 0 : res.text;
             const url = window.URL.createObjectURL(new Blob([response]));
             const link = document.createElement('a');
             link.href = url;
-            link.setAttribute('download', file === null || file === void 0 ? void 0 : file.name);
+            link.setAttribute('download', file == null ? void 0 : file.name);
             document.body.appendChild(link);
             link.click();
             document.body.removeChild(link);
@@ -21768,12 +21813,12 @@
     }
 
     const renderPicture = () => {
-      return fileList === null || fileList === void 0 ? void 0 : fileList.map((item, index) => {
-        if ((item === null || item === void 0 ? void 0 : item.status) === 'uploading') {
+      return fileList == null ? void 0 : fileList.map((item, index) => {
+        if ((item == null ? void 0 : item.status) === 'uploading') {
           return /*#__PURE__*/React__default["default"].createElement(UploadProgress, {
             key: index,
-            progress: item === null || item === void 0 ? void 0 : item.percent,
-            loading: item === null || item === void 0 ? void 0 : item.loading,
+            progress: item == null ? void 0 : item.percent,
+            loading: item == null ? void 0 : item.loading,
             __self: undefined,
             __source: {
               fileName: _jsxFileName$9,
@@ -21848,14 +21893,14 @@
     };
 
     const renderFile = () => {
-      return fileList === null || fileList === void 0 ? void 0 : fileList.map((item, index) => {
+      return fileList == null ? void 0 : fileList.map((item, index) => {
         var _item$name;
 
-        if ((item === null || item === void 0 ? void 0 : item.status) === 'uploading') {
+        if ((item == null ? void 0 : item.status) === 'uploading') {
           return /*#__PURE__*/React__default["default"].createElement(UploadProgress, {
             key: index,
-            progress: item === null || item === void 0 ? void 0 : item.percent,
-            loading: item === null || item === void 0 ? void 0 : item.loading,
+            progress: item == null ? void 0 : item.percent,
+            loading: item == null ? void 0 : item.loading,
             __self: undefined,
             __source: {
               fileName: _jsxFileName$9,
@@ -21922,7 +21967,7 @@
             lineNumber: 610,
             columnNumber: 17
           }
-        }, ".", item === null || item === void 0 ? void 0 : (_item$name = item.name) === null || _item$name === void 0 ? void 0 : _item$name.split('.').pop()), /*#__PURE__*/React__default["default"].createElement(Tooltip, {
+        }, ".", item == null ? void 0 : (_item$name = item.name) == null ? void 0 : _item$name.split('.').pop()), /*#__PURE__*/React__default["default"].createElement(Tooltip, {
           label: item.name,
           __self: undefined,
           __source: {
@@ -22094,7 +22139,7 @@
           lineNumber: 685,
           columnNumber: 11
         }
-      }, children !== null && children !== void 0 ? children : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
+      }, children != null ? children : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
         __self: this,
         __source: {
           fileName: _jsxFileName$9,
@@ -22275,12 +22320,12 @@
           lineNumber: 730,
           columnNumber: 15
         }
-      }, `${completedCrop !== null && completedCrop !== void 0 && completedCrop.width && completedCrop !== null && completedCrop !== void 0 && completedCrop.height ? 'Potong & Simpan' : 'Simpan'}`)))));
+      }, `${completedCrop != null && completedCrop.width && completedCrop != null && completedCrop.height ? 'Potong & Simpan' : 'Simpan'}`)))));
     }
 
     return /*#__PURE__*/React__default["default"].createElement(Flex$1, {
       direction: "row",
-      gap: (fileList === null || fileList === void 0 ? void 0 : fileList.length) <= 1 && max === 1 ? 0 : 3,
+      gap: (fileList == null ? void 0 : fileList.length) <= 1 && max === 1 ? 0 : 3,
       wrap: "wrap",
       css: {
         userSelect: 'none'
@@ -22711,10 +22756,10 @@
     const [isPopover, setIsPopover] = React.useState(false);
 
     function getColor() {
-      const color = props === null || props === void 0 ? void 0 : props.color;
+      const color = props == null ? void 0 : props.color;
 
       if (typeof color === 'string') {
-        return color === null || color === void 0 ? void 0 : color.toUpperCase();
+        return color == null ? void 0 : color.toUpperCase();
       }
 
       return `rgba(${color.r},${color.g},${color.b},${color.a})`;
@@ -25571,7 +25616,8 @@
           display: 'none'
         },
         '& .rsw_3G': {
-          display: 'block !important'
+          display: 'block !important',
+          zIndex: 'unset'
         }
       }
     }
@@ -25658,7 +25704,7 @@
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 103,
+            lineNumber: 104,
             columnNumber: 13
           }
         }, /*#__PURE__*/React__default["default"].createElement(Span, {
@@ -25668,7 +25714,7 @@
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 117,
+            lineNumber: 118,
             columnNumber: 15
           }
         }), isComplete && /*#__PURE__*/React__default["default"].createElement(StyledCheckFiled, {
@@ -25680,16 +25726,16 @@
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 118,
+            lineNumber: 119,
             columnNumber: 30
           }
-        }), data[i - 1].title, ((_data = data[i - 1]) === null || _data === void 0 ? void 0 : _data.withTolltip) && /*#__PURE__*/React__default["default"].createElement(Tooltip, {
+        }), data[i - 1].title, ((_data = data[i - 1]) == null ? void 0 : _data.withTolltip) && /*#__PURE__*/React__default["default"].createElement(Tooltip, {
           align: "center",
-          label: (_data2 = data[i - 1]) === null || _data2 === void 0 ? void 0 : _data2.tooltipsContents,
+          label: (_data2 = data[i - 1]) == null ? void 0 : _data2.tooltipsContents,
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 121,
+            lineNumber: 122,
             columnNumber: 17
           }
         }, /*#__PURE__*/React__default["default"].createElement(StyledCircleInfoOutline, {
@@ -25701,7 +25747,7 @@
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 122,
+            lineNumber: 123,
             columnNumber: 19
           }
         })))) : stepItems.push( /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -25718,7 +25764,7 @@
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 128,
+            lineNumber: 129,
             columnNumber: 13
           }
         }, isComplete && /*#__PURE__*/React__default["default"].createElement(StyledCheckFiled, {
@@ -25727,7 +25773,7 @@
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 140,
+            lineNumber: 141,
             columnNumber: 30
           }
         }), !isComplete && /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -25743,7 +25789,7 @@
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 142,
+            lineNumber: 143,
             columnNumber: 17
           }
         }), /*#__PURE__*/React__default["default"].createElement(StyledDiv, {
@@ -25753,17 +25799,17 @@
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 154,
+            lineNumber: 155,
             columnNumber: 15
           }
-        }, isActive ? data[i - 1].title : ''), isActive && ((_data3 = data[i - 1]) === null || _data3 === void 0 ? void 0 : _data3.withTolltip) && /*#__PURE__*/React__default["default"].createElement(Tooltip, {
+        }, isActive ? data[i - 1].title : ''), isActive && ((_data3 = data[i - 1]) == null ? void 0 : _data3.withTolltip) && /*#__PURE__*/React__default["default"].createElement(Tooltip, {
           align: "center",
           withClick: true,
-          label: (_data4 = data[i - 1]) === null || _data4 === void 0 ? void 0 : _data4.tooltipsContents,
+          label: (_data4 = data[i - 1]) == null ? void 0 : _data4.tooltipsContents,
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 156,
+            lineNumber: 157,
             columnNumber: 17
           }
         }, /*#__PURE__*/React__default["default"].createElement(StyledCircleInfoOutline, {
@@ -25772,7 +25818,7 @@
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
-            lineNumber: 157,
+            lineNumber: 158,
             columnNumber: 19
           }
         }))));
@@ -25784,7 +25830,9 @@
         borderLeft: !isMobile ? '4px solid $bgBorder' : undefined,
         marginBottom: isMobile ? 65 : undefined,
         height: !isMobile ? height : undefined,
-        opacity: isHide ? 0 : undefined
+        opacity: isHide ? 0 : undefined,
+        position: !isMobile && 'sticky',
+        top: !isMobile ? 44 : 40
       }, cssNav, mobileHidden),
       gap: 5,
       justify: isMobile ? 'center' : undefined,
@@ -25792,7 +25840,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$4,
-        lineNumber: 165,
+        lineNumber: 166,
         columnNumber: 5
       }
     }, isMobile ? /*#__PURE__*/React__default["default"].createElement(StyledDiv, {
@@ -25804,7 +25852,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$4,
-        lineNumber: 179,
+        lineNumber: 182,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -25817,7 +25865,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$4,
-        lineNumber: 180,
+        lineNumber: 183,
         columnNumber: 11
       }
     }, stepItems)) : stepItems);
@@ -25842,13 +25890,13 @@
     const getIsComplete = currentStep => {
       var _state$isComplete;
 
-      return state === null || state === void 0 ? void 0 : (_state$isComplete = state.isComplete) === null || _state$isComplete === void 0 ? void 0 : _state$isComplete[currentStep - 1];
+      return state == null ? void 0 : (_state$isComplete = state.isComplete) == null ? void 0 : _state$isComplete[currentStep - 1];
     };
 
     const getTitleStep = currentStep => {
       var _props$navContents, _props$navContents2;
 
-      return props === null || props === void 0 ? void 0 : (_props$navContents = props.navContents) === null || _props$navContents === void 0 ? void 0 : (_props$navContents2 = _props$navContents[currentStep - 1]) === null || _props$navContents2 === void 0 ? void 0 : _props$navContents2.title;
+      return props == null ? void 0 : (_props$navContents = props.navContents) == null ? void 0 : (_props$navContents2 = _props$navContents[currentStep - 1]) == null ? void 0 : _props$navContents2.title;
     };
 
     const setState = value => {
@@ -25894,17 +25942,17 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$4,
-        lineNumber: 262,
+        lineNumber: 265,
         columnNumber: 5
       }
     }, /*#__PURE__*/React__default["default"].createElement(StepWizardContext.Provider, {
       value: {
         toogleVisibility,
-        isHide: state === null || state === void 0 ? void 0 : state.hide,
+        isHide: state == null ? void 0 : state.hide,
         setComplete,
         setState,
         state,
-        SW: state === null || state === void 0 ? void 0 : state.SW,
+        SW: state == null ? void 0 : state.SW,
         forbidClickNav: props.forbidClickNav,
         titles: props.titles,
         isMobile: props.isMobile,
@@ -25916,7 +25964,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$4,
-        lineNumber: 263,
+        lineNumber: 266,
         columnNumber: 7
       }
     }, /*#__PURE__*/React__default["default"].createElement(Stepper, _extends({}, props, {
@@ -25928,7 +25976,7 @@
         __self: undefined,
         __source: {
           fileName: _jsxFileName$4,
-          lineNumber: 285,
+          lineNumber: 288,
           columnNumber: 16
         }
       }),
@@ -25938,7 +25986,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$4,
-        lineNumber: 280,
+        lineNumber: 283,
         columnNumber: 9
       }
     }), props.children)));
@@ -26082,10 +26130,10 @@
     function getDatasets(content, activeId, isCollapse) {
       const datasets = [];
 
-      for (let i = 0; i < (content === null || content === void 0 ? void 0 : content.length); i++) {
+      for (let i = 0; i < (content == null ? void 0 : content.length); i++) {
         var _content$i;
 
-        if (((_content$i = content[i]) === null || _content$i === void 0 ? void 0 : _content$i.id) === activeId) {
+        if (((_content$i = content[i]) == null ? void 0 : _content$i.id) === activeId) {
           datasets.unshift(content[i]);
         } else {
           datasets.push(content[i]);
@@ -26125,7 +26173,7 @@
         lineNumber: 101,
         columnNumber: 7
       }
-    }, (_getDatasets = getDatasets(content, activeId, isCollapse)) === null || _getDatasets === void 0 ? void 0 : _getDatasets.map((item, index) => {
+    }, (_getDatasets = getDatasets(content, activeId, isCollapse)) == null ? void 0 : _getDatasets.map((item, index) => {
       return /*#__PURE__*/React__default["default"].createElement(List, {
         key: index,
         __self: this,
@@ -26146,7 +26194,7 @@
           paddingLeft: '16px !important',
           minHeight: 25
         },
-        "data-to-scrollspy-id": item === null || item === void 0 ? void 0 : item.id,
+        "data-to-scrollspy-id": item == null ? void 0 : item.id,
         __self: this,
         __source: {
           fileName: _jsxFileName$2,
@@ -26155,8 +26203,8 @@
         }
       }, /*#__PURE__*/React__default["default"].createElement(Title$1, {
         className: "link-title",
-        active: (item === null || item === void 0 ? void 0 : item.id) === activeId,
-        href: `#${item === null || item === void 0 ? void 0 : item.id}`,
+        active: (item == null ? void 0 : item.id) === activeId,
+        href: `#${item == null ? void 0 : item.id}`,
         onClick: e => {
           e.preventDefault();
           const target = window.document.getElementById(e.currentTarget.href.split('#')[1]);
@@ -26185,7 +26233,7 @@
           lineNumber: 119,
           columnNumber: 17
         }
-      }, item === null || item === void 0 ? void 0 : item.title), item === null || item === void 0 ? void 0 : item.icon));
+      }, item == null ? void 0 : item.title), item == null ? void 0 : item.icon));
     })));
   }
 
@@ -29485,7 +29533,7 @@
   exports.StepWizardContext = StepWizardContext;
   exports.StyledBox = StyledBox;
   exports.StyledDropdown = StyledDropdown;
-  exports.StyledInput = StyledInput;
+  exports.StyledInput = StyledInput$1;
   exports.StyledSpan = StyledSpan;
   exports.StyledTitle = StyledTitle$2;
   exports.THIS_MONTH = THIS_MONTH;