@mrshmllw/smores-react 12.9.1 → 12.9.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.
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
import React, { FC
|
|
2
|
-
import { SnackbarContextType } from './types';
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
import { SnackbarContextType, SnackbarContainerProps } from './types';
|
|
3
3
|
export declare const SnackbarContext: React.Context<SnackbarContextType>;
|
|
4
4
|
export declare const useSnackbarContext: () => SnackbarContextType;
|
|
5
|
-
export declare const SnackbarContainer: FC<
|
|
6
|
-
children?: ReactNode;
|
|
7
|
-
}>;
|
|
5
|
+
export declare const SnackbarContainer: FC<SnackbarContainerProps>;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React, { createContext, useCallback, useContext, useRef, useState, } from 'react';
|
|
2
|
+
import { createPortal } from 'react-dom';
|
|
2
3
|
import styled from 'styled-components';
|
|
3
4
|
import { SnackbarItem } from './SnackbarItem';
|
|
4
5
|
export const SnackbarContext = createContext({
|
|
@@ -7,7 +8,7 @@ export const SnackbarContext = createContext({
|
|
|
7
8
|
},
|
|
8
9
|
});
|
|
9
10
|
export const useSnackbarContext = () => useContext(SnackbarContext);
|
|
10
|
-
export const SnackbarContainer = ({ children, }) => {
|
|
11
|
+
export const SnackbarContainer = ({ children, portalContainer = document.body, }) => {
|
|
11
12
|
const snackbarIdRef = useRef(0);
|
|
12
13
|
const [snackbars, setSnackbars] = useState([]);
|
|
13
14
|
// create snackbar unique ID
|
|
@@ -30,7 +31,7 @@ export const SnackbarContainer = ({ children, }) => {
|
|
|
30
31
|
addSnackbar,
|
|
31
32
|
} },
|
|
32
33
|
children,
|
|
33
|
-
React.createElement(SnackbarWrapper, null, snackbars.map((snackbar) => (React.createElement(SnackbarItem, { key: snackbar.id, ...snackbar, deleteSnack: deleteSnackbar }))))));
|
|
34
|
+
createPortal(React.createElement(SnackbarWrapper, null, snackbars.map((snackbar) => (React.createElement(SnackbarItem, { key: snackbar.id, ...snackbar, deleteSnack: deleteSnackbar })))), portalContainer)));
|
|
34
35
|
};
|
|
35
36
|
const SnackbarWrapper = styled.div `
|
|
36
37
|
position: fixed;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SnackbarContainer.js","sourceRoot":"","sources":["../../src/Snackbar/SnackbarContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,aAAa,
|
|
1
|
+
{"version":3,"file":"SnackbarContainer.js","sourceRoot":"","sources":["../../src/Snackbar/SnackbarContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,aAAa,EAEb,WAAW,EACX,UAAU,EACV,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AACxC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAQ7C,MAAM,CAAC,MAAM,eAAe,GAAG,aAAa,CAAsB;IAChE,WAAW,EAAE,GAAG,EAAE;QAChB,MAAM,IAAI,KAAK,CAAC,sDAAsD,CAAC,CAAA;IACzE,CAAC;CACF,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,eAAe,CAAC,CAAA;AAEnE,MAAM,CAAC,MAAM,iBAAiB,GAA+B,CAAC,EAC5D,QAAQ,EACR,eAAe,GAAG,QAAQ,CAAC,IAAI,GAChC,EAAE,EAAE;IACH,MAAM,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,CAAA;IAC/B,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAa,EAAE,CAAC,CAAA;IAE1D,4BAA4B;IAC5B,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE;QAClC,MAAM,KAAK,GAAG,eAAe,aAAa,CAAC,OAAO,EAAE,CAAA;QACpD,aAAa,CAAC,OAAO,GAAG,CAAC,CAAC,CAAA;QAC1B,OAAO,KAAK,CAAA;IACd,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,QAAqB,EAAE,EAAE;QACxD,MAAM,QAAQ,GAAG;YACf,GAAG,QAAQ;YACX,EAAE,EAAE,UAAU,EAAE;SACjB,CAAA;QACD,YAAY,CAAC,CAAC,GAAG,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAA;IACxC,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,cAAc,GAAG,CAAC,EAAU,EAAE,EAAE;QACpC,YAAY,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAA;IAClE,CAAC,CAAA;IAED,OAAO,CACL,oBAAC,eAAe,CAAC,QAAQ,IACvB,KAAK,EAAE;YACL,WAAW;SACZ;QAEA,QAAQ;QACR,YAAY,CACX,oBAAC,eAAe,QACb,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAC3B,oBAAC,YAAY,IACX,GAAG,EAAE,QAAQ,CAAC,EAAE,KACZ,QAAQ,EACZ,WAAW,EAAE,cAAc,GAC3B,CACH,CAAC,CACc,EAClB,eAAe,CAChB,CACwB,CAC5B,CAAA;AACH,CAAC,CAAA;AAED,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;CASjC,CAAA","sourcesContent":["import React, {\n createContext,\n FC,\n useCallback,\n useContext,\n useRef,\n useState,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport styled from 'styled-components'\nimport { SnackbarItem } from './SnackbarItem'\nimport {\n CreateSnack,\n Snackbar,\n SnackbarContextType,\n SnackbarContainerProps,\n} from './types'\n\nexport const SnackbarContext = createContext<SnackbarContextType>({\n addSnackbar: () => {\n throw new Error('Please add the SnackbarContainer to your application')\n },\n})\n\nexport const useSnackbarContext = () => useContext(SnackbarContext)\n\nexport const SnackbarContainer: FC<SnackbarContainerProps> = ({\n children,\n portalContainer = document.body,\n}) => {\n const snackbarIdRef = useRef(0)\n const [snackbars, setSnackbars] = useState<Snackbar[]>([])\n\n // create snackbar unique ID\n const newSnackId = useCallback(() => {\n const newId = `MM_SNACKBAR_${snackbarIdRef.current}`\n snackbarIdRef.current = +1\n return newId\n }, [])\n\n const addSnackbar = useCallback((snackbar: CreateSnack) => {\n const newSnack = {\n ...snackbar,\n id: newSnackId(),\n }\n setSnackbars([...snackbars, newSnack])\n }, [])\n\n const deleteSnackbar = (id: string) => {\n setSnackbars(snackbars.filter((snackbar) => snackbar.id !== id))\n }\n\n return (\n <SnackbarContext.Provider\n value={{\n addSnackbar,\n }}\n >\n {children}\n {createPortal(\n <SnackbarWrapper>\n {snackbars.map((snackbar) => (\n <SnackbarItem\n key={snackbar.id}\n {...snackbar}\n deleteSnack={deleteSnackbar}\n />\n ))}\n </SnackbarWrapper>,\n portalContainer,\n )}\n </SnackbarContext.Provider>\n )\n}\n\nconst SnackbarWrapper = styled.div`\n position: fixed;\n bottom: 35px;\n left: 0;\n right: 0;\n margin: 0 auto;\n width: 90%;\n max-width: 875px;\n z-index: 1000;\n`\n"]}
|
package/dist/Snackbar/types.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Icons } from '../Icon/iconsList';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
2
3
|
export interface Snackbar {
|
|
3
4
|
id: string;
|
|
4
5
|
message: string;
|
|
@@ -11,3 +12,7 @@ export type CreateSnack = Omit<Snackbar, 'id'>;
|
|
|
11
12
|
export interface SnackbarContextType {
|
|
12
13
|
addSnackbar: (snackbar: CreateSnack) => void;
|
|
13
14
|
}
|
|
15
|
+
export interface SnackbarContainerProps {
|
|
16
|
+
children?: ReactNode;
|
|
17
|
+
portalContainer?: Element | DocumentFragment;
|
|
18
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/Snackbar/types.ts"],"names":[],"mappings":"","sourcesContent":["import { Icons } from '../Icon/iconsList'\n\nexport interface Snackbar {\n id: string\n message: string\n autoCloseTime?: 4 | 5 | 6 | 7 | 8 | 9 | 10\n leadingIcon?: Icons\n canManuallyClose?: boolean\n showCloseIcon?: boolean\n}\n\nexport type CreateSnack = Omit<Snackbar, 'id'>\n\nexport interface SnackbarContextType {\n addSnackbar: (snackbar: CreateSnack) => void\n}\n"]}
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/Snackbar/types.ts"],"names":[],"mappings":"","sourcesContent":["import { Icons } from '../Icon/iconsList'\nimport { ReactNode } from 'react'\n\nexport interface Snackbar {\n id: string\n message: string\n autoCloseTime?: 4 | 5 | 6 | 7 | 8 | 9 | 10\n leadingIcon?: Icons\n canManuallyClose?: boolean\n showCloseIcon?: boolean\n}\n\nexport type CreateSnack = Omit<Snackbar, 'id'>\n\nexport interface SnackbarContextType {\n addSnackbar: (snackbar: CreateSnack) => void\n}\n\nexport interface SnackbarContainerProps {\n children?: ReactNode\n portalContainer?: Element | DocumentFragment\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mrshmllw/smores-react",
|
|
3
|
-
"version": "12.9.
|
|
3
|
+
"version": "12.9.2",
|
|
4
4
|
"main": "./dist/index.js",
|
|
5
5
|
"description": "Collection of React components used by Marshmallow Technology",
|
|
6
6
|
"type": "module",
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"@commitlint/types": "^19.8.0",
|
|
40
40
|
"@semantic-release/changelog": "^6.0.3",
|
|
41
41
|
"@semantic-release/git": "^10.0.1",
|
|
42
|
-
"@semantic-release/github": "^11.0.
|
|
42
|
+
"@semantic-release/github": "^11.0.3",
|
|
43
43
|
"@semantic-release/npm": "^12.0.0",
|
|
44
44
|
"@snyk/protect": "^1.1297.1",
|
|
45
45
|
"@storybook/addon-a11y": "^8.6.14",
|
|
@@ -55,8 +55,8 @@
|
|
|
55
55
|
"@testing-library/react": "^16.3.0",
|
|
56
56
|
"@types/body-scroll-lock": "^3.1.0",
|
|
57
57
|
"@types/dompurify": "^3.2.0",
|
|
58
|
-
"@types/node": "^22.15.
|
|
59
|
-
"@types/react": "^19.1.
|
|
58
|
+
"@types/node": "^22.15.21",
|
|
59
|
+
"@types/react": "^19.1.5",
|
|
60
60
|
"@types/react-dom": "^19.1.5",
|
|
61
61
|
"@typescript-eslint/eslint-plugin": "^8.32.1",
|
|
62
62
|
"@typescript-eslint/parser": "^8.32.1",
|
|
@@ -75,7 +75,7 @@
|
|
|
75
75
|
"react": "^19.0.0",
|
|
76
76
|
"react-dom": "^19.1.0",
|
|
77
77
|
"rimraf": "^6.0.1",
|
|
78
|
-
"semantic-release": "^24.2.
|
|
78
|
+
"semantic-release": "^24.2.5",
|
|
79
79
|
"storybook": "^8.0.4",
|
|
80
80
|
"styled-components": "^6.1.18",
|
|
81
81
|
"typescript": "^5.8.3",
|
|
@@ -84,8 +84,8 @@
|
|
|
84
84
|
"vitest": "^3.1.4"
|
|
85
85
|
},
|
|
86
86
|
"dependencies": {
|
|
87
|
-
"@floating-ui/react": "0.27.
|
|
88
|
-
"@lexical/react": "^0.31.
|
|
87
|
+
"@floating-ui/react": "0.27.9",
|
|
88
|
+
"@lexical/react": "^0.31.2",
|
|
89
89
|
"body-scroll-lock": "^4.0.0-beta.0",
|
|
90
90
|
"date-fns": "^4.1.0",
|
|
91
91
|
"dompurify": "^3.2.6",
|