@elementor/editor-v1-adapters 0.1.0

package/dist/index.mjs

@@ -0,0 +1,288 @@
+// src/dispatchers/utils.ts
+function isJQueryDeferred(value) {
+  return !!value && "object" === typeof value && Object.hasOwn(value, "promise") && Object.hasOwn(value, "then") && Object.hasOwn(value, "fail");
+}
+function promisifyJQueryDeferred(deferred) {
+  return new Promise((resolve, reject) => {
+    deferred.then(resolve, reject);
+  });
+}
+
+// src/dispatchers/dispatchers.ts
+function runCommand(command, args) {
+  const extendedWindow = window;
+  if (!extendedWindow.$e?.run) {
+    return Promise.reject("`$e.run()` is not available");
+  }
+  const result = extendedWindow.$e.run(command, args);
+  if (result instanceof Promise) {
+    return result;
+  }
+  if (isJQueryDeferred(result)) {
+    return promisifyJQueryDeferred(result);
+  }
+  return Promise.resolve(result);
+}
+function openRoute(route) {
+  const extendedWindow = window;
+  if (!extendedWindow.$e?.route) {
+    return Promise.reject("`$e.route()` is not available");
+  }
+  try {
+    return Promise.resolve(
+      extendedWindow.$e.route(route)
+    );
+  } catch (e) {
+    return Promise.reject(e);
+  }
+}
+
+// src/hooks/use-listen-to.ts
+import { useEffect, useState } from "react";
+
+// src/listeners/event-creators.ts
+var commandStartEvent = (command) => {
+  return {
+    type: "command",
+    name: command,
+    state: "before"
+  };
+};
+var commandEndEvent = (command) => {
+  return {
+    type: "command",
+    name: command,
+    state: "after"
+  };
+};
+var routeOpenEvent = (route) => {
+  return {
+    type: "route",
+    name: route,
+    state: "open"
+  };
+};
+var routeCloseEvent = (route) => {
+  return {
+    type: "route",
+    name: route,
+    state: "close"
+  };
+};
+var windowEvent = (event) => {
+  return {
+    type: "window-event",
+    name: event
+  };
+};
+var v1ReadyEvent = () => {
+  return windowEvent("elementor/initialized");
+};
+var editModeChangeEvent = () => {
+  return windowEvent("elementor/edit-mode/change");
+};
+
+// src/listeners/is-ready.ts
+var ready = false;
+function isReady() {
+  return ready;
+}
+function setReady(value) {
+  ready = value;
+}
+
+// src/listeners/utils.ts
+function dispatchReadyEvent() {
+  return getV1LoadingPromise().then(() => {
+    setReady(true);
+    window.dispatchEvent(new CustomEvent("elementor/initialized"));
+  });
+}
+function getV1LoadingPromise() {
+  const v1LoadingPromise = window.__elementorEditorV1LoadingPromise;
+  if (!v1LoadingPromise) {
+    return Promise.reject("Elementor Editor V1 is not loaded");
+  }
+  return v1LoadingPromise;
+}
+function normalizeEvent(e) {
+  if (e instanceof CustomEvent && e.detail?.command) {
+    return {
+      type: "command",
+      command: e.detail.command,
+      args: e.detail.args,
+      originalEvent: e
+    };
+  }
+  if (e instanceof CustomEvent && e.detail?.route) {
+    return {
+      type: "route",
+      route: e.detail.route,
+      originalEvent: e
+    };
+  }
+  return {
+    type: "window-event",
+    event: e.type,
+    originalEvent: e
+  };
+}
+
+// src/listeners/listeners.ts
+var callbacksByEvent = /* @__PURE__ */ new Map();
+var abortController = new AbortController();
+function listenTo(eventDescriptors, callback) {
+  if (!Array.isArray(eventDescriptors)) {
+    eventDescriptors = [eventDescriptors];
+  }
+  const cleanups = eventDescriptors.map((event) => {
+    const { type, name } = event;
+    switch (type) {
+      case "command":
+        return registerCommandListener(name, event.state, callback);
+      case "route":
+        return registerRouteListener(name, event.state, callback);
+      case "window-event":
+        return registerWindowEventListener(name, callback);
+    }
+  });
+  return () => {
+    cleanups.forEach((cleanup) => cleanup());
+  };
+}
+function flushListeners() {
+  abortController.abort();
+  callbacksByEvent.clear();
+  setReady(false);
+  abortController = new AbortController();
+}
+function registerCommandListener(command, state, callback) {
+  return registerWindowEventListener(`elementor/commands/run/${state}`, (e) => {
+    const shouldRunCallback = e.type === "command" && e.command === command;
+    if (shouldRunCallback) {
+      callback(e);
+    }
+  });
+}
+function registerRouteListener(route, state, callback) {
+  return registerWindowEventListener(`elementor/routes/${state}`, (e) => {
+    const shouldRunCallback = e.type === "route" && e.route.startsWith(route);
+    if (shouldRunCallback) {
+      callback(e);
+    }
+  });
+}
+function registerWindowEventListener(event, callback) {
+  const isFirstListener = !callbacksByEvent.has(event);
+  if (isFirstListener) {
+    callbacksByEvent.set(event, []);
+    addListener(event);
+  }
+  callbacksByEvent.get(event)?.push(callback);
+  return () => {
+    const callbacks = callbacksByEvent.get(event);
+    if (!callbacks?.length) {
+      return;
+    }
+    const filtered = callbacks.filter((cb) => cb !== callback);
+    callbacksByEvent.set(event, filtered);
+  };
+}
+function addListener(event) {
+  window.addEventListener(
+    event,
+    makeEventHandler(event),
+    { signal: abortController.signal }
+  );
+}
+function makeEventHandler(event) {
+  return (e) => {
+    if (!isReady()) {
+      return;
+    }
+    const normalizedEvent = normalizeEvent(e);
+    callbacksByEvent.get(event)?.forEach((callback) => {
+      callback(normalizedEvent);
+    });
+  };
+}
+
+// src/hooks/use-listen-to.ts
+function useListenTo(event, getSnapshot, deps = []) {
+  const [snapshot, setSnapshot] = useState(() => getSnapshot());
+  useEffect(() => {
+    const updateState = () => setSnapshot(getSnapshot());
+    updateState();
+    return listenTo(event, updateState);
+  }, deps);
+  return snapshot;
+}
+
+// src/readers/index.ts
+function isRouteActive(route) {
+  const extendedWindow = window;
+  return !!extendedWindow.$e?.routes?.isPartOf(route);
+}
+function getCurrentEditMode() {
+  const extendedWindow = window;
+  return extendedWindow.elementor?.channels?.dataEditMode?.request?.("activeMode");
+}
+
+// src/hooks/use-is-preview-mode.ts
+function useIsPreviewMode() {
+  return useListenTo(
+    editModeChangeEvent(),
+    () => getCurrentEditMode() === "preview"
+  );
+}
+
+// src/hooks/use-is-route-active.ts
+function useIsRouteActive(route) {
+  return useListenTo(
+    [
+      routeOpenEvent(route),
+      routeCloseEvent(route)
+    ],
+    () => isRouteActive(route),
+    [route]
+  );
+}
+
+// src/hooks/use-route-status.ts
+function useRouteStatus(route, {
+  blockOnKitRoutes = true,
+  blockOnPreviewMode = true
+} = {}) {
+  const isRouteActive2 = useIsRouteActive(route);
+  const isKitRouteActive = useIsRouteActive("panel/global");
+  const isPreviewMode = useIsPreviewMode();
+  const isActive = isRouteActive2 && !(blockOnPreviewMode && isPreviewMode);
+  const isBlocked = blockOnPreviewMode && isPreviewMode || blockOnKitRoutes && isKitRouteActive;
+  return {
+    isActive,
+    isBlocked
+  };
+}
+export {
+  commandEndEvent,
+  commandStartEvent,
+  dispatchReadyEvent,
+  editModeChangeEvent,
+  flushListeners,
+  getCurrentEditMode,
+  isReady,
+  isRouteActive,
+  listenTo,
+  openRoute,
+  routeCloseEvent,
+  routeOpenEvent,
+  runCommand,
+  setReady,
+  useIsPreviewMode,
+  useIsRouteActive,
+  useListenTo,
+  useRouteStatus,
+  v1ReadyEvent,
+  windowEvent
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/dispatchers/utils.ts","../src/dispatchers/dispatchers.ts","../src/hooks/use-listen-to.ts","../src/listeners/event-creators.ts","../src/listeners/is-ready.ts","../src/listeners/utils.ts","../src/listeners/listeners.ts","../src/readers/index.ts","../src/hooks/use-is-preview-mode.ts","../src/hooks/use-is-route-active.ts","../src/hooks/use-route-status.ts"],"sourcesContent":["import { jQueryDeferred } from './types';\n\nexport function isJQueryDeferred<T>( value: unknown ): value is jQueryDeferred<T> {\n\t// TODO: Copied from:\n\t//  https://github.com/elementor/elementor/blob/6a74fc9/modules/web-cli/assets/js/core/commands.js#L410\n\n\treturn ( !! value ) &&\n\t\t'object' === typeof value &&\n\t\tObject.hasOwn( value, 'promise' ) &&\n\t\tObject.hasOwn( value, 'then' ) &&\n\t\tObject.hasOwn( value, 'fail' );\n}\n\nexport function promisifyJQueryDeferred<T>( deferred: jQueryDeferred<T> ): Promise<T> {\n\treturn new Promise( ( resolve, reject ) => {\n\t\tdeferred.then( resolve, reject );\n\t} );\n}\n","import { ExtendedWindow } from './types';\nimport { isJQueryDeferred, promisifyJQueryDeferred } from './utils';\n\nexport function runCommand( command: string, args?: object ) {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\tif ( ! extendedWindow.$e?.run ) {\n\t\treturn Promise.reject( '`$e.run()` is not available' );\n\t}\n\n\tconst result = extendedWindow.$e.run( command, args );\n\n\tif ( result instanceof Promise ) {\n\t\treturn result;\n\t}\n\n\tif ( isJQueryDeferred( result ) ) {\n\t\treturn promisifyJQueryDeferred( result );\n\t}\n\n\treturn Promise.resolve( result );\n}\n\nexport function openRoute( route: string ) {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\tif ( ! extendedWindow.$e?.route ) {\n\t\treturn Promise.reject( '`$e.route()` is not available' );\n\t}\n\n\ttry {\n\t\treturn Promise.resolve(\n\t\t\textendedWindow.$e.route( route )\n\t\t);\n\t} catch ( e ) {\n\t\treturn Promise.reject( e );\n\t}\n}\n","import { useEffect, useState } from 'react';\nimport { EventDescriptor, listenTo } from '../listeners';\n\nexport default function useListenTo<T>(\n\tevent: EventDescriptor | EventDescriptor[],\n\tgetSnapshot: () => T,\n\tdeps: unknown[] = []\n) {\n\tconst [ snapshot, setSnapshot ] = useState( () => getSnapshot() );\n\n\tuseEffect( () => {\n\t\tconst updateState = () => setSnapshot( getSnapshot() );\n\n\t\t// Ensure the state is re-calculated when the dependencies have been changed.\n\t\tupdateState();\n\n\t\treturn listenTo( event, updateState );\n\t}, deps ); // eslint-disable-line react-hooks/exhaustive-deps\n\n\treturn snapshot;\n}\n","import { CommandEventDescriptor, RouteEventDescriptor, WindowEventDescriptor } from './types';\n\nexport const commandStartEvent = ( command: CommandEventDescriptor['name'] ): CommandEventDescriptor => {\n\treturn {\n\t\ttype: 'command',\n\t\tname: command,\n\t\tstate: 'before',\n\t};\n};\n\nexport const commandEndEvent = ( command: CommandEventDescriptor['name'] ): CommandEventDescriptor => {\n\treturn {\n\t\ttype: 'command',\n\t\tname: command,\n\t\tstate: 'after',\n\t};\n};\n\nexport const routeOpenEvent = ( route: RouteEventDescriptor['name'] ): RouteEventDescriptor => {\n\treturn {\n\t\ttype: 'route',\n\t\tname: route,\n\t\tstate: 'open',\n\t};\n};\n\nexport const routeCloseEvent = ( route: RouteEventDescriptor['name'] ): RouteEventDescriptor => {\n\treturn {\n\t\ttype: 'route',\n\t\tname: route,\n\t\tstate: 'close',\n\t};\n};\n\nexport const windowEvent = ( event: WindowEventDescriptor['name'] ): WindowEventDescriptor => {\n\treturn {\n\t\ttype: 'window-event',\n\t\tname: event,\n\t};\n};\n\nexport const v1ReadyEvent = () => {\n\treturn windowEvent( 'elementor/initialized' );\n};\n\nexport const editModeChangeEvent = () => {\n\treturn windowEvent( 'elementor/edit-mode/change' );\n};\n","/**\n * This file is used to store the state of the isReady variable, which is used to determine\n * if the adapter is ready to receive events (editor v1 and v2 are loaded).\n */\n\nlet ready = false;\n\nexport function isReady() {\n\treturn ready;\n}\n\nexport function setReady( value: boolean ) {\n\tready = value;\n}\n","import { ExtendedWindow, ListenerEvent } from './types';\nimport { setReady } from './is-ready';\n\nexport function dispatchReadyEvent() {\n\treturn getV1LoadingPromise().then( () => {\n\t\tsetReady( true );\n\t\twindow.dispatchEvent( new CustomEvent( 'elementor/initialized' ) );\n\t} );\n}\n\nfunction getV1LoadingPromise() {\n\tconst v1LoadingPromise = ( window as unknown as ExtendedWindow ).__elementorEditorV1LoadingPromise;\n\n\tif ( ! v1LoadingPromise ) {\n\t\treturn Promise.reject( 'Elementor Editor V1 is not loaded' );\n\t}\n\n\treturn v1LoadingPromise;\n}\n\nexport function normalizeEvent( e: ListenerEvent['originalEvent'] ): ListenerEvent {\n\tif ( e instanceof CustomEvent && e.detail?.command ) {\n\t\treturn {\n\t\t\ttype: 'command',\n\t\t\tcommand: e.detail.command,\n\t\t\targs: e.detail.args,\n\t\t\toriginalEvent: e,\n\t\t};\n\t}\n\n\tif ( e instanceof CustomEvent && e.detail?.route ) {\n\t\treturn {\n\t\t\ttype: 'route',\n\t\t\troute: e.detail.route,\n\t\t\toriginalEvent: e,\n\t\t};\n\t}\n\n\treturn {\n\t\ttype: 'window-event',\n\t\tevent: e.type,\n\t\toriginalEvent: e,\n\t};\n}\n","import { normalizeEvent } from './utils';\nimport {\n\tCommandEventDescriptor,\n\tEventDescriptor,\n\tListenerCallback,\n\tRouteEventDescriptor,\n\tWindowEventDescriptor,\n} from './types';\nimport { isReady, setReady } from './is-ready';\n\nconst callbacksByEvent = new Map<EventDescriptor['name'], ListenerCallback[]>();\nlet abortController = new AbortController();\n\nexport function listenTo(\n\teventDescriptors: EventDescriptor | EventDescriptor[],\n\tcallback: ListenerCallback\n) {\n\tif ( ! Array.isArray( eventDescriptors ) ) {\n\t\teventDescriptors = [ eventDescriptors ];\n\t}\n\n\t// @see https://github.com/typescript-eslint/typescript-eslint/issues/2841\n\t// eslint-disable-next-line array-callback-return -- Clashes with typescript.\n\tconst cleanups = eventDescriptors.map( ( event ) => {\n\t\tconst { type, name } = event;\n\n\t\tswitch ( type ) {\n\t\t\tcase 'command':\n\t\t\t\treturn registerCommandListener( name, event.state, callback );\n\n\t\t\tcase 'route':\n\t\t\t\treturn registerRouteListener( name, event.state, callback );\n\n\t\t\tcase 'window-event':\n\t\t\t\treturn registerWindowEventListener( name, callback );\n\t\t}\n\t} );\n\n\treturn () => {\n\t\tcleanups.forEach( ( cleanup ) => cleanup() );\n\t};\n}\n\nexport function flushListeners() {\n\tabortController.abort();\n\tcallbacksByEvent.clear();\n\tsetReady( false );\n\n\tabortController = new AbortController();\n}\n\nfunction registerCommandListener(\n\tcommand: CommandEventDescriptor['name'],\n\tstate: CommandEventDescriptor['state'],\n\tcallback: ListenerCallback\n) {\n\treturn registerWindowEventListener( `elementor/commands/run/${ state }`, ( e ) => {\n\t\tconst shouldRunCallback = e.type === 'command' && e.command === command;\n\n\t\tif ( shouldRunCallback ) {\n\t\t\tcallback( e );\n\t\t}\n\t} );\n}\n\nfunction registerRouteListener(\n\troute: RouteEventDescriptor['name'],\n\tstate: RouteEventDescriptor['state'],\n\tcallback: ListenerCallback\n) {\n\treturn registerWindowEventListener( `elementor/routes/${ state }`, ( e ) => {\n\t\tconst shouldRunCallback = e.type === 'route' && e.route.startsWith( route );\n\n\t\tif ( shouldRunCallback ) {\n\t\t\tcallback( e );\n\t\t}\n\t} );\n}\n\nfunction registerWindowEventListener( event: WindowEventDescriptor['name'], callback: ListenerCallback ) {\n\tconst isFirstListener = ! callbacksByEvent.has( event );\n\n\tif ( isFirstListener ) {\n\t\tcallbacksByEvent.set( event, [] );\n\n\t\taddListener( event );\n\t}\n\n\tcallbacksByEvent.get( event )?.push( callback );\n\n\treturn () => {\n\t\tconst callbacks = callbacksByEvent.get( event );\n\n\t\tif ( ! callbacks?.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst filtered = callbacks.filter( ( cb ) => cb !== callback );\n\n\t\tcallbacksByEvent.set( event, filtered );\n\t};\n}\n\nfunction addListener( event: EventDescriptor['name'] ) {\n\twindow.addEventListener(\n\t\tevent,\n\t\tmakeEventHandler( event ),\n\t\t{ signal: abortController.signal }\n\t);\n}\n\nfunction makeEventHandler( event: EventDescriptor['name'] ): EventListener {\n\treturn ( e ) => {\n\t\tif ( ! isReady() ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst normalizedEvent = normalizeEvent( e );\n\n\t\tcallbacksByEvent.get( event )?.forEach( ( callback ) => {\n\t\t\tcallback( normalizedEvent );\n\t\t} );\n\t};\n}\n","import { ExtendedWindow } from './types';\n\nexport function isRouteActive( route: string ) {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn !! extendedWindow.$e?.routes?.isPartOf( route );\n}\n\nexport function getCurrentEditMode() {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn extendedWindow.elementor?.channels?.dataEditMode?.request?.( 'activeMode' );\n}\n","import useListenTo from './use-listen-to';\nimport { getCurrentEditMode } from '../readers';\nimport { editModeChangeEvent } from '../listeners';\n\nexport default function useIsPreviewMode() {\n\treturn useListenTo(\n\t\teditModeChangeEvent(),\n\t\t() => getCurrentEditMode() === 'preview'\n\t);\n}\n","import useListenTo from './use-listen-to';\nimport { isRouteActive } from '../readers';\nimport { routeCloseEvent, routeOpenEvent, RouteEventDescriptor } from '../listeners';\n\nexport default function useIsRouteActive( route: RouteEventDescriptor['name'] ) {\n\treturn useListenTo(\n\t\t[\n\t\t\trouteOpenEvent( route ),\n\t\t\trouteCloseEvent( route ),\n\t\t],\n\t\t() => isRouteActive( route ),\n\t\t[ route ]\n\t);\n}\n","import useIsPreviewMode from './use-is-preview-mode';\nimport useIsRouteActive from './use-is-route-active';\nimport { RouteEventDescriptor } from '../listeners';\n\ntype Options = {\n\tblockOnKitRoutes?: boolean,\n\tblockOnPreviewMode?: boolean,\n}\n\nexport default function useRouteStatus(\n\troute: RouteEventDescriptor['name'],\n\t{\n\t\tblockOnKitRoutes = true,\n\t\tblockOnPreviewMode = true,\n\t}: Options = {}\n) {\n\tconst isRouteActive = useIsRouteActive( route );\n\tconst isKitRouteActive = useIsRouteActive( 'panel/global' );\n\tconst isPreviewMode = useIsPreviewMode();\n\n\tconst isActive = isRouteActive && ! ( blockOnPreviewMode && isPreviewMode );\n\n\tconst isBlocked = (\n\t\t( blockOnPreviewMode && isPreviewMode ) ||\n\t\t( blockOnKitRoutes && isKitRouteActive )\n\t);\n\n\treturn {\n\t\tisActive,\n\t\tisBlocked,\n\t};\n}\n"],"mappings":"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","names":["isRouteActive"]}

package/package.json

@@ -0,0 +1,38 @@
+{
+	"name": "@elementor/editor-v1-adapters",
+	"version": "0.1.0",
+	"private": false,
+	"author": "Elementor Team",
+	"homepage": "https://elementor.com/",
+	"license": "GPL-3.0-or-later",
+	"main": "dist/index.js",
+	"module": "dist/index.mjs",
+	"types": "dist/index.d.ts",
+	"exports": {
+		".": {
+			"import": "./dist/index.mjs",
+			"require": "./dist/index.js",
+			"types": "./dist/index.d.ts"
+		},
+		"./package.json": "./package.json"
+	},
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/elementor/elementor-packages.git",
+		"directory": "packages/editor-v1-adapters"
+	},
+	"bugs": {
+		"url": "https://github.com/elementor/elementor-packages/issues"
+	},
+	"publishConfig": {
+		"access": "public"
+	},
+	"scripts": {
+		"build": "tsup --config=../../tsup.build.ts",
+		"dev": "tsup --config=../../tsup.dev.ts"
+	},
+	"peerDependencies": {
+		"react": "17.x"
+	},
+	"gitHead": "2ba9f13a9dbd085eb6ed8e6e303e9275ce626b8d"
+}

package/src/__tests__/utils.ts

@@ -0,0 +1,39 @@
+export function dispatchCommandBefore( command: string ) {
+	window.dispatchEvent( new CustomEvent( 'elementor/commands/run/before', {
+		detail: {
+			command,
+		},
+	} ) );
+}
+
+export function dispatchCommandAfter( command: string ) {
+	window.dispatchEvent( new CustomEvent( 'elementor/commands/run/after', {
+		detail: {
+			command,
+		},
+	} ) );
+}
+
+export function dispatchRouteOpen( route: string ) {
+	window.dispatchEvent( new CustomEvent( 'elementor/routes/open', {
+		detail: {
+			route,
+		},
+	} ) );
+}
+
+export function dispatchRouteClose( route: string ) {
+	window.dispatchEvent( new CustomEvent( 'elementor/routes/close', {
+		detail: {
+			route,
+		},
+	} ) );
+}
+
+export function dispatchEditModeChange() {
+	window.dispatchEvent( new CustomEvent( 'elementor/edit-mode/change' ) );
+}
+
+export function dispatchWindowEvent( event: string ) {
+	window.dispatchEvent( new CustomEvent( event ) );
+}

package/src/dispatchers/__tests__/index.test.ts

@@ -0,0 +1,126 @@
+import { openRoute, runCommand } from '../';
+
+type ExtendedWindow = Window & {
+	$e: {
+		run: jest.Mock;
+		route: jest.Mock;
+	},
+}
+
+describe( '@elementor/editor-v1-adapters/dispatchers', () => {
+	let eRun: jest.Mock,
+		eRoute: jest.Mock;
+
+	beforeEach( () => {
+		const extendedWindow = window as unknown as ExtendedWindow;
+
+		extendedWindow.$e = {
+			run: jest.fn(),
+			route: jest.fn(),
+		};
+
+		eRun = extendedWindow.$e.run;
+		eRoute = extendedWindow.$e.route;
+	} );
+
+	it( 'should run a V1 command that returns Promise', () => {
+		// Arrange.
+		const command = 'editor/documents/open',
+			args = { test: 'arg' };
+
+		eRun.mockReturnValue( Promise.resolve( 'result' ) );
+
+		// Act.
+		const result = runCommand( command, args );
+
+		// Assert.
+		expect( eRun ).toHaveBeenCalledWith( command, args );
+		expect( result ).toEqual( Promise.resolve( 'result' ) );
+	} );
+
+	it( 'should run a V1 command that returns jQuery.Deferred object', () => {
+		// Arrange.
+		const command = 'editor/documents/open',
+			args = { test: 'arg' };
+
+		eRun.mockReturnValue( makeJQueryDeferred( 'result' ) );
+
+		// Act.
+		const result = runCommand( command, args );
+
+		// Assert.
+		expect( eRun ).toHaveBeenCalledWith( command, args );
+		expect( result ).toEqual( Promise.resolve( 'result' ) );
+	} );
+
+	it( 'should run a V1 command that returns a plain value', () => {
+		// Arrange.
+		const command = 'editor/documents/open',
+			args = { test: 'arg' };
+
+		eRun.mockReturnValue( 'result' );
+
+		// Act.
+		const result = runCommand( command, args );
+
+		// Assert.
+		expect( eRun ).toHaveBeenCalledWith( command, args );
+		expect( result ).toEqual( Promise.resolve( 'result' ) );
+	} );
+
+	it( 'should reject when trying to run a V1 command and `$e.run()` is unavailable', () => {
+		// Arrange.
+		delete ( window as { $e?: unknown } ).$e;
+
+		// Act & Assert.
+		expect( () => runCommand( 'editor/documents/open' ) )
+			.rejects
+			.toEqual( '`$e.run()` is not available' );
+	} );
+
+	it( 'should open a V1 route', () => {
+		// Arrange.
+		const route = 'test/route';
+
+		// Act.
+		const result = openRoute( route );
+
+		// Assert.
+		expect( eRoute ).toHaveBeenCalledWith( route );
+		expect( result ).toEqual( Promise.resolve() );
+	} );
+
+	it( 'should reject when failing to open a V1 route', () => {
+		// Arrange.
+		const route = 'test/route';
+
+		eRoute.mockImplementation( ( r: string ) => {
+			throw `Cannot find ${ r }`;
+		} );
+
+		// Act.
+		expect( () => openRoute( route ) )
+			.rejects
+			.toEqual( 'Cannot find test/route' );
+	} );
+
+	it( 'should reject when trying to open a V1 route and `$e.route()` is unavailable', () => {
+		// Arrange.
+		delete ( window as { $e?: unknown } ).$e;
+
+		// Act & Assert.
+		expect( () => openRoute( 'test/route' ) )
+			.rejects
+			.toEqual( '`$e.route()` is not available' );
+	} );
+} );
+
+function makeJQueryDeferred( value: unknown ) {
+	return {
+		then: () => value,
+		promise: () => value,
+		fail: () => {
+			throw 'Error';
+		},
+	};
+}

package/src/dispatchers/dispatchers.ts

@@ -0,0 +1,38 @@
+import { ExtendedWindow } from './types';
+import { isJQueryDeferred, promisifyJQueryDeferred } from './utils';
+
+export function runCommand( command: string, args?: object ) {
+	const extendedWindow = window as unknown as ExtendedWindow;
+
+	if ( ! extendedWindow.$e?.run ) {
+		return Promise.reject( '`$e.run()` is not available' );
+	}
+
+	const result = extendedWindow.$e.run( command, args );
+
+	if ( result instanceof Promise ) {
+		return result;
+	}
+
+	if ( isJQueryDeferred( result ) ) {
+		return promisifyJQueryDeferred( result );
+	}
+
+	return Promise.resolve( result );
+}
+
+export function openRoute( route: string ) {
+	const extendedWindow = window as unknown as ExtendedWindow;
+
+	if ( ! extendedWindow.$e?.route ) {
+		return Promise.reject( '`$e.route()` is not available' );
+	}
+
+	try {
+		return Promise.resolve(
+			extendedWindow.$e.route( route )
+		);
+	} catch ( e ) {
+		return Promise.reject( e );
+	}
+}

package/src/dispatchers/index.ts

@@ -0,0 +1 @@
+export * from './dispatchers';

package/src/dispatchers/types.ts

@@ -0,0 +1,10 @@
+export type jQueryDeferred<T> = {
+	then<U>( onFulfill: ( value: T ) => U, onReject?: ( error: unknown ) => U ): jQueryDeferred<U>;
+};
+
+export type ExtendedWindow = Window & {
+	$e: {
+		run: ( command: string, args?: object ) => unknown;
+		route: ( route: string ) => void;
+	},
+}

package/src/dispatchers/utils.ts

@@ -0,0 +1,18 @@
+import { jQueryDeferred } from './types';
+
+export function isJQueryDeferred<T>( value: unknown ): value is jQueryDeferred<T> {
+	// TODO: Copied from:
+	//  https://github.com/elementor/elementor/blob/6a74fc9/modules/web-cli/assets/js/core/commands.js#L410
+
+	return ( !! value ) &&
+		'object' === typeof value &&
+		Object.hasOwn( value, 'promise' ) &&
+		Object.hasOwn( value, 'then' ) &&
+		Object.hasOwn( value, 'fail' );
+}
+
+export function promisifyJQueryDeferred<T>( deferred: jQueryDeferred<T> ): Promise<T> {
+	return new Promise( ( resolve, reject ) => {
+		deferred.then( resolve, reject );
+	} );
+}

package/src/hooks/__tests__/test-utils.ts

@@ -0,0 +1,21 @@
+import { EditMode, ExtendedWindow } from '../../readers/types';
+
+const extendedWindow = window as unknown as ExtendedWindow;
+
+export function mockIsRouteActive( implementation: ( route: string ) => boolean ) {
+	extendedWindow.$e = {
+		routes: {
+			isPartOf: jest.fn( implementation ),
+		},
+	};
+}
+
+export function mockGetCurrentEditMode( implementation: () => EditMode ) {
+	extendedWindow.elementor = {
+		channels: {
+			dataEditMode: {
+				request: jest.fn( implementation ),
+			},
+		},
+	};
+}

package/src/hooks/__tests__/use-is-preview-mode.test.ts

@@ -0,0 +1,47 @@
+import { act, renderHook } from '@testing-library/react-hooks';
+import { useIsPreviewMode } from '../../';
+import { dispatchEditModeChange } from '../../__tests__/utils';
+import { mockGetCurrentEditMode } from './test-utils';
+
+describe( '@elementor/editor-v1-adapters - useIsPreviewMode', () => {
+	it.each( [
+		{ mode: 'preview', expected: true },
+		{ mode: 'edit', expected: false },
+		{ mode: 'picker', expected: false },
+	] as const )( 'should return $expected when the current edit mode is $mode', ( { mode, expected } ) => {
+		// Arrange.
+		mockGetCurrentEditMode( () => mode );
+
+		// Act.
+		const { result } = renderHook( () => useIsPreviewMode() );
+
+		// Assert.
+		expect( result.current ).toBe( expected );
+	} );
+
+	it( 'should update the state when the edit mode changes', () => {
+		// Arrange.
+		const { result } = renderHook( () => useIsPreviewMode() );
+
+		// Assert.
+		expect( result.current ).toBe( false );
+
+		// Act.
+		act( () => {
+			mockGetCurrentEditMode( () => 'preview' );
+			dispatchEditModeChange();
+		} );
+
+		// Assert.
+		expect( result.current ).toBe( true );
+
+		// Act.
+		act( () => {
+			mockGetCurrentEditMode( () => 'edit' );
+			dispatchEditModeChange();
+		} );
+
+		// Assert.
+		expect( result.current ).toBe( false );
+	} );
+} );