[Summary view] [Print] [Text view]

   1  "use strict";
   2  var wp;
   3  (wp ||= {}).viewport = (() => {
   4    var __create = Object.create;
   5    var __defProp = Object.defineProperty;
   6    var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
   7    var __getOwnPropNames = Object.getOwnPropertyNames;
   8    var __getProtoOf = Object.getPrototypeOf;
   9    var __hasOwnProp = Object.prototype.hasOwnProperty;
  10    var __commonJS = (cb, mod) => function __require() {
  11      return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
  12    };
  13    var __export = (target, all) => {
  14      for (var name in all)
  15        __defProp(target, name, { get: all[name], enumerable: true });
  16    };
  17    var __copyProps = (to, from, except, desc) => {
  18      if (from && typeof from === "object" || typeof from === "function") {
  19        for (let key of __getOwnPropNames(from))
  20          if (!__hasOwnProp.call(to, key) && key !== except)
  21            __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  22      }
  23      return to;
  24    };
  25    var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  26      // If the importer is in node compatibility mode or this is not an ESM
  27      // file that has been converted to a CommonJS file using a Babel-
  28      // compatible transform (i.e. "__esModule" has not been set), then set
  29      // "default" to the CommonJS "module.exports" for node compatibility.
  30      isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  31      mod
  32    ));
  33    var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
  34  
  35    // package-external:@wordpress/compose
  36    var require_compose = __commonJS({
  37      "package-external:@wordpress/compose"(exports, module) {
  38        module.exports = window.wp.compose;
  39      }
  40    });
  41  
  42    // package-external:@wordpress/data
  43    var require_data = __commonJS({
  44      "package-external:@wordpress/data"(exports, module) {
  45        module.exports = window.wp.data;
  46      }
  47    });
  48  
  49    // package-external:@wordpress/element
  50    var require_element = __commonJS({
  51      "package-external:@wordpress/element"(exports, module) {
  52        module.exports = window.wp.element;
  53      }
  54    });
  55  
  56    // packages/viewport/build-module/index.mjs
  57    var index_exports = {};
  58    __export(index_exports, {
  59      ifViewportMatches: () => if_viewport_matches_default,
  60      store: () => store,
  61      withViewportMatch: () => with_viewport_match_default
  62    });
  63  
  64    // packages/viewport/build-module/listener.mjs
  65    var import_compose = __toESM(require_compose(), 1);
  66    var import_data2 = __toESM(require_data(), 1);
  67  
  68    // packages/viewport/build-module/store/index.mjs
  69    var import_data = __toESM(require_data(), 1);
  70  
  71    // packages/viewport/build-module/store/reducer.mjs
  72    function reducer(state = {}, action) {
  73      switch (action.type) {
  74        case "SET_IS_MATCHING":
  75          return action.values;
  76      }
  77      return state;
  78    }
  79    var reducer_default = reducer;
  80  
  81    // packages/viewport/build-module/store/actions.mjs
  82    var actions_exports = {};
  83    __export(actions_exports, {
  84      setIsMatching: () => setIsMatching
  85    });
  86    function setIsMatching(values) {
  87      return {
  88        type: "SET_IS_MATCHING",
  89        values
  90      };
  91    }
  92  
  93    // packages/viewport/build-module/store/selectors.mjs
  94    var selectors_exports = {};
  95    __export(selectors_exports, {
  96      isViewportMatch: () => isViewportMatch
  97    });
  98    function isViewportMatch(state, query) {
  99      if (query.indexOf(" ") === -1) {
 100        query = ">= " + query;
 101      }
 102      return !!state[query];
 103    }
 104  
 105    // packages/viewport/build-module/store/index.mjs
 106    var STORE_NAME = "core/viewport";
 107    var store = (0, import_data.createReduxStore)(STORE_NAME, {
 108      reducer: reducer_default,
 109      actions: actions_exports,
 110      selectors: selectors_exports
 111    });
 112    (0, import_data.register)(store);
 113  
 114    // packages/viewport/build-module/listener.mjs
 115    var addDimensionsEventListener = (breakpoints, operators) => {
 116      const setIsMatching2 = (0, import_compose.debounce)(
 117        () => {
 118          const values = Object.fromEntries(
 119            queries.map(([key, query]) => [key, query.matches])
 120          );
 121          (0, import_data2.dispatch)(store).setIsMatching(values);
 122        },
 123        0,
 124        { leading: true }
 125      );
 126      const operatorEntries = Object.entries(operators);
 127      const queries = Object.entries(breakpoints).flatMap(
 128        ([name, width]) => {
 129          return operatorEntries.map(
 130            ([operator, condition]) => {
 131              const list = window.matchMedia(
 132                `($condition}: $width}px)`
 133              );
 134              list.addEventListener("change", setIsMatching2);
 135              return [`$operator} $name}`, list];
 136            }
 137          );
 138        }
 139      );
 140      window.addEventListener("orientationchange", setIsMatching2);
 141      setIsMatching2();
 142      setIsMatching2.flush();
 143    };
 144    var listener_default = addDimensionsEventListener;
 145  
 146    // packages/viewport/build-module/if-viewport-matches.mjs
 147    var import_compose3 = __toESM(require_compose(), 1);
 148  
 149    // packages/viewport/build-module/with-viewport-match.mjs
 150    var import_element = __toESM(require_element(), 1);
 151    var import_compose2 = __toESM(require_compose(), 1);
 152    var withViewportMatch = (queries) => {
 153      const queryEntries = Object.entries(queries);
 154      const useViewPortQueriesResult = () => Object.fromEntries(
 155        queryEntries.map(([key, query]) => {
 156          let [operator, breakpointName] = query.split(" ");
 157          if (breakpointName === void 0) {
 158            breakpointName = operator;
 159            operator = ">=";
 160          }
 161          return [
 162            key,
 163            // Hooks should unconditionally execute in the same order,
 164            // we are respecting that as from the static query of the HOC we generate
 165            // a hook that calls other hooks always in the same order (because the query never changes).
 166            // eslint-disable-next-line react-hooks/rules-of-hooks
 167            (0, import_compose2.useViewportMatch)(
 168              breakpointName,
 169              operator
 170            )
 171          ];
 172        })
 173      );
 174      return (0, import_compose2.createHigherOrderComponent)(
 175        (WrappedComponent) => {
 176          return function WithViewportMatch(props) {
 177            const queriesResult = useViewPortQueriesResult();
 178            return (0, import_element.createElement)(WrappedComponent, {
 179              ...props,
 180              ...queriesResult
 181            });
 182          };
 183        },
 184        "withViewportMatch"
 185      );
 186    };
 187    var with_viewport_match_default = withViewportMatch;
 188  
 189    // packages/viewport/build-module/if-viewport-matches.mjs
 190    var ifViewportMatches = (query) => (0, import_compose3.createHigherOrderComponent)(
 191      (0, import_compose3.compose)([
 192        with_viewport_match_default({
 193          isViewportMatch: query
 194        }),
 195        (0, import_compose3.ifCondition)(
 196          (props) => props.isViewportMatch
 197        )
 198      ]),
 199      "ifViewportMatches"
 200    );
 201    var if_viewport_matches_default = ifViewportMatches;
 202  
 203    // packages/viewport/build-module/index.mjs
 204    var BREAKPOINTS = {
 205      huge: 1440,
 206      wide: 1280,
 207      large: 960,
 208      medium: 782,
 209      small: 600,
 210      mobile: 480
 211    };
 212    var OPERATORS = {
 213      "<": "max-width",
 214      ">=": "min-width"
 215    };
 216    listener_default(BREAKPOINTS, OPERATORS);
 217    return __toCommonJS(index_exports);
 218  })();