[Summary view] [Print] [Text view]

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