@mrshmllw/smores-react 9.2.0 → 9.3.0
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/Modal/Modal.d.ts +2 -0
- package/dist/Modal/Modal.js +7 -4
- package/dist/Modal/Modal.js.map +1 -1
- package/package.json +4 -1
package/dist/Modal/Modal.d.ts
CHANGED
|
@@ -3,6 +3,7 @@ export type ModalProps = {
|
|
|
3
3
|
title?: string;
|
|
4
4
|
icon?: string;
|
|
5
5
|
children?: ReactNode;
|
|
6
|
+
rightPanel?: ReactNode;
|
|
6
7
|
showModal?: boolean;
|
|
7
8
|
handleClick: () => void;
|
|
8
9
|
drawer?: boolean;
|
|
@@ -10,5 +11,6 @@ export type ModalProps = {
|
|
|
10
11
|
width?: string;
|
|
11
12
|
containerClass?: string;
|
|
12
13
|
portalContainer?: Element | DocumentFragment;
|
|
14
|
+
closeOnOverlayClick?: boolean;
|
|
13
15
|
};
|
|
14
16
|
export declare const Modal: FC<ModalProps>;
|
package/dist/Modal/Modal.js
CHANGED
|
@@ -6,16 +6,18 @@ import { Box } from '../Box';
|
|
|
6
6
|
import { IconStrict } from '../IconStrict';
|
|
7
7
|
import { Text } from '../Text';
|
|
8
8
|
import { useBodyScrollLock } from '../hooks/useBodyScrollLock';
|
|
9
|
-
export const Modal = ({ title = '', children, showModal = false, handleClick, drawer = true, cross = true, width, containerClass, portalContainer = document.body, }) => {
|
|
9
|
+
export const Modal = ({ title = '', children, rightPanel, showModal = false, handleClick, drawer = true, cross = true, width, containerClass, portalContainer = document.body, closeOnOverlayClick = true, }) => {
|
|
10
10
|
const modalRef = useRef(null);
|
|
11
11
|
useBodyScrollLock({ node: modalRef.current, showModal });
|
|
12
12
|
return createPortal(React.createElement(Wrapper, { "$showModal": showModal, ref: modalRef },
|
|
13
|
-
React.createElement(Overlay, { onClick: handleClick }),
|
|
13
|
+
React.createElement(Overlay, { onClick: () => closeOnOverlayClick && handleClick(), closeOnOverlayClick: closeOnOverlayClick }),
|
|
14
14
|
React.createElement(Container, { "$drawer": drawer, "$width": width || '460px', className: containerClass },
|
|
15
15
|
React.createElement(Box, { flex: true, alignItems: "flex-start", justifyContent: "space-between", mb: "8px" },
|
|
16
16
|
React.createElement(TitleElements, { flex: true, direction: "column" },
|
|
17
17
|
React.createElement(Text, { tag: "h2", typo: "heading-small", align: "left" }, title)),
|
|
18
|
-
|
|
18
|
+
React.createElement(Box, { flex: true, alignItems: "center", gap: '8px' },
|
|
19
|
+
rightPanel,
|
|
20
|
+
cross && (React.createElement(IconStrict, { render: "cross", backgroundColor: "oatmeal", handleClick: handleClick, size: 36 })))),
|
|
19
21
|
React.createElement(Box, { flex: true, direction: "column" }, children))), portalContainer);
|
|
20
22
|
};
|
|
21
23
|
const Wrapper = styled(Box)(({ $showModal }) => css `
|
|
@@ -32,7 +34,7 @@ const Wrapper = styled(Box)(({ $showModal }) => css `
|
|
|
32
34
|
const Overlay = styled.div `
|
|
33
35
|
position: fixed;
|
|
34
36
|
background: ${theme.colors.liquorice};
|
|
35
|
-
cursor: pointer;
|
|
37
|
+
cursor: ${(props) => (props.closeOnOverlayClick ? 'pointer' : 'default')};
|
|
36
38
|
opacity: 0.4;
|
|
37
39
|
top: 0;
|
|
38
40
|
bottom: 0;
|
|
@@ -49,6 +51,7 @@ const Container = styled.div(({ $drawer, $width }) => css `
|
|
|
49
51
|
position: fixed;
|
|
50
52
|
max-height: calc(100vh - 64px);
|
|
51
53
|
overflow: auto;
|
|
54
|
+
transition: all 0.3s ease-in-out;
|
|
52
55
|
|
|
53
56
|
${$drawer === true &&
|
|
54
57
|
css `
|
package/dist/Modal/Modal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../src/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,MAAM,EAAE,MAAM,OAAO,CAAA;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AACxC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;
|
|
1
|
+
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../src/Modal/Modal.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mrshmllw/smores-react",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.3.0",
|
|
4
4
|
"main": "./dist/index.js",
|
|
5
5
|
"description": "Collection of React components used by Marshmallow Technology",
|
|
6
6
|
"keywords": [
|
|
@@ -28,6 +28,7 @@
|
|
|
28
28
|
"snyk-protect": "snyk-protect",
|
|
29
29
|
"prepare": "npm run snyk-protect && husky",
|
|
30
30
|
"pre-commit-lint": "npm run check-types && lint-staged",
|
|
31
|
+
"commitlint": "commitlint --edit",
|
|
31
32
|
"fix-package-lock-conflicts": "echo \"Make sure conflicts in package.json are resolved before running this script\" && npm i --package-lock-only"
|
|
32
33
|
},
|
|
33
34
|
"devDependencies": {
|
|
@@ -37,6 +38,8 @@
|
|
|
37
38
|
"@babel/preset-env": "^7.20.2",
|
|
38
39
|
"@babel/preset-react": "^7.18.6",
|
|
39
40
|
"@babel/preset-typescript": "^7.18.6",
|
|
41
|
+
"@commitlint/cli": "^19.3.0",
|
|
42
|
+
"@commitlint/types": "^19.0.3",
|
|
40
43
|
"@semantic-release/changelog": "^6.0.3",
|
|
41
44
|
"@semantic-release/git": "^10.0.1",
|
|
42
45
|
"@semantic-release/github": "^10.0.2",
|