@elementor/editor-global-classes 0.14.0 → 0.14.1

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @elementor/editor-global-classes
 
+## 0.14.1
+
+### Patch Changes
+
+- 666ffdd: Change theme provider styles for editing panel and class manager panel
+- Updated dependencies [c262b65]
+- Updated dependencies [951d633]
+- Updated dependencies [666ffdd]
+- Updated dependencies [311ff8e]
+- Updated dependencies [67f2795]
+- Updated dependencies [7aaf98f]
+  - @elementor/editor-editing-panel@1.24.0
+  - @elementor/editor-ui@0.5.1
+  - @elementor/editor@0.18.5
+  - @elementor/editor-panels@0.14.0
+  - @elementor/editor-documents@0.12.2
+
 ## 0.14.0
 
 ### Minor Changes

package/dist/index.js

@@ -41,6 +41,7 @@ var React7 = __toESM(require("react"));
 var import_react4 = require("react");
 var import_editor_documents = require("@elementor/editor-documents");
 var import_editor_panels = require("@elementor/editor-panels");
+var import_editor_ui3 = require("@elementor/editor-ui");
 var import_editor_v1_adapters = require("@elementor/editor-v1-adapters");
 var import_icons6 = require("@elementor/icons");
 var import_query = require("@elementor/query");
@@ -195,6 +196,10 @@ var ClassManagerIntroduction = () => {
     {
       open: shouldShowIntroduction,
       title: (0, import_i18n.__)("CSS Class manager", "elementor"),
+      image: {
+        src: "https://assets.elementor.com/packages/v1/images/class-manager-intro.svg",
+        alt: (0, import_i18n.__)("Class manager screenshot", "elementor")
+      },
       content: /* @__PURE__ */ React.createElement(IntroductionContent, null),
       handleClose: (shouldShowAgain) => {
         if (!shouldShowAgain) {
@@ -206,20 +211,13 @@ var ClassManagerIntroduction = () => {
   );
 };
 var IntroductionContent = () => {
-  return /* @__PURE__ */ React.createElement(import_ui.Stack, { gap: 1.5, padding: 3 }, /* @__PURE__ */ React.createElement(
-    import_ui.Image,
-    {
-      sx: { width: "100%", height: "312px" },
-      src: "https://assets.elementor.com/packages/v1/images/class-manager-intro.svg",
-      alt: ""
-    }
-  ), /* @__PURE__ */ React.createElement(import_ui.Box, null, /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
+  return /* @__PURE__ */ React.createElement(import_ui.Box, { padding: 3 }, /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
     "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.",
     "elementor"
   )), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement(import_ui.Typography, { variant: "body2" }, (0, import_i18n.__)(
     "Changes apply globally\u2014any modifications will affect all elements using the class, impacting the class order and priority across your site.",
     "elementor"
-  ))));
+  )));
 };
 
 // src/components/class-manager/flipped-color-swatch-icon.tsx
@@ -508,7 +506,7 @@ var ClassItem = ({ id: id2, label, renameClass, selected, disabled, sortableTrig
           openEditMode();
         }
       },
-      /* @__PURE__ */ React5.createElement(import_ui4.ListItemText, { primary: (0, import_i18n4.__)("Rename", "elementor") })
+      /* @__PURE__ */ React5.createElement(import_ui4.Typography, { variant: "caption", sx: { color: "text.primary" } }, (0, import_i18n4.__)("Rename", "elementor"))
     ),
     /* @__PURE__ */ React5.createElement(
       import_editor_ui2.MenuListItem,
@@ -518,7 +516,7 @@ var ClassItem = ({ id: id2, label, renameClass, selected, disabled, sortableTrig
           openDialog({ id: id2, label });
         }
       },
-      /* @__PURE__ */ React5.createElement(import_ui4.ListItemText, { primary: (0, import_i18n4.__)("Delete", "elementor"), sx: { color: "error.light" } })
+      /* @__PURE__ */ React5.createElement(import_ui4.Typography, { variant: "caption", sx: { color: "error.light" } }, (0, import_i18n4.__)("Delete", "elementor"))
     )
   ));
 };
