@elementor/editor-notifications 4.0.0-619 → 4.0.0-manual
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/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +5 -3
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +5 -3
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -3
- package/src/hooks/use-enqueue-notifications.tsx +3 -0
- package/src/types.ts +1 -0
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -79,6 +79,7 @@ var notificationsSlice = (0, import_store.__createSlice)({
|
|
|
79
79
|
var { notifyAction, clearAction } = notificationsSlice.actions;
|
|
80
80
|
|
|
81
81
|
// src/hooks/use-enqueue-notifications.tsx
|
|
82
|
+
var AUTO_HIDE_DURATION = 8e3;
|
|
82
83
|
var useEnqueueNotification = (notifications) => {
|
|
83
84
|
const { enqueueSnackbar } = (0, import_notistack.useSnackbar)();
|
|
84
85
|
const dispatch = (0, import_store2.__useDispatch)();
|
|
@@ -100,7 +101,8 @@ var useEnqueueNotification = (notifications) => {
|
|
|
100
101
|
key: notification.id,
|
|
101
102
|
onClose: () => dispatch(clearAction({ id: notification.id })),
|
|
102
103
|
preventDuplicate: true,
|
|
103
|
-
action: /* @__PURE__ */ React.createElement(Action, null)
|
|
104
|
+
action: /* @__PURE__ */ React.createElement(Action, null),
|
|
105
|
+
autoHideDuration: notification.autoHideDuration ?? AUTO_HIDE_DURATION
|
|
104
106
|
});
|
|
105
107
|
});
|
|
106
108
|
}, [notifications, enqueueSnackbar, dispatch]);
|
|
@@ -112,7 +114,7 @@ function getEditingPanelWidth() {
|
|
|
112
114
|
}
|
|
113
115
|
|
|
114
116
|
// src/components/notifications.tsx
|
|
115
|
-
var
|
|
117
|
+
var AUTO_HIDE_DURATION2 = 8e3;
|
|
116
118
|
var DefaultCustomSnackbar = (0, import_react2.forwardRef)((props, ref) => {
|
|
117
119
|
const filteredProps = getFilteredSnackbarProps(props);
|
|
118
120
|
const panelWidth = getEditingPanelWidth();
|
|
@@ -141,7 +143,7 @@ var Wrapper = () => {
|
|
|
141
143
|
import_notistack2.SnackbarProvider,
|
|
142
144
|
{
|
|
143
145
|
maxSnack: 3,
|
|
144
|
-
autoHideDuration:
|
|
146
|
+
autoHideDuration: AUTO_HIDE_DURATION2,
|
|
145
147
|
anchorOrigin: { horizontal: "center", vertical: "bottom" },
|
|
146
148
|
Components: muiToEuiMapper
|
|
147
149
|
},
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/init.ts","../src/components/notifications.tsx","../src/hooks/use-enqueue-notifications.tsx","../src/slice.ts","../src/sync/get-editing-panel-width.ts"],"sourcesContent":["export { init } from './init';\n\nexport { type NotificationData } from './types';\nexport { NotifyReact, notify } from './components/notifications';\n","import { injectIntoTop } from '@elementor/editor';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport Wrapper from './components/notifications';\nimport { notificationsSlice } from './slice';\n\nexport function init() {\n\tregisterSlice( notificationsSlice );\n\tinjectIntoTop( {\n\t\tid: 'notifications',\n\t\tcomponent: Wrapper,\n\t} );\n}\n","import * as React from 'react';\nimport { forwardRef } from 'react';\nimport { SnackbarProvider } from 'notistack';\nimport { __getStore as getStore, __useDispatch as useDispatch, __useSelector as useSelector } from '@elementor/store';\nimport { SnackbarContent, type SnackbarProps, ThemeProvider } from '@elementor/ui';\n\nimport { useEnqueueNotification } from '../hooks/use-enqueue-notifications';\nimport { notifyAction } from '../slice';\nimport { getEditingPanelWidth } from '../sync/get-editing-panel-width';\nimport { type NotificationData, type Notifications } from '../types';\n\n// 8 seconds\nconst AUTO_HIDE_DURATION = 8000;\n\nconst DefaultCustomSnackbar = forwardRef( ( props: SnackbarProps, ref ) => {\n\tconst filteredProps = getFilteredSnackbarProps( props );\n\tconst panelWidth = getEditingPanelWidth();\n\n\treturn (\n\t\t<ThemeProvider palette=\"unstable\">\n\t\t\t<SnackbarContent\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...filteredProps }\n\t\t\t\tsx={ {\n\t\t\t\t\t'&.MuiPaper-root': { minWidth: 'max-content' },\n\t\t\t\t\tml: panelWidth + 'px',\n\t\t\t\t} }\n\t\t\t/>\n\t\t</ThemeProvider>\n\t);\n} );\n\nconst muiToEuiMapper = {\n\tdefault: DefaultCustomSnackbar,\n};\n\nconst Handler = () => {\n\tconst notifications = useSelector( ( state: { notifications: Notifications } ) => state.notifications );\n\n\tuseEnqueueNotification( notifications );\n\n\treturn null;\n};\n\nconst Wrapper = () => {\n\treturn (\n\t\t<SnackbarProvider\n\t\t\tmaxSnack={ 3 }\n\t\t\tautoHideDuration={ AUTO_HIDE_DURATION }\n\t\t\tanchorOrigin={ { horizontal: 'center', vertical: 'bottom' } }\n\t\t\tComponents={ muiToEuiMapper }\n\t\t>\n\t\t\t<Handler />\n\t\t</SnackbarProvider>\n\t);\n};\n\n/*\n * This function can be used to trigger notifications from anywhere in the code.\n * even if you're running in a JS environment as opposed to a React environment.\n */\nexport function notify( notification: NotificationData ) {\n\tconst store = getStore();\n\n\tstore?.dispatch( notifyAction( notification ) );\n}\n\n/*\n * This function can be used to trigger notifications from within a React component.\n * This is the preferred way to trigger notifications.\n */\nexport function NotifyReact( notification: NotificationData ) {\n\tconst dispatch = useDispatch();\n\tdispatch( notifyAction( notification ) );\n}\n\nfunction getFilteredSnackbarProps( props: SnackbarProps ) {\n\tconst forbiddenProps = [ 'autoHideDuration', 'persist', 'hideIconVariant', 'iconVariant', 'anchorOrigin' ];\n\n\treturn Object.entries( props ).reduce(\n\t\t( filteredProps, [ key, value ] ) => {\n\t\t\tif ( ! forbiddenProps.includes( key ) ) {\n\t\t\t\tfilteredProps[ key ] = value;\n\t\t\t}\n\n\t\t\treturn filteredProps;\n\t\t},\n\t\t{} as Record< string, unknown >\n\t);\n}\n\nexport default Wrapper;\n","import { Fragment, useEffect } from 'react';\nimport * as React from 'react';\nimport { closeSnackbar, useSnackbar, type VariantType } from 'notistack';\nimport { __useDispatch as useDispatch } from '@elementor/store';\nimport { Button, CloseButton } from '@elementor/ui';\n\nimport { clearAction } from '../slice';\nimport type { Notifications } from '../types';\n\nexport const useEnqueueNotification = ( notifications: Notifications ) => {\n\tconst { enqueueSnackbar } = useSnackbar();\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tObject.values( notifications ).forEach( ( notification ) => {\n\t\t\tconst Action = () => (\n\t\t\t\t<Fragment key={ notification.id }>\n\t\t\t\t\t{ notification.additionalActionProps?.map( ( additionalAction, index ) => (\n\t\t\t\t\t\t<Button key={ `${ index }` } { ...additionalAction } />\n\t\t\t\t\t) ) }\n\n\t\t\t\t\t<CloseButton\n\t\t\t\t\t\taria-label=\"close\"\n\t\t\t\t\t\tcolor=\"inherit\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tcloseSnackbar( notification.id );\n\t\t\t\t\t\t\tdispatch( clearAction( { id: notification.id } ) );\n\t\t\t\t\t\t} }\n\t\t\t\t\t></CloseButton>\n\t\t\t\t</Fragment>\n\t\t\t);\n\n\t\t\tenqueueSnackbar( notification.message, {\n\t\t\t\tvariant: notification.type as VariantType,\n\t\t\t\tkey: notification.id,\n\t\t\t\tonClose: () => dispatch( clearAction( { id: notification.id } ) ),\n\t\t\t\tpreventDuplicate: true,\n\t\t\t\taction: <Action />,\n\t\t\t} );\n\t\t} );\n\t}, [ notifications, enqueueSnackbar, dispatch ] );\n};\n","import { __createSlice as createSlice } from '@elementor/store';\n\nimport { type Notifications } from './types';\n\nexport const notificationsSlice = createSlice( {\n\tname: 'notifications',\n\tinitialState: {} as Notifications,\n\treducers: {\n\t\tnotifyAction: ( state, action ) => {\n\t\t\tconst newState = { ...state };\n\t\t\tif ( ! newState[ action.payload.id ] ) {\n\t\t\t\tnewState[ action.payload.id ] = action.payload;\n\t\t\t}\n\n\t\t\treturn newState;\n\t\t},\n\t\tclearAction: ( state, action ) => {\n\t\t\tconst newState = { ...state };\n\t\t\tif ( newState[ action.payload.id ] ) {\n\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-dynamic-delete\n\t\t\t\tdelete newState[ action.payload.id ];\n\t\t\t}\n\n\t\t\treturn newState;\n\t\t},\n\t},\n} );\n\nexport const { notifyAction, clearAction } = notificationsSlice.actions;\n","export function getEditingPanelWidth() {\n\treturn document.querySelector( '.elementor-panel' )?.clientWidth || 0;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,oBAA8B;AAC9B,IAAAA,gBAAiD;;;ACDjD,IAAAC,SAAuB;AACvB,IAAAC,gBAA2B;AAC3B,IAAAC,oBAAiC;AACjC,IAAAC,gBAAmG;AACnG,IAAAC,aAAmE;;;ACJnE,mBAAoC;AACpC,YAAuB;AACvB,uBAA6D;AAC7D,IAAAC,gBAA6C;AAC7C,gBAAoC;;;ACJpC,mBAA6C;AAItC,IAAM,yBAAqB,aAAAC,eAAa;AAAA,EAC9C,MAAM;AAAA,EACN,cAAc,CAAC;AAAA,EACf,UAAU;AAAA,IACT,cAAc,CAAE,OAAO,WAAY;AAClC,YAAM,WAAW,EAAE,GAAG,MAAM;AAC5B,UAAK,CAAE,SAAU,OAAO,QAAQ,EAAG,GAAI;AACtC,iBAAU,OAAO,QAAQ,EAAG,IAAI,OAAO;AAAA,MACxC;AAEA,aAAO;AAAA,IACR;AAAA,IACA,aAAa,CAAE,OAAO,WAAY;AACjC,YAAM,WAAW,EAAE,GAAG,MAAM;AAC5B,UAAK,SAAU,OAAO,QAAQ,EAAG,GAAI;AAEpC,eAAO,SAAU,OAAO,QAAQ,EAAG;AAAA,MACpC;AAEA,aAAO;AAAA,IACR;AAAA,EACD;AACD,CAAE;AAEK,IAAM,EAAE,cAAc,YAAY,IAAI,mBAAmB;;;
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/init.ts","../src/components/notifications.tsx","../src/hooks/use-enqueue-notifications.tsx","../src/slice.ts","../src/sync/get-editing-panel-width.ts"],"sourcesContent":["export { init } from './init';\n\nexport { type NotificationData } from './types';\nexport { NotifyReact, notify } from './components/notifications';\n","import { injectIntoTop } from '@elementor/editor';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport Wrapper from './components/notifications';\nimport { notificationsSlice } from './slice';\n\nexport function init() {\n\tregisterSlice( notificationsSlice );\n\tinjectIntoTop( {\n\t\tid: 'notifications',\n\t\tcomponent: Wrapper,\n\t} );\n}\n","import * as React from 'react';\nimport { forwardRef } from 'react';\nimport { SnackbarProvider } from 'notistack';\nimport { __getStore as getStore, __useDispatch as useDispatch, __useSelector as useSelector } from '@elementor/store';\nimport { SnackbarContent, type SnackbarProps, ThemeProvider } from '@elementor/ui';\n\nimport { useEnqueueNotification } from '../hooks/use-enqueue-notifications';\nimport { notifyAction } from '../slice';\nimport { getEditingPanelWidth } from '../sync/get-editing-panel-width';\nimport { type NotificationData, type Notifications } from '../types';\n\n// 8 seconds\nconst AUTO_HIDE_DURATION = 8000;\n\nconst DefaultCustomSnackbar = forwardRef( ( props: SnackbarProps, ref ) => {\n\tconst filteredProps = getFilteredSnackbarProps( props );\n\tconst panelWidth = getEditingPanelWidth();\n\n\treturn (\n\t\t<ThemeProvider palette=\"unstable\">\n\t\t\t<SnackbarContent\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...filteredProps }\n\t\t\t\tsx={ {\n\t\t\t\t\t'&.MuiPaper-root': { minWidth: 'max-content' },\n\t\t\t\t\tml: panelWidth + 'px',\n\t\t\t\t} }\n\t\t\t/>\n\t\t</ThemeProvider>\n\t);\n} );\n\nconst muiToEuiMapper = {\n\tdefault: DefaultCustomSnackbar,\n};\n\nconst Handler = () => {\n\tconst notifications = useSelector( ( state: { notifications: Notifications } ) => state.notifications );\n\n\tuseEnqueueNotification( notifications );\n\n\treturn null;\n};\n\nconst Wrapper = () => {\n\treturn (\n\t\t<SnackbarProvider\n\t\t\tmaxSnack={ 3 }\n\t\t\tautoHideDuration={ AUTO_HIDE_DURATION }\n\t\t\tanchorOrigin={ { horizontal: 'center', vertical: 'bottom' } }\n\t\t\tComponents={ muiToEuiMapper }\n\t\t>\n\t\t\t<Handler />\n\t\t</SnackbarProvider>\n\t);\n};\n\n/*\n * This function can be used to trigger notifications from anywhere in the code.\n * even if you're running in a JS environment as opposed to a React environment.\n */\nexport function notify( notification: NotificationData ) {\n\tconst store = getStore();\n\n\tstore?.dispatch( notifyAction( notification ) );\n}\n\n/*\n * This function can be used to trigger notifications from within a React component.\n * This is the preferred way to trigger notifications.\n */\nexport function NotifyReact( notification: NotificationData ) {\n\tconst dispatch = useDispatch();\n\tdispatch( notifyAction( notification ) );\n}\n\nfunction getFilteredSnackbarProps( props: SnackbarProps ) {\n\tconst forbiddenProps = [ 'autoHideDuration', 'persist', 'hideIconVariant', 'iconVariant', 'anchorOrigin' ];\n\n\treturn Object.entries( props ).reduce(\n\t\t( filteredProps, [ key, value ] ) => {\n\t\t\tif ( ! forbiddenProps.includes( key ) ) {\n\t\t\t\tfilteredProps[ key ] = value;\n\t\t\t}\n\n\t\t\treturn filteredProps;\n\t\t},\n\t\t{} as Record< string, unknown >\n\t);\n}\n\nexport default Wrapper;\n","import { Fragment, useEffect } from 'react';\nimport * as React from 'react';\nimport { closeSnackbar, useSnackbar, type VariantType } from 'notistack';\nimport { __useDispatch as useDispatch } from '@elementor/store';\nimport { Button, CloseButton } from '@elementor/ui';\n\nimport { clearAction } from '../slice';\nimport type { Notifications } from '../types';\n\nconst AUTO_HIDE_DURATION = 8000;\n\nexport const useEnqueueNotification = ( notifications: Notifications ) => {\n\tconst { enqueueSnackbar } = useSnackbar();\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tObject.values( notifications ).forEach( ( notification ) => {\n\t\t\tconst Action = () => (\n\t\t\t\t<Fragment key={ notification.id }>\n\t\t\t\t\t{ notification.additionalActionProps?.map( ( additionalAction, index ) => (\n\t\t\t\t\t\t<Button key={ `${ index }` } { ...additionalAction } />\n\t\t\t\t\t) ) }\n\n\t\t\t\t\t<CloseButton\n\t\t\t\t\t\taria-label=\"close\"\n\t\t\t\t\t\tcolor=\"inherit\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tcloseSnackbar( notification.id );\n\t\t\t\t\t\t\tdispatch( clearAction( { id: notification.id } ) );\n\t\t\t\t\t\t} }\n\t\t\t\t\t></CloseButton>\n\t\t\t\t</Fragment>\n\t\t\t);\n\n\t\t\tenqueueSnackbar( notification.message, {\n\t\t\t\tvariant: notification.type as VariantType,\n\t\t\t\tkey: notification.id,\n\t\t\t\tonClose: () => dispatch( clearAction( { id: notification.id } ) ),\n\t\t\t\tpreventDuplicate: true,\n\t\t\t\taction: <Action />,\n\t\t\t\tautoHideDuration: notification.autoHideDuration ?? AUTO_HIDE_DURATION,\n\t\t\t} );\n\t\t} );\n\t}, [ notifications, enqueueSnackbar, dispatch ] );\n};\n","import { __createSlice as createSlice } from '@elementor/store';\n\nimport { type Notifications } from './types';\n\nexport const notificationsSlice = createSlice( {\n\tname: 'notifications',\n\tinitialState: {} as Notifications,\n\treducers: {\n\t\tnotifyAction: ( state, action ) => {\n\t\t\tconst newState = { ...state };\n\t\t\tif ( ! newState[ action.payload.id ] ) {\n\t\t\t\tnewState[ action.payload.id ] = action.payload;\n\t\t\t}\n\n\t\t\treturn newState;\n\t\t},\n\t\tclearAction: ( state, action ) => {\n\t\t\tconst newState = { ...state };\n\t\t\tif ( newState[ action.payload.id ] ) {\n\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-dynamic-delete\n\t\t\t\tdelete newState[ action.payload.id ];\n\t\t\t}\n\n\t\t\treturn newState;\n\t\t},\n\t},\n} );\n\nexport const { notifyAction, clearAction } = notificationsSlice.actions;\n","export function getEditingPanelWidth() {\n\treturn document.querySelector( '.elementor-panel' )?.clientWidth || 0;\n}\n"],"mappings":"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","names":["import_store","React","import_react","import_notistack","import_store","import_ui","import_store","createSlice","useDispatch","AUTO_HIDE_DURATION","useSelector","getStore","useDispatch","registerSlice"]}
|
package/dist/index.mjs
CHANGED
|
@@ -41,6 +41,7 @@ var notificationsSlice = createSlice({
|
|
|
41
41
|
var { notifyAction, clearAction } = notificationsSlice.actions;
|
|
42
42
|
|
|
43
43
|
// src/hooks/use-enqueue-notifications.tsx
|
|
44
|
+
var AUTO_HIDE_DURATION = 8e3;
|
|
44
45
|
var useEnqueueNotification = (notifications) => {
|
|
45
46
|
const { enqueueSnackbar } = useSnackbar();
|
|
46
47
|
const dispatch = useDispatch();
|
|
@@ -62,7 +63,8 @@ var useEnqueueNotification = (notifications) => {
|
|
|
62
63
|
key: notification.id,
|
|
63
64
|
onClose: () => dispatch(clearAction({ id: notification.id })),
|
|
64
65
|
preventDuplicate: true,
|
|
65
|
-
action: /* @__PURE__ */ React.createElement(Action, null)
|
|
66
|
+
action: /* @__PURE__ */ React.createElement(Action, null),
|
|
67
|
+
autoHideDuration: notification.autoHideDuration ?? AUTO_HIDE_DURATION
|
|
66
68
|
});
|
|
67
69
|
});
|
|
68
70
|
}, [notifications, enqueueSnackbar, dispatch]);
|
|
@@ -74,7 +76,7 @@ function getEditingPanelWidth() {
|
|
|
74
76
|
}
|
|
75
77
|
|
|
76
78
|
// src/components/notifications.tsx
|
|
77
|
-
var
|
|
79
|
+
var AUTO_HIDE_DURATION2 = 8e3;
|
|
78
80
|
var DefaultCustomSnackbar = forwardRef((props, ref) => {
|
|
79
81
|
const filteredProps = getFilteredSnackbarProps(props);
|
|
80
82
|
const panelWidth = getEditingPanelWidth();
|
|
@@ -103,7 +105,7 @@ var Wrapper = () => {
|
|
|
103
105
|
SnackbarProvider,
|
|
104
106
|
{
|
|
105
107
|
maxSnack: 3,
|
|
106
|
-
autoHideDuration:
|
|
108
|
+
autoHideDuration: AUTO_HIDE_DURATION2,
|
|
107
109
|
anchorOrigin: { horizontal: "center", vertical: "bottom" },
|
|
108
110
|
Components: muiToEuiMapper
|
|
109
111
|
},
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/init.ts","../src/components/notifications.tsx","../src/hooks/use-enqueue-notifications.tsx","../src/slice.ts","../src/sync/get-editing-panel-width.ts"],"sourcesContent":["import { injectIntoTop } from '@elementor/editor';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport Wrapper from './components/notifications';\nimport { notificationsSlice } from './slice';\n\nexport function init() {\n\tregisterSlice( notificationsSlice );\n\tinjectIntoTop( {\n\t\tid: 'notifications',\n\t\tcomponent: Wrapper,\n\t} );\n}\n","import * as React from 'react';\nimport { forwardRef } from 'react';\nimport { SnackbarProvider } from 'notistack';\nimport { __getStore as getStore, __useDispatch as useDispatch, __useSelector as useSelector } from '@elementor/store';\nimport { SnackbarContent, type SnackbarProps, ThemeProvider } from '@elementor/ui';\n\nimport { useEnqueueNotification } from '../hooks/use-enqueue-notifications';\nimport { notifyAction } from '../slice';\nimport { getEditingPanelWidth } from '../sync/get-editing-panel-width';\nimport { type NotificationData, type Notifications } from '../types';\n\n// 8 seconds\nconst AUTO_HIDE_DURATION = 8000;\n\nconst DefaultCustomSnackbar = forwardRef( ( props: SnackbarProps, ref ) => {\n\tconst filteredProps = getFilteredSnackbarProps( props );\n\tconst panelWidth = getEditingPanelWidth();\n\n\treturn (\n\t\t<ThemeProvider palette=\"unstable\">\n\t\t\t<SnackbarContent\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...filteredProps }\n\t\t\t\tsx={ {\n\t\t\t\t\t'&.MuiPaper-root': { minWidth: 'max-content' },\n\t\t\t\t\tml: panelWidth + 'px',\n\t\t\t\t} }\n\t\t\t/>\n\t\t</ThemeProvider>\n\t);\n} );\n\nconst muiToEuiMapper = {\n\tdefault: DefaultCustomSnackbar,\n};\n\nconst Handler = () => {\n\tconst notifications = useSelector( ( state: { notifications: Notifications } ) => state.notifications );\n\n\tuseEnqueueNotification( notifications );\n\n\treturn null;\n};\n\nconst Wrapper = () => {\n\treturn (\n\t\t<SnackbarProvider\n\t\t\tmaxSnack={ 3 }\n\t\t\tautoHideDuration={ AUTO_HIDE_DURATION }\n\t\t\tanchorOrigin={ { horizontal: 'center', vertical: 'bottom' } }\n\t\t\tComponents={ muiToEuiMapper }\n\t\t>\n\t\t\t<Handler />\n\t\t</SnackbarProvider>\n\t);\n};\n\n/*\n * This function can be used to trigger notifications from anywhere in the code.\n * even if you're running in a JS environment as opposed to a React environment.\n */\nexport function notify( notification: NotificationData ) {\n\tconst store = getStore();\n\n\tstore?.dispatch( notifyAction( notification ) );\n}\n\n/*\n * This function can be used to trigger notifications from within a React component.\n * This is the preferred way to trigger notifications.\n */\nexport function NotifyReact( notification: NotificationData ) {\n\tconst dispatch = useDispatch();\n\tdispatch( notifyAction( notification ) );\n}\n\nfunction getFilteredSnackbarProps( props: SnackbarProps ) {\n\tconst forbiddenProps = [ 'autoHideDuration', 'persist', 'hideIconVariant', 'iconVariant', 'anchorOrigin' ];\n\n\treturn Object.entries( props ).reduce(\n\t\t( filteredProps, [ key, value ] ) => {\n\t\t\tif ( ! forbiddenProps.includes( key ) ) {\n\t\t\t\tfilteredProps[ key ] = value;\n\t\t\t}\n\n\t\t\treturn filteredProps;\n\t\t},\n\t\t{} as Record< string, unknown >\n\t);\n}\n\nexport default Wrapper;\n","import { Fragment, useEffect } from 'react';\nimport * as React from 'react';\nimport { closeSnackbar, useSnackbar, type VariantType } from 'notistack';\nimport { __useDispatch as useDispatch } from '@elementor/store';\nimport { Button, CloseButton } from '@elementor/ui';\n\nimport { clearAction } from '../slice';\nimport type { Notifications } from '../types';\n\nexport const useEnqueueNotification = ( notifications: Notifications ) => {\n\tconst { enqueueSnackbar } = useSnackbar();\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tObject.values( notifications ).forEach( ( notification ) => {\n\t\t\tconst Action = () => (\n\t\t\t\t<Fragment key={ notification.id }>\n\t\t\t\t\t{ notification.additionalActionProps?.map( ( additionalAction, index ) => (\n\t\t\t\t\t\t<Button key={ `${ index }` } { ...additionalAction } />\n\t\t\t\t\t) ) }\n\n\t\t\t\t\t<CloseButton\n\t\t\t\t\t\taria-label=\"close\"\n\t\t\t\t\t\tcolor=\"inherit\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tcloseSnackbar( notification.id );\n\t\t\t\t\t\t\tdispatch( clearAction( { id: notification.id } ) );\n\t\t\t\t\t\t} }\n\t\t\t\t\t></CloseButton>\n\t\t\t\t</Fragment>\n\t\t\t);\n\n\t\t\tenqueueSnackbar( notification.message, {\n\t\t\t\tvariant: notification.type as VariantType,\n\t\t\t\tkey: notification.id,\n\t\t\t\tonClose: () => dispatch( clearAction( { id: notification.id } ) ),\n\t\t\t\tpreventDuplicate: true,\n\t\t\t\taction: <Action />,\n\t\t\t} );\n\t\t} );\n\t}, [ notifications, enqueueSnackbar, dispatch ] );\n};\n","import { __createSlice as createSlice } from '@elementor/store';\n\nimport { type Notifications } from './types';\n\nexport const notificationsSlice = createSlice( {\n\tname: 'notifications',\n\tinitialState: {} as Notifications,\n\treducers: {\n\t\tnotifyAction: ( state, action ) => {\n\t\t\tconst newState = { ...state };\n\t\t\tif ( ! newState[ action.payload.id ] ) {\n\t\t\t\tnewState[ action.payload.id ] = action.payload;\n\t\t\t}\n\n\t\t\treturn newState;\n\t\t},\n\t\tclearAction: ( state, action ) => {\n\t\t\tconst newState = { ...state };\n\t\t\tif ( newState[ action.payload.id ] ) {\n\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-dynamic-delete\n\t\t\t\tdelete newState[ action.payload.id ];\n\t\t\t}\n\n\t\t\treturn newState;\n\t\t},\n\t},\n} );\n\nexport const { notifyAction, clearAction } = notificationsSlice.actions;\n","export function getEditingPanelWidth() {\n\treturn document.querySelector( '.elementor-panel' )?.clientWidth || 0;\n}\n"],"mappings":";AAAA,SAAS,qBAAqB;AAC9B,SAAS,mBAAmB,qBAAqB;;;ACDjD,YAAYA,YAAW;AACvB,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB;AACjC,SAAS,cAAc,UAAU,iBAAiBC,cAAa,iBAAiB,mBAAmB;AACnG,SAAS,iBAAqC,qBAAqB;;;ACJnE,SAAS,UAAU,iBAAiB;AACpC,YAAY,WAAW;AACvB,SAAS,eAAe,mBAAqC;AAC7D,SAAS,iBAAiB,mBAAmB;AAC7C,SAAS,QAAQ,mBAAmB;;;ACJpC,SAAS,iBAAiB,mBAAmB;AAItC,IAAM,qBAAqB,YAAa;AAAA,EAC9C,MAAM;AAAA,EACN,cAAc,CAAC;AAAA,EACf,UAAU;AAAA,IACT,cAAc,CAAE,OAAO,WAAY;AAClC,YAAM,WAAW,EAAE,GAAG,MAAM;AAC5B,UAAK,CAAE,SAAU,OAAO,QAAQ,EAAG,GAAI;AACtC,iBAAU,OAAO,QAAQ,EAAG,IAAI,OAAO;AAAA,MACxC;AAEA,aAAO;AAAA,IACR;AAAA,IACA,aAAa,CAAE,OAAO,WAAY;AACjC,YAAM,WAAW,EAAE,GAAG,MAAM;AAC5B,UAAK,SAAU,OAAO,QAAQ,EAAG,GAAI;AAEpC,eAAO,SAAU,OAAO,QAAQ,EAAG;AAAA,MACpC;AAEA,aAAO;AAAA,IACR;AAAA,EACD;AACD,CAAE;AAEK,IAAM,EAAE,cAAc,YAAY,IAAI,mBAAmB;;;
|
|
1
|
+
{"version":3,"sources":["../src/init.ts","../src/components/notifications.tsx","../src/hooks/use-enqueue-notifications.tsx","../src/slice.ts","../src/sync/get-editing-panel-width.ts"],"sourcesContent":["import { injectIntoTop } from '@elementor/editor';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport Wrapper from './components/notifications';\nimport { notificationsSlice } from './slice';\n\nexport function init() {\n\tregisterSlice( notificationsSlice );\n\tinjectIntoTop( {\n\t\tid: 'notifications',\n\t\tcomponent: Wrapper,\n\t} );\n}\n","import * as React from 'react';\nimport { forwardRef } from 'react';\nimport { SnackbarProvider } from 'notistack';\nimport { __getStore as getStore, __useDispatch as useDispatch, __useSelector as useSelector } from '@elementor/store';\nimport { SnackbarContent, type SnackbarProps, ThemeProvider } from '@elementor/ui';\n\nimport { useEnqueueNotification } from '../hooks/use-enqueue-notifications';\nimport { notifyAction } from '../slice';\nimport { getEditingPanelWidth } from '../sync/get-editing-panel-width';\nimport { type NotificationData, type Notifications } from '../types';\n\n// 8 seconds\nconst AUTO_HIDE_DURATION = 8000;\n\nconst DefaultCustomSnackbar = forwardRef( ( props: SnackbarProps, ref ) => {\n\tconst filteredProps = getFilteredSnackbarProps( props );\n\tconst panelWidth = getEditingPanelWidth();\n\n\treturn (\n\t\t<ThemeProvider palette=\"unstable\">\n\t\t\t<SnackbarContent\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...filteredProps }\n\t\t\t\tsx={ {\n\t\t\t\t\t'&.MuiPaper-root': { minWidth: 'max-content' },\n\t\t\t\t\tml: panelWidth + 'px',\n\t\t\t\t} }\n\t\t\t/>\n\t\t</ThemeProvider>\n\t);\n} );\n\nconst muiToEuiMapper = {\n\tdefault: DefaultCustomSnackbar,\n};\n\nconst Handler = () => {\n\tconst notifications = useSelector( ( state: { notifications: Notifications } ) => state.notifications );\n\n\tuseEnqueueNotification( notifications );\n\n\treturn null;\n};\n\nconst Wrapper = () => {\n\treturn (\n\t\t<SnackbarProvider\n\t\t\tmaxSnack={ 3 }\n\t\t\tautoHideDuration={ AUTO_HIDE_DURATION }\n\t\t\tanchorOrigin={ { horizontal: 'center', vertical: 'bottom' } }\n\t\t\tComponents={ muiToEuiMapper }\n\t\t>\n\t\t\t<Handler />\n\t\t</SnackbarProvider>\n\t);\n};\n\n/*\n * This function can be used to trigger notifications from anywhere in the code.\n * even if you're running in a JS environment as opposed to a React environment.\n */\nexport function notify( notification: NotificationData ) {\n\tconst store = getStore();\n\n\tstore?.dispatch( notifyAction( notification ) );\n}\n\n/*\n * This function can be used to trigger notifications from within a React component.\n * This is the preferred way to trigger notifications.\n */\nexport function NotifyReact( notification: NotificationData ) {\n\tconst dispatch = useDispatch();\n\tdispatch( notifyAction( notification ) );\n}\n\nfunction getFilteredSnackbarProps( props: SnackbarProps ) {\n\tconst forbiddenProps = [ 'autoHideDuration', 'persist', 'hideIconVariant', 'iconVariant', 'anchorOrigin' ];\n\n\treturn Object.entries( props ).reduce(\n\t\t( filteredProps, [ key, value ] ) => {\n\t\t\tif ( ! forbiddenProps.includes( key ) ) {\n\t\t\t\tfilteredProps[ key ] = value;\n\t\t\t}\n\n\t\t\treturn filteredProps;\n\t\t},\n\t\t{} as Record< string, unknown >\n\t);\n}\n\nexport default Wrapper;\n","import { Fragment, useEffect } from 'react';\nimport * as React from 'react';\nimport { closeSnackbar, useSnackbar, type VariantType } from 'notistack';\nimport { __useDispatch as useDispatch } from '@elementor/store';\nimport { Button, CloseButton } from '@elementor/ui';\n\nimport { clearAction } from '../slice';\nimport type { Notifications } from '../types';\n\nconst AUTO_HIDE_DURATION = 8000;\n\nexport const useEnqueueNotification = ( notifications: Notifications ) => {\n\tconst { enqueueSnackbar } = useSnackbar();\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tObject.values( notifications ).forEach( ( notification ) => {\n\t\t\tconst Action = () => (\n\t\t\t\t<Fragment key={ notification.id }>\n\t\t\t\t\t{ notification.additionalActionProps?.map( ( additionalAction, index ) => (\n\t\t\t\t\t\t<Button key={ `${ index }` } { ...additionalAction } />\n\t\t\t\t\t) ) }\n\n\t\t\t\t\t<CloseButton\n\t\t\t\t\t\taria-label=\"close\"\n\t\t\t\t\t\tcolor=\"inherit\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tcloseSnackbar( notification.id );\n\t\t\t\t\t\t\tdispatch( clearAction( { id: notification.id } ) );\n\t\t\t\t\t\t} }\n\t\t\t\t\t></CloseButton>\n\t\t\t\t</Fragment>\n\t\t\t);\n\n\t\t\tenqueueSnackbar( notification.message, {\n\t\t\t\tvariant: notification.type as VariantType,\n\t\t\t\tkey: notification.id,\n\t\t\t\tonClose: () => dispatch( clearAction( { id: notification.id } ) ),\n\t\t\t\tpreventDuplicate: true,\n\t\t\t\taction: <Action />,\n\t\t\t\tautoHideDuration: notification.autoHideDuration ?? AUTO_HIDE_DURATION,\n\t\t\t} );\n\t\t} );\n\t}, [ notifications, enqueueSnackbar, dispatch ] );\n};\n","import { __createSlice as createSlice } from '@elementor/store';\n\nimport { type Notifications } from './types';\n\nexport const notificationsSlice = createSlice( {\n\tname: 'notifications',\n\tinitialState: {} as Notifications,\n\treducers: {\n\t\tnotifyAction: ( state, action ) => {\n\t\t\tconst newState = { ...state };\n\t\t\tif ( ! newState[ action.payload.id ] ) {\n\t\t\t\tnewState[ action.payload.id ] = action.payload;\n\t\t\t}\n\n\t\t\treturn newState;\n\t\t},\n\t\tclearAction: ( state, action ) => {\n\t\t\tconst newState = { ...state };\n\t\t\tif ( newState[ action.payload.id ] ) {\n\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-dynamic-delete\n\t\t\t\tdelete newState[ action.payload.id ];\n\t\t\t}\n\n\t\t\treturn newState;\n\t\t},\n\t},\n} );\n\nexport const { notifyAction, clearAction } = notificationsSlice.actions;\n","export function getEditingPanelWidth() {\n\treturn document.querySelector( '.elementor-panel' )?.clientWidth || 0;\n}\n"],"mappings":"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","names":["React","useDispatch","AUTO_HIDE_DURATION","useDispatch"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elementor/editor-notifications",
|
|
3
3
|
"description": "Notifications manager for the Elementor editor",
|
|
4
|
-
"version": "4.0.0-
|
|
4
|
+
"version": "4.0.0-manual",
|
|
5
5
|
"private": false,
|
|
6
6
|
"author": "Elementor Team",
|
|
7
7
|
"homepage": "https://elementor.com/",
|
|
@@ -40,8 +40,8 @@
|
|
|
40
40
|
"dev": "tsup --config=../../tsup.dev.ts"
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
|
-
"@elementor/editor": "4.0.0-
|
|
44
|
-
"@elementor/store": "4.0.0-
|
|
43
|
+
"@elementor/editor": "4.0.0-manual",
|
|
44
|
+
"@elementor/store": "4.0.0-manual",
|
|
45
45
|
"@elementor/ui": "1.36.17",
|
|
46
46
|
"notistack": "^3.0.2"
|
|
47
47
|
},
|
|
@@ -7,6 +7,8 @@ import { Button, CloseButton } from '@elementor/ui';
|
|
|
7
7
|
import { clearAction } from '../slice';
|
|
8
8
|
import type { Notifications } from '../types';
|
|
9
9
|
|
|
10
|
+
const AUTO_HIDE_DURATION = 8000;
|
|
11
|
+
|
|
10
12
|
export const useEnqueueNotification = ( notifications: Notifications ) => {
|
|
11
13
|
const { enqueueSnackbar } = useSnackbar();
|
|
12
14
|
const dispatch = useDispatch();
|
|
@@ -36,6 +38,7 @@ export const useEnqueueNotification = ( notifications: Notifications ) => {
|
|
|
36
38
|
onClose: () => dispatch( clearAction( { id: notification.id } ) ),
|
|
37
39
|
preventDuplicate: true,
|
|
38
40
|
action: <Action />,
|
|
41
|
+
autoHideDuration: notification.autoHideDuration ?? AUTO_HIDE_DURATION,
|
|
39
42
|
} );
|
|
40
43
|
} );
|
|
41
44
|
}, [ notifications, enqueueSnackbar, dispatch ] );
|