@ctlyst.id/internal-ui 3.0.1 → 3.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -11421,33 +11421,44 @@ import { Code, CodeProps, Heading, HeadingProps, Link as Link5, LinkProps, Text
11421
11421
  // src/components/toast/components/toast.tsx
11422
11422
  import { chakra as chakra7, Flex as Flex16, Link as Link6, useToken } from "@chakra-ui/react";
11423
11423
  import { Bounce, toast } from "react-toastify";
11424
- import { jsx as jsx66, jsxs as jsxs28 } from "react/jsx-runtime";
11425
- var toastStyles = `
11426
- .Toastify__toast-container {
11427
- width: 380px;
11428
- }
11429
11424
 
11430
- .container-toast {
11431
- height: 64px;
11432
- width: 380px;
11433
- border-radius: 4px;
11434
- font-family: Poppins;
11435
- }
11425
+ // src/components/toast/components/styles.tsx
11426
+ import { Global as Global2 } from "@emotion/react";
11427
+ import { jsx as jsx66 } from "react/jsx-runtime";
11428
+ var Styles2 = () => {
11429
+ return /* @__PURE__ */ jsx66(
11430
+ Global2,
11431
+ {
11432
+ styles: `
11433
+ .Toastify__toast-container {
11434
+ width: 380px;
11435
+ }
11436
11436
 
11437
- @media (max-width: 480px) {
11438
- .container-toast {
11439
- margin: 16px !important;
11440
- width: calc(100% - 32px); /* Adjust width to fit within the margin */
11441
- }
11437
+ .container-toast {
11438
+ height: 64px;
11439
+ width: 380px;
11440
+ border-radius: 4px;
11441
+ font-family: Poppins;
11442
+ }
11442
11443
 
11443
- .Toastify__toast-container {
11444
- width: 100%;
11444
+ @media (max-width: 480px) {
11445
+ .container-toast {
11446
+ margin: 16px !important;
11447
+ width: calc(100% - 32px); /* Adjust width to fit within the margin */
11448
+ }
11449
+
11450
+ .Toastify__toast-container {
11451
+ width: 100%;
11452
+ }
11453
+ }
11454
+ `
11445
11455
  }
11446
- }
11447
- `;
11448
- var styleSheet = document.createElement("style");
11449
- styleSheet.innerText = toastStyles;
11450
- document.head.appendChild(styleSheet);
11456
+ );
11457
+ };
11458
+ var styles_default2 = Styles2;
11459
+
11460
+ // src/components/toast/components/toast.tsx
11461
+ import { Fragment as Fragment9, jsx as jsx67, jsxs as jsxs28 } from "react/jsx-runtime";
11451
11462
  var DEFAULT_OPTIONS = {
11452
11463
  position: "top-right",
11453
11464
  autoClose: 5e3,
@@ -11478,23 +11489,26 @@ var useToast = () => {
11478
11489
  "success.500"
11479
11490
  ]);
11480
11491
  const content = (icon, message, link) => {
11481
- return /* @__PURE__ */ jsxs28(Flex16, { justifyContent: "space-between", alignItems: "center", gap: 4, children: [
11482
- /* @__PURE__ */ jsxs28(Flex16, { alignItems: "center", children: [
11483
- icon && /* @__PURE__ */ jsx66(chakra7.span, { mr: 2, w: 4, h: 4, children: renderIcon(icon, "default") }),
11484
- /* @__PURE__ */ jsx66(chakra7.span, { noOfLines: 2, children: message })
11485
- ] }),
11486
- link && /* @__PURE__ */ jsx66(
11487
- Link6,
11488
- {
11489
- href: link.url,
11490
- textDecoration: "underline",
11491
- minW: "max-content",
11492
- textAlign: "right",
11493
- textStyle: "text.sm",
11494
- fontWeight: "semibold",
11495
- children: link.label
11496
- }
11497
- )
11492
+ return /* @__PURE__ */ jsxs28(Fragment9, { children: [
11493
+ /* @__PURE__ */ jsx67(styles_default2, {}),
11494
+ /* @__PURE__ */ jsxs28(Flex16, { justifyContent: "space-between", alignItems: "center", gap: 4, children: [
11495
+ /* @__PURE__ */ jsxs28(Flex16, { alignItems: "center", children: [
11496
+ icon && /* @__PURE__ */ jsx67(chakra7.span, { mr: 2, w: 4, h: 4, children: renderIcon(icon, "default") }),
11497
+ /* @__PURE__ */ jsx67(chakra7.span, { noOfLines: 2, children: message })
11498
+ ] }),
11499
+ link && /* @__PURE__ */ jsx67(
11500
+ Link6,
11501
+ {
11502
+ href: link.url,
11503
+ textDecoration: "underline",
11504
+ minW: "max-content",
11505
+ textAlign: "right",
11506
+ textStyle: "text.sm",
11507
+ fontWeight: "semibold",
11508
+ children: link.label
11509
+ }
11510
+ )
11511
+ ] })
11498
11512
  ] });
11499
11513
  };
11500
11514
  return {
@@ -11570,17 +11584,17 @@ import {
11570
11584
  Portal as Portal4,
11571
11585
  Tooltip as ChakraTooltip
11572
11586
  } from "@chakra-ui/react";
11573
- import { jsx as jsx67, jsxs as jsxs29 } from "react/jsx-runtime";
11587
+ import { jsx as jsx68, jsxs as jsxs29 } from "react/jsx-runtime";
11574
11588
  var Tooltip = (props) => {
11575
11589
  const { children, bg = "neutral.700", textStyle = "text.sm", color: color2 = "white" } = props;
11576
11590
  const content = /* @__PURE__ */ jsxs29(PopoverContent6, { border: "none", bg, textStyle, borderRadius: props.borderRadius, children: [
11577
- props.hasArrow && /* @__PURE__ */ jsx67(PopoverArrow3, { color: color2, bg }),
11578
- /* @__PURE__ */ jsx67(PopoverBody4, { color: color2, ...props, children: props.label })
11591
+ props.hasArrow && /* @__PURE__ */ jsx68(PopoverArrow3, { color: color2, bg }),
11592
+ /* @__PURE__ */ jsx68(PopoverBody4, { color: color2, ...props, children: props.label })
11579
11593
  ] });
11580
11594
  return props.isInteractive === true ? /* @__PURE__ */ jsxs29(Popover6, { trigger: "hover", placement: props.placement, children: [
11581
- /* @__PURE__ */ jsx67(PopoverTrigger6, { children }),
11582
- props.portal ? /* @__PURE__ */ jsx67(Portal4, { children: content }) : content
11583
- ] }) : /* @__PURE__ */ jsx67(ChakraTooltip, { ...props, children });
11595
+ /* @__PURE__ */ jsx68(PopoverTrigger6, { children }),
11596
+ props.portal ? /* @__PURE__ */ jsx68(Portal4, { children: content }) : content
11597
+ ] }) : /* @__PURE__ */ jsx68(ChakraTooltip, { ...props, children });
11584
11598
  };
11585
11599
 
11586
11600
  // src/components/uploader/components/uploader.tsx
@@ -11628,7 +11642,7 @@ var concatList = (list) => {
11628
11642
  var formatValidationMessage = (extension) => `Foto harus dalam format ${concatList(extension.map((ext) => `.${ext}`))}.`;
11629
11643
 
11630
11644
  // src/components/uploader/components/uploader.tsx
11631
- import { Fragment as Fragment9, jsx as jsx68, jsxs as jsxs30 } from "react/jsx-runtime";
11645
+ import { Fragment as Fragment10, jsx as jsx69, jsxs as jsxs30 } from "react/jsx-runtime";
11632
11646
  import { createElement as createElement6 } from "react";
11633
11647
  var Uploader = ({
11634
11648
  onHandleUploadFile,
@@ -11717,11 +11731,11 @@ var Uploader = ({
11717
11731
  });
11718
11732
  const renderHelperText = () => {
11719
11733
  if (Array.isArray(helperText)) {
11720
- 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)) });
11734
+ 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)) });
11721
11735
  }
