@elementor/editor-interactions 4.0.0-660 → 4.0.0-661

package/dist/index.mjs

@@ -26,8 +26,7 @@ var EmptyState = ({ onCreateInteraction }) => {
 
 // src/components/interactions-tab.tsx
 import * as React11 from "react";
-import { useCallback as useCallback6, useState as useState3 } from "react";
-import { useElementInteractions as useElementInteractions2 } from "@elementor/editor-elements";
+import { useCallback as useCallback6, useState as useState4 } from "react";
 import { SessionStorageProvider } from "@elementor/session";
 import { Stack as Stack3 } from "@elementor/ui";
 
@@ -36,9 +35,30 @@ import * as React2 from "react";
 import { createContext, useContext, useEffect } from "react";
 import {
   playElementInteractions,
-  updateElementInteractions,
-  useElementInteractions
+  updateElementInteractions
 } from "@elementor/editor-elements";
+
+// src/hooks/use-element-interactions.ts
+import { useState } from "react";
+import { getElementInteractions } from "@elementor/editor-elements";
+import { __privateUseListenTo as useListenTo, windowEvent } from "@elementor/editor-v1-adapters";
+var useElementInteractions = (elementId) => {
+  const [interactions, setInteractions] = useState(() => {
+    const initial = getElementInteractions(elementId);
+    return initial ?? { version: 1, items: [] };
+  });
+  useListenTo(
+    windowEvent("elementor/element/update_interactions"),
+    () => {
+      const newInteractions = getElementInteractions(elementId);
+      setInteractions(newInteractions ?? { version: 1, items: [] });
+    },
+    [elementId]
+  );
+  return interactions;
+};
+
+// src/contexts/interactions-context.tsx
 var InteractionsContext = createContext(null);
 var DEFAULT_INTERACTIONS = {
   version: 1,
@@ -77,10 +97,10 @@ var useInteractionsContext = () => {
 
 // src/contexts/popup-state-context.tsx
 import * as React3 from "react";
-import { createContext as createContext2, useCallback, useContext as useContext2, useState } from "react";
+import { createContext as createContext2, useCallback, useContext as useContext2, useState as useState2 } from "react";
 var PopupStateContext = createContext2(void 0);
 var PopupStateProvider = ({ children }) => {
-  const [openByDefault, setOpenByDefault] = useState(false);
+  const [openByDefault, setOpenByDefault] = useState2(false);
   const triggerDefaultOpen = useCallback(() => {
     setOpenByDefault(true);
   }, []);
@@ -701,7 +721,7 @@ var InteractionDetails = ({ interaction, onChange, onPlayInteraction }) => {
 
 // src/components/interaction-settings.tsx
 import * as React8 from "react";
-import { useCallback as useCallback3, useMemo as useMemo2, useState as useState2 } from "react";
+import { useCallback as useCallback3, useMemo as useMemo2, useState as useState3 } from "react";
 import { ControlFormLabel as ControlFormLabel2, PopoverContent as PopoverContent2 } from "@elementor/editor-controls";
 import { useBreakpoints } from "@elementor/editor-responsive";
 import { Autocomplete, Chip, Grid as Grid3, Stack as Stack2, TextField } from "@elementor/ui";
@@ -713,7 +733,7 @@ var InteractionSettings = ({ interaction, onChange }) => {
     () => breakpoints.map((breakpoint) => ({ label: breakpoint.label, value: String(breakpoint.id) })),
     [breakpoints]
   );
-  const [selectedBreakpoints, setSelectedBreakpoints] = useState2(() => {
+  const [selectedBreakpoints, setSelectedBreakpoints] = useState3(() => {
     const excluded = extractExcludedBreakpoints(interaction.breakpoints).filter((excludedBreakpoint) => {
       return availableBreakpoints.some(({ value }) => value === excludedBreakpoint);
     });
@@ -901,8 +921,8 @@ var InteractionsTab = ({ elementId }) => {
   return /* @__PURE__ */ React11.createElement(PopupStateProvider, null, /* @__PURE__ */ React11.createElement(InteractionsTabContent, { elementId }));
 };
 function InteractionsTabContent({ elementId }) {
-  const existingInteractions = useElementInteractions2(elementId);
-  const firstInteractionState = useState3(false);
+  const existingInteractions = useElementInteractions(elementId);
+  const firstInteractionState = useState4(false);
   const hasInteractions = existingInteractions?.items?.length || firstInteractionState[0];
   return /* @__PURE__ */ React11.createElement(SessionStorageProvider, { prefix: elementId }, hasInteractions ? /* @__PURE__ */ React11.createElement(InteractionsProvider, { elementId }, /* @__PURE__ */ React11.createElement(InteractionsContent, { firstInteractionState })) : /* @__PURE__ */ React11.createElement(
     EmptyState,
@@ -999,8 +1019,8 @@ function createInteractionsProvider({
 }
 
 // src/providers/document-elements-interactions-provider.ts
-import { getCurrentDocumentId, getElementInteractions, getElements } from "@elementor/editor-elements";
-import { __privateListenTo as listenTo, windowEvent } from "@elementor/editor-v1-adapters";
+import { getCurrentDocumentId, getElementInteractions as getElementInteractions2, getElements } from "@elementor/editor-elements";
+import { __privateListenTo as listenTo, windowEvent as windowEvent2 } from "@elementor/editor-v1-adapters";
 var ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX = "document-elements-interactions-";
 var documentElementsInteractionsProvider = createInteractionsProvider({
   key: () => {
@@ -1014,20 +1034,20 @@ var documentElementsInteractionsProvider = createInteractionsProvider({
   },
   priority: 50,
   subscribe: (cb) => {
-    return listenTo([windowEvent("elementor/element/update_interactions")], () => cb());
+    return listenTo([windowEvent2("elementor/element/update_interactions")], () => cb());
   },
   actions: {
     all: () => {
       const elements = getElements();
       const filtered = elements.filter((element) => {
-        const interactions = getElementInteractions(element.id);
+        const interactions = getElementInteractions2(element.id);
         if (!interactions) {
           return false;
         }
         return interactions?.items?.length > 0;
       });
       return filtered.map((element) => {
-        const interactions = getElementInteractions(element.id);
+        const interactions = getElementInteractions2(element.id);
         return {
           elementId: element.id,
           dataId: element.id,
@@ -1090,13 +1110,13 @@ import { __ as __8 } from "@wordpress/i18n";
 
 // src/ui/interactions-promotion-chip.tsx
 import * as React13 from "react";
-import { forwardRef, useImperativeHandle, useState as useState4 } from "react";
+import { forwardRef, useImperativeHandle, useState as useState5 } from "react";
 import { PromotionChip, PromotionPopover, useCanvasClickHandler } from "@elementor/editor-ui";
 import { Box as Box3 } from "@elementor/ui";
 import { __ as __7 } from "@wordpress/i18n";
 var InteractionsPromotionChip = forwardRef(
   ({ content, upgradeUrl, anchorRef }, ref) => {
-    const [isOpen, setIsOpen] = useState4(false);
+    const [isOpen, setIsOpen] = useState5(false);
     useCanvasClickHandler(isOpen, () => setIsOpen(false));
     const toggle = () => setIsOpen((prev) => !prev);
     useImperativeHandle(ref, () => ({ toggle }), []);
@@ -1760,6 +1780,7 @@ export {
   isTempId,
   parseSizeValue,
   registerInteractionsControl,
-  resolveDirection
+  resolveDirection,
+  useElementInteractions
 };
 //# sourceMappingURL=index.mjs.map