@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.js +197 -183
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +78 -64
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
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
|
-
|
11431
|
-
|
11432
|
-
|
11433
|
-
|
11434
|
-
|
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
|
-
|
11438
|
-
|
11439
|
-
|
11440
|
-
|
11441
|
-
|
11437
|
+
.container-toast {
|
11438
|
+
height: 64px;
|
11439
|
+
width: 380px;
|
11440
|
+
border-radius: 4px;
|
11441
|
+
font-family: Poppins;
|
11442
|
+
}
|
11442
11443
|
|
11443
|
-
|
11444
|
-
|
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
|
11449
|
-
|
11450
|
-
|
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(
|
11482
|
-
/* @__PURE__ */
|
11483
|
-
|
11484
|
-
/* @__PURE__ */
|
11485
|
-
|
11486
|
-
|
11487
|
-
|
11488
|
-
|
11489
|
-
|
11490
|
-
|
11491
|
-
|
11492
|
-
|
11493
|
-
|
11494
|
-
|
11495
|
-
|
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
|
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__ */
|
11578
|
-
/* @__PURE__ */
|
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__ */
|
11582
|
-
props.portal ? /* @__PURE__ */
|
11583
|
-
] }) : /* @__PURE__ */
|
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
|
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__ */
|
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__ */
|
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__ */
|
11751
|
-
isRequired && /* @__PURE__ */
|
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__ */
|
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__ */
|
11802
|
+
children: /* @__PURE__ */ jsx69(X, { size: 3, color: "white" })
|
11789
11803
|
}
|
11790
11804
|
) }),
|
11791
|
-
filePreview && /* @__PURE__ */
|
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__ */
|
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(
|
11810
|
-
/* @__PURE__ */
|
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__ */
|
11818
|
-
size2 === "sm" && /* @__PURE__ */
|
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__ */
|
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__ */
|
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__ */
|
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
|
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__ */
|
13528
|
+
/* @__PURE__ */ jsx70(ToastContainer2, {}),
|
13515
13529
|
children
|
13516
13530
|
] });
|
13517
13531
|
};
|