@elementor/editor-responsive 0.12.2 → 0.12.4

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # Change Log
 
+## 0.12.4
+
+### Patch Changes
+
+- 91453b3: Update and lock dependencies versions
+- Updated dependencies [91453b3]
+  - @elementor/editor-v1-adapters@0.8.5
+
+## 0.12.3
+
+### Patch Changes
+
+- 081bae8: Move the style renderer into editor-canvas and register the elements styles provider in editor-styles-repository
+- 1926fe1: Update dependencies
+
 ## 0.12.2
 
 ### Patch Changes

package/dist/index.d.mts

@@ -9,7 +9,7 @@ type Breakpoint = {
     width?: BreakpointSize;
     type?: 'min-width' | 'max-width';
 };
-type Breakpoints = Record<BreakpointId, Breakpoint>;
+type BreakpointsMap = Record<BreakpointId, Breakpoint>;
 
 declare function useActiveBreakpoint(): BreakpointId | null;
 
@@ -17,4 +17,6 @@ declare function useActivateBreakpoint(): (breakpoint: BreakpointId) => Promise<
 
 declare function getBreakpoints(): Breakpoint[];
 
-export { type Breakpoint, type BreakpointId, type BreakpointSize, type Breakpoints, getBreakpoints, useActivateBreakpoint, useActiveBreakpoint, useBreakpoints };
+declare function getBreakpointsMap(): BreakpointsMap;
+
+export { type Breakpoint, type BreakpointId, type BreakpointSize, type BreakpointsMap, getBreakpoints, getBreakpointsMap, useActivateBreakpoint, useActiveBreakpoint, useBreakpoints };

package/dist/index.d.ts

@@ -9,7 +9,7 @@ type Breakpoint = {
     width?: BreakpointSize;
     type?: 'min-width' | 'max-width';
 };
-type Breakpoints = Record<BreakpointId, Breakpoint>;
+type BreakpointsMap = Record<BreakpointId, Breakpoint>;
 
 declare function useActiveBreakpoint(): BreakpointId | null;
 
@@ -17,4 +17,6 @@ declare function useActivateBreakpoint(): (breakpoint: BreakpointId) => Promise<
 
 declare function getBreakpoints(): Breakpoint[];
 
-export { type Breakpoint, type BreakpointId, type BreakpointSize, type Breakpoints, getBreakpoints, useActivateBreakpoint, useActiveBreakpoint, useBreakpoints };
+declare function getBreakpointsMap(): BreakpointsMap;
+
+export { type Breakpoint, type BreakpointId, type BreakpointSize, type BreakpointsMap, getBreakpoints, getBreakpointsMap, useActivateBreakpoint, useActiveBreakpoint, useBreakpoints };

package/dist/index.js

@@ -21,6 +21,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var src_exports = {};
 __export(src_exports, {
   getBreakpoints: () => getBreakpoints,
+  getBreakpointsMap: () => getBreakpointsMap,
   useActivateBreakpoint: () => useActivateBreakpoint,
   useActiveBreakpoint: () => useActiveBreakpoint,
   useBreakpoints: () => useBreakpoints
@@ -90,9 +91,17 @@ function useActivateBreakpoint() {
     return (0, import_editor_v1_adapters3.__privateRunCommand)("panel/change-device-mode", { device: breakpoint });
   }, []);
 }