@@ -641,7 +639,7 @@ function ClassManagerPanel() {
   const { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();
   const { mutateAsync: publish, isPending: isPublishing } = usePublish();
   usePreventUnload();
-  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(
+  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(
     CloseButton,
     {
       sx: { marginLeft: "auto" },
@@ -683,7 +681,7 @@ function ClassManagerPanel() {
         }
       }
     }
-  )));
+  ))));
 }
 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" }));
 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

@@ -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, 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\tListItemText,\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<ListItemText primary={ __( 'Rename', 'elementor' ) } />\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<ListItemText primary={ __( 'Delete', 'elementor' ) } sx={ { color: 'error.light' } } />\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&nbsp;{ label }&nbsp;\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"]}
+{"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&nbsp;{ label }&nbsp;\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

@@ -31,10 +31,11 @@ import {
   PanelHeader,
   PanelHeaderTitle
 } from "@elementor/editor-panels";
+import { ThemeProvider } from "@elementor/editor-ui";
 import { changeEditMode } from "@elementor/editor-v1-adapters";
 import { XIcon } from "@elementor/icons";
 import { useMutation } from "@elementor/query";
-import { Alert, Box as Box4, Button as Button3, ErrorBoundary, IconButton as IconButton2, Stack as Stack3 } from "@elementor/ui";
+import { Alert, Box as Box4, Button as Button3, ErrorBoundary, IconButton as IconButton2, Stack as Stack2 } from "@elementor/ui";
 import { __ as __5 } from "@wordpress/i18n";
 
 // src/hooks/use-dirty-state.ts
@@ -179,7 +180,7 @@ import * as React from "react";
 import { useState } from "react";
 import { useSuppressedMessage } from "@elementor/editor-current-user";
 import { IntroductionModal } from "@elementor/editor-ui";
-import { Box, Image, Stack, Typography } from "@elementor/ui";
+import { Box, Typography } from "@elementor/ui";
 import { __ } from "@wordpress/i18n";
 var MESSAGE_KEY = "global-class-manager";
 var ClassManagerIntroduction = () => {
@@ -190,6 +191,10 @@ var ClassManagerIntroduction = () => {
     {
       open: shouldShowIntroduction,
       title: __("CSS Class manager", "elementor"),
+      image: {
+        src: "https://assets.elementor.com/packages/v1/images/class-manager-intro.svg",
+        alt: __("Class manager screenshot", "elementor")
+      },
       content: /* @__PURE__ */ React.createElement(IntroductionContent, null),
       handleClose: (shouldShowAgain) => {
         if (!shouldShowAgain) {
@@ -201,20 +206,13 @@ var ClassManagerIntroduction = () => {
   );
 };
 var IntroductionContent = () => {
-  return /* @__PURE__ */ React.createElement(Stack, { gap: 1.5, padding: 3 }, /* @__PURE__ */ React.createElement(
-    Image,
-    {
-      sx: { width: "100%", height: "312px" },
-      src: "https://assets.elementor.com/packages/v1/images/class-manager-intro.svg",
-      alt: ""
-    }
-  ), /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, __(
+  return /* @__PURE__ */ React.createElement(Box, { padding: 3 }, /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, __(
     "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.",
     "elementor"
   )), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, __(
     "Changes apply globally\u2014any modifications will affect all elements using the class, impacting the class order and priority across your site.",
     "elementor"
-  ))));
+  )));
 };
 
 // src/components/class-manager/flipped-color-swatch-icon.tsx
@@ -234,9 +232,8 @@ import {
   IconButton,
   List,
   ListItemButton,
-  ListItemText,
   Menu,
-  Stack as Stack2,
+  Stack,
   styled as styled2,
   Tooltip,
   Typography as Typography3,
@@ -534,7 +531,7 @@ var ClassItem = ({ id: id2, label, renameClass, selected, disabled, sortableTrig
           openEditMode();
         }
       },
-      /* @__PURE__ */ React5.createElement(ListItemText, { primary: __4("Rename", "elementor") })
+      /* @__PURE__ */ React5.createElement(Typography3, { variant: "caption", sx: { color: "text.primary" } }, __4("Rename", "elementor"))
     ),
     /* @__PURE__ */ React5.createElement(
       MenuListItem,
@@ -544,7 +541,7 @@ var ClassItem = ({ id: id2, label, renameClass, selected, disabled, sortableTrig
           openDialog({ id: id2, label });
         }
       },
-      /* @__PURE__ */ React5.createElement(ListItemText, { primary: __4("Delete", "elementor"), sx: { color: "error.light" } })
+      /* @__PURE__ */ React5.createElement(Typography3, { variant: "caption", sx: { color: "error.light" } }, __4("Delete", "elementor"))
     )
   ));
 };
