[Summary view] [Print] [Text view]

   1  /******/ (() => { // webpackBootstrap
   2  /******/     "use strict";
   3  /******/     // The require scope
   4  /******/     var __webpack_require__ = {};
   5  /******/     
   6  /************************************************************************/
   7  /******/     /* webpack/runtime/compat get default export */
   8  /******/     (() => {
   9  /******/         // getDefaultExport function for compatibility with non-harmony modules
  10  /******/         __webpack_require__.n = (module) => {
  11  /******/             var getter = module && module.__esModule ?
  12  /******/                 () => (module['default']) :
  13  /******/                 () => (module);
  14  /******/             __webpack_require__.d(getter, { a: getter });
  15  /******/             return getter;
  16  /******/         };
  17  /******/     })();
  18  /******/     
  19  /******/     /* webpack/runtime/define property getters */
  20  /******/     (() => {
  21  /******/         // define getter functions for harmony exports
  22  /******/         __webpack_require__.d = (exports, definition) => {
  23  /******/             for(var key in definition) {
  24  /******/                 if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
  25  /******/                     Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
  26  /******/                 }
  27  /******/             }
  28  /******/         };
  29  /******/     })();
  30  /******/     
  31  /******/     /* webpack/runtime/hasOwnProperty shorthand */
  32  /******/     (() => {
  33  /******/         __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
  34  /******/     })();
  35  /******/     
  36  /******/     /* webpack/runtime/make namespace object */
  37  /******/     (() => {
  38  /******/         // define __esModule on exports
  39  /******/         __webpack_require__.r = (exports) => {
  40  /******/             if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
  41  /******/                 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
  42  /******/             }
  43  /******/             Object.defineProperty(exports, '__esModule', { value: true });
  44  /******/         };
  45  /******/     })();
  46  /******/     
  47  /************************************************************************/
  48  var __webpack_exports__ = {};
  49  // ESM COMPAT FLAG
  50  __webpack_require__.r(__webpack_exports__);
  51  
  52  // EXPORTS
  53  __webpack_require__.d(__webpack_exports__, {
  54    PreferenceToggleMenuItem: () => (/* reexport */ PreferenceToggleMenuItem),
  55    privateApis: () => (/* reexport */ privateApis),
  56    store: () => (/* reexport */ store)
  57  });
  58  
  59  // NAMESPACE OBJECT: ./node_modules/@wordpress/preferences/build-module/store/actions.js
  60  var actions_namespaceObject = {};
  61  __webpack_require__.r(actions_namespaceObject);
  62  __webpack_require__.d(actions_namespaceObject, {
  63    set: () => (set),
  64    setDefaults: () => (setDefaults),
  65    setPersistenceLayer: () => (setPersistenceLayer),
  66    toggle: () => (toggle)
  67  });
  68  
  69  // NAMESPACE OBJECT: ./node_modules/@wordpress/preferences/build-module/store/selectors.js
  70  var selectors_namespaceObject = {};
  71  __webpack_require__.r(selectors_namespaceObject);
  72  __webpack_require__.d(selectors_namespaceObject, {
  73    get: () => (get)
  74  });
  75  
  76  ;// external ["wp","data"]
  77  const external_wp_data_namespaceObject = window["wp"]["data"];
  78  ;// external ["wp","components"]
  79  const external_wp_components_namespaceObject = window["wp"]["components"];
  80  ;// external ["wp","i18n"]
  81  const external_wp_i18n_namespaceObject = window["wp"]["i18n"];
  82  ;// external ["wp","primitives"]
  83  const external_wp_primitives_namespaceObject = window["wp"]["primitives"];
  84  ;// external "ReactJSXRuntime"
  85  const external_ReactJSXRuntime_namespaceObject = window["ReactJSXRuntime"];
  86  ;// ./node_modules/@wordpress/icons/build-module/library/check.js
  87  /**
  88   * WordPress dependencies
  89   */
  90  
  91  
  92  const check = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
  93    xmlns: "http://www.w3.org/2000/svg",
  94    viewBox: "0 0 24 24",
  95    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
  96      d: "M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"
  97    })
  98  });
  99  /* harmony default export */ const library_check = (check);
 100  
 101  ;// external ["wp","a11y"]
 102  const external_wp_a11y_namespaceObject = window["wp"]["a11y"];
 103  ;// ./node_modules/@wordpress/preferences/build-module/store/reducer.js
 104  /**
 105   * WordPress dependencies
 106   */
 107  
 108  
 109  /**
 110   * Reducer returning the defaults for user preferences.
 111   *
 112   * This is kept intentionally separate from the preferences
 113   * themselves so that defaults are not persisted.
 114   *
 115   * @param {Object} state  Current state.
 116   * @param {Object} action Dispatched action.
 117   *
 118   * @return {Object} Updated state.
 119   */
 120  function defaults(state = {}, action) {
 121    if (action.type === 'SET_PREFERENCE_DEFAULTS') {
 122      const {
 123        scope,
 124        defaults: values
 125      } = action;
 126      return {
 127        ...state,
 128        [scope]: {
 129          ...state[scope],
 130          ...values
 131        }
 132      };
 133    }
 134    return state;
 135  }
 136  
 137  /**
 138   * Higher order reducer that does the following:
 139   * - Merges any data from the persistence layer into the state when the
 140   *   `SET_PERSISTENCE_LAYER` action is received.
 141   * - Passes any preferences changes to the persistence layer.
 142   *
 143   * @param {Function} reducer The preferences reducer.
 144   *
 145   * @return {Function} The enhanced reducer.
 146   */
 147  function withPersistenceLayer(reducer) {
 148    let persistenceLayer;
 149    return (state, action) => {
 150      // Setup the persistence layer, and return the persisted data
 151      // as the state.
 152      if (action.type === 'SET_PERSISTENCE_LAYER') {
 153        const {
 154          persistenceLayer: persistence,
 155          persistedData
 156        } = action;
 157        persistenceLayer = persistence;
 158        return persistedData;
 159      }
 160      const nextState = reducer(state, action);
 161      if (action.type === 'SET_PREFERENCE_VALUE') {
 162        persistenceLayer?.set(nextState);
 163      }
 164      return nextState;
 165    };
 166  }
 167  
 168  /**
 169   * Reducer returning the user preferences.
 170   *
 171   * @param {Object} state  Current state.
 172   * @param {Object} action Dispatched action.
 173   *
 174   * @return {Object} Updated state.
 175   */
 176  const preferences = withPersistenceLayer((state = {}, action) => {
 177    if (action.type === 'SET_PREFERENCE_VALUE') {
 178      const {
 179        scope,
 180        name,
 181        value
 182      } = action;
 183      return {
 184        ...state,
 185        [scope]: {
 186          ...state[scope],
 187          [name]: value
 188        }
 189      };
 190    }
 191    return state;
 192  });
 193  /* harmony default export */ const reducer = ((0,external_wp_data_namespaceObject.combineReducers)({
 194    defaults,
 195    preferences
 196  }));
 197  
 198  ;// ./node_modules/@wordpress/preferences/build-module/store/actions.js
 199  /**
 200   * Returns an action object used in signalling that a preference should be
 201   * toggled.
 202   *
 203   * @param {string} scope The preference scope (e.g. core/edit-post).
 204   * @param {string} name  The preference name.
 205   */
 206  function toggle(scope, name) {
 207    return function ({
 208      select,
 209      dispatch
 210    }) {
 211      const currentValue = select.get(scope, name);
 212      dispatch.set(scope, name, !currentValue);
 213    };
 214  }
 215  
 216  /**
 217   * Returns an action object used in signalling that a preference should be set
 218   * to a value
 219   *
 220   * @param {string} scope The preference scope (e.g. core/edit-post).
 221   * @param {string} name  The preference name.
 222   * @param {*}      value The value to set.
 223   *
 224   * @return {Object} Action object.
 225   */
 226  function set(scope, name, value) {
 227    return {
 228      type: 'SET_PREFERENCE_VALUE',
 229      scope,
 230      name,
 231      value
 232    };
 233  }
 234  
 235  /**
 236   * Returns an action object used in signalling that preference defaults should
 237   * be set.
 238   *
 239   * @param {string}            scope    The preference scope (e.g. core/edit-post).
 240   * @param {Object<string, *>} defaults A key/value map of preference names to values.
 241   *
 242   * @return {Object} Action object.
 243   */
 244  function setDefaults(scope, defaults) {
 245    return {
 246      type: 'SET_PREFERENCE_DEFAULTS',
 247      scope,
 248      defaults
 249    };
 250  }
 251  
 252  /** @typedef {() => Promise<Object>} WPPreferencesPersistenceLayerGet */
 253  /** @typedef {(Object) => void} WPPreferencesPersistenceLayerSet */
 254  /**
 255   * @typedef WPPreferencesPersistenceLayer
 256   *
 257   * @property {WPPreferencesPersistenceLayerGet} get An async function that gets data from the persistence layer.
 258   * @property {WPPreferencesPersistenceLayerSet} set A function that sets data in the persistence layer.
 259   */
 260  
 261  /**
 262   * Sets the persistence layer.
 263   *
 264   * When a persistence layer is set, the preferences store will:
 265   * - call `get` immediately and update the store state to the value returned.
 266   * - call `set` with all preferences whenever a preference changes value.
 267   *
 268   * `setPersistenceLayer` should ideally be dispatched at the start of an
 269   * application's lifecycle, before any other actions have been dispatched to
 270   * the preferences store.
 271   *
 272   * @param {WPPreferencesPersistenceLayer} persistenceLayer The persistence layer.
 273   *
 274   * @return {Object} Action object.
 275   */
 276  async function setPersistenceLayer(persistenceLayer) {
 277    const persistedData = await persistenceLayer.get();
 278    return {
 279      type: 'SET_PERSISTENCE_LAYER',
 280      persistenceLayer,
 281      persistedData
 282    };
 283  }
 284  
 285  ;// external ["wp","deprecated"]
 286  const external_wp_deprecated_namespaceObject = window["wp"]["deprecated"];
 287  var external_wp_deprecated_default = /*#__PURE__*/__webpack_require__.n(external_wp_deprecated_namespaceObject);
 288  ;// ./node_modules/@wordpress/preferences/build-module/store/selectors.js
 289  /**
 290   * WordPress dependencies
 291   */
 292  
 293  const withDeprecatedKeys = originalGet => (state, scope, name) => {
 294    const settingsToMoveToCore = ['allowRightClickOverrides', 'distractionFree', 'editorMode', 'fixedToolbar', 'focusMode', 'hiddenBlockTypes', 'inactivePanels', 'keepCaretInsideBlock', 'mostUsedBlocks', 'openPanels', 'showBlockBreadcrumbs', 'showIconLabels', 'showListViewByDefault', 'isPublishSidebarEnabled', 'isComplementaryAreaVisible', 'pinnedItems'];
 295    if (settingsToMoveToCore.includes(name) && ['core/edit-post', 'core/edit-site'].includes(scope)) {
 296      external_wp_deprecated_default()(`wp.data.select( 'core/preferences' ).get( '$scope}', '$name}' )`, {
 297        since: '6.5',
 298        alternative: `wp.data.select( 'core/preferences' ).get( 'core', '$name}' )`
 299      });
 300      return originalGet(state, 'core', name);
 301    }
 302    return originalGet(state, scope, name);
 303  };
 304  
 305  /**
 306   * Returns a boolean indicating whether a prefer is active for a particular
 307   * scope.
 308   *
 309   * @param {Object} state The store state.
 310   * @param {string} scope The scope of the feature (e.g. core/edit-post).
 311   * @param {string} name  The name of the feature.
 312   *
 313   * @return {*} Is the feature enabled?
 314   */
 315  const get = withDeprecatedKeys((state, scope, name) => {
 316    const value = state.preferences[scope]?.[name];
 317    return value !== undefined ? value : state.defaults[scope]?.[name];
 318  });
 319  
 320  ;// ./node_modules/@wordpress/preferences/build-module/store/constants.js
 321  /**
 322   * The identifier for the data store.
 323   *
 324   * @type {string}
 325   */
 326  const STORE_NAME = 'core/preferences';
 327  
 328  ;// ./node_modules/@wordpress/preferences/build-module/store/index.js
 329  /**
 330   * WordPress dependencies
 331   */
 332  
 333  
 334  /**
 335   * Internal dependencies
 336   */
 337  
 338  
 339  
 340  
 341  
 342  /**
 343   * Store definition for the preferences namespace.
 344   *
 345   * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#createReduxStore
 346   *
 347   * @type {Object}
 348   */
 349  const store = (0,external_wp_data_namespaceObject.createReduxStore)(STORE_NAME, {
 350    reducer: reducer,
 351    actions: actions_namespaceObject,
 352    selectors: selectors_namespaceObject
 353  });
 354  (0,external_wp_data_namespaceObject.register)(store);
 355  
 356  ;// ./node_modules/@wordpress/preferences/build-module/components/preference-toggle-menu-item/index.js
 357  /**
 358   * WordPress dependencies
 359   */
 360  
 361  
 362  
 363  
 364  
 365  
 366  /**
 367   * Internal dependencies
 368   */
 369  
 370  
 371  function PreferenceToggleMenuItem({
 372    scope,
 373    name,
 374    label,
 375    info,
 376    messageActivated,
 377    messageDeactivated,
 378    shortcut,
 379    handleToggling = true,
 380    onToggle = () => null,
 381    disabled = false
 382  }) {
 383    const isActive = (0,external_wp_data_namespaceObject.useSelect)(select => !!select(store).get(scope, name), [scope, name]);
 384    const {
 385      toggle
 386    } = (0,external_wp_data_namespaceObject.useDispatch)(store);
 387    const speakMessage = () => {
 388      if (isActive) {
 389        const message = messageDeactivated || (0,external_wp_i18n_namespaceObject.sprintf)(/* translators: %s: preference name, e.g. 'Fullscreen mode' */
 390        (0,external_wp_i18n_namespaceObject.__)('Preference deactivated - %s'), label);
 391        (0,external_wp_a11y_namespaceObject.speak)(message);
 392      } else {
 393        const message = messageActivated || (0,external_wp_i18n_namespaceObject.sprintf)(/* translators: %s: preference name, e.g. 'Fullscreen mode' */
 394        (0,external_wp_i18n_namespaceObject.__)('Preference activated - %s'), label);
 395        (0,external_wp_a11y_namespaceObject.speak)(message);
 396      }
 397    };
 398    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, {
 399      icon: isActive && library_check,
 400      isSelected: isActive,
 401      onClick: () => {
 402        onToggle();
 403        if (handleToggling) {
 404          toggle(scope, name);
 405        }
 406        speakMessage();
 407      },
 408      role: "menuitemcheckbox",
 409      info: info,
 410      shortcut: shortcut,
 411      disabled: disabled,
 412      children: label
 413    });
 414  }
 415  
 416  ;// ./node_modules/@wordpress/preferences/build-module/components/index.js
 417  
 418  
 419  ;// ./node_modules/@wordpress/preferences/build-module/components/preference-base-option/index.js
 420  /**
 421   * WordPress dependencies
 422   */
 423  
 424  
 425  function BaseOption({
 426    help,
 427    label,
 428    isChecked,
 429    onChange,
 430    children
 431  }) {
 432    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
 433      className: "preference-base-option",
 434      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, {
 435        __nextHasNoMarginBottom: true,
 436        help: help,
 437        label: label,
 438        checked: isChecked,
 439        onChange: onChange
 440      }), children]
 441    });
 442  }
 443  /* harmony default export */ const preference_base_option = (BaseOption);
 444  
 445  ;// ./node_modules/@wordpress/preferences/build-module/components/preference-toggle-control/index.js
 446  /**
 447   * WordPress dependencies
 448   */
 449  
 450  
 451  /**
 452   * Internal dependencies
 453   */
 454  
 455  
 456  
 457  function PreferenceToggleControl(props) {
 458    const {
 459      scope,
 460      featureName,
 461      onToggle = () => {},
 462      ...remainingProps
 463    } = props;
 464    const isChecked = (0,external_wp_data_namespaceObject.useSelect)(select => !!select(store).get(scope, featureName), [scope, featureName]);
 465    const {
 466      toggle
 467    } = (0,external_wp_data_namespaceObject.useDispatch)(store);
 468    const onChange = () => {
 469      onToggle();
 470      toggle(scope, featureName);
 471    };
 472    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(preference_base_option, {
 473      onChange: onChange,
 474      isChecked: isChecked,
 475      ...remainingProps
 476    });
 477  }
 478  /* harmony default export */ const preference_toggle_control = (PreferenceToggleControl);
 479  
 480  ;// ./node_modules/@wordpress/preferences/build-module/components/preferences-modal/index.js
 481  /**
 482   * WordPress dependencies
 483   */
 484  
 485  
 486  
 487  function PreferencesModal({
 488    closeModal,
 489    children
 490  }) {
 491    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Modal, {
 492      className: "preferences-modal",
 493      title: (0,external_wp_i18n_namespaceObject.__)('Preferences'),
 494      onRequestClose: closeModal,
 495      children: children
 496    });
 497  }
 498  
 499  ;// ./node_modules/@wordpress/preferences/build-module/components/preferences-modal-section/index.js
 500  
 501  const Section = ({
 502    description,
 503    title,
 504    children
 505  }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", {
 506    className: "preferences-modal__section",
 507    children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("legend", {
 508      className: "preferences-modal__section-legend",
 509      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("h2", {
 510        className: "preferences-modal__section-title",
 511        children: title
 512      }), description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", {
 513        className: "preferences-modal__section-description",
 514        children: description
 515      })]
 516    }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
 517      className: "preferences-modal__section-content",
 518      children: children
 519    })]
 520  });
 521  /* harmony default export */ const preferences_modal_section = (Section);
 522  
 523  ;// external ["wp","compose"]
 524  const external_wp_compose_namespaceObject = window["wp"]["compose"];
 525  ;// external ["wp","element"]
 526  const external_wp_element_namespaceObject = window["wp"]["element"];
 527  ;// ./node_modules/@wordpress/icons/build-module/icon/index.js
 528  /**
 529   * WordPress dependencies
 530   */
 531  
 532  
 533  /** @typedef {{icon: JSX.Element, size?: number} & import('@wordpress/primitives').SVGProps} IconProps */
 534  
 535  /**
 536   * Return an SVG icon.
 537   *
 538   * @param {IconProps}                                 props icon is the SVG component to render
 539   *                                                          size is a number specifying the icon size in pixels
 540   *                                                          Other props will be passed to wrapped SVG component
 541   * @param {import('react').ForwardedRef<HTMLElement>} ref   The forwarded ref to the SVG element.
 542   *
 543   * @return {JSX.Element}  Icon component
 544   */
 545  function Icon({
 546    icon,
 547    size = 24,
 548    ...props
 549  }, ref) {
 550    return (0,external_wp_element_namespaceObject.cloneElement)(icon, {
 551      width: size,
 552      height: size,
 553      ...props,
 554      ref
 555    });
 556  }
 557  /* harmony default export */ const icon = ((0,external_wp_element_namespaceObject.forwardRef)(Icon));
 558  
 559  ;// ./node_modules/@wordpress/icons/build-module/library/chevron-left.js
 560  /**
 561   * WordPress dependencies
 562   */
 563  
 564  
 565  const chevronLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
 566    xmlns: "http://www.w3.org/2000/svg",
 567    viewBox: "0 0 24 24",
 568    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
 569      d: "M14.6 7l-1.2-1L8 12l5.4 6 1.2-1-4.6-5z"
 570    })
 571  });
 572  /* harmony default export */ const chevron_left = (chevronLeft);
 573  
 574  ;// ./node_modules/@wordpress/icons/build-module/library/chevron-right.js
 575  /**
 576   * WordPress dependencies
 577   */
 578  
 579  
 580  const chevronRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
 581    xmlns: "http://www.w3.org/2000/svg",
 582    viewBox: "0 0 24 24",
 583    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
 584      d: "M10.6 6L9.4 7l4.6 5-4.6 5 1.2 1 5.4-6z"
 585    })
 586  });
 587  /* harmony default export */ const chevron_right = (chevronRight);
 588  
 589  ;// external ["wp","privateApis"]
 590  const external_wp_privateApis_namespaceObject = window["wp"]["privateApis"];
 591  ;// ./node_modules/@wordpress/preferences/build-module/lock-unlock.js
 592  /**
 593   * WordPress dependencies
 594   */
 595  
 596  const {
 597    lock,
 598    unlock
 599  } = (0,external_wp_privateApis_namespaceObject.__dangerousOptInToUnstableAPIsOnlyForCoreModules)('I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.', '@wordpress/preferences');
 600  
 601  ;// ./node_modules/@wordpress/preferences/build-module/components/preferences-modal-tabs/index.js
 602  /* wp:polyfill */
 603  /**
 604   * WordPress dependencies
 605   */
 606  
 607  
 608  
 609  
 610  
 611  
 612  /**
 613   * Internal dependencies
 614   */
 615  
 616  
 617  const {
 618    Tabs
 619  } = unlock(external_wp_components_namespaceObject.privateApis);
 620  const PREFERENCES_MENU = 'preferences-menu';
 621  function PreferencesModalTabs({
 622    sections
 623  }) {
 624    const isLargeViewport = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium');
 625  
 626    // This is also used to sync the two different rendered components
 627    // between small and large viewports.
 628    const [activeMenu, setActiveMenu] = (0,external_wp_element_namespaceObject.useState)(PREFERENCES_MENU);
 629    /**
 630     * Create helper objects from `sections` for easier data handling.
 631     * `tabs` is used for creating the `Tabs` and `sectionsContentMap`
 632     * is used for easier access to active tab's content.
 633     */
 634    const {
 635      tabs,
 636      sectionsContentMap
 637    } = (0,external_wp_element_namespaceObject.useMemo)(() => {
 638      let mappedTabs = {
 639        tabs: [],
 640        sectionsContentMap: {}
 641      };
 642      if (sections.length) {
 643        mappedTabs = sections.reduce((accumulator, {
 644          name,
 645          tabLabel: title,
 646          content
 647        }) => {
 648          accumulator.tabs.push({
 649            name,
 650            title
 651          });
 652          accumulator.sectionsContentMap[name] = content;
 653          return accumulator;
 654        }, {
 655          tabs: [],
 656          sectionsContentMap: {}
 657        });
 658      }
 659      return mappedTabs;
 660    }, [sections]);
 661    let modalContent;
 662    // We render different components based on the viewport size.
 663    if (isLargeViewport) {
 664      modalContent = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
 665        className: "preferences__tabs",
 666        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Tabs, {
 667          defaultTabId: activeMenu !== PREFERENCES_MENU ? activeMenu : undefined,
 668          onSelect: setActiveMenu,
 669          orientation: "vertical",
 670          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tabs.TabList, {
 671            className: "preferences__tabs-tablist",
 672            children: tabs.map(tab => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tabs.Tab, {
 673              tabId: tab.name,
 674              className: "preferences__tabs-tab",
 675              children: tab.title
 676            }, tab.name))
 677          }), tabs.map(tab => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tabs.TabPanel, {
 678            tabId: tab.name,
 679            className: "preferences__tabs-tabpanel",
 680            focusable: false,
 681            children: sectionsContentMap[tab.name] || null
 682          }, tab.name))]
 683        })
 684      });
 685    } else {
 686      modalContent = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Navigator, {
 687        initialPath: "/",
 688        className: "preferences__provider",
 689        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Navigator.Screen, {
 690          path: "/",
 691          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Card, {
 692            isBorderless: true,
 693            size: "small",
 694            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CardBody, {
 695              children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalItemGroup, {
 696                children: tabs.map(tab => {
 697                  return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Navigator.Button, {
 698                    path: `/$tab.name}`,
 699                    as: external_wp_components_namespaceObject.__experimentalItem,
 700                    isAction: true,
 701                    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, {
 702                      justify: "space-between",
 703                      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, {
 704                        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, {
 705                          children: tab.title
 706                        })
 707                      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, {
 708                        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icon, {
 709                          icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_left : chevron_right
 710                        })
 711                      })]
 712                    })
 713                  }, tab.name);
 714                })
 715              })
 716            })
 717          })
 718        }), sections.length && sections.map(section => {
 719          return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Navigator.Screen, {
 720            path: `/$section.name}`,
 721            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Card, {
 722              isBorderless: true,
 723              size: "large",
 724              children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.CardHeader, {
 725                isBorderless: false,
 726                justify: "left",
 727                size: "small",
 728                gap: "6",
 729                children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Navigator.BackButton, {
 730                  icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_right : chevron_left,
 731                  label: (0,external_wp_i18n_namespaceObject.__)('Back')
 732                }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, {
 733                  size: "16",
 734                  children: section.tabLabel
 735                })]
 736              }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CardBody, {
 737                children: section.content
 738              })]
 739            })
 740          }, `$section.name}-menu`);
 741        })]
 742      });
 743    }
 744    return modalContent;
 745  }
 746  
 747  ;// ./node_modules/@wordpress/preferences/build-module/private-apis.js
 748  /**
 749   * Internal dependencies
 750   */
 751  
 752  
 753  
 754  
 755  
 756  
 757  const privateApis = {};
 758  lock(privateApis, {
 759    PreferenceBaseOption: preference_base_option,
 760    PreferenceToggleControl: preference_toggle_control,
 761    PreferencesModal: PreferencesModal,
 762    PreferencesModalSection: preferences_modal_section,
 763    PreferencesModalTabs: PreferencesModalTabs
 764  });
 765  
 766  ;// ./node_modules/@wordpress/preferences/build-module/index.js
 767  
 768  
 769  
 770  
 771  (window.wp = window.wp || {}).preferences = __webpack_exports__;
 772  /******/ })()
 773  ;