+
+// src/sync/get-breakpoints-map.ts
+function getBreakpointsMap() {
+  const breakpoints = getBreakpoints();
+  const entries = breakpoints.map((breakpoint) => [breakpoint.id, breakpoint]);
+  return Object.fromEntries(entries);
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   getBreakpoints,
+  getBreakpointsMap,
   useActivateBreakpoint,
   useActiveBreakpoint,
   useBreakpoints

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/hooks/use-breakpoints.ts","../src/sync/get-breakpoints.ts","../src/hooks/use-active-breakpoint.ts","../src/hooks/use-activate-breakpoint.ts"],"sourcesContent":["export { useBreakpoints } from './hooks/use-breakpoints';\nexport { useActiveBreakpoint } from './hooks/use-active-breakpoint';\nexport { useActivateBreakpoint } from './hooks/use-activate-breakpoint';\nexport { getBreakpoints } from './sync/get-breakpoints';\n\nexport type { BreakpointId, BreakpointSize, Breakpoint, Breakpoints } from './types';\n","import { v1ReadyEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { getBreakpoints } from '../sync/get-breakpoints';\n\nexport function useBreakpoints() {\n\treturn useListenTo( v1ReadyEvent(), getBreakpoints );\n}\n","import { Breakpoint, BreakpointId, ExtendedWindow } from '../types';\nimport { __ } from '@wordpress/i18n';\n\nexport function getBreakpoints() {\n\tconst { breakpoints } = ( window as unknown as ExtendedWindow ).elementor?.config?.responsive || {};\n\n\tif ( ! breakpoints || Object.entries( breakpoints ).length === 0 ) {\n\t\treturn [];\n\t}\n\n\tconst minWidth: Breakpoint[] = [];\n\tconst maxWidth: Breakpoint[] = [];\n\n\tconst defaults: Breakpoint[] = [\n\t\t// Desktop breakpoint is not included in V1 config.\n\t\t{ id: 'desktop', label: __( 'Desktop', 'elementor' ) },\n\t];\n\n\tObject.entries( breakpoints ).forEach( ( [ id, v1Breakpoint ] ) => {\n\t\tif ( ! v1Breakpoint.is_enabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst breakpoint: Breakpoint = {\n\t\t\tid: id as BreakpointId,\n\t\t\tlabel: v1Breakpoint.label,\n\t\t\twidth: v1Breakpoint.value,\n\t\t\ttype: v1Breakpoint.direction === 'min' ? 'min-width' : 'max-width',\n\t\t};\n\n\t\tif ( ! breakpoint.width ) {\n\t\t\tdefaults.push( breakpoint );\n\t\t} else if ( breakpoint.type === 'min-width' ) {\n\t\t\tminWidth.push( breakpoint );\n\t\t} else if ( breakpoint.type === 'max-width' ) {\n\t\t\tmaxWidth.push( breakpoint );\n\t\t}\n\t} );\n\n\tconst byWidth = ( a: Breakpoint, b: Breakpoint ) => {\n\t\treturn a.width && b.width ? b.width - a.width : 0;\n\t};\n\n\treturn [ ...minWidth.sort( byWidth ), ...defaults, ...maxWidth.sort( byWidth ) ];\n}\n","import { __privateUseListenTo as useListenTo, windowEvent } from '@elementor/editor-v1-adapters';\nimport { BreakpointId, ExtendedWindow } from '../types';\n\nexport function useActiveBreakpoint(): BreakpointId | null {\n\treturn useListenTo( windowEvent( 'elementor/device-mode/change' ), getActiveBreakpoint );\n}\n\nfunction getActiveBreakpoint() {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn extendedWindow.elementor?.channels?.deviceMode?.request?.( 'currentMode' ) || null;\n}\n","import { useCallback } from 'react';\nimport { BreakpointId } from '../types';\nimport { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\n\nexport function useActivateBreakpoint() {\n\treturn useCallback( ( breakpoint: BreakpointId ) => {\n\t\treturn runCommand( 'panel/change-device-mode', { device: breakpoint } );\n\t}, [] );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,gCAAkE;;;ACClE,kBAAmB;AAEZ,SAAS,iBAAiB;AAChC,QAAM,EAAE,YAAY,IAAM,OAAsC,WAAW,QAAQ,cAAc,CAAC;AAElG,MAAK,CAAE,eAAe,OAAO,QAAS,WAAY,EAAE,WAAW,GAAI;AAClE,WAAO,CAAC;AAAA,EACT;AAEA,QAAM,WAAyB,CAAC;AAChC,QAAM,WAAyB,CAAC;AAEhC,QAAM,WAAyB;AAAA;AAAA,IAE9B,EAAE,IAAI,WAAW,WAAO,gBAAI,WAAW,WAAY,EAAE;AAAA,EACtD;AAEA,SAAO,QAAS,WAAY,EAAE,QAAS,CAAE,CAAE,IAAI,YAAa,MAAO;AAClE,QAAK,CAAE,aAAa,YAAa;AAChC;AAAA,IACD;AAEA,UAAM,aAAyB;AAAA,MAC9B;AAAA,MACA,OAAO,aAAa;AAAA,MACpB,OAAO,aAAa;AAAA,MACpB,MAAM,aAAa,cAAc,QAAQ,cAAc;AAAA,IACxD;AAEA,QAAK,CAAE,WAAW,OAAQ;AACzB,eAAS,KAAM,UAAW;AAAA,IAC3B,WAAY,WAAW,SAAS,aAAc;AAC7C,eAAS,KAAM,UAAW;AAAA,IAC3B,WAAY,WAAW,SAAS,aAAc;AAC7C,eAAS,KAAM,UAAW;AAAA,IAC3B;AAAA,EACD,CAAE;AAEF,QAAM,UAAU,CAAE,GAAe,MAAmB;AACnD,WAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ;AAAA,EACjD;AAEA,SAAO,CAAE,GAAG,SAAS,KAAM,OAAQ,GAAG,GAAG,UAAU,GAAG,SAAS,KAAM,OAAQ,CAAE;AAChF;;;ADzCO,SAAS,iBAAiB;AAChC,aAAO,0BAAAA,0BAAa,wCAAa,GAAG,cAAe;AACpD;;;AELA,IAAAC,6BAAiE;AAG1D,SAAS,sBAA2C;AAC1D,aAAO,2BAAAC,0BAAa,wCAAa,8BAA+B,GAAG,mBAAoB;AACxF;AAEA,SAAS,sBAAsB;AAC9B,QAAM,iBAAiB;AAEvB,SAAO,eAAe,WAAW,UAAU,YAAY,UAAW,aAAc,KAAK;AACtF;;;ACXA,mBAA4B;AAE5B,IAAAC,6BAAkD;AAE3C,SAAS,wBAAwB;AACvC,aAAO,0BAAa,CAAE,eAA8B;AACnD,eAAO,2BAAAC,qBAAY,4BAA4B,EAAE,QAAQ,WAAW,CAAE;AAAA,EACvE,GAAG,CAAC,CAAE;AACP;","names":["useListenTo","import_editor_v1_adapters","useListenTo","import_editor_v1_adapters","runCommand"]}
+{"version":3,"sources":["../src/index.ts","../src/hooks/use-breakpoints.ts","../src/sync/get-breakpoints.ts","../src/hooks/use-active-breakpoint.ts","../src/hooks/use-activate-breakpoint.ts","../src/sync/get-breakpoints-map.ts"],"sourcesContent":["export { useBreakpoints } from './hooks/use-breakpoints';\nexport { useActiveBreakpoint } from './hooks/use-active-breakpoint';\nexport { useActivateBreakpoint } from './hooks/use-activate-breakpoint';\nexport { getBreakpoints } from './sync/get-breakpoints';\nexport { getBreakpointsMap } from './sync/get-breakpoints-map';\n\nexport type { BreakpointId, BreakpointSize, Breakpoint, BreakpointsMap } from './types';\n","import { __privateUseListenTo as useListenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nimport { getBreakpoints } from '../sync/get-breakpoints';\n\nexport function useBreakpoints() {\n\treturn useListenTo( v1ReadyEvent(), getBreakpoints );\n}\n","import { __ } from '@wordpress/i18n';\n\nimport { type Breakpoint, type BreakpointId, type ExtendedWindow } from '../types';\n\nexport function getBreakpoints() {\n\tconst { breakpoints } = ( window as unknown as ExtendedWindow ).elementor?.config?.responsive || {};\n\n\tif ( ! breakpoints || Object.entries( breakpoints ).length === 0 ) {\n\t\treturn [];\n\t}\n\n\tconst minWidth: Breakpoint[] = [];\n\tconst maxWidth: Breakpoint[] = [];\n\n\tconst defaults: Breakpoint[] = [\n\t\t// Desktop breakpoint is not included in V1 config.\n\t\t{ id: 'desktop', label: __( 'Desktop', 'elementor' ) },\n\t];\n\n\tObject.entries( breakpoints ).forEach( ( [ id, v1Breakpoint ] ) => {\n\t\tif ( ! v1Breakpoint.is_enabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst breakpoint: Breakpoint = {\n\t\t\tid: id as BreakpointId,\n\t\t\tlabel: v1Breakpoint.label,\n\t\t\twidth: v1Breakpoint.value,\n\t\t\ttype: v1Breakpoint.direction === 'min' ? 'min-width' : 'max-width',\n\t\t};\n\n\t\tif ( ! breakpoint.width ) {\n\t\t\tdefaults.push( breakpoint );\n\t\t} else if ( breakpoint.type === 'min-width' ) {\n\t\t\tminWidth.push( breakpoint );\n\t\t} else if ( breakpoint.type === 'max-width' ) {\n\t\t\tmaxWidth.push( breakpoint );\n\t\t}\n\t} );\n\n\tconst byWidth = ( a: Breakpoint, b: Breakpoint ) => {\n\t\treturn a.width && b.width ? b.width - a.width : 0;\n\t};\n\n\treturn [ ...minWidth.sort( byWidth ), ...defaults, ...maxWidth.sort( byWidth ) ];\n}\n","import { __privateUseListenTo as useListenTo, windowEvent } from '@elementor/editor-v1-adapters';\n\nimport { type BreakpointId, type ExtendedWindow } from '../types';\n\nexport function useActiveBreakpoint(): BreakpointId | null {\n\treturn useListenTo( windowEvent( 'elementor/device-mode/change' ), getActiveBreakpoint );\n}\n\nfunction getActiveBreakpoint() {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn extendedWindow.elementor?.channels?.deviceMode?.request?.( 'currentMode' ) || null;\n}\n","import { useCallback } from 'react';\nimport { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\n\nimport { type BreakpointId } from '../types';\n\nexport function useActivateBreakpoint() {\n\treturn useCallback( ( breakpoint: BreakpointId ) => {\n\t\treturn runCommand( 'panel/change-device-mode', { device: breakpoint } );\n\t}, [] );\n}\n","import { type BreakpointsMap } from '../types';\nimport { getBreakpoints } from './get-breakpoints';\n\nexport function getBreakpointsMap(): BreakpointsMap {\n\tconst breakpoints = getBreakpoints();\n\n\tconst entries = breakpoints.map( ( breakpoint ) => [ breakpoint.id, breakpoint ] );\n\n\treturn Object.fromEntries( entries );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,gCAAkE;;;ACAlE,kBAAmB;AAIZ,SAAS,iBAAiB;AAChC,QAAM,EAAE,YAAY,IAAM,OAAsC,WAAW,QAAQ,cAAc,CAAC;AAElG,MAAK,CAAE,eAAe,OAAO,QAAS,WAAY,EAAE,WAAW,GAAI;AAClE,WAAO,CAAC;AAAA,EACT;AAEA,QAAM,WAAyB,CAAC;AAChC,QAAM,WAAyB,CAAC;AAEhC,QAAM,WAAyB;AAAA;AAAA,IAE9B,EAAE,IAAI,WAAW,WAAO,gBAAI,WAAW,WAAY,EAAE;AAAA,EACtD;AAEA,SAAO,QAAS,WAAY,EAAE,QAAS,CAAE,CAAE,IAAI,YAAa,MAAO;AAClE,QAAK,CAAE,aAAa,YAAa;AAChC;AAAA,IACD;AAEA,UAAM,aAAyB;AAAA,MAC9B;AAAA,MACA,OAAO,aAAa;AAAA,MACpB,OAAO,aAAa;AAAA,MACpB,MAAM,aAAa,cAAc,QAAQ,cAAc;AAAA,IACxD;AAEA,QAAK,CAAE,WAAW,OAAQ;AACzB,eAAS,KAAM,UAAW;AAAA,IAC3B,WAAY,WAAW,SAAS,aAAc;AAC7C,eAAS,KAAM,UAAW;AAAA,IAC3B,WAAY,WAAW,SAAS,aAAc;AAC7C,eAAS,KAAM,UAAW;AAAA,IAC3B;AAAA,EACD,CAAE;AAEF,QAAM,UAAU,CAAE,GAAe,MAAmB;AACnD,WAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ;AAAA,EACjD;AAEA,SAAO,CAAE,GAAG,SAAS,KAAM,OAAQ,GAAG,GAAG,UAAU,GAAG,SAAS,KAAM,OAAQ,CAAE;AAChF;;;ADzCO,SAAS,iBAAiB;AAChC,aAAO,0BAAAA,0BAAa,wCAAa,GAAG,cAAe;AACpD;;;AENA,IAAAC,6BAAiE;AAI1D,SAAS,sBAA2C;AAC1D,aAAO,2BAAAC,0BAAa,wCAAa,8BAA+B,GAAG,mBAAoB;AACxF;AAEA,SAAS,sBAAsB;AAC9B,QAAM,iBAAiB;AAEvB,SAAO,eAAe,WAAW,UAAU,YAAY,UAAW,aAAc,KAAK;AACtF;;;ACZA,mBAA4B;AAC5B,IAAAC,6BAAkD;AAI3C,SAAS,wBAAwB;AACvC,aAAO,0BAAa,CAAE,eAA8B;AACnD,eAAO,2BAAAC,qBAAY,4BAA4B,EAAE,QAAQ,WAAW,CAAE;AAAA,EACvE,GAAG,CAAC,CAAE;AACP;;;ACNO,SAAS,oBAAoC;AACnD,QAAM,cAAc,eAAe;AAEnC,QAAM,UAAU,YAAY,IAAK,CAAE,eAAgB,CAAE,WAAW,IAAI,UAAW,CAAE;AAEjF,SAAO,OAAO,YAAa,OAAQ;AACpC;","names":["useListenTo","import_editor_v1_adapters","useListenTo","import_editor_v1_adapters","runCommand"]}

package/dist/index.mjs

@@ -1,5 +1,5 @@
 // src/hooks/use-breakpoints.ts
-import { v1ReadyEvent, __privateUseListenTo as useListenTo } from "@elementor/editor-v1-adapters";
+import { __privateUseListenTo as useListenTo, v1ReadyEvent } from "@elementor/editor-v1-adapters";
 
 // src/sync/get-breakpoints.ts
 import { __ } from "@wordpress/i18n";
@@ -61,8 +61,16 @@ function useActivateBreakpoint() {
     return runCommand("panel/change-device-mode", { device: breakpoint });
   }, []);
 }
+
+// src/sync/get-breakpoints-map.ts
+function getBreakpointsMap() {
+  const breakpoints = getBreakpoints();
+  const entries = breakpoints.map((breakpoint) => [breakpoint.id, breakpoint]);
+  return Object.fromEntries(entries);
+}
 export {
   getBreakpoints,
+  getBreakpointsMap,
   useActivateBreakpoint,
   useActiveBreakpoint,
   useBreakpoints

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/use-breakpoints.ts","../src/sync/get-breakpoints.ts","../src/hooks/use-active-breakpoint.ts","../src/hooks/use-activate-breakpoint.ts"],"sourcesContent":["import { v1ReadyEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { getBreakpoints } from '../sync/get-breakpoints';\n\nexport function useBreakpoints() {\n\treturn useListenTo( v1ReadyEvent(), getBreakpoints );\n}\n","import { Breakpoint, BreakpointId, ExtendedWindow } from '../types';\nimport { __ } from '@wordpress/i18n';\n\nexport function getBreakpoints() {\n\tconst { breakpoints } = ( window as unknown as ExtendedWindow ).elementor?.config?.responsive || {};\n\n\tif ( ! breakpoints || Object.entries( breakpoints ).length === 0 ) {\n\t\treturn [];\n\t}\n\n\tconst minWidth: Breakpoint[] = [];\n\tconst maxWidth: Breakpoint[] = [];\n\n\tconst defaults: Breakpoint[] = [\n\t\t// Desktop breakpoint is not included in V1 config.\n\t\t{ id: 'desktop', label: __( 'Desktop', 'elementor' ) },\n\t];\n\n\tObject.entries( breakpoints ).forEach( ( [ id, v1Breakpoint ] ) => {\n\t\tif ( ! v1Breakpoint.is_enabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst breakpoint: Breakpoint = {\n\t\t\tid: id as BreakpointId,\n\t\t\tlabel: v1Breakpoint.label,\n\t\t\twidth: v1Breakpoint.value,\n\t\t\ttype: v1Breakpoint.direction === 'min' ? 'min-width' : 'max-width',\n\t\t};\n\n\t\tif ( ! breakpoint.width ) {\n\t\t\tdefaults.push( breakpoint );\n\t\t} else if ( breakpoint.type === 'min-width' ) {\n\t\t\tminWidth.push( breakpoint );\n\t\t} else if ( breakpoint.type === 'max-width' ) {\n\t\t\tmaxWidth.push( breakpoint );\n\t\t}\n\t} );\n\n\tconst byWidth = ( a: Breakpoint, b: Breakpoint ) => {\n\t\treturn a.width && b.width ? b.width - a.width : 0;\n\t};\n\n\treturn [ ...minWidth.sort( byWidth ), ...defaults, ...maxWidth.sort( byWidth ) ];\n}\n","import { __privateUseListenTo as useListenTo, windowEvent } from '@elementor/editor-v1-adapters';\nimport { BreakpointId, ExtendedWindow } from '../types';\n\nexport function useActiveBreakpoint(): BreakpointId | null {\n\treturn useListenTo( windowEvent( 'elementor/device-mode/change' ), getActiveBreakpoint );\n}\n\nfunction getActiveBreakpoint() {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn extendedWindow.elementor?.channels?.deviceMode?.request?.( 'currentMode' ) || null;\n}\n","import { useCallback } from 'react';\nimport { BreakpointId } from '../types';\nimport { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\n\nexport function useActivateBreakpoint() {\n\treturn useCallback( ( breakpoint: BreakpointId ) => {\n\t\treturn runCommand( 'panel/change-device-mode', { device: breakpoint } );\n\t}, [] );\n}\n"],"mappings":";AAAA,SAAS,cAAc,wBAAwB,mBAAmB;;;ACClE,SAAS,UAAU;AAEZ,SAAS,iBAAiB;AAChC,QAAM,EAAE,YAAY,IAAM,OAAsC,WAAW,QAAQ,cAAc,CAAC;AAElG,MAAK,CAAE,eAAe,OAAO,QAAS,WAAY,EAAE,WAAW,GAAI;AAClE,WAAO,CAAC;AAAA,EACT;AAEA,QAAM,WAAyB,CAAC;AAChC,QAAM,WAAyB,CAAC;AAEhC,QAAM,WAAyB;AAAA;AAAA,IAE9B,EAAE,IAAI,WAAW,OAAO,GAAI,WAAW,WAAY,EAAE;AAAA,EACtD;AAEA,SAAO,QAAS,WAAY,EAAE,QAAS,CAAE,CAAE,IAAI,YAAa,MAAO;AAClE,QAAK,CAAE,aAAa,YAAa;AAChC;AAAA,IACD;AAEA,UAAM,aAAyB;AAAA,MAC9B;AAAA,MACA,OAAO,aAAa;AAAA,MACpB,OAAO,aAAa;AAAA,MACpB,MAAM,aAAa,cAAc,QAAQ,cAAc;AAAA,IACxD;AAEA,QAAK,CAAE,WAAW,OAAQ;AACzB,eAAS,KAAM,UAAW;AAAA,IAC3B,WAAY,WAAW,SAAS,aAAc;AAC7C,eAAS,KAAM,UAAW;AAAA,IAC3B,WAAY,WAAW,SAAS,aAAc;AAC7C,eAAS,KAAM,UAAW;AAAA,IAC3B;AAAA,EACD,CAAE;AAEF,QAAM,UAAU,CAAE,GAAe,MAAmB;AACnD,WAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ;AAAA,EACjD;AAEA,SAAO,CAAE,GAAG,SAAS,KAAM,OAAQ,GAAG,GAAG,UAAU,GAAG,SAAS,KAAM,OAAQ,CAAE;AAChF;;;ADzCO,SAAS,iBAAiB;AAChC,SAAO,YAAa,aAAa,GAAG,cAAe;AACpD;;;AELA,SAAS,wBAAwBA,cAAa,mBAAmB;AAG1D,SAAS,sBAA2C;AAC1D,SAAOA,aAAa,YAAa,8BAA+B,GAAG,mBAAoB;AACxF;AAEA,SAAS,sBAAsB;AAC9B,QAAM,iBAAiB;AAEvB,SAAO,eAAe,WAAW,UAAU,YAAY,UAAW,aAAc,KAAK;AACtF;;;ACXA,SAAS,mBAAmB;AAE5B,SAAS,uBAAuB,kBAAkB;AAE3C,SAAS,wBAAwB;AACvC,SAAO,YAAa,CAAE,eAA8B;AACnD,WAAO,WAAY,4BAA4B,EAAE,QAAQ,WAAW,CAAE;AAAA,EACvE,GAAG,CAAC,CAAE;AACP;","names":["useListenTo"]}
+{"version":3,"sources":["../src/hooks/use-breakpoints.ts","../src/sync/get-breakpoints.ts","../src/hooks/use-active-breakpoint.ts","../src/hooks/use-activate-breakpoint.ts","../src/sync/get-breakpoints-map.ts"],"sourcesContent":["import { __privateUseListenTo as useListenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nimport { getBreakpoints } from '../sync/get-breakpoints';\n\nexport function useBreakpoints() {\n\treturn useListenTo( v1ReadyEvent(), getBreakpoints );\n}\n","import { __ } from '@wordpress/i18n';\n\nimport { type Breakpoint, type BreakpointId, type ExtendedWindow } from '../types';\n\nexport function getBreakpoints() {\n\tconst { breakpoints } = ( window as unknown as ExtendedWindow ).elementor?.config?.responsive || {};\n\n\tif ( ! breakpoints || Object.entries( breakpoints ).length === 0 ) {\n\t\treturn [];\n\t}\n\n\tconst minWidth: Breakpoint[] = [];\n\tconst maxWidth: Breakpoint[] = [];\n\n\tconst defaults: Breakpoint[] = [\n\t\t// Desktop breakpoint is not included in V1 config.\n\t\t{ id: 'desktop', label: __( 'Desktop', 'elementor' ) },\n\t];\n\n\tObject.entries( breakpoints ).forEach( ( [ id, v1Breakpoint ] ) => {\n\t\tif ( ! v1Breakpoint.is_enabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst breakpoint: Breakpoint = {\n\t\t\tid: id as BreakpointId,\n\t\t\tlabel: v1Breakpoint.label,\n\t\t\twidth: v1Breakpoint.value,\n\t\t\ttype: v1Breakpoint.direction === 'min' ? 'min-width' : 'max-width',\n\t\t};\n\n\t\tif ( ! breakpoint.width ) {\n\t\t\tdefaults.push( breakpoint );\n\t\t} else if ( breakpoint.type === 'min-width' ) {\n\t\t\tminWidth.push( breakpoint );\n\t\t} else if ( breakpoint.type === 'max-width' ) {\n\t\t\tmaxWidth.push( breakpoint );\n\t\t}\n\t} );\n\n\tconst byWidth = ( a: Breakpoint, b: Breakpoint ) => {\n\t\treturn a.width && b.width ? b.width - a.width : 0;\n\t};\n\n\treturn [ ...minWidth.sort( byWidth ), ...defaults, ...maxWidth.sort( byWidth ) ];\n}\n","import { __privateUseListenTo as useListenTo, windowEvent } from '@elementor/editor-v1-adapters';\n\nimport { type BreakpointId, type ExtendedWindow } from '../types';\n\nexport function useActiveBreakpoint(): BreakpointId | null {\n\treturn useListenTo( windowEvent( 'elementor/device-mode/change' ), getActiveBreakpoint );\n}\n\nfunction getActiveBreakpoint() {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn extendedWindow.elementor?.channels?.deviceMode?.request?.( 'currentMode' ) || null;\n}\n","import { useCallback } from 'react';\nimport { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\n\nimport { type BreakpointId } from '../types';\n\nexport function useActivateBreakpoint() {\n\treturn useCallback( ( breakpoint: BreakpointId ) => {\n\t\treturn runCommand( 'panel/change-device-mode', { device: breakpoint } );\n\t}, [] );\n}\n","import { type BreakpointsMap } from '../types';\nimport { getBreakpoints } from './get-breakpoints';\n\nexport function getBreakpointsMap(): BreakpointsMap {\n\tconst breakpoints = getBreakpoints();\n\n\tconst entries = breakpoints.map( ( breakpoint ) => [ breakpoint.id, breakpoint ] );\n\n\treturn Object.fromEntries( entries );\n}\n"],"mappings":";AAAA,SAAS,wBAAwB,aAAa,oBAAoB;;;ACAlE,SAAS,UAAU;AAIZ,SAAS,iBAAiB;AAChC,QAAM,EAAE,YAAY,IAAM,OAAsC,WAAW,QAAQ,cAAc,CAAC;AAElG,MAAK,CAAE,eAAe,OAAO,QAAS,WAAY,EAAE,WAAW,GAAI;AAClE,WAAO,CAAC;AAAA,EACT;AAEA,QAAM,WAAyB,CAAC;AAChC,QAAM,WAAyB,CAAC;AAEhC,QAAM,WAAyB;AAAA;AAAA,IAE9B,EAAE,IAAI,WAAW,OAAO,GAAI,WAAW,WAAY,EAAE;AAAA,EACtD;AAEA,SAAO,QAAS,WAAY,EAAE,QAAS,CAAE,CAAE,IAAI,YAAa,MAAO;AAClE,QAAK,CAAE,aAAa,YAAa;AAChC;AAAA,IACD;AAEA,UAAM,aAAyB;AAAA,MAC9B;AAAA,MACA,OAAO,aAAa;AAAA,MACpB,OAAO,aAAa;AAAA,MACpB,MAAM,aAAa,cAAc,QAAQ,cAAc;AAAA,IACxD;AAEA,QAAK,CAAE,WAAW,OAAQ;AACzB,eAAS,KAAM,UAAW;AAAA,IAC3B,WAAY,WAAW,SAAS,aAAc;AAC7C,eAAS,KAAM,UAAW;AAAA,IAC3B,WAAY,WAAW,SAAS,aAAc;AAC7C,eAAS,KAAM,UAAW;AAAA,IAC3B;AAAA,EACD,CAAE;AAEF,QAAM,UAAU,CAAE,GAAe,MAAmB;AACnD,WAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ;AAAA,EACjD;AAEA,SAAO,CAAE,GAAG,SAAS,KAAM,OAAQ,GAAG,GAAG,UAAU,GAAG,SAAS,KAAM,OAAQ,CAAE;AAChF;;;ADzCO,SAAS,iBAAiB;AAChC,SAAO,YAAa,aAAa,GAAG,cAAe;AACpD;;;AENA,SAAS,wBAAwBA,cAAa,mBAAmB;AAI1D,SAAS,sBAA2C;AAC1D,SAAOA,aAAa,YAAa,8BAA+B,GAAG,mBAAoB;AACxF;AAEA,SAAS,sBAAsB;AAC9B,QAAM,iBAAiB;AAEvB,SAAO,eAAe,WAAW,UAAU,YAAY,UAAW,aAAc,KAAK;AACtF;;;ACZA,SAAS,mBAAmB;AAC5B,SAAS,uBAAuB,kBAAkB;AAI3C,SAAS,wBAAwB;AACvC,SAAO,YAAa,CAAE,eAA8B;AACnD,WAAO,WAAY,4BAA4B,EAAE,QAAQ,WAAW,CAAE;AAAA,EACvE,GAAG,CAAC,CAAE;AACP;;;ACNO,SAAS,oBAAoC;AACnD,QAAM,cAAc,eAAe;AAEnC,QAAM,UAAU,YAAY,IAAK,CAAE,eAAgB,CAAE,WAAW,IAAI,UAAW,CAAE;AAEjF,SAAO,OAAO,YAAa,OAAQ;AACpC;","names":["useListenTo"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elementor/editor-responsive",
-  "version": "0.12.2",
+  "version": "0.12.4",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -39,8 +39,8 @@
     "dev": "tsup --config=../../tsup.dev.ts"
   },
   "dependencies": {
-    "@elementor/editor-v1-adapters": "^0.8.3",
-    "@wordpress/i18n": "^4.45.0"
+    "@elementor/editor-v1-adapters": "0.8.5",
+    "@wordpress/i18n": "^5.13.0"
   },
   "peerDependencies": {
     "react": "^18.3.1"

package/src/hooks/use-activate-breakpoint.ts

@@ -1,7 +1,8 @@
 import { useCallback } from 'react';
-import { BreakpointId } from '../types';
 import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';
 
+import { type BreakpointId } from '../types';
+
 export function useActivateBreakpoint() {
 	return useCallback( ( breakpoint: BreakpointId ) => {
 		return runCommand( 'panel/change-device-mode', { device: breakpoint } );

package/src/hooks/use-active-breakpoint.ts

@@ -1,5 +1,6 @@
 import { __privateUseListenTo as useListenTo, windowEvent } from '@elementor/editor-v1-adapters';
-import { BreakpointId, ExtendedWindow } from '../types';
+
+import { type BreakpointId, type ExtendedWindow } from '../types';
 
 export function useActiveBreakpoint(): BreakpointId | null {
 	return useListenTo( windowEvent( 'elementor/device-mode/change' ), getActiveBreakpoint );

package/src/hooks/use-breakpoints.ts

@@ -1,4 +1,5 @@
-import { v1ReadyEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';
+import { __privateUseListenTo as useListenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';
+
 import { getBreakpoints } from '../sync/get-breakpoints';
 
 export function useBreakpoints() {

package/src/index.ts

@@ -2,5 +2,6 @@ export { useBreakpoints } from './hooks/use-breakpoints';
 export { useActiveBreakpoint } from './hooks/use-active-breakpoint';
 export { useActivateBreakpoint } from './hooks/use-activate-breakpoint';
 export { getBreakpoints } from './sync/get-breakpoints';
+export { getBreakpointsMap } from './sync/get-breakpoints-map';
 
-export type { BreakpointId, BreakpointSize, Breakpoint, Breakpoints } from './types';
+export type { BreakpointId, BreakpointSize, Breakpoint, BreakpointsMap } from './types';

package/src/sync/get-breakpoints-map.ts

@@ -0,0 +1,10 @@
+import { type BreakpointsMap } from '../types';
+import { getBreakpoints } from './get-breakpoints';
+
+export function getBreakpointsMap(): BreakpointsMap {
+	const breakpoints = getBreakpoints();
+
+	const entries = breakpoints.map( ( breakpoint ) => [ breakpoint.id, breakpoint ] );
+
+	return Object.fromEntries( entries );
+}

package/src/sync/get-breakpoints.ts

@@ -1,6 +1,7 @@
-import { Breakpoint, BreakpointId, ExtendedWindow } from '../types';
 import { __ } from '@wordpress/i18n';
 
+import { type Breakpoint, type BreakpointId, type ExtendedWindow } from '../types';
+
 export function getBreakpoints() {
 	const { breakpoints } = ( window as unknown as ExtendedWindow ).elementor?.config?.responsive || {};
 

package/src/types.ts

@@ -11,7 +11,7 @@ export type Breakpoint = {
 	type?: 'min-width' | 'max-width';
 };
 
-export type Breakpoints = Record< BreakpointId, Breakpoint >;
+export type BreakpointsMap = Record< BreakpointId, Breakpoint >;
 
 export type V1Breakpoint = {
 	direction: 'min' | 'max';