@sproutsocial/seeds-react-modal 1.0.1 → 1.0.3
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/.turbo/turbo-build.log +39 -19
- package/CHANGELOG.md +14 -0
- package/dist/Modal-ki8oiGbC.d.mts +69 -0
- package/dist/Modal-ki8oiGbC.d.ts +69 -0
- package/dist/ModalRail-OQ8DZ1vH.d.mts +178 -0
- package/dist/ModalRail-OQ8DZ1vH.d.ts +178 -0
- package/dist/esm/chunk-GKQRFPCX.js +642 -0
- package/dist/esm/chunk-GKQRFPCX.js.map +1 -0
- package/dist/esm/chunk-IYDY4OPB.js +237 -0
- package/dist/esm/chunk-IYDY4OPB.js.map +1 -0
- package/dist/esm/index.js +28 -231
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/v1/index.js +9 -0
- package/dist/esm/v1/index.js.map +1 -0
- package/dist/esm/v2/index.js +39 -0
- package/dist/esm/v2/index.js.map +1 -0
- package/dist/index.d.mts +11 -73
- package/dist/index.d.ts +11 -73
- package/dist/index.js +670 -25
- package/dist/index.js.map +1 -1
- package/dist/v1/index.d.mts +11 -0
- package/dist/v1/index.d.ts +11 -0
- package/dist/v1/index.js +273 -0
- package/dist/v1/index.js.map +1 -0
- package/dist/v2/index.d.mts +26 -0
- package/dist/v2/index.d.ts +26 -0
- package/dist/v2/index.js +694 -0
- package/dist/v2/index.js.map +1 -0
- package/package.json +33 -13
- package/src/Modal.stories.tsx +3 -6
- package/src/Modal.tsx +12 -13
- package/src/__tests__/v1/Modal.test.tsx +134 -0
- package/src/__tests__/v1/Modal.typetest.tsx +209 -0
- package/src/index.ts +36 -3
- package/src/shared/constants.ts +28 -0
- package/src/v1/Modal.tsx +159 -0
- package/src/v1/ModalTypes.ts +67 -0
- package/src/v1/index.ts +14 -0
- package/src/v1/styles.tsx +141 -0
- package/src/v2/ModalV2.stories.tsx +282 -0
- package/src/v2/ModalV2.tsx +306 -0
- package/src/v2/ModalV2Styles.tsx +150 -0
- package/src/v2/ModalV2Types.ts +158 -0
- package/src/v2/components/ModalClose.tsx +29 -0
- package/src/v2/components/ModalCloseButton.tsx +100 -0
- package/src/v2/components/ModalContent.tsx +16 -0
- package/src/v2/components/ModalDescription.tsx +19 -0
- package/src/v2/components/ModalFooter.tsx +20 -0
- package/src/v2/components/ModalHeader.tsx +52 -0
- package/src/v2/components/ModalRail.tsx +121 -0
- package/src/v2/components/ModalTrigger.tsx +39 -0
- package/src/v2/components/index.ts +8 -0
- package/src/v2/index.ts +37 -0
- package/tsconfig.json +7 -1
- package/tsup.config.ts +5 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import {
|
|
2
|
+
BODY_PADDING,
|
|
3
|
+
DEFAULT_MODAL_BG,
|
|
4
|
+
DEFAULT_MODAL_WIDTH,
|
|
5
|
+
DEFAULT_MODAL_Z_INDEX,
|
|
6
|
+
DEFAULT_OVERLAY_Z_INDEX_OFFSET,
|
|
7
|
+
MODAL_PRIORITY_Z_INDEX,
|
|
8
|
+
MODAL_SIZE_PRESETS,
|
|
9
|
+
ModalAction,
|
|
10
|
+
ModalClose,
|
|
11
|
+
ModalCloseButton,
|
|
12
|
+
ModalContent,
|
|
13
|
+
ModalDescription,
|
|
14
|
+
ModalFooter,
|
|
15
|
+
ModalHeader,
|
|
16
|
+
ModalRail,
|
|
17
|
+
ModalTrigger,
|
|
18
|
+
ModalV2_default
|
|
19
|
+
} from "../chunk-GKQRFPCX.js";
|
|
20
|
+
export {
|
|
21
|
+
BODY_PADDING,
|
|
22
|
+
DEFAULT_MODAL_BG,
|
|
23
|
+
DEFAULT_MODAL_WIDTH,
|
|
24
|
+
DEFAULT_MODAL_Z_INDEX,
|
|
25
|
+
DEFAULT_OVERLAY_Z_INDEX_OFFSET,
|
|
26
|
+
MODAL_PRIORITY_Z_INDEX,
|
|
27
|
+
MODAL_SIZE_PRESETS,
|
|
28
|
+
ModalV2_default as Modal,
|
|
29
|
+
ModalAction,
|
|
30
|
+
ModalClose,
|
|
31
|
+
ModalCloseButton,
|
|
32
|
+
ModalContent,
|
|
33
|
+
ModalDescription,
|
|
34
|
+
ModalFooter,
|
|
35
|
+
ModalHeader,
|
|
36
|
+
ModalRail,
|
|
37
|
+
ModalTrigger
|
|
38
|
+
};
|
|
39
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
package/dist/index.d.mts
CHANGED
|
@@ -1,76 +1,14 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import { M as Modal } from './Modal-ki8oiGbC.mjs';
|
|
2
|
+
export { d as TypeModalCloseButtonProps, c as TypeModalContentProps, b as TypeModalFooterProps, a as TypeModalHeaderProps, T as TypeModalProps } from './Modal-ki8oiGbC.mjs';
|
|
3
|
+
export { i as ModalAction, g as ModalClose, f as ModalCloseButton, e as ModalContent, b as ModalDescription, d as ModalFooter, c as ModalHeader, h as ModalRail, a as ModalTrigger, M as ModalV2, q as TypeModalActionProps, p as TypeModalRailProps, k as TypeModalV2CloseButtonProps, n as TypeModalV2ContentProps, o as TypeModalV2DescriptionProps, m as TypeModalV2FooterProps, l as TypeModalV2HeaderProps, T as TypeModalV2Props, j as TypeModalV2TriggerProps } from './ModalRail-OQ8DZ1vH.mjs';
|
|
4
|
+
import 'react/jsx-runtime';
|
|
5
|
+
import 'react';
|
|
6
|
+
import 'react-modal';
|
|
7
|
+
import '@sproutsocial/seeds-react-box';
|
|
8
|
+
import '@sproutsocial/seeds-react-button';
|
|
9
|
+
import '@radix-ui/react-dialog';
|
|
10
|
+
import '@sproutsocial/seeds-react-icon';
|
|
6
11
|
|
|
7
|
-
interface TypeModalCloseButtonProps extends Omit<TypeButtonProps, "children"> {
|
|
8
|
-
children?: void | null;
|
|
9
|
-
}
|
|
10
|
-
interface TypeModalHeaderProps extends TypeBoxProps {
|
|
11
|
-
title?: string;
|
|
12
|
-
subtitle?: string;
|
|
13
|
-
/** Passing children will override the default modal header */
|
|
14
|
-
children?: React.ReactNode;
|
|
15
|
-
/** If you're rendering a custom header, you can use this prop to add a bottom border */
|
|
16
|
-
bordered?: boolean;
|
|
17
|
-
}
|
|
18
|
-
interface TypeModalFooterProps extends TypeBoxProps {
|
|
19
|
-
bg?: string;
|
|
20
|
-
children: React.ReactNode;
|
|
21
|
-
}
|
|
22
|
-
interface TypeModalContentProps extends TypeBoxProps {
|
|
23
|
-
children?: React.ReactNode;
|
|
24
|
-
}
|
|
25
|
-
interface TypeModalProps extends TypeContainerProps, Omit<ReactModal.Props, keyof TypeContainerProps | "onRequestClose"> {
|
|
26
|
-
/** section of app to aria hide for the modal */
|
|
27
|
-
appElementSelector?: string;
|
|
28
|
-
/** trigger to open or close the modal */
|
|
29
|
-
isOpen: boolean;
|
|
30
|
-
/** label for screen readers to announce the modal */
|
|
31
|
-
label: string;
|
|
32
|
-
/** body content of the modal */
|
|
33
|
-
children: React.ReactNode;
|
|
34
|
-
/** callback for close */
|
|
35
|
-
onClose?: () => void;
|
|
36
|
-
/** aria-label for modal X */
|
|
37
|
-
closeButtonLabel: string;
|
|
38
|
-
/** Controls the z-index CSS property */
|
|
39
|
-
zIndex?: number;
|
|
40
|
-
/** The max width of the modal container */
|
|
41
|
-
width?: string | number;
|
|
42
|
-
/**
|
|
43
|
-
* Custom attributes to be added to the modals container
|
|
44
|
-
* Each key will be prepended with "data-" when rendered in the DOM
|
|
45
|
-
*/
|
|
46
|
-
data?: Record<string, string | boolean | number>;
|
|
47
|
-
}
|
|
48
12
|
|
|
49
|
-
/**
|
|
50
|
-
* The modal you want
|
|
51
|
-
*/
|
|
52
|
-
declare const Modal: {
|
|
53
|
-
(props: TypeModalProps): react_jsx_runtime.JSX.Element;
|
|
54
|
-
defaultProps: {
|
|
55
|
-
width: string;
|
|
56
|
-
zIndex: number;
|
|
57
|
-
};
|
|
58
|
-
Header: {
|
|
59
|
-
(props: TypeModalHeaderProps): react_jsx_runtime.JSX.Element;
|
|
60
|
-
displayName: string;
|
|
61
|
-
};
|
|
62
|
-
Footer: {
|
|
63
|
-
(props: TypeModalFooterProps): react_jsx_runtime.JSX.Element;
|
|
64
|
-
defaultProps: {
|
|
65
|
-
bg: string;
|
|
66
|
-
};
|
|
67
|
-
displayName: string;
|
|
68
|
-
};
|
|
69
|
-
Content: React.ForwardRefExoticComponent<Omit<TypeModalContentProps, "ref"> & React.RefAttributes<unknown>>;
|
|
70
|
-
CloseButton: {
|
|
71
|
-
(props: TypeModalCloseButtonProps): react_jsx_runtime.JSX.Element | null;
|
|
72
|
-
displayName: string;
|
|
73
|
-
};
|
|
74
|
-
};
|
|
75
13
|
|
|
76
|
-
export { Modal,
|
|
14
|
+
export { Modal, Modal as default };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,76 +1,14 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import { M as Modal } from './Modal-ki8oiGbC.js';
|
|
2
|
+
export { d as TypeModalCloseButtonProps, c as TypeModalContentProps, b as TypeModalFooterProps, a as TypeModalHeaderProps, T as TypeModalProps } from './Modal-ki8oiGbC.js';
|
|
3
|
+
export { i as ModalAction, g as ModalClose, f as ModalCloseButton, e as ModalContent, b as ModalDescription, d as ModalFooter, c as ModalHeader, h as ModalRail, a as ModalTrigger, M as ModalV2, q as TypeModalActionProps, p as TypeModalRailProps, k as TypeModalV2CloseButtonProps, n as TypeModalV2ContentProps, o as TypeModalV2DescriptionProps, m as TypeModalV2FooterProps, l as TypeModalV2HeaderProps, T as TypeModalV2Props, j as TypeModalV2TriggerProps } from './ModalRail-OQ8DZ1vH.js';
|
|
4
|
+
import 'react/jsx-runtime';
|
|
5
|
+
import 'react';
|
|
6
|
+
import 'react-modal';
|
|
7
|
+
import '@sproutsocial/seeds-react-box';
|
|
8
|
+
import '@sproutsocial/seeds-react-button';
|
|
9
|
+
import '@radix-ui/react-dialog';
|
|
10
|
+
import '@sproutsocial/seeds-react-icon';
|
|
6
11
|
|
|
7
|
-
interface TypeModalCloseButtonProps extends Omit<TypeButtonProps, "children"> {
|
|
8
|
-
children?: void | null;
|
|
9
|
-
}
|
|
10
|
-
interface TypeModalHeaderProps extends TypeBoxProps {
|
|
11
|
-
title?: string;
|
|
12
|
-
subtitle?: string;
|
|
13
|
-
/** Passing children will override the default modal header */
|
|
14
|
-
children?: React.ReactNode;
|
|
15
|
-
/** If you're rendering a custom header, you can use this prop to add a bottom border */
|
|
16
|
-
bordered?: boolean;
|
|
17
|
-
}
|
|
18
|
-
interface TypeModalFooterProps extends TypeBoxProps {
|
|
19
|
-
bg?: string;
|
|
20
|
-
children: React.ReactNode;
|
|
21
|
-
}
|
|
22
|
-
interface TypeModalContentProps extends TypeBoxProps {
|
|
23
|
-
children?: React.ReactNode;
|
|
24
|
-
}
|
|
25
|
-
interface TypeModalProps extends TypeContainerProps, Omit<ReactModal.Props, keyof TypeContainerProps | "onRequestClose"> {
|
|
26
|
-
/** section of app to aria hide for the modal */
|
|
27
|
-
appElementSelector?: string;
|
|
28
|
-
/** trigger to open or close the modal */
|
|
29
|
-
isOpen: boolean;
|
|
30
|
-
/** label for screen readers to announce the modal */
|
|
31
|
-
label: string;
|
|
32
|
-
/** body content of the modal */
|
|
33
|
-
children: React.ReactNode;
|
|
34
|
-
/** callback for close */
|
|
35
|
-
onClose?: () => void;
|
|
36
|
-
/** aria-label for modal X */
|
|
37
|
-
closeButtonLabel: string;
|
|
38
|
-
/** Controls the z-index CSS property */
|
|
39
|
-
zIndex?: number;
|
|
40
|
-
/** The max width of the modal container */
|
|
41
|
-
width?: string | number;
|
|
42
|
-
/**
|
|
43
|
-
* Custom attributes to be added to the modals container
|
|
44
|
-
* Each key will be prepended with "data-" when rendered in the DOM
|
|
45
|
-
*/
|
|
46
|
-
data?: Record<string, string | boolean | number>;
|
|
47
|
-
}
|
|
48
12
|
|
|
49
|
-
/**
|
|
50
|
-
* The modal you want
|
|
51
|
-
*/
|
|
52
|
-
declare const Modal: {
|
|
53
|
-
(props: TypeModalProps): react_jsx_runtime.JSX.Element;
|
|
54
|
-
defaultProps: {
|
|
55
|
-
width: string;
|
|
56
|
-
zIndex: number;
|
|
57
|
-
};
|
|
58
|
-
Header: {
|
|
59
|
-
(props: TypeModalHeaderProps): react_jsx_runtime.JSX.Element;
|
|
60
|
-
displayName: string;
|
|
61
|
-
};
|
|
62
|
-
Footer: {
|
|
63
|
-
(props: TypeModalFooterProps): react_jsx_runtime.JSX.Element;
|
|
64
|
-
defaultProps: {
|
|
65
|
-
bg: string;
|
|
66
|
-
};
|
|
67
|
-
displayName: string;
|
|
68
|
-
};
|
|
69
|
-
Content: React.ForwardRefExoticComponent<Omit<TypeModalContentProps, "ref"> & React.RefAttributes<unknown>>;
|
|
70
|
-
CloseButton: {
|
|
71
|
-
(props: TypeModalCloseButtonProps): react_jsx_runtime.JSX.Element | null;
|
|
72
|
-
displayName: string;
|
|
73
|
-
};
|
|
74
|
-
};
|
|
75
13
|
|
|
76
|
-
export { Modal,
|
|
14
|
+
export { Modal, Modal as default };
|