author | ymh <ymh.work@gmail.com> |
Mon, 08 Sep 2025 19:44:41 +0200 | |
changeset 23 | 417f20492bf7 |
parent 22 | 8c2e4d02f4ef |
permissions | -rw-r--r-- |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
1 |
/******/ (() => { // webpackBootstrap |
19 | 2 |
/******/ "use strict"; |
3 |
/******/ // The require scope |
|
4 |
/******/ var __webpack_require__ = {}; |
|
5 |
/******/ |
|
6 |
/************************************************************************/ |
|
7 |
/******/ /* webpack/runtime/define property getters */ |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
8 |
/******/ (() => { |
19 | 9 |
/******/ // define getter functions for harmony exports |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
10 |
/******/ __webpack_require__.d = (exports, definition) => { |
19 | 11 |
/******/ for(var key in definition) { |
12 |
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) { |
|
13 |
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] }); |
|
14 |
/******/ } |
|
15 |
/******/ } |
|
9 | 16 |
/******/ }; |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
17 |
/******/ })(); |
19 | 18 |
/******/ |
19 |
/******/ /* webpack/runtime/hasOwnProperty shorthand */ |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
20 |
/******/ (() => { |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
21 |
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop)) |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
22 |
/******/ })(); |
19 | 23 |
/******/ |
24 |
/******/ /* webpack/runtime/make namespace object */ |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
25 |
/******/ (() => { |
19 | 26 |
/******/ // define __esModule on exports |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
27 |
/******/ __webpack_require__.r = (exports) => { |
19 | 28 |
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { |
29 |
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); |
|
30 |
/******/ } |
|
31 |
/******/ Object.defineProperty(exports, '__esModule', { value: true }); |
|
32 |
/******/ }; |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
33 |
/******/ })(); |
19 | 34 |
/******/ |
9 | 35 |
/************************************************************************/ |
19 | 36 |
var __webpack_exports__ = {}; |
16 | 37 |
// ESM COMPAT FLAG |
9 | 38 |
__webpack_require__.r(__webpack_exports__); |
16 | 39 |
|
40 |
// EXPORTS |
|
19 | 41 |
__webpack_require__.d(__webpack_exports__, { |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
42 |
ifViewportMatches: () => (/* reexport */ if_viewport_matches), |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
43 |
store: () => (/* reexport */ store), |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
44 |
withViewportMatch: () => (/* reexport */ with_viewport_match) |
19 | 45 |
}); |
16 | 46 |
|
47 |
// NAMESPACE OBJECT: ./node_modules/@wordpress/viewport/build-module/store/actions.js |
|
9 | 48 |
var actions_namespaceObject = {}; |
49 |
__webpack_require__.r(actions_namespaceObject); |
|
19 | 50 |
__webpack_require__.d(actions_namespaceObject, { |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
51 |
setIsMatching: () => (setIsMatching) |
19 | 52 |
}); |
16 | 53 |
|
54 |
// NAMESPACE OBJECT: ./node_modules/@wordpress/viewport/build-module/store/selectors.js |
|
9 | 55 |
var selectors_namespaceObject = {}; |
56 |
__webpack_require__.r(selectors_namespaceObject); |
|
19 | 57 |
__webpack_require__.d(selectors_namespaceObject, { |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
58 |
isViewportMatch: () => (isViewportMatch) |
19 | 59 |
}); |
18 | 60 |
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
61 |
;// external ["wp","compose"] |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
62 |
const external_wp_compose_namespaceObject = window["wp"]["compose"]; |
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
63 |
;// external ["wp","data"] |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
64 |
const external_wp_data_namespaceObject = window["wp"]["data"]; |
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
65 |
;// ./node_modules/@wordpress/viewport/build-module/store/reducer.js |
9 | 66 |
/** |
67 |
* Reducer returning the viewport state, as keys of breakpoint queries with |
|
68 |
* boolean value representing whether query is matched. |
|
69 |
* |
|
70 |
* @param {Object} state Current state. |
|
71 |
* @param {Object} action Dispatched action. |
|
72 |
* |
|
73 |
* @return {Object} Updated state. |
|
74 |
*/ |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
75 |
function reducer(state = {}, action) { |
9 | 76 |
switch (action.type) { |
77 |
case 'SET_IS_MATCHING': |
|
78 |
return action.values; |
|
79 |
} |
|
80 |
return state; |
|
81 |
} |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
82 |
/* harmony default export */ const store_reducer = (reducer); |
9 | 83 |
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
84 |
;// ./node_modules/@wordpress/viewport/build-module/store/actions.js |
9 | 85 |
/** |
86 |
* Returns an action object used in signalling that viewport queries have been |
|
87 |
* updated. Values are specified as an object of breakpoint query keys where |
|
88 |
* value represents whether query matches. |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
89 |
* Ignored from documentation as it is for internal use only. |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
90 |
* |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
91 |
* @ignore |
9 | 92 |
* |
93 |
* @param {Object} values Breakpoint query matches. |
|
94 |
* |
|
95 |
* @return {Object} Action object. |
|
96 |
*/ |
|
19 | 97 |
function setIsMatching(values) { |
9 | 98 |
return { |
99 |
type: 'SET_IS_MATCHING', |
|
18 | 100 |
values |
9 | 101 |
}; |
102 |
} |
|
103 |
||
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
104 |
;// ./node_modules/@wordpress/viewport/build-module/store/selectors.js |
9 | 105 |
/** |
106 |
* Returns true if the viewport matches the given query, or false otherwise. |
|
107 |
* |
|
108 |
* @param {Object} state Viewport state object. |
|
109 |
* @param {string} query Query string. Includes operator and breakpoint name, |
|
110 |
* space separated. Operator defaults to >=. |
|
111 |
* |
|
112 |
* @example |
|
113 |
* |
|
114 |
* ```js |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
115 |
* import { store as viewportStore } from '@wordpress/viewport'; |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
116 |
* import { useSelect } from '@wordpress/data'; |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
117 |
* import { __ } from '@wordpress/i18n'; |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
118 |
* const ExampleComponent = () => { |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
119 |
* const isMobile = useSelect( |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
120 |
* ( select ) => select( viewportStore ).isViewportMatch( '< small' ), |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
121 |
* [] |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
122 |
* ); |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
123 |
* |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
124 |
* return isMobile ? ( |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
125 |
* <div>{ __( 'Mobile' ) }</div> |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
126 |
* ) : ( |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
127 |
* <div>{ __( 'Not Mobile' ) }</div> |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
128 |
* ); |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
129 |
* }; |
9 | 130 |
* ``` |
131 |
* |
|
132 |
* @return {boolean} Whether viewport matches query. |
|
133 |
*/ |
|
134 |
function isViewportMatch(state, query) { |
|
135 |
// Default to `>=` if no operator is present. |
|
136 |
if (query.indexOf(' ') === -1) { |
|
137 |
query = '>= ' + query; |
|
138 |
} |
|
139 |
return !!state[query]; |
|
140 |
} |
|
141 |
||
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
142 |
;// ./node_modules/@wordpress/viewport/build-module/store/index.js |
9 | 143 |
/** |
144 |
* WordPress dependencies |
|
145 |
*/ |
|
146 |
||
147 |
||
18 | 148 |
/** |
149 |
* Internal dependencies |
|
150 |
*/ |
|
9 | 151 |
|
18 | 152 |
|
153 |
||
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
154 |
const STORE_NAME = 'core/viewport'; |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
155 |
|
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
156 |
/** |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
157 |
* Store definition for the viewport namespace. |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
158 |
* |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
159 |
* @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#createReduxStore |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
160 |
* |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
161 |
* @type {Object} |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
162 |
*/ |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
163 |
const store = (0,external_wp_data_namespaceObject.createReduxStore)(STORE_NAME, { |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
164 |
reducer: store_reducer, |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
165 |
actions: actions_namespaceObject, |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
166 |
selectors: selectors_namespaceObject |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
167 |
}); |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
168 |
(0,external_wp_data_namespaceObject.register)(store); |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
169 |
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
170 |
;// ./node_modules/@wordpress/viewport/build-module/listener.js |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
171 |
/** |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
172 |
* WordPress dependencies |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
173 |
*/ |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
174 |
|
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
175 |
|
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
176 |
|
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
177 |
/** |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
178 |
* Internal dependencies |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
179 |
*/ |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
180 |
|
18 | 181 |
const addDimensionsEventListener = (breakpoints, operators) => { |
16 | 182 |
/** |
183 |
* Callback invoked when media query state should be updated. Is invoked a |
|
184 |
* maximum of one time per call stack. |
|
185 |
*/ |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
186 |
const setIsMatching = (0,external_wp_compose_namespaceObject.debounce)(() => { |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
187 |
const values = Object.fromEntries(queries.map(([key, query]) => [key, query.matches])); |
19 | 188 |
(0,external_wp_data_namespaceObject.dispatch)(store).setIsMatching(values); |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
189 |
}, 0, { |
16 | 190 |
leading: true |
191 |
}); |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
192 |
|
16 | 193 |
/** |
194 |
* Hash of breakpoint names with generated MediaQueryList for corresponding |
|
195 |
* media query. |
|
196 |
* |
|
197 |
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia |
|
198 |
* @see https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList |
|
199 |
* |
|
200 |
* @type {Object<string,MediaQueryList>} |
|
201 |
*/ |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
202 |
const operatorEntries = Object.entries(operators); |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
203 |
const queries = Object.entries(breakpoints).flatMap(([name, width]) => { |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
204 |
return operatorEntries.map(([operator, condition]) => { |
18 | 205 |
const list = window.matchMedia(`(${condition}: ${width}px)`); |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
206 |
list.addEventListener('change', setIsMatching); |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
207 |
return [`${operator} ${name}`, list]; |
16 | 208 |
}); |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
209 |
}); |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
210 |
window.addEventListener('orientationchange', setIsMatching); |
16 | 211 |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
212 |
// Set initial values. |
16 | 213 |
setIsMatching(); |
214 |
setIsMatching.flush(); |
|
215 |
}; |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
216 |
/* harmony default export */ const listener = (addDimensionsEventListener); |
16 | 217 |
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
218 |
;// external "ReactJSXRuntime" |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
219 |
const external_ReactJSXRuntime_namespaceObject = window["ReactJSXRuntime"]; |
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
220 |
;// ./node_modules/@wordpress/viewport/build-module/with-viewport-match.js |
16 | 221 |
/** |
222 |
* WordPress dependencies |
|
223 |
*/ |
|
224 |
||
225 |
||
9 | 226 |
/** |
227 |
* Higher-order component creator, creating a new component which renders with |
|
228 |
* the given prop names, where the value passed to the underlying component is |
|
229 |
* the result of the query assigned as the object's value. |
|
230 |
* |
|
231 |
* @see isViewportMatch |
|
232 |
* |
|
19 | 233 |
* @param {Object} queries Object of prop name to viewport query. |
9 | 234 |
* |
235 |
* @example |
|
236 |
* |
|
237 |
* ```jsx |
|
238 |
* function MyComponent( { isMobile } ) { |
|
239 |
* return ( |
|
240 |
* <div>Currently: { isMobile ? 'Mobile' : 'Not Mobile' }</div> |
|
241 |
* ); |
|
242 |
* } |
|
243 |
* |
|
244 |
* MyComponent = withViewportMatch( { isMobile: '< small' } )( MyComponent ); |
|
245 |
* ``` |
|
246 |
* |
|
247 |
* @return {Function} Higher-order component. |
|
248 |
*/ |
|
249 |
||
18 | 250 |
const withViewportMatch = queries => { |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
251 |
const queryEntries = Object.entries(queries); |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
252 |
const useViewPortQueriesResult = () => Object.fromEntries(queryEntries.map(([key, query]) => { |
18 | 253 |
let [operator, breakpointName] = query.split(' '); |
254 |
if (breakpointName === undefined) { |
|
255 |
breakpointName = operator; |
|
256 |
operator = '>='; |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
257 |
} |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
258 |
// Hooks should unconditionally execute in the same order, |
18 | 259 |
// we are respecting that as from the static query of the HOC we generate |
260 |
// a hook that calls other hooks always in the same order (because the query never changes). |
|
261 |
// eslint-disable-next-line react-hooks/rules-of-hooks |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
262 |
return [key, (0,external_wp_compose_namespaceObject.useViewportMatch)(breakpointName, operator)]; |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
263 |
})); |
19 | 264 |
return (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(WrappedComponent => { |
265 |
return (0,external_wp_compose_namespaceObject.pure)(props => { |
|
18 | 266 |
const queriesResult = useViewPortQueriesResult(); |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
267 |
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, { |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
268 |
...props, |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
269 |
...queriesResult |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
270 |
}); |
16 | 271 |
}); |
272 |
}, 'withViewportMatch'); |
|
9 | 273 |
}; |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
274 |
/* harmony default export */ const with_viewport_match = (withViewportMatch); |
9 | 275 |
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
276 |
;// ./node_modules/@wordpress/viewport/build-module/if-viewport-matches.js |
9 | 277 |
/** |
278 |
* WordPress dependencies |
|
279 |
*/ |
|
280 |
||
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
281 |
|
9 | 282 |
/** |
283 |
* Internal dependencies |
|
284 |
*/ |
|
285 |
||
286 |
||
287 |
/** |
|
288 |
* Higher-order component creator, creating a new component which renders if |
|
289 |
* the viewport query is satisfied. |
|
290 |
* |
|
291 |
* @see withViewportMatches |
|
292 |
* |
|
293 |
* @param {string} query Viewport query. |
|
294 |
* |
|
295 |
* @example |
|
296 |
* |
|
297 |
* ```jsx |
|
298 |
* function MyMobileComponent() { |
|
299 |
* return <div>I'm only rendered on mobile viewports!</div>; |
|
300 |
* } |
|
301 |
* |
|
302 |
* MyMobileComponent = ifViewportMatches( '< small' )( MyMobileComponent ); |
|
303 |
* ``` |
|
304 |
* |
|
305 |
* @return {Function} Higher-order component. |
|
306 |
*/ |
|
19 | 307 |
const ifViewportMatches = query => (0,external_wp_compose_namespaceObject.createHigherOrderComponent)((0,external_wp_compose_namespaceObject.compose)([with_viewport_match({ |
18 | 308 |
isViewportMatch: query |
19 | 309 |
}), (0,external_wp_compose_namespaceObject.ifCondition)(props => props.isViewportMatch)]), 'ifViewportMatches'); |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
310 |
/* harmony default export */ const if_viewport_matches = (ifViewportMatches); |
9 | 311 |
|
22
8c2e4d02f4ef
Update WordPress to latest version (6.7)
ymh <ymh.work@gmail.com>
parents:
21
diff
changeset
|
312 |
;// ./node_modules/@wordpress/viewport/build-module/index.js |
9 | 313 |
/** |
314 |
* Internal dependencies |
|
315 |
*/ |
|
316 |
||
317 |
||
318 |
||
319 |
||
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
320 |
|
9 | 321 |
/** |
322 |
* Hash of breakpoint names with pixel width at which it becomes effective. |
|
323 |
* |
|
324 |
* @see _breakpoints.scss |
|
325 |
* |
|
326 |
* @type {Object} |
|
327 |
*/ |
|
18 | 328 |
const BREAKPOINTS = { |
9 | 329 |
huge: 1440, |
330 |
wide: 1280, |
|
331 |
large: 960, |
|
332 |
medium: 782, |
|
333 |
small: 600, |
|
334 |
mobile: 480 |
|
335 |
}; |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
336 |
|
9 | 337 |
/** |
338 |
* Hash of query operators with corresponding condition for media query. |
|
339 |
* |
|
340 |
* @type {Object} |
|
341 |
*/ |
|
18 | 342 |
const OPERATORS = { |
9 | 343 |
'<': 'max-width', |
344 |
'>=': 'min-width' |
|
345 |
}; |
|
16 | 346 |
listener(BREAKPOINTS, OPERATORS); |
9 | 347 |
|
19 | 348 |
(window.wp = window.wp || {}).viewport = __webpack_exports__; |
349 |
/******/ })() |
|
350 |
; |