11722
11736
  return helperText;
11723
11737
  };
11724
- const renderErrorText = (text2) => /* @__PURE__ */ jsx68(Box29, { mb: 2, children: /* @__PURE__ */ jsx68(Text19, { textStyle: "text.xs", color: "danger.500", children: text2 }) });
11738
+ const renderErrorText = (text2) => /* @__PURE__ */ jsx69(Box29, { mb: 2, children: /* @__PURE__ */ jsx69(Text19, { textStyle: "text.xs", color: "danger.500", children: text2 }) });
11725
11739
  const handleRemove = (e) => {
11726
11740
  e.stopPropagation();
11727
11741
  setFilePreview(void 0);
@@ -11747,8 +11761,8 @@ var Uploader = ({
11747
11761
  return /* @__PURE__ */ jsxs30(FormControl4, { isRequired, children: [
11748
11762
  label && typeof label === "string" ? (
11749
11763
  // eslint-disable-next-line react/jsx-no-useless-fragment
11750
- /* @__PURE__ */ jsxs30(FormLabel4, { requiredIndicator: /* @__PURE__ */ jsx68(Fragment9, {}), fontSize: "text.sm", children: [
11751
- isRequired && /* @__PURE__ */ jsx68(RequiredIndicator2, { mr: 1, ml: 0 }),
11764
+ /* @__PURE__ */ jsxs30(FormLabel4, { requiredIndicator: /* @__PURE__ */ jsx69(Fragment10, {}), fontSize: "text.sm", children: [
11765
+ isRequired && /* @__PURE__ */ jsx69(RequiredIndicator2, { mr: 1, ml: 0 }),
11752
11766
  label
11753
11767
  ] })
11754
11768
  ) : label,
@@ -11770,7 +11784,7 @@ var Uploader = ({
11770
11784
  ...props,
11771
11785
  ...getRootProps(),
11772
11786
  children: [
11773
- filePreview && isShowCloseButton && /* @__PURE__ */ jsx68(Box29, { position: "absolute", top: 1, right: 1, children: /* @__PURE__ */ jsx68(
11787
+ filePreview && isShowCloseButton && /* @__PURE__ */ jsx69(Box29, { position: "absolute", top: 1, right: 1, children: /* @__PURE__ */ jsx69(
11774
11788
  Button7,
11775
11789
  {
11776
11790
  "data-test-id": `CT_component_base-image-uploader_remove-image${testId ? `_${testId}` : ""}`,
@@ -11785,17 +11799,17 @@ var Uploader = ({
11785
11799
  border: "none",
11786
11800
  zIndex: 1,
11787
11801
  onClick: handleRemove,
11788
- children: /* @__PURE__ */ jsx68(X, { size: 3, color: "white" })
11802
+ children: /* @__PURE__ */ jsx69(X, { size: 3, color: "white" })
11789
11803
  }
11790
11804
  ) }),
11791
- filePreview && /* @__PURE__ */ jsx68(Box29, { w: "full", children: /* @__PURE__ */ jsx68(
11805
+ filePreview && /* @__PURE__ */ jsx69(Box29, { w: "full", children: /* @__PURE__ */ jsx69(
11792
11806
  Flex17,
11793
11807
  {
11794
11808
  position: "relative",
11795
11809
  "data-test-id": `CT_component_base-image-uploader_image-preview${testId ? `_${testId}` : ""}`,
11796
11810
  justify: "center",
11797
11811
  align: "center",
11798
- children: /* @__PURE__ */ jsx68(
11812
+ children: /* @__PURE__ */ jsx69(
11799
11813
  ChakraImage,
11800
11814
  {
11801
11815
  h: size2 === "lg" ? "120" : "100",
@@ -11806,18 +11820,18 @@ var Uploader = ({
11806
11820
  )
11807
11821
  }
11808
11822
  ) }),
11809
- !filePreview && /* @__PURE__ */ jsxs30(Fragment9, { children: [
11810
- /* @__PURE__ */ jsx68(
11823
+ !filePreview && /* @__PURE__ */ jsxs30(Fragment10, { children: [
11824
+ /* @__PURE__ */ jsx69(
11811
11825
  "input",
11812
11826
  {
11813
11827
  "data-test-id": `CT_component_base-image-uploader_input-file${testId ? `_${testId}` : ""}`,
11814
11828
  ...getInputProps()
11815
11829
  }
11816
11830
  ),
11817
- 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: [
11818
- size2 === "sm" && /* @__PURE__ */ jsx68(Plus, { size: 6, color: color2 }),
11831
+ 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: [
11832
+ size2 === "sm" && /* @__PURE__ */ jsx69(Plus, { size: 6, color: color2 }),
11819
11833
  /* @__PURE__ */ jsxs30(Box29, { children: [
11820
- !filePreview && /* @__PURE__ */ jsx68(
11834
+ !filePreview && /* @__PURE__ */ jsx69(
11821
11835
  Heading2,
11822
11836
  {
11823
11837
  fontWeight: "400",
@@ -11827,7 +11841,7 @@ var Uploader = ({
11827
11841
  children: uploadFileText && size2 === "lg" ? messages.uploadFile : "Upload"
11828
11842
  }
11829
11843
  ),
11830
- size2 === "lg" && /* @__PURE__ */ jsx68(Text19, { fontSize: 12, children: filePreview ? dragReplaceText != null ? dragReplaceText : messages.dragReplace : dragInActiveText != null ? dragInActiveText : messages.dragInActive })
11844
+ size2 === "lg" && /* @__PURE__ */ jsx69(Text19, { fontSize: 12, children: filePreview ? dragReplaceText != null ? dragReplaceText : messages.dragReplace : dragInActiveText != null ? dragInActiveText : messages.dragInActive })
11831
11845
  ] })
11832
11846
  ] })
11833
11847
  ] })
@@ -11845,7 +11859,7 @@ var Uploader = ({
11845
11859
  "data-test-id": `CT_component_base-image-uploader_change-img${testId ? `_${testId}` : ""}`
11846
11860
  }
11847
11861
  ),
11848
- isShowReupload && /* @__PURE__ */ jsx68(
11862
+ isShowReupload && /* @__PURE__ */ jsx69(
11849
11863
  Button7,
11850
11864
  {
11851
11865
  "data-test-id": `CT_component_base-image-uploader_change-img-btn${testId ? `_${testId}` : ""}`,
@@ -13491,7 +13505,7 @@ import { useMemo as useMemo9 } from "react";
13491
13505
  import axios from "axios";
13492
13506
  import { createContext as createContext8, useContext as useContext14, useEffect as useEffect13, useMemo as useMemo8, useRef as useRef10 } from "react";
13493
13507
  import { ToastContainer as ToastContainer2 } from "react-toastify";
13494
- import { jsx as jsx69, jsxs as jsxs31 } from "react/jsx-runtime";
13508
+ import { jsx as jsx70, jsxs as jsxs31 } from "react/jsx-runtime";
13495
13509
  var ProviderContext = createContext8({
13496
13510
  instance: void 0
13497
13511
  });
@@ -13511,7 +13525,7 @@ var Provider = ({ children, config: config2, requestInterceptors, responseInterc
13511
13525
  }, [requestInterceptors, responseInterceptors]);
13512
13526
  const provider = useMemo8(() => ({ instance: instanceRef.current }), []);
13513
13527
  return /* @__PURE__ */ jsxs31(ProviderContext.Provider, { value: provider, children: [
13514
- /* @__PURE__ */ jsx69(ToastContainer2, {}),
13528
+ /* @__PURE__ */ jsx70(ToastContainer2, {}),
13515
13529
  children
13516
13530
  ] });
13517
13531
  };