[Summary view] [Print] [Text view]

   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
  85  /******/     return __webpack_require__(__webpack_require__.s = "PR0u");
  86  /******/ })
  87  /************************************************************************/
  88  /******/ ({
  89  
  90  /***/ "1ZqX":
  91  /***/ (function(module, exports) {
  92  
  93  (function() { module.exports = window["wp"]["data"]; }());
  94  
  95  /***/ }),
  96  
  97  /***/ "GRId":
  98  /***/ (function(module, exports) {
  99  
 100  (function() { module.exports = window["wp"]["element"]; }());
 101  
 102  /***/ }),
 103  
 104  /***/ "K9lf":
 105  /***/ (function(module, exports) {
 106  
 107  (function() { module.exports = window["wp"]["compose"]; }());
 108  
 109  /***/ }),
 110  
 111  /***/ "PR0u":
 112  /***/ (function(module, __webpack_exports__, __webpack_require__) {
 113  
 114  "use strict";
 115  // ESM COMPAT FLAG
 116  __webpack_require__.r(__webpack_exports__);
 117  
 118  // EXPORTS
 119  __webpack_require__.d(__webpack_exports__, "store", function() { return /* reexport */ store; });
 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
 124  var actions_namespaceObject = {};
 125  __webpack_require__.r(actions_namespaceObject);
 126  __webpack_require__.d(actions_namespaceObject, "setIsMatching", function() { return actions_setIsMatching; });
 127  
 128  // NAMESPACE OBJECT: ./node_modules/@wordpress/viewport/build-module/store/selectors.js
 129  var selectors_namespaceObject = {};
 130  __webpack_require__.r(selectors_namespaceObject);
 131  __webpack_require__.d(selectors_namespaceObject, "isViewportMatch", function() { return isViewportMatch; });
 132  
 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");
 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   */
 149  function reducer(state = {}, action) {
 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   */
 170  function actions_setIsMatching(values) {
 171    return {
 172      type: 'SET_IS_MATCHING',
 173      values
 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  
 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, {
 225    reducer: store_reducer,
 226    actions: actions_namespaceObject,
 227    selectors: selectors_namespaceObject
 228  });
 229  Object(external_wp_data_["register"])(store);
 230  
 231  // CONCATENATED MODULE: ./node_modules/@wordpress/viewport/build-module/listener.js
 232  /**
 233   * External dependencies
 234   */
 235  
 236  /**
 237   * WordPress dependencies
 238   */
 239  
 240  
 241  /**
 242   * Internal dependencies
 243   */
 244  
 245  
 246  
 247  const addDimensionsEventListener = (breakpoints, operators) => {
 248    /**
 249     * Callback invoked when media query state should be updated. Is invoked a
 250     * maximum of one time per call stack.
 251     */
 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);
 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  
 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)`);
 271        list.addListener(setIsMatching);
 272        const key = [operator, name].join(' ');
 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  
 283  /* harmony default export */ var listener = (addDimensionsEventListener);
 284  
 285  // EXTERNAL MODULE: external ["wp","compose"]
 286  var external_wp_compose_ = __webpack_require__("K9lf");
 287  
 288  // EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/esm/extends.js
 289  var esm_extends = __webpack_require__("wx14");
 290  
 291  // EXTERNAL MODULE: external ["wp","element"]
 292  var external_wp_element_ = __webpack_require__("GRId");
 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  
 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  
 331  const withViewportMatch = queries => {
 332    const useViewPortQueriesResult = () => Object(external_lodash_["mapValues"])(queries, query => {
 333      let [operator, breakpointName] = query.split(' ');
 334  
 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
 342  
 343  
 344      return Object(external_wp_compose_["useViewportMatch"])(breakpointName, operator);
 345    });
 346  
 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));
 351      });
 352    }, 'withViewportMatch');
 353  };
 354  
 355  /* harmony default export */ var with_viewport_match = (withViewportMatch);
 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  
 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');
 391  
 392  /* harmony default export */ var if_viewport_matches = (ifViewportMatches);
 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  
 410  const BREAKPOINTS = {
 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  
 424  const OPERATORS = {
 425    '<': 'max-width',
 426    '>=': 'min-width'
 427  };
 428  listener(BREAKPOINTS, OPERATORS);
 429  
 430  
 431  /***/ }),
 432  
 433  /***/ "YLtl":
 434  /***/ (function(module, exports) {
 435  
 436  (function() { module.exports = window["lodash"]; }());
 437  
 438  /***/ }),
 439  
 440  /***/ "wx14":
 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];
 449  
 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  }
 462  
 463  /***/ })
 464  
 465  /******/ });