@elementor/editor-responsive 0.13.3 → 0.13.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -0
- package/dist/index.d.mts +3 -3
- package/dist/index.d.ts +3 -3
- package/dist/index.js +11 -11
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +9 -9
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
- package/src/{sync/get-breakpoints-map.ts → hooks/use-breakpoints-map.ts} +3 -3
- package/src/index.ts +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# Change Log
|
|
2
2
|
|
|
3
|
+
## 0.13.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies [7439d73]
|
|
8
|
+
- @elementor/editor-v1-adapters@0.12.0
|
|
9
|
+
|
|
10
|
+
## 0.13.4
|
|
11
|
+
|
|
12
|
+
### Patch Changes
|
|
13
|
+
|
|
14
|
+
- 3822513: Modify the logic of style renderer and move it to react component
|
|
15
|
+
|
|
3
16
|
## 0.13.3
|
|
4
17
|
|
|
5
18
|
### Patch Changes
|
package/dist/index.d.mts
CHANGED
|
@@ -18,10 +18,10 @@ declare function useActiveBreakpoint(): BreakpointId | null;
|
|
|
18
18
|
|
|
19
19
|
declare function useActivateBreakpoint(): (breakpoint: BreakpointId) => Promise<any>;
|
|
20
20
|
|
|
21
|
+
declare function useBreakpointsMap(): BreakpointsMap;
|
|
22
|
+
|
|
21
23
|
declare function getBreakpoints(): Breakpoint[];
|
|
22
24
|
|
|
23
25
|
declare function getBreakpointsTree(): BreakpointNode;
|
|
24
26
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
export { type Breakpoint, type BreakpointId, type BreakpointNode, type BreakpointSize, type BreakpointsMap, getBreakpoints, getBreakpointsMap, getBreakpointsTree, useActivateBreakpoint, useActiveBreakpoint, useBreakpoints };
|
|
27
|
+
export { type Breakpoint, type BreakpointId, type BreakpointNode, type BreakpointSize, type BreakpointsMap, getBreakpoints, getBreakpointsTree, useActivateBreakpoint, useActiveBreakpoint, useBreakpoints, useBreakpointsMap };
|
package/dist/index.d.ts
CHANGED
|
@@ -18,10 +18,10 @@ declare function useActiveBreakpoint(): BreakpointId | null;
|
|
|
18
18
|
|
|
19
19
|
declare function useActivateBreakpoint(): (breakpoint: BreakpointId) => Promise<any>;
|
|
20
20
|
|
|
21
|
+
declare function useBreakpointsMap(): BreakpointsMap;
|
|
22
|
+
|
|
21
23
|
declare function getBreakpoints(): Breakpoint[];
|
|
22
24
|
|
|
23
25
|
declare function getBreakpointsTree(): BreakpointNode;
|
|
24
26
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
export { type Breakpoint, type BreakpointId, type BreakpointNode, type BreakpointSize, type BreakpointsMap, getBreakpoints, getBreakpointsMap, getBreakpointsTree, useActivateBreakpoint, useActiveBreakpoint, useBreakpoints };
|
|
27
|
+
export { type Breakpoint, type BreakpointId, type BreakpointNode, type BreakpointSize, type BreakpointsMap, getBreakpoints, getBreakpointsTree, useActivateBreakpoint, useActiveBreakpoint, useBreakpoints, useBreakpointsMap };
|
package/dist/index.js
CHANGED
|
@@ -21,11 +21,11 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
21
21
|
var index_exports = {};
|
|
22
22
|
__export(index_exports, {
|
|
23
23
|
getBreakpoints: () => getBreakpoints,
|
|
24
|
-
getBreakpointsMap: () => getBreakpointsMap,
|
|
25
24
|
getBreakpointsTree: () => getBreakpointsTree,
|
|
26
25
|
useActivateBreakpoint: () => useActivateBreakpoint,
|
|
27
26
|
useActiveBreakpoint: () => useActiveBreakpoint,
|
|
28
|
-
useBreakpoints: () => useBreakpoints
|
|
27
|
+
useBreakpoints: () => useBreakpoints,
|
|
28
|
+
useBreakpointsMap: () => useBreakpointsMap
|
|
29
29
|
});
|
|
30
30
|
module.exports = __toCommonJS(index_exports);
|
|
31
31
|
|
|
@@ -107,6 +107,13 @@ function useActivateBreakpoint() {
|
|
|
107
107
|
}, []);
|
|
108
108
|
}
|
|
109
109
|
|
|
110
|
+
// src/hooks/use-breakpoints-map.ts
|
|
111
|
+
function useBreakpointsMap() {
|
|
112
|
+
const breakpoints = useBreakpoints();
|
|
113
|
+
const entries = breakpoints.map((breakpoint) => [breakpoint.id, breakpoint]);
|
|
114
|
+
return Object.fromEntries(entries);
|
|
115
|
+
}
|
|
116
|
+
|
|
110
117
|
// src/sync/get-breakpoints-tree.ts
|
|
111
118
|
function getBreakpointsTree() {
|
|
112
119
|
const { minWidth, defaults, maxWidth } = getBreakpointsByWidths();
|
|
@@ -130,20 +137,13 @@ function getBreakpointsTree() {
|
|
|
130
137
|
buildBranch(maxWidth);
|
|
131
138
|
return rootNode;
|
|
132
139
|
}
|
|
133
|
-
|
|
134
|
-
// src/sync/get-breakpoints-map.ts
|
|
135
|
-
function getBreakpointsMap() {
|
|
136
|
-
const breakpoints = getBreakpoints();
|
|
137
|
-
const entries = breakpoints.map((breakpoint) => [breakpoint.id, breakpoint]);
|
|
138
|
-
return Object.fromEntries(entries);
|
|
139
|
-
}
|
|
140
140
|
// Annotate the CommonJS export names for ESM import in node:
|
|
141
141
|
0 && (module.exports = {
|
|
142
142
|
getBreakpoints,
|
|
143
|
-
getBreakpointsMap,
|
|
144
143
|
getBreakpointsTree,
|
|
145
144
|
useActivateBreakpoint,
|
|
146
145
|
useActiveBreakpoint,
|
|
147
|
-
useBreakpoints
|
|
146
|
+
useBreakpoints,
|
|
147
|
+
useBreakpointsMap
|
|
148
148
|
});
|
|
149
149
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/hooks/use-breakpoints.ts","../src/sync/utils/get-breakpoints-by-widths.ts","../src/sync/get-breakpoints.ts","../src/hooks/use-active-breakpoint.ts","../src/hooks/use-activate-breakpoint.ts","../src/
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/hooks/use-breakpoints.ts","../src/sync/utils/get-breakpoints-by-widths.ts","../src/sync/get-breakpoints.ts","../src/hooks/use-active-breakpoint.ts","../src/hooks/use-activate-breakpoint.ts","../src/hooks/use-breakpoints-map.ts","../src/sync/get-breakpoints-tree.ts"],"sourcesContent":["export { useBreakpoints } from './hooks/use-breakpoints';\nexport { useActiveBreakpoint } from './hooks/use-active-breakpoint';\nexport { useActivateBreakpoint } from './hooks/use-activate-breakpoint';\nexport { useBreakpointsMap } from './hooks/use-breakpoints-map';\nexport { getBreakpoints } from './sync/get-breakpoints';\nexport { getBreakpointsTree } from './sync/get-breakpoints-tree';\n\nexport type { BreakpointId, BreakpointSize, Breakpoint, BreakpointsMap, BreakpointNode } 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 getBreakpointsByWidths(): { minWidth: Breakpoint[]; defaults: Breakpoint[]; maxWidth: Breakpoint[] } {\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\t\tminWidth: [],\n\t\t\tdefaults: [],\n\t\t\tmaxWidth: [],\n\t\t};\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 {\n\t\tminWidth: minWidth.sort( byWidth ),\n\t\tdefaults,\n\t\tmaxWidth: maxWidth.sort( byWidth ),\n\t};\n}\n","import { type Breakpoint } from '../types';\nimport { getBreakpointsByWidths } from './utils/get-breakpoints-by-widths';\n\nexport function getBreakpoints(): Breakpoint[] {\n\tconst { minWidth, defaults, maxWidth } = getBreakpointsByWidths();\n\treturn [ ...minWidth, ...defaults, ...maxWidth ];\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 { useBreakpoints } from './use-breakpoints';\n\nexport function useBreakpointsMap(): BreakpointsMap {\n\tconst breakpoints = useBreakpoints();\n\n\tconst entries = breakpoints.map( ( breakpoint ) => [ breakpoint.id, breakpoint ] );\n\n\treturn Object.fromEntries( entries );\n}\n","import { type Breakpoint, type BreakpointNode } from '../types';\nimport { getBreakpointsByWidths } from './utils/get-breakpoints-by-widths';\n\nexport function getBreakpointsTree(): BreakpointNode {\n\tconst { minWidth, defaults, maxWidth } = getBreakpointsByWidths();\n\n\tconst [ rootBreakpoint ] = defaults;\n\n\tconst rootNode: BreakpointNode = {\n\t\t...rootBreakpoint,\n\t\tchildren: [],\n\t};\n\n\t// gets an array of breakpoints and nest one in the prior breakpoint\n\tconst buildBranch = ( breakpoints: Breakpoint[] ) => {\n\t\tlet last: BreakpointNode = rootNode;\n\n\t\tbreakpoints.forEach( ( breakpoint ) => {\n\t\t\tconst newNode = {\n\t\t\t\t...breakpoint,\n\t\t\t\tchildren: [],\n\t\t\t};\n\n\t\t\tlast.children.push( newNode );\n\n\t\t\tlast = newNode;\n\t\t} );\n\t};\n\n\tbuildBranch( minWidth );\n\tbuildBranch( maxWidth );\n\n\treturn rootNode;\n}\n"],"mappings":"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","names":["useListenTo","import_editor_v1_adapters","useListenTo","import_editor_v1_adapters","runCommand"]}
|
package/dist/index.mjs
CHANGED
|
@@ -76,6 +76,13 @@ function useActivateBreakpoint() {
|
|
|
76
76
|
}, []);
|
|
77
77
|
}
|
|
78
78
|
|
|
79
|
+
// src/hooks/use-breakpoints-map.ts
|
|
80
|
+
function useBreakpointsMap() {
|
|
81
|
+
const breakpoints = useBreakpoints();
|
|
82
|
+
const entries = breakpoints.map((breakpoint) => [breakpoint.id, breakpoint]);
|
|
83
|
+
return Object.fromEntries(entries);
|
|
84
|
+
}
|
|
85
|
+
|
|
79
86
|
// src/sync/get-breakpoints-tree.ts
|
|
80
87
|
function getBreakpointsTree() {
|
|
81
88
|
const { minWidth, defaults, maxWidth } = getBreakpointsByWidths();
|
|
@@ -99,19 +106,12 @@ function getBreakpointsTree() {
|
|
|
99
106
|
buildBranch(maxWidth);
|
|
100
107
|
return rootNode;
|
|
101
108
|
}
|
|
102
|
-
|
|
103
|
-
// src/sync/get-breakpoints-map.ts
|
|
104
|
-
function getBreakpointsMap() {
|
|
105
|
-
const breakpoints = getBreakpoints();
|
|
106
|
-
const entries = breakpoints.map((breakpoint) => [breakpoint.id, breakpoint]);
|
|
107
|
-
return Object.fromEntries(entries);
|
|
108
|
-
}
|
|
109
109
|
export {
|
|
110
110
|
getBreakpoints,
|
|
111
|
-
getBreakpointsMap,
|
|
112
111
|
getBreakpointsTree,
|
|
113
112
|
useActivateBreakpoint,
|
|
114
113
|
useActiveBreakpoint,
|
|
115
|
-
useBreakpoints
|
|
114
|
+
useBreakpoints,
|
|
115
|
+
useBreakpointsMap
|
|
116
116
|
};
|
|
117
117
|
//# sourceMappingURL=index.mjs.map
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/use-breakpoints.ts","../src/sync/utils/get-breakpoints-by-widths.ts","../src/sync/get-breakpoints.ts","../src/hooks/use-active-breakpoint.ts","../src/hooks/use-activate-breakpoint.ts","../src/
|
|
1
|
+
{"version":3,"sources":["../src/hooks/use-breakpoints.ts","../src/sync/utils/get-breakpoints-by-widths.ts","../src/sync/get-breakpoints.ts","../src/hooks/use-active-breakpoint.ts","../src/hooks/use-activate-breakpoint.ts","../src/hooks/use-breakpoints-map.ts","../src/sync/get-breakpoints-tree.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 getBreakpointsByWidths(): { minWidth: Breakpoint[]; defaults: Breakpoint[]; maxWidth: Breakpoint[] } {\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\t\tminWidth: [],\n\t\t\tdefaults: [],\n\t\t\tmaxWidth: [],\n\t\t};\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 {\n\t\tminWidth: minWidth.sort( byWidth ),\n\t\tdefaults,\n\t\tmaxWidth: maxWidth.sort( byWidth ),\n\t};\n}\n","import { type Breakpoint } from '../types';\nimport { getBreakpointsByWidths } from './utils/get-breakpoints-by-widths';\n\nexport function getBreakpoints(): Breakpoint[] {\n\tconst { minWidth, defaults, maxWidth } = getBreakpointsByWidths();\n\treturn [ ...minWidth, ...defaults, ...maxWidth ];\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 { useBreakpoints } from './use-breakpoints';\n\nexport function useBreakpointsMap(): BreakpointsMap {\n\tconst breakpoints = useBreakpoints();\n\n\tconst entries = breakpoints.map( ( breakpoint ) => [ breakpoint.id, breakpoint ] );\n\n\treturn Object.fromEntries( entries );\n}\n","import { type Breakpoint, type BreakpointNode } from '../types';\nimport { getBreakpointsByWidths } from './utils/get-breakpoints-by-widths';\n\nexport function getBreakpointsTree(): BreakpointNode {\n\tconst { minWidth, defaults, maxWidth } = getBreakpointsByWidths();\n\n\tconst [ rootBreakpoint ] = defaults;\n\n\tconst rootNode: BreakpointNode = {\n\t\t...rootBreakpoint,\n\t\tchildren: [],\n\t};\n\n\t// gets an array of breakpoints and nest one in the prior breakpoint\n\tconst buildBranch = ( breakpoints: Breakpoint[] ) => {\n\t\tlet last: BreakpointNode = rootNode;\n\n\t\tbreakpoints.forEach( ( breakpoint ) => {\n\t\t\tconst newNode = {\n\t\t\t\t...breakpoint,\n\t\t\t\tchildren: [],\n\t\t\t};\n\n\t\t\tlast.children.push( newNode );\n\n\t\t\tlast = newNode;\n\t\t} );\n\t};\n\n\tbuildBranch( minWidth );\n\tbuildBranch( maxWidth );\n\n\treturn rootNode;\n}\n"],"mappings":"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","names":["useListenTo"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elementor/editor-responsive",
|
|
3
|
-
"version": "0.13.
|
|
3
|
+
"version": "0.13.5",
|
|
4
4
|
"private": false,
|
|
5
5
|
"author": "Elementor Team",
|
|
6
6
|
"homepage": "https://elementor.com/",
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"dev": "tsup --config=../../tsup.dev.ts"
|
|
40
40
|
},
|
|
41
41
|
"dependencies": {
|
|
42
|
-
"@elementor/editor-v1-adapters": "0.
|
|
42
|
+
"@elementor/editor-v1-adapters": "0.12.0",
|
|
43
43
|
"@wordpress/i18n": "^5.13.0"
|
|
44
44
|
},
|
|
45
45
|
"peerDependencies": {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { type BreakpointsMap } from '../types';
|
|
2
|
-
import {
|
|
2
|
+
import { useBreakpoints } from './use-breakpoints';
|
|
3
3
|
|
|
4
|
-
export function
|
|
5
|
-
const breakpoints =
|
|
4
|
+
export function useBreakpointsMap(): BreakpointsMap {
|
|
5
|
+
const breakpoints = useBreakpoints();
|
|
6
6
|
|
|
7
7
|
const entries = breakpoints.map( ( breakpoint ) => [ breakpoint.id, breakpoint ] );
|
|
8
8
|
|
package/src/index.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
export { useBreakpoints } from './hooks/use-breakpoints';
|
|
2
2
|
export { useActiveBreakpoint } from './hooks/use-active-breakpoint';
|
|
3
3
|
export { useActivateBreakpoint } from './hooks/use-activate-breakpoint';
|
|
4
|
+
export { useBreakpointsMap } from './hooks/use-breakpoints-map';
|
|
4
5
|
export { getBreakpoints } from './sync/get-breakpoints';
|
|
5
6
|
export { getBreakpointsTree } from './sync/get-breakpoints-tree';
|
|
6
|
-
export { getBreakpointsMap } from './sync/get-breakpoints-map';
|
|
7
7
|
|
|
8
8
|
export type { BreakpointId, BreakpointSize, Breakpoint, BreakpointsMap, BreakpointNode } from './types';
|