react-restyle-components 0.2.66 → 0.2.67
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/lib/package.json +1 -1
- package/lib/src/core-components/molecules/modal-confirm/modal-confirm.component.d.ts +5 -2
- package/lib/src/core-components/molecules/modal-confirm/modal-confirm.component.d.ts.map +1 -1
- package/lib/src/core-components/molecules/modal-confirm/modal-confirm.component.js +4 -4
- package/package.json +1 -1
package/lib/package.json
CHANGED
|
@@ -1,12 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
interface ModalConfirmProps {
|
|
2
3
|
visible: boolean;
|
|
3
4
|
title?: string;
|
|
4
|
-
message: string;
|
|
5
|
+
message: React.ReactNode | string;
|
|
5
6
|
submitTitle?: string;
|
|
6
7
|
closeTitle?: string;
|
|
8
|
+
isClick?: boolean;
|
|
9
|
+
isClose?: boolean;
|
|
7
10
|
onClick: () => void;
|
|
8
11
|
onClose: () => void;
|
|
9
12
|
}
|
|
10
|
-
export declare const ModalConfirm: ({ visible, title, message, submitTitle, closeTitle, onClick, onClose, }: ModalConfirmProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export declare const ModalConfirm: ({ visible, title, message, submitTitle, closeTitle, isClick, isClose, onClick, onClose, }: ModalConfirmProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
14
|
export {};
|
|
12
15
|
//# sourceMappingURL=modal-confirm.component.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modal-confirm.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/molecules/modal-confirm/modal-confirm.component.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"modal-confirm.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/molecules/modal-confirm/modal-confirm.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAMzD,UAAU,iBAAiB;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,8FAUtB,iBAAiB,4CA0LnB,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { useEffect, useState } from 'react';
|
|
|
3
3
|
import { Container } from 'reactstrap';
|
|
4
4
|
import s from '../../../tc.module.css';
|
|
5
5
|
import { cn } from '../../../core-utils';
|
|
6
|
-
export const ModalConfirm = ({ visible = false, title = 'Confirm', message
|
|
6
|
+
export const ModalConfirm = ({ visible = false, title = 'Confirm', message, submitTitle = 'Send', closeTitle = 'Close', isClick = true, isClose = true, onClick, onClose, }) => {
|
|
7
7
|
const [showModal, setShowModal] = useState(visible);
|
|
8
8
|
useEffect(() => {
|
|
9
9
|
setShowModal(visible);
|
|
@@ -12,10 +12,10 @@ export const ModalConfirm = ({ visible = false, title = 'Confirm', message = '',
|
|
|
12
12
|
return (_jsx(_Fragment, { children: _jsx(Container, { children: showModal && (_jsxs(_Fragment, { children: [_jsx("div", { className: cn(s['flex'], s['justify-center'], s['items-center'], s['overflow-x-hidden'], s['overflow-y-auto'], s['fixed'], s['inset-0'], s['z-50'], s['outline-none'], s['focus:outline-none']), children: _jsx("div", { className: cn(s['relative'], s['my-6'], s['mx-auto']), children: _jsxs("div", { className: cn(s['border-0'], s['rounded-lg'], s['shadow-lg'], s['relative'], s['flex'], s['flex-col'], s['w-fit'], s['min-w-80'], s['bg-white'], s['outline-none'], s['focus:outline-none']), children: [_jsxs("div", { className: cn(s['flex'], s['items-center'], s['justify-between'], s['p-2'], s['border-b'], s['border-solid'], s['border-gray-300'], s['rounded-t']), children: [_jsx("h3", { className: cn(s['text-2xl'], s['font-semibold']), children: title }), _jsx("button", { className: cn(s['p-1'], s['border-0'], s['text-black'], s['opacity-1'], s['ml-6'], s['float-right'], s['text-3xl'], s['leading-none'], s['font-semibold'], s['outline-none'], s['focus:outline-none']), onClick: () => {
|
|
13
13
|
setShowModal(false);
|
|
14
14
|
onClose && onClose();
|
|
15
|
-
}, children: _jsx("span", { className: cn(s['text-black'], s['h-6'], s['w-6'], s['text-2xl'], s['block'], s['outline-none'], s['focus:outline-none']), children: "\u00D7" }) })] }), _jsx("div", { className: cn(s['flex'], s['p-2']), children: _jsx("div", { className: cn(s['flex']), children: _jsx("span", { className: cn(s['text-md']), children: message }) }) }), _jsxs("div", { className: cn(s['flex'], s['items-center'], s['justify-end'], s['p-2'], s['border-t'], s['border-solid'], s['border-gray-300'], s['rounded-b']), children: [_jsx("button", { className: cn(s['text-red-500'], s['background-transparent'], s['font-bold'], s['uppercase'], s['p-2'], s['text-sm'], s['outline-none'], s['focus:outline-none'], s['mr-1'], s['mb-1']), type: "button", style: { transition: 'all .15s ease' }, onClick: () => {
|
|
15
|
+
}, children: _jsx("span", { className: cn(s['text-black'], s['h-6'], s['w-6'], s['text-2xl'], s['block'], s['outline-none'], s['focus:outline-none']), children: "\u00D7" }) })] }), _jsx("div", { className: cn(s['flex'], s['p-2']), children: _jsx("div", { className: cn(s['flex']), children: typeof message === 'string' ? (_jsx("span", { className: cn(s['text-md']), children: message })) : (message) }) }), _jsxs("div", { className: cn(s['flex'], s['items-center'], s['justify-end'], s['p-2'], s['border-t'], s['border-solid'], s['border-gray-300'], s['rounded-b']), children: [isClose && (_jsx("button", { className: cn(s['text-red-500'], s['background-transparent'], s['font-bold'], s['uppercase'], s['p-2'], s['text-sm'], s['outline-none'], s['focus:outline-none'], s['mr-1'], s['mb-1']), type: "button", style: { transition: 'all .15s ease' }, onClick: () => {
|
|
16
16
|
setShowModal(false);
|
|
17
17
|
onClose && onClose();
|
|
18
|
-
}, children: closeTitle }), _jsx("button", { className: cn(s['bg-green-500'], s['text-white'], s['active:bg-green-600'], s['font-bold'], s['uppercase'], s['text-sm'], s['p-2'], s['rounded'], s['shadow'], s['hover:shadow-lg'], s['outline-none'], s['focus:outline-none'], s['mr-1'], s['mb-1']), type: "button", style: { transition: 'all .15s ease' }, onClick: () => {
|
|
18
|
+
}, children: closeTitle })), isClick && (_jsx("button", { className: cn(s['bg-green-500'], s['text-white'], s['active:bg-green-600'], s['font-bold'], s['uppercase'], s['text-sm'], s['p-2'], s['rounded'], s['shadow'], s['hover:shadow-lg'], s['outline-none'], s['focus:outline-none'], s['mr-1'], s['mb-1']), type: "button", style: { transition: 'all .15s ease' }, onClick: () => {
|
|
19
19
|
onClick();
|
|
20
|
-
}, children: submitTitle })] })] }) }) }), _jsx("div", { className: cn(s['opacity-25'], s['fixed'], s['inset-0'], s['z-40'], s['bg-black']) })] })) }) }));
|
|
20
|
+
}, children: submitTitle }))] })] }) }) }), _jsx("div", { className: cn(s['opacity-25'], s['fixed'], s['inset-0'], s['z-40'], s['bg-black']) })] })) }) }));
|
|
21
21
|
};
|