@ctlyst.id/internal-ui 3.0.1 → 3.0.2

package/dist/index.mjs

@@ -11421,33 +11421,44 @@ import { Code, CodeProps, Heading, HeadingProps, Link as Link5, LinkProps, Text
 // src/components/toast/components/toast.tsx
 import { chakra as chakra7, Flex as Flex16, Link as Link6, useToken } from "@chakra-ui/react";
 import { Bounce, toast } from "react-toastify";
-import { jsx as jsx66, jsxs as jsxs28 } from "react/jsx-runtime";
-var toastStyles = `
-  .Toastify__toast-container {
-    width: 380px;
-  }
 
-  .container-toast {
-    height: 64px;
-    width: 380px;
-    border-radius: 4px;
-    font-family: Poppins;
-  }
+// src/components/toast/components/styles.tsx
+import { Global as Global2 } from "@emotion/react";
+import { jsx as jsx66 } from "react/jsx-runtime";
+var Styles2 = () => {
+  return /* @__PURE__ */ jsx66(
+    Global2,
+    {
+      styles: `
+        .Toastify__toast-container {
+          width: 380px;
+        }
 
-  @media (max-width: 480px) {
-    .container-toast {
-      margin: 16px !important;
-      width: calc(100% - 32px); /* Adjust width to fit within the margin */
-    }
+        .container-toast {
+          height: 64px;
+          width: 380px;
+          border-radius: 4px;
+          font-family: Poppins;
+        }
 
-    .Toastify__toast-container {
-      width: 100%;
+        @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%;
+          }
+        }
+      `
     }
-  }
-`;
-var styleSheet = document.createElement("style");
-styleSheet.innerText = toastStyles;
-document.head.appendChild(styleSheet);
+  );
+};
+var styles_default2 = Styles2;
+
+// src/components/toast/components/toast.tsx
+import { Fragment as Fragment9, jsx as jsx67, jsxs as jsxs28 } from "react/jsx-runtime";
 var DEFAULT_OPTIONS = {
   position: "top-right",
   autoClose: 5e3,
@@ -11478,23 +11489,26 @@ var useToast = () => {
     "success.500"
   ]);
   const content = (icon, message, link) => {
-    return /* @__PURE__ */ jsxs28(Flex16, { justifyContent: "space-between", alignItems: "center", gap: 4, children: [
-      /* @__PURE__ */ jsxs28(Flex16, { alignItems: "center", children: [
-        icon && /* @__PURE__ */ jsx66(chakra7.span, { mr: 2, w: 4, h: 4, children: renderIcon(icon, "default") }),
-        /* @__PURE__ */ jsx66(chakra7.span, { noOfLines: 2, children: message })
-      ] }),
-      link && /* @__PURE__ */ jsx66(
-        Link6,
-        {
-          href: link.url,
-          textDecoration: "underline",
-          minW: "max-content",
-          textAlign: "right",
-          textStyle: "text.sm",
-          fontWeight: "semibold",
-          children: link.label
-        }
-      )
+    return /* @__PURE__ */ jsxs28(Fragment9, { children: [
+      /* @__PURE__ */ jsx67(styles_default2, {}),
+      /* @__PURE__ */ jsxs28(Flex16, { justifyContent: "space-between", alignItems: "center", gap: 4, children: [
+        /* @__PURE__ */ jsxs28(Flex16, { alignItems: "center", children: [
+          icon && /* @__PURE__ */ jsx67(chakra7.span, { mr: 2, w: 4, h: 4, children: renderIcon(icon, "default") }),
+          /* @__PURE__ */ jsx67(chakra7.span, { noOfLines: 2, children: message })
+        ] }),
+        link && /* @__PURE__ */ jsx67(
+          Link6,
+          {
+            href: link.url,
+            textDecoration: "underline",
+            minW: "max-content",
+            textAlign: "right",
+            textStyle: "text.sm",
+            fontWeight: "semibold",
+            children: link.label
+          }
+        )
+      ] })
     ] });
   };
   return {
@@ -11570,17 +11584,17 @@ import {
   Portal as Portal4,
   Tooltip as ChakraTooltip
 } from "@chakra-ui/react";
-import { jsx as jsx67, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs29 } from "react/jsx-runtime";
 var Tooltip = (props) => {
   const { children, bg = "neutral.700", textStyle = "text.sm", color: color2 = "white" } = props;
   const content = /* @__PURE__ */ jsxs29(PopoverContent6, { border: "none", bg, textStyle, borderRadius: props.borderRadius, children: [
-    props.hasArrow && /* @__PURE__ */ jsx67(PopoverArrow3, { color: color2, bg }),
-    /* @__PURE__ */ jsx67(PopoverBody4, { color: color2, ...props, children: props.label })
+    props.hasArrow && /* @__PURE__ */ jsx68(PopoverArrow3, { color: color2, bg }),
+    /* @__PURE__ */ jsx68(PopoverBody4, { color: color2, ...props, children: props.label })
   ] });
   return props.isInteractive === true ? /* @__PURE__ */ jsxs29(Popover6, { trigger: "hover", placement: props.placement, children: [
-    /* @__PURE__ */ jsx67(PopoverTrigger6, { children }),
-    props.portal ? /* @__PURE__ */ jsx67(Portal4, { children: content }) : content
-  ] }) : /* @__PURE__ */ jsx67(ChakraTooltip, { ...props, children });
+    /* @__PURE__ */ jsx68(PopoverTrigger6, { children }),
+    props.portal ? /* @__PURE__ */ jsx68(Portal4, { children: content }) : content
+  ] }) : /* @__PURE__ */ jsx68(ChakraTooltip, { ...props, children });
 };
 
 // src/components/uploader/components/uploader.tsx
@@ -11628,7 +11642,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 Fragment9, jsx as jsx68, jsxs as jsxs30 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx69, jsxs as jsxs30 } from "react/jsx-runtime";
 import { createElement as createElement6 } from "react";
 var Uploader = ({
   onHandleUploadFile,
@@ -11717,11 +11731,11 @@ var Uploader = ({
   });
   const renderHelperText = () => {
     if (Array.isArray(helperText)) {
-      return /* @__PURE__ */ jsx68(UnorderedList2, { pl: 2, fontSize: 12, color: "gray.600", "data-test-id": "CT_component_base-image-uploader_helperText", children: helperText.map((text2) => /* @__PURE__ */ jsx68(ListItem2, { children: text2 }, text2)) });
+      return /* @__PURE__ */ jsx69(UnorderedList2, { pl: 2, fontSize: 12, color: "gray.600", "data-test-id": "CT_component_base-image-uploader_helperText", children: helperText.map((text2) => /* @__PURE__ */ jsx69(ListItem2, { children: text2 }, text2)) });
     }
     return helperText;
   };
-  const renderErrorText = (text2) => /* @__PURE__ */ jsx68(Box29, { mb: 2, children: /* @__PURE__ */ jsx68(Text19, { textStyle: "text.xs", color: "danger.500", children: text2 }) });
+  const renderErrorText = (text2) => /* @__PURE__ */ jsx69(Box29, { mb: 2, children: /* @__PURE__ */ jsx69(Text19, { textStyle: "text.xs", color: "danger.500", children: text2 }) });
   const handleRemove = (e) => {
     e.stopPropagation();
     setFilePreview(void 0);
@@ -11747,8 +11761,8 @@ var Uploader = ({
   return /* @__PURE__ */ jsxs30(FormControl4, { isRequired, children: [
     label && typeof label === "string" ? (
       // eslint-disable-next-line react/jsx-no-useless-fragment
-      /* @__PURE__ */ jsxs30(FormLabel4, { requiredIndicator: /* @__PURE__ */ jsx68(Fragment9, {}), fontSize: "text.sm", children: [
-        isRequired && /* @__PURE__ */ jsx68(RequiredIndicator2, { mr: 1, ml: 0 }),
+      /* @__PURE__ */ jsxs30(FormLabel4, { requiredIndicator: /* @__PURE__ */ jsx69(Fragment10, {}), fontSize: "text.sm", children: [
+        isRequired && /* @__PURE__ */ jsx69(RequiredIndicator2, { mr: 1, ml: 0 }),
         label
       ] })
     ) : label,
@@ -11770,7 +11784,7 @@ var Uploader = ({
         ...props,
         ...getRootProps(),
         children: [
-          filePreview && isShowCloseButton && /* @__PURE__ */ jsx68(Box29, { position: "absolute", top: 1, right: 1, children: /* @__PURE__ */ jsx68(
+          filePreview && isShowCloseButton && /* @__PURE__ */ jsx69(Box29, { position: "absolute", top: 1, right: 1, children: /* @__PURE__ */ jsx69(
             Button7,
             {
               "data-test-id": `CT_component_base-image-uploader_remove-image${testId ? `_${testId}` : ""}`,
@@ -11785,17 +11799,17 @@ var Uploader = ({
               border: "none",
               zIndex: 1,
               onClick: handleRemove,
-              children: /* @__PURE__ */ jsx68(X, { size: 3, color: "white" })
+              children: /* @__PURE__ */ jsx69(X, { size: 3, color: "white" })
             }
           ) }),
-          filePreview && /* @__PURE__ */ jsx68(Box29, { w: "full", children: /* @__PURE__ */ jsx68(
+          filePreview && /* @__PURE__ */ jsx69(Box29, { w: "full", children: /* @__PURE__ */ jsx69(
             Flex17,
             {
               position: "relative",
               "data-test-id": `CT_component_base-image-uploader_image-preview${testId ? `_${testId}` : ""}`,
               justify: "center",
               align: "center",
-              children: /* @__PURE__ */ jsx68(
+              children: /* @__PURE__ */ jsx69(
                 ChakraImage,
                 {
                   h: size2 === "lg" ? "120" : "100",
@@ -11806,18 +11820,18 @@ var Uploader = ({
               )
             }
           ) }),
-          !filePreview && /* @__PURE__ */ jsxs30(Fragment9, { children: [
-            /* @__PURE__ */ jsx68(
+          !filePreview && /* @__PURE__ */ jsxs30(Fragment10, { children: [
+            /* @__PURE__ */ jsx69(
               "input",
               {
                 "data-test-id": `CT_component_base-image-uploader_input-file${testId ? `_${testId}` : ""}`,
                 ...getInputProps()
               }
             ),
-            isDragActive2 ? /* @__PURE__ */ jsx68(Text19, { children: dragActiveText != null ? dragActiveText : messages.dragActive }) : /* @__PURE__ */ jsxs30(Flex17, { gap: 2, flexDirection: "column", alignItems: "center", color: isError ? "danger.500" : color2, children: [
-              size2 === "sm" && /* @__PURE__ */ jsx68(Plus, { size: 6, color: color2 }),
+            isDragActive2 ? /* @__PURE__ */ jsx69(Text19, { children: dragActiveText != null ? dragActiveText : messages.dragActive }) : /* @__PURE__ */ jsxs30(Flex17, { gap: 2, flexDirection: "column", alignItems: "center", color: isError ? "danger.500" : color2, children: [
+              size2 === "sm" && /* @__PURE__ */ jsx69(Plus, { size: 6, color: color2 }),
               /* @__PURE__ */ jsxs30(Box29, { children: [
-                !filePreview && /* @__PURE__ */ jsx68(
+                !filePreview && /* @__PURE__ */ jsx69(
                   Heading2,
                   {
                     fontWeight: "400",
@@ -11827,7 +11841,7 @@ var Uploader = ({
                     children: uploadFileText && size2 === "lg" ? messages.uploadFile : "Upload"
                   }
                 ),
-                size2 === "lg" && /* @__PURE__ */ jsx68(Text19, { fontSize: 12, children: filePreview ? dragReplaceText != null ? dragReplaceText : messages.dragReplace : dragInActiveText != null ? dragInActiveText : messages.dragInActive })
+                size2 === "lg" && /* @__PURE__ */ jsx69(Text19, { fontSize: 12, children: filePreview ? dragReplaceText != null ? dragReplaceText : messages.dragReplace : dragInActiveText != null ? dragInActiveText : messages.dragInActive })
               ] })
             ] })
           ] })
@@ -11845,7 +11859,7 @@ var Uploader = ({
           "data-test-id": `CT_component_base-image-uploader_change-img${testId ? `_${testId}` : ""}`
         }
       ),
-      isShowReupload && /* @__PURE__ */ jsx68(
+      isShowReupload && /* @__PURE__ */ jsx69(
         Button7,
         {
           "data-test-id": `CT_component_base-image-uploader_change-img-btn${testId ? `_${testId}` : ""}`,
@@ -13491,7 +13505,7 @@ import { useMemo as useMemo9 } from "react";
 import axios from "axios";
 import { createContext as createContext8, useContext as useContext14, useEffect as useEffect13, useMemo as useMemo8, useRef as useRef10 } from "react";
 import { ToastContainer as ToastContainer2 } from "react-toastify";
-import { jsx as jsx69, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx70, jsxs as jsxs31 } from "react/jsx-runtime";
 var ProviderContext = createContext8({
   instance: void 0
 });
@@ -13511,7 +13525,7 @@ var Provider = ({ children, config: config2, requestInterceptors, responseInterc
   }, [requestInterceptors, responseInterceptors]);
   const provider = useMemo8(() => ({ instance: instanceRef.current }), []);
   return /* @__PURE__ */ jsxs31(ProviderContext.Provider, { value: provider, children: [
-    /* @__PURE__ */ jsx69(ToastContainer2, {}),
+    /* @__PURE__ */ jsx70(ToastContainer2, {}),
     children
   ] });
 };