sprint-asia-custom-component 0.1.126 → 0.1.128
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/package.json
CHANGED
|
@@ -8,16 +8,17 @@ const Description = ({
|
|
|
8
8
|
subtitle,
|
|
9
9
|
linkSubtitle,
|
|
10
10
|
onClickSubtitle,
|
|
11
|
-
image,
|
|
12
|
-
|
|
13
|
-
startDate,
|
|
14
|
-
endDate
|
|
11
|
+
image,
|
|
12
|
+
icon
|
|
15
13
|
}) => {
|
|
16
14
|
return (
|
|
17
15
|
<div className="w-full">
|
|
18
16
|
{title && <p className="text-sm font-normal text-black mb-1">{title}</p>}
|
|
19
17
|
{value && (
|
|
20
|
-
<div className="py-1 whitespace-pre-line">
|
|
18
|
+
<div className="py-1 whitespace-pre-line flex items-center">
|
|
19
|
+
{
|
|
20
|
+
icon && <div className="mr-2">{icon}</div>
|
|
21
|
+
}
|
|
21
22
|
<p
|
|
22
23
|
className={`
|
|
23
24
|
${textColor == "default" && "text-black font-semibold text-base"}
|
|
@@ -28,29 +29,6 @@ const Description = ({
|
|
|
28
29
|
</p>
|
|
29
30
|
</div>
|
|
30
31
|
)}
|
|
31
|
-
{
|
|
32
|
-
isDateComponent && startDate && endDate &&
|
|
33
|
-
<div className="py-1 whitespace-pre-line flex items-center">
|
|
34
|
-
<PiCalendarBlank className="mr-2" size={20}/>
|
|
35
|
-
<p
|
|
36
|
-
className={`
|
|
37
|
-
${textColor == "default" && "text-black font-semibold text-base"}
|
|
38
|
-
${textColor == "success" && "text-success500 font-semibold text-base"}
|
|
39
|
-
`}
|
|
40
|
-
>
|
|
41
|
-
{startDate}
|
|
42
|
-
</p>
|
|
43
|
-
<PiArrowRight className="mx-2" size={20}/>
|
|
44
|
-
<p
|
|
45
|
-
className={`
|
|
46
|
-
${textColor == "default" && "text-black font-semibold text-base"}
|
|
47
|
-
${textColor == "success" && "text-success500 font-semibold text-base"}
|
|
48
|
-
`}
|
|
49
|
-
>
|
|
50
|
-
{endDate}
|
|
51
|
-
</p>
|
|
52
|
-
</div>
|
|
53
|
-
}
|
|
54
32
|
{subtitle && (
|
|
55
33
|
<div className="flex items-center mt-1">
|
|
56
34
|
<p className="text-sm font-normal text-black mr-1">{subtitle}</p>
|
|
@@ -1,66 +1,70 @@
|
|
|
1
|
-
import React from
|
|
2
|
-
import { Fragment, useRef} from
|
|
3
|
-
import { Dialog, Transition } from
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Fragment, useRef } from "react";
|
|
3
|
+
import { Dialog, Transition } from "@headlessui/react";
|
|
4
4
|
import { PiInfoDuotone } from "react-icons/pi";
|
|
5
5
|
|
|
6
6
|
const ModalLoading = (props) => {
|
|
7
|
-
const cancelButtonRef = useRef(null)
|
|
7
|
+
const cancelButtonRef = useRef(null);
|
|
8
8
|
|
|
9
9
|
function handleBackgroundClick(e) {
|
|
10
|
-
e.stopPropagation()
|
|
10
|
+
e.stopPropagation();
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
return (
|
|
14
14
|
<Transition.Root show={props.isOpen} as={Fragment}>
|
|
15
|
-
|
|
15
|
+
<Dialog
|
|
16
|
+
as="div"
|
|
17
|
+
className="relative z-10"
|
|
18
|
+
initialFocus={cancelButtonRef}
|
|
19
|
+
onClose={() => props.onClose || props.isOpen}
|
|
20
|
+
static={true}
|
|
21
|
+
>
|
|
22
|
+
<Transition.Child
|
|
23
|
+
as={Fragment}
|
|
24
|
+
enter="ease-out duration-300"
|
|
25
|
+
enterFrom="opacity-0"
|
|
26
|
+
enterTo="opacity-100"
|
|
27
|
+
leave="ease-in duration-200"
|
|
28
|
+
leaveFrom="opacity-100"
|
|
29
|
+
leaveTo="opacity-0"
|
|
30
|
+
>
|
|
31
|
+
<div className="fixed inset-0 bg-black bg-opacity-25 transition-opacity" onClick={handleBackgroundClick} />
|
|
32
|
+
</Transition.Child>
|
|
33
|
+
|
|
34
|
+
<div className="fixed inset-0 z-10 w-screen overflow-y-auto">
|
|
35
|
+
<div className="flex min-h-full items-center justify-center p-4 text-center sm:items-center sm:p-0">
|
|
16
36
|
<Transition.Child
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
37
|
+
as={Fragment}
|
|
38
|
+
enter="ease-out duration-300"
|
|
39
|
+
enterFrom="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
|
|
40
|
+
enterTo="opacity-100 translate-y-0 sm:scale-100"
|
|
41
|
+
leave="ease-in duration-200"
|
|
42
|
+
leaveFrom="opacity-100 translate-y-0 sm:scale-100"
|
|
43
|
+
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
|
|
24
44
|
>
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
>
|
|
39
|
-
|
|
40
|
-
<div className="bg-white px-4 pb-4 pt-5 sm:p-4">
|
|
41
|
-
<div className="sm:flex sm:items-start">
|
|
42
|
-
<div className="mx-auto flex h-12 w-16 flex-shrink-0 items-center justify-center rounded-full sm:mx-0 sm:h-10 sm:w-10">
|
|
43
|
-
<PiInfoDuotone className="h-8 w-8 text-primary500" aria-hidden="true" />
|
|
44
|
-
</div>
|
|
45
|
-
<div className="mt-3 text-center sm:ml-4 sm:mt-0 sm:text-left">
|
|
46
|
-
<Dialog.Title as="h3" className="text-base font-semibold leading-6 text-black">
|
|
47
|
-
{props.title}
|
|
48
|
-
</Dialog.Title>
|
|
49
|
-
<div className="mt-2">
|
|
50
|
-
<p className="text-sm text-black">
|
|
51
|
-
{props.subtitle}
|
|
52
|
-
</p>
|
|
53
|
-
</div>
|
|
54
|
-
</div>
|
|
55
|
-
</div>
|
|
56
|
-
</div>
|
|
57
|
-
</Dialog.Panel>
|
|
58
|
-
</Transition.Child>
|
|
45
|
+
<Dialog.Panel className="relative transform overflow-hidden rounded-lg bg-white text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-lg">
|
|
46
|
+
<div className="bg-white px-4 pb-4 pt-5 sm:p-4">
|
|
47
|
+
<div className="sm:flex sm:items-start">
|
|
48
|
+
<div className="mx-auto flex h-12 w-16 flex-shrink-0 items-center justify-center rounded-full sm:mx-0 sm:h-10 sm:w-10">
|
|
49
|
+
<PiInfoDuotone className="h-8 w-8 text-primary500" aria-hidden="true" />
|
|
50
|
+
</div>
|
|
51
|
+
<div className="mt-3 text-center sm:ml-4 sm:mt-0 sm:text-left">
|
|
52
|
+
<Dialog.Title as="h3" className="text-base font-semibold leading-6 text-black">
|
|
53
|
+
{props.title}
|
|
54
|
+
</Dialog.Title>
|
|
55
|
+
<div className="mt-2">
|
|
56
|
+
<p className="text-sm text-black">{props.subtitle}</p>
|
|
57
|
+
</div>
|
|
58
|
+
</div>
|
|
59
|
+
</div>
|
|
59
60
|
</div>
|
|
60
|
-
|
|
61
|
-
|
|
61
|
+
</Dialog.Panel>
|
|
62
|
+
</Transition.Child>
|
|
63
|
+
</div>
|
|
64
|
+
</div>
|
|
65
|
+
</Dialog>
|
|
62
66
|
</Transition.Root>
|
|
63
|
-
)
|
|
64
|
-
}
|
|
67
|
+
);
|
|
68
|
+
};
|
|
65
69
|
|
|
66
|
-
export default ModalLoading
|
|
70
|
+
export default ModalLoading;
|
package/src/templates/index.js
CHANGED
|
@@ -19,7 +19,7 @@ import ExportToExcel from "../components/export/excel";
|
|
|
19
19
|
import FilterCheckbox from "../components/filter/filterCheckbox";
|
|
20
20
|
import FilterText from "../components/filter/filterText";
|
|
21
21
|
import Menu from "../components/menu";
|
|
22
|
-
import { PiCaretDown, PiCaretUp } from "react-icons/pi";
|
|
22
|
+
import { PiCalendarBlank, PiCaretDown, PiCaretUp } from "react-icons/pi";
|
|
23
23
|
import ModalLoading from "../components/modal/modalLoading";
|
|
24
24
|
import ModalResult from "../components/modal/modalResult";
|
|
25
25
|
import ModalState from "../components/modal/modalState";
|
|
@@ -1090,12 +1090,11 @@ const Templates = () => {
|
|
|
1090
1090
|
value={"This is a sample description.\n HHEHEEH \n LOh"}
|
|
1091
1091
|
// image="https://static.promediateknologi.id/crop/0x0:0x0/0x0/webp/photo/jawapos/2022/09/one-piece-red.jpeg"
|
|
1092
1092
|
/>
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
|
|
1098
|
-
endDate= {"22-03-2002"}
|
|
1093
|
+
<Description
|
|
1094
|
+
title="Sample Title"
|
|
1095
|
+
value={"This is a sample description.\n HHEHEEH \n LOh"}
|
|
1096
|
+
icon={<PiCalendarBlank size={20}/>}
|
|
1097
|
+
// image="https://static.promediateknologi.id/crop/0x0:0x0/0x0/webp/photo/jawapos/2022/09/one-piece-red.jpeg"
|
|
1099
1098
|
/>
|
|
1100
1099
|
|
|
1101
1100
|
<div className="m-9"></div>
|