@ctlyst.id/internal-ui 3.0.0 → 3.0.2

package/dist/index.js

@@ -99,12 +99,12 @@ __export(src_exports, {
   AlertIcon: () => AlertIcon,
   AlertTitle: () => AlertTitle,
   Anchor: () => Anchor,
-  Avatar: () => import_react126.Avatar,
-  AvatarBadge: () => import_react126.AvatarBadge,
-  AvatarBadgeProps: () => import_react126.AvatarBadgeProps,
-  AvatarGroup: () => import_react126.AvatarGroup,
-  AvatarGroupProps: () => import_react126.AvatarGroupProps,
-  AvatarProps: () => import_react126.AvatarProps,
+  Avatar: () => import_react127.Avatar,
+  AvatarBadge: () => import_react127.AvatarBadge,
+  AvatarBadgeProps: () => import_react127.AvatarBadgeProps,
+  AvatarGroup: () => import_react127.AvatarGroup,
+  AvatarGroupProps: () => import_react127.AvatarGroupProps,
+  AvatarProps: () => import_react127.AvatarProps,
   Badge: () => badge_default,
   Box: () => import_react50.Box,
   BoxProps: () => import_react50.BoxProps,
@@ -115,8 +115,8 @@ __export(src_exports, {
   CHECKBOX_STATE: () => CHECKBOX_STATE,
   Card: () => card_default,
   Center: () => import_react50.Center,
-  ChakraProvider: () => import_react136.ChakraProvider,
-  ChakraProviderProps: () => import_react136.ChakraProviderProps,
+  ChakraProvider: () => import_react137.ChakraProvider,
+  ChakraProviderProps: () => import_react137.ChakraProviderProps,
   ChakraTable: () => import_react117.Table,
   Checkbox: () => checkbox_default,
   CheckboxGroup: () => checkbox_group_default,
@@ -130,11 +130,11 @@ __export(src_exports, {
   CloseButtonProps: () => import_react10.CloseButtonProps,
   Code: () => import_react120.Code,
   CodeProps: () => import_react120.CodeProps,
-  Collapse: () => import_react126.Collapse,
-  CollapseProps: () => import_react126.CollapseProps,
-  ColorMode: () => import_react136.ColorMode,
-  ColorModeScript: () => import_react136.ColorModeScript,
-  ColorModeScriptProps: () => import_react136.ColorModeScriptProps,
+  Collapse: () => import_react127.Collapse,
+  CollapseProps: () => import_react127.CollapseProps,
+  ColorMode: () => import_react137.ColorMode,
+  ColorModeScript: () => import_react137.ColorModeScript,
+  ColorModeScriptProps: () => import_react137.ColorModeScriptProps,
   Container: () => import_react50.Container,
   ContainerProps: () => import_react50.ContainerProps,
   Counter: () => counter_default,
@@ -154,8 +154,8 @@ __export(src_exports, {
   DrawerOverlay: () => import_react61.ModalOverlay,
   DrawerProps: () => import_react61.DrawerProps,
   EmptyState: () => empty_state_default,
-  Fade: () => import_react126.Fade,
-  FadeProps: () => import_react126.FadeProps,
+  Fade: () => import_react127.Fade,
+  FadeProps: () => import_react127.FadeProps,
   Field: () => field_default,
   Flex: () => import_react50.Flex,
   FlexProps: () => import_react50.FlexProps,
@@ -173,16 +173,16 @@ __export(src_exports, {
   Header: () => Header,
   Heading: () => import_react120.Heading,
   HeadingProps: () => import_react120.HeadingProps,
-  Hide: () => import_react126.Hide,
-  HideProps: () => import_react126.HideProps,
+  Hide: () => import_react127.Hide,
+  HideProps: () => import_react127.HideProps,
   Icon: () => import_react49.Icon,
   IconButton: () => import_react10.IconButton,
   IconButtonProps: () => import_react10.IconButtonProps,
   IconProps: () => import_react49.IconProps,
   Image: () => import_react49.Image,
   ImageProps: () => import_react49.ImageProps,
-  Img: () => import_react126.Img,
-  ImgProps: () => import_react126.ImgProps,
+  Img: () => import_react127.Img,
+  ImgProps: () => import_react127.ImgProps,
   InputAddonLeft: () => InputAddonLeft,
   InputAddonRight: () => InputAddonRight,
   InputElementLeft: () => import_react19.InputLeftElement,
@@ -259,36 +259,36 @@ __export(src_exports, {
   Rating: () => rating_default,
   RequiredIndicator: () => import_react25.RequiredIndicator,
   RequiredIndicatorProps: () => import_react25.RequiredIndicatorProps,
-  ScaleFade: () => import_react126.ScaleFade,
-  ScaleFadeProps: () => import_react126.ScaleFadeProps,
+  ScaleFade: () => import_react127.ScaleFade,
+  ScaleFadeProps: () => import_react127.ScaleFadeProps,
   Select: () => select_default,
   SelectAsync: () => select_async_default,
   SelectAsyncCreatable: () => SelectAsyncCreatable,
   SelectCheckBox: () => select_with_checkbox_default,
   SelectCreatable: () => SelectCreatable,
-  Show: () => import_react126.Show,
-  ShowProps: () => import_react126.ShowProps,
+  Show: () => import_react127.Show,
+  ShowProps: () => import_react127.ShowProps,
   Sidebar: () => Sidebar,
   SidebarHeader: () => SidebarHeader,
   SidebarMenu: () => SidebarMenu,
   SimpleGrid: () => import_react50.SimpleGrid,
   Skeleton: () => import_react5.Skeleton,
-  Slide: () => import_react126.Slide,
-  SlideFade: () => import_react126.SlideFade,
-  SlideFadeProps: () => import_react126.SlideFadeProps,
-  SlideProps: () => import_react126.SlideProps,
+  Slide: () => import_react127.Slide,
+  SlideFade: () => import_react127.SlideFade,
+  SlideFadeProps: () => import_react127.SlideFadeProps,
+  SlideProps: () => import_react127.SlideProps,
   Spacer: () => import_react50.Spacer,
   Stack: () => import_react50.Stack,
   StackProps: () => import_react50.StackProps,
-  Step: () => import_react126.Step,
-  StepDescription: () => import_react126.StepDescription,
-  StepIcon: () => import_react126.StepIcon,
-  StepIndicator: () => import_react126.StepIndicator,
-  StepNumber: () => import_react126.StepNumber,
-  StepSeparator: () => import_react126.StepSeparator,
-  StepStatus: () => import_react126.StepStatus,
-  StepTitle: () => import_react126.StepTitle,
-  Stepper: () => import_react126.Stepper,
+  Step: () => import_react127.Step,
+  StepDescription: () => import_react127.StepDescription,
+  StepIcon: () => import_react127.StepIcon,
+  StepIndicator: () => import_react127.StepIndicator,
+  StepNumber: () => import_react127.StepNumber,
+  StepSeparator: () => import_react127.StepSeparator,
+  StepStatus: () => import_react127.StepStatus,
+  StepTitle: () => import_react127.StepTitle,
+  Stepper: () => import_react127.Stepper,
   Switch: () => switch_default,
   Tab: () => tab_default,
   TabIndicator: () => import_react119.TabIndicator,
@@ -327,18 +327,18 @@ __export(src_exports, {
   UseAccordionItemReturn: () => import_react3.UseAccordionItemReturn,
   UseAccordionProps: () => import_react3.UseAccordionProps,
   UseAccordionReturn: () => import_react3.UseAccordionReturn,
-  UseBreakpointOptions: () => import_react126.UseBreakpointOptions,
+  UseBreakpointOptions: () => import_react127.UseBreakpointOptions,
   UseCheckboxGroupProps: () => import_react16.UseCheckboxGroupProps,
   UseCheckboxGroupReturn: () => import_react16.UseCheckboxGroupReturn,
   UseCheckboxProps: () => import_react16.UseCheckboxProps,
   UseCheckboxReturn: () => import_react16.UseCheckboxReturn,
-  UseDisclosureProps: () => import_react138.UseDisclosureProps,
-  UseImageProps: () => import_react126.UseImageProps,
-  UseImageReturn: () => import_react126.UseImageReturn,
-  UseMediaQueryOptions: () => import_react126.UseMediaQueryOptions,
+  UseDisclosureProps: () => import_react139.UseDisclosureProps,
+  UseImageProps: () => import_react127.UseImageProps,
+  UseImageReturn: () => import_react127.UseImageReturn,
+  UseMediaQueryOptions: () => import_react127.UseMediaQueryOptions,
   UseModalProps: () => import_react61.UseModalProps,
   UseModalReturn: () => import_react61.UseModalReturn,
-  UseQueryProps: () => import_react126.UseQueryProps,
+  UseQueryProps: () => import_react127.UseQueryProps,
   UseRadioGroupReturn: () => import_react73.UseRadioGroupReturn,
   UseRadioProps: () => import_react73.UseRadioProps,
   UseRadioReturn: () => import_react73.UseRadioReturn,
@@ -351,16 +351,16 @@ __export(src_exports, {
   UseTabsReturn: () => import_react119.UseTabsReturn,
   VStack: () => import_react50.VStack,
   Version: () => Version,
-  VisuallyHidden: () => import_react126.VisuallyHidden,
-  VisuallyHiddenInput: () => import_react126.VisuallyHiddenInput,
+  VisuallyHidden: () => import_react127.VisuallyHidden,
+  VisuallyHiddenInput: () => import_react127.VisuallyHiddenInput,
   VoilaLogo: () => VoilaLogo,
   Wrap: () => import_react50.Wrap,
   WrapItem: () => import_react50.WrapItem,
   WrapItemProps: () => import_react50.WrapItemProps,
   WrapProps: () => import_react50.WrapProps,
   XMSLogo: () => XMSLogo,
-  extendTheme: () => import_react139.extendTheme,
-  forwardRef: () => import_react139.forwardRef,
+  extendTheme: () => import_react140.extendTheme,
+  forwardRef: () => import_react140.forwardRef,
   getSelectAllCheckboxState: () => getSelectAllCheckboxState,
   getTheme: () => getTheme,
   theme: () => theme4,
@@ -370,34 +370,34 @@ __export(src_exports, {
   useAccordionItemState: () => import_react3.useAccordionItemState,
   useAccordionStyles: () => import_react3.useAccordionStyles,
   useAlertStyles: () => useAlertStyles,
-  useBoolean: () => import_react138.useBoolean,
-  useBreakpoint: () => import_react126.useBreakpoint,
+  useBoolean: () => import_react139.useBoolean,
+  useBreakpoint: () => import_react127.useBreakpoint,
   useCheckbox: () => import_react16.useCheckbox,
   useCheckboxGroup: () => import_react16.useCheckboxGroup,
-  useClipboard: () => import_react138.useClipboard,
-  useColorMode: () => import_react138.useColorMode,
-  useColorModePreference: () => import_react126.useColorModePreference,
-  useColorModeValue: () => import_react138.useColorModeValue,
-  useConst: () => import_react138.useConst,
-  useControllableProp: () => import_react138.useControllableProp,
-  useControllableState: () => import_react138.useControllableState,
+  useClipboard: () => import_react139.useClipboard,
+  useColorMode: () => import_react139.useColorMode,
+  useColorModePreference: () => import_react127.useColorModePreference,
+  useColorModeValue: () => import_react139.useColorModeValue,
+  useConst: () => import_react139.useConst,
+  useControllableProp: () => import_react139.useControllableProp,
+  useControllableState: () => import_react139.useControllableState,
   useDataTable: () => useDataTable,
-  useDimensions: () => import_react138.useDimensions,
-  useDisclosure: () => import_react138.useDisclosure,
+  useDimensions: () => import_react139.useDimensions,
+  useDisclosure: () => import_react139.useDisclosure,
   useDrawerContext: () => import_react61.useDrawerContext,
   useFetcher: () => useFetcher,
-  useImage: () => import_react126.useImage,
+  useImage: () => import_react127.useImage,
   useInternalUI: () => useInternalUI,
-  useMergeRefs: () => import_react138.useMergeRefs,
+  useMergeRefs: () => import_react139.useMergeRefs,
   useModal: () => import_react61.useModal,
   useModalContext: () => import_react61.useModalContext,
   useModalStyles: () => import_react61.useModalStyles,
-  useOutsideClick: () => import_react138.useOutsideClick,
-  useQuery: () => import_react126.useQuery,
+  useOutsideClick: () => import_react139.useOutsideClick,
+  useQuery: () => import_react127.useQuery,
   useRadio: () => import_react73.useRadio,
   useRadioGroup: () => import_react73.useRadioGroup,
   useRadioGroupContext: () => import_react73.useRadioGroupContext,
-  useSteps: () => import_react126.useSteps,
+  useSteps: () => import_react127.useSteps,
   useTab: () => import_react119.useTab,
   useTabIndicator: () => import_react119.useTabIndicator,
   useTabList: () => import_react119.useTabList,
@@ -409,9 +409,9 @@ __export(src_exports, {
   useTabsDescendants: () => import_react119.useTabsDescendants,
   useTabsDescendantsContext: () => import_react119.useTabsDescendantsContext,
   useTabsStyles: () => import_react119.useTabsStyles,
-  useTheme: () => import_react138.useTheme,
+  useTheme: () => import_react139.useTheme,
   useToast: () => useToast,
-  useToken: () => import_react138.useToken
+  useToken: () => import_react139.useToken
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -11529,36 +11529,46 @@ var import_react119 = require("@chakra-ui/react");
 var import_react120 = require("@chakra-ui/react");
 
 // src/components/toast/components/toast.tsx
-var import_ReactToastify = require("react-toastify/dist/ReactToastify.css");
-var import_react121 = require("@chakra-ui/react");
+var import_react122 = require("@chakra-ui/react");
 var import_react_toastify = require("react-toastify");
+
+// src/components/toast/components/styles.tsx
+var import_react121 = require("@emotion/react");
 var import_jsx_runtime66 = require("react/jsx-runtime");
-var toastStyles = `
-  .Toastify__toast-container {
-    width: 380px;
-  }
+var Styles2 = () => {
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+    import_react121.Global,
+    {
+      styles: `
+        .Toastify__toast-container {
+          width: 380px;
+        }
 
-  .container-toast {
-    height: 64px;
-    width: 380px;
-    border-radius: 4px;
-    font-family: Poppins;
-  }
+        .container-toast {
+          height: 64px;
+          width: 380px;
+          border-radius: 4px;
+          font-family: Poppins;
+        }
 
-  @media (max-width: 480px) {
-    .container-toast {
-      margin: 16px !important;
-      width: calc(100% - 32px); /* Adjust width to fit within the margin */
-    }
+        @media (max-width: 480px) {
+          .container-toast {
+            margin: 16px !important;
+            width: calc(100% - 32px); /* Adjust width to fit within the margin */
+          }
 
-    .Toastify__toast-container {
-      width: 100%;
+          .Toastify__toast-container {
+            width: 100%;
+          }
+        }
+      `
     }
-  }
-`;
-var styleSheet = document.createElement("style");
-styleSheet.innerText = toastStyles;
-document.head.appendChild(styleSheet);
+  );
+};
+var styles_default2 = Styles2;
+
+// src/components/toast/components/toast.tsx
+var import_jsx_runtime67 = require("react/jsx-runtime");
 var DEFAULT_OPTIONS = {
   position: "top-right",
   autoClose: 5e3,
@@ -11580,7 +11590,7 @@ var renderIcon = (icon, type) => {
   return icon;
 };
 var useToast = () => {
-  const [primary500, neutral500, info500, danger500, warning500, success500] = (0, import_react121.useToken)("colors", [
+  const [primary500, neutral500, info500, danger500, warning500, success500] = (0, import_react122.useToken)("colors", [
     "primary.500",
     "neutral.500",
     "info.500",
@@ -11589,23 +11599,26 @@ var useToast = () => {
     "success.500"
   ]);
   const content = (icon, message, link) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_react121.Flex, { justifyContent: "space-between", alignItems: "center", gap: 4, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_react121.Flex, { alignItems: "center", children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react121.chakra.span, { mr: 2, w: 4, h: 4, children: renderIcon(icon, "default") }),
-        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react121.chakra.span, { noOfLines: 2, children: message })
-      ] }),
-      link && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-        import_react121.Link,
-        {
-          href: link.url,
-          textDecoration: "underline",
-          minW: "max-content",
-          textAlign: "right",
-          textStyle: "text.sm",
-          fontWeight: "semibold",
-          children: link.label
-        }
-      )
+    return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(styles_default2, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_react122.Flex, { justifyContent: "space-between", alignItems: "center", gap: 4, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_react122.Flex, { alignItems: "center", children: [
+          icon && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react122.chakra.span, { mr: 2, w: 4, h: 4, children: renderIcon(icon, "default") }),
+          /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react122.chakra.span, { noOfLines: 2, children: message })
+        ] }),
+        link && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+          import_react122.Link,
+          {
+            href: link.url,
+            textDecoration: "underline",
+            minW: "max-content",
+            textAlign: "right",
+            textStyle: "text.sm",
+            fontWeight: "semibold",
+            children: link.label
+          }
+        )
+      ] })
     ] });
   };
   return {
@@ -11672,24 +11685,24 @@ var useToast = () => {
 var import_react_toastify2 = require("react-toastify");
 
 // src/components/tooltip/components/tooltip.tsx
-var import_react122 = require("@chakra-ui/react");
-var import_jsx_runtime67 = require("react/jsx-runtime");
+var import_react123 = require("@chakra-ui/react");
+var import_jsx_runtime68 = require("react/jsx-runtime");
 var Tooltip = (props) => {
   const { children, bg = "neutral.700", textStyle = "text.sm", color: color2 = "white" } = props;
-  const content = /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_react122.PopoverContent, { border: "none", bg, textStyle, borderRadius: props.borderRadius, children: [
-    props.hasArrow && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react122.PopoverArrow, { color: color2, bg }),
-    /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react122.PopoverBody, { color: color2, ...props, children: props.label })
+  const content = /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_react123.PopoverContent, { border: "none", bg, textStyle, borderRadius: props.borderRadius, children: [
+    props.hasArrow && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.PopoverArrow, { color: color2, bg }),
+    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.PopoverBody, { color: color2, ...props, children: props.label })
   ] });
-  return props.isInteractive === true ? /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_react122.Popover, { trigger: "hover", placement: props.placement, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react122.PopoverTrigger, { children }),
-    props.portal ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react122.Portal, { children: content }) : content
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react122.Tooltip, { ...props, children });
+  return props.isInteractive === true ? /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_react123.Popover, { trigger: "hover", placement: props.placement, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.PopoverTrigger, { children }),
+    props.portal ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.Portal, { children: content }) : content
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.Tooltip, { ...props, children });
 };
 
 // src/components/uploader/components/uploader.tsx
-var import_react123 = require("@chakra-ui/react");
+var import_react124 = require("@chakra-ui/react");
 var import_internal_icon10 = require("@ctlyst.id/internal-icon");
-var import_react124 = require("react");
+var import_react125 = require("react");
 var import_react_dropzone = require("react-dropzone");
 
 // src/components/uploader/constants.ts
@@ -11719,8 +11732,8 @@ var concatList = (list) => {
 var formatValidationMessage = (extension) => `Foto harus dalam format ${concatList(extension.map((ext) => `.${ext}`))}.`;
 
 // src/components/uploader/components/uploader.tsx
-var import_jsx_runtime68 = require("react/jsx-runtime");
-var import_react125 = require("react");
+var import_jsx_runtime69 = require("react/jsx-runtime");
+var import_react126 = require("react");
 var Uploader = ({
   onHandleUploadFile,
   onHandleRejections,
@@ -11749,10 +11762,10 @@ var Uploader = ({
   size: size2 = "lg",
   ...props
 }) => {
-  const inputRef = (0, import_react124.useRef)(null);
-  const [filePreview, setFilePreview] = (0, import_react124.useState)();
+  const inputRef = (0, import_react125.useRef)(null);
+  const [filePreview, setFilePreview] = (0, import_react125.useState)();
   const toast2 = useToast();
-  const handleRejection = (0, import_react124.useCallback)(
+  const handleRejection = (0, import_react125.useCallback)(
     (message, file, image) => {
       if (onHandleRejections) {
         onHandleRejections(file, image);
@@ -11764,7 +11777,7 @@ var Uploader = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [onHandleRejections]
   );
-  const onDrop = (0, import_react124.useCallback)(
+  const onDrop = (0, import_react125.useCallback)(
     (files) => {
       var _a;
       const file = files[0];
@@ -11808,18 +11821,18 @@ var Uploader = ({
   });
   const renderHelperText = () => {
     if (Array.isArray(helperText)) {
-      return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.UnorderedList, { pl: 2, fontSize: 12, color: "gray.600", "data-test-id": "CT_component_base-image-uploader_helperText", children: helperText.map((text2) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.ListItem, { children: text2 }, text2)) });
+      return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react124.UnorderedList, { pl: 2, fontSize: 12, color: "gray.600", "data-test-id": "CT_component_base-image-uploader_helperText", children: helperText.map((text2) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react124.ListItem, { children: text2 }, text2)) });
     }
     return helperText;
   };
-  const renderErrorText = (text2) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.Box, { mb: 2, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.Text, { textStyle: "text.xs", color: "danger.500", children: text2 }) });
+  const renderErrorText = (text2) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react124.Box, { mb: 2, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react124.Text, { textStyle: "text.xs", color: "danger.500", children: text2 }) });
   const handleRemove = (e) => {
     e.stopPropagation();
     setFilePreview(void 0);
     onHandleUploadFile == null ? void 0 : onHandleUploadFile(null, null);
     acceptedFiles.pop();
   };
-  (0, import_react124.useEffect)(() => {
+  (0, import_react125.useEffect)(() => {
     if (value) {
       if (typeof value === "string") {
         setFilePreview(value);
@@ -11835,16 +11848,16 @@ var Uploader = ({
   const color2 = isDisabled ? "neutral.500" : "primary.500";
   const containerHeight = !isSmall ? "160px" : "120px";
   const cursorType = filePreview ? "initial" : "pointer";
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_react123.FormControl, { isRequired, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_react124.FormControl, { isRequired, children: [
     label && typeof label === "string" ? (
       // eslint-disable-next-line react/jsx-no-useless-fragment
-      /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_react123.FormLabel, { requiredIndicator: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_jsx_runtime68.Fragment, {}), fontSize: "text.sm", children: [
-        isRequired && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.RequiredIndicator, { mr: 1, ml: 0 }),
+      /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_react124.FormLabel, { requiredIndicator: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_jsx_runtime69.Fragment, {}), fontSize: "text.sm", children: [
+        isRequired && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react124.RequiredIndicator, { mr: 1, ml: 0 }),
         label
       ] })
     ) : label,
-    /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
-      import_react123.Flex,
+    /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
+      import_react124.Flex,
       {
         minH: containerHeight,
         maxW: !isSmall ? "full" : "120px",
@@ -11861,8 +11874,8 @@ var Uploader = ({
         ...props,
         ...getRootProps(),
         children: [
-          filePreview && isShowCloseButton && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.Box, { position: "absolute", top: 1, right: 1, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-            import_react123.Button,
+          filePreview && isShowCloseButton && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react124.Box, { position: "absolute", top: 1, right: 1, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+            import_react124.Button,
             {
               "data-test-id": `CT_component_base-image-uploader_remove-image${testId ? `_${testId}` : ""}`,
               "aria-label": "remove-image",
@@ -11876,18 +11889,18 @@ var Uploader = ({
               border: "none",
               zIndex: 1,
               onClick: handleRemove,
-              children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_internal_icon10.Close, { size: 3, color: "white" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_internal_icon10.Close, { size: 3, color: "white" })
             }
           ) }),
-          filePreview && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.Box, { w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-            import_react123.Flex,
+          filePreview && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react124.Box, { w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+            import_react124.Flex,
             {
               position: "relative",
               "data-test-id": `CT_component_base-image-uploader_image-preview${testId ? `_${testId}` : ""}`,
               justify: "center",
               align: "center",
-              children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-                import_react123.Image,
+              children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+                import_react124.Image,
                 {
                   h: size2 === "lg" ? "120" : "100",
                   src: filePreview,
@@ -11897,19 +11910,19 @@ var Uploader = ({
               )
             }
           ) }),
-          !filePreview && /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_jsx_runtime68.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+          !filePreview && /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_jsx_runtime69.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
               "input",
               {
                 "data-test-id": `CT_component_base-image-uploader_input-file${testId ? `_${testId}` : ""}`,
                 ...getInputProps()
               }
             ),
-            isDragActive2 ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.Text, { children: dragActiveText != null ? dragActiveText : messages.dragActive }) : /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_react123.Flex, { gap: 2, flexDirection: "column", alignItems: "center", color: isError ? "danger.500" : color2, children: [
-              size2 === "sm" && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_internal_icon10.Plus, { size: 6, color: color2 }),
-              /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_react123.Box, { children: [
-                !filePreview && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-                  import_react123.Heading,
+            isDragActive2 ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react124.Text, { children: dragActiveText != null ? dragActiveText : messages.dragActive }) : /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_react124.Flex, { gap: 2, flexDirection: "column", alignItems: "center", color: isError ? "danger.500" : color2, children: [
+              size2 === "sm" && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_internal_icon10.Plus, { size: 6, color: color2 }),
+              /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_react124.Box, { children: [
+                !filePreview && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+                  import_react124.Heading,
                   {
                     fontWeight: "400",
                     fontSize: size2 === "sm" ? "text.md" : "text.xl",
@@ -11918,15 +11931,15 @@ var Uploader = ({
                     children: uploadFileText && size2 === "lg" ? messages.uploadFile : "Upload"
                   }
                 ),
-                size2 === "lg" && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react123.Text, { fontSize: 12, children: filePreview ? dragReplaceText != null ? dragReplaceText : messages.dragReplace : dragInActiveText != null ? dragInActiveText : messages.dragInActive })
+                size2 === "lg" && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react124.Text, { fontSize: 12, children: filePreview ? dragReplaceText != null ? dragReplaceText : messages.dragReplace : dragInActiveText != null ? dragInActiveText : messages.dragInActive })
               ] })
             ] })
           ] })
         ]
       }
     ),
-    filePreview && !isSmall && /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_react123.Flex, { align: "center", justify: "center", my: 2, children: [
-      /* @__PURE__ */ (0, import_react125.createElement)(
+    filePreview && !isSmall && /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_react124.Flex, { align: "center", justify: "center", my: 2, children: [
+      /* @__PURE__ */ (0, import_react126.createElement)(
         "input",
         {
           ...getInputProps(),
@@ -11936,8 +11949,8 @@ var Uploader = ({
           "data-test-id": `CT_component_base-image-uploader_change-img${testId ? `_${testId}` : ""}`
         }
       ),
-      isShowReupload && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-        import_react123.Button,
+      isShowReupload && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+        import_react124.Button,
         {
           "data-test-id": `CT_component_base-image-uploader_change-img-btn${testId ? `_${testId}` : ""}`,
           type: "button",
@@ -11958,10 +11971,10 @@ var Uploader = ({
 var uploader_default = Uploader;
 
 // src/components/index.ts
-var import_react126 = require("@chakra-ui/react");
+var import_react127 = require("@chakra-ui/react");
 
 // src/config/theme/themeConfiguration.ts
-var import_react134 = require("@chakra-ui/react");
+var import_react135 = require("@chakra-ui/react");
 
 // src/config/theme/components/index.ts
 var components_exports = {};
@@ -12514,8 +12527,8 @@ var card_default2 = CardStyle;
 
 // src/config/theme/components/checkbox.ts
 var import_anatomy3 = require("@chakra-ui/anatomy");
-var import_react127 = require("@chakra-ui/react");
-var { definePartsStyle: definePartsStyle3, defineMultiStyleConfig: defineMultiStyleConfig3 } = (0, import_react127.createMultiStyleConfigHelpers)(import_anatomy3.checkboxAnatomy.keys);
+var import_react128 = require("@chakra-ui/react");
+var { definePartsStyle: definePartsStyle3, defineMultiStyleConfig: defineMultiStyleConfig3 } = (0, import_react128.createMultiStyleConfigHelpers)(import_anatomy3.checkboxAnatomy.keys);
 var baseStyle3 = definePartsStyle3({
   control: {
     borderRadius: "sm",
@@ -12616,8 +12629,8 @@ var checkbox_default2 = Checkbox4;
 
 // src/config/theme/components/chips.ts
 var import_anatomy4 = require("@chakra-ui/anatomy");
-var import_react128 = require("@chakra-ui/react");
-var { definePartsStyle: definePartsStyle4, defineMultiStyleConfig: defineMultiStyleConfig4 } = (0, import_react128.createMultiStyleConfigHelpers)(import_anatomy4.tagAnatomy.keys);
+var import_react129 = require("@chakra-ui/react");
+var { definePartsStyle: definePartsStyle4, defineMultiStyleConfig: defineMultiStyleConfig4 } = (0, import_react129.createMultiStyleConfigHelpers)(import_anatomy4.tagAnatomy.keys);
 var baseStyle4 = definePartsStyle4({
   container: {
     px: 3,
@@ -12826,8 +12839,8 @@ var input_default = Input3;
 
 // src/config/theme/components/loader.ts
 var import_styled_system7 = require("@chakra-ui/styled-system");
-var import_react129 = require("@emotion/react");
-var rotate = (0, import_react129.keyframes)({
+var import_react130 = require("@emotion/react");
+var rotate = (0, import_react130.keyframes)({
   "0%": {
     transform: "rotate(0deg)"
   },
@@ -12957,8 +12970,8 @@ var modal_default = Modal3;
 
 // src/config/theme/components/popover.ts
 var import_anatomy6 = require("@chakra-ui/anatomy");
-var import_react130 = require("@chakra-ui/react");
-var { definePartsStyle: definePartsStyle6, defineMultiStyleConfig: defineMultiStyleConfig6 } = (0, import_react130.createMultiStyleConfigHelpers)(import_anatomy6.popoverAnatomy.keys);
+var import_react131 = require("@chakra-ui/react");
+var { definePartsStyle: definePartsStyle6, defineMultiStyleConfig: defineMultiStyleConfig6 } = (0, import_react131.createMultiStyleConfigHelpers)(import_anatomy6.popoverAnatomy.keys);
 var baseStyle7 = definePartsStyle6({
   content: {
     bg: "white"
@@ -12969,8 +12982,8 @@ var popover_default = popoverTheme;
 
 // src/config/theme/components/radio.ts
 var import_anatomy7 = require("@chakra-ui/anatomy");
-var import_react131 = require("@chakra-ui/react");
-var { definePartsStyle: definePartsStyle7, defineMultiStyleConfig: defineMultiStyleConfig7 } = (0, import_react131.createMultiStyleConfigHelpers)(import_anatomy7.radioAnatomy.keys);
+var import_react132 = require("@chakra-ui/react");
+var { definePartsStyle: definePartsStyle7, defineMultiStyleConfig: defineMultiStyleConfig7 } = (0, import_react132.createMultiStyleConfigHelpers)(import_anatomy7.radioAnatomy.keys);
 var baseStyle8 = definePartsStyle7({
   control: {
     border: "1px solid",
@@ -13405,7 +13418,7 @@ var tabsTheme = defineMultiStyleConfig10({
 var tabs_default = tabsTheme;
 
 // src/config/theme/components/textarea.ts
-var import_react132 = require("@chakra-ui/react");
+var import_react133 = require("@chakra-ui/react");
 var getProps = (props) => {
   const { isError, isSuccess, isDisabled } = props;
   let borderColor = "neutral.400";
@@ -13425,7 +13438,7 @@ var getProps = (props) => {
     borderColor
   };
 };
-var outline3 = (0, import_react132.defineStyle)((props) => {
+var outline3 = (0, import_react133.defineStyle)((props) => {
   const { focusBorderColor, borderColor } = getProps(props);
   return {
     background: "white.high",
@@ -13469,7 +13482,7 @@ var outline3 = (0, import_react132.defineStyle)((props) => {
     }
   };
 });
-var Textarea = (0, import_react132.defineStyleConfig)({
+var Textarea = (0, import_react133.defineStyleConfig)({
   variants: { outline: outline3 },
   defaultProps: {
     variant: "outline"
@@ -13478,15 +13491,15 @@ var Textarea = (0, import_react132.defineStyleConfig)({
 var textarea_default2 = Textarea;
 
 // src/config/theme/components/tooltip.ts
-var import_react133 = require("@chakra-ui/react");
-var $arrowBg = (0, import_react133.cssVar)("popper-arrow-bg");
+var import_react134 = require("@chakra-ui/react");
+var $arrowBg = (0, import_react134.cssVar)("popper-arrow-bg");
 var baseStyle11 = {
   bg: "neutral.700",
   textStyle: "text.sm",
   fontSize: "text.sm",
   [$arrowBg.variable]: "var(--chakra-colors-neutral-700)"
 };
-var Tooltip2 = (0, import_react133.defineStyleConfig)({ baseStyle: baseStyle11 });
+var Tooltip2 = (0, import_react134.defineStyleConfig)({ baseStyle: baseStyle11 });
 var tooltip_default = Tooltip2;
 
 // src/config/theme/themeConfiguration.ts
@@ -13496,7 +13509,7 @@ var config = {
   useSystemColorMode: false
 };
 var getTheme = (foundations) => {
-  return (0, import_react134.extendTheme)({
+  return (0, import_react135.extendTheme)({
     ...foundations,
     components: {
       ...components_exports
@@ -13512,7 +13525,7 @@ var getTheme = (foundations) => {
     config
   });
 };
-var theme4 = (0, import_react134.extendTheme)({
+var theme4 = (0, import_react135.extendTheme)({
   components: {
     ...components_exports
   },
@@ -13532,23 +13545,23 @@ var theme4 = (0, import_react134.extendTheme)({
 
 // src/hooks/useFetcher.ts
 var import_axios2 = __toESM(require("axios"));
-var import_react137 = require("react");
+var import_react138 = require("react");
 
 // src/provider/components/provider.tsx
 var import_axios = __toESM(require("axios"));
-var import_react135 = require("react");
+var import_react136 = require("react");
 var import_react_toastify3 = require("react-toastify");
-var import_jsx_runtime69 = require("react/jsx-runtime");
-var ProviderContext = (0, import_react135.createContext)({
+var import_jsx_runtime70 = require("react/jsx-runtime");
+var ProviderContext = (0, import_react136.createContext)({
   instance: void 0
 });
 var useInternalUI = () => {
-  const { instance } = (0, import_react135.useContext)(ProviderContext);
+  const { instance } = (0, import_react136.useContext)(ProviderContext);
   return { instance };
 };
 var Provider = ({ children, config: config2, requestInterceptors, responseInterceptors }) => {
-  const instanceRef = (0, import_react135.useRef)(import_axios.default.create(config2));
-  (0, import_react135.useEffect)(() => {
+  const instanceRef = (0, import_react136.useRef)(import_axios.default.create(config2));
+  (0, import_react136.useEffect)(() => {
     requestInterceptors == null ? void 0 : requestInterceptors.forEach((interceptor) => {
       instanceRef.current.interceptors.request.use(interceptor);
     });
@@ -13556,9 +13569,9 @@ var Provider = ({ children, config: config2, requestInterceptors, responseInterc
       instanceRef.current.interceptors.response.use(interceptor);
     });
   }, [requestInterceptors, responseInterceptors]);
-  const provider = (0, import_react135.useMemo)(() => ({ instance: instanceRef.current }), []);
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(ProviderContext.Provider, { value: provider, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react_toastify3.ToastContainer, {}),
+  const provider = (0, import_react136.useMemo)(() => ({ instance: instanceRef.current }), []);
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(ProviderContext.Provider, { value: provider, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react_toastify3.ToastContainer, {}),
     children
   ] });
 };
@@ -13566,12 +13579,12 @@ Provider.displayName = "Provider";
 var provider_default = Provider;
 
 // src/provider/index.ts
-var import_react136 = require("@chakra-ui/react");
+var import_react137 = require("@chakra-ui/react");
 
 // src/hooks/useFetcher.ts
 function useFetcher() {
   const { instance } = useInternalUI();
-  const axiosInstance = (0, import_react137.useMemo)(() => instance || import_axios2.default, [instance]);
+  const axiosInstance = (0, import_react138.useMemo)(() => instance || import_axios2.default, [instance]);
   const fetcher = async ({ url, data, method, headers, ...config2 }) => {
     const response = await axiosInstance.request({
       data,
@@ -13591,10 +13604,10 @@ function useFetcher() {
 }
 
 // src/hooks/index.ts
-var import_react138 = require("@chakra-ui/react");
+var import_react139 = require("@chakra-ui/react");
 
 // src/index.ts
-var import_react139 = require("@chakra-ui/react");
+var import_react140 = require("@chakra-ui/react");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Accordion,