@elementor/editor-global-classes 4.1.0-734 → 4.1.0-735

package/dist/index.js

@@ -628,7 +628,7 @@ var PrefetchCssClassUsage = () => {
 
 // src/components/class-manager/class-manager-panel.tsx
 var React19 = __toESM(require("react"));
-var import_react9 = require("react");
+var import_react10 = require("react");
 var import_editor_current_user2 = require("@elementor/editor-current-user");
 var import_editor_documents3 = require("@elementor/editor-documents");
 var import_editor_panels = require("@elementor/editor-panels");
@@ -666,7 +666,7 @@ var INIT_CHECKED_FILTERS = {
   unused: false
 };
 var SearchAndFilterProvider = ({ children }) => {
-  const [filters, setFilters] = React.useState(INIT_CHECKED_FILTERS);
+  const [filters, setFilters] = (0, import_react.useState)(INIT_CHECKED_FILTERS);
   const getInitialSearchValue = () => {
     const storedValue = localStorage.getItem("elementor-global-classes-search");
     if (storedValue) {
@@ -1093,6 +1093,7 @@ var chipSx = {
 
 // src/components/search-and-filter/components/filter/css-class-filter.tsx
 var React7 = __toESM(require("react"));
+var import_react4 = require("react");
 var import_editor_ui3 = require("@elementor/editor-ui");
 var import_icons3 = require("@elementor/icons");
 var import_ui5 = require("@elementor/ui");
@@ -1105,7 +1106,7 @@ var CssClassFilter = () => {
     variant: "popover",
     disableAutoFocus: true
   });
-  React7.useEffect(() => {
+  (0, import_react4.useEffect)(() => {
     if (popupState.isOpen) {
       trackGlobalClasses({
         event: "classManagerFiltersOpened"
@@ -1200,7 +1201,7 @@ var ClassManagerSearch = () => {
 
 // src/components/class-manager/class-manager-introduction.tsx
 var React9 = __toESM(require("react"));
-var import_react4 = require("react");
+var import_react5 = require("react");
 var import_editor_current_user = require("@elementor/editor-current-user");
 var import_editor_ui4 = require("@elementor/editor-ui");
 var import_ui7 = require("@elementor/ui");
@@ -1208,7 +1209,7 @@ var import_i18n7 = require("@wordpress/i18n");
 var MESSAGE_KEY = "global-class-manager";
 var ClassManagerIntroduction = () => {
   const [isMessageSuppressed, suppressMessage] = (0, import_editor_current_user.useSuppressedMessage)(MESSAGE_KEY);
-  const [shouldShowIntroduction, setShouldShowIntroduction] = (0, import_react4.useState)(!isMessageSuppressed);
+  const [shouldShowIntroduction, setShouldShowIntroduction] = (0, import_react5.useState)(!isMessageSuppressed);
   return /* @__PURE__ */ React9.createElement(
     import_editor_ui4.IntroductionModal,
     {
@@ -1267,7 +1268,7 @@ var FlippedColorSwatchIcon = ({ sx, ...props }) => /* @__PURE__ */ React10.creat
 
 // src/components/class-manager/global-classes-list.tsx
 var React17 = __toESM(require("react"));
-var import_react7 = require("react");
+var import_react8 = require("react");
 var import_store18 = require("@elementor/store");
 var import_ui14 = require("@elementor/ui");
 var import_i18n13 = require("@wordpress/i18n");
@@ -1280,7 +1281,7 @@ var useOrderedClasses = () => {
 
 // src/components/class-manager/class-item.tsx
 var React15 = __toESM(require("react"));
-var import_react6 = require("react");
+var import_react7 = require("react");
 var import_editor_styles_repository2 = require("@elementor/editor-styles-repository");
 var import_editor_ui8 = require("@elementor/editor-ui");
 var import_icons9 = require("@elementor/icons");
@@ -1537,13 +1538,13 @@ var InfoAlertMessage = ({ children }) => /* @__PURE__ */ React12.createElement(
 
 // src/components/class-manager/delete-confirmation-dialog.tsx
 var React13 = __toESM(require("react"));
-var import_react5 = require("react");
+var import_react6 = require("react");
 var import_editor_ui7 = require("@elementor/editor-ui");
 var import_ui10 = require("@elementor/ui");
 var import_i18n10 = require("@wordpress/i18n");
-var context = (0, import_react5.createContext)(null);
+var context = (0, import_react6.createContext)(null);
 var DeleteConfirmationProvider = ({ children }) => {
-  const [dialogProps, setDialogProps] = (0, import_react5.useState)(null);
+  const [dialogProps, setDialogProps] = (0, import_react6.useState)(null);
   const openDialog2 = (props) => {
     setDialogProps(props);
   };
@@ -1571,7 +1572,7 @@ var DeleteClassDialog = ({ label, id: id2 }) => {
   return /* @__PURE__ */ React13.createElement(import_editor_ui7.ConfirmationDialog, { open: true, onClose: closeDialog2 }, /* @__PURE__ */ React13.createElement(import_editor_ui7.ConfirmationDialog.Title, null, (0, import_i18n10.__)("Delete this class?", "elementor")), /* @__PURE__ */ React13.createElement(import_editor_ui7.ConfirmationDialog.Content, null, /* @__PURE__ */ React13.createElement(import_editor_ui7.ConfirmationDialog.ContentText, null, (0, import_i18n10.__)("Deleting", "elementor"), /* @__PURE__ */ React13.createElement(import_ui10.Typography, { variant: "subtitle2", component: "span" }, "\xA0", label, "\xA0"), text)), /* @__PURE__ */ React13.createElement(import_editor_ui7.ConfirmationDialog.Actions, { onClose: closeDialog2, onConfirm: handleConfirm }));
 };
 var useDeleteConfirmation = () => {
-  const contextValue = (0, import_react5.useContext)(context);
+  const contextValue = (0, import_react6.useContext)(context);
   if (!contextValue) {
     throw new Error("useDeleteConfirmation must be used within a DeleteConfirmationProvider");
   }
@@ -1651,7 +1652,7 @@ var ClassItem = ({
   syncToV3,
   onToggleSync
 }) => {
-  const itemRef = (0, import_react6.useRef)(null);
+  const itemRef = (0, import_react7.useRef)(null);
   const {
     ref: editableRef,
     openEditMode,
@@ -1663,7 +1664,7 @@ var ClassItem = ({
     onSubmit: renameClass,
     validation: validateLabel
   });
-  const [selectedCssUsage, setSelectedCssUsage] = (0, import_react6.useState)("");
+  const [selectedCssUsage, setSelectedCssUsage] = (0, import_react7.useState)("");
   const { openDialog: openDialog2 } = useDeleteConfirmation();
   const popupState = (0, import_ui12.usePopupState)({
     variant: "popover",
@@ -1935,11 +1936,11 @@ var GlobalClassesList = ({ disabled, onStopSyncRequest, onStartSyncRequest }) =>
   const cssClasses = useOrderedClasses();
   const dispatch5 = (0, import_store18.__useDispatch)();
   const filters = useFilters();
-  const [draggedItemId, setDraggedItemId] = React17.useState(null);
+  const [draggedItemId, setDraggedItemId] = (0, import_react8.useState)(null);
   const draggedItemLabel = cssClasses.find((cssClass) => cssClass.id === draggedItemId)?.label ?? "";
   const [classesOrder, reorderClasses] = useReorder(draggedItemId, setDraggedItemId, draggedItemLabel ?? "");
   const filteredCssClasses = useFilteredCssClasses();
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     const handler2 = (event) => {
       if (event.key === "z" && (event.ctrlKey || event.metaKey)) {
         event.stopImmediatePropagation();
@@ -2058,20 +2059,20 @@ var useFilteredCssClasses = () => {
     search: { debouncedValue: searchValue }
   } = useSearchAndFilters();
   const filters = useFilters();
-  const lowercaseLabels = (0, import_react7.useMemo)(
+  const lowercaseLabels = (0, import_react8.useMemo)(
     () => cssClasses.map((cssClass) => ({
       ...cssClass,
       lowerLabel: cssClass.label.toLowerCase()
     })),
     [cssClasses]
   );
-  const filteredClasses = (0, import_react7.useMemo)(() => {
+  const filteredClasses = (0, import_react8.useMemo)(() => {
     if (searchValue.length > 1) {
       return lowercaseLabels.filter((cssClass) => cssClass.lowerLabel.includes(searchValue.toLowerCase()));
     }
     return cssClasses;
   }, [searchValue, cssClasses, lowercaseLabels]);
-  return (0, import_react7.useMemo)(() => {
+  return (0, import_react8.useMemo)(() => {
     if (filters && filters.length > 0) {
       return filteredClasses.filter((cssClass) => filters.includes(cssClass.id));
     }
@@ -2091,7 +2092,7 @@ function unblockPanelInteractions() {
 
 // src/components/class-manager/start-sync-to-v3-modal.tsx
 var React18 = __toESM(require("react"));
-var import_react8 = require("react");
+var import_react9 = require("react");
 var import_ui15 = require("@elementor/ui");
 var import_i18n14 = require("@wordpress/i18n");
 var IMAGE_URL = "https://assets.elementor.com/packages/v1/images/class-manager-sync-modal.png";
@@ -2101,9 +2102,9 @@ var StartSyncToV3Modal = ({
   onExternalClose,
   onConfirm
 } = {}) => {
-  const [shouldShowAgain, setShouldShowAgain] = (0, import_react8.useState)(true);
-  const hasTrackedExposure = (0, import_react8.useRef)(false);
-  (0, import_react8.useEffect)(() => {
+  const [shouldShowAgain, setShouldShowAgain] = (0, import_react9.useState)(true);
+  const hasTrackedExposure = (0, import_react9.useRef)(false);
+  (0, import_react9.useEffect)(() => {
     if (externalOpen && classId && !hasTrackedExposure.current) {
       hasTrackedExposure.current = true;
       trackGlobalClasses({ event: "classSyncToV3PopupShown", classId });
@@ -2175,15 +2176,15 @@ function ClassManagerPanel() {
   const isDirty2 = useDirtyState();
   const { close: closePanel } = usePanelActions();
   const { open: openSaveChangesDialog, close: closeSaveChangesDialog, isOpen: isSaveChangesDialogOpen } = (0, import_editor_ui9.useDialog)();
-  const [stopSyncConfirmation, setStopSyncConfirmation] = (0, import_react9.useState)(null);
-  const [startSyncConfirmation, setStartSyncConfirmation] = (0, import_react9.useState)(null);
+  const [stopSyncConfirmation, setStopSyncConfirmation] = (0, import_react10.useState)(null);
+  const [startSyncConfirmation, setStartSyncConfirmation] = (0, import_react10.useState)(null);
   const [isStopSyncSuppressed] = (0, import_editor_current_user2.useSuppressedMessage)(STOP_SYNC_MESSAGE_KEY);
   const { mutateAsync: publish, isPending: isPublishing } = usePublish();
   const resetAndClosePanel = () => {
     (0, import_store20.__dispatch)(slice.actions.resetToInitialState({ context: "frontend" }));
     closeSaveChangesDialog();
   };
-  const handleStopSync = (0, import_react9.useCallback)((classId) => {
+  const handleStopSync = (0, import_react10.useCallback)((classId) => {
     (0, import_store20.__dispatch)(
       slice.actions.update({
         style: {
@@ -2195,7 +2196,7 @@ function ClassManagerPanel() {
     trackGlobalClasses({ event: "classSyncToV3", classId, action: "unsync" });
     setStopSyncConfirmation(null);
   }, []);
-  const handleStartSync = (0, import_react9.useCallback)((classId) => {
+  const handleStartSync = (0, import_react10.useCallback)((classId) => {
     (0, import_store20.__dispatch)(
       slice.actions.update({
         style: {
@@ -2207,7 +2208,7 @@ function ClassManagerPanel() {
     trackGlobalClasses({ event: "classSyncToV3", classId, action: "sync" });
     setStartSyncConfirmation(null);
   }, []);
-  const handleStopSyncRequest = (0, import_react9.useCallback)(
+  const handleStopSyncRequest = (0, import_react10.useCallback)(
     (classId) => {
       if (!isStopSyncSuppressed) {
         setStopSyncConfirmation(classId);
@@ -2313,7 +2314,7 @@ var CloseButton = ({ onClose, ...props }) => /* @__PURE__ */ React19.createEleme
 var ErrorBoundaryFallback = () => /* @__PURE__ */ React19.createElement(import_ui16.Box, { role: "alert", sx: { minHeight: "100%", p: 2 } }, /* @__PURE__ */ React19.createElement(import_ui16.Alert, { severity: "error", sx: { mb: 2, maxWidth: 400, textAlign: "center" } }, /* @__PURE__ */ React19.createElement("strong", null, (0, import_i18n15.__)("Something went wrong", "elementor"))));
 var usePreventUnload = () => {
   const isDirty2 = useDirtyState();
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     const handleBeforeUnload = (event) => {
       if (isDirty2) {
         event.preventDefault();
@@ -2474,11 +2475,11 @@ function createClassName(prefix) {
 }
 
 // src/components/global-styles-import-listener.tsx
-var import_react10 = require("react");
+var import_react11 = require("react");
 var import_store22 = require("@elementor/store");
 function GlobalStylesImportListener() {
   const dispatch5 = (0, import_store22.__useDispatch)();
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     const handleGlobalStylesImported = (event) => {
       const importedClasses = event.detail?.global_classes;
       if (importedClasses?.items && importedClasses?.order) {
@@ -2525,15 +2526,15 @@ function GlobalStylesImportListener() {
 }
 
 // src/components/open-panel-from-url.tsx
-var import_react11 = require("react");
+var import_react12 = require("react");
 var import_editor_v1_adapters3 = require("@elementor/editor-v1-adapters");
 var ACTIVE_PANEL_PARAM = "active-panel";
 var PANEL_ID = "global-classes-manager";
 var DEFAULT_PANEL_ROUTE = "panel/elements";
 function OpenPanelFromUrl() {
   const { open } = usePanelActions();
-  const hasOpened = (0, import_react11.useRef)(false);
-  (0, import_react11.useEffect)(() => {
+  const hasOpened = (0, import_react12.useRef)(false);
+  (0, import_react12.useEffect)(() => {
     const urlParams = new URLSearchParams(window.location.search);
     const activePanel = urlParams.get(ACTIVE_PANEL_PARAM);
     if (activePanel !== PANEL_ID) {
@@ -2554,11 +2555,11 @@ function OpenPanelFromUrl() {
 }
 
 // src/components/populate-store.tsx
-var import_react12 = require("react");
+var import_react13 = require("react");
 var import_store24 = require("@elementor/store");
 function PopulateStore() {
   const dispatch5 = (0, import_store24.__useDispatch)();
-  (0, import_react12.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     Promise.all([apiClient.all("preview"), apiClient.all("frontend")]).then(
       ([previewRes, frontendRes]) => {
         const { data: previewData } = previewRes;
@@ -3027,7 +3028,7 @@ var initMcpIntegration = (reg, canvasMcpEntry) => {
 };
 
 // src/sync-with-document.tsx
-var import_react13 = require("react");
+var import_react14 = require("react");
 var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
 
 // src/sync-with-document-save.ts
@@ -3092,7 +3093,7 @@ function isDirty() {
 // src/sync-with-document.tsx
 function SyncWithDocumentSave() {
   const panelActions = usePanelActions();
-  (0, import_react13.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     (0, import_editor_v1_adapters5.__privateListenTo)((0, import_editor_v1_adapters5.v1ReadyEvent)(), () => {
       syncWithDocumentSave(panelActions);
     });