@ctlyst.id/internal-ui 3.2.2 → 3.3.1

package/dist/index.mjs

@@ -1,9 +1,11 @@
 'use client'
 var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 
 // src/components/accordion/components/accordion-eye.tsx
 import { Box } from "@chakra-ui/react";
@@ -513,6 +515,7 @@ var Field = (props) => {
     isRequired,
     children,
     isSuccess,
+    isDisabled,
     boxProps = {}
   } = props;
   const getHelperColor = () => {
@@ -526,12 +529,39 @@ var Field = (props) => {
   };
   const helperColor = getHelperColor();
   const justifyHelper = getJustifyContentHelper();
+  const getProperties = () => {
+    let outlineColor2 = "neutral.400";
+    let focusColor2 = "primary.500";
+    if (isError || isDisabled || isSuccess) {
+      if (isError) outlineColor2 = "danger.500";
+      else if (isSuccess) outlineColor2 = "success.500";
+      focusColor2 = outlineColor2;
+    }
+    return {
+      outlineColor: outlineColor2,
+      focusColor: focusColor2
+    };
+  };
+  const { outlineColor, focusColor } = getProperties();
   return /* @__PURE__ */ jsxs3(FormControl, { isInvalid: isError, ...boxProps, children: [
     label && (typeof label === "string" ? /* @__PURE__ */ jsxs3(FormLabel, { mb: 1, fontSize: "text.sm", requiredIndicator: void 0, children: [
       isRequired && /* @__PURE__ */ jsx17(Box6, { as: "span", color: "danger.500", ml: 0, mr: 1, children: "*" }),
       label
     ] }) : label),
-    children,
+    /* @__PURE__ */ jsx17(
+      Box6,
+      {
+        transition: "all 0.15s",
+        boxShadow: "none",
+        borderRadius: "sm",
+        border: "1px solid",
+        borderColor: outlineColor,
+        _focusWithin: {
+          borderColor: focusColor
+        },
+        children
+      }
+    ),
     (isError && errorMessage || leftHelperText || rightHelperText) && /* @__PURE__ */ jsxs3(Box6, { display: "flex", width: "full", justifyContent: justifyHelper, children: [
       !isError ? leftHelperText && (typeof leftHelperText === "string" ? /* @__PURE__ */ jsx17(FormHelperText, { fontSize: "text.xs", color: helperColor, mt: 1, children: leftHelperText }) : leftHelperText) : typeof errorMessage === "string" ? /* @__PURE__ */ jsx17(FormErrorMessage, { fontSize: "text.xs", color: "danger.500", mt: 1, children: errorMessage }) : errorMessage,
       rightHelperText && (typeof rightHelperText === "string" ? /* @__PURE__ */ jsx17(FormHelperText, { fontSize: "text.xs", color: helperColor, mt: 1, children: rightHelperText }) : rightHelperText)
@@ -669,19 +699,6 @@ var InputField = React2.forwardRef((props, ref) => {
     isLoading,
     ...inputProps
   } = props;
-  const getProperties = () => {
-    let outlineColor2 = "neutral.400";
-    let focusColor2 = "primary.500";
-    if (isError || isDisabled || isSuccess) {
-      if (isError) outlineColor2 = "danger.500";
-      else if (isSuccess) outlineColor2 = "success.500";
-      focusColor2 = outlineColor2;
-    }
-    return {
-      outlineColor: outlineColor2,
-      focusColor: focusColor2
-    };
-  };
   const [isShowPassword, setIsShowPassword] = useState(false);
   const inputType = useMemo(() => {
     return type === "password" && isShowPassword ? "text" : type;
@@ -695,7 +712,6 @@ var InputField = React2.forwardRef((props, ref) => {
   const iconColor = useMemo(() => {
     return isDisabled ? "black.low" : "black.medium";
   }, [isDisabled]);
-  const { outlineColor, focusColor } = getProperties();
   return /* @__PURE__ */ jsx21(
     field_default,
     {
@@ -706,92 +722,80 @@ var InputField = React2.forwardRef((props, ref) => {
       leftHelperText,
       rightHelperText,
       isRequired,
-      children: /* @__PURE__ */ jsx21(
-        Box8,
+      isDisabled,
+      children: /* @__PURE__ */ jsxs5(
+        InputGroup,
         {
-          transition: "all 0.15s",
-          boxShadow: "none",
+          size: size2,
           borderRadius: "sm",
-          border: "1px solid",
-          borderColor: outlineColor,
-          _focusWithin: {
-            borderColor: focusColor
-          },
-          children: /* @__PURE__ */ jsxs5(
-            InputGroup,
-            {
-              size: size2,
-              borderRadius: "sm",
-              backgroundColor: isDisabled ? "neutral.300" : "white.high",
-              cursor: isDisabled ? "not-allowed" : "default",
-              children: [
-                addOnLeft,
-                /* @__PURE__ */ jsx21(
-                  ChakraInput,
-                  {
-                    ref,
-                    type: inputType,
-                    value,
-                    isDisabled,
-                    isSuccess,
-                    ...inputProps,
-                    fontSize
-                  }
-                ),
-                (withClear || isLoading || type === "password") && /* @__PURE__ */ jsxs5(
-                  Box8,
-                  {
-                    "data-test-id": "CT_Component_ClearInput",
-                    display: "flex",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    width: "16px",
-                    mr: "10px",
-                    children: [
-                      withClear && !isLoading && /* @__PURE__ */ jsx21(
-                        Box8,
-                        {
-                          display: "flex",
-                          justifyContent: "center",
-                          onClick: !isDisabled ? onClear : void 0,
-                          cursor: isDisabled ? "not-allowed" : "pointer",
-                          children: /* @__PURE__ */ jsx21(Close2, { size: 4, color: iconColor })
-                        }
-                      ),
-                      type === "password" && !isShowPassword && !isLoading && /* @__PURE__ */ jsx21(
-                        Box8,
-                        {
-                          "data-test-id": "q2Bj2G4FlamXyHuRKMZ1Q",
-                          onClick: () => {
-                            if (!isDisabled) setIsShowPassword(true);
-                          },
-                          cursor: isDisabled ? "not-allowed" : "pointer",
-                          display: "flex",
-                          justifyContent: "center",
-                          children: /* @__PURE__ */ jsx21(EyeOff, { size: 4, color: iconColor })
-                        }
-                      ),
-                      type === "password" && isShowPassword && !isLoading && /* @__PURE__ */ jsx21(
-                        Box8,
-                        {
-                          "data-test-id": "sfc2388bmeXBmdla45Ibk",
-                          onClick: () => {
-                            if (!isDisabled) setIsShowPassword(false);
-                          },
-                          cursor: isDisabled ? "not-allowed" : "pointer",
-                          display: "flex",
-                          justifyContent: "center",
-                          children: /* @__PURE__ */ jsx21(Eye2, { size: 4, color: iconColor })
-                        }
-                      ),
-                      isLoading && /* @__PURE__ */ jsx21(loader_default, { size: "sm" })
-                    ]
-                  }
-                ),
-                addOnRight
-              ]
-            }
-          )
+          backgroundColor: isDisabled ? "neutral.300" : "white.high",
+          cursor: isDisabled ? "not-allowed" : "default",
+          children: [
+            addOnLeft,
+            /* @__PURE__ */ jsx21(
+              ChakraInput,
+              {
+                ref,
+                type: inputType,
+                value,
+                isDisabled,
+                isSuccess,
+                ...inputProps,
+                fontSize
+              }
+            ),
+            (withClear || isLoading || type === "password") && /* @__PURE__ */ jsxs5(
+              Box8,
+              {
+                "data-test-id": "CT_Component_ClearInput",
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                width: "16px",
+                mr: "10px",
+                children: [
+                  withClear && !isLoading && /* @__PURE__ */ jsx21(
+                    Box8,
+                    {
+                      display: "flex",
+                      justifyContent: "center",
+                      onClick: !isDisabled ? onClear : void 0,
+                      cursor: isDisabled ? "not-allowed" : "pointer",
+                      children: /* @__PURE__ */ jsx21(Close2, { size: 4, color: iconColor })
+                    }
+                  ),
+                  type === "password" && !isShowPassword && !isLoading && /* @__PURE__ */ jsx21(
+                    Box8,
+                    {
+                      "data-test-id": "q2Bj2G4FlamXyHuRKMZ1Q",
+                      onClick: () => {
+                        if (!isDisabled) setIsShowPassword(true);
+                      },
+                      cursor: isDisabled ? "not-allowed" : "pointer",
+                      display: "flex",
+                      justifyContent: "center",
+                      children: /* @__PURE__ */ jsx21(EyeOff, { size: 4, color: iconColor })
+                    }
+                  ),
+                  type === "password" && isShowPassword && !isLoading && /* @__PURE__ */ jsx21(
+                    Box8,
+                    {
+                      "data-test-id": "sfc2388bmeXBmdla45Ibk",
+                      onClick: () => {
+                        if (!isDisabled) setIsShowPassword(false);
+                      },
+                      cursor: isDisabled ? "not-allowed" : "pointer",
+                      display: "flex",
+                      justifyContent: "center",
+                      children: /* @__PURE__ */ jsx21(Eye2, { size: 4, color: iconColor })
+                    }
+                  ),
+                  isLoading && /* @__PURE__ */ jsx21(loader_default, { size: "sm" })
+                ]
+              }
+            ),
+            addOnRight
+          ]
         }
       )
     }
@@ -1228,7 +1232,6 @@ import {
   FormControl as FormControl3,
   FormErrorMessage as FormErrorMessage3,
   FormHelperText as FormHelperText3,
-  FormLabel as FormLabel3,
   IconButton as IconButton4,
   InputGroup as InputGroup4,
   InputRightElement as InputRightElement3
@@ -2169,7 +2172,7 @@ var Datepicker = ({
         id,
         name,
         selected,
-        customInput: /* @__PURE__ */ jsx27(input_field_default, { autoComplete: "off" }),
+        customInput: /* @__PURE__ */ jsx27(input_field_default, { label, isRequired, autoComplete: "off", isError }),
         showPopperArrow: false,
         calendarClassName: cx8({ inline: props.inline }),
         dropdownMode: "select",
@@ -2186,8 +2189,7 @@ var Datepicker = ({
   if (props.inline) {
     return component;
   }
-  return /* @__PURE__ */ jsxs10(FormControl3, { isRequired, "data-test-id": "CT_Component_datepicker_wrapper", isInvalid: isError, children: [
-    label && /* @__PURE__ */ jsx27(FormLabel3, { fontSize: "text.sm", children: label }),
+  return /* @__PURE__ */ jsxs10(FormControl3, { "data-test-id": "CT_Component_datepicker_wrapper", isInvalid: isError, children: [
     /* @__PURE__ */ jsxs10(InputGroup4, { children: [
       component,
       /* @__PURE__ */ jsxs10(InputRightElement3, { alignSelf: "center", bottom: 0, flexDir: "row-reverse", width: "auto", mr: 2, gap: 2, children: [
@@ -4649,15 +4651,130 @@ import {
 // src/components/text/index.ts
 import { Code, CodeProps, Heading, HeadingProps, Link as Link5, LinkProps, Text as Text17, TextProps } from "@chakra-ui/react";
 
+// src/components/time-input/components/index.tsx
+import { Box as Box29, Flex as Flex17, forwardRef as forwardRef12, Input as Input3, InputGroup as InputGroup5 } from "@chakra-ui/react";
+import { Clock } from "@ctlyst.id/internal-icon";
+import { useEffect as useEffect2, useImperativeHandle as useImperativeHandle2 } from "react";
+import { useTimescape } from "timescape/react";
+import { Fragment as Fragment10, jsx as jsx63, jsxs as jsxs29 } from "react/jsx-runtime";
+var Time = class {
+  constructor(hours, minutes, seconds) {
+    __publicField(this, "hours");
+    __publicField(this, "minutes");
+    __publicField(this, "seconds");
+    this.hours = hours != null ? hours : 0;
+    this.minutes = minutes != null ? minutes : 0;
+    this.seconds = seconds != null ? seconds : 0;
+  }
+  toString() {
+    return `${this.hours}:${this.minutes}:${this.seconds}`;
+  }
+};
+var InputTimeArea = forwardRef12((props, ref) => {
+  return /* @__PURE__ */ jsx63(
+    Input3,
+    {
+      _focusWithin: {
+        bg: "neutral.300"
+      },
+      boxSizing: "content-box",
+      height: "24px",
+      ref,
+      p: "2px",
+      sx: {
+        fontVariantNumeric: "tabular-nums"
+      },
+      ...props
+    }
+  );
+});
+var TimeInput2 = forwardRef12(
+  ({
+    config: config2,
+    label,
+    isError,
+    isRequired,
+    errorMessage,
+    value,
+    seconds,
+    isDisabled,
+    boxProps,
+    addOnRight,
+    isSuccess,
+    onChangeTime
+  }, ref) => {
+    const dateVal = value != null ? value : config2 == null ? void 0 : config2.date;
+    const defaultDate = /* @__PURE__ */ new Date();
+    defaultDate.setHours(0, 0, 0, 0);
+    const date = dateVal ? new Date(dateVal) : defaultDate;
+    const timeValue = new Time();
+    const { getRootProps, getInputProps, options, update, _manager } = useTimescape({
+      date,
+      ...config2
+    });
+    useEffect2(() => {
+      var _a, _b, _c, _d, _e, _f;
+      timeValue.hours = (_b = (_a = options == null ? void 0 : options.date) == null ? void 0 : _a.getHours()) != null ? _b : 0;
+      timeValue.minutes = (_d = (_c = options == null ? void 0 : options.date) == null ? void 0 : _c.getMinutes()) != null ? _d : 0;
+      timeValue.seconds = (_f = (_e = options == null ? void 0 : options.date) == null ? void 0 : _e.getSeconds()) != null ? _f : 0;
+      if (onChangeTime) {
+        onChangeTime(timeValue);
+      }
+    }, [options.date]);
+    useImperativeHandle2(ref, () => ({
+      focus() {
+        _manager.focusField("hours");
+      }
+    }));
+    const rootProps = getRootProps();
+    const hoursProps = getInputProps("hours");
+    return /* @__PURE__ */ jsx63(Box29, { ...boxProps, ...rootProps, children: /* @__PURE__ */ jsx63(
+      field_default,
+      {
+        isError,
+        label,
+        isRequired,
+        errorMessage,
+        isDisabled,
+        isSuccess,
+        children: /* @__PURE__ */ jsxs29(
+          InputGroup5,
+          {
+            borderRadius: "sm",
+            backgroundColor: isDisabled ? "neutral.300" : "white.high",
+            cursor: isDisabled ? "not-allowed" : "default",
+            alignItems: "center",
+            gap: 3,
+            children: [
+              /* @__PURE__ */ jsxs29(Flex17, { gap: 1, width: "100%", alignItems: "center", pl: 2, children: [
+                /* @__PURE__ */ jsx63(InputTimeArea, { ...hoursProps }),
+                /* @__PURE__ */ jsx63("span", { children: ":" }),
+                /* @__PURE__ */ jsx63(InputTimeArea, { ...getInputProps("minutes") }),
+                seconds && /* @__PURE__ */ jsxs29(Fragment10, { children: [
+                  /* @__PURE__ */ jsx63("span", { children: ":" }),
+                  /* @__PURE__ */ jsx63(InputTimeArea, { ...getInputProps("seconds") })
+                ] }),
+                options.hour12 && /* @__PURE__ */ jsx63("input", { ...getInputProps("am/pm") })
+              ] }),
+              /* @__PURE__ */ jsx63(Clock, { color: "neutral.400" }),
+              addOnRight
+            ]
+          }
+        )
+      }
+    ) });
+  }
+);
+
 // src/components/toast/components/toast.tsx
-import { chakra as chakra7, Flex as Flex17, Link as Link6, useToken } from "@chakra-ui/react";
+import { chakra as chakra7, Flex as Flex18, Link as Link6, useToken } from "@chakra-ui/react";
 import { Bounce, toast } from "react-toastify";
 
 // src/components/toast/components/styles.tsx
 import { Global as Global2 } from "@emotion/react";
-import { jsx as jsx63 } from "react/jsx-runtime";
+import { jsx as jsx64 } from "react/jsx-runtime";
 var Styles2 = () => {
-  return /* @__PURE__ */ jsx63(
+  return /* @__PURE__ */ jsx64(
     Global2,
     {
       styles: `
@@ -4689,7 +4806,7 @@ var Styles2 = () => {
 var styles_default2 = Styles2;
 
 // src/components/toast/components/toast.tsx
-import { Fragment as Fragment10, jsx as jsx64, jsxs as jsxs29 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx65, jsxs as jsxs30 } from "react/jsx-runtime";
 var DEFAULT_OPTIONS = {
   position: "top-right",
   autoClose: 5e3,
@@ -4720,14 +4837,14 @@ var useToast = () => {
     "success.500"
   ]);
   const content = (icon, message, link) => {
-    return /* @__PURE__ */ jsxs29(Fragment10, { children: [
-      /* @__PURE__ */ jsx64(styles_default2, {}),
-      /* @__PURE__ */ jsxs29(Flex17, { justifyContent: "space-between", alignItems: "center", gap: 4, children: [
-        /* @__PURE__ */ jsxs29(Flex17, { alignItems: "center", children: [
-          icon && /* @__PURE__ */ jsx64(chakra7.span, { mr: 2, w: 4, h: 4, children: renderIcon(icon, "default") }),
-          /* @__PURE__ */ jsx64(chakra7.span, { noOfLines: 2, children: message })
+    return /* @__PURE__ */ jsxs30(Fragment11, { children: [
+      /* @__PURE__ */ jsx65(styles_default2, {}),
+      /* @__PURE__ */ jsxs30(Flex18, { justifyContent: "space-between", alignItems: "center", gap: 4, children: [
+        /* @__PURE__ */ jsxs30(Flex18, { alignItems: "center", children: [
+          icon && /* @__PURE__ */ jsx65(chakra7.span, { mr: 2, w: 4, h: 4, children: renderIcon(icon, "default") }),
+          /* @__PURE__ */ jsx65(chakra7.span, { noOfLines: 2, children: message })
         ] }),
-        link && /* @__PURE__ */ jsx64(
+        link && /* @__PURE__ */ jsx65(
           Link6,
           {
             href: link.url,
@@ -4808,11 +4925,11 @@ import { ToastContainer } from "react-toastify";
 
 // src/components/uploader/components/uploader.tsx
 import {
-  Box as Box29,
+  Box as Box30,
   Button as Button7,
-  Flex as Flex18,
+  Flex as Flex19,
   FormControl as FormControl4,
-  FormLabel as FormLabel4,
+  FormLabel as FormLabel3,
   Heading as Heading2,
   Image as ChakraImage,
   ListItem as ListItem2,
@@ -4821,7 +4938,7 @@ import {
   UnorderedList as UnorderedList2
 } from "@chakra-ui/react";
 import { Close as X, Plus } from "@ctlyst.id/internal-icon";
-import { useCallback as useCallback2, useEffect as useEffect2, useRef, useState as useState4 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect3, useRef, useState as useState4 } from "react";
 import { useDropzone } from "react-dropzone";
 
 // src/components/uploader/constants.ts
@@ -4851,7 +4968,7 @@ var concatList = (list) => {
 var formatValidationMessage = (extension) => `Foto harus dalam format ${concatList(extension.map((ext) => `.${ext}`))}.`;
 
 // src/components/uploader/components/uploader.tsx
-import { Fragment as Fragment11, jsx as jsx65, jsxs as jsxs30 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx66, jsxs as jsxs31 } from "react/jsx-runtime";
 import { createElement } from "react";
 var Uploader = ({
   onHandleUploadFile,
@@ -4940,18 +5057,18 @@ var Uploader = ({
   });
   const renderHelperText = () => {
     if (Array.isArray(helperText)) {
-      return /* @__PURE__ */ jsx65(UnorderedList2, { pl: 2, fontSize: 12, color: "gray.600", "data-test-id": "CT_component_base-image-uploader_helperText", children: helperText.map((text2) => /* @__PURE__ */ jsx65(ListItem2, { children: text2 }, text2)) });
+      return /* @__PURE__ */ jsx66(UnorderedList2, { pl: 2, fontSize: 12, color: "gray.600", "data-test-id": "CT_component_base-image-uploader_helperText", children: helperText.map((text2) => /* @__PURE__ */ jsx66(ListItem2, { children: text2 }, text2)) });
     }
     return helperText;
   };
-  const renderErrorText = (text2) => /* @__PURE__ */ jsx65(Box29, { mb: 2, children: /* @__PURE__ */ jsx65(Text18, { textStyle: "text.xs", color: "danger.500", children: text2 }) });
+  const renderErrorText = (text2) => /* @__PURE__ */ jsx66(Box30, { mb: 2, children: /* @__PURE__ */ jsx66(Text18, { 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();
   };
-  useEffect2(() => {
+  useEffect3(() => {
     if (value) {
       if (typeof value === "string") {
         setFilePreview(value);
@@ -4967,16 +5084,16 @@ var Uploader = ({
   const color = isDisabled ? "neutral.500" : "primary.500";
   const containerHeight = !isSmall ? "160px" : "120px";
   const cursorType = filePreview ? "initial" : "pointer";
-  return /* @__PURE__ */ jsxs30(FormControl4, { isRequired, children: [
+  return /* @__PURE__ */ jsxs31(FormControl4, { isRequired, children: [
     label && typeof label === "string" ? (
       // eslint-disable-next-line react/jsx-no-useless-fragment
-      /* @__PURE__ */ jsxs30(FormLabel4, { requiredIndicator: /* @__PURE__ */ jsx65(Fragment11, {}), fontSize: "text.sm", children: [
-        isRequired && /* @__PURE__ */ jsx65(RequiredIndicator2, { mr: 1, ml: 0 }),
+      /* @__PURE__ */ jsxs31(FormLabel3, { requiredIndicator: /* @__PURE__ */ jsx66(Fragment12, {}), fontSize: "text.sm", children: [
+        isRequired && /* @__PURE__ */ jsx66(RequiredIndicator2, { mr: 1, ml: 0 }),
         label
       ] })
     ) : label,
-    /* @__PURE__ */ jsxs30(
-      Flex18,
+    /* @__PURE__ */ jsxs31(
+      Flex19,
       {
         minH: containerHeight,
         maxW: !isSmall ? "full" : "120px",
@@ -4993,7 +5110,7 @@ var Uploader = ({
         ...props,
         ...getRootProps(),
         children: [
-          filePreview && isShowCloseButton && /* @__PURE__ */ jsx65(Box29, { position: "absolute", top: 1, right: 1, children: /* @__PURE__ */ jsx65(
+          filePreview && isShowCloseButton && /* @__PURE__ */ jsx66(Box30, { position: "absolute", top: 1, right: 1, children: /* @__PURE__ */ jsx66(
             Button7,
             {
               "data-test-id": `CT_component_base-image-uploader_remove-image${testId ? `_${testId}` : ""}`,
@@ -5008,17 +5125,17 @@ var Uploader = ({
               border: "none",
               zIndex: 1,
               onClick: handleRemove,
-              children: /* @__PURE__ */ jsx65(X, { size: 3, color: "white" })
+              children: /* @__PURE__ */ jsx66(X, { size: 3, color: "white" })
             }
           ) }),
-          filePreview && /* @__PURE__ */ jsx65(Box29, { w: "full", children: /* @__PURE__ */ jsx65(
-            Flex18,
+          filePreview && /* @__PURE__ */ jsx66(Box30, { w: "full", children: /* @__PURE__ */ jsx66(
+            Flex19,
             {
               position: "relative",
               "data-test-id": `CT_component_base-image-uploader_image-preview${testId ? `_${testId}` : ""}`,
               justify: "center",
               align: "center",
-              children: /* @__PURE__ */ jsx65(
+              children: /* @__PURE__ */ jsx66(
                 ChakraImage,
                 {
                   h: size2 === "lg" ? "120" : "100",
@@ -5029,18 +5146,18 @@ var Uploader = ({
               )
             }
           ) }),
-          !filePreview && /* @__PURE__ */ jsxs30(Fragment11, { children: [
-            /* @__PURE__ */ jsx65(
+          !filePreview && /* @__PURE__ */ jsxs31(Fragment12, { children: [
+            /* @__PURE__ */ jsx66(
               "input",
               {
                 "data-test-id": `CT_component_base-image-uploader_input-file${testId ? `_${testId}` : ""}`,
                 ...getInputProps()
               }
             ),
-            isDragActive ? /* @__PURE__ */ jsx65(Text18, { children: dragActiveText != null ? dragActiveText : messages.dragActive }) : /* @__PURE__ */ jsxs30(Flex18, { gap: 2, flexDirection: "column", alignItems: "center", color: isError ? "danger.500" : color, children: [
-              size2 === "sm" && /* @__PURE__ */ jsx65(Plus, { size: 6, color }),
-              /* @__PURE__ */ jsxs30(Box29, { children: [
-                !filePreview && /* @__PURE__ */ jsx65(
+            isDragActive ? /* @__PURE__ */ jsx66(Text18, { children: dragActiveText != null ? dragActiveText : messages.dragActive }) : /* @__PURE__ */ jsxs31(Flex19, { gap: 2, flexDirection: "column", alignItems: "center", color: isError ? "danger.500" : color, children: [
+              size2 === "sm" && /* @__PURE__ */ jsx66(Plus, { size: 6, color }),
+              /* @__PURE__ */ jsxs31(Box30, { children: [
+                !filePreview && /* @__PURE__ */ jsx66(
                   Heading2,
                   {
                     fontWeight: "400",
@@ -5050,14 +5167,14 @@ var Uploader = ({
                     children: uploadFileText && size2 === "lg" ? messages.uploadFile : "Upload"
                   }
                 ),
-                size2 === "lg" && /* @__PURE__ */ jsx65(Text18, { fontSize: 12, children: filePreview ? dragReplaceText != null ? dragReplaceText : messages.dragReplace : dragInActiveText != null ? dragInActiveText : messages.dragInActive })
+                size2 === "lg" && /* @__PURE__ */ jsx66(Text18, { fontSize: 12, children: filePreview ? dragReplaceText != null ? dragReplaceText : messages.dragReplace : dragInActiveText != null ? dragInActiveText : messages.dragInActive })
               ] })
             ] })
           ] })
         ]
       }
     ),
-    filePreview && !isSmall && /* @__PURE__ */ jsxs30(Flex18, { align: "center", justify: "center", my: 2, children: [
+    filePreview && !isSmall && /* @__PURE__ */ jsxs31(Flex19, { align: "center", justify: "center", my: 2, children: [
       /* @__PURE__ */ createElement(
         "input",
         {
@@ -5068,7 +5185,7 @@ var Uploader = ({
           "data-test-id": `CT_component_base-image-uploader_change-img${testId ? `_${testId}` : ""}`
         }
       ),
-      isShowReupload && /* @__PURE__ */ jsx65(
+      isShowReupload && /* @__PURE__ */ jsx66(
         Button7,
         {
           "data-test-id": `CT_component_base-image-uploader_change-img-btn${testId ? `_${testId}` : ""}`,
@@ -5884,10 +6001,10 @@ var baseStyle5 = defineStyle2({
   marginEnd: 1,
   mb: 1
 });
-var FormLabel5 = defineStyleConfig3({
+var FormLabel4 = defineStyleConfig3({
   baseStyle: baseStyle5
 });
-var form_label_default = FormLabel5;
+var form_label_default = FormLabel4;
 
 // src/config/theme/components/input.ts
 import { inputAnatomy as parts3 } from "@chakra-ui/anatomy";
@@ -5997,7 +6114,7 @@ var variants3 = {
   outline: outline2,
   unstyled: unstyled2
 };
-var Input3 = defineMultiStyleConfig5({
+var Input4 = defineMultiStyleConfig5({
   baseStyle: baseStyle6,
   sizes: sizes2,
   variants: variants3,
@@ -6006,7 +6123,7 @@ var Input3 = defineMultiStyleConfig5({
     variant: "outline"
   }
 });
-var input_default = Input3;
+var input_default = Input4;
 
 // src/config/theme/components/loader.ts
 import { defineStyleConfig as defineStyleConfig4 } from "@chakra-ui/styled-system";
@@ -6785,9 +6902,9 @@ import { useMemo as useMemo5 } from "react";
 
 // src/provider/components/provider.tsx
 import axios from "axios";
-import { createContext as createContext2, useContext, useEffect as useEffect3, useMemo as useMemo4, useRef as useRef2 } from "react";
+import { createContext as createContext2, useContext, useEffect as useEffect4, useMemo as useMemo4, useRef as useRef2 } from "react";
 import { ToastContainer as ToastContainer2 } from "react-toastify";
-import { jsx as jsx66, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx67, jsxs as jsxs32 } from "react/jsx-runtime";
 var ProviderContext = createContext2({
   instance: void 0
 });
@@ -6797,7 +6914,7 @@ var useInternalUI = () => {
 };
 var Provider = ({ children, config: config2, requestInterceptors, responseInterceptors }) => {
   const instanceRef = useRef2(axios.create(config2));
-  useEffect3(() => {
+  useEffect4(() => {
     requestInterceptors == null ? void 0 : requestInterceptors.forEach((interceptor) => {
       instanceRef.current.interceptors.request.use(interceptor);
     });
@@ -6806,8 +6923,8 @@ var Provider = ({ children, config: config2, requestInterceptors, responseInterc
     });
   }, [requestInterceptors, responseInterceptors]);
   const provider = useMemo4(() => ({ instance: instanceRef.current }), []);
-  return /* @__PURE__ */ jsxs31(ProviderContext.Provider, { value: provider, children: [
-    /* @__PURE__ */ jsx66(ToastContainer2, {}),
+  return /* @__PURE__ */ jsxs32(ProviderContext.Provider, { value: provider, children: [
+    /* @__PURE__ */ jsx67(ToastContainer2, {}),
     children
   ] });
 };
@@ -6864,7 +6981,7 @@ import {
 } from "@chakra-ui/react";
 
 // src/index.ts
-import { extendTheme, forwardRef as forwardRef12 } from "@chakra-ui/react";
+import { extendTheme, forwardRef as forwardRef13 } from "@chakra-ui/react";
 export {
   Accordion,
   AccordionButton,
@@ -7131,6 +7248,8 @@ export {
   Th2 as Th,
   Thead2 as Thead,
   ThemeTypings,
+  Time,
+  TimeInput2 as TimeInput,
   ToastContainer,
   Tooltip,
   Tr2 as Tr,
@@ -7177,7 +7296,7 @@ export {
   XMSLogo,
   createExtendTheme,
   extendTheme,
-  forwardRef12 as forwardRef,
+  forwardRef13 as forwardRef,
   getSelectAllCheckboxState,
   getTheme,
   isCellDisabled,