@elementor/editor-global-classes 0.13.0 → 0.14.1
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/CHANGELOG.md +32 -0
- package/dist/index.js +13 -15
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +18 -22
- package/dist/index.mjs.map +1 -1
- package/package.json +7 -7
- package/src/components/class-manager/class-manager-introduction.tsx +20 -23
- package/src/components/class-manager/class-manager-panel.tsx +73 -68
- package/src/components/class-manager/global-classes-list.tsx +11 -9
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,37 @@
|
|
|
1
1
|
# @elementor/editor-global-classes
|
|
2
2
|
|
|
3
|
+
## 0.14.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 666ffdd: Change theme provider styles for editing panel and class manager panel
|
|
8
|
+
- Updated dependencies [c262b65]
|
|
9
|
+
- Updated dependencies [951d633]
|
|
10
|
+
- Updated dependencies [666ffdd]
|
|
11
|
+
- Updated dependencies [311ff8e]
|
|
12
|
+
- Updated dependencies [67f2795]
|
|
13
|
+
- Updated dependencies [7aaf98f]
|
|
14
|
+
- @elementor/editor-editing-panel@1.24.0
|
|
15
|
+
- @elementor/editor-ui@0.5.1
|
|
16
|
+
- @elementor/editor@0.18.5
|
|
17
|
+
- @elementor/editor-panels@0.14.0
|
|
18
|
+
- @elementor/editor-documents@0.12.2
|
|
19
|
+
|
|
20
|
+
## 0.14.0
|
|
21
|
+
|
|
22
|
+
### Minor Changes
|
|
23
|
+
|
|
24
|
+
- 50938e4: Change controls menus text style
|
|
25
|
+
|
|
26
|
+
### Patch Changes
|
|
27
|
+
|
|
28
|
+
- Updated dependencies [c10d154]
|
|
29
|
+
- Updated dependencies [50938e4]
|
|
30
|
+
- Updated dependencies [64ec032]
|
|
31
|
+
- @elementor/editor-editing-panel@1.23.0
|
|
32
|
+
- @elementor/editor-ui@0.5.0
|
|
33
|
+
- @elementor/editor-styles-repository@0.8.1
|
|
34
|
+
|
|
3
35
|
## 0.13.0
|
|
4
36
|
|
|
5
37
|
### Minor Changes
|
package/dist/index.js
CHANGED
|
@@ -41,6 +41,7 @@ var React7 = __toESM(require("react"));
|
|
|
41
41
|
var import_react4 = require("react");
|
|
42
42
|
var import_editor_documents = require("@elementor/editor-documents");
|
|
43
43
|
var import_editor_panels = require("@elementor/editor-panels");
|
|
44
|
+
var import_editor_ui3 = require("@elementor/editor-ui");
|
|
44
45
|
var import_editor_v1_adapters = require("@elementor/editor-v1-adapters");
|
|
45
46
|
var import_icons6 = require("@elementor/icons");
|
|
46
47
|
var import_query = require("@elementor/query");
|
|
@@ -195,6 +196,10 @@ var ClassManagerIntroduction = () => {
|
|
|
195
196
|
{
|
|
196
197
|
open: shouldShowIntroduction,
|
|
197
198
|
title: (0, import_i18n.__)("CSS Class manager", "elementor"),
|
|
199
|
+
image: {
|
|
200
|
+
src: "https://assets.elementor.com/packages/v1/images/class-manager-intro.svg",
|
|
201
|
+
alt: (0, import_i18n.__)("Class manager screenshot", "elementor")
|
|
202
|
+
},
|
|
198
203
|
content: /* @__PURE__ */ React.createElement(IntroductionContent, null),
|
|
199
204
|
handleClose: (shouldShowAgain) => {
|
|
200
205
|
if (!shouldShowAgain) {
|
|
@@ -206,20 +211,13 @@ var ClassManagerIntroduction = () => {
|
|
|
206
211
|
);
|
|
207
212
|
};
|
|
208
213
|
var IntroductionContent = () => {
|
|
209
|
-
return /* @__PURE__ */ React.createElement(import_ui.
|
|
210
|
-
import_ui.Image,
|
|
211
|
-
{
|
|
212
|
-
sx: { width: "100%", height: "312px" },
|
|
213
|
-
src: "https://assets.elementor.com/packages/v1/images/class-manager-intro.svg",
|
|
214
|
-
alt: ""
|
|
215
|
-
}
|
|
216
|
-
), /* @__PURE__ */ React.createElement(import_ui.Box, null, /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
|
|
214
|
+
return /* @__PURE__ */ React.createElement(import_ui.Box, { padding: 3 }, /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
|
|
217
215
|
"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.",
|
|
218
216
|
"elementor"
|
|
219
217
|
)), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
|
|
220
218
|
"Changes apply globally\u2014any modifications will affect all elements using the class, impacting the class order and priority across your site.",
|
|
221
219
|
"elementor"
|
|
222
|
-
)))
|
|
220
|
+
)));
|
|
223
221
|
};
|
|
224
222
|
|
|
225
223
|
// src/components/class-manager/flipped-color-swatch-icon.tsx
|
|
@@ -500,7 +498,7 @@ var ClassItem = ({ id: id2, label, renameClass, selected, disabled, sortableTrig
|
|
|
500
498
|
}
|
|
501
499
|
},
|
|
502
500
|
/* @__PURE__ */ React5.createElement(
|
|
503
|
-
|
|
501
|
+
import_editor_ui2.MenuListItem,
|
|
504
502
|
{
|
|
505
503
|
sx: { minWidth: "160px" },
|
|
506
504
|
onClick: () => {
|
|
@@ -508,17 +506,17 @@ var ClassItem = ({ id: id2, label, renameClass, selected, disabled, sortableTrig
|
|
|
508
506
|
openEditMode();
|
|
509
507
|
}
|
|
510
508
|
},
|
|
511
|
-
/* @__PURE__ */ React5.createElement(import_ui4.
|
|
509
|
+
/* @__PURE__ */ React5.createElement(import_ui4.Typography, { variant: "caption", sx: { color: "text.primary" } }, (0, import_i18n4.__)("Rename", "elementor"))
|
|
512
510
|
),
|
|
513
511
|
/* @__PURE__ */ React5.createElement(
|
|
514
|
-
|
|
512
|
+
import_editor_ui2.MenuListItem,
|
|
515
513
|
{
|
|
516
514
|
onClick: () => {
|
|
517
515
|
popupState.close();
|
|
518
516
|
openDialog({ id: id2, label });
|
|
519
517
|
}
|
|
520
518
|
},
|
|
521
|
-
/* @__PURE__ */ React5.createElement(import_ui4.
|
|
519
|
+
/* @__PURE__ */ React5.createElement(import_ui4.Typography, { variant: "caption", sx: { color: "error.light" } }, (0, import_i18n4.__)("Delete", "elementor"))
|
|
522
520
|
)
|
|
523
521
|
));
|
|
524
522
|
};
|
|
@@ -641,7 +639,7 @@ function ClassManagerPanel() {
|
|
|
641
639
|
const { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();
|
|
642
640
|
const { mutateAsync: publish, isPending: isPublishing } = usePublish();
|
|
643
641
|
usePreventUnload();
|
|
644
|
-
return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(import_ui6.ErrorBoundary, { fallback: /* @__PURE__ */ React7.createElement(ErrorBoundaryFallback, null) }, /* @__PURE__ */ React7.createElement(import_editor_panels.Panel, null, /* @__PURE__ */ React7.createElement(import_editor_panels.PanelHeader, null, /* @__PURE__ */ React7.createElement(import_ui6.Stack, { p: 1, pl: 2, width: "100%", direction: "row", alignItems: "center" }, /* @__PURE__ */ React7.createElement(import_editor_panels.PanelHeaderTitle, { sx: { display: "flex", alignItems: "center", gap: 0.5 } }, /* @__PURE__ */ React7.createElement(FlippedColorSwatchIcon, { fontSize: "inherit" }), (0, import_i18n5.__)("CSS Class manager", "elementor")), /* @__PURE__ */ React7.createElement(
|
|
642
|
+
return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(import_editor_ui3.ThemeProvider, null, /* @__PURE__ */ React7.createElement(import_ui6.ErrorBoundary, { fallback: /* @__PURE__ */ React7.createElement(ErrorBoundaryFallback, null) }, /* @__PURE__ */ React7.createElement(import_editor_panels.Panel, null, /* @__PURE__ */ React7.createElement(import_editor_panels.PanelHeader, null, /* @__PURE__ */ React7.createElement(import_ui6.Stack, { p: 1, pl: 2, width: "100%", direction: "row", alignItems: "center" }, /* @__PURE__ */ React7.createElement(import_editor_panels.PanelHeaderTitle, { sx: { display: "flex", alignItems: "center", gap: 0.5 } }, /* @__PURE__ */ React7.createElement(FlippedColorSwatchIcon, { fontSize: "inherit" }), (0, import_i18n5.__)("CSS Class manager", "elementor")), /* @__PURE__ */ React7.createElement(
|
|
645
643
|
CloseButton,
|
|
646
644
|
{
|
|
647
645
|
sx: { marginLeft: "auto" },
|
|
@@ -683,7 +681,7 @@ function ClassManagerPanel() {
|
|
|
683
681
|
}
|
|
684
682
|
}
|
|
685
683
|
}
|
|
686
|
-
)));
|
|
684
|
+
))));
|
|
687
685
|
}
|
|
688
686
|
var CloseButton = ({ onClose, ...props }) => /* @__PURE__ */ React7.createElement(import_ui6.IconButton, { size: "small", color: "secondary", onClick: onClose, "aria-label": "Close", ...props }, /* @__PURE__ */ React7.createElement(import_icons6.XIcon, { fontSize: "small" }));
|
|
689
687
|
var ErrorBoundaryFallback = () => /* @__PURE__ */ React7.createElement(import_ui6.Box, { role: "alert", sx: { minHeight: "100%", p: 2 } }, /* @__PURE__ */ React7.createElement(import_ui6.Alert, { severity: "error", sx: { mb: 2, maxWidth: 400, textAlign: "center" } }, /* @__PURE__ */ React7.createElement("strong", null, (0, import_i18n5.__)("Something went wrong", "elementor"))));
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/init.ts","../src/components/class-manager/class-manager-button.tsx","../src/components/class-manager/class-manager-panel.tsx","../src/hooks/use-dirty-state.ts","../src/store.ts","../src/errors.ts","../src/save-global-classes.ts","../src/api.ts","../src/components/class-manager/class-manager-introduction.tsx","../src/components/class-manager/flipped-color-swatch-icon.tsx","../src/components/class-manager/global-classes-list.tsx","../src/global-classes-styles-provider.ts","../src/hooks/use-classes-order.ts","../src/hooks/use-ordered-classes.ts","../src/components/class-manager/delete-confirmation-dialog.tsx","../src/components/class-manager/sortable.tsx","../src/components/class-manager/save-changes-dialog.tsx","../src/components/populate-store.tsx","../src/sync-with-document-save.ts","../src/index.ts"],"sourcesContent":["import { injectIntoLogic } from '@elementor/editor';\nimport { injectIntoClassSelectorActions } from '@elementor/editor-editing-panel';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport { ClassManagerButton } from './components/class-manager/class-manager-button';\nimport { panel } from './components/class-manager/class-manager-panel';\nimport { PopulateStore } from './components/populate-store';\nimport { globalClassesStylesProvider } from './global-classes-styles-provider';\nimport { slice } from './store';\nimport { syncWithDocumentSave } from './sync-with-document-save';\n\nexport function init() {\n\tregisterSlice( slice );\n\tregisterPanel( panel );\n\n\tstylesRepository.register( globalClassesStylesProvider );\n\n\tinjectIntoLogic( {\n\t\tid: 'global-classes-populate-store',\n\t\tcomponent: PopulateStore,\n\t} );\n\n\tinjectIntoClassSelectorActions( {\n\t\tid: 'global-classes-manager-button',\n\t\tcomponent: ClassManagerButton,\n\t} );\n\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tsyncWithDocumentSave();\n\t} );\n}\n","import * as React from 'react';\nimport {\n\t__useActiveDocument as useActiveDocument,\n\t__useActiveDocumentActions as useActiveDocumentActions,\n} from '@elementor/editor-documents';\nimport { IconButton, Tooltip } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { usePanelActions } from './class-manager-panel';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { SaveChangesDialog, useDialog } from './save-changes-dialog';\n\nexport const ClassManagerButton = () => {\n\tconst document = useActiveDocument();\n\tconst { open: openPanel } = usePanelActions();\n\tconst { save: saveDocument } = useActiveDocumentActions();\n\tconst { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();\n\n\tconst handleOpenPanel = () => {\n\t\tif ( document?.isDirty ) {\n\t\t\topenSaveChangesDialog();\n\t\t\treturn;\n\t\t}\n\n\t\topenPanel();\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip title={ __( 'Class manager', 'elementor' ) } placement=\"top\">\n\t\t\t\t<IconButton onClick={ handleOpenPanel }>\n\t\t\t\t\t<FlippedColorSwatchIcon fontSize=\"tiny\" />\n\t\t\t\t</IconButton>\n\t\t\t</Tooltip>\n\t\t\t{ isSaveChangesDialogOpen && (\n\t\t\t\t<SaveChangesDialog>\n\t\t\t\t\t<SaveChangesDialog.Title>{ __( 'You have unsaved changes', 'elementor' ) }</SaveChangesDialog.Title>\n\t\t\t\t\t<SaveChangesDialog.Content>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText sx={ { mb: 2 } }>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Save your changes before moving to the class manager to ensure all updates are applied and saved.',\n\t\t\t\t\t\t\t\t'elementor'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t{ __( 'If you leave without saving, all changes will be discarded.', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t</SaveChangesDialog.Content>\n\t\t\t\t\t<SaveChangesDialog.Actions\n\t\t\t\t\t\tactions={ {\n\t\t\t\t\t\t\tcancel: {\n\t\t\t\t\t\t\t\tlabel: __( 'Keep editing', 'elementor' ),\n\t\t\t\t\t\t\t\taction: closeSaveChangesDialog,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tconfirm: {\n\t\t\t\t\t\t\t\tlabel: __( 'Save & Continue', 'elementor' ),\n\t\t\t\t\t\t\t\taction: async () => {\n\t\t\t\t\t\t\t\t\tawait saveDocument();\n\t\t\t\t\t\t\t\t\tcloseSaveChangesDialog();\n\t\t\t\t\t\t\t\t\topenPanel();\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</SaveChangesDialog>\n\t\t\t) }\n\t\t</>\n\t);\n};\n","import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport {\n\t__useActiveDocument as useActiveDocument,\n\tgetDocumentModifiedStatus,\n\tsetDocumentModifiedStatus,\n} from '@elementor/editor-documents';\nimport {\n\t__createPanel as createPanel,\n\tPanel,\n\tPanelBody,\n\tPanelFooter,\n\tPanelHeader,\n\tPanelHeaderTitle,\n} from '@elementor/editor-panels';\nimport { changeEditMode } from '@elementor/editor-v1-adapters';\nimport { XIcon } from '@elementor/icons';\nimport { useMutation } from '@elementor/query';\nimport { Alert, Box, Button, ErrorBoundary, IconButton, type IconButtonProps, Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useDirtyState } from '../../hooks/use-dirty-state';\nimport { saveGlobalClasses } from '../../save-global-classes';\nimport { ClassManagerIntroduction } from './class-manager-introduction';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { GlobalClassesList } from './global-classes-list';\nimport { SaveChangesDialog, useDialog } from './save-changes-dialog';\n\nconst id = 'global-classes-manager';\n\n// We need to disable the app-bar buttons, and the elements overlays when opening the classes manager panel.\n// The buttons and overlays are enabled only in edit mode, so we're creating a custom new edit mode that\n// will force them to be disabled. We can't use the `preview` edit mode in this case since it'll force\n// the panel to be closed.\nexport const { panel, usePanelActions } = createPanel( {\n\tid,\n\tcomponent: ClassManagerPanel,\n\tallowedEditModes: [ 'edit', id ],\n\tonOpen: () => {\n\t\tchangeEditMode( id );\n\n\t\treturn getDocumentModifiedStatus();\n\t},\n\tonClose: ( documentModifiedState ) => {\n\t\tchangeEditMode( 'edit' );\n\n\t\tif ( getDocumentModifiedStatus() !== documentModifiedState ) {\n\t\t\tsetDocumentModifiedStatus( documentModifiedState );\n\t\t}\n\t},\n} );\n\nexport function ClassManagerPanel() {\n\tconst isDirty = useDirtyState();\n\n\tconst { close: closePanel } = usePanelActions();\n\tconst { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();\n\n\tconst { mutateAsync: publish, isPending: isPublishing } = usePublish();\n\n\tusePreventUnload();\n\n\treturn (\n\t\t<>\n\t\t\t<ErrorBoundary fallback={ <ErrorBoundaryFallback /> }>\n\t\t\t\t<Panel>\n\t\t\t\t\t<PanelHeader>\n\t\t\t\t\t\t<Stack p={ 1 } pl={ 2 } width=\"100%\" direction=\"row\" alignItems=\"center\">\n\t\t\t\t\t\t\t<PanelHeaderTitle sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>\n\t\t\t\t\t\t\t\t<FlippedColorSwatchIcon fontSize=\"inherit\" />\n\t\t\t\t\t\t\t\t{ __( 'CSS Class manager', 'elementor' ) }\n\t\t\t\t\t\t\t</PanelHeaderTitle>\n\t\t\t\t\t\t\t<CloseButton\n\t\t\t\t\t\t\t\tsx={ { marginLeft: 'auto' } }\n\t\t\t\t\t\t\t\tonClose={ () => {\n\t\t\t\t\t\t\t\t\tif ( isDirty ) {\n\t\t\t\t\t\t\t\t\t\topenSaveChangesDialog();\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\tclosePanel();\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</PanelHeader>\n\t\t\t\t\t<PanelBody px={ 2 }>\n\t\t\t\t\t\t<GlobalClassesList disabled={ isPublishing } />\n\t\t\t\t\t</PanelBody>\n\t\t\t\t\t<PanelFooter>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tfullWidth\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tcolor=\"global\"\n\t\t\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\t\t\tonClick={ publish }\n\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t\tloading={ isPublishing }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Save changes', 'elementor' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</PanelFooter>\n\t\t\t\t</Panel>\n\t\t\t</ErrorBoundary>\n\t\t\t<ClassManagerIntroduction />\n\t\t\t{ isSaveChangesDialogOpen && (\n\t\t\t\t<SaveChangesDialog>\n\t\t\t\t\t<SaveChangesDialog.Title>{ __( 'You have unsaved changes', 'elementor' ) }</SaveChangesDialog.Title>\n\t\t\t\t\t<SaveChangesDialog.Content>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t{ __( 'You have unsaved changes in the Class Manager.', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t{ __( 'To avoid losing your updates, save your changes before leaving.', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t</SaveChangesDialog.Content>\n\t\t\t\t\t<SaveChangesDialog.Actions\n\t\t\t\t\t\tactions={ {\n\t\t\t\t\t\t\tcancel: {\n\t\t\t\t\t\t\t\tlabel: __( 'Cancel', 'elementor' ),\n\t\t\t\t\t\t\t\taction: closeSaveChangesDialog,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tconfirm: {\n\t\t\t\t\t\t\t\tlabel: __( 'Save & Continue', 'elementor' ),\n\t\t\t\t\t\t\t\taction: async () => {\n\t\t\t\t\t\t\t\t\tawait publish();\n\t\t\t\t\t\t\t\t\tcloseSaveChangesDialog();\n\t\t\t\t\t\t\t\t\tclosePanel();\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</SaveChangesDialog>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nconst CloseButton = ( { onClose, ...props }: IconButtonProps & { onClose: () => void } ) => (\n\t<IconButton size=\"small\" color=\"secondary\" onClick={ onClose } aria-label=\"Close\" { ...props }>\n\t\t<XIcon fontSize=\"small\" />\n\t</IconButton>\n);\n\nconst ErrorBoundaryFallback = () => (\n\t<Box role=\"alert\" sx={ { minHeight: '100%', p: 2 } }>\n\t\t<Alert severity=\"error\" sx={ { mb: 2, maxWidth: 400, textAlign: 'center' } }>\n\t\t\t<strong>{ __( 'Something went wrong', 'elementor' ) }</strong>\n\t\t</Alert>\n\t</Box>\n);\n\nconst usePreventUnload = () => {\n\tconst isDirty = useDirtyState();\n\n\tuseEffect( () => {\n\t\tconst handleBeforeUnload = ( event: BeforeUnloadEvent ) => {\n\t\t\tif ( isDirty ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t};\n\n\t\twindow.addEventListener( 'beforeunload', handleBeforeUnload );\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener( 'beforeunload', handleBeforeUnload );\n\t\t};\n\t}, [ isDirty ] );\n};\n\nconst usePublish = () => {\n\tconst document = useActiveDocument();\n\tconst [ initialDocumentStatus ] = useState( document?.isDirty ?? false );\n\n\treturn useMutation( {\n\t\tmutationFn: () => saveGlobalClasses( { context: 'frontend' } ),\n\t\tonSuccess: () => {\n\t\t\tif ( initialDocumentStatus !== document?.isDirty ) {\n\t\t\t\tsetDocumentModifiedStatus( initialDocumentStatus );\n\t\t\t}\n\t\t},\n\t} );\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectIsDirty } from '../store';\n\nexport const useDirtyState = () => {\n\treturn useSelector( selectIsDirty );\n};\n","import { mergeProps, type Props } from '@elementor/editor-props';\nimport {\n\tgetVariantByMeta,\n\ttype StyleDefinition,\n\ttype StyleDefinitionID,\n\ttype StyleDefinitionVariant,\n} from '@elementor/editor-styles';\nimport { type UpdateActionPayload } from '@elementor/editor-styles-repository';\nimport {\n\t__createSelector as createSelector,\n\t__createSlice as createSlice,\n\ttype PayloadAction,\n\ttype SliceState,\n} from '@elementor/store';\n\nimport { GlobalClassNotFoundError } from './errors';\n\nexport type GlobalClassesState = {\n\titems: Record< StyleDefinitionID, StyleDefinition >;\n\torder: StyleDefinitionID[];\n\tisDirty: boolean;\n};\n\nconst initialState: GlobalClassesState = {\n\titems: {},\n\torder: [],\n\tisDirty: false,\n};\n\nexport type StateWithGlobalClasses = SliceState< typeof slice >;\n\n// Slice\nconst SLICE_NAME = 'globalClasses';\n\nexport const slice = createSlice( {\n\tname: SLICE_NAME,\n\tinitialState,\n\treducers: {\n\t\tinit( state, { payload }: PayloadAction< Pick< GlobalClassesState, 'items' | 'order' > > ) {\n\t\t\tstate.items = payload.items;\n\t\t\tstate.order = payload.order;\n\n\t\t\tstate.isDirty = false;\n\t\t},\n\t\tadd( state, { payload }: PayloadAction< StyleDefinition > ) {\n\t\t\tstate.items[ payload.id ] = payload;\n\t\t\tstate.order.unshift( payload.id );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tdelete( state, { payload }: PayloadAction< StyleDefinitionID > ) {\n\t\t\tstate.items = Object.fromEntries( Object.entries( state.items ).filter( ( [ id ] ) => id !== payload ) );\n\n\t\t\tstate.order = state.order.filter( ( id ) => id !== payload );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tsetOrder( state, { payload }: PayloadAction< StyleDefinitionID[] > ) {\n\t\t\tstate.order = payload;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdate( state, { payload }: PayloadAction< { style: UpdateActionPayload } > ) {\n\t\t\tconst style = state.items[ payload.style.id ];\n\n\t\t\tconst mergedData = {\n\t\t\t\t...style,\n\t\t\t\t...payload.style,\n\t\t\t};\n\n\t\t\tstate.items[ payload.style.id ] = mergedData;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdateProps(\n\t\t\tstate,\n\t\t\t{\n\t\t\t\tpayload,\n\t\t\t}: PayloadAction< { id: StyleDefinitionID; meta: StyleDefinitionVariant[ 'meta' ]; props: Props } >\n\t\t) {\n\t\t\tconst style = state.items[ payload.id ];\n\n\t\t\tif ( ! style ) {\n\t\t\t\tthrow new GlobalClassNotFoundError( { context: { styleId: payload.id } } );\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( style, payload.meta );\n\n\t\t\tif ( variant ) {\n\t\t\t\tvariant.props = mergeProps( variant.props, payload.props );\n\t\t\t} else {\n\t\t\t\tstyle.variants.push( { meta: payload.meta, props: payload.props } );\n\t\t\t}\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\n\t\tsetPristine( state ) {\n\t\t\tstate.isDirty = false;\n\t\t},\n\t},\n} );\n\n// Selectors\nexport const selectOrder = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].order;\n\nexport const selectGlobalClasses = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].items;\n\nexport const selectOrderedClasses = createSelector( selectGlobalClasses, selectOrder, ( items, order ) =>\n\torder.map( ( id ) => items[ id ] )\n);\n\nexport const selectClass = ( state: SliceState< typeof slice >, id: StyleDefinitionID ) =>\n\tstate[ SLICE_NAME ].items[ id ] ?? null;\n\nexport const selectIsDirty = ( state: SliceState< typeof slice > ) => state.globalClasses.isDirty;\n","import { createError } from '@elementor/utils';\n\nexport const GlobalClassNotFoundError = createError< { styleId: string } >( {\n\tcode: 'global_class_not_found',\n\tmessage: 'Global class not found.',\n} );\n\nexport const GlobalClassLabelAlreadyExistsError = createError< { label: string } >( {\n\tcode: 'global_class_label_already_exists',\n\tmessage: 'Class with this name already exists.',\n} );\n","import { __dispatch as dispatch, __getState as getState } from '@elementor/store';\n\nimport { apiClient, type UpdateContext } from './api';\nimport { type GlobalClassesState, slice } from './store';\n\ntype Options = {\n\tcontext: UpdateContext;\n};\n\nexport async function saveGlobalClasses( { context }: Options ) {\n\tconst state: GlobalClassesState = getState().globalClasses;\n\n\tconst data = {\n\t\titems: state.items,\n\t\torder: state.order,\n\t};\n\n\tif ( context === 'preview' ) {\n\t\tawait apiClient.saveDraft( data );\n\n\t\treturn;\n\t}\n\n\tawait apiClient.publish( data );\n\n\tdispatch( slice.actions.setPristine() );\n}\n","import { type StyleDefinition, type StyleDefinitionsMap } from '@elementor/editor-styles';\nimport { type HttpResponse, httpService } from '@elementor/http';\n\nimport { type GlobalClassesState } from './store';\n\nconst RESOURCE_URL = '/global-classes';\n\nexport type GlobalClassesGetAllResponse = HttpResponse< StyleDefinitionsMap, { order: StyleDefinition[ 'id' ][] } >;\n\ntype UpdatePayload = Pick< GlobalClassesState, 'items' | 'order' >;\n\nexport type UpdateContext = 'preview' | 'frontend';\n\nexport const apiClient = {\n\tall: () =>\n\t\thttpService().get< GlobalClassesGetAllResponse >( 'elementor/v1' + RESOURCE_URL, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'preview' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n\n\tpublish: ( payload: UpdatePayload ) =>\n\t\thttpService().put( 'elementor/v1' + RESOURCE_URL, payload, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'frontend' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n\n\tsaveDraft: ( payload: UpdatePayload ) =>\n\t\thttpService().put( 'elementor/v1' + RESOURCE_URL, payload, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'preview' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n};\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { useSuppressedMessage } from '@elementor/editor-current-user';\nimport { IntroductionModal } from '@elementor/editor-ui';\nimport { Box, Image, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nconst MESSAGE_KEY = 'global-class-manager';\n\nexport const ClassManagerIntroduction = () => {\n\tconst [ isMessageSuppressed, suppressMessage ] = useSuppressedMessage( MESSAGE_KEY );\n\tconst [ shouldShowIntroduction, setShouldShowIntroduction ] = useState( ! isMessageSuppressed );\n\n\treturn (\n\t\t<IntroductionModal\n\t\t\topen={ shouldShowIntroduction }\n\t\t\ttitle={ __( 'CSS Class manager', 'elementor' ) }\n\t\t\tcontent={ <IntroductionContent /> }\n\t\t\thandleClose={ ( shouldShowAgain ) => {\n\t\t\t\tif ( ! shouldShowAgain ) {\n\t\t\t\t\tsuppressMessage();\n\t\t\t\t}\n\n\t\t\t\tsetShouldShowIntroduction( false );\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst IntroductionContent = () => {\n\treturn (\n\t\t<Stack gap={ 1.5 } padding={ 3 }>\n\t\t\t<Image\n\t\t\t\tsx={ { width: '100%', height: '312px' } }\n\t\t\t\tsrc=\"https://assets.elementor.com/packages/v1/images/class-manager-intro.svg\"\n\t\t\t\talt=\"\"\n\t\t\t/>\n\t\t\t<Box>\n\t\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t\"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.\",\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</Typography>\n\t\t\t\t<br />\n\t\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</Typography>\n\t\t\t</Box>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { ColorSwatchIcon } from '@elementor/icons';\nimport { type SvgIconProps } from '@elementor/ui';\n\nexport const FlippedColorSwatchIcon = ( { sx, ...props }: SvgIconProps ) => (\n\t<ColorSwatchIcon sx={ { transform: 'rotate(90deg)', ...sx } } { ...props } />\n);\n","import * as React from 'react';\nimport { type StyleDefinitionID } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { EditableField, EllipsisWithTooltip, useEditable } from '@elementor/editor-ui';\nimport { DotsVerticalIcon } from '@elementor/icons';\nimport {\n\tbindMenu,\n\tbindTrigger,\n\tBox,\n\tIconButton,\n\tList,\n\tListItemButton,\n\ttype ListItemButtonProps,\n\tListItemText,\n\tMenu,\n\tMenuItem,\n\tStack,\n\tstyled,\n\ttype Theme,\n\tTooltip,\n\tTypography,\n\ttype TypographyProps,\n\tusePopupState,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\nimport { useClassesOrder } from '../../hooks/use-classes-order';\nimport { useOrderedClasses } from '../../hooks/use-ordered-classes';\nimport { DeleteConfirmationProvider, useDeleteConfirmation } from './delete-confirmation-dialog';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { SortableItem, SortableProvider, SortableTrigger, type SortableTriggerProps } from './sortable';\n\nexport const GlobalClassesList = ( { disabled }: { disabled?: boolean } ) => {\n\tconst cssClasses = useOrderedClasses();\n\n\tconst [ classesOrder, reorderClasses ] = useReorder();\n\n\tif ( ! cssClasses?.length ) {\n\t\treturn <EmptyState />;\n\t}\n\n\treturn (\n\t\t<DeleteConfirmationProvider>\n\t\t\t<List sx={ { display: 'flex', flexDirection: 'column', gap: 0.5 } }>\n\t\t\t\t<SortableProvider value={ classesOrder } onChange={ reorderClasses }>\n\t\t\t\t\t{ cssClasses?.map( ( { id, label } ) => {\n\t\t\t\t\t\tconst renameClass = ( newLabel: string ) => {\n\t\t\t\t\t\t\tglobalClassesStylesProvider.actions.update( { label: newLabel, id } );\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<SortableItem key={ id } id={ id }>\n\t\t\t\t\t\t\t\t{ ( { isDragged, isDragPlaceholder, triggerProps, triggerStyle } ) => (\n\t\t\t\t\t\t\t\t\t<ClassItem\n\t\t\t\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\t\t\trenameClass={ renameClass }\n\t\t\t\t\t\t\t\t\t\tselected={ isDragged }\n\t\t\t\t\t\t\t\t\t\tdisabled={ disabled || isDragPlaceholder }\n\t\t\t\t\t\t\t\t\t\tsortableTriggerProps={ { ...triggerProps, style: triggerStyle } }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</SortableItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</SortableProvider>\n\t\t\t</List>\n\t\t</DeleteConfirmationProvider>\n\t);\n};\n\nconst useReorder = () => {\n\tconst order = useClassesOrder();\n\n\tconst reorder = ( newIds: StyleDefinitionID[] ) => {\n\t\tglobalClassesStylesProvider.actions.setOrder( newIds );\n\t};\n\n\treturn [ order, reorder ] as const;\n};\n\ntype ClassItemProps = React.PropsWithChildren< {\n\tid: string;\n\tlabel: string;\n\trenameClass: ( newLabel: string ) => void;\n\tselected?: boolean;\n\tdisabled?: boolean;\n\tsortableTriggerProps: SortableTriggerProps;\n} >;\n\nconst ClassItem = ( { id, label, renameClass, selected, disabled, sortableTriggerProps }: ClassItemProps ) => {\n\tconst {\n\t\tref: editableRef,\n\t\topenEditMode,\n\t\tisEditing,\n\t\terror,\n\t\tgetProps: getEditableProps,\n\t} = useEditable( {\n\t\tvalue: label,\n\t\tonSubmit: renameClass,\n\t\tvalidation: validateLabel,\n\t} );\n\n\tconst { openDialog } = useDeleteConfirmation();\n\n\tconst popupState = usePopupState( {\n\t\tvariant: 'popover',\n\t\tdisableAutoFocus: true,\n\t} );\n\n\tconst isSelected = ( selected || popupState.isOpen ) && ! disabled;\n\n\treturn (\n\t\t<>\n\t\t\t<StyledListItemButton\n\t\t\t\tdense\n\t\t\t\tdisableGutters\n\t\t\t\tshowActions={ isSelected || isEditing }\n\t\t\t\tshape=\"rounded\"\n\t\t\t\tonDoubleClick={ openEditMode }\n\t\t\t\tselected={ isSelected }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tfocusVisibleClassName=\"visible-class-item\"\n\t\t\t>\n\t\t\t\t<SortableTrigger { ...sortableTriggerProps } />\n\t\t\t\t<Indicator isActive={ isEditing } isError={ !! error }>\n\t\t\t\t\t{ isEditing ? (\n\t\t\t\t\t\t<EditableField\n\t\t\t\t\t\t\tref={ editableRef }\n\t\t\t\t\t\t\terror={ error }\n\t\t\t\t\t\t\tas={ Typography }\n\t\t\t\t\t\t\tvariant=\"caption\"\n\t\t\t\t\t\t\t{ ...getEditableProps() }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<EllipsisWithTooltip title={ label } as={ Typography } variant=\"caption\" />\n\t\t\t\t\t) }\n\t\t\t\t</Indicator>\n\t\t\t\t<Tooltip\n\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\tclassName={ 'class-item-more-actions' }\n\t\t\t\t\ttitle={ __( 'More actions', 'elementor' ) }\n\t\t\t\t>\n\t\t\t\t\t<IconButton size=\"tiny\" { ...bindTrigger( popupState ) } aria-label=\"More actions\">\n\t\t\t\t\t\t<DotsVerticalIcon fontSize=\"tiny\" />\n\t\t\t\t\t</IconButton>\n\t\t\t\t</Tooltip>\n\t\t\t</StyledListItemButton>\n\t\t\t<Menu\n\t\t\t\t{ ...bindMenu( popupState ) }\n\t\t\t\tanchorOrigin={ {\n\t\t\t\t\tvertical: 'bottom',\n\t\t\t\t\thorizontal: 'right',\n\t\t\t\t} }\n\t\t\t\ttransformOrigin={ {\n\t\t\t\t\tvertical: 'top',\n\t\t\t\t\thorizontal: 'right',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<MenuItem\n\t\t\t\t\tsx={ { minWidth: '160px' } }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\topenEditMode();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<ListItemText primary={ __( 'Rename', 'elementor' ) } />\n\t\t\t\t</MenuItem>\n\t\t\t\t<MenuItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\topenDialog( { id, label } );\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<ListItemText primary={ __( 'Delete', 'elementor' ) } sx={ { color: 'error.light' } } />\n\t\t\t\t</MenuItem>\n\t\t\t</Menu>\n\t\t</>\n\t);\n};\n\n// Custom styles for sortable list item, until the component is available in the UI package.\nconst StyledListItemButton = styled( ListItemButton, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'showActions' ].includes( prop ),\n} )< ListItemButtonProps & { showActions: boolean } >(\n\t( { showActions } ) => `\n\tmin-height: 36px;\n\n\t&.visible-class-item {\n\t\tbox-shadow: none !important;\n\t}\n\n\t.class-item-more-actions, .class-item-sortable-trigger {\n\t\tvisibility: ${ showActions ? 'visible' : 'hidden' };\n\t}\n\n\t.class-item-sortable-trigger {\n\t\tvisibility: ${ showActions ? 'visible' : 'hidden' };\n\t}\n\n\t&:hover&:not(:disabled) {\n\t\t.class-item-more-actions, .class-item-sortable-trigger {\n\t\t\tvisibility: visible;\n\t\t}\n\t}\n`\n);\n\nconst EmptyState = () => (\n\t<Stack alignItems=\"center\" gap={ 1.5 } pt={ 10 } px={ 0.5 } maxWidth=\"260px\" margin=\"auto\">\n\t\t<FlippedColorSwatchIcon fontSize=\"large\" />\n\t\t<StyledHeader variant=\"subtitle2\" component=\"h2\" color=\"text.secondary\">\n\t\t\t{ __( 'There are no global classes yet.', 'elementor' ) }\n\t\t</StyledHeader>\n\t\t<Typography align=\"center\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ __(\n\t\t\t\t'CSS classes created in the editor panel will appear here. Once they are available, you can arrange their hierarchy, rename them, or delete them as needed.',\n\t\t\t\t'elementor'\n\t\t\t) }\n\t\t</Typography>\n\t</Stack>\n);\n\n// Override panel reset styles.\nconst StyledHeader = styled( Typography )< TypographyProps >( ( { theme, variant } ) => ( {\n\t'&.MuiTypography-root': {\n\t\t...( theme.typography[ variant as keyof typeof theme.typography ] as React.CSSProperties ),\n\t},\n} ) );\n\nconst Indicator = styled( Box, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'isActive', 'isError' ].includes( prop ),\n} )< { isActive: boolean; isError: boolean } >( ( { theme, isActive, isError } ) => ( {\n\tdisplay: 'flex',\n\twidth: '100%',\n\tflexGrow: 1,\n\tborderRadius: theme.spacing( 0.5 ),\n\tborder: getIndicatorBorder( { isActive, isError, theme } ),\n\tpadding: `0 ${ theme.spacing( 1 ) }`,\n\tmarginLeft: isActive ? theme.spacing( 1 ) : 0,\n\tminWidth: 0,\n} ) );\n\nconst getIndicatorBorder = ( { isActive, isError, theme }: { isActive: boolean; isError: boolean; theme: Theme } ) => {\n\tif ( isError ) {\n\t\treturn `2px solid ${ theme.palette.error.main }`;\n\t}\n\n\tif ( isActive ) {\n\t\treturn `2px solid ${ theme.palette.secondary.main }`;\n\t}\n\n\treturn 'none';\n};\n\nconst validateLabel = ( newLabel: string ) => {\n\tif ( ! stylesRepository.isLabelValid( newLabel ) ) {\n\t\treturn __( 'Format is not valid', 'elementor' );\n\t}\n\n\tif ( stylesRepository.isLabelExist( newLabel ) ) {\n\t\treturn __( 'Existing name', 'elementor' );\n\t}\n\n\treturn null;\n};\n","import { generateId } from '@elementor/editor-styles';\nimport type { StylesProvider } from '@elementor/editor-styles-repository';\nimport {\n\t__dispatch as dispatch,\n\t__getState as getState,\n\t__subscribeWithSelector as subscribeWithSelector,\n} from '@elementor/store';\nimport { __ } from '@wordpress/i18n';\n\nimport { GlobalClassLabelAlreadyExistsError } from './errors';\nimport { selectClass, selectGlobalClasses, selectOrderedClasses, slice, type StateWithGlobalClasses } from './store';\n\nconst MAX_CLASSES = 50;\n\nexport const globalClassesStylesProvider = {\n\tkey: 'global-classes',\n\tpriority: 30,\n\tlimit: MAX_CLASSES,\n\tactions: {\n\t\tget: () => selectOrderedClasses( getState() ),\n\t\tgetById: ( id ) => selectClass( getState(), id ),\n\t\tcreate: ( label ) => {\n\t\t\tconst classes = selectGlobalClasses( getState() );\n\n\t\t\tconst existingLabels = Object.values( classes ).map( ( style ) => style.label );\n\n\t\t\tif ( existingLabels.includes( label ) ) {\n\t\t\t\tthrow new GlobalClassLabelAlreadyExistsError( { context: { label } } );\n\t\t\t}\n\n\t\t\tconst existingIds = Object.keys( classes );\n\t\t\tconst id = generateId( 'g-', existingIds );\n\n\t\t\tdispatch(\n\t\t\t\tslice.actions.add( {\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'class',\n\t\t\t\t\tlabel,\n\t\t\t\t\tvariants: [],\n\t\t\t\t} )\n\t\t\t);\n\n\t\t\treturn id;\n\t\t},\n\t\tupdate: ( payload ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.update( {\n\t\t\t\t\tstyle: payload,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\tdelete: ( id ) => {\n\t\t\tdispatch( slice.actions.delete( id ) );\n\t\t},\n\t\tsetOrder: ( order ) => {\n\t\t\tdispatch( slice.actions.setOrder( order ) );\n\t\t},\n\t\tupdateProps: ( args ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.updateProps( {\n\t\t\t\t\tid: args.id,\n\t\t\t\t\tmeta: args.meta,\n\t\t\t\t\tprops: args.props,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t},\n\tsubscribe: ( cb ) => subscribeWithSelector( ( state: StateWithGlobalClasses ) => state.globalClasses, cb ),\n\tlabels: {\n\t\tsingular: __( 'Global class', 'elementor' ),\n\t\tplural: __( 'Global CSS classes', 'elementor' ),\n\t},\n} satisfies StylesProvider;\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrder } from '../store';\n\nexport const useClassesOrder = () => {\n\treturn useSelector( selectOrder );\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrderedClasses } from '../store';\n\nexport const useOrderedClasses = () => {\n\treturn useSelector( selectOrderedClasses );\n};\n","import * as React from 'react';\nimport { createContext, useContext, useState } from 'react';\nimport { type StyleDefinition } from '@elementor/editor-styles';\nimport { AlertOctagonFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\tDialogTitle,\n\tTypography,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\n\ntype DeleteConfirmationDialogProps = Pick< StyleDefinition, 'id' | 'label' >;\n\ntype DeleteConfirmationContext = {\n\topenDialog: ( props: DeleteConfirmationDialogProps ) => void;\n\tcloseDialog: () => void;\n\tdialogProps: DeleteConfirmationDialogProps | null;\n};\n\nconst context = createContext< DeleteConfirmationContext | null >( null );\n\nexport const DeleteConfirmationProvider = ( { children }: React.PropsWithChildren ) => {\n\tconst [ dialogProps, setDialogProps ] = useState< DeleteConfirmationDialogProps | null >( null );\n\n\tconst openDialog = ( props: DeleteConfirmationDialogProps ) => {\n\t\tsetDialogProps( props );\n\t};\n\n\tconst closeDialog = () => {\n\t\tsetDialogProps( null );\n\t};\n\n\treturn (\n\t\t<context.Provider value={ { openDialog, closeDialog, dialogProps } }>\n\t\t\t{ children }\n\t\t\t{ !! dialogProps && <DeleteConfirmationDialog { ...dialogProps } /> }\n\t\t</context.Provider>\n\t);\n};\n\nconst TITLE_ID = 'delete-class-dialog';\n\nconst DeleteConfirmationDialog = ( { label, id }: DeleteConfirmationDialogProps ) => {\n\tconst { closeDialog } = useDeleteConfirmation();\n\n\tconst onConfirm = () => {\n\t\tglobalClassesStylesProvider.actions.delete( id );\n\n\t\tcloseDialog();\n\t};\n\n\treturn (\n\t\t<Dialog open onClose={ closeDialog } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t\t\t<AlertOctagonFilledIcon color=\"error\" />\n\t\t\t\t{ __( 'Delete global class', 'elementor' ) }\n\t\t\t</DialogTitle>\n\t\t\t<DialogContent>\n\t\t\t\t<DialogContentText variant=\"body2\" color=\"textPrimary\">\n\t\t\t\t\t{ __( 'Deleting', 'elementor' ) }\n\t\t\t\t\t<Typography variant=\"subtitle2\" component=\"span\">\n\t\t\t\t\t\t { label } \n\t\t\t\t\t</Typography>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'will permanently remove it from your project and may affect the design across all elements using it. This action cannot be undone.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</DialogContentText>\n\t\t\t</DialogContent>\n\t\t\t<DialogActions>\n\t\t\t\t<Button color=\"secondary\" onClick={ closeDialog }>\n\t\t\t\t\t{ __( 'Cancel', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t\t<Button variant=\"contained\" color=\"error\" onClick={ onConfirm }>\n\t\t\t\t\t{ __( 'Delete', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</DialogActions>\n\t\t</Dialog>\n\t);\n};\n\nexport const useDeleteConfirmation = () => {\n\tconst contextValue = useContext( context );\n\n\tif ( ! contextValue ) {\n\t\tthrow new Error( 'useDeleteConfirmation must be used within a DeleteConfirmationProvider' );\n\t}\n\n\treturn contextValue;\n};\n","import * as React from 'react';\nimport { GripVerticalIcon } from '@elementor/icons';\nimport {\n\tBox,\n\tstyled,\n\tUnstableSortableItem,\n\ttype UnstableSortableItemProps,\n\ttype UnstableSortableItemRenderProps,\n\tUnstableSortableProvider,\n\ttype UnstableSortableProviderProps,\n} from '@elementor/ui';\n\nexport const SortableProvider = < T extends string >( props: UnstableSortableProviderProps< T > ) => (\n\t<UnstableSortableProvider restrictAxis variant=\"static\" dragPlaceholderStyle={ { opacity: '1' } } { ...props } />\n);\n\nexport type SortableTriggerProps = React.HTMLAttributes< HTMLDivElement >;\n\nexport const SortableTrigger = ( props: SortableTriggerProps ) => (\n\t<StyledSortableTrigger { ...props } role=\"button\" className=\"class-item-sortable-trigger\">\n\t\t<GripVerticalIcon fontSize=\"tiny\" />\n\t</StyledSortableTrigger>\n);\n\ntype SortableItemProps = {\n\tid: UnstableSortableItemProps[ 'id' ];\n\tchildren: ( props: Partial< UnstableSortableItemRenderProps > ) => React.ReactNode;\n};\n\nexport const SortableItem = ( { children, id, ...props }: SortableItemProps ) => {\n\treturn (\n\t\t<UnstableSortableItem\n\t\t\t{ ...props }\n\t\t\tid={ id }\n\t\t\trender={ ( {\n\t\t\t\titemProps,\n\t\t\t\tisDragged,\n\t\t\t\ttriggerProps,\n\t\t\t\titemStyle,\n\t\t\t\ttriggerStyle,\n\t\t\t\tdropIndicationStyle,\n\t\t\t\tshowDropIndication,\n\t\t\t\tisDragOverlay,\n\t\t\t\tisDragPlaceholder,\n\t\t\t}: UnstableSortableItemRenderProps ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Box\n\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\tstyle={ itemStyle }\n\t\t\t\t\t\tcomponent={ 'li' }\n\t\t\t\t\t\trole=\"listitem\"\n\t\t\t\t\t\tsx={ {\n\t\t\t\t\t\t\tbackgroundColor: isDragOverlay ? 'background.paper' : undefined,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children( {\n\t\t\t\t\t\t\titemProps,\n\t\t\t\t\t\t\tisDragged,\n\t\t\t\t\t\t\ttriggerProps,\n\t\t\t\t\t\t\titemStyle,\n\t\t\t\t\t\t\ttriggerStyle,\n\t\t\t\t\t\t\tisDragPlaceholder,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t{ showDropIndication && <SortableItemIndicator style={ dropIndicationStyle } /> }\n\t\t\t\t\t</Box>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst StyledSortableTrigger = styled( 'div' )( ( { theme } ) => ( {\n\tposition: 'absolute',\n\tleft: 0,\n\ttop: '50%',\n\ttransform: `translate( -${ theme.spacing( 1.5 ) }, -50% )`,\n\tcolor: theme.palette.action.active,\n} ) );\n\nconst SortableItemIndicator = styled( Box )`\n\twidth: 100%;\n\theight: 1px;\n\tbackground-color: ${ ( { theme } ) => theme.palette.text.primary };\n`;\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { AlertTriangleFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\ttype DialogContentTextProps,\n\ttype DialogProps,\n\tDialogTitle,\n} from '@elementor/ui';\n\nconst TITLE_ID = 'save-changes-dialog';\n\nconst SaveChangesDialog = ( { children, onClose }: Pick< DialogProps, 'children' | 'onClose' > ) => (\n\t<Dialog open onClose={ onClose } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t{ children }\n\t</Dialog>\n);\n\nconst SaveChangesDialogTitle = ( { children }: React.PropsWithChildren ) => (\n\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t<AlertTriangleFilledIcon color=\"secondary\" />\n\t\t{ children }\n\t</DialogTitle>\n);\n\nconst SaveChangesDialogContent = ( { children }: React.PropsWithChildren ) => (\n\t<DialogContent>{ children }</DialogContent>\n);\n\nconst SaveChangesDialogContentText = ( props: DialogContentTextProps ) => (\n\t<DialogContentText variant=\"body2\" color=\"textPrimary\" display=\"flex\" flexDirection=\"column\" { ...props } />\n);\n\ntype Action = {\n\tlabel: string;\n\taction: () => void | Promise< void >;\n};\n\ntype ConfirmationDialogActionsProps = {\n\tactions: {\n\t\tcancel: Action;\n\t\tconfirm: Action;\n\t};\n};\nconst SaveChangesDialogActions = ( { actions }: ConfirmationDialogActionsProps ) => {\n\tconst [ isConfirming, setIsConfirming ] = useState( false );\n\tconst { cancel, confirm } = actions;\n\n\tconst onConfirm = async () => {\n\t\tsetIsConfirming( true );\n\t\tawait confirm.action();\n\t\tsetIsConfirming( false );\n\t};\n\treturn (\n\t\t<DialogActions>\n\t\t\t<Button variant=\"text\" color=\"secondary\" onClick={ cancel.action }>\n\t\t\t\t{ cancel.label }\n\t\t\t</Button>\n\t\t\t<Button variant=\"contained\" color=\"secondary\" onClick={ onConfirm } loading={ isConfirming }>\n\t\t\t\t{ confirm.label }\n\t\t\t</Button>\n\t\t</DialogActions>\n\t);\n};\n\nSaveChangesDialog.Title = SaveChangesDialogTitle;\nSaveChangesDialog.Content = SaveChangesDialogContent;\nSaveChangesDialog.ContentText = SaveChangesDialogContentText;\nSaveChangesDialog.Actions = SaveChangesDialogActions;\n\nconst useDialog = () => {\n\tconst [ isOpen, setIsOpen ] = useState( false );\n\n\tconst open = () => setIsOpen( true );\n\tconst close = () => setIsOpen( false );\n\n\treturn { isOpen, open, close };\n};\n\nexport { SaveChangesDialog, useDialog };\n","import { useEffect } from 'react';\nimport { __useDispatch as useDispatch } from '@elementor/store';\n\nimport { apiClient } from '../api';\nimport { slice } from '../store';\n\nexport function PopulateStore() {\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tapiClient.all().then( ( res ) => {\n\t\t\tconst { data, meta } = res.data;\n\n\t\t\tdispatch( slice.actions.init( { items: data, order: meta.order } ) );\n\t\t} );\n\t}, [ dispatch ] );\n\n\treturn null;\n}\n","import { setDocumentModifiedStatus } from '@elementor/editor-documents';\nimport { registerDataHook } from '@elementor/editor-v1-adapters';\nimport { __getState as getState, __subscribeWithSelector as subscribeWithSelector } from '@elementor/store';\n\nimport { saveGlobalClasses } from './save-global-classes';\nimport { selectIsDirty } from './store';\n\nexport function syncWithDocumentSave() {\n\tconst unsubscribe = syncDirtyState();\n\n\tbindSaveAction();\n\n\treturn unsubscribe;\n}\n\nfunction syncDirtyState() {\n\treturn subscribeWithSelector( selectIsDirty, () => {\n\t\tif ( ! isDirty() ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetDocumentModifiedStatus( true );\n\t} );\n}\n\nfunction bindSaveAction() {\n\tregisterDataHook( 'after', 'document/save/save', ( args ) => {\n\t\treturn saveGlobalClasses( {\n\t\t\tcontext: args.status === 'publish' ? 'frontend' : 'preview',\n\t\t} );\n\t} );\n}\n\nfunction isDirty() {\n\treturn selectIsDirty( getState() );\n}\n","import { init } from './init';\n\ninit();\n"],"mappings":"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","names":["import_editor_panels","import_editor_styles_repository","import_editor_v1_adapters","import_store","React","import_editor_documents","import_ui","import_i18n","React","import_react","import_icons","import_ui","import_i18n","import_store","createSlice","id","createSelector","useSelector","import_store","context","getState","dispatch","React","React","import_editor_ui","import_icons","import_ui","import_i18n","import_editor_styles","import_store","import_i18n","getState","id","dispatch","subscribeWithSelector","import_store","useSelector","import_store","useSelector","React","import_react","import_icons","import_ui","import_i18n","id","React","import_icons","import_ui","id","id","React","import_react","import_icons","import_ui","TITLE_ID","createPanel","isDirty","useActiveDocument","useActiveDocument","useActiveDocumentActions","import_react","import_store","dispatch","useDispatch","import_editor_documents","import_editor_v1_adapters","import_store","subscribeWithSelector","getState","registerSlice","registerPanel","listenTo"]}
|
|
1
|
+
{"version":3,"sources":["../src/init.ts","../src/components/class-manager/class-manager-button.tsx","../src/components/class-manager/class-manager-panel.tsx","../src/hooks/use-dirty-state.ts","../src/store.ts","../src/errors.ts","../src/save-global-classes.ts","../src/api.ts","../src/components/class-manager/class-manager-introduction.tsx","../src/components/class-manager/flipped-color-swatch-icon.tsx","../src/components/class-manager/global-classes-list.tsx","../src/global-classes-styles-provider.ts","../src/hooks/use-classes-order.ts","../src/hooks/use-ordered-classes.ts","../src/components/class-manager/delete-confirmation-dialog.tsx","../src/components/class-manager/sortable.tsx","../src/components/class-manager/save-changes-dialog.tsx","../src/components/populate-store.tsx","../src/sync-with-document-save.ts","../src/index.ts"],"sourcesContent":["import { injectIntoLogic } from '@elementor/editor';\nimport { injectIntoClassSelectorActions } from '@elementor/editor-editing-panel';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport { ClassManagerButton } from './components/class-manager/class-manager-button';\nimport { panel } from './components/class-manager/class-manager-panel';\nimport { PopulateStore } from './components/populate-store';\nimport { globalClassesStylesProvider } from './global-classes-styles-provider';\nimport { slice } from './store';\nimport { syncWithDocumentSave } from './sync-with-document-save';\n\nexport function init() {\n\tregisterSlice( slice );\n\tregisterPanel( panel );\n\n\tstylesRepository.register( globalClassesStylesProvider );\n\n\tinjectIntoLogic( {\n\t\tid: 'global-classes-populate-store',\n\t\tcomponent: PopulateStore,\n\t} );\n\n\tinjectIntoClassSelectorActions( {\n\t\tid: 'global-classes-manager-button',\n\t\tcomponent: ClassManagerButton,\n\t} );\n\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tsyncWithDocumentSave();\n\t} );\n}\n","import * as React from 'react';\nimport {\n\t__useActiveDocument as useActiveDocument,\n\t__useActiveDocumentActions as useActiveDocumentActions,\n} from '@elementor/editor-documents';\nimport { IconButton, Tooltip } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { usePanelActions } from './class-manager-panel';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { SaveChangesDialog, useDialog } from './save-changes-dialog';\n\nexport const ClassManagerButton = () => {\n\tconst document = useActiveDocument();\n\tconst { open: openPanel } = usePanelActions();\n\tconst { save: saveDocument } = useActiveDocumentActions();\n\tconst { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();\n\n\tconst handleOpenPanel = () => {\n\t\tif ( document?.isDirty ) {\n\t\t\topenSaveChangesDialog();\n\t\t\treturn;\n\t\t}\n\n\t\topenPanel();\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip title={ __( 'Class manager', 'elementor' ) } placement=\"top\">\n\t\t\t\t<IconButton onClick={ handleOpenPanel }>\n\t\t\t\t\t<FlippedColorSwatchIcon fontSize=\"tiny\" />\n\t\t\t\t</IconButton>\n\t\t\t</Tooltip>\n\t\t\t{ isSaveChangesDialogOpen && (\n\t\t\t\t<SaveChangesDialog>\n\t\t\t\t\t<SaveChangesDialog.Title>{ __( 'You have unsaved changes', 'elementor' ) }</SaveChangesDialog.Title>\n\t\t\t\t\t<SaveChangesDialog.Content>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText sx={ { mb: 2 } }>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Save your changes before moving to the class manager to ensure all updates are applied and saved.',\n\t\t\t\t\t\t\t\t'elementor'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t{ __( 'If you leave without saving, all changes will be discarded.', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t</SaveChangesDialog.Content>\n\t\t\t\t\t<SaveChangesDialog.Actions\n\t\t\t\t\t\tactions={ {\n\t\t\t\t\t\t\tcancel: {\n\t\t\t\t\t\t\t\tlabel: __( 'Keep editing', 'elementor' ),\n\t\t\t\t\t\t\t\taction: closeSaveChangesDialog,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tconfirm: {\n\t\t\t\t\t\t\t\tlabel: __( 'Save & Continue', 'elementor' ),\n\t\t\t\t\t\t\t\taction: async () => {\n\t\t\t\t\t\t\t\t\tawait saveDocument();\n\t\t\t\t\t\t\t\t\tcloseSaveChangesDialog();\n\t\t\t\t\t\t\t\t\topenPanel();\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</SaveChangesDialog>\n\t\t\t) }\n\t\t</>\n\t);\n};\n","import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport {\n\t__useActiveDocument as useActiveDocument,\n\tgetDocumentModifiedStatus,\n\tsetDocumentModifiedStatus,\n} from '@elementor/editor-documents';\nimport {\n\t__createPanel as createPanel,\n\tPanel,\n\tPanelBody,\n\tPanelFooter,\n\tPanelHeader,\n\tPanelHeaderTitle,\n} from '@elementor/editor-panels';\nimport { ThemeProvider } from '@elementor/editor-ui';\nimport { changeEditMode } from '@elementor/editor-v1-adapters';\nimport { XIcon } from '@elementor/icons';\nimport { useMutation } from '@elementor/query';\nimport { Alert, Box, Button, ErrorBoundary, IconButton, type IconButtonProps, Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useDirtyState } from '../../hooks/use-dirty-state';\nimport { saveGlobalClasses } from '../../save-global-classes';\nimport { ClassManagerIntroduction } from './class-manager-introduction';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { GlobalClassesList } from './global-classes-list';\nimport { SaveChangesDialog, useDialog } from './save-changes-dialog';\n\nconst id = 'global-classes-manager';\n\n// We need to disable the app-bar buttons, and the elements overlays when opening the classes manager panel.\n// The buttons and overlays are enabled only in edit mode, so we're creating a custom new edit mode that\n// will force them to be disabled. We can't use the `preview` edit mode in this case since it'll force\n// the panel to be closed.\nexport const { panel, usePanelActions } = createPanel( {\n\tid,\n\tcomponent: ClassManagerPanel,\n\tallowedEditModes: [ 'edit', id ],\n\tonOpen: () => {\n\t\tchangeEditMode( id );\n\n\t\treturn getDocumentModifiedStatus();\n\t},\n\tonClose: ( documentModifiedState ) => {\n\t\tchangeEditMode( 'edit' );\n\n\t\tif ( getDocumentModifiedStatus() !== documentModifiedState ) {\n\t\t\tsetDocumentModifiedStatus( documentModifiedState );\n\t\t}\n\t},\n} );\n\nexport function ClassManagerPanel() {\n\tconst isDirty = useDirtyState();\n\n\tconst { close: closePanel } = usePanelActions();\n\tconst { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();\n\n\tconst { mutateAsync: publish, isPending: isPublishing } = usePublish();\n\n\tusePreventUnload();\n\n\treturn (\n\t\t<>\n\t\t\t<ThemeProvider>\n\t\t\t\t<ErrorBoundary fallback={ <ErrorBoundaryFallback /> }>\n\t\t\t\t\t<Panel>\n\t\t\t\t\t\t<PanelHeader>\n\t\t\t\t\t\t\t<Stack p={ 1 } pl={ 2 } width=\"100%\" direction=\"row\" alignItems=\"center\">\n\t\t\t\t\t\t\t\t<PanelHeaderTitle sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>\n\t\t\t\t\t\t\t\t\t<FlippedColorSwatchIcon fontSize=\"inherit\" />\n\t\t\t\t\t\t\t\t\t{ __( 'CSS Class manager', 'elementor' ) }\n\t\t\t\t\t\t\t\t</PanelHeaderTitle>\n\t\t\t\t\t\t\t\t<CloseButton\n\t\t\t\t\t\t\t\t\tsx={ { marginLeft: 'auto' } }\n\t\t\t\t\t\t\t\t\tonClose={ () => {\n\t\t\t\t\t\t\t\t\t\tif ( isDirty ) {\n\t\t\t\t\t\t\t\t\t\t\topenSaveChangesDialog();\n\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\tclosePanel();\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t</PanelHeader>\n\t\t\t\t\t\t<PanelBody px={ 2 }>\n\t\t\t\t\t\t\t<GlobalClassesList disabled={ isPublishing } />\n\t\t\t\t\t\t</PanelBody>\n\t\t\t\t\t\t<PanelFooter>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tfullWidth\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tcolor=\"global\"\n\t\t\t\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\t\t\t\tonClick={ publish }\n\t\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t\t\tloading={ isPublishing }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Save changes', 'elementor' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</PanelFooter>\n\t\t\t\t\t</Panel>\n\t\t\t\t</ErrorBoundary>\n\t\t\t\t<ClassManagerIntroduction />\n\t\t\t\t{ isSaveChangesDialogOpen && (\n\t\t\t\t\t<SaveChangesDialog>\n\t\t\t\t\t\t<SaveChangesDialog.Title>\n\t\t\t\t\t\t\t{ __( 'You have unsaved changes', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.Title>\n\t\t\t\t\t\t<SaveChangesDialog.Content>\n\t\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t\t{ __( 'You have unsaved changes in the Class Manager.', 'elementor' ) }\n\t\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t\t{ __( 'To avoid losing your updates, save your changes before leaving.', 'elementor' ) }\n\t\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t</SaveChangesDialog.Content>\n\t\t\t\t\t\t<SaveChangesDialog.Actions\n\t\t\t\t\t\t\tactions={ {\n\t\t\t\t\t\t\t\tcancel: {\n\t\t\t\t\t\t\t\t\tlabel: __( 'Cancel', 'elementor' ),\n\t\t\t\t\t\t\t\t\taction: closeSaveChangesDialog,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\tconfirm: {\n\t\t\t\t\t\t\t\t\tlabel: __( 'Save & Continue', 'elementor' ),\n\t\t\t\t\t\t\t\t\taction: async () => {\n\t\t\t\t\t\t\t\t\t\tawait publish();\n\t\t\t\t\t\t\t\t\t\tcloseSaveChangesDialog();\n\t\t\t\t\t\t\t\t\t\tclosePanel();\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</SaveChangesDialog>\n\t\t\t\t) }\n\t\t\t</ThemeProvider>\n\t\t</>\n\t);\n}\n\nconst CloseButton = ( { onClose, ...props }: IconButtonProps & { onClose: () => void } ) => (\n\t<IconButton size=\"small\" color=\"secondary\" onClick={ onClose } aria-label=\"Close\" { ...props }>\n\t\t<XIcon fontSize=\"small\" />\n\t</IconButton>\n);\n\nconst ErrorBoundaryFallback = () => (\n\t<Box role=\"alert\" sx={ { minHeight: '100%', p: 2 } }>\n\t\t<Alert severity=\"error\" sx={ { mb: 2, maxWidth: 400, textAlign: 'center' } }>\n\t\t\t<strong>{ __( 'Something went wrong', 'elementor' ) }</strong>\n\t\t</Alert>\n\t</Box>\n);\n\nconst usePreventUnload = () => {\n\tconst isDirty = useDirtyState();\n\n\tuseEffect( () => {\n\t\tconst handleBeforeUnload = ( event: BeforeUnloadEvent ) => {\n\t\t\tif ( isDirty ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t};\n\n\t\twindow.addEventListener( 'beforeunload', handleBeforeUnload );\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener( 'beforeunload', handleBeforeUnload );\n\t\t};\n\t}, [ isDirty ] );\n};\n\nconst usePublish = () => {\n\tconst document = useActiveDocument();\n\tconst [ initialDocumentStatus ] = useState( document?.isDirty ?? false );\n\n\treturn useMutation( {\n\t\tmutationFn: () => saveGlobalClasses( { context: 'frontend' } ),\n\t\tonSuccess: () => {\n\t\t\tif ( initialDocumentStatus !== document?.isDirty ) {\n\t\t\t\tsetDocumentModifiedStatus( initialDocumentStatus );\n\t\t\t}\n\t\t},\n\t} );\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectIsDirty } from '../store';\n\nexport const useDirtyState = () => {\n\treturn useSelector( selectIsDirty );\n};\n","import { mergeProps, type Props } from '@elementor/editor-props';\nimport {\n\tgetVariantByMeta,\n\ttype StyleDefinition,\n\ttype StyleDefinitionID,\n\ttype StyleDefinitionVariant,\n} from '@elementor/editor-styles';\nimport { type UpdateActionPayload } from '@elementor/editor-styles-repository';\nimport {\n\t__createSelector as createSelector,\n\t__createSlice as createSlice,\n\ttype PayloadAction,\n\ttype SliceState,\n} from '@elementor/store';\n\nimport { GlobalClassNotFoundError } from './errors';\n\nexport type GlobalClassesState = {\n\titems: Record< StyleDefinitionID, StyleDefinition >;\n\torder: StyleDefinitionID[];\n\tisDirty: boolean;\n};\n\nconst initialState: GlobalClassesState = {\n\titems: {},\n\torder: [],\n\tisDirty: false,\n};\n\nexport type StateWithGlobalClasses = SliceState< typeof slice >;\n\n// Slice\nconst SLICE_NAME = 'globalClasses';\n\nexport const slice = createSlice( {\n\tname: SLICE_NAME,\n\tinitialState,\n\treducers: {\n\t\tinit( state, { payload }: PayloadAction< Pick< GlobalClassesState, 'items' | 'order' > > ) {\n\t\t\tstate.items = payload.items;\n\t\t\tstate.order = payload.order;\n\n\t\t\tstate.isDirty = false;\n\t\t},\n\t\tadd( state, { payload }: PayloadAction< StyleDefinition > ) {\n\t\t\tstate.items[ payload.id ] = payload;\n\t\t\tstate.order.unshift( payload.id );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tdelete( state, { payload }: PayloadAction< StyleDefinitionID > ) {\n\t\t\tstate.items = Object.fromEntries( Object.entries( state.items ).filter( ( [ id ] ) => id !== payload ) );\n\n\t\t\tstate.order = state.order.filter( ( id ) => id !== payload );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tsetOrder( state, { payload }: PayloadAction< StyleDefinitionID[] > ) {\n\t\t\tstate.order = payload;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdate( state, { payload }: PayloadAction< { style: UpdateActionPayload } > ) {\n\t\t\tconst style = state.items[ payload.style.id ];\n\n\t\t\tconst mergedData = {\n\t\t\t\t...style,\n\t\t\t\t...payload.style,\n\t\t\t};\n\n\t\t\tstate.items[ payload.style.id ] = mergedData;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdateProps(\n\t\t\tstate,\n\t\t\t{\n\t\t\t\tpayload,\n\t\t\t}: PayloadAction< { id: StyleDefinitionID; meta: StyleDefinitionVariant[ 'meta' ]; props: Props } >\n\t\t) {\n\t\t\tconst style = state.items[ payload.id ];\n\n\t\t\tif ( ! style ) {\n\t\t\t\tthrow new GlobalClassNotFoundError( { context: { styleId: payload.id } } );\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( style, payload.meta );\n\n\t\t\tif ( variant ) {\n\t\t\t\tvariant.props = mergeProps( variant.props, payload.props );\n\t\t\t} else {\n\t\t\t\tstyle.variants.push( { meta: payload.meta, props: payload.props } );\n\t\t\t}\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\n\t\tsetPristine( state ) {\n\t\t\tstate.isDirty = false;\n\t\t},\n\t},\n} );\n\n// Selectors\nexport const selectOrder = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].order;\n\nexport const selectGlobalClasses = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].items;\n\nexport const selectOrderedClasses = createSelector( selectGlobalClasses, selectOrder, ( items, order ) =>\n\torder.map( ( id ) => items[ id ] )\n);\n\nexport const selectClass = ( state: SliceState< typeof slice >, id: StyleDefinitionID ) =>\n\tstate[ SLICE_NAME ].items[ id ] ?? null;\n\nexport const selectIsDirty = ( state: SliceState< typeof slice > ) => state.globalClasses.isDirty;\n","import { createError } from '@elementor/utils';\n\nexport const GlobalClassNotFoundError = createError< { styleId: string } >( {\n\tcode: 'global_class_not_found',\n\tmessage: 'Global class not found.',\n} );\n\nexport const GlobalClassLabelAlreadyExistsError = createError< { label: string } >( {\n\tcode: 'global_class_label_already_exists',\n\tmessage: 'Class with this name already exists.',\n} );\n","import { __dispatch as dispatch, __getState as getState } from '@elementor/store';\n\nimport { apiClient, type UpdateContext } from './api';\nimport { type GlobalClassesState, slice } from './store';\n\ntype Options = {\n\tcontext: UpdateContext;\n};\n\nexport async function saveGlobalClasses( { context }: Options ) {\n\tconst state: GlobalClassesState = getState().globalClasses;\n\n\tconst data = {\n\t\titems: state.items,\n\t\torder: state.order,\n\t};\n\n\tif ( context === 'preview' ) {\n\t\tawait apiClient.saveDraft( data );\n\n\t\treturn;\n\t}\n\n\tawait apiClient.publish( data );\n\n\tdispatch( slice.actions.setPristine() );\n}\n","import { type StyleDefinition, type StyleDefinitionsMap } from '@elementor/editor-styles';\nimport { type HttpResponse, httpService } from '@elementor/http';\n\nimport { type GlobalClassesState } from './store';\n\nconst RESOURCE_URL = '/global-classes';\n\nexport type GlobalClassesGetAllResponse = HttpResponse< StyleDefinitionsMap, { order: StyleDefinition[ 'id' ][] } >;\n\ntype UpdatePayload = Pick< GlobalClassesState, 'items' | 'order' >;\n\nexport type UpdateContext = 'preview' | 'frontend';\n\nexport const apiClient = {\n\tall: () =>\n\t\thttpService().get< GlobalClassesGetAllResponse >( 'elementor/v1' + RESOURCE_URL, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'preview' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n\n\tpublish: ( payload: UpdatePayload ) =>\n\t\thttpService().put( 'elementor/v1' + RESOURCE_URL, payload, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'frontend' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n\n\tsaveDraft: ( payload: UpdatePayload ) =>\n\t\thttpService().put( 'elementor/v1' + RESOURCE_URL, payload, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'preview' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n};\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { useSuppressedMessage } from '@elementor/editor-current-user';\nimport { IntroductionModal } from '@elementor/editor-ui';\nimport { Box, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nconst MESSAGE_KEY = 'global-class-manager';\n\nexport const ClassManagerIntroduction = () => {\n\tconst [ isMessageSuppressed, suppressMessage ] = useSuppressedMessage( MESSAGE_KEY );\n\tconst [ shouldShowIntroduction, setShouldShowIntroduction ] = useState( ! isMessageSuppressed );\n\n\treturn (\n\t\t<IntroductionModal\n\t\t\topen={ shouldShowIntroduction }\n\t\t\ttitle={ __( 'CSS Class manager', 'elementor' ) }\n\t\t\timage={ {\n\t\t\t\tsrc: 'https://assets.elementor.com/packages/v1/images/class-manager-intro.svg',\n\t\t\t\talt: __( 'Class manager screenshot', 'elementor' ),\n\t\t\t} }\n\t\t\tcontent={ <IntroductionContent /> }\n\t\t\thandleClose={ ( shouldShowAgain ) => {\n\t\t\t\tif ( ! shouldShowAgain ) {\n\t\t\t\t\tsuppressMessage();\n\t\t\t\t}\n\n\t\t\t\tsetShouldShowIntroduction( false );\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst IntroductionContent = () => {\n\treturn (\n\t\t<Box padding={ 3 }>\n\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t{ __(\n\t\t\t\t\t\"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.\",\n\t\t\t\t\t'elementor'\n\t\t\t\t) }\n\t\t\t</Typography>\n\t\t\t<br />\n\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t{ __(\n\t\t\t\t\t'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',\n\t\t\t\t\t'elementor'\n\t\t\t\t) }\n\t\t\t</Typography>\n\t\t</Box>\n\t);\n};\n","import * as React from 'react';\nimport { ColorSwatchIcon } from '@elementor/icons';\nimport { type SvgIconProps } from '@elementor/ui';\n\nexport const FlippedColorSwatchIcon = ( { sx, ...props }: SvgIconProps ) => (\n\t<ColorSwatchIcon sx={ { transform: 'rotate(90deg)', ...sx } } { ...props } />\n);\n","import * as React from 'react';\nimport { type StyleDefinitionID } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { EditableField, EllipsisWithTooltip, MenuListItem, useEditable } from '@elementor/editor-ui';\nimport { DotsVerticalIcon } from '@elementor/icons';\nimport {\n\tbindMenu,\n\tbindTrigger,\n\tBox,\n\tIconButton,\n\tList,\n\tListItemButton,\n\ttype ListItemButtonProps,\n\tMenu,\n\tStack,\n\tstyled,\n\ttype Theme,\n\tTooltip,\n\tTypography,\n\ttype TypographyProps,\n\tusePopupState,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\nimport { useClassesOrder } from '../../hooks/use-classes-order';\nimport { useOrderedClasses } from '../../hooks/use-ordered-classes';\nimport { DeleteConfirmationProvider, useDeleteConfirmation } from './delete-confirmation-dialog';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { SortableItem, SortableProvider, SortableTrigger, type SortableTriggerProps } from './sortable';\n\nexport const GlobalClassesList = ( { disabled }: { disabled?: boolean } ) => {\n\tconst cssClasses = useOrderedClasses();\n\n\tconst [ classesOrder, reorderClasses ] = useReorder();\n\n\tif ( ! cssClasses?.length ) {\n\t\treturn <EmptyState />;\n\t}\n\n\treturn (\n\t\t<DeleteConfirmationProvider>\n\t\t\t<List sx={ { display: 'flex', flexDirection: 'column', gap: 0.5 } }>\n\t\t\t\t<SortableProvider value={ classesOrder } onChange={ reorderClasses }>\n\t\t\t\t\t{ cssClasses?.map( ( { id, label } ) => {\n\t\t\t\t\t\tconst renameClass = ( newLabel: string ) => {\n\t\t\t\t\t\t\tglobalClassesStylesProvider.actions.update( { label: newLabel, id } );\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<SortableItem key={ id } id={ id }>\n\t\t\t\t\t\t\t\t{ ( { isDragged, isDragPlaceholder, triggerProps, triggerStyle } ) => (\n\t\t\t\t\t\t\t\t\t<ClassItem\n\t\t\t\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\t\t\trenameClass={ renameClass }\n\t\t\t\t\t\t\t\t\t\tselected={ isDragged }\n\t\t\t\t\t\t\t\t\t\tdisabled={ disabled || isDragPlaceholder }\n\t\t\t\t\t\t\t\t\t\tsortableTriggerProps={ { ...triggerProps, style: triggerStyle } }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</SortableItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</SortableProvider>\n\t\t\t</List>\n\t\t</DeleteConfirmationProvider>\n\t);\n};\n\nconst useReorder = () => {\n\tconst order = useClassesOrder();\n\n\tconst reorder = ( newIds: StyleDefinitionID[] ) => {\n\t\tglobalClassesStylesProvider.actions.setOrder( newIds );\n\t};\n\n\treturn [ order, reorder ] as const;\n};\n\ntype ClassItemProps = React.PropsWithChildren< {\n\tid: string;\n\tlabel: string;\n\trenameClass: ( newLabel: string ) => void;\n\tselected?: boolean;\n\tdisabled?: boolean;\n\tsortableTriggerProps: SortableTriggerProps;\n} >;\n\nconst ClassItem = ( { id, label, renameClass, selected, disabled, sortableTriggerProps }: ClassItemProps ) => {\n\tconst {\n\t\tref: editableRef,\n\t\topenEditMode,\n\t\tisEditing,\n\t\terror,\n\t\tgetProps: getEditableProps,\n\t} = useEditable( {\n\t\tvalue: label,\n\t\tonSubmit: renameClass,\n\t\tvalidation: validateLabel,\n\t} );\n\n\tconst { openDialog } = useDeleteConfirmation();\n\n\tconst popupState = usePopupState( {\n\t\tvariant: 'popover',\n\t\tdisableAutoFocus: true,\n\t} );\n\n\tconst isSelected = ( selected || popupState.isOpen ) && ! disabled;\n\n\treturn (\n\t\t<>\n\t\t\t<StyledListItemButton\n\t\t\t\tdense\n\t\t\t\tdisableGutters\n\t\t\t\tshowActions={ isSelected || isEditing }\n\t\t\t\tshape=\"rounded\"\n\t\t\t\tonDoubleClick={ openEditMode }\n\t\t\t\tselected={ isSelected }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tfocusVisibleClassName=\"visible-class-item\"\n\t\t\t>\n\t\t\t\t<SortableTrigger { ...sortableTriggerProps } />\n\t\t\t\t<Indicator isActive={ isEditing } isError={ !! error }>\n\t\t\t\t\t{ isEditing ? (\n\t\t\t\t\t\t<EditableField\n\t\t\t\t\t\t\tref={ editableRef }\n\t\t\t\t\t\t\terror={ error }\n\t\t\t\t\t\t\tas={ Typography }\n\t\t\t\t\t\t\tvariant=\"caption\"\n\t\t\t\t\t\t\t{ ...getEditableProps() }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<EllipsisWithTooltip title={ label } as={ Typography } variant=\"caption\" />\n\t\t\t\t\t) }\n\t\t\t\t</Indicator>\n\t\t\t\t<Tooltip\n\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\tclassName={ 'class-item-more-actions' }\n\t\t\t\t\ttitle={ __( 'More actions', 'elementor' ) }\n\t\t\t\t>\n\t\t\t\t\t<IconButton size=\"tiny\" { ...bindTrigger( popupState ) } aria-label=\"More actions\">\n\t\t\t\t\t\t<DotsVerticalIcon fontSize=\"tiny\" />\n\t\t\t\t\t</IconButton>\n\t\t\t\t</Tooltip>\n\t\t\t</StyledListItemButton>\n\t\t\t<Menu\n\t\t\t\t{ ...bindMenu( popupState ) }\n\t\t\t\tanchorOrigin={ {\n\t\t\t\t\tvertical: 'bottom',\n\t\t\t\t\thorizontal: 'right',\n\t\t\t\t} }\n\t\t\t\ttransformOrigin={ {\n\t\t\t\t\tvertical: 'top',\n\t\t\t\t\thorizontal: 'right',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<MenuListItem\n\t\t\t\t\tsx={ { minWidth: '160px' } }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\topenEditMode();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<Typography variant=\"caption\" sx={ { color: 'text.primary' } }>\n\t\t\t\t\t\t{ __( 'Rename', 'elementor' ) }\n\t\t\t\t\t</Typography>\n\t\t\t\t</MenuListItem>\n\t\t\t\t<MenuListItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\topenDialog( { id, label } );\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<Typography variant=\"caption\" sx={ { color: 'error.light' } }>\n\t\t\t\t\t\t{ __( 'Delete', 'elementor' ) }\n\t\t\t\t\t</Typography>\n\t\t\t\t</MenuListItem>\n\t\t\t</Menu>\n\t\t</>\n\t);\n};\n\n// Custom styles for sortable list item, until the component is available in the UI package.\nconst StyledListItemButton = styled( ListItemButton, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'showActions' ].includes( prop ),\n} )< ListItemButtonProps & { showActions: boolean } >(\n\t( { showActions } ) => `\n\tmin-height: 36px;\n\n\t&.visible-class-item {\n\t\tbox-shadow: none !important;\n\t}\n\n\t.class-item-more-actions, .class-item-sortable-trigger {\n\t\tvisibility: ${ showActions ? 'visible' : 'hidden' };\n\t}\n\n\t.class-item-sortable-trigger {\n\t\tvisibility: ${ showActions ? 'visible' : 'hidden' };\n\t}\n\n\t&:hover&:not(:disabled) {\n\t\t.class-item-more-actions, .class-item-sortable-trigger {\n\t\t\tvisibility: visible;\n\t\t}\n\t}\n`\n);\n\nconst EmptyState = () => (\n\t<Stack alignItems=\"center\" gap={ 1.5 } pt={ 10 } px={ 0.5 } maxWidth=\"260px\" margin=\"auto\">\n\t\t<FlippedColorSwatchIcon fontSize=\"large\" />\n\t\t<StyledHeader variant=\"subtitle2\" component=\"h2\" color=\"text.secondary\">\n\t\t\t{ __( 'There are no global classes yet.', 'elementor' ) }\n\t\t</StyledHeader>\n\t\t<Typography align=\"center\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ __(\n\t\t\t\t'CSS classes created in the editor panel will appear here. Once they are available, you can arrange their hierarchy, rename them, or delete them as needed.',\n\t\t\t\t'elementor'\n\t\t\t) }\n\t\t</Typography>\n\t</Stack>\n);\n\n// Override panel reset styles.\nconst StyledHeader = styled( Typography )< TypographyProps >( ( { theme, variant } ) => ( {\n\t'&.MuiTypography-root': {\n\t\t...( theme.typography[ variant as keyof typeof theme.typography ] as React.CSSProperties ),\n\t},\n} ) );\n\nconst Indicator = styled( Box, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'isActive', 'isError' ].includes( prop ),\n} )< { isActive: boolean; isError: boolean } >( ( { theme, isActive, isError } ) => ( {\n\tdisplay: 'flex',\n\twidth: '100%',\n\tflexGrow: 1,\n\tborderRadius: theme.spacing( 0.5 ),\n\tborder: getIndicatorBorder( { isActive, isError, theme } ),\n\tpadding: `0 ${ theme.spacing( 1 ) }`,\n\tmarginLeft: isActive ? theme.spacing( 1 ) : 0,\n\tminWidth: 0,\n} ) );\n\nconst getIndicatorBorder = ( { isActive, isError, theme }: { isActive: boolean; isError: boolean; theme: Theme } ) => {\n\tif ( isError ) {\n\t\treturn `2px solid ${ theme.palette.error.main }`;\n\t}\n\n\tif ( isActive ) {\n\t\treturn `2px solid ${ theme.palette.secondary.main }`;\n\t}\n\n\treturn 'none';\n};\n\nconst validateLabel = ( newLabel: string ) => {\n\tif ( ! stylesRepository.isLabelValid( newLabel ) ) {\n\t\treturn __( 'Format is not valid', 'elementor' );\n\t}\n\n\tif ( stylesRepository.isLabelExist( newLabel ) ) {\n\t\treturn __( 'Existing name', 'elementor' );\n\t}\n\n\treturn null;\n};\n","import { generateId } from '@elementor/editor-styles';\nimport type { StylesProvider } from '@elementor/editor-styles-repository';\nimport {\n\t__dispatch as dispatch,\n\t__getState as getState,\n\t__subscribeWithSelector as subscribeWithSelector,\n} from '@elementor/store';\nimport { __ } from '@wordpress/i18n';\n\nimport { GlobalClassLabelAlreadyExistsError } from './errors';\nimport { selectClass, selectGlobalClasses, selectOrderedClasses, slice, type StateWithGlobalClasses } from './store';\n\nconst MAX_CLASSES = 50;\n\nexport const globalClassesStylesProvider = {\n\tkey: 'global-classes',\n\tpriority: 30,\n\tlimit: MAX_CLASSES,\n\tactions: {\n\t\tget: () => selectOrderedClasses( getState() ),\n\t\tgetById: ( id ) => selectClass( getState(), id ),\n\t\tcreate: ( label ) => {\n\t\t\tconst classes = selectGlobalClasses( getState() );\n\n\t\t\tconst existingLabels = Object.values( classes ).map( ( style ) => style.label );\n\n\t\t\tif ( existingLabels.includes( label ) ) {\n\t\t\t\tthrow new GlobalClassLabelAlreadyExistsError( { context: { label } } );\n\t\t\t}\n\n\t\t\tconst existingIds = Object.keys( classes );\n\t\t\tconst id = generateId( 'g-', existingIds );\n\n\t\t\tdispatch(\n\t\t\t\tslice.actions.add( {\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'class',\n\t\t\t\t\tlabel,\n\t\t\t\t\tvariants: [],\n\t\t\t\t} )\n\t\t\t);\n\n\t\t\treturn id;\n\t\t},\n\t\tupdate: ( payload ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.update( {\n\t\t\t\t\tstyle: payload,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\tdelete: ( id ) => {\n\t\t\tdispatch( slice.actions.delete( id ) );\n\t\t},\n\t\tsetOrder: ( order ) => {\n\t\t\tdispatch( slice.actions.setOrder( order ) );\n\t\t},\n\t\tupdateProps: ( args ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.updateProps( {\n\t\t\t\t\tid: args.id,\n\t\t\t\t\tmeta: args.meta,\n\t\t\t\t\tprops: args.props,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t},\n\tsubscribe: ( cb ) => subscribeWithSelector( ( state: StateWithGlobalClasses ) => state.globalClasses, cb ),\n\tlabels: {\n\t\tsingular: __( 'Global class', 'elementor' ),\n\t\tplural: __( 'Global CSS classes', 'elementor' ),\n\t},\n} satisfies StylesProvider;\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrder } from '../store';\n\nexport const useClassesOrder = () => {\n\treturn useSelector( selectOrder );\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrderedClasses } from '../store';\n\nexport const useOrderedClasses = () => {\n\treturn useSelector( selectOrderedClasses );\n};\n","import * as React from 'react';\nimport { createContext, useContext, useState } from 'react';\nimport { type StyleDefinition } from '@elementor/editor-styles';\nimport { AlertOctagonFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\tDialogTitle,\n\tTypography,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\n\ntype DeleteConfirmationDialogProps = Pick< StyleDefinition, 'id' | 'label' >;\n\ntype DeleteConfirmationContext = {\n\topenDialog: ( props: DeleteConfirmationDialogProps ) => void;\n\tcloseDialog: () => void;\n\tdialogProps: DeleteConfirmationDialogProps | null;\n};\n\nconst context = createContext< DeleteConfirmationContext | null >( null );\n\nexport const DeleteConfirmationProvider = ( { children }: React.PropsWithChildren ) => {\n\tconst [ dialogProps, setDialogProps ] = useState< DeleteConfirmationDialogProps | null >( null );\n\n\tconst openDialog = ( props: DeleteConfirmationDialogProps ) => {\n\t\tsetDialogProps( props );\n\t};\n\n\tconst closeDialog = () => {\n\t\tsetDialogProps( null );\n\t};\n\n\treturn (\n\t\t<context.Provider value={ { openDialog, closeDialog, dialogProps } }>\n\t\t\t{ children }\n\t\t\t{ !! dialogProps && <DeleteConfirmationDialog { ...dialogProps } /> }\n\t\t</context.Provider>\n\t);\n};\n\nconst TITLE_ID = 'delete-class-dialog';\n\nconst DeleteConfirmationDialog = ( { label, id }: DeleteConfirmationDialogProps ) => {\n\tconst { closeDialog } = useDeleteConfirmation();\n\n\tconst onConfirm = () => {\n\t\tglobalClassesStylesProvider.actions.delete( id );\n\n\t\tcloseDialog();\n\t};\n\n\treturn (\n\t\t<Dialog open onClose={ closeDialog } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t\t\t<AlertOctagonFilledIcon color=\"error\" />\n\t\t\t\t{ __( 'Delete global class', 'elementor' ) }\n\t\t\t</DialogTitle>\n\t\t\t<DialogContent>\n\t\t\t\t<DialogContentText variant=\"body2\" color=\"textPrimary\">\n\t\t\t\t\t{ __( 'Deleting', 'elementor' ) }\n\t\t\t\t\t<Typography variant=\"subtitle2\" component=\"span\">\n\t\t\t\t\t\t { label } \n\t\t\t\t\t</Typography>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'will permanently remove it from your project and may affect the design across all elements using it. This action cannot be undone.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</DialogContentText>\n\t\t\t</DialogContent>\n\t\t\t<DialogActions>\n\t\t\t\t<Button color=\"secondary\" onClick={ closeDialog }>\n\t\t\t\t\t{ __( 'Cancel', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t\t<Button variant=\"contained\" color=\"error\" onClick={ onConfirm }>\n\t\t\t\t\t{ __( 'Delete', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</DialogActions>\n\t\t</Dialog>\n\t);\n};\n\nexport const useDeleteConfirmation = () => {\n\tconst contextValue = useContext( context );\n\n\tif ( ! contextValue ) {\n\t\tthrow new Error( 'useDeleteConfirmation must be used within a DeleteConfirmationProvider' );\n\t}\n\n\treturn contextValue;\n};\n","import * as React from 'react';\nimport { GripVerticalIcon } from '@elementor/icons';\nimport {\n\tBox,\n\tstyled,\n\tUnstableSortableItem,\n\ttype UnstableSortableItemProps,\n\ttype UnstableSortableItemRenderProps,\n\tUnstableSortableProvider,\n\ttype UnstableSortableProviderProps,\n} from '@elementor/ui';\n\nexport const SortableProvider = < T extends string >( props: UnstableSortableProviderProps< T > ) => (\n\t<UnstableSortableProvider restrictAxis variant=\"static\" dragPlaceholderStyle={ { opacity: '1' } } { ...props } />\n);\n\nexport type SortableTriggerProps = React.HTMLAttributes< HTMLDivElement >;\n\nexport const SortableTrigger = ( props: SortableTriggerProps ) => (\n\t<StyledSortableTrigger { ...props } role=\"button\" className=\"class-item-sortable-trigger\">\n\t\t<GripVerticalIcon fontSize=\"tiny\" />\n\t</StyledSortableTrigger>\n);\n\ntype SortableItemProps = {\n\tid: UnstableSortableItemProps[ 'id' ];\n\tchildren: ( props: Partial< UnstableSortableItemRenderProps > ) => React.ReactNode;\n};\n\nexport const SortableItem = ( { children, id, ...props }: SortableItemProps ) => {\n\treturn (\n\t\t<UnstableSortableItem\n\t\t\t{ ...props }\n\t\t\tid={ id }\n\t\t\trender={ ( {\n\t\t\t\titemProps,\n\t\t\t\tisDragged,\n\t\t\t\ttriggerProps,\n\t\t\t\titemStyle,\n\t\t\t\ttriggerStyle,\n\t\t\t\tdropIndicationStyle,\n\t\t\t\tshowDropIndication,\n\t\t\t\tisDragOverlay,\n\t\t\t\tisDragPlaceholder,\n\t\t\t}: UnstableSortableItemRenderProps ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Box\n\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\tstyle={ itemStyle }\n\t\t\t\t\t\tcomponent={ 'li' }\n\t\t\t\t\t\trole=\"listitem\"\n\t\t\t\t\t\tsx={ {\n\t\t\t\t\t\t\tbackgroundColor: isDragOverlay ? 'background.paper' : undefined,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children( {\n\t\t\t\t\t\t\titemProps,\n\t\t\t\t\t\t\tisDragged,\n\t\t\t\t\t\t\ttriggerProps,\n\t\t\t\t\t\t\titemStyle,\n\t\t\t\t\t\t\ttriggerStyle,\n\t\t\t\t\t\t\tisDragPlaceholder,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t{ showDropIndication && <SortableItemIndicator style={ dropIndicationStyle } /> }\n\t\t\t\t\t</Box>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst StyledSortableTrigger = styled( 'div' )( ( { theme } ) => ( {\n\tposition: 'absolute',\n\tleft: 0,\n\ttop: '50%',\n\ttransform: `translate( -${ theme.spacing( 1.5 ) }, -50% )`,\n\tcolor: theme.palette.action.active,\n} ) );\n\nconst SortableItemIndicator = styled( Box )`\n\twidth: 100%;\n\theight: 1px;\n\tbackground-color: ${ ( { theme } ) => theme.palette.text.primary };\n`;\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { AlertTriangleFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\ttype DialogContentTextProps,\n\ttype DialogProps,\n\tDialogTitle,\n} from '@elementor/ui';\n\nconst TITLE_ID = 'save-changes-dialog';\n\nconst SaveChangesDialog = ( { children, onClose }: Pick< DialogProps, 'children' | 'onClose' > ) => (\n\t<Dialog open onClose={ onClose } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t{ children }\n\t</Dialog>\n);\n\nconst SaveChangesDialogTitle = ( { children }: React.PropsWithChildren ) => (\n\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t<AlertTriangleFilledIcon color=\"secondary\" />\n\t\t{ children }\n\t</DialogTitle>\n);\n\nconst SaveChangesDialogContent = ( { children }: React.PropsWithChildren ) => (\n\t<DialogContent>{ children }</DialogContent>\n);\n\nconst SaveChangesDialogContentText = ( props: DialogContentTextProps ) => (\n\t<DialogContentText variant=\"body2\" color=\"textPrimary\" display=\"flex\" flexDirection=\"column\" { ...props } />\n);\n\ntype Action = {\n\tlabel: string;\n\taction: () => void | Promise< void >;\n};\n\ntype ConfirmationDialogActionsProps = {\n\tactions: {\n\t\tcancel: Action;\n\t\tconfirm: Action;\n\t};\n};\nconst SaveChangesDialogActions = ( { actions }: ConfirmationDialogActionsProps ) => {\n\tconst [ isConfirming, setIsConfirming ] = useState( false );\n\tconst { cancel, confirm } = actions;\n\n\tconst onConfirm = async () => {\n\t\tsetIsConfirming( true );\n\t\tawait confirm.action();\n\t\tsetIsConfirming( false );\n\t};\n\treturn (\n\t\t<DialogActions>\n\t\t\t<Button variant=\"text\" color=\"secondary\" onClick={ cancel.action }>\n\t\t\t\t{ cancel.label }\n\t\t\t</Button>\n\t\t\t<Button variant=\"contained\" color=\"secondary\" onClick={ onConfirm } loading={ isConfirming }>\n\t\t\t\t{ confirm.label }\n\t\t\t</Button>\n\t\t</DialogActions>\n\t);\n};\n\nSaveChangesDialog.Title = SaveChangesDialogTitle;\nSaveChangesDialog.Content = SaveChangesDialogContent;\nSaveChangesDialog.ContentText = SaveChangesDialogContentText;\nSaveChangesDialog.Actions = SaveChangesDialogActions;\n\nconst useDialog = () => {\n\tconst [ isOpen, setIsOpen ] = useState( false );\n\n\tconst open = () => setIsOpen( true );\n\tconst close = () => setIsOpen( false );\n\n\treturn { isOpen, open, close };\n};\n\nexport { SaveChangesDialog, useDialog };\n","import { useEffect } from 'react';\nimport { __useDispatch as useDispatch } from '@elementor/store';\n\nimport { apiClient } from '../api';\nimport { slice } from '../store';\n\nexport function PopulateStore() {\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tapiClient.all().then( ( res ) => {\n\t\t\tconst { data, meta } = res.data;\n\n\t\t\tdispatch( slice.actions.init( { items: data, order: meta.order } ) );\n\t\t} );\n\t}, [ dispatch ] );\n\n\treturn null;\n}\n","import { setDocumentModifiedStatus } from '@elementor/editor-documents';\nimport { registerDataHook } from '@elementor/editor-v1-adapters';\nimport { __getState as getState, __subscribeWithSelector as subscribeWithSelector } from '@elementor/store';\n\nimport { saveGlobalClasses } from './save-global-classes';\nimport { selectIsDirty } from './store';\n\nexport function syncWithDocumentSave() {\n\tconst unsubscribe = syncDirtyState();\n\n\tbindSaveAction();\n\n\treturn unsubscribe;\n}\n\nfunction syncDirtyState() {\n\treturn subscribeWithSelector( selectIsDirty, () => {\n\t\tif ( ! isDirty() ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetDocumentModifiedStatus( true );\n\t} );\n}\n\nfunction bindSaveAction() {\n\tregisterDataHook( 'after', 'document/save/save', ( args ) => {\n\t\treturn saveGlobalClasses( {\n\t\t\tcontext: args.status === 'publish' ? 'frontend' : 'preview',\n\t\t} );\n\t} );\n}\n\nfunction isDirty() {\n\treturn selectIsDirty( getState() );\n}\n","import { init } from './init';\n\ninit();\n"],"mappings":"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","names":["import_editor_panels","import_editor_styles_repository","import_editor_v1_adapters","import_store","React","import_editor_documents","import_ui","import_i18n","React","import_react","import_editor_ui","import_icons","import_ui","import_i18n","import_store","createSlice","id","createSelector","useSelector","import_store","context","getState","dispatch","React","React","import_editor_ui","import_icons","import_ui","import_i18n","import_editor_styles","import_store","import_i18n","getState","id","dispatch","subscribeWithSelector","import_store","useSelector","import_store","useSelector","React","import_react","import_icons","import_ui","import_i18n","id","React","import_icons","import_ui","id","id","React","import_react","import_icons","import_ui","TITLE_ID","createPanel","isDirty","useActiveDocument","useActiveDocument","useActiveDocumentActions","import_react","import_store","dispatch","useDispatch","import_editor_documents","import_editor_v1_adapters","import_store","subscribeWithSelector","getState","registerSlice","registerPanel","listenTo"]}
|
package/dist/index.mjs
CHANGED
|
@@ -31,10 +31,11 @@ import {
|
|
|
31
31
|
PanelHeader,
|
|
32
32
|
PanelHeaderTitle
|
|
33
33
|
} from "@elementor/editor-panels";
|
|
34
|
+
import { ThemeProvider } from "@elementor/editor-ui";
|
|
34
35
|
import { changeEditMode } from "@elementor/editor-v1-adapters";
|
|
35
36
|
import { XIcon } from "@elementor/icons";
|
|
36
37
|
import { useMutation } from "@elementor/query";
|
|
37
|
-
import { Alert, Box as Box4, Button as Button3, ErrorBoundary, IconButton as IconButton2, Stack as
|
|
38
|
+
import { Alert, Box as Box4, Button as Button3, ErrorBoundary, IconButton as IconButton2, Stack as Stack2 } from "@elementor/ui";
|
|
38
39
|
import { __ as __5 } from "@wordpress/i18n";
|
|
39
40
|
|
|
40
41
|
// src/hooks/use-dirty-state.ts
|
|
@@ -179,7 +180,7 @@ import * as React from "react";
|
|
|
179
180
|
import { useState } from "react";
|
|
180
181
|
import { useSuppressedMessage } from "@elementor/editor-current-user";
|
|
181
182
|
import { IntroductionModal } from "@elementor/editor-ui";
|
|
182
|
-
import { Box,
|
|
183
|
+
import { Box, Typography } from "@elementor/ui";
|
|
183
184
|
import { __ } from "@wordpress/i18n";
|
|
184
185
|
var MESSAGE_KEY = "global-class-manager";
|
|
185
186
|
var ClassManagerIntroduction = () => {
|
|
@@ -190,6 +191,10 @@ var ClassManagerIntroduction = () => {
|
|
|
190
191
|
{
|
|
191
192
|
open: shouldShowIntroduction,
|
|
192
193
|
title: __("CSS Class manager", "elementor"),
|
|
194
|
+
image: {
|
|
195
|
+
src: "https://assets.elementor.com/packages/v1/images/class-manager-intro.svg",
|
|
196
|
+
alt: __("Class manager screenshot", "elementor")
|
|
197
|
+
},
|
|
193
198
|
content: /* @__PURE__ */ React.createElement(IntroductionContent, null),
|
|
194
199
|
handleClose: (shouldShowAgain) => {
|
|
195
200
|
if (!shouldShowAgain) {
|
|
@@ -201,20 +206,13 @@ var ClassManagerIntroduction = () => {
|
|
|
201
206
|
);
|
|
202
207
|
};
|
|
203
208
|
var IntroductionContent = () => {
|
|
204
|
-
return /* @__PURE__ */ React.createElement(
|
|
205
|
-
Image,
|
|
206
|
-
{
|
|
207
|
-
sx: { width: "100%", height: "312px" },
|
|
208
|
-
src: "https://assets.elementor.com/packages/v1/images/class-manager-intro.svg",
|
|
209
|
-
alt: ""
|
|
210
|
-
}
|
|
211
|
-
), /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, __(
|
|
209
|
+
return /* @__PURE__ */ React.createElement(Box, { padding: 3 }, /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, __(
|
|
212
210
|
"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.",
|
|
213
211
|
"elementor"
|
|
214
212
|
)), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, __(
|
|
215
213
|
"Changes apply globally\u2014any modifications will affect all elements using the class, impacting the class order and priority across your site.",
|
|
216
214
|
"elementor"
|
|
217
|
-
)))
|
|
215
|
+
)));
|
|
218
216
|
};
|
|
219
217
|
|
|
220
218
|
// src/components/class-manager/flipped-color-swatch-icon.tsx
|
|
@@ -225,7 +223,7 @@ var FlippedColorSwatchIcon = ({ sx, ...props }) => /* @__PURE__ */ React2.create
|
|
|
225
223
|
// src/components/class-manager/global-classes-list.tsx
|
|
226
224
|
import * as React5 from "react";
|
|
227
225
|
import { stylesRepository } from "@elementor/editor-styles-repository";
|
|
228
|
-
import { EditableField, EllipsisWithTooltip, useEditable } from "@elementor/editor-ui";
|
|
226
|
+
import { EditableField, EllipsisWithTooltip, MenuListItem, useEditable } from "@elementor/editor-ui";
|
|
229
227
|
import { DotsVerticalIcon } from "@elementor/icons";
|
|
230
228
|
import {
|
|
231
229
|
bindMenu,
|
|
@@ -234,10 +232,8 @@ import {
|
|
|
234
232
|
IconButton,
|
|
235
233
|
List,
|
|
236
234
|
ListItemButton,
|
|
237
|
-
ListItemText,
|
|
238
235
|
Menu,
|
|
239
|
-
|
|
240
|
-
Stack as Stack2,
|
|
236
|
+
Stack,
|
|
241
237
|
styled as styled2,
|
|
242
238
|
Tooltip,
|
|
243
239
|
Typography as Typography3,
|
|
@@ -527,7 +523,7 @@ var ClassItem = ({ id: id2, label, renameClass, selected, disabled, sortableTrig
|
|
|
527
523
|
}
|
|
528
524
|
},
|
|
529
525
|
/* @__PURE__ */ React5.createElement(
|
|
530
|
-
|
|
526
|
+
MenuListItem,
|
|
531
527
|
{
|
|
532
528
|
sx: { minWidth: "160px" },
|
|
533
529
|
onClick: () => {
|
|
@@ -535,17 +531,17 @@ var ClassItem = ({ id: id2, label, renameClass, selected, disabled, sortableTrig
|
|
|
535
531
|
openEditMode();
|
|
536
532
|
}
|
|
537
533
|
},
|
|
538
|
-
/* @__PURE__ */ React5.createElement(
|
|
534
|
+
/* @__PURE__ */ React5.createElement(Typography3, { variant: "caption", sx: { color: "text.primary" } }, __4("Rename", "elementor"))
|
|
539
535
|
),
|
|
540
536
|
/* @__PURE__ */ React5.createElement(
|
|
541
|
-
|
|
537
|
+
MenuListItem,
|
|
542
538
|
{
|
|
543
539
|
onClick: () => {
|
|
544
540
|
popupState.close();
|
|
545
541
|
openDialog({ id: id2, label });
|
|
546
542
|
}
|
|
547
543
|
},
|
|
548
|
-
/* @__PURE__ */ React5.createElement(
|
|
544
|
+
/* @__PURE__ */ React5.createElement(Typography3, { variant: "caption", sx: { color: "error.light" } }, __4("Delete", "elementor"))
|
|
549
545
|
)
|
|
550
546
|
));
|
|
551
547
|
};
|
|
@@ -574,7 +570,7 @@ var StyledListItemButton = styled2(ListItemButton, {
|
|
|
574
570
|
}
|
|
575
571
|
`
|
|
576
572
|
);
|
|
577
|
-
var EmptyState = () => /* @__PURE__ */ React5.createElement(
|
|
573
|
+
var EmptyState = () => /* @__PURE__ */ React5.createElement(Stack, { alignItems: "center", gap: 1.5, pt: 10, px: 0.5, maxWidth: "260px", margin: "auto" }, /* @__PURE__ */ React5.createElement(FlippedColorSwatchIcon, { fontSize: "large" }), /* @__PURE__ */ React5.createElement(StyledHeader, { variant: "subtitle2", component: "h2", color: "text.secondary" }, __4("There are no global classes yet.", "elementor")), /* @__PURE__ */ React5.createElement(Typography3, { align: "center", variant: "caption", color: "text.secondary" }, __4(
|
|
578
574
|
"CSS classes created in the editor panel will appear here. Once they are available, you can arrange their hierarchy, rename them, or delete them as needed.",
|
|
579
575
|
"elementor"
|
|
580
576
|
)));
|
|
@@ -675,7 +671,7 @@ function ClassManagerPanel() {
|
|
|
675
671
|
const { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();
|
|
676
672
|
const { mutateAsync: publish, isPending: isPublishing } = usePublish();
|
|
677
673
|
usePreventUnload();
|
|
678
|
-
return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(ErrorBoundary, { fallback: /* @__PURE__ */ React7.createElement(ErrorBoundaryFallback, null) }, /* @__PURE__ */ React7.createElement(Panel, null, /* @__PURE__ */ React7.createElement(PanelHeader, null, /* @__PURE__ */ React7.createElement(
|
|
674
|
+
return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(ThemeProvider, null, /* @__PURE__ */ React7.createElement(ErrorBoundary, { fallback: /* @__PURE__ */ React7.createElement(ErrorBoundaryFallback, null) }, /* @__PURE__ */ React7.createElement(Panel, null, /* @__PURE__ */ React7.createElement(PanelHeader, null, /* @__PURE__ */ React7.createElement(Stack2, { p: 1, pl: 2, width: "100%", direction: "row", alignItems: "center" }, /* @__PURE__ */ React7.createElement(PanelHeaderTitle, { sx: { display: "flex", alignItems: "center", gap: 0.5 } }, /* @__PURE__ */ React7.createElement(FlippedColorSwatchIcon, { fontSize: "inherit" }), __5("CSS Class manager", "elementor")), /* @__PURE__ */ React7.createElement(
|
|
679
675
|
CloseButton,
|
|
680
676
|
{
|
|
681
677
|
sx: { marginLeft: "auto" },
|
|
@@ -717,7 +713,7 @@ function ClassManagerPanel() {
|
|
|
717
713
|
}
|
|
718
714
|
}
|
|
719
715
|
}
|
|
720
|
-
)));
|
|
716
|
+
))));
|
|
721
717
|
}
|
|
722
718
|
var CloseButton = ({ onClose, ...props }) => /* @__PURE__ */ React7.createElement(IconButton2, { size: "small", color: "secondary", onClick: onClose, "aria-label": "Close", ...props }, /* @__PURE__ */ React7.createElement(XIcon, { fontSize: "small" }));
|
|
723
719
|
var ErrorBoundaryFallback = () => /* @__PURE__ */ React7.createElement(Box4, { role: "alert", sx: { minHeight: "100%", p: 2 } }, /* @__PURE__ */ React7.createElement(Alert, { severity: "error", sx: { mb: 2, maxWidth: 400, textAlign: "center" } }, /* @__PURE__ */ React7.createElement("strong", null, __5("Something went wrong", "elementor"))));
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/init.ts","../src/components/class-manager/class-manager-button.tsx","../src/components/class-manager/class-manager-panel.tsx","../src/hooks/use-dirty-state.ts","../src/store.ts","../src/errors.ts","../src/save-global-classes.ts","../src/api.ts","../src/components/class-manager/class-manager-introduction.tsx","../src/components/class-manager/flipped-color-swatch-icon.tsx","../src/components/class-manager/global-classes-list.tsx","../src/global-classes-styles-provider.ts","../src/hooks/use-classes-order.ts","../src/hooks/use-ordered-classes.ts","../src/components/class-manager/delete-confirmation-dialog.tsx","../src/components/class-manager/sortable.tsx","../src/components/class-manager/save-changes-dialog.tsx","../src/components/populate-store.tsx","../src/sync-with-document-save.ts","../src/index.ts"],"sourcesContent":["import { injectIntoLogic } from '@elementor/editor';\nimport { injectIntoClassSelectorActions } from '@elementor/editor-editing-panel';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport { ClassManagerButton } from './components/class-manager/class-manager-button';\nimport { panel } from './components/class-manager/class-manager-panel';\nimport { PopulateStore } from './components/populate-store';\nimport { globalClassesStylesProvider } from './global-classes-styles-provider';\nimport { slice } from './store';\nimport { syncWithDocumentSave } from './sync-with-document-save';\n\nexport function init() {\n\tregisterSlice( slice );\n\tregisterPanel( panel );\n\n\tstylesRepository.register( globalClassesStylesProvider );\n\n\tinjectIntoLogic( {\n\t\tid: 'global-classes-populate-store',\n\t\tcomponent: PopulateStore,\n\t} );\n\n\tinjectIntoClassSelectorActions( {\n\t\tid: 'global-classes-manager-button',\n\t\tcomponent: ClassManagerButton,\n\t} );\n\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tsyncWithDocumentSave();\n\t} );\n}\n","import * as React from 'react';\nimport {\n\t__useActiveDocument as useActiveDocument,\n\t__useActiveDocumentActions as useActiveDocumentActions,\n} from '@elementor/editor-documents';\nimport { IconButton, Tooltip } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { usePanelActions } from './class-manager-panel';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { SaveChangesDialog, useDialog } from './save-changes-dialog';\n\nexport const ClassManagerButton = () => {\n\tconst document = useActiveDocument();\n\tconst { open: openPanel } = usePanelActions();\n\tconst { save: saveDocument } = useActiveDocumentActions();\n\tconst { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();\n\n\tconst handleOpenPanel = () => {\n\t\tif ( document?.isDirty ) {\n\t\t\topenSaveChangesDialog();\n\t\t\treturn;\n\t\t}\n\n\t\topenPanel();\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip title={ __( 'Class manager', 'elementor' ) } placement=\"top\">\n\t\t\t\t<IconButton onClick={ handleOpenPanel }>\n\t\t\t\t\t<FlippedColorSwatchIcon fontSize=\"tiny\" />\n\t\t\t\t</IconButton>\n\t\t\t</Tooltip>\n\t\t\t{ isSaveChangesDialogOpen && (\n\t\t\t\t<SaveChangesDialog>\n\t\t\t\t\t<SaveChangesDialog.Title>{ __( 'You have unsaved changes', 'elementor' ) }</SaveChangesDialog.Title>\n\t\t\t\t\t<SaveChangesDialog.Content>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText sx={ { mb: 2 } }>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Save your changes before moving to the class manager to ensure all updates are applied and saved.',\n\t\t\t\t\t\t\t\t'elementor'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t{ __( 'If you leave without saving, all changes will be discarded.', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t</SaveChangesDialog.Content>\n\t\t\t\t\t<SaveChangesDialog.Actions\n\t\t\t\t\t\tactions={ {\n\t\t\t\t\t\t\tcancel: {\n\t\t\t\t\t\t\t\tlabel: __( 'Keep editing', 'elementor' ),\n\t\t\t\t\t\t\t\taction: closeSaveChangesDialog,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tconfirm: {\n\t\t\t\t\t\t\t\tlabel: __( 'Save & Continue', 'elementor' ),\n\t\t\t\t\t\t\t\taction: async () => {\n\t\t\t\t\t\t\t\t\tawait saveDocument();\n\t\t\t\t\t\t\t\t\tcloseSaveChangesDialog();\n\t\t\t\t\t\t\t\t\topenPanel();\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</SaveChangesDialog>\n\t\t\t) }\n\t\t</>\n\t);\n};\n","import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport {\n\t__useActiveDocument as useActiveDocument,\n\tgetDocumentModifiedStatus,\n\tsetDocumentModifiedStatus,\n} from '@elementor/editor-documents';\nimport {\n\t__createPanel as createPanel,\n\tPanel,\n\tPanelBody,\n\tPanelFooter,\n\tPanelHeader,\n\tPanelHeaderTitle,\n} from '@elementor/editor-panels';\nimport { changeEditMode } from '@elementor/editor-v1-adapters';\nimport { XIcon } from '@elementor/icons';\nimport { useMutation } from '@elementor/query';\nimport { Alert, Box, Button, ErrorBoundary, IconButton, type IconButtonProps, Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useDirtyState } from '../../hooks/use-dirty-state';\nimport { saveGlobalClasses } from '../../save-global-classes';\nimport { ClassManagerIntroduction } from './class-manager-introduction';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { GlobalClassesList } from './global-classes-list';\nimport { SaveChangesDialog, useDialog } from './save-changes-dialog';\n\nconst id = 'global-classes-manager';\n\n// We need to disable the app-bar buttons, and the elements overlays when opening the classes manager panel.\n// The buttons and overlays are enabled only in edit mode, so we're creating a custom new edit mode that\n// will force them to be disabled. We can't use the `preview` edit mode in this case since it'll force\n// the panel to be closed.\nexport const { panel, usePanelActions } = createPanel( {\n\tid,\n\tcomponent: ClassManagerPanel,\n\tallowedEditModes: [ 'edit', id ],\n\tonOpen: () => {\n\t\tchangeEditMode( id );\n\n\t\treturn getDocumentModifiedStatus();\n\t},\n\tonClose: ( documentModifiedState ) => {\n\t\tchangeEditMode( 'edit' );\n\n\t\tif ( getDocumentModifiedStatus() !== documentModifiedState ) {\n\t\t\tsetDocumentModifiedStatus( documentModifiedState );\n\t\t}\n\t},\n} );\n\nexport function ClassManagerPanel() {\n\tconst isDirty = useDirtyState();\n\n\tconst { close: closePanel } = usePanelActions();\n\tconst { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();\n\n\tconst { mutateAsync: publish, isPending: isPublishing } = usePublish();\n\n\tusePreventUnload();\n\n\treturn (\n\t\t<>\n\t\t\t<ErrorBoundary fallback={ <ErrorBoundaryFallback /> }>\n\t\t\t\t<Panel>\n\t\t\t\t\t<PanelHeader>\n\t\t\t\t\t\t<Stack p={ 1 } pl={ 2 } width=\"100%\" direction=\"row\" alignItems=\"center\">\n\t\t\t\t\t\t\t<PanelHeaderTitle sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>\n\t\t\t\t\t\t\t\t<FlippedColorSwatchIcon fontSize=\"inherit\" />\n\t\t\t\t\t\t\t\t{ __( 'CSS Class manager', 'elementor' ) }\n\t\t\t\t\t\t\t</PanelHeaderTitle>\n\t\t\t\t\t\t\t<CloseButton\n\t\t\t\t\t\t\t\tsx={ { marginLeft: 'auto' } }\n\t\t\t\t\t\t\t\tonClose={ () => {\n\t\t\t\t\t\t\t\t\tif ( isDirty ) {\n\t\t\t\t\t\t\t\t\t\topenSaveChangesDialog();\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\tclosePanel();\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</PanelHeader>\n\t\t\t\t\t<PanelBody px={ 2 }>\n\t\t\t\t\t\t<GlobalClassesList disabled={ isPublishing } />\n\t\t\t\t\t</PanelBody>\n\t\t\t\t\t<PanelFooter>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tfullWidth\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tcolor=\"global\"\n\t\t\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\t\t\tonClick={ publish }\n\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t\tloading={ isPublishing }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Save changes', 'elementor' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</PanelFooter>\n\t\t\t\t</Panel>\n\t\t\t</ErrorBoundary>\n\t\t\t<ClassManagerIntroduction />\n\t\t\t{ isSaveChangesDialogOpen && (\n\t\t\t\t<SaveChangesDialog>\n\t\t\t\t\t<SaveChangesDialog.Title>{ __( 'You have unsaved changes', 'elementor' ) }</SaveChangesDialog.Title>\n\t\t\t\t\t<SaveChangesDialog.Content>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t{ __( 'You have unsaved changes in the Class Manager.', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t{ __( 'To avoid losing your updates, save your changes before leaving.', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t</SaveChangesDialog.Content>\n\t\t\t\t\t<SaveChangesDialog.Actions\n\t\t\t\t\t\tactions={ {\n\t\t\t\t\t\t\tcancel: {\n\t\t\t\t\t\t\t\tlabel: __( 'Cancel', 'elementor' ),\n\t\t\t\t\t\t\t\taction: closeSaveChangesDialog,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tconfirm: {\n\t\t\t\t\t\t\t\tlabel: __( 'Save & Continue', 'elementor' ),\n\t\t\t\t\t\t\t\taction: async () => {\n\t\t\t\t\t\t\t\t\tawait publish();\n\t\t\t\t\t\t\t\t\tcloseSaveChangesDialog();\n\t\t\t\t\t\t\t\t\tclosePanel();\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</SaveChangesDialog>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nconst CloseButton = ( { onClose, ...props }: IconButtonProps & { onClose: () => void } ) => (\n\t<IconButton size=\"small\" color=\"secondary\" onClick={ onClose } aria-label=\"Close\" { ...props }>\n\t\t<XIcon fontSize=\"small\" />\n\t</IconButton>\n);\n\nconst ErrorBoundaryFallback = () => (\n\t<Box role=\"alert\" sx={ { minHeight: '100%', p: 2 } }>\n\t\t<Alert severity=\"error\" sx={ { mb: 2, maxWidth: 400, textAlign: 'center' } }>\n\t\t\t<strong>{ __( 'Something went wrong', 'elementor' ) }</strong>\n\t\t</Alert>\n\t</Box>\n);\n\nconst usePreventUnload = () => {\n\tconst isDirty = useDirtyState();\n\n\tuseEffect( () => {\n\t\tconst handleBeforeUnload = ( event: BeforeUnloadEvent ) => {\n\t\t\tif ( isDirty ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t};\n\n\t\twindow.addEventListener( 'beforeunload', handleBeforeUnload );\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener( 'beforeunload', handleBeforeUnload );\n\t\t};\n\t}, [ isDirty ] );\n};\n\nconst usePublish = () => {\n\tconst document = useActiveDocument();\n\tconst [ initialDocumentStatus ] = useState( document?.isDirty ?? false );\n\n\treturn useMutation( {\n\t\tmutationFn: () => saveGlobalClasses( { context: 'frontend' } ),\n\t\tonSuccess: () => {\n\t\t\tif ( initialDocumentStatus !== document?.isDirty ) {\n\t\t\t\tsetDocumentModifiedStatus( initialDocumentStatus );\n\t\t\t}\n\t\t},\n\t} );\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectIsDirty } from '../store';\n\nexport const useDirtyState = () => {\n\treturn useSelector( selectIsDirty );\n};\n","import { mergeProps, type Props } from '@elementor/editor-props';\nimport {\n\tgetVariantByMeta,\n\ttype StyleDefinition,\n\ttype StyleDefinitionID,\n\ttype StyleDefinitionVariant,\n} from '@elementor/editor-styles';\nimport { type UpdateActionPayload } from '@elementor/editor-styles-repository';\nimport {\n\t__createSelector as createSelector,\n\t__createSlice as createSlice,\n\ttype PayloadAction,\n\ttype SliceState,\n} from '@elementor/store';\n\nimport { GlobalClassNotFoundError } from './errors';\n\nexport type GlobalClassesState = {\n\titems: Record< StyleDefinitionID, StyleDefinition >;\n\torder: StyleDefinitionID[];\n\tisDirty: boolean;\n};\n\nconst initialState: GlobalClassesState = {\n\titems: {},\n\torder: [],\n\tisDirty: false,\n};\n\nexport type StateWithGlobalClasses = SliceState< typeof slice >;\n\n// Slice\nconst SLICE_NAME = 'globalClasses';\n\nexport const slice = createSlice( {\n\tname: SLICE_NAME,\n\tinitialState,\n\treducers: {\n\t\tinit( state, { payload }: PayloadAction< Pick< GlobalClassesState, 'items' | 'order' > > ) {\n\t\t\tstate.items = payload.items;\n\t\t\tstate.order = payload.order;\n\n\t\t\tstate.isDirty = false;\n\t\t},\n\t\tadd( state, { payload }: PayloadAction< StyleDefinition > ) {\n\t\t\tstate.items[ payload.id ] = payload;\n\t\t\tstate.order.unshift( payload.id );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tdelete( state, { payload }: PayloadAction< StyleDefinitionID > ) {\n\t\t\tstate.items = Object.fromEntries( Object.entries( state.items ).filter( ( [ id ] ) => id !== payload ) );\n\n\t\t\tstate.order = state.order.filter( ( id ) => id !== payload );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tsetOrder( state, { payload }: PayloadAction< StyleDefinitionID[] > ) {\n\t\t\tstate.order = payload;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdate( state, { payload }: PayloadAction< { style: UpdateActionPayload } > ) {\n\t\t\tconst style = state.items[ payload.style.id ];\n\n\t\t\tconst mergedData = {\n\t\t\t\t...style,\n\t\t\t\t...payload.style,\n\t\t\t};\n\n\t\t\tstate.items[ payload.style.id ] = mergedData;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdateProps(\n\t\t\tstate,\n\t\t\t{\n\t\t\t\tpayload,\n\t\t\t}: PayloadAction< { id: StyleDefinitionID; meta: StyleDefinitionVariant[ 'meta' ]; props: Props } >\n\t\t) {\n\t\t\tconst style = state.items[ payload.id ];\n\n\t\t\tif ( ! style ) {\n\t\t\t\tthrow new GlobalClassNotFoundError( { context: { styleId: payload.id } } );\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( style, payload.meta );\n\n\t\t\tif ( variant ) {\n\t\t\t\tvariant.props = mergeProps( variant.props, payload.props );\n\t\t\t} else {\n\t\t\t\tstyle.variants.push( { meta: payload.meta, props: payload.props } );\n\t\t\t}\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\n\t\tsetPristine( state ) {\n\t\t\tstate.isDirty = false;\n\t\t},\n\t},\n} );\n\n// Selectors\nexport const selectOrder = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].order;\n\nexport const selectGlobalClasses = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].items;\n\nexport const selectOrderedClasses = createSelector( selectGlobalClasses, selectOrder, ( items, order ) =>\n\torder.map( ( id ) => items[ id ] )\n);\n\nexport const selectClass = ( state: SliceState< typeof slice >, id: StyleDefinitionID ) =>\n\tstate[ SLICE_NAME ].items[ id ] ?? null;\n\nexport const selectIsDirty = ( state: SliceState< typeof slice > ) => state.globalClasses.isDirty;\n","import { createError } from '@elementor/utils';\n\nexport const GlobalClassNotFoundError = createError< { styleId: string } >( {\n\tcode: 'global_class_not_found',\n\tmessage: 'Global class not found.',\n} );\n\nexport const GlobalClassLabelAlreadyExistsError = createError< { label: string } >( {\n\tcode: 'global_class_label_already_exists',\n\tmessage: 'Class with this name already exists.',\n} );\n","import { __dispatch as dispatch, __getState as getState } from '@elementor/store';\n\nimport { apiClient, type UpdateContext } from './api';\nimport { type GlobalClassesState, slice } from './store';\n\ntype Options = {\n\tcontext: UpdateContext;\n};\n\nexport async function saveGlobalClasses( { context }: Options ) {\n\tconst state: GlobalClassesState = getState().globalClasses;\n\n\tconst data = {\n\t\titems: state.items,\n\t\torder: state.order,\n\t};\n\n\tif ( context === 'preview' ) {\n\t\tawait apiClient.saveDraft( data );\n\n\t\treturn;\n\t}\n\n\tawait apiClient.publish( data );\n\n\tdispatch( slice.actions.setPristine() );\n}\n","import { type StyleDefinition, type StyleDefinitionsMap } from '@elementor/editor-styles';\nimport { type HttpResponse, httpService } from '@elementor/http';\n\nimport { type GlobalClassesState } from './store';\n\nconst RESOURCE_URL = '/global-classes';\n\nexport type GlobalClassesGetAllResponse = HttpResponse< StyleDefinitionsMap, { order: StyleDefinition[ 'id' ][] } >;\n\ntype UpdatePayload = Pick< GlobalClassesState, 'items' | 'order' >;\n\nexport type UpdateContext = 'preview' | 'frontend';\n\nexport const apiClient = {\n\tall: () =>\n\t\thttpService().get< GlobalClassesGetAllResponse >( 'elementor/v1' + RESOURCE_URL, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'preview' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n\n\tpublish: ( payload: UpdatePayload ) =>\n\t\thttpService().put( 'elementor/v1' + RESOURCE_URL, payload, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'frontend' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n\n\tsaveDraft: ( payload: UpdatePayload ) =>\n\t\thttpService().put( 'elementor/v1' + RESOURCE_URL, payload, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'preview' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n};\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { useSuppressedMessage } from '@elementor/editor-current-user';\nimport { IntroductionModal } from '@elementor/editor-ui';\nimport { Box, Image, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nconst MESSAGE_KEY = 'global-class-manager';\n\nexport const ClassManagerIntroduction = () => {\n\tconst [ isMessageSuppressed, suppressMessage ] = useSuppressedMessage( MESSAGE_KEY );\n\tconst [ shouldShowIntroduction, setShouldShowIntroduction ] = useState( ! isMessageSuppressed );\n\n\treturn (\n\t\t<IntroductionModal\n\t\t\topen={ shouldShowIntroduction }\n\t\t\ttitle={ __( 'CSS Class manager', 'elementor' ) }\n\t\t\tcontent={ <IntroductionContent /> }\n\t\t\thandleClose={ ( shouldShowAgain ) => {\n\t\t\t\tif ( ! shouldShowAgain ) {\n\t\t\t\t\tsuppressMessage();\n\t\t\t\t}\n\n\t\t\t\tsetShouldShowIntroduction( false );\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst IntroductionContent = () => {\n\treturn (\n\t\t<Stack gap={ 1.5 } padding={ 3 }>\n\t\t\t<Image\n\t\t\t\tsx={ { width: '100%', height: '312px' } }\n\t\t\t\tsrc=\"https://assets.elementor.com/packages/v1/images/class-manager-intro.svg\"\n\t\t\t\talt=\"\"\n\t\t\t/>\n\t\t\t<Box>\n\t\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t\"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.\",\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</Typography>\n\t\t\t\t<br />\n\t\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</Typography>\n\t\t\t</Box>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { ColorSwatchIcon } from '@elementor/icons';\nimport { type SvgIconProps } from '@elementor/ui';\n\nexport const FlippedColorSwatchIcon = ( { sx, ...props }: SvgIconProps ) => (\n\t<ColorSwatchIcon sx={ { transform: 'rotate(90deg)', ...sx } } { ...props } />\n);\n","import * as React from 'react';\nimport { type StyleDefinitionID } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { EditableField, EllipsisWithTooltip, useEditable } from '@elementor/editor-ui';\nimport { DotsVerticalIcon } from '@elementor/icons';\nimport {\n\tbindMenu,\n\tbindTrigger,\n\tBox,\n\tIconButton,\n\tList,\n\tListItemButton,\n\ttype ListItemButtonProps,\n\tListItemText,\n\tMenu,\n\tMenuItem,\n\tStack,\n\tstyled,\n\ttype Theme,\n\tTooltip,\n\tTypography,\n\ttype TypographyProps,\n\tusePopupState,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\nimport { useClassesOrder } from '../../hooks/use-classes-order';\nimport { useOrderedClasses } from '../../hooks/use-ordered-classes';\nimport { DeleteConfirmationProvider, useDeleteConfirmation } from './delete-confirmation-dialog';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { SortableItem, SortableProvider, SortableTrigger, type SortableTriggerProps } from './sortable';\n\nexport const GlobalClassesList = ( { disabled }: { disabled?: boolean } ) => {\n\tconst cssClasses = useOrderedClasses();\n\n\tconst [ classesOrder, reorderClasses ] = useReorder();\n\n\tif ( ! cssClasses?.length ) {\n\t\treturn <EmptyState />;\n\t}\n\n\treturn (\n\t\t<DeleteConfirmationProvider>\n\t\t\t<List sx={ { display: 'flex', flexDirection: 'column', gap: 0.5 } }>\n\t\t\t\t<SortableProvider value={ classesOrder } onChange={ reorderClasses }>\n\t\t\t\t\t{ cssClasses?.map( ( { id, label } ) => {\n\t\t\t\t\t\tconst renameClass = ( newLabel: string ) => {\n\t\t\t\t\t\t\tglobalClassesStylesProvider.actions.update( { label: newLabel, id } );\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<SortableItem key={ id } id={ id }>\n\t\t\t\t\t\t\t\t{ ( { isDragged, isDragPlaceholder, triggerProps, triggerStyle } ) => (\n\t\t\t\t\t\t\t\t\t<ClassItem\n\t\t\t\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\t\t\trenameClass={ renameClass }\n\t\t\t\t\t\t\t\t\t\tselected={ isDragged }\n\t\t\t\t\t\t\t\t\t\tdisabled={ disabled || isDragPlaceholder }\n\t\t\t\t\t\t\t\t\t\tsortableTriggerProps={ { ...triggerProps, style: triggerStyle } }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</SortableItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</SortableProvider>\n\t\t\t</List>\n\t\t</DeleteConfirmationProvider>\n\t);\n};\n\nconst useReorder = () => {\n\tconst order = useClassesOrder();\n\n\tconst reorder = ( newIds: StyleDefinitionID[] ) => {\n\t\tglobalClassesStylesProvider.actions.setOrder( newIds );\n\t};\n\n\treturn [ order, reorder ] as const;\n};\n\ntype ClassItemProps = React.PropsWithChildren< {\n\tid: string;\n\tlabel: string;\n\trenameClass: ( newLabel: string ) => void;\n\tselected?: boolean;\n\tdisabled?: boolean;\n\tsortableTriggerProps: SortableTriggerProps;\n} >;\n\nconst ClassItem = ( { id, label, renameClass, selected, disabled, sortableTriggerProps }: ClassItemProps ) => {\n\tconst {\n\t\tref: editableRef,\n\t\topenEditMode,\n\t\tisEditing,\n\t\terror,\n\t\tgetProps: getEditableProps,\n\t} = useEditable( {\n\t\tvalue: label,\n\t\tonSubmit: renameClass,\n\t\tvalidation: validateLabel,\n\t} );\n\n\tconst { openDialog } = useDeleteConfirmation();\n\n\tconst popupState = usePopupState( {\n\t\tvariant: 'popover',\n\t\tdisableAutoFocus: true,\n\t} );\n\n\tconst isSelected = ( selected || popupState.isOpen ) && ! disabled;\n\n\treturn (\n\t\t<>\n\t\t\t<StyledListItemButton\n\t\t\t\tdense\n\t\t\t\tdisableGutters\n\t\t\t\tshowActions={ isSelected || isEditing }\n\t\t\t\tshape=\"rounded\"\n\t\t\t\tonDoubleClick={ openEditMode }\n\t\t\t\tselected={ isSelected }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tfocusVisibleClassName=\"visible-class-item\"\n\t\t\t>\n\t\t\t\t<SortableTrigger { ...sortableTriggerProps } />\n\t\t\t\t<Indicator isActive={ isEditing } isError={ !! error }>\n\t\t\t\t\t{ isEditing ? (\n\t\t\t\t\t\t<EditableField\n\t\t\t\t\t\t\tref={ editableRef }\n\t\t\t\t\t\t\terror={ error }\n\t\t\t\t\t\t\tas={ Typography }\n\t\t\t\t\t\t\tvariant=\"caption\"\n\t\t\t\t\t\t\t{ ...getEditableProps() }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<EllipsisWithTooltip title={ label } as={ Typography } variant=\"caption\" />\n\t\t\t\t\t) }\n\t\t\t\t</Indicator>\n\t\t\t\t<Tooltip\n\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\tclassName={ 'class-item-more-actions' }\n\t\t\t\t\ttitle={ __( 'More actions', 'elementor' ) }\n\t\t\t\t>\n\t\t\t\t\t<IconButton size=\"tiny\" { ...bindTrigger( popupState ) } aria-label=\"More actions\">\n\t\t\t\t\t\t<DotsVerticalIcon fontSize=\"tiny\" />\n\t\t\t\t\t</IconButton>\n\t\t\t\t</Tooltip>\n\t\t\t</StyledListItemButton>\n\t\t\t<Menu\n\t\t\t\t{ ...bindMenu( popupState ) }\n\t\t\t\tanchorOrigin={ {\n\t\t\t\t\tvertical: 'bottom',\n\t\t\t\t\thorizontal: 'right',\n\t\t\t\t} }\n\t\t\t\ttransformOrigin={ {\n\t\t\t\t\tvertical: 'top',\n\t\t\t\t\thorizontal: 'right',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<MenuItem\n\t\t\t\t\tsx={ { minWidth: '160px' } }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\topenEditMode();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<ListItemText primary={ __( 'Rename', 'elementor' ) } />\n\t\t\t\t</MenuItem>\n\t\t\t\t<MenuItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\topenDialog( { id, label } );\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<ListItemText primary={ __( 'Delete', 'elementor' ) } sx={ { color: 'error.light' } } />\n\t\t\t\t</MenuItem>\n\t\t\t</Menu>\n\t\t</>\n\t);\n};\n\n// Custom styles for sortable list item, until the component is available in the UI package.\nconst StyledListItemButton = styled( ListItemButton, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'showActions' ].includes( prop ),\n} )< ListItemButtonProps & { showActions: boolean } >(\n\t( { showActions } ) => `\n\tmin-height: 36px;\n\n\t&.visible-class-item {\n\t\tbox-shadow: none !important;\n\t}\n\n\t.class-item-more-actions, .class-item-sortable-trigger {\n\t\tvisibility: ${ showActions ? 'visible' : 'hidden' };\n\t}\n\n\t.class-item-sortable-trigger {\n\t\tvisibility: ${ showActions ? 'visible' : 'hidden' };\n\t}\n\n\t&:hover&:not(:disabled) {\n\t\t.class-item-more-actions, .class-item-sortable-trigger {\n\t\t\tvisibility: visible;\n\t\t}\n\t}\n`\n);\n\nconst EmptyState = () => (\n\t<Stack alignItems=\"center\" gap={ 1.5 } pt={ 10 } px={ 0.5 } maxWidth=\"260px\" margin=\"auto\">\n\t\t<FlippedColorSwatchIcon fontSize=\"large\" />\n\t\t<StyledHeader variant=\"subtitle2\" component=\"h2\" color=\"text.secondary\">\n\t\t\t{ __( 'There are no global classes yet.', 'elementor' ) }\n\t\t</StyledHeader>\n\t\t<Typography align=\"center\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ __(\n\t\t\t\t'CSS classes created in the editor panel will appear here. Once they are available, you can arrange their hierarchy, rename them, or delete them as needed.',\n\t\t\t\t'elementor'\n\t\t\t) }\n\t\t</Typography>\n\t</Stack>\n);\n\n// Override panel reset styles.\nconst StyledHeader = styled( Typography )< TypographyProps >( ( { theme, variant } ) => ( {\n\t'&.MuiTypography-root': {\n\t\t...( theme.typography[ variant as keyof typeof theme.typography ] as React.CSSProperties ),\n\t},\n} ) );\n\nconst Indicator = styled( Box, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'isActive', 'isError' ].includes( prop ),\n} )< { isActive: boolean; isError: boolean } >( ( { theme, isActive, isError } ) => ( {\n\tdisplay: 'flex',\n\twidth: '100%',\n\tflexGrow: 1,\n\tborderRadius: theme.spacing( 0.5 ),\n\tborder: getIndicatorBorder( { isActive, isError, theme } ),\n\tpadding: `0 ${ theme.spacing( 1 ) }`,\n\tmarginLeft: isActive ? theme.spacing( 1 ) : 0,\n\tminWidth: 0,\n} ) );\n\nconst getIndicatorBorder = ( { isActive, isError, theme }: { isActive: boolean; isError: boolean; theme: Theme } ) => {\n\tif ( isError ) {\n\t\treturn `2px solid ${ theme.palette.error.main }`;\n\t}\n\n\tif ( isActive ) {\n\t\treturn `2px solid ${ theme.palette.secondary.main }`;\n\t}\n\n\treturn 'none';\n};\n\nconst validateLabel = ( newLabel: string ) => {\n\tif ( ! stylesRepository.isLabelValid( newLabel ) ) {\n\t\treturn __( 'Format is not valid', 'elementor' );\n\t}\n\n\tif ( stylesRepository.isLabelExist( newLabel ) ) {\n\t\treturn __( 'Existing name', 'elementor' );\n\t}\n\n\treturn null;\n};\n","import { generateId } from '@elementor/editor-styles';\nimport type { StylesProvider } from '@elementor/editor-styles-repository';\nimport {\n\t__dispatch as dispatch,\n\t__getState as getState,\n\t__subscribeWithSelector as subscribeWithSelector,\n} from '@elementor/store';\nimport { __ } from '@wordpress/i18n';\n\nimport { GlobalClassLabelAlreadyExistsError } from './errors';\nimport { selectClass, selectGlobalClasses, selectOrderedClasses, slice, type StateWithGlobalClasses } from './store';\n\nconst MAX_CLASSES = 50;\n\nexport const globalClassesStylesProvider = {\n\tkey: 'global-classes',\n\tpriority: 30,\n\tlimit: MAX_CLASSES,\n\tactions: {\n\t\tget: () => selectOrderedClasses( getState() ),\n\t\tgetById: ( id ) => selectClass( getState(), id ),\n\t\tcreate: ( label ) => {\n\t\t\tconst classes = selectGlobalClasses( getState() );\n\n\t\t\tconst existingLabels = Object.values( classes ).map( ( style ) => style.label );\n\n\t\t\tif ( existingLabels.includes( label ) ) {\n\t\t\t\tthrow new GlobalClassLabelAlreadyExistsError( { context: { label } } );\n\t\t\t}\n\n\t\t\tconst existingIds = Object.keys( classes );\n\t\t\tconst id = generateId( 'g-', existingIds );\n\n\t\t\tdispatch(\n\t\t\t\tslice.actions.add( {\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'class',\n\t\t\t\t\tlabel,\n\t\t\t\t\tvariants: [],\n\t\t\t\t} )\n\t\t\t);\n\n\t\t\treturn id;\n\t\t},\n\t\tupdate: ( payload ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.update( {\n\t\t\t\t\tstyle: payload,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\tdelete: ( id ) => {\n\t\t\tdispatch( slice.actions.delete( id ) );\n\t\t},\n\t\tsetOrder: ( order ) => {\n\t\t\tdispatch( slice.actions.setOrder( order ) );\n\t\t},\n\t\tupdateProps: ( args ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.updateProps( {\n\t\t\t\t\tid: args.id,\n\t\t\t\t\tmeta: args.meta,\n\t\t\t\t\tprops: args.props,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t},\n\tsubscribe: ( cb ) => subscribeWithSelector( ( state: StateWithGlobalClasses ) => state.globalClasses, cb ),\n\tlabels: {\n\t\tsingular: __( 'Global class', 'elementor' ),\n\t\tplural: __( 'Global CSS classes', 'elementor' ),\n\t},\n} satisfies StylesProvider;\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrder } from '../store';\n\nexport const useClassesOrder = () => {\n\treturn useSelector( selectOrder );\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrderedClasses } from '../store';\n\nexport const useOrderedClasses = () => {\n\treturn useSelector( selectOrderedClasses );\n};\n","import * as React from 'react';\nimport { createContext, useContext, useState } from 'react';\nimport { type StyleDefinition } from '@elementor/editor-styles';\nimport { AlertOctagonFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\tDialogTitle,\n\tTypography,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\n\ntype DeleteConfirmationDialogProps = Pick< StyleDefinition, 'id' | 'label' >;\n\ntype DeleteConfirmationContext = {\n\topenDialog: ( props: DeleteConfirmationDialogProps ) => void;\n\tcloseDialog: () => void;\n\tdialogProps: DeleteConfirmationDialogProps | null;\n};\n\nconst context = createContext< DeleteConfirmationContext | null >( null );\n\nexport const DeleteConfirmationProvider = ( { children }: React.PropsWithChildren ) => {\n\tconst [ dialogProps, setDialogProps ] = useState< DeleteConfirmationDialogProps | null >( null );\n\n\tconst openDialog = ( props: DeleteConfirmationDialogProps ) => {\n\t\tsetDialogProps( props );\n\t};\n\n\tconst closeDialog = () => {\n\t\tsetDialogProps( null );\n\t};\n\n\treturn (\n\t\t<context.Provider value={ { openDialog, closeDialog, dialogProps } }>\n\t\t\t{ children }\n\t\t\t{ !! dialogProps && <DeleteConfirmationDialog { ...dialogProps } /> }\n\t\t</context.Provider>\n\t);\n};\n\nconst TITLE_ID = 'delete-class-dialog';\n\nconst DeleteConfirmationDialog = ( { label, id }: DeleteConfirmationDialogProps ) => {\n\tconst { closeDialog } = useDeleteConfirmation();\n\n\tconst onConfirm = () => {\n\t\tglobalClassesStylesProvider.actions.delete( id );\n\n\t\tcloseDialog();\n\t};\n\n\treturn (\n\t\t<Dialog open onClose={ closeDialog } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t\t\t<AlertOctagonFilledIcon color=\"error\" />\n\t\t\t\t{ __( 'Delete global class', 'elementor' ) }\n\t\t\t</DialogTitle>\n\t\t\t<DialogContent>\n\t\t\t\t<DialogContentText variant=\"body2\" color=\"textPrimary\">\n\t\t\t\t\t{ __( 'Deleting', 'elementor' ) }\n\t\t\t\t\t<Typography variant=\"subtitle2\" component=\"span\">\n\t\t\t\t\t\t { label } \n\t\t\t\t\t</Typography>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'will permanently remove it from your project and may affect the design across all elements using it. This action cannot be undone.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</DialogContentText>\n\t\t\t</DialogContent>\n\t\t\t<DialogActions>\n\t\t\t\t<Button color=\"secondary\" onClick={ closeDialog }>\n\t\t\t\t\t{ __( 'Cancel', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t\t<Button variant=\"contained\" color=\"error\" onClick={ onConfirm }>\n\t\t\t\t\t{ __( 'Delete', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</DialogActions>\n\t\t</Dialog>\n\t);\n};\n\nexport const useDeleteConfirmation = () => {\n\tconst contextValue = useContext( context );\n\n\tif ( ! contextValue ) {\n\t\tthrow new Error( 'useDeleteConfirmation must be used within a DeleteConfirmationProvider' );\n\t}\n\n\treturn contextValue;\n};\n","import * as React from 'react';\nimport { GripVerticalIcon } from '@elementor/icons';\nimport {\n\tBox,\n\tstyled,\n\tUnstableSortableItem,\n\ttype UnstableSortableItemProps,\n\ttype UnstableSortableItemRenderProps,\n\tUnstableSortableProvider,\n\ttype UnstableSortableProviderProps,\n} from '@elementor/ui';\n\nexport const SortableProvider = < T extends string >( props: UnstableSortableProviderProps< T > ) => (\n\t<UnstableSortableProvider restrictAxis variant=\"static\" dragPlaceholderStyle={ { opacity: '1' } } { ...props } />\n);\n\nexport type SortableTriggerProps = React.HTMLAttributes< HTMLDivElement >;\n\nexport const SortableTrigger = ( props: SortableTriggerProps ) => (\n\t<StyledSortableTrigger { ...props } role=\"button\" className=\"class-item-sortable-trigger\">\n\t\t<GripVerticalIcon fontSize=\"tiny\" />\n\t</StyledSortableTrigger>\n);\n\ntype SortableItemProps = {\n\tid: UnstableSortableItemProps[ 'id' ];\n\tchildren: ( props: Partial< UnstableSortableItemRenderProps > ) => React.ReactNode;\n};\n\nexport const SortableItem = ( { children, id, ...props }: SortableItemProps ) => {\n\treturn (\n\t\t<UnstableSortableItem\n\t\t\t{ ...props }\n\t\t\tid={ id }\n\t\t\trender={ ( {\n\t\t\t\titemProps,\n\t\t\t\tisDragged,\n\t\t\t\ttriggerProps,\n\t\t\t\titemStyle,\n\t\t\t\ttriggerStyle,\n\t\t\t\tdropIndicationStyle,\n\t\t\t\tshowDropIndication,\n\t\t\t\tisDragOverlay,\n\t\t\t\tisDragPlaceholder,\n\t\t\t}: UnstableSortableItemRenderProps ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Box\n\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\tstyle={ itemStyle }\n\t\t\t\t\t\tcomponent={ 'li' }\n\t\t\t\t\t\trole=\"listitem\"\n\t\t\t\t\t\tsx={ {\n\t\t\t\t\t\t\tbackgroundColor: isDragOverlay ? 'background.paper' : undefined,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children( {\n\t\t\t\t\t\t\titemProps,\n\t\t\t\t\t\t\tisDragged,\n\t\t\t\t\t\t\ttriggerProps,\n\t\t\t\t\t\t\titemStyle,\n\t\t\t\t\t\t\ttriggerStyle,\n\t\t\t\t\t\t\tisDragPlaceholder,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t{ showDropIndication && <SortableItemIndicator style={ dropIndicationStyle } /> }\n\t\t\t\t\t</Box>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst StyledSortableTrigger = styled( 'div' )( ( { theme } ) => ( {\n\tposition: 'absolute',\n\tleft: 0,\n\ttop: '50%',\n\ttransform: `translate( -${ theme.spacing( 1.5 ) }, -50% )`,\n\tcolor: theme.palette.action.active,\n} ) );\n\nconst SortableItemIndicator = styled( Box )`\n\twidth: 100%;\n\theight: 1px;\n\tbackground-color: ${ ( { theme } ) => theme.palette.text.primary };\n`;\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { AlertTriangleFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\ttype DialogContentTextProps,\n\ttype DialogProps,\n\tDialogTitle,\n} from '@elementor/ui';\n\nconst TITLE_ID = 'save-changes-dialog';\n\nconst SaveChangesDialog = ( { children, onClose }: Pick< DialogProps, 'children' | 'onClose' > ) => (\n\t<Dialog open onClose={ onClose } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t{ children }\n\t</Dialog>\n);\n\nconst SaveChangesDialogTitle = ( { children }: React.PropsWithChildren ) => (\n\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t<AlertTriangleFilledIcon color=\"secondary\" />\n\t\t{ children }\n\t</DialogTitle>\n);\n\nconst SaveChangesDialogContent = ( { children }: React.PropsWithChildren ) => (\n\t<DialogContent>{ children }</DialogContent>\n);\n\nconst SaveChangesDialogContentText = ( props: DialogContentTextProps ) => (\n\t<DialogContentText variant=\"body2\" color=\"textPrimary\" display=\"flex\" flexDirection=\"column\" { ...props } />\n);\n\ntype Action = {\n\tlabel: string;\n\taction: () => void | Promise< void >;\n};\n\ntype ConfirmationDialogActionsProps = {\n\tactions: {\n\t\tcancel: Action;\n\t\tconfirm: Action;\n\t};\n};\nconst SaveChangesDialogActions = ( { actions }: ConfirmationDialogActionsProps ) => {\n\tconst [ isConfirming, setIsConfirming ] = useState( false );\n\tconst { cancel, confirm } = actions;\n\n\tconst onConfirm = async () => {\n\t\tsetIsConfirming( true );\n\t\tawait confirm.action();\n\t\tsetIsConfirming( false );\n\t};\n\treturn (\n\t\t<DialogActions>\n\t\t\t<Button variant=\"text\" color=\"secondary\" onClick={ cancel.action }>\n\t\t\t\t{ cancel.label }\n\t\t\t</Button>\n\t\t\t<Button variant=\"contained\" color=\"secondary\" onClick={ onConfirm } loading={ isConfirming }>\n\t\t\t\t{ confirm.label }\n\t\t\t</Button>\n\t\t</DialogActions>\n\t);\n};\n\nSaveChangesDialog.Title = SaveChangesDialogTitle;\nSaveChangesDialog.Content = SaveChangesDialogContent;\nSaveChangesDialog.ContentText = SaveChangesDialogContentText;\nSaveChangesDialog.Actions = SaveChangesDialogActions;\n\nconst useDialog = () => {\n\tconst [ isOpen, setIsOpen ] = useState( false );\n\n\tconst open = () => setIsOpen( true );\n\tconst close = () => setIsOpen( false );\n\n\treturn { isOpen, open, close };\n};\n\nexport { SaveChangesDialog, useDialog };\n","import { useEffect } from 'react';\nimport { __useDispatch as useDispatch } from '@elementor/store';\n\nimport { apiClient } from '../api';\nimport { slice } from '../store';\n\nexport function PopulateStore() {\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tapiClient.all().then( ( res ) => {\n\t\t\tconst { data, meta } = res.data;\n\n\t\t\tdispatch( slice.actions.init( { items: data, order: meta.order } ) );\n\t\t} );\n\t}, [ dispatch ] );\n\n\treturn null;\n}\n","import { setDocumentModifiedStatus } from '@elementor/editor-documents';\nimport { registerDataHook } from '@elementor/editor-v1-adapters';\nimport { __getState as getState, __subscribeWithSelector as subscribeWithSelector } from '@elementor/store';\n\nimport { saveGlobalClasses } from './save-global-classes';\nimport { selectIsDirty } from './store';\n\nexport function syncWithDocumentSave() {\n\tconst unsubscribe = syncDirtyState();\n\n\tbindSaveAction();\n\n\treturn unsubscribe;\n}\n\nfunction syncDirtyState() {\n\treturn subscribeWithSelector( selectIsDirty, () => {\n\t\tif ( ! isDirty() ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetDocumentModifiedStatus( true );\n\t} );\n}\n\nfunction bindSaveAction() {\n\tregisterDataHook( 'after', 'document/save/save', ( args ) => {\n\t\treturn saveGlobalClasses( {\n\t\t\tcontext: args.status === 'publish' ? 'frontend' : 'preview',\n\t\t} );\n\t} );\n}\n\nfunction isDirty() {\n\treturn selectIsDirty( getState() );\n}\n","import { init } from './init';\n\ninit();\n"],"mappings":"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","names":["stylesRepository","React","useActiveDocument","IconButton","Tooltip","__","React","useState","Box","Button","IconButton","Stack","__","id","context","React","React","Box","Stack","styled","Typography","__","dispatch","getState","__","getState","id","dispatch","__","useSelector","useSelector","useSelector","useSelector","React","useState","Typography","__","useState","id","__","Typography","React","Box","id","id","Typography","__","styled","Stack","Box","React","useState","Button","Dialog","DialogActions","DialogContent","DialogContentText","DialogTitle","TITLE_ID","isDirty","Stack","__","Button","IconButton","Box","useState","useActiveDocument","Tooltip","__","IconButton","useEffect","dispatch","useEffect","setDocumentModifiedStatus","getState","subscribeWithSelector","subscribeWithSelector","setDocumentModifiedStatus","getState","stylesRepository"]}
|
|
1
|
+
{"version":3,"sources":["../src/init.ts","../src/components/class-manager/class-manager-button.tsx","../src/components/class-manager/class-manager-panel.tsx","../src/hooks/use-dirty-state.ts","../src/store.ts","../src/errors.ts","../src/save-global-classes.ts","../src/api.ts","../src/components/class-manager/class-manager-introduction.tsx","../src/components/class-manager/flipped-color-swatch-icon.tsx","../src/components/class-manager/global-classes-list.tsx","../src/global-classes-styles-provider.ts","../src/hooks/use-classes-order.ts","../src/hooks/use-ordered-classes.ts","../src/components/class-manager/delete-confirmation-dialog.tsx","../src/components/class-manager/sortable.tsx","../src/components/class-manager/save-changes-dialog.tsx","../src/components/populate-store.tsx","../src/sync-with-document-save.ts","../src/index.ts"],"sourcesContent":["import { injectIntoLogic } from '@elementor/editor';\nimport { injectIntoClassSelectorActions } from '@elementor/editor-editing-panel';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\nimport { __registerSlice as registerSlice } from '@elementor/store';\n\nimport { ClassManagerButton } from './components/class-manager/class-manager-button';\nimport { panel } from './components/class-manager/class-manager-panel';\nimport { PopulateStore } from './components/populate-store';\nimport { globalClassesStylesProvider } from './global-classes-styles-provider';\nimport { slice } from './store';\nimport { syncWithDocumentSave } from './sync-with-document-save';\n\nexport function init() {\n\tregisterSlice( slice );\n\tregisterPanel( panel );\n\n\tstylesRepository.register( globalClassesStylesProvider );\n\n\tinjectIntoLogic( {\n\t\tid: 'global-classes-populate-store',\n\t\tcomponent: PopulateStore,\n\t} );\n\n\tinjectIntoClassSelectorActions( {\n\t\tid: 'global-classes-manager-button',\n\t\tcomponent: ClassManagerButton,\n\t} );\n\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tsyncWithDocumentSave();\n\t} );\n}\n","import * as React from 'react';\nimport {\n\t__useActiveDocument as useActiveDocument,\n\t__useActiveDocumentActions as useActiveDocumentActions,\n} from '@elementor/editor-documents';\nimport { IconButton, Tooltip } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { usePanelActions } from './class-manager-panel';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { SaveChangesDialog, useDialog } from './save-changes-dialog';\n\nexport const ClassManagerButton = () => {\n\tconst document = useActiveDocument();\n\tconst { open: openPanel } = usePanelActions();\n\tconst { save: saveDocument } = useActiveDocumentActions();\n\tconst { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();\n\n\tconst handleOpenPanel = () => {\n\t\tif ( document?.isDirty ) {\n\t\t\topenSaveChangesDialog();\n\t\t\treturn;\n\t\t}\n\n\t\topenPanel();\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip title={ __( 'Class manager', 'elementor' ) } placement=\"top\">\n\t\t\t\t<IconButton onClick={ handleOpenPanel }>\n\t\t\t\t\t<FlippedColorSwatchIcon fontSize=\"tiny\" />\n\t\t\t\t</IconButton>\n\t\t\t</Tooltip>\n\t\t\t{ isSaveChangesDialogOpen && (\n\t\t\t\t<SaveChangesDialog>\n\t\t\t\t\t<SaveChangesDialog.Title>{ __( 'You have unsaved changes', 'elementor' ) }</SaveChangesDialog.Title>\n\t\t\t\t\t<SaveChangesDialog.Content>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText sx={ { mb: 2 } }>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Save your changes before moving to the class manager to ensure all updates are applied and saved.',\n\t\t\t\t\t\t\t\t'elementor'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t{ __( 'If you leave without saving, all changes will be discarded.', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t</SaveChangesDialog.Content>\n\t\t\t\t\t<SaveChangesDialog.Actions\n\t\t\t\t\t\tactions={ {\n\t\t\t\t\t\t\tcancel: {\n\t\t\t\t\t\t\t\tlabel: __( 'Keep editing', 'elementor' ),\n\t\t\t\t\t\t\t\taction: closeSaveChangesDialog,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tconfirm: {\n\t\t\t\t\t\t\t\tlabel: __( 'Save & Continue', 'elementor' ),\n\t\t\t\t\t\t\t\taction: async () => {\n\t\t\t\t\t\t\t\t\tawait saveDocument();\n\t\t\t\t\t\t\t\t\tcloseSaveChangesDialog();\n\t\t\t\t\t\t\t\t\topenPanel();\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</SaveChangesDialog>\n\t\t\t) }\n\t\t</>\n\t);\n};\n","import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport {\n\t__useActiveDocument as useActiveDocument,\n\tgetDocumentModifiedStatus,\n\tsetDocumentModifiedStatus,\n} from '@elementor/editor-documents';\nimport {\n\t__createPanel as createPanel,\n\tPanel,\n\tPanelBody,\n\tPanelFooter,\n\tPanelHeader,\n\tPanelHeaderTitle,\n} from '@elementor/editor-panels';\nimport { ThemeProvider } from '@elementor/editor-ui';\nimport { changeEditMode } from '@elementor/editor-v1-adapters';\nimport { XIcon } from '@elementor/icons';\nimport { useMutation } from '@elementor/query';\nimport { Alert, Box, Button, ErrorBoundary, IconButton, type IconButtonProps, Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { useDirtyState } from '../../hooks/use-dirty-state';\nimport { saveGlobalClasses } from '../../save-global-classes';\nimport { ClassManagerIntroduction } from './class-manager-introduction';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { GlobalClassesList } from './global-classes-list';\nimport { SaveChangesDialog, useDialog } from './save-changes-dialog';\n\nconst id = 'global-classes-manager';\n\n// We need to disable the app-bar buttons, and the elements overlays when opening the classes manager panel.\n// The buttons and overlays are enabled only in edit mode, so we're creating a custom new edit mode that\n// will force them to be disabled. We can't use the `preview` edit mode in this case since it'll force\n// the panel to be closed.\nexport const { panel, usePanelActions } = createPanel( {\n\tid,\n\tcomponent: ClassManagerPanel,\n\tallowedEditModes: [ 'edit', id ],\n\tonOpen: () => {\n\t\tchangeEditMode( id );\n\n\t\treturn getDocumentModifiedStatus();\n\t},\n\tonClose: ( documentModifiedState ) => {\n\t\tchangeEditMode( 'edit' );\n\n\t\tif ( getDocumentModifiedStatus() !== documentModifiedState ) {\n\t\t\tsetDocumentModifiedStatus( documentModifiedState );\n\t\t}\n\t},\n} );\n\nexport function ClassManagerPanel() {\n\tconst isDirty = useDirtyState();\n\n\tconst { close: closePanel } = usePanelActions();\n\tconst { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();\n\n\tconst { mutateAsync: publish, isPending: isPublishing } = usePublish();\n\n\tusePreventUnload();\n\n\treturn (\n\t\t<>\n\t\t\t<ThemeProvider>\n\t\t\t\t<ErrorBoundary fallback={ <ErrorBoundaryFallback /> }>\n\t\t\t\t\t<Panel>\n\t\t\t\t\t\t<PanelHeader>\n\t\t\t\t\t\t\t<Stack p={ 1 } pl={ 2 } width=\"100%\" direction=\"row\" alignItems=\"center\">\n\t\t\t\t\t\t\t\t<PanelHeaderTitle sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>\n\t\t\t\t\t\t\t\t\t<FlippedColorSwatchIcon fontSize=\"inherit\" />\n\t\t\t\t\t\t\t\t\t{ __( 'CSS Class manager', 'elementor' ) }\n\t\t\t\t\t\t\t\t</PanelHeaderTitle>\n\t\t\t\t\t\t\t\t<CloseButton\n\t\t\t\t\t\t\t\t\tsx={ { marginLeft: 'auto' } }\n\t\t\t\t\t\t\t\t\tonClose={ () => {\n\t\t\t\t\t\t\t\t\t\tif ( isDirty ) {\n\t\t\t\t\t\t\t\t\t\t\topenSaveChangesDialog();\n\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\tclosePanel();\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t</PanelHeader>\n\t\t\t\t\t\t<PanelBody px={ 2 }>\n\t\t\t\t\t\t\t<GlobalClassesList disabled={ isPublishing } />\n\t\t\t\t\t\t</PanelBody>\n\t\t\t\t\t\t<PanelFooter>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tfullWidth\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tcolor=\"global\"\n\t\t\t\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\t\t\t\tonClick={ publish }\n\t\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t\t\tloading={ isPublishing }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Save changes', 'elementor' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</PanelFooter>\n\t\t\t\t\t</Panel>\n\t\t\t\t</ErrorBoundary>\n\t\t\t\t<ClassManagerIntroduction />\n\t\t\t\t{ isSaveChangesDialogOpen && (\n\t\t\t\t\t<SaveChangesDialog>\n\t\t\t\t\t\t<SaveChangesDialog.Title>\n\t\t\t\t\t\t\t{ __( 'You have unsaved changes', 'elementor' ) }\n\t\t\t\t\t\t</SaveChangesDialog.Title>\n\t\t\t\t\t\t<SaveChangesDialog.Content>\n\t\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t\t{ __( 'You have unsaved changes in the Class Manager.', 'elementor' ) }\n\t\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t<SaveChangesDialog.ContentText>\n\t\t\t\t\t\t\t\t{ __( 'To avoid losing your updates, save your changes before leaving.', 'elementor' ) }\n\t\t\t\t\t\t\t</SaveChangesDialog.ContentText>\n\t\t\t\t\t\t</SaveChangesDialog.Content>\n\t\t\t\t\t\t<SaveChangesDialog.Actions\n\t\t\t\t\t\t\tactions={ {\n\t\t\t\t\t\t\t\tcancel: {\n\t\t\t\t\t\t\t\t\tlabel: __( 'Cancel', 'elementor' ),\n\t\t\t\t\t\t\t\t\taction: closeSaveChangesDialog,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\tconfirm: {\n\t\t\t\t\t\t\t\t\tlabel: __( 'Save & Continue', 'elementor' ),\n\t\t\t\t\t\t\t\t\taction: async () => {\n\t\t\t\t\t\t\t\t\t\tawait publish();\n\t\t\t\t\t\t\t\t\t\tcloseSaveChangesDialog();\n\t\t\t\t\t\t\t\t\t\tclosePanel();\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</SaveChangesDialog>\n\t\t\t\t) }\n\t\t\t</ThemeProvider>\n\t\t</>\n\t);\n}\n\nconst CloseButton = ( { onClose, ...props }: IconButtonProps & { onClose: () => void } ) => (\n\t<IconButton size=\"small\" color=\"secondary\" onClick={ onClose } aria-label=\"Close\" { ...props }>\n\t\t<XIcon fontSize=\"small\" />\n\t</IconButton>\n);\n\nconst ErrorBoundaryFallback = () => (\n\t<Box role=\"alert\" sx={ { minHeight: '100%', p: 2 } }>\n\t\t<Alert severity=\"error\" sx={ { mb: 2, maxWidth: 400, textAlign: 'center' } }>\n\t\t\t<strong>{ __( 'Something went wrong', 'elementor' ) }</strong>\n\t\t</Alert>\n\t</Box>\n);\n\nconst usePreventUnload = () => {\n\tconst isDirty = useDirtyState();\n\n\tuseEffect( () => {\n\t\tconst handleBeforeUnload = ( event: BeforeUnloadEvent ) => {\n\t\t\tif ( isDirty ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t};\n\n\t\twindow.addEventListener( 'beforeunload', handleBeforeUnload );\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener( 'beforeunload', handleBeforeUnload );\n\t\t};\n\t}, [ isDirty ] );\n};\n\nconst usePublish = () => {\n\tconst document = useActiveDocument();\n\tconst [ initialDocumentStatus ] = useState( document?.isDirty ?? false );\n\n\treturn useMutation( {\n\t\tmutationFn: () => saveGlobalClasses( { context: 'frontend' } ),\n\t\tonSuccess: () => {\n\t\t\tif ( initialDocumentStatus !== document?.isDirty ) {\n\t\t\t\tsetDocumentModifiedStatus( initialDocumentStatus );\n\t\t\t}\n\t\t},\n\t} );\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectIsDirty } from '../store';\n\nexport const useDirtyState = () => {\n\treturn useSelector( selectIsDirty );\n};\n","import { mergeProps, type Props } from '@elementor/editor-props';\nimport {\n\tgetVariantByMeta,\n\ttype StyleDefinition,\n\ttype StyleDefinitionID,\n\ttype StyleDefinitionVariant,\n} from '@elementor/editor-styles';\nimport { type UpdateActionPayload } from '@elementor/editor-styles-repository';\nimport {\n\t__createSelector as createSelector,\n\t__createSlice as createSlice,\n\ttype PayloadAction,\n\ttype SliceState,\n} from '@elementor/store';\n\nimport { GlobalClassNotFoundError } from './errors';\n\nexport type GlobalClassesState = {\n\titems: Record< StyleDefinitionID, StyleDefinition >;\n\torder: StyleDefinitionID[];\n\tisDirty: boolean;\n};\n\nconst initialState: GlobalClassesState = {\n\titems: {},\n\torder: [],\n\tisDirty: false,\n};\n\nexport type StateWithGlobalClasses = SliceState< typeof slice >;\n\n// Slice\nconst SLICE_NAME = 'globalClasses';\n\nexport const slice = createSlice( {\n\tname: SLICE_NAME,\n\tinitialState,\n\treducers: {\n\t\tinit( state, { payload }: PayloadAction< Pick< GlobalClassesState, 'items' | 'order' > > ) {\n\t\t\tstate.items = payload.items;\n\t\t\tstate.order = payload.order;\n\n\t\t\tstate.isDirty = false;\n\t\t},\n\t\tadd( state, { payload }: PayloadAction< StyleDefinition > ) {\n\t\t\tstate.items[ payload.id ] = payload;\n\t\t\tstate.order.unshift( payload.id );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tdelete( state, { payload }: PayloadAction< StyleDefinitionID > ) {\n\t\t\tstate.items = Object.fromEntries( Object.entries( state.items ).filter( ( [ id ] ) => id !== payload ) );\n\n\t\t\tstate.order = state.order.filter( ( id ) => id !== payload );\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tsetOrder( state, { payload }: PayloadAction< StyleDefinitionID[] > ) {\n\t\t\tstate.order = payload;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdate( state, { payload }: PayloadAction< { style: UpdateActionPayload } > ) {\n\t\t\tconst style = state.items[ payload.style.id ];\n\n\t\t\tconst mergedData = {\n\t\t\t\t...style,\n\t\t\t\t...payload.style,\n\t\t\t};\n\n\t\t\tstate.items[ payload.style.id ] = mergedData;\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\t\tupdateProps(\n\t\t\tstate,\n\t\t\t{\n\t\t\t\tpayload,\n\t\t\t}: PayloadAction< { id: StyleDefinitionID; meta: StyleDefinitionVariant[ 'meta' ]; props: Props } >\n\t\t) {\n\t\t\tconst style = state.items[ payload.id ];\n\n\t\t\tif ( ! style ) {\n\t\t\t\tthrow new GlobalClassNotFoundError( { context: { styleId: payload.id } } );\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( style, payload.meta );\n\n\t\t\tif ( variant ) {\n\t\t\t\tvariant.props = mergeProps( variant.props, payload.props );\n\t\t\t} else {\n\t\t\t\tstyle.variants.push( { meta: payload.meta, props: payload.props } );\n\t\t\t}\n\n\t\t\tstate.isDirty = true;\n\t\t},\n\n\t\tsetPristine( state ) {\n\t\t\tstate.isDirty = false;\n\t\t},\n\t},\n} );\n\n// Selectors\nexport const selectOrder = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].order;\n\nexport const selectGlobalClasses = ( state: SliceState< typeof slice > ) => state[ SLICE_NAME ].items;\n\nexport const selectOrderedClasses = createSelector( selectGlobalClasses, selectOrder, ( items, order ) =>\n\torder.map( ( id ) => items[ id ] )\n);\n\nexport const selectClass = ( state: SliceState< typeof slice >, id: StyleDefinitionID ) =>\n\tstate[ SLICE_NAME ].items[ id ] ?? null;\n\nexport const selectIsDirty = ( state: SliceState< typeof slice > ) => state.globalClasses.isDirty;\n","import { createError } from '@elementor/utils';\n\nexport const GlobalClassNotFoundError = createError< { styleId: string } >( {\n\tcode: 'global_class_not_found',\n\tmessage: 'Global class not found.',\n} );\n\nexport const GlobalClassLabelAlreadyExistsError = createError< { label: string } >( {\n\tcode: 'global_class_label_already_exists',\n\tmessage: 'Class with this name already exists.',\n} );\n","import { __dispatch as dispatch, __getState as getState } from '@elementor/store';\n\nimport { apiClient, type UpdateContext } from './api';\nimport { type GlobalClassesState, slice } from './store';\n\ntype Options = {\n\tcontext: UpdateContext;\n};\n\nexport async function saveGlobalClasses( { context }: Options ) {\n\tconst state: GlobalClassesState = getState().globalClasses;\n\n\tconst data = {\n\t\titems: state.items,\n\t\torder: state.order,\n\t};\n\n\tif ( context === 'preview' ) {\n\t\tawait apiClient.saveDraft( data );\n\n\t\treturn;\n\t}\n\n\tawait apiClient.publish( data );\n\n\tdispatch( slice.actions.setPristine() );\n}\n","import { type StyleDefinition, type StyleDefinitionsMap } from '@elementor/editor-styles';\nimport { type HttpResponse, httpService } from '@elementor/http';\n\nimport { type GlobalClassesState } from './store';\n\nconst RESOURCE_URL = '/global-classes';\n\nexport type GlobalClassesGetAllResponse = HttpResponse< StyleDefinitionsMap, { order: StyleDefinition[ 'id' ][] } >;\n\ntype UpdatePayload = Pick< GlobalClassesState, 'items' | 'order' >;\n\nexport type UpdateContext = 'preview' | 'frontend';\n\nexport const apiClient = {\n\tall: () =>\n\t\thttpService().get< GlobalClassesGetAllResponse >( 'elementor/v1' + RESOURCE_URL, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'preview' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n\n\tpublish: ( payload: UpdatePayload ) =>\n\t\thttpService().put( 'elementor/v1' + RESOURCE_URL, payload, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'frontend' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n\n\tsaveDraft: ( payload: UpdatePayload ) =>\n\t\thttpService().put( 'elementor/v1' + RESOURCE_URL, payload, {\n\t\t\tparams: {\n\t\t\t\tcontext: 'preview' satisfies UpdateContext,\n\t\t\t},\n\t\t} ),\n};\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { useSuppressedMessage } from '@elementor/editor-current-user';\nimport { IntroductionModal } from '@elementor/editor-ui';\nimport { Box, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nconst MESSAGE_KEY = 'global-class-manager';\n\nexport const ClassManagerIntroduction = () => {\n\tconst [ isMessageSuppressed, suppressMessage ] = useSuppressedMessage( MESSAGE_KEY );\n\tconst [ shouldShowIntroduction, setShouldShowIntroduction ] = useState( ! isMessageSuppressed );\n\n\treturn (\n\t\t<IntroductionModal\n\t\t\topen={ shouldShowIntroduction }\n\t\t\ttitle={ __( 'CSS Class manager', 'elementor' ) }\n\t\t\timage={ {\n\t\t\t\tsrc: 'https://assets.elementor.com/packages/v1/images/class-manager-intro.svg',\n\t\t\t\talt: __( 'Class manager screenshot', 'elementor' ),\n\t\t\t} }\n\t\t\tcontent={ <IntroductionContent /> }\n\t\t\thandleClose={ ( shouldShowAgain ) => {\n\t\t\t\tif ( ! shouldShowAgain ) {\n\t\t\t\t\tsuppressMessage();\n\t\t\t\t}\n\n\t\t\t\tsetShouldShowIntroduction( false );\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst IntroductionContent = () => {\n\treturn (\n\t\t<Box padding={ 3 }>\n\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t{ __(\n\t\t\t\t\t\"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.\",\n\t\t\t\t\t'elementor'\n\t\t\t\t) }\n\t\t\t</Typography>\n\t\t\t<br />\n\t\t\t<Typography variant={ 'body2' }>\n\t\t\t\t{ __(\n\t\t\t\t\t'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',\n\t\t\t\t\t'elementor'\n\t\t\t\t) }\n\t\t\t</Typography>\n\t\t</Box>\n\t);\n};\n","import * as React from 'react';\nimport { ColorSwatchIcon } from '@elementor/icons';\nimport { type SvgIconProps } from '@elementor/ui';\n\nexport const FlippedColorSwatchIcon = ( { sx, ...props }: SvgIconProps ) => (\n\t<ColorSwatchIcon sx={ { transform: 'rotate(90deg)', ...sx } } { ...props } />\n);\n","import * as React from 'react';\nimport { type StyleDefinitionID } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { EditableField, EllipsisWithTooltip, MenuListItem, useEditable } from '@elementor/editor-ui';\nimport { DotsVerticalIcon } from '@elementor/icons';\nimport {\n\tbindMenu,\n\tbindTrigger,\n\tBox,\n\tIconButton,\n\tList,\n\tListItemButton,\n\ttype ListItemButtonProps,\n\tMenu,\n\tStack,\n\tstyled,\n\ttype Theme,\n\tTooltip,\n\tTypography,\n\ttype TypographyProps,\n\tusePopupState,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\nimport { useClassesOrder } from '../../hooks/use-classes-order';\nimport { useOrderedClasses } from '../../hooks/use-ordered-classes';\nimport { DeleteConfirmationProvider, useDeleteConfirmation } from './delete-confirmation-dialog';\nimport { FlippedColorSwatchIcon } from './flipped-color-swatch-icon';\nimport { SortableItem, SortableProvider, SortableTrigger, type SortableTriggerProps } from './sortable';\n\nexport const GlobalClassesList = ( { disabled }: { disabled?: boolean } ) => {\n\tconst cssClasses = useOrderedClasses();\n\n\tconst [ classesOrder, reorderClasses ] = useReorder();\n\n\tif ( ! cssClasses?.length ) {\n\t\treturn <EmptyState />;\n\t}\n\n\treturn (\n\t\t<DeleteConfirmationProvider>\n\t\t\t<List sx={ { display: 'flex', flexDirection: 'column', gap: 0.5 } }>\n\t\t\t\t<SortableProvider value={ classesOrder } onChange={ reorderClasses }>\n\t\t\t\t\t{ cssClasses?.map( ( { id, label } ) => {\n\t\t\t\t\t\tconst renameClass = ( newLabel: string ) => {\n\t\t\t\t\t\t\tglobalClassesStylesProvider.actions.update( { label: newLabel, id } );\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<SortableItem key={ id } id={ id }>\n\t\t\t\t\t\t\t\t{ ( { isDragged, isDragPlaceholder, triggerProps, triggerStyle } ) => (\n\t\t\t\t\t\t\t\t\t<ClassItem\n\t\t\t\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\t\t\trenameClass={ renameClass }\n\t\t\t\t\t\t\t\t\t\tselected={ isDragged }\n\t\t\t\t\t\t\t\t\t\tdisabled={ disabled || isDragPlaceholder }\n\t\t\t\t\t\t\t\t\t\tsortableTriggerProps={ { ...triggerProps, style: triggerStyle } }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</SortableItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</SortableProvider>\n\t\t\t</List>\n\t\t</DeleteConfirmationProvider>\n\t);\n};\n\nconst useReorder = () => {\n\tconst order = useClassesOrder();\n\n\tconst reorder = ( newIds: StyleDefinitionID[] ) => {\n\t\tglobalClassesStylesProvider.actions.setOrder( newIds );\n\t};\n\n\treturn [ order, reorder ] as const;\n};\n\ntype ClassItemProps = React.PropsWithChildren< {\n\tid: string;\n\tlabel: string;\n\trenameClass: ( newLabel: string ) => void;\n\tselected?: boolean;\n\tdisabled?: boolean;\n\tsortableTriggerProps: SortableTriggerProps;\n} >;\n\nconst ClassItem = ( { id, label, renameClass, selected, disabled, sortableTriggerProps }: ClassItemProps ) => {\n\tconst {\n\t\tref: editableRef,\n\t\topenEditMode,\n\t\tisEditing,\n\t\terror,\n\t\tgetProps: getEditableProps,\n\t} = useEditable( {\n\t\tvalue: label,\n\t\tonSubmit: renameClass,\n\t\tvalidation: validateLabel,\n\t} );\n\n\tconst { openDialog } = useDeleteConfirmation();\n\n\tconst popupState = usePopupState( {\n\t\tvariant: 'popover',\n\t\tdisableAutoFocus: true,\n\t} );\n\n\tconst isSelected = ( selected || popupState.isOpen ) && ! disabled;\n\n\treturn (\n\t\t<>\n\t\t\t<StyledListItemButton\n\t\t\t\tdense\n\t\t\t\tdisableGutters\n\t\t\t\tshowActions={ isSelected || isEditing }\n\t\t\t\tshape=\"rounded\"\n\t\t\t\tonDoubleClick={ openEditMode }\n\t\t\t\tselected={ isSelected }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tfocusVisibleClassName=\"visible-class-item\"\n\t\t\t>\n\t\t\t\t<SortableTrigger { ...sortableTriggerProps } />\n\t\t\t\t<Indicator isActive={ isEditing } isError={ !! error }>\n\t\t\t\t\t{ isEditing ? (\n\t\t\t\t\t\t<EditableField\n\t\t\t\t\t\t\tref={ editableRef }\n\t\t\t\t\t\t\terror={ error }\n\t\t\t\t\t\t\tas={ Typography }\n\t\t\t\t\t\t\tvariant=\"caption\"\n\t\t\t\t\t\t\t{ ...getEditableProps() }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<EllipsisWithTooltip title={ label } as={ Typography } variant=\"caption\" />\n\t\t\t\t\t) }\n\t\t\t\t</Indicator>\n\t\t\t\t<Tooltip\n\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\tclassName={ 'class-item-more-actions' }\n\t\t\t\t\ttitle={ __( 'More actions', 'elementor' ) }\n\t\t\t\t>\n\t\t\t\t\t<IconButton size=\"tiny\" { ...bindTrigger( popupState ) } aria-label=\"More actions\">\n\t\t\t\t\t\t<DotsVerticalIcon fontSize=\"tiny\" />\n\t\t\t\t\t</IconButton>\n\t\t\t\t</Tooltip>\n\t\t\t</StyledListItemButton>\n\t\t\t<Menu\n\t\t\t\t{ ...bindMenu( popupState ) }\n\t\t\t\tanchorOrigin={ {\n\t\t\t\t\tvertical: 'bottom',\n\t\t\t\t\thorizontal: 'right',\n\t\t\t\t} }\n\t\t\t\ttransformOrigin={ {\n\t\t\t\t\tvertical: 'top',\n\t\t\t\t\thorizontal: 'right',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<MenuListItem\n\t\t\t\t\tsx={ { minWidth: '160px' } }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\topenEditMode();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<Typography variant=\"caption\" sx={ { color: 'text.primary' } }>\n\t\t\t\t\t\t{ __( 'Rename', 'elementor' ) }\n\t\t\t\t\t</Typography>\n\t\t\t\t</MenuListItem>\n\t\t\t\t<MenuListItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tpopupState.close();\n\t\t\t\t\t\topenDialog( { id, label } );\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<Typography variant=\"caption\" sx={ { color: 'error.light' } }>\n\t\t\t\t\t\t{ __( 'Delete', 'elementor' ) }\n\t\t\t\t\t</Typography>\n\t\t\t\t</MenuListItem>\n\t\t\t</Menu>\n\t\t</>\n\t);\n};\n\n// Custom styles for sortable list item, until the component is available in the UI package.\nconst StyledListItemButton = styled( ListItemButton, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'showActions' ].includes( prop ),\n} )< ListItemButtonProps & { showActions: boolean } >(\n\t( { showActions } ) => `\n\tmin-height: 36px;\n\n\t&.visible-class-item {\n\t\tbox-shadow: none !important;\n\t}\n\n\t.class-item-more-actions, .class-item-sortable-trigger {\n\t\tvisibility: ${ showActions ? 'visible' : 'hidden' };\n\t}\n\n\t.class-item-sortable-trigger {\n\t\tvisibility: ${ showActions ? 'visible' : 'hidden' };\n\t}\n\n\t&:hover&:not(:disabled) {\n\t\t.class-item-more-actions, .class-item-sortable-trigger {\n\t\t\tvisibility: visible;\n\t\t}\n\t}\n`\n);\n\nconst EmptyState = () => (\n\t<Stack alignItems=\"center\" gap={ 1.5 } pt={ 10 } px={ 0.5 } maxWidth=\"260px\" margin=\"auto\">\n\t\t<FlippedColorSwatchIcon fontSize=\"large\" />\n\t\t<StyledHeader variant=\"subtitle2\" component=\"h2\" color=\"text.secondary\">\n\t\t\t{ __( 'There are no global classes yet.', 'elementor' ) }\n\t\t</StyledHeader>\n\t\t<Typography align=\"center\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ __(\n\t\t\t\t'CSS classes created in the editor panel will appear here. Once they are available, you can arrange their hierarchy, rename them, or delete them as needed.',\n\t\t\t\t'elementor'\n\t\t\t) }\n\t\t</Typography>\n\t</Stack>\n);\n\n// Override panel reset styles.\nconst StyledHeader = styled( Typography )< TypographyProps >( ( { theme, variant } ) => ( {\n\t'&.MuiTypography-root': {\n\t\t...( theme.typography[ variant as keyof typeof theme.typography ] as React.CSSProperties ),\n\t},\n} ) );\n\nconst Indicator = styled( Box, {\n\tshouldForwardProp: ( prop: string ) => ! [ 'isActive', 'isError' ].includes( prop ),\n} )< { isActive: boolean; isError: boolean } >( ( { theme, isActive, isError } ) => ( {\n\tdisplay: 'flex',\n\twidth: '100%',\n\tflexGrow: 1,\n\tborderRadius: theme.spacing( 0.5 ),\n\tborder: getIndicatorBorder( { isActive, isError, theme } ),\n\tpadding: `0 ${ theme.spacing( 1 ) }`,\n\tmarginLeft: isActive ? theme.spacing( 1 ) : 0,\n\tminWidth: 0,\n} ) );\n\nconst getIndicatorBorder = ( { isActive, isError, theme }: { isActive: boolean; isError: boolean; theme: Theme } ) => {\n\tif ( isError ) {\n\t\treturn `2px solid ${ theme.palette.error.main }`;\n\t}\n\n\tif ( isActive ) {\n\t\treturn `2px solid ${ theme.palette.secondary.main }`;\n\t}\n\n\treturn 'none';\n};\n\nconst validateLabel = ( newLabel: string ) => {\n\tif ( ! stylesRepository.isLabelValid( newLabel ) ) {\n\t\treturn __( 'Format is not valid', 'elementor' );\n\t}\n\n\tif ( stylesRepository.isLabelExist( newLabel ) ) {\n\t\treturn __( 'Existing name', 'elementor' );\n\t}\n\n\treturn null;\n};\n","import { generateId } from '@elementor/editor-styles';\nimport type { StylesProvider } from '@elementor/editor-styles-repository';\nimport {\n\t__dispatch as dispatch,\n\t__getState as getState,\n\t__subscribeWithSelector as subscribeWithSelector,\n} from '@elementor/store';\nimport { __ } from '@wordpress/i18n';\n\nimport { GlobalClassLabelAlreadyExistsError } from './errors';\nimport { selectClass, selectGlobalClasses, selectOrderedClasses, slice, type StateWithGlobalClasses } from './store';\n\nconst MAX_CLASSES = 50;\n\nexport const globalClassesStylesProvider = {\n\tkey: 'global-classes',\n\tpriority: 30,\n\tlimit: MAX_CLASSES,\n\tactions: {\n\t\tget: () => selectOrderedClasses( getState() ),\n\t\tgetById: ( id ) => selectClass( getState(), id ),\n\t\tcreate: ( label ) => {\n\t\t\tconst classes = selectGlobalClasses( getState() );\n\n\t\t\tconst existingLabels = Object.values( classes ).map( ( style ) => style.label );\n\n\t\t\tif ( existingLabels.includes( label ) ) {\n\t\t\t\tthrow new GlobalClassLabelAlreadyExistsError( { context: { label } } );\n\t\t\t}\n\n\t\t\tconst existingIds = Object.keys( classes );\n\t\t\tconst id = generateId( 'g-', existingIds );\n\n\t\t\tdispatch(\n\t\t\t\tslice.actions.add( {\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'class',\n\t\t\t\t\tlabel,\n\t\t\t\t\tvariants: [],\n\t\t\t\t} )\n\t\t\t);\n\n\t\t\treturn id;\n\t\t},\n\t\tupdate: ( payload ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.update( {\n\t\t\t\t\tstyle: payload,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\tdelete: ( id ) => {\n\t\t\tdispatch( slice.actions.delete( id ) );\n\t\t},\n\t\tsetOrder: ( order ) => {\n\t\t\tdispatch( slice.actions.setOrder( order ) );\n\t\t},\n\t\tupdateProps: ( args ) => {\n\t\t\tdispatch(\n\t\t\t\tslice.actions.updateProps( {\n\t\t\t\t\tid: args.id,\n\t\t\t\t\tmeta: args.meta,\n\t\t\t\t\tprops: args.props,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t},\n\tsubscribe: ( cb ) => subscribeWithSelector( ( state: StateWithGlobalClasses ) => state.globalClasses, cb ),\n\tlabels: {\n\t\tsingular: __( 'Global class', 'elementor' ),\n\t\tplural: __( 'Global CSS classes', 'elementor' ),\n\t},\n} satisfies StylesProvider;\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrder } from '../store';\n\nexport const useClassesOrder = () => {\n\treturn useSelector( selectOrder );\n};\n","import { __useSelector as useSelector } from '@elementor/store';\n\nimport { selectOrderedClasses } from '../store';\n\nexport const useOrderedClasses = () => {\n\treturn useSelector( selectOrderedClasses );\n};\n","import * as React from 'react';\nimport { createContext, useContext, useState } from 'react';\nimport { type StyleDefinition } from '@elementor/editor-styles';\nimport { AlertOctagonFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\tDialogTitle,\n\tTypography,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nimport { globalClassesStylesProvider } from '../../global-classes-styles-provider';\n\ntype DeleteConfirmationDialogProps = Pick< StyleDefinition, 'id' | 'label' >;\n\ntype DeleteConfirmationContext = {\n\topenDialog: ( props: DeleteConfirmationDialogProps ) => void;\n\tcloseDialog: () => void;\n\tdialogProps: DeleteConfirmationDialogProps | null;\n};\n\nconst context = createContext< DeleteConfirmationContext | null >( null );\n\nexport const DeleteConfirmationProvider = ( { children }: React.PropsWithChildren ) => {\n\tconst [ dialogProps, setDialogProps ] = useState< DeleteConfirmationDialogProps | null >( null );\n\n\tconst openDialog = ( props: DeleteConfirmationDialogProps ) => {\n\t\tsetDialogProps( props );\n\t};\n\n\tconst closeDialog = () => {\n\t\tsetDialogProps( null );\n\t};\n\n\treturn (\n\t\t<context.Provider value={ { openDialog, closeDialog, dialogProps } }>\n\t\t\t{ children }\n\t\t\t{ !! dialogProps && <DeleteConfirmationDialog { ...dialogProps } /> }\n\t\t</context.Provider>\n\t);\n};\n\nconst TITLE_ID = 'delete-class-dialog';\n\nconst DeleteConfirmationDialog = ( { label, id }: DeleteConfirmationDialogProps ) => {\n\tconst { closeDialog } = useDeleteConfirmation();\n\n\tconst onConfirm = () => {\n\t\tglobalClassesStylesProvider.actions.delete( id );\n\n\t\tcloseDialog();\n\t};\n\n\treturn (\n\t\t<Dialog open onClose={ closeDialog } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t\t\t<AlertOctagonFilledIcon color=\"error\" />\n\t\t\t\t{ __( 'Delete global class', 'elementor' ) }\n\t\t\t</DialogTitle>\n\t\t\t<DialogContent>\n\t\t\t\t<DialogContentText variant=\"body2\" color=\"textPrimary\">\n\t\t\t\t\t{ __( 'Deleting', 'elementor' ) }\n\t\t\t\t\t<Typography variant=\"subtitle2\" component=\"span\">\n\t\t\t\t\t\t { label } \n\t\t\t\t\t</Typography>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'will permanently remove it from your project and may affect the design across all elements using it. This action cannot be undone.',\n\t\t\t\t\t\t'elementor'\n\t\t\t\t\t) }\n\t\t\t\t</DialogContentText>\n\t\t\t</DialogContent>\n\t\t\t<DialogActions>\n\t\t\t\t<Button color=\"secondary\" onClick={ closeDialog }>\n\t\t\t\t\t{ __( 'Cancel', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t\t<Button variant=\"contained\" color=\"error\" onClick={ onConfirm }>\n\t\t\t\t\t{ __( 'Delete', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</DialogActions>\n\t\t</Dialog>\n\t);\n};\n\nexport const useDeleteConfirmation = () => {\n\tconst contextValue = useContext( context );\n\n\tif ( ! contextValue ) {\n\t\tthrow new Error( 'useDeleteConfirmation must be used within a DeleteConfirmationProvider' );\n\t}\n\n\treturn contextValue;\n};\n","import * as React from 'react';\nimport { GripVerticalIcon } from '@elementor/icons';\nimport {\n\tBox,\n\tstyled,\n\tUnstableSortableItem,\n\ttype UnstableSortableItemProps,\n\ttype UnstableSortableItemRenderProps,\n\tUnstableSortableProvider,\n\ttype UnstableSortableProviderProps,\n} from '@elementor/ui';\n\nexport const SortableProvider = < T extends string >( props: UnstableSortableProviderProps< T > ) => (\n\t<UnstableSortableProvider restrictAxis variant=\"static\" dragPlaceholderStyle={ { opacity: '1' } } { ...props } />\n);\n\nexport type SortableTriggerProps = React.HTMLAttributes< HTMLDivElement >;\n\nexport const SortableTrigger = ( props: SortableTriggerProps ) => (\n\t<StyledSortableTrigger { ...props } role=\"button\" className=\"class-item-sortable-trigger\">\n\t\t<GripVerticalIcon fontSize=\"tiny\" />\n\t</StyledSortableTrigger>\n);\n\ntype SortableItemProps = {\n\tid: UnstableSortableItemProps[ 'id' ];\n\tchildren: ( props: Partial< UnstableSortableItemRenderProps > ) => React.ReactNode;\n};\n\nexport const SortableItem = ( { children, id, ...props }: SortableItemProps ) => {\n\treturn (\n\t\t<UnstableSortableItem\n\t\t\t{ ...props }\n\t\t\tid={ id }\n\t\t\trender={ ( {\n\t\t\t\titemProps,\n\t\t\t\tisDragged,\n\t\t\t\ttriggerProps,\n\t\t\t\titemStyle,\n\t\t\t\ttriggerStyle,\n\t\t\t\tdropIndicationStyle,\n\t\t\t\tshowDropIndication,\n\t\t\t\tisDragOverlay,\n\t\t\t\tisDragPlaceholder,\n\t\t\t}: UnstableSortableItemRenderProps ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Box\n\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\tstyle={ itemStyle }\n\t\t\t\t\t\tcomponent={ 'li' }\n\t\t\t\t\t\trole=\"listitem\"\n\t\t\t\t\t\tsx={ {\n\t\t\t\t\t\t\tbackgroundColor: isDragOverlay ? 'background.paper' : undefined,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children( {\n\t\t\t\t\t\t\titemProps,\n\t\t\t\t\t\t\tisDragged,\n\t\t\t\t\t\t\ttriggerProps,\n\t\t\t\t\t\t\titemStyle,\n\t\t\t\t\t\t\ttriggerStyle,\n\t\t\t\t\t\t\tisDragPlaceholder,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t{ showDropIndication && <SortableItemIndicator style={ dropIndicationStyle } /> }\n\t\t\t\t\t</Box>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n};\n\nconst StyledSortableTrigger = styled( 'div' )( ( { theme } ) => ( {\n\tposition: 'absolute',\n\tleft: 0,\n\ttop: '50%',\n\ttransform: `translate( -${ theme.spacing( 1.5 ) }, -50% )`,\n\tcolor: theme.palette.action.active,\n} ) );\n\nconst SortableItemIndicator = styled( Box )`\n\twidth: 100%;\n\theight: 1px;\n\tbackground-color: ${ ( { theme } ) => theme.palette.text.primary };\n`;\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { AlertTriangleFilledIcon } from '@elementor/icons';\nimport {\n\tButton,\n\tDialog,\n\tDialogActions,\n\tDialogContent,\n\tDialogContentText,\n\ttype DialogContentTextProps,\n\ttype DialogProps,\n\tDialogTitle,\n} from '@elementor/ui';\n\nconst TITLE_ID = 'save-changes-dialog';\n\nconst SaveChangesDialog = ( { children, onClose }: Pick< DialogProps, 'children' | 'onClose' > ) => (\n\t<Dialog open onClose={ onClose } aria-labelledby={ TITLE_ID } maxWidth=\"xs\">\n\t\t{ children }\n\t</Dialog>\n);\n\nconst SaveChangesDialogTitle = ( { children }: React.PropsWithChildren ) => (\n\t<DialogTitle id={ TITLE_ID } display=\"flex\" alignItems=\"center\" gap={ 1 } sx={ { lineHeight: 1 } }>\n\t\t<AlertTriangleFilledIcon color=\"secondary\" />\n\t\t{ children }\n\t</DialogTitle>\n);\n\nconst SaveChangesDialogContent = ( { children }: React.PropsWithChildren ) => (\n\t<DialogContent>{ children }</DialogContent>\n);\n\nconst SaveChangesDialogContentText = ( props: DialogContentTextProps ) => (\n\t<DialogContentText variant=\"body2\" color=\"textPrimary\" display=\"flex\" flexDirection=\"column\" { ...props } />\n);\n\ntype Action = {\n\tlabel: string;\n\taction: () => void | Promise< void >;\n};\n\ntype ConfirmationDialogActionsProps = {\n\tactions: {\n\t\tcancel: Action;\n\t\tconfirm: Action;\n\t};\n};\nconst SaveChangesDialogActions = ( { actions }: ConfirmationDialogActionsProps ) => {\n\tconst [ isConfirming, setIsConfirming ] = useState( false );\n\tconst { cancel, confirm } = actions;\n\n\tconst onConfirm = async () => {\n\t\tsetIsConfirming( true );\n\t\tawait confirm.action();\n\t\tsetIsConfirming( false );\n\t};\n\treturn (\n\t\t<DialogActions>\n\t\t\t<Button variant=\"text\" color=\"secondary\" onClick={ cancel.action }>\n\t\t\t\t{ cancel.label }\n\t\t\t</Button>\n\t\t\t<Button variant=\"contained\" color=\"secondary\" onClick={ onConfirm } loading={ isConfirming }>\n\t\t\t\t{ confirm.label }\n\t\t\t</Button>\n\t\t</DialogActions>\n\t);\n};\n\nSaveChangesDialog.Title = SaveChangesDialogTitle;\nSaveChangesDialog.Content = SaveChangesDialogContent;\nSaveChangesDialog.ContentText = SaveChangesDialogContentText;\nSaveChangesDialog.Actions = SaveChangesDialogActions;\n\nconst useDialog = () => {\n\tconst [ isOpen, setIsOpen ] = useState( false );\n\n\tconst open = () => setIsOpen( true );\n\tconst close = () => setIsOpen( false );\n\n\treturn { isOpen, open, close };\n};\n\nexport { SaveChangesDialog, useDialog };\n","import { useEffect } from 'react';\nimport { __useDispatch as useDispatch } from '@elementor/store';\n\nimport { apiClient } from '../api';\nimport { slice } from '../store';\n\nexport function PopulateStore() {\n\tconst dispatch = useDispatch();\n\n\tuseEffect( () => {\n\t\tapiClient.all().then( ( res ) => {\n\t\t\tconst { data, meta } = res.data;\n\n\t\t\tdispatch( slice.actions.init( { items: data, order: meta.order } ) );\n\t\t} );\n\t}, [ dispatch ] );\n\n\treturn null;\n}\n","import { setDocumentModifiedStatus } from '@elementor/editor-documents';\nimport { registerDataHook } from '@elementor/editor-v1-adapters';\nimport { __getState as getState, __subscribeWithSelector as subscribeWithSelector } from '@elementor/store';\n\nimport { saveGlobalClasses } from './save-global-classes';\nimport { selectIsDirty } from './store';\n\nexport function syncWithDocumentSave() {\n\tconst unsubscribe = syncDirtyState();\n\n\tbindSaveAction();\n\n\treturn unsubscribe;\n}\n\nfunction syncDirtyState() {\n\treturn subscribeWithSelector( selectIsDirty, () => {\n\t\tif ( ! isDirty() ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetDocumentModifiedStatus( true );\n\t} );\n}\n\nfunction bindSaveAction() {\n\tregisterDataHook( 'after', 'document/save/save', ( args ) => {\n\t\treturn saveGlobalClasses( {\n\t\t\tcontext: args.status === 'publish' ? 'frontend' : 'preview',\n\t\t} );\n\t} );\n}\n\nfunction isDirty() {\n\treturn selectIsDirty( getState() );\n}\n","import { init } from './init';\n\ninit();\n"],"mappings":"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","names":["stylesRepository","React","useActiveDocument","IconButton","Tooltip","__","React","useState","Box","Button","IconButton","Stack","__","id","context","React","React","Box","styled","Typography","__","dispatch","getState","__","getState","id","dispatch","__","useSelector","useSelector","useSelector","useSelector","React","useState","Typography","__","useState","id","__","Typography","React","Box","id","id","Typography","__","styled","Box","React","useState","Button","Dialog","DialogActions","DialogContent","DialogContentText","DialogTitle","TITLE_ID","isDirty","Stack","__","Button","IconButton","Box","useState","useActiveDocument","Tooltip","__","IconButton","useEffect","dispatch","useEffect","setDocumentModifiedStatus","getState","subscribeWithSelector","subscribeWithSelector","setDocumentModifiedStatus","getState","stylesRepository"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elementor/editor-global-classes",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.14.1",
|
|
4
4
|
"private": false,
|
|
5
5
|
"author": "Elementor Team",
|
|
6
6
|
"homepage": "https://elementor.com/",
|
|
@@ -39,15 +39,15 @@
|
|
|
39
39
|
"dev": "tsup --config=../../tsup.dev.ts"
|
|
40
40
|
},
|
|
41
41
|
"dependencies": {
|
|
42
|
-
"@elementor/editor": "0.18.
|
|
42
|
+
"@elementor/editor": "0.18.5",
|
|
43
43
|
"@elementor/editor-current-user": "0.3.0",
|
|
44
|
-
"@elementor/editor-documents": "0.12.
|
|
45
|
-
"@elementor/editor-editing-panel": "1.
|
|
46
|
-
"@elementor/editor-panels": "0.
|
|
44
|
+
"@elementor/editor-documents": "0.12.2",
|
|
45
|
+
"@elementor/editor-editing-panel": "1.24.0",
|
|
46
|
+
"@elementor/editor-panels": "0.14.0",
|
|
47
47
|
"@elementor/editor-props": "0.11.1",
|
|
48
48
|
"@elementor/editor-styles": "0.6.4",
|
|
49
|
-
"@elementor/editor-styles-repository": "0.8.
|
|
50
|
-
"@elementor/editor-ui": "0.
|
|
49
|
+
"@elementor/editor-styles-repository": "0.8.1",
|
|
50
|
+
"@elementor/editor-ui": "0.5.1",
|
|
51
51
|
"@elementor/editor-v1-adapters": "0.11.0",
|
|
52
52
|
"@elementor/http": "0.1.4",
|
|
53
53
|
"@elementor/icons": "1.37.0",
|
|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import { useState } from 'react';
|
|
3
3
|
import { useSuppressedMessage } from '@elementor/editor-current-user';
|
|
4
4
|
import { IntroductionModal } from '@elementor/editor-ui';
|
|
5
|
-
import { Box,
|
|
5
|
+
import { Box, Typography } from '@elementor/ui';
|
|
6
6
|
import { __ } from '@wordpress/i18n';
|
|
7
7
|
|
|
8
8
|
const MESSAGE_KEY = 'global-class-manager';
|
|
@@ -15,6 +15,10 @@ export const ClassManagerIntroduction = () => {
|
|
|
15
15
|
<IntroductionModal
|
|
16
16
|
open={ shouldShowIntroduction }
|
|
17
17
|
title={ __( 'CSS Class manager', 'elementor' ) }
|
|
18
|
+
image={ {
|
|
19
|
+
src: 'https://assets.elementor.com/packages/v1/images/class-manager-intro.svg',
|
|
20
|
+
alt: __( 'Class manager screenshot', 'elementor' ),
|
|
21
|
+
} }
|
|
18
22
|
content={ <IntroductionContent /> }
|
|
19
23
|
handleClose={ ( shouldShowAgain ) => {
|
|
20
24
|
if ( ! shouldShowAgain ) {
|
|
@@ -29,27 +33,20 @@ export const ClassManagerIntroduction = () => {
|
|
|
29
33
|
|
|
30
34
|
const IntroductionContent = () => {
|
|
31
35
|
return (
|
|
32
|
-
<
|
|
33
|
-
<
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
{ __(
|
|
48
|
-
'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',
|
|
49
|
-
'elementor'
|
|
50
|
-
) }
|
|
51
|
-
</Typography>
|
|
52
|
-
</Box>
|
|
53
|
-
</Stack>
|
|
36
|
+
<Box padding={ 3 }>
|
|
37
|
+
<Typography variant={ 'body2' }>
|
|
38
|
+
{ __(
|
|
39
|
+
"The CSS Class Manager allows you to manage and organize your site's CSS classes efficiently. You can reorder classes to adjust their priority, rename them to maintain clarity in your design system, and delete unused classes to keep your CSS structured.",
|
|
40
|
+
'elementor'
|
|
41
|
+
) }
|
|
42
|
+
</Typography>
|
|
43
|
+
<br />
|
|
44
|
+
<Typography variant={ 'body2' }>
|
|
45
|
+
{ __(
|
|
46
|
+
'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',
|
|
47
|
+
'elementor'
|
|
48
|
+
) }
|
|
49
|
+
</Typography>
|
|
50
|
+
</Box>
|
|
54
51
|
);
|
|
55
52
|
};
|
|
@@ -13,6 +13,7 @@ import {
|
|
|
13
13
|
PanelHeader,
|
|
14
14
|
PanelHeaderTitle,
|
|
15
15
|
} from '@elementor/editor-panels';
|
|
16
|
+
import { ThemeProvider } from '@elementor/editor-ui';
|
|
16
17
|
import { changeEditMode } from '@elementor/editor-v1-adapters';
|
|
17
18
|
import { XIcon } from '@elementor/icons';
|
|
18
19
|
import { useMutation } from '@elementor/query';
|
|
@@ -62,75 +63,79 @@ export function ClassManagerPanel() {
|
|
|
62
63
|
|
|
63
64
|
return (
|
|
64
65
|
<>
|
|
65
|
-
<
|
|
66
|
-
<
|
|
67
|
-
<
|
|
68
|
-
<
|
|
69
|
-
<
|
|
70
|
-
<
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
<
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
<
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
<SaveChangesDialog
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
action: async () => {
|
|
125
|
-
await publish();
|
|
126
|
-
closeSaveChangesDialog();
|
|
127
|
-
closePanel();
|
|
66
|
+
<ThemeProvider>
|
|
67
|
+
<ErrorBoundary fallback={ <ErrorBoundaryFallback /> }>
|
|
68
|
+
<Panel>
|
|
69
|
+
<PanelHeader>
|
|
70
|
+
<Stack p={ 1 } pl={ 2 } width="100%" direction="row" alignItems="center">
|
|
71
|
+
<PanelHeaderTitle sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>
|
|
72
|
+
<FlippedColorSwatchIcon fontSize="inherit" />
|
|
73
|
+
{ __( 'CSS Class manager', 'elementor' ) }
|
|
74
|
+
</PanelHeaderTitle>
|
|
75
|
+
<CloseButton
|
|
76
|
+
sx={ { marginLeft: 'auto' } }
|
|
77
|
+
onClose={ () => {
|
|
78
|
+
if ( isDirty ) {
|
|
79
|
+
openSaveChangesDialog();
|
|
80
|
+
return;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
closePanel();
|
|
84
|
+
} }
|
|
85
|
+
/>
|
|
86
|
+
</Stack>
|
|
87
|
+
</PanelHeader>
|
|
88
|
+
<PanelBody px={ 2 }>
|
|
89
|
+
<GlobalClassesList disabled={ isPublishing } />
|
|
90
|
+
</PanelBody>
|
|
91
|
+
<PanelFooter>
|
|
92
|
+
<Button
|
|
93
|
+
fullWidth
|
|
94
|
+
size="small"
|
|
95
|
+
color="global"
|
|
96
|
+
variant="contained"
|
|
97
|
+
onClick={ publish }
|
|
98
|
+
disabled={ ! isDirty }
|
|
99
|
+
loading={ isPublishing }
|
|
100
|
+
>
|
|
101
|
+
{ __( 'Save changes', 'elementor' ) }
|
|
102
|
+
</Button>
|
|
103
|
+
</PanelFooter>
|
|
104
|
+
</Panel>
|
|
105
|
+
</ErrorBoundary>
|
|
106
|
+
<ClassManagerIntroduction />
|
|
107
|
+
{ isSaveChangesDialogOpen && (
|
|
108
|
+
<SaveChangesDialog>
|
|
109
|
+
<SaveChangesDialog.Title>
|
|
110
|
+
{ __( 'You have unsaved changes', 'elementor' ) }
|
|
111
|
+
</SaveChangesDialog.Title>
|
|
112
|
+
<SaveChangesDialog.Content>
|
|
113
|
+
<SaveChangesDialog.ContentText>
|
|
114
|
+
{ __( 'You have unsaved changes in the Class Manager.', 'elementor' ) }
|
|
115
|
+
</SaveChangesDialog.ContentText>
|
|
116
|
+
<SaveChangesDialog.ContentText>
|
|
117
|
+
{ __( 'To avoid losing your updates, save your changes before leaving.', 'elementor' ) }
|
|
118
|
+
</SaveChangesDialog.ContentText>
|
|
119
|
+
</SaveChangesDialog.Content>
|
|
120
|
+
<SaveChangesDialog.Actions
|
|
121
|
+
actions={ {
|
|
122
|
+
cancel: {
|
|
123
|
+
label: __( 'Cancel', 'elementor' ),
|
|
124
|
+
action: closeSaveChangesDialog,
|
|
128
125
|
},
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
126
|
+
confirm: {
|
|
127
|
+
label: __( 'Save & Continue', 'elementor' ),
|
|
128
|
+
action: async () => {
|
|
129
|
+
await publish();
|
|
130
|
+
closeSaveChangesDialog();
|
|
131
|
+
closePanel();
|
|
132
|
+
},
|
|
133
|
+
},
|
|
134
|
+
} }
|
|
135
|
+
/>
|
|
136
|
+
</SaveChangesDialog>
|
|
137
|
+
) }
|
|
138
|
+
</ThemeProvider>
|
|
134
139
|
</>
|
|
135
140
|
);
|
|
136
141
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { type StyleDefinitionID } from '@elementor/editor-styles';
|
|
3
3
|
import { stylesRepository } from '@elementor/editor-styles-repository';
|
|
4
|
-
import { EditableField, EllipsisWithTooltip, useEditable } from '@elementor/editor-ui';
|
|
4
|
+
import { EditableField, EllipsisWithTooltip, MenuListItem, useEditable } from '@elementor/editor-ui';
|
|
5
5
|
import { DotsVerticalIcon } from '@elementor/icons';
|
|
6
6
|
import {
|
|
7
7
|
bindMenu,
|
|
@@ -11,9 +11,7 @@ import {
|
|
|
11
11
|
List,
|
|
12
12
|
ListItemButton,
|
|
13
13
|
type ListItemButtonProps,
|
|
14
|
-
ListItemText,
|
|
15
14
|
Menu,
|
|
16
|
-
MenuItem,
|
|
17
15
|
Stack,
|
|
18
16
|
styled,
|
|
19
17
|
type Theme,
|
|
@@ -158,23 +156,27 @@ const ClassItem = ( { id, label, renameClass, selected, disabled, sortableTrigge
|
|
|
158
156
|
horizontal: 'right',
|
|
159
157
|
} }
|
|
160
158
|
>
|
|
161
|
-
<
|
|
159
|
+
<MenuListItem
|
|
162
160
|
sx={ { minWidth: '160px' } }
|
|
163
161
|
onClick={ () => {
|
|
164
162
|
popupState.close();
|
|
165
163
|
openEditMode();
|
|
166
164
|
} }
|
|
167
165
|
>
|
|
168
|
-
<
|
|
169
|
-
|
|
170
|
-
|
|
166
|
+
<Typography variant="caption" sx={ { color: 'text.primary' } }>
|
|
167
|
+
{ __( 'Rename', 'elementor' ) }
|
|
168
|
+
</Typography>
|
|
169
|
+
</MenuListItem>
|
|
170
|
+
<MenuListItem
|
|
171
171
|
onClick={ () => {
|
|
172
172
|
popupState.close();
|
|
173
173
|
openDialog( { id, label } );
|
|
174
174
|
} }
|
|
175
175
|
>
|
|
176
|
-
<
|
|
177
|
-
|
|
176
|
+
<Typography variant="caption" sx={ { color: 'error.light' } }>
|
|
177
|
+
{ __( 'Delete', 'elementor' ) }
|
|
178
|
+
</Typography>
|
|
179
|
+
</MenuListItem>
|
|
178
180
|
</Menu>
|
|
179
181
|
</>
|
|
180
182
|
);
|