9
|
1 |
this["wp"] = this["wp"] || {}; this["wp"]["viewport"] = |
|
2 |
/******/ (function(modules) { // webpackBootstrap |
|
3 |
/******/ // The module cache |
|
4 |
/******/ var installedModules = {}; |
|
5 |
/******/ |
|
6 |
/******/ // The require function |
|
7 |
/******/ function __webpack_require__(moduleId) { |
|
8 |
/******/ |
|
9 |
/******/ // Check if module is in cache |
|
10 |
/******/ if(installedModules[moduleId]) { |
|
11 |
/******/ return installedModules[moduleId].exports; |
|
12 |
/******/ } |
|
13 |
/******/ // Create a new module (and put it into the cache) |
|
14 |
/******/ var module = installedModules[moduleId] = { |
|
15 |
/******/ i: moduleId, |
|
16 |
/******/ l: false, |
|
17 |
/******/ exports: {} |
|
18 |
/******/ }; |
|
19 |
/******/ |
|
20 |
/******/ // Execute the module function |
|
21 |
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); |
|
22 |
/******/ |
|
23 |
/******/ // Flag the module as loaded |
|
24 |
/******/ module.l = true; |
|
25 |
/******/ |
|
26 |
/******/ // Return the exports of the module |
|
27 |
/******/ return module.exports; |
|
28 |
/******/ } |
|
29 |
/******/ |
|
30 |
/******/ |
|
31 |
/******/ // expose the modules object (__webpack_modules__) |
|
32 |
/******/ __webpack_require__.m = modules; |
|
33 |
/******/ |
|
34 |
/******/ // expose the module cache |
|
35 |
/******/ __webpack_require__.c = installedModules; |
|
36 |
/******/ |
|
37 |
/******/ // define getter function for harmony exports |
|
38 |
/******/ __webpack_require__.d = function(exports, name, getter) { |
|
39 |
/******/ if(!__webpack_require__.o(exports, name)) { |
|
40 |
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); |
|
41 |
/******/ } |
|
42 |
/******/ }; |
|
43 |
/******/ |
|
44 |
/******/ // define __esModule on exports |
|
45 |
/******/ __webpack_require__.r = function(exports) { |
|
46 |
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { |
|
47 |
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); |
|
48 |
/******/ } |
|
49 |
/******/ Object.defineProperty(exports, '__esModule', { value: true }); |
|
50 |
/******/ }; |
|
51 |
/******/ |
|
52 |
/******/ // create a fake namespace object |
|
53 |
/******/ // mode & 1: value is a module id, require it |
|
54 |
/******/ // mode & 2: merge all properties of value into the ns |
|
55 |
/******/ // mode & 4: return value when already ns object |
|
56 |
/******/ // mode & 8|1: behave like require |
|
57 |
/******/ __webpack_require__.t = function(value, mode) { |
|
58 |
/******/ if(mode & 1) value = __webpack_require__(value); |
|
59 |
/******/ if(mode & 8) return value; |
|
60 |
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; |
|
61 |
/******/ var ns = Object.create(null); |
|
62 |
/******/ __webpack_require__.r(ns); |
|
63 |
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); |
|
64 |
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); |
|
65 |
/******/ return ns; |
|
66 |
/******/ }; |
|
67 |
/******/ |
|
68 |
/******/ // getDefaultExport function for compatibility with non-harmony modules |
|
69 |
/******/ __webpack_require__.n = function(module) { |
|
70 |
/******/ var getter = module && module.__esModule ? |
|
71 |
/******/ function getDefault() { return module['default']; } : |
|
72 |
/******/ function getModuleExports() { return module; }; |
|
73 |
/******/ __webpack_require__.d(getter, 'a', getter); |
|
74 |
/******/ return getter; |
|
75 |
/******/ }; |
|
76 |
/******/ |
|
77 |
/******/ // Object.prototype.hasOwnProperty.call |
|
78 |
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; |
|
79 |
/******/ |
|
80 |
/******/ // __webpack_public_path__ |
|
81 |
/******/ __webpack_require__.p = ""; |
|
82 |
/******/ |
|
83 |
/******/ |
|
84 |
/******/ // Load entry module and return exports |
18
|
85 |
/******/ return __webpack_require__(__webpack_require__.s = "PR0u"); |
9
|
86 |
/******/ }) |
|
87 |
/************************************************************************/ |
|
88 |
/******/ ({ |
|
89 |
|
18
|
90 |
/***/ "1ZqX": |
16
|
91 |
/***/ (function(module, exports) { |
|
92 |
|
18
|
93 |
(function() { module.exports = window["wp"]["data"]; }()); |
16
|
94 |
|
|
95 |
/***/ }), |
|
96 |
|
18
|
97 |
/***/ "GRId": |
9
|
98 |
/***/ (function(module, exports) { |
|
99 |
|
18
|
100 |
(function() { module.exports = window["wp"]["element"]; }()); |
16
|
101 |
|
|
102 |
/***/ }), |
|
103 |
|
18
|
104 |
/***/ "K9lf": |
|
105 |
/***/ (function(module, exports) { |
16
|
106 |
|
18
|
107 |
(function() { module.exports = window["wp"]["compose"]; }()); |
16
|
108 |
|
|
109 |
/***/ }), |
|
110 |
|
18
|
111 |
/***/ "PR0u": |
16
|
112 |
/***/ (function(module, __webpack_exports__, __webpack_require__) { |
|
113 |
|
|
114 |
"use strict"; |
|
115 |
// ESM COMPAT FLAG |
9
|
116 |
__webpack_require__.r(__webpack_exports__); |
16
|
117 |
|
|
118 |
// EXPORTS |
18
|
119 |
__webpack_require__.d(__webpack_exports__, "store", function() { return /* reexport */ store; }); |
16
|
120 |
__webpack_require__.d(__webpack_exports__, "ifViewportMatches", function() { return /* reexport */ if_viewport_matches; }); |
|
121 |
__webpack_require__.d(__webpack_exports__, "withViewportMatch", function() { return /* reexport */ with_viewport_match; }); |
|
122 |
|
|
123 |
// NAMESPACE OBJECT: ./node_modules/@wordpress/viewport/build-module/store/actions.js |
9
|
124 |
var actions_namespaceObject = {}; |
|
125 |
__webpack_require__.r(actions_namespaceObject); |
16
|
126 |
__webpack_require__.d(actions_namespaceObject, "setIsMatching", function() { return actions_setIsMatching; }); |
|
127 |
|
|
128 |
// NAMESPACE OBJECT: ./node_modules/@wordpress/viewport/build-module/store/selectors.js |
9
|
129 |
var selectors_namespaceObject = {}; |
|
130 |
__webpack_require__.r(selectors_namespaceObject); |
|
131 |
__webpack_require__.d(selectors_namespaceObject, "isViewportMatch", function() { return isViewportMatch; }); |
|
132 |
|
18
|
133 |
// EXTERNAL MODULE: external "lodash" |
|
134 |
var external_lodash_ = __webpack_require__("YLtl"); |
|
135 |
|
|
136 |
// EXTERNAL MODULE: external ["wp","data"] |
|
137 |
var external_wp_data_ = __webpack_require__("1ZqX"); |
9
|
138 |
|
|
139 |
// CONCATENATED MODULE: ./node_modules/@wordpress/viewport/build-module/store/reducer.js |
|
140 |
/** |
|
141 |
* Reducer returning the viewport state, as keys of breakpoint queries with |
|
142 |
* boolean value representing whether query is matched. |
|
143 |
* |
|
144 |
* @param {Object} state Current state. |
|
145 |
* @param {Object} action Dispatched action. |
|
146 |
* |
|
147 |
* @return {Object} Updated state. |
|
148 |
*/ |
18
|
149 |
function reducer(state = {}, action) { |
9
|
150 |
switch (action.type) { |
|
151 |
case 'SET_IS_MATCHING': |
|
152 |
return action.values; |
|
153 |
} |
|
154 |
|
|
155 |
return state; |
|
156 |
} |
|
157 |
|
|
158 |
/* harmony default export */ var store_reducer = (reducer); |
|
159 |
|
|
160 |
// CONCATENATED MODULE: ./node_modules/@wordpress/viewport/build-module/store/actions.js |
|
161 |
/** |
|
162 |
* Returns an action object used in signalling that viewport queries have been |
|
163 |
* updated. Values are specified as an object of breakpoint query keys where |
|
164 |
* value represents whether query matches. |
|
165 |
* |
|
166 |
* @param {Object} values Breakpoint query matches. |
|
167 |
* |
|
168 |
* @return {Object} Action object. |
|
169 |
*/ |
16
|
170 |
function actions_setIsMatching(values) { |
9
|
171 |
return { |
|
172 |
type: 'SET_IS_MATCHING', |
18
|
173 |
values |
9
|
174 |
}; |
|
175 |
} |
|
176 |
|
|
177 |
// CONCATENATED MODULE: ./node_modules/@wordpress/viewport/build-module/store/selectors.js |
|
178 |
/** |
|
179 |
* Returns true if the viewport matches the given query, or false otherwise. |
|
180 |
* |
|
181 |
* @param {Object} state Viewport state object. |
|
182 |
* @param {string} query Query string. Includes operator and breakpoint name, |
|
183 |
* space separated. Operator defaults to >=. |
|
184 |
* |
|
185 |
* @example |
|
186 |
* |
|
187 |
* ```js |
|
188 |
* isViewportMatch( state, '< huge' ); |
|
189 |
* isViewPortMatch( state, 'medium' ); |
|
190 |
* ``` |
|
191 |
* |
|
192 |
* @return {boolean} Whether viewport matches query. |
|
193 |
*/ |
|
194 |
function isViewportMatch(state, query) { |
|
195 |
// Default to `>=` if no operator is present. |
|
196 |
if (query.indexOf(' ') === -1) { |
|
197 |
query = '>= ' + query; |
|
198 |
} |
|
199 |
|
|
200 |
return !!state[query]; |
|
201 |
} |
|
202 |
|
|
203 |
// CONCATENATED MODULE: ./node_modules/@wordpress/viewport/build-module/store/index.js |
|
204 |
/** |
|
205 |
* WordPress dependencies |
|
206 |
*/ |
|
207 |
|
|
208 |
/** |
|
209 |
* Internal dependencies |
|
210 |
*/ |
|
211 |
|
|
212 |
|
|
213 |
|
|
214 |
|
18
|
215 |
const STORE_NAME = 'core/viewport'; |
|
216 |
/** |
|
217 |
* Store definition for the viewport namespace. |
|
218 |
* |
|
219 |
* @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#createReduxStore |
|
220 |
* |
|
221 |
* @type {Object} |
|
222 |
*/ |
|
223 |
|
|
224 |
const store = Object(external_wp_data_["createReduxStore"])(STORE_NAME, { |
9
|
225 |
reducer: store_reducer, |
|
226 |
actions: actions_namespaceObject, |
|
227 |
selectors: selectors_namespaceObject |
18
|
228 |
}); |
|
229 |
Object(external_wp_data_["register"])(store); |
9
|
230 |
|
16
|
231 |
// CONCATENATED MODULE: ./node_modules/@wordpress/viewport/build-module/listener.js |
9
|
232 |
/** |
|
233 |
* External dependencies |
|
234 |
*/ |
|
235 |
|
|
236 |
/** |
|
237 |
* WordPress dependencies |
|
238 |
*/ |
|
239 |
|
|
240 |
|
18
|
241 |
/** |
|
242 |
* Internal dependencies |
|
243 |
*/ |
9
|
244 |
|
18
|
245 |
|
|
246 |
|
|
247 |
const addDimensionsEventListener = (breakpoints, operators) => { |
16
|
248 |
/** |
|
249 |
* Callback invoked when media query state should be updated. Is invoked a |
|
250 |
* maximum of one time per call stack. |
|
251 |
*/ |
18
|
252 |
const setIsMatching = Object(external_lodash_["debounce"])(() => { |
|
253 |
const values = Object(external_lodash_["mapValues"])(queries, query => query.matches); |
|
254 |
Object(external_wp_data_["dispatch"])(store).setIsMatching(values); |
16
|
255 |
}, { |
|
256 |
leading: true |
|
257 |
}); |
|
258 |
/** |
|
259 |
* Hash of breakpoint names with generated MediaQueryList for corresponding |
|
260 |
* media query. |
|
261 |
* |
|
262 |
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia |
|
263 |
* @see https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList |
|
264 |
* |
|
265 |
* @type {Object<string,MediaQueryList>} |
|
266 |
*/ |
|
267 |
|
18
|
268 |
const queries = Object(external_lodash_["reduce"])(breakpoints, (result, width, name) => { |
|
269 |
Object(external_lodash_["forEach"])(operators, (condition, operator) => { |
|
270 |
const list = window.matchMedia(`(${condition}: ${width}px)`); |
16
|
271 |
list.addListener(setIsMatching); |
18
|
272 |
const key = [operator, name].join(' '); |
16
|
273 |
result[key] = list; |
|
274 |
}); |
|
275 |
return result; |
|
276 |
}, {}); |
|
277 |
window.addEventListener('orientationchange', setIsMatching); // Set initial values |
|
278 |
|
|
279 |
setIsMatching(); |
|
280 |
setIsMatching.flush(); |
|
281 |
}; |
|
282 |
|
18
|
283 |
/* harmony default export */ var listener = (addDimensionsEventListener); |
16
|
284 |
|
18
|
285 |
// EXTERNAL MODULE: external ["wp","compose"] |
|
286 |
var external_wp_compose_ = __webpack_require__("K9lf"); |
16
|
287 |
|
|
288 |
// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/esm/extends.js |
18
|
289 |
var esm_extends = __webpack_require__("wx14"); |
16
|
290 |
|
18
|
291 |
// EXTERNAL MODULE: external ["wp","element"] |
|
292 |
var external_wp_element_ = __webpack_require__("GRId"); |
16
|
293 |
|
|
294 |
// CONCATENATED MODULE: ./node_modules/@wordpress/viewport/build-module/with-viewport-match.js |
|
295 |
|
|
296 |
|
|
297 |
|
|
298 |
/** |
|
299 |
* External dependencies |
|
300 |
*/ |
|
301 |
|
|
302 |
/** |
|
303 |
* WordPress dependencies |
|
304 |
*/ |
|
305 |
|
|
306 |
|
9
|
307 |
/** |
|
308 |
* Higher-order component creator, creating a new component which renders with |
|
309 |
* the given prop names, where the value passed to the underlying component is |
|
310 |
* the result of the query assigned as the object's value. |
|
311 |
* |
|
312 |
* @see isViewportMatch |
|
313 |
* |
|
314 |
* @param {Object} queries Object of prop name to viewport query. |
|
315 |
* |
|
316 |
* @example |
|
317 |
* |
|
318 |
* ```jsx |
|
319 |
* function MyComponent( { isMobile } ) { |
|
320 |
* return ( |
|
321 |
* <div>Currently: { isMobile ? 'Mobile' : 'Not Mobile' }</div> |
|
322 |
* ); |
|
323 |
* } |
|
324 |
* |
|
325 |
* MyComponent = withViewportMatch( { isMobile: '< small' } )( MyComponent ); |
|
326 |
* ``` |
|
327 |
* |
|
328 |
* @return {Function} Higher-order component. |
|
329 |
*/ |
|
330 |
|
18
|
331 |
const withViewportMatch = queries => { |
|
332 |
const useViewPortQueriesResult = () => Object(external_lodash_["mapValues"])(queries, query => { |
|
333 |
let [operator, breakpointName] = query.split(' '); |
16
|
334 |
|
18
|
335 |
if (breakpointName === undefined) { |
|
336 |
breakpointName = operator; |
|
337 |
operator = '>='; |
|
338 |
} // Hooks should unconditionally execute in the same order, |
|
339 |
// we are respecting that as from the static query of the HOC we generate |
|
340 |
// a hook that calls other hooks always in the same order (because the query never changes). |
|
341 |
// eslint-disable-next-line react-hooks/rules-of-hooks |
16
|
342 |
|
|
343 |
|
18
|
344 |
return Object(external_wp_compose_["useViewportMatch"])(breakpointName, operator); |
|
345 |
}); |
16
|
346 |
|
18
|
347 |
return Object(external_wp_compose_["createHigherOrderComponent"])(WrappedComponent => { |
|
348 |
return Object(external_wp_compose_["pure"])(props => { |
|
349 |
const queriesResult = useViewPortQueriesResult(); |
|
350 |
return Object(external_wp_element_["createElement"])(WrappedComponent, Object(esm_extends["a" /* default */])({}, props, queriesResult)); |
16
|
351 |
}); |
|
352 |
}, 'withViewportMatch'); |
9
|
353 |
}; |
|
354 |
|
18
|
355 |
/* harmony default export */ var with_viewport_match = (withViewportMatch); |
9
|
356 |
|
|
357 |
// CONCATENATED MODULE: ./node_modules/@wordpress/viewport/build-module/if-viewport-matches.js |
|
358 |
/** |
|
359 |
* WordPress dependencies |
|
360 |
*/ |
|
361 |
|
|
362 |
/** |
|
363 |
* Internal dependencies |
|
364 |
*/ |
|
365 |
|
|
366 |
|
|
367 |
/** |
|
368 |
* Higher-order component creator, creating a new component which renders if |
|
369 |
* the viewport query is satisfied. |
|
370 |
* |
|
371 |
* @see withViewportMatches |
|
372 |
* |
|
373 |
* @param {string} query Viewport query. |
|
374 |
* |
|
375 |
* @example |
|
376 |
* |
|
377 |
* ```jsx |
|
378 |
* function MyMobileComponent() { |
|
379 |
* return <div>I'm only rendered on mobile viewports!</div>; |
|
380 |
* } |
|
381 |
* |
|
382 |
* MyMobileComponent = ifViewportMatches( '< small' )( MyMobileComponent ); |
|
383 |
* ``` |
|
384 |
* |
|
385 |
* @return {Function} Higher-order component. |
|
386 |
*/ |
|
387 |
|
18
|
388 |
const ifViewportMatches = query => Object(external_wp_compose_["createHigherOrderComponent"])(Object(external_wp_compose_["compose"])([with_viewport_match({ |
|
389 |
isViewportMatch: query |
|
390 |
}), Object(external_wp_compose_["ifCondition"])(props => props.isViewportMatch)]), 'ifViewportMatches'); |
9
|
391 |
|
18
|
392 |
/* harmony default export */ var if_viewport_matches = (ifViewportMatches); |
9
|
393 |
|
|
394 |
// CONCATENATED MODULE: ./node_modules/@wordpress/viewport/build-module/index.js |
|
395 |
/** |
|
396 |
* Internal dependencies |
|
397 |
*/ |
|
398 |
|
|
399 |
|
|
400 |
|
|
401 |
|
|
402 |
/** |
|
403 |
* Hash of breakpoint names with pixel width at which it becomes effective. |
|
404 |
* |
|
405 |
* @see _breakpoints.scss |
|
406 |
* |
|
407 |
* @type {Object} |
|
408 |
*/ |
|
409 |
|
18
|
410 |
const BREAKPOINTS = { |
9
|
411 |
huge: 1440, |
|
412 |
wide: 1280, |
|
413 |
large: 960, |
|
414 |
medium: 782, |
|
415 |
small: 600, |
|
416 |
mobile: 480 |
|
417 |
}; |
|
418 |
/** |
|
419 |
* Hash of query operators with corresponding condition for media query. |
|
420 |
* |
|
421 |
* @type {Object} |
|
422 |
*/ |
|
423 |
|
18
|
424 |
const OPERATORS = { |
9
|
425 |
'<': 'max-width', |
|
426 |
'>=': 'min-width' |
|
427 |
}; |
16
|
428 |
listener(BREAKPOINTS, OPERATORS); |
9
|
429 |
|
|
430 |
|
|
431 |
/***/ }), |
|
432 |
|
18
|
433 |
/***/ "YLtl": |
|
434 |
/***/ (function(module, exports) { |
|
435 |
|
|
436 |
(function() { module.exports = window["lodash"]; }()); |
|
437 |
|
|
438 |
/***/ }), |
|
439 |
|
|
440 |
/***/ "wx14": |
16
|
441 |
/***/ (function(module, __webpack_exports__, __webpack_require__) { |
|
442 |
|
|
443 |
"use strict"; |
|
444 |
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return _extends; }); |
|
445 |
function _extends() { |
|
446 |
_extends = Object.assign || function (target) { |
|
447 |
for (var i = 1; i < arguments.length; i++) { |
|
448 |
var source = arguments[i]; |
9
|
449 |
|
16
|
450 |
for (var key in source) { |
|
451 |
if (Object.prototype.hasOwnProperty.call(source, key)) { |
|
452 |
target[key] = source[key]; |
|
453 |
} |
|
454 |
} |
|
455 |
} |
|
456 |
|
|
457 |
return target; |
|
458 |
}; |
|
459 |
|
|
460 |
return _extends.apply(this, arguments); |
|
461 |
} |
9
|
462 |
|
|
463 |
/***/ }) |
|
464 |
|
|
465 |
/******/ }); |