@@ -573,7 +570,7 @@ var StyledListItemButton = styled2(ListItemButton, {
 	}
 `
 );
-var EmptyState = () => /* @__PURE__ */ React5.createElement(Stack2, { 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(
+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(
   "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.",
   "elementor"
 )));
@@ -674,7 +671,7 @@ function ClassManagerPanel() {
   const { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = useDialog();
   const { mutateAsync: publish, isPending: isPublishing } = usePublish();
   usePreventUnload();
-  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(Stack3, { 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(
+  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(
     CloseButton,
     {
       sx: { marginLeft: "auto" },
@@ -716,7 +713,7 @@ function ClassManagerPanel() {
         }
       }
     }
-  )));
+  ))));
 }
 var CloseButton = ({ onClose, ...props }) => /* @__PURE__ */ React7.createElement(IconButton2, { size: "small", color: "secondary", onClick: onClose, "aria-label": "Close", ...props }, /* @__PURE__ */ React7.createElement(XIcon, { fontSize: "small" }));
 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

@@ -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, 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\tListItemText,\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<ListItemText primary={ __( 'Rename', 'elementor' ) } />\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<ListItemText primary={ __( 'Delete', 'elementor' ) } sx={ { color: 'error.light' } } />\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&nbsp;{ label }&nbsp;\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"]}
+{"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&nbsp;{ label }&nbsp;\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

@@ -1,6 +1,6 @@
 {
   "name": "@elementor/editor-global-classes",
-  "version": "0.14.0",
+  "version": "0.14.1",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -39,15 +39,15 @@
     "dev": "tsup --config=../../tsup.dev.ts"
   },
   "dependencies": {
-    "@elementor/editor": "0.18.4",
+    "@elementor/editor": "0.18.5",
     "@elementor/editor-current-user": "0.3.0",
-    "@elementor/editor-documents": "0.12.1",
-    "@elementor/editor-editing-panel": "1.23.0",
-    "@elementor/editor-panels": "0.13.1",
+    "@elementor/editor-documents": "0.12.2",
+    "@elementor/editor-editing-panel": "1.24.0",
+    "@elementor/editor-panels": "0.14.0",
     "@elementor/editor-props": "0.11.1",
     "@elementor/editor-styles": "0.6.4",
     "@elementor/editor-styles-repository": "0.8.1",
-    "@elementor/editor-ui": "0.5.0",
+    "@elementor/editor-ui": "0.5.1",
     "@elementor/editor-v1-adapters": "0.11.0",
     "@elementor/http": "0.1.4",
     "@elementor/icons": "1.37.0",

package/src/components/class-manager/class-manager-introduction.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { useState } from 'react';
 import { useSuppressedMessage } from '@elementor/editor-current-user';
 import { IntroductionModal } from '@elementor/editor-ui';
-import { Box, Image, Stack, Typography } from '@elementor/ui';
+import { Box, Typography } from '@elementor/ui';
 import { __ } from '@wordpress/i18n';
 
 const MESSAGE_KEY = 'global-class-manager';
@@ -15,6 +15,10 @@ export const ClassManagerIntroduction = () => {
 		<IntroductionModal
 			open={ shouldShowIntroduction }
 			title={ __( 'CSS Class manager', 'elementor' ) }
+			image={ {
+				src: 'https://assets.elementor.com/packages/v1/images/class-manager-intro.svg',
+				alt: __( 'Class manager screenshot', 'elementor' ),
+			} }
 			content={ <IntroductionContent /> }
 			handleClose={ ( shouldShowAgain ) => {
 				if ( ! shouldShowAgain ) {
@@ -29,27 +33,20 @@ export const ClassManagerIntroduction = () => {
 
 const IntroductionContent = () => {
 	return (
-		<Stack gap={ 1.5 } padding={ 3 }>
-			<Image
-				sx={ { width: '100%', height: '312px' } }
-				src="https://assets.elementor.com/packages/v1/images/class-manager-intro.svg"
-				alt=""
-			/>
-			<Box>
-				<Typography variant={ 'body2' }>
-					{ __(
-						"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.",
-						'elementor'
-					) }
-				</Typography>
-				<br />
-				<Typography variant={ 'body2' }>
-					{ __(
-						'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',
-						'elementor'
-					) }
-				</Typography>
-			</Box>
-		</Stack>
+		<Box padding={ 3 }>
+			<Typography variant={ 'body2' }>
+				{ __(
+					"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.",
+					'elementor'
+				) }
+			</Typography>
+			<br />
+			<Typography variant={ 'body2' }>
+				{ __(
+					'Changes apply globally—any modifications will affect all elements using the class, impacting the class order and priority across your site.',
+					'elementor'
+				) }
+			</Typography>
+		</Box>
 	);
 };

package/src/components/class-manager/class-manager-panel.tsx

@@ -13,6 +13,7 @@ import {
 	PanelHeader,
 	PanelHeaderTitle,
 } from '@elementor/editor-panels';
+import { ThemeProvider } from '@elementor/editor-ui';
 import { changeEditMode } from '@elementor/editor-v1-adapters';
 import { XIcon } from '@elementor/icons';
 import { useMutation } from '@elementor/query';
@@ -62,75 +63,79 @@ export function ClassManagerPanel() {
 
 	return (
 		<>
-			<ErrorBoundary fallback={ <ErrorBoundaryFallback /> }>
-				<Panel>
-					<PanelHeader>
-						<Stack p={ 1 } pl={ 2 } width="100%" direction="row" alignItems="center">
-							<PanelHeaderTitle sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>
-								<FlippedColorSwatchIcon fontSize="inherit" />
-								{ __( 'CSS Class manager', 'elementor' ) }
-							</PanelHeaderTitle>
-							<CloseButton
-								sx={ { marginLeft: 'auto' } }
-								onClose={ () => {
-									if ( isDirty ) {
-										openSaveChangesDialog();
-										return;
-									}
-
-									closePanel();
-								} }
-							/>
-						</Stack>
-					</PanelHeader>
-					<PanelBody px={ 2 }>
-						<GlobalClassesList disabled={ isPublishing } />
-					</PanelBody>
-					<PanelFooter>
-						<Button
-							fullWidth
-							size="small"
-							color="global"
-							variant="contained"
-							onClick={ publish }
-							disabled={ ! isDirty }
-							loading={ isPublishing }
-						>
-							{ __( 'Save changes', 'elementor' ) }
-						</Button>
-					</PanelFooter>
-				</Panel>
-			</ErrorBoundary>
-			<ClassManagerIntroduction />
-			{ isSaveChangesDialogOpen && (
-				<SaveChangesDialog>
-					<SaveChangesDialog.Title>{ __( 'You have unsaved changes', 'elementor' ) }</SaveChangesDialog.Title>
-					<SaveChangesDialog.Content>
-						<SaveChangesDialog.ContentText>
-							{ __( 'You have unsaved changes in the Class Manager.', 'elementor' ) }
-						</SaveChangesDialog.ContentText>
-						<SaveChangesDialog.ContentText>
-							{ __( 'To avoid losing your updates, save your changes before leaving.', 'elementor' ) }
-						</SaveChangesDialog.ContentText>
-					</SaveChangesDialog.Content>
-					<SaveChangesDialog.Actions
-						actions={ {
-							cancel: {
-								label: __( 'Cancel', 'elementor' ),
-								action: closeSaveChangesDialog,
-							},
-							confirm: {
-								label: __( 'Save & Continue', 'elementor' ),
-								action: async () => {
-									await publish();
-									closeSaveChangesDialog();
-									closePanel();
+			<ThemeProvider>
+				<ErrorBoundary fallback={ <ErrorBoundaryFallback /> }>
+					<Panel>
+						<PanelHeader>
+							<Stack p={ 1 } pl={ 2 } width="100%" direction="row" alignItems="center">
+								<PanelHeaderTitle sx={ { display: 'flex', alignItems: 'center', gap: 0.5 } }>
+									<FlippedColorSwatchIcon fontSize="inherit" />
+									{ __( 'CSS Class manager', 'elementor' ) }
+								</PanelHeaderTitle>
+								<CloseButton
+									sx={ { marginLeft: 'auto' } }
+									onClose={ () => {
+										if ( isDirty ) {
+											openSaveChangesDialog();
+											return;
+										}
+
+										closePanel();
+									} }
+								/>
+							</Stack>
+						</PanelHeader>
+						<PanelBody px={ 2 }>
+							<GlobalClassesList disabled={ isPublishing } />
+						</PanelBody>
+						<PanelFooter>
+							<Button
+								fullWidth
+								size="small"
+								color="global"
+								variant="contained"
+								onClick={ publish }
+								disabled={ ! isDirty }
+								loading={ isPublishing }
+							>
+								{ __( 'Save changes', 'elementor' ) }
+							</Button>
+						</PanelFooter>
+					</Panel>
+				</ErrorBoundary>
+				<ClassManagerIntroduction />
+				{ isSaveChangesDialogOpen && (
+					<SaveChangesDialog>
+						<SaveChangesDialog.Title>
+							{ __( 'You have unsaved changes', 'elementor' ) }
+						</SaveChangesDialog.Title>
+						<SaveChangesDialog.Content>
+							<SaveChangesDialog.ContentText>
+								{ __( 'You have unsaved changes in the Class Manager.', 'elementor' ) }
+							</SaveChangesDialog.ContentText>
+							<SaveChangesDialog.ContentText>
+								{ __( 'To avoid losing your updates, save your changes before leaving.', 'elementor' ) }
+							</SaveChangesDialog.ContentText>
+						</SaveChangesDialog.Content>
+						<SaveChangesDialog.Actions
+							actions={ {
+								cancel: {
+									label: __( 'Cancel', 'elementor' ),
+									action: closeSaveChangesDialog,
 								},
-							},
-						} }
-					/>
-				</SaveChangesDialog>
-			) }
+								confirm: {
+									label: __( 'Save & Continue', 'elementor' ),
+									action: async () => {
+										await publish();
+										closeSaveChangesDialog();
+										closePanel();
+									},
+								},
+							} }
+						/>
+					</SaveChangesDialog>
+				) }
+			</ThemeProvider>
 		</>
 	);
 }

package/src/components/class-manager/global-classes-list.tsx

@@ -11,7 +11,6 @@ import {
 	List,
 	ListItemButton,
 	type ListItemButtonProps,
-	ListItemText,
 	Menu,
 	Stack,
 	styled,
@@ -164,7 +163,9 @@ const ClassItem = ( { id, label, renameClass, selected, disabled, sortableTrigge
 						openEditMode();
 					} }
 				>
-					<ListItemText primary={ __( 'Rename', 'elementor' ) } />
+					<Typography variant="caption" sx={ { color: 'text.primary' } }>
+						{ __( 'Rename', 'elementor' ) }
+					</Typography>
 				</MenuListItem>
 				<MenuListItem
 					onClick={ () => {
@@ -172,7 +173,9 @@ const ClassItem = ( { id, label, renameClass, selected, disabled, sortableTrigge
 						openDialog( { id, label } );
 					} }
 				>
-					<ListItemText primary={ __( 'Delete', 'elementor' ) } sx={ { color: 'error.light' } } />
+					<Typography variant="caption" sx={ { color: 'error.light' } }>
+						{ __( 'Delete', 'elementor' ) }
+					</Typography>
 				</MenuListItem>
 			</Menu>
 		</>