PluginProbe
Gutenberg / 13.0.0
Gutenberg v13.0.0
24.0.0 23.9.1 23.9.0 23.8.0 23.7.2 23.7.1 23.7.0 23.6.1 23.6.2 23.6.0 23.5.3 23.5.2 23.5.1 23.5.0 23.4.0 23.3.2 23.3.1 23.3.0 23.2.0 23.2.1 23.2.2 23.1.1 23.1.0 23.0.1 12.6.0 All 403 releases
gutenberg / build / customize-widgets / index.js

index.js in Gutenberg 13.0.0, at build/customize-widgets/index.js

3,090 lines 101.0 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /******/ (function() { // webpackBootstrap
2 /******/ var __webpack_modules__ = ({
3
4 /***/ 4403:
5 /***/ (function(module, exports) {
6
7 var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
8 Copyright (c) 2018 Jed Watson.
9 Licensed under the MIT License (MIT), see
10 http://jedwatson.github.io/classnames
11 */
12 /* global define */
13
14 (function () {
15 'use strict';
16
17 var hasOwn = {}.hasOwnProperty;
18
19 function classNames() {
20 var classes = [];
21
22 for (var i = 0; i < arguments.length; i++) {
23 var arg = arguments[i];
24 if (!arg) continue;
25
26 var argType = typeof arg;
27
28 if (argType === 'string' || argType === 'number') {
29 classes.push(arg);
30 } else if (Array.isArray(arg)) {
31 if (arg.length) {
32 var inner = classNames.apply(null, arg);
33 if (inner) {
34 classes.push(inner);
35 }
36 }
37 } else if (argType === 'object') {
38 if (arg.toString === Object.prototype.toString) {
39 for (var key in arg) {
40 if (hasOwn.call(arg, key) && arg[key]) {
41 classes.push(key);
42 }
43 }
44 } else {
45 classes.push(arg.toString());
46 }
47 }
48 }
49
50 return classes.join(' ');
51 }
52
53 if ( true && module.exports) {
54 classNames.default = classNames;
55 module.exports = classNames;
56 } else if (true) {
57 // register as 'classnames', consistent with npm package name
58 !(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_RESULT__ = (function () {
59 return classNames;
60 }).apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__),
61 __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
62 } else {}
63 }());
64
65
66 /***/ })
67
68 /******/ });
69 /************************************************************************/
70 /******/ // The module cache
71 /******/ var __webpack_module_cache__ = {};
72 /******/
73 /******/ // The require function
74 /******/ function __webpack_require__(moduleId) {
75 /******/ // Check if module is in cache
76 /******/ var cachedModule = __webpack_module_cache__[moduleId];
77 /******/ if (cachedModule !== undefined) {
78 /******/ return cachedModule.exports;
79 /******/ }
80 /******/ // Create a new module (and put it into the cache)
81 /******/ var module = __webpack_module_cache__[moduleId] = {
82 /******/ // no module.id needed
83 /******/ // no module.loaded needed
84 /******/ exports: {}
85 /******/ };
86 /******/
87 /******/ // Execute the module function
88 /******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
89 /******/
90 /******/ // Return the exports of the module
91 /******/ return module.exports;
92 /******/ }
93 /******/
94 /************************************************************************/
95 /******/ /* webpack/runtime/compat get default export */
96 /******/ !function() {
97 /******/ // getDefaultExport function for compatibility with non-harmony modules
98 /******/ __webpack_require__.n = function(module) {
99 /******/ var getter = module && module.__esModule ?
100 /******/ function() { return module['default']; } :
101 /******/ function() { return module; };
102 /******/ __webpack_require__.d(getter, { a: getter });
103 /******/ return getter;
104 /******/ };
105 /******/ }();
106 /******/
107 /******/ /* webpack/runtime/define property getters */
108 /******/ !function() {
109 /******/ // define getter functions for harmony exports
110 /******/ __webpack_require__.d = function(exports, definition) {
111 /******/ for(var key in definition) {
112 /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
113 /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
114 /******/ }
115 /******/ }
116 /******/ };
117 /******/ }();
118 /******/
119 /******/ /* webpack/runtime/hasOwnProperty shorthand */
120 /******/ !function() {
121 /******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
122 /******/ }();
123 /******/
124 /******/ /* webpack/runtime/make namespace object */
125 /******/ !function() {
126 /******/ // define __esModule on exports
127 /******/ __webpack_require__.r = function(exports) {
128 /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
129 /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
130 /******/ }
131 /******/ Object.defineProperty(exports, '__esModule', { value: true });
132 /******/ };
133 /******/ }();
134 /******/
135 /************************************************************************/
136 var __webpack_exports__ = {};
137 // This entry need to be wrapped in an IIFE because it need to be in strict mode.
138 !function() {
139 "use strict";
140 // ESM COMPAT FLAG
141 __webpack_require__.r(__webpack_exports__);
142
143 // EXPORTS
144 __webpack_require__.d(__webpack_exports__, {
145 "initialize": function() { return /* binding */ initialize; }
146 });
147
148 // NAMESPACE OBJECT: ./packages/customize-widgets/build-module/store/selectors.js
149 var selectors_namespaceObject = {};
150 __webpack_require__.r(selectors_namespaceObject);
151 __webpack_require__.d(selectors_namespaceObject, {
152 "__experimentalGetInsertionPoint": function() { return __experimentalGetInsertionPoint; },
153 "isInserterOpened": function() { return isInserterOpened; }
154 });
155
156 // NAMESPACE OBJECT: ./packages/customize-widgets/build-module/store/actions.js
157 var actions_namespaceObject = {};
158 __webpack_require__.r(actions_namespaceObject);
159 __webpack_require__.d(actions_namespaceObject, {
160 "setIsInserterOpened": function() { return setIsInserterOpened; }
161 });
162
163 // NAMESPACE OBJECT: ./packages/interface/build-module/store/actions.js
164 var store_actions_namespaceObject = {};
165 __webpack_require__.r(store_actions_namespaceObject);
166 __webpack_require__.d(store_actions_namespaceObject, {
167 "disableComplementaryArea": function() { return disableComplementaryArea; },
168 "enableComplementaryArea": function() { return enableComplementaryArea; },
169 "pinItem": function() { return pinItem; },
170 "setFeatureDefaults": function() { return setFeatureDefaults; },
171 "setFeatureValue": function() { return setFeatureValue; },
172 "toggleFeature": function() { return toggleFeature; },
173 "unpinItem": function() { return unpinItem; }
174 });
175
176 // NAMESPACE OBJECT: ./packages/interface/build-module/store/selectors.js
177 var store_selectors_namespaceObject = {};
178 __webpack_require__.r(store_selectors_namespaceObject);
179 __webpack_require__.d(store_selectors_namespaceObject, {
180 "getActiveComplementaryArea": function() { return getActiveComplementaryArea; },
181 "isFeatureActive": function() { return isFeatureActive; },
182 "isItemPinned": function() { return isItemPinned; }
183 });
184
185 ;// CONCATENATED MODULE: external ["wp","element"]
186 var external_wp_element_namespaceObject = window["wp"]["element"];
187 ;// CONCATENATED MODULE: external ["wp","blockLibrary"]
188 var external_wp_blockLibrary_namespaceObject = window["wp"]["blockLibrary"];
189 ;// CONCATENATED MODULE: external ["wp","widgets"]
190 var external_wp_widgets_namespaceObject = window["wp"]["widgets"];
191 ;// CONCATENATED MODULE: external ["wp","blocks"]
192 var external_wp_blocks_namespaceObject = window["wp"]["blocks"];
193 ;// CONCATENATED MODULE: external ["wp","data"]
194 var external_wp_data_namespaceObject = window["wp"]["data"];
195 ;// CONCATENATED MODULE: external ["wp","preferences"]
196 var external_wp_preferences_namespaceObject = window["wp"]["preferences"];
197 ;// CONCATENATED MODULE: external ["wp","components"]
198 var external_wp_components_namespaceObject = window["wp"]["components"];
199 ;// CONCATENATED MODULE: external ["wp","keyboardShortcuts"]
200 var external_wp_keyboardShortcuts_namespaceObject = window["wp"]["keyboardShortcuts"];
201 ;// CONCATENATED MODULE: external ["wp","i18n"]
202 var external_wp_i18n_namespaceObject = window["wp"]["i18n"];
203 ;// CONCATENATED MODULE: external ["wp","blockEditor"]
204 var external_wp_blockEditor_namespaceObject = window["wp"]["blockEditor"];
205 ;// CONCATENATED MODULE: external ["wp","compose"]
206 var external_wp_compose_namespaceObject = window["wp"]["compose"];
207 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/error-boundary/index.js
208
209
210 /**
211 * WordPress dependencies
212 */
213
214
215
216
217
218
219 function CopyButton(_ref) {
220 let {
221 text,
222 children
223 } = _ref;
224 const ref = (0,external_wp_compose_namespaceObject.useCopyToClipboard)(text);
225 return (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.Button, {
226 variant: "secondary",
227 ref: ref
228 }, children);
229 }
230
231 class ErrorBoundary extends external_wp_element_namespaceObject.Component {
232 constructor() {
233 super(...arguments);
234 this.state = {
235 error: null
236 };
237 }
238
239 componentDidCatch(error) {
240 this.setState({
241 error
242 });
243 }
244
245 render() {
246 const {
247 error
248 } = this.state;
249
250 if (!error) {
251 return this.props.children;
252 }
253
254 return (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.Warning, {
255 className: "customize-widgets-error-boundary",
256 actions: [(0,external_wp_element_namespaceObject.createElement)(CopyButton, {
257 key: "copy-error",
258 text: error.stack
259 }, (0,external_wp_i18n_namespaceObject.__)('Copy Error'))]
260 }, (0,external_wp_i18n_namespaceObject.__)('The editor has encountered an unexpected error.'));
261 }
262
263 }
264
265 ;// CONCATENATED MODULE: external "lodash"
266 var external_lodash_namespaceObject = window["lodash"];
267 ;// CONCATENATED MODULE: external ["wp","coreData"]
268 var external_wp_coreData_namespaceObject = window["wp"]["coreData"];
269 ;// CONCATENATED MODULE: external ["wp","mediaUtils"]
270 var external_wp_mediaUtils_namespaceObject = window["wp"]["mediaUtils"];
271 ;// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/extends.js
272 function _extends() {
273 _extends = Object.assign || function (target) {
274 for (var i = 1; i < arguments.length; i++) {
275 var source = arguments[i];
276
277 for (var key in source) {
278 if (Object.prototype.hasOwnProperty.call(source, key)) {
279 target[key] = source[key];
280 }
281 }
282 }
283
284 return target;
285 };
286
287 return _extends.apply(this, arguments);
288 }
289 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/block-inspector-button/index.js
290
291
292
293 /**
294 * WordPress dependencies
295 */
296
297
298
299
300
301
302 function BlockInspectorButton(_ref) {
303 let {
304 inspector,
305 closeMenu,
306 ...props
307 } = _ref;
308 const selectedBlockClientId = (0,external_wp_data_namespaceObject.useSelect)(select => select(external_wp_blockEditor_namespaceObject.store).getSelectedBlockClientId(), []);
309 const selectedBlock = (0,external_wp_element_namespaceObject.useMemo)(() => document.getElementById(`block-${selectedBlockClientId}`), [selectedBlockClientId]);
310 return (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.MenuItem, _extends({
311 onClick: () => {
312 // Open the inspector.
313 inspector.open({
314 returnFocusWhenClose: selectedBlock
315 }); // Then close the dropdown menu.
316
317 closeMenu();
318 }
319 }, props), (0,external_wp_i18n_namespaceObject.__)('Show more settings'));
320 }
321
322 /* harmony default export */ var block_inspector_button = (BlockInspectorButton);
323
324 // EXTERNAL MODULE: ./node_modules/classnames/index.js
325 var classnames = __webpack_require__(4403);
326 var classnames_default = /*#__PURE__*/__webpack_require__.n(classnames);
327 ;// CONCATENATED MODULE: external ["wp","keycodes"]
328 var external_wp_keycodes_namespaceObject = window["wp"]["keycodes"];
329 ;// CONCATENATED MODULE: external ["wp","primitives"]
330 var external_wp_primitives_namespaceObject = window["wp"]["primitives"];
331 ;// CONCATENATED MODULE: ./packages/icons/build-module/library/undo.js
332
333
334 /**
335 * WordPress dependencies
336 */
337
338 const undo = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
339 xmlns: "http://www.w3.org/2000/svg",
340 viewBox: "0 0 24 24"
341 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
342 d: "M18.3 11.7c-.6-.6-1.4-.9-2.3-.9H6.7l2.9-3.3-1.1-1-4.5 5L8.5 16l1-1-2.7-2.7H16c.5 0 .9.2 1.3.5 1 1 1 3.4 1 4.5v.3h1.5v-.2c0-1.5 0-4.3-1.5-5.7z"
343 }));
344 /* harmony default export */ var library_undo = (undo);
345
346 ;// CONCATENATED MODULE: ./packages/icons/build-module/library/redo.js
347
348
349 /**
350 * WordPress dependencies
351 */
352
353 const redo = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
354 xmlns: "http://www.w3.org/2000/svg",
355 viewBox: "0 0 24 24"
356 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
357 d: "M15.6 6.5l-1.1 1 2.9 3.3H8c-.9 0-1.7.3-2.3.9-1.4 1.5-1.4 4.2-1.4 5.6v.2h1.5v-.3c0-1.1 0-3.5 1-4.5.3-.3.7-.5 1.3-.5h9.2L14.5 15l1.1 1.1 4.6-4.6-4.6-5z"
358 }));
359 /* harmony default export */ var library_redo = (redo);
360
361 ;// CONCATENATED MODULE: ./packages/icons/build-module/library/plus.js
362
363
364 /**
365 * WordPress dependencies
366 */
367
368 const plus = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
369 xmlns: "http://www.w3.org/2000/svg",
370 viewBox: "0 0 24 24"
371 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
372 d: "M18 11.2h-5.2V6h-1.6v5.2H6v1.6h5.2V18h1.6v-5.2H18z"
373 }));
374 /* harmony default export */ var library_plus = (plus);
375
376 ;// CONCATENATED MODULE: ./packages/icons/build-module/library/close-small.js
377
378
379 /**
380 * WordPress dependencies
381 */
382
383 const closeSmall = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
384 xmlns: "http://www.w3.org/2000/svg",
385 viewBox: "0 0 24 24"
386 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
387 d: "M12 13.06l3.712 3.713 1.061-1.06L13.061 12l3.712-3.712-1.06-1.06L12 10.938 8.288 7.227l-1.061 1.06L10.939 12l-3.712 3.712 1.06 1.061L12 13.061z"
388 }));
389 /* harmony default export */ var close_small = (closeSmall);
390
391 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/store/reducer.js
392 /**
393 * WordPress dependencies
394 */
395
396 /**
397 * Reducer tracking whether the inserter is open.
398 *
399 * @param {boolean|Object} state
400 * @param {Object} action
401 */
402
403 function blockInserterPanel() {
404 let state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
405 let action = arguments.length > 1 ? arguments[1] : undefined;
406
407 switch (action.type) {
408 case 'SET_IS_INSERTER_OPENED':
409 return action.value;
410 }
411
412 return state;
413 }
414
415 /* harmony default export */ var reducer = ((0,external_wp_data_namespaceObject.combineReducers)({
416 blockInserterPanel
417 }));
418
419 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/store/selectors.js
420 /**
421 * Returns true if the inserter is opened.
422 *
423 * @param {Object} state Global application state.
424 *
425 * @return {boolean} Whether the inserter is opened.
426 */
427 function isInserterOpened(state) {
428 return !!state.blockInserterPanel;
429 }
430 /**
431 * Get the insertion point for the inserter.
432 *
433 * @param {Object} state Global application state.
434 *
435 * @return {Object} The root client ID and index to insert at.
436 */
437
438 function __experimentalGetInsertionPoint(state) {
439 const {
440 rootClientId,
441 insertionIndex
442 } = state.blockInserterPanel;
443 return {
444 rootClientId,
445 insertionIndex
446 };
447 }
448
449 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/store/actions.js
450 /**
451 * Returns an action object used to open/close the inserter.
452 *
453 * @param {boolean|Object} value Whether the inserter should be
454 * opened (true) or closed (false).
455 * To specify an insertion point,
456 * use an object.
457 * @param {string} value.rootClientId The root client ID to insert at.
458 * @param {number} value.insertionIndex The index to insert at.
459 *
460 * @return {Object} Action object.
461 */
462 function setIsInserterOpened(value) {
463 return {
464 type: 'SET_IS_INSERTER_OPENED',
465 value
466 };
467 }
468
469 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/store/constants.js
470 /**
471 * Module Constants
472 */
473 const STORE_NAME = 'core/customize-widgets';
474
475 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/store/index.js
476 /**
477 * WordPress dependencies
478 */
479
480 /**
481 * Internal dependencies
482 */
483
484
485
486
487
488 /**
489 * Block editor data store configuration.
490 *
491 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#registering-a-store
492 *
493 * @type {Object}
494 */
495
496 const storeConfig = {
497 reducer: reducer,
498 selectors: selectors_namespaceObject,
499 actions: actions_namespaceObject
500 };
501 /**
502 * Store definition for the edit widgets namespace.
503 *
504 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#createReduxStore
505 *
506 * @type {Object}
507 */
508
509 const store = (0,external_wp_data_namespaceObject.createReduxStore)(STORE_NAME, storeConfig);
510 (0,external_wp_data_namespaceObject.register)(store);
511
512 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/inserter/index.js
513
514
515 /**
516 * WordPress dependencies
517 */
518
519
520
521
522
523
524 /**
525 * Internal dependencies
526 */
527
528
529
530 function Inserter(_ref) {
531 let {
532 setIsOpened
533 } = _ref;
534 const inserterTitleId = (0,external_wp_compose_namespaceObject.useInstanceId)(Inserter, 'customize-widget-layout__inserter-panel-title');
535 const insertionPoint = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).__experimentalGetInsertionPoint(), []);
536 return (0,external_wp_element_namespaceObject.createElement)("div", {
537 className: "customize-widgets-layout__inserter-panel",
538 "aria-labelledby": inserterTitleId
539 }, (0,external_wp_element_namespaceObject.createElement)("div", {
540 className: "customize-widgets-layout__inserter-panel-header"
541 }, (0,external_wp_element_namespaceObject.createElement)("h2", {
542 id: inserterTitleId,
543 className: "customize-widgets-layout__inserter-panel-header-title"
544 }, (0,external_wp_i18n_namespaceObject.__)('Add a block')), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.Button, {
545 className: "customize-widgets-layout__inserter-panel-header-close-button",
546 icon: close_small,
547 onClick: () => setIsOpened(false),
548 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Close inserter')
549 })), (0,external_wp_element_namespaceObject.createElement)("div", {
550 className: "customize-widgets-layout__inserter-panel-content"
551 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.__experimentalLibrary, {
552 rootClientId: insertionPoint.rootClientId,
553 __experimentalInsertionIndex: insertionPoint.insertionIndex,
554 showInserterHelpPanel: true,
555 onSelect: () => setIsOpened(false)
556 })));
557 }
558
559 /* harmony default export */ var components_inserter = (Inserter);
560
561 ;// CONCATENATED MODULE: ./packages/icons/build-module/library/external.js
562
563
564 /**
565 * WordPress dependencies
566 */
567
568 const external = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
569 xmlns: "http://www.w3.org/2000/svg",
570 viewBox: "0 0 24 24"
571 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
572 d: "M18.2 17c0 .7-.6 1.2-1.2 1.2H7c-.7 0-1.2-.6-1.2-1.2V7c0-.7.6-1.2 1.2-1.2h3.2V4.2H7C5.5 4.2 4.2 5.5 4.2 7v10c0 1.5 1.2 2.8 2.8 2.8h10c1.5 0 2.8-1.2 2.8-2.8v-3.6h-1.5V17zM14.9 3v1.5h3.7l-6.4 6.4 1.1 1.1 6.4-6.4v3.7h1.5V3h-6.3z"
573 }));
574 /* harmony default export */ var library_external = (external);
575
576 ;// CONCATENATED MODULE: ./packages/icons/build-module/library/more-vertical.js
577
578
579 /**
580 * WordPress dependencies
581 */
582
583 const moreVertical = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
584 xmlns: "http://www.w3.org/2000/svg",
585 viewBox: "0 0 24 24"
586 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
587 d: "M13 19h-2v-2h2v2zm0-6h-2v-2h2v2zm0-6h-2V5h2v2z"
588 }));
589 /* harmony default export */ var more_vertical = (moreVertical);
590
591 ;// CONCATENATED MODULE: ./packages/interface/build-module/components/more-menu-dropdown/index.js
592
593
594 /**
595 * External dependencies
596 */
597
598 /**
599 * WordPress dependencies
600 */
601
602
603
604
605 function MoreMenuDropdown(_ref) {
606 let {
607 as: DropdownComponent = external_wp_components_namespaceObject.DropdownMenu,
608 className,
609
610 /* translators: button label text should, if possible, be under 16 characters. */
611 label = (0,external_wp_i18n_namespaceObject.__)('Options'),
612 popoverProps,
613 toggleProps,
614 children
615 } = _ref;
616 return (0,external_wp_element_namespaceObject.createElement)(DropdownComponent, {
617 className: classnames_default()('interface-more-menu-dropdown', className),
618 icon: more_vertical,
619 label: label,
620 popoverProps: {
621 position: 'bottom left',
622 ...popoverProps,
623 className: classnames_default()('interface-more-menu-dropdown__content', popoverProps === null || popoverProps === void 0 ? void 0 : popoverProps.className)
624 },
625 toggleProps: {
626 tooltipPosition: 'bottom',
627 ...toggleProps
628 }
629 }, onClose => children(onClose));
630 }
631
632 ;// CONCATENATED MODULE: ./packages/interface/build-module/components/index.js
633
634
635
636
637
638
639
640
641
642
643
644
645
646 ;// CONCATENATED MODULE: external ["wp","deprecated"]
647 var external_wp_deprecated_namespaceObject = window["wp"]["deprecated"];
648 var external_wp_deprecated_default = /*#__PURE__*/__webpack_require__.n(external_wp_deprecated_namespaceObject);
649 ;// CONCATENATED MODULE: ./packages/interface/build-module/store/actions.js
650 /**
651 * WordPress dependencies
652 */
653
654
655 /**
656 * Enable the complementary area.
657 *
658 * @param {string} scope Complementary area scope.
659 * @param {string} area Area identifier.
660 */
661
662 const enableComplementaryArea = (scope, area) => _ref => {
663 let {
664 registry
665 } = _ref;
666
667 // Return early if there's no area.
668 if (!area) {
669 return;
670 }
671
672 registry.dispatch(external_wp_preferences_namespaceObject.store).set(scope, 'complementaryArea', area);
673 };
674 /**
675 * Disable the complementary area.
676 *
677 * @param {string} scope Complementary area scope.
678 */
679
680 const disableComplementaryArea = scope => _ref2 => {
681 let {
682 registry
683 } = _ref2;
684 registry.dispatch(external_wp_preferences_namespaceObject.store).set(scope, 'complementaryArea', null);
685 };
686 /**
687 * Pins an item.
688 *
689 * @param {string} scope Item scope.
690 * @param {string} item Item identifier.
691 *
692 * @return {Object} Action object.
693 */
694
695 const pinItem = (scope, item) => _ref3 => {
696 let {
697 registry
698 } = _ref3;
699
700 // Return early if there's no item.
701 if (!item) {
702 return;
703 }
704
705 const pinnedItems = registry.select(external_wp_preferences_namespaceObject.store).get(scope, 'pinnedItems'); // The item is already pinned, there's nothing to do.
706
707 if ((pinnedItems === null || pinnedItems === void 0 ? void 0 : pinnedItems[item]) === true) {
708 return;
709 }
710
711 registry.dispatch(external_wp_preferences_namespaceObject.store).set(scope, 'pinnedItems', { ...pinnedItems,
712 [item]: true
713 });
714 };
715 /**
716 * Unpins an item.
717 *
718 * @param {string} scope Item scope.
719 * @param {string} item Item identifier.
720 */
721
722 const unpinItem = (scope, item) => _ref4 => {
723 let {
724 registry
725 } = _ref4;
726
727 // Return early if there's no item.
728 if (!item) {
729 return;
730 }
731
732 const pinnedItems = registry.select(external_wp_preferences_namespaceObject.store).get(scope, 'pinnedItems');
733 registry.dispatch(external_wp_preferences_namespaceObject.store).set(scope, 'pinnedItems', { ...pinnedItems,
734 [item]: false
735 });
736 };
737 /**
738 * Returns an action object used in signalling that a feature should be toggled.
739 *
740 * @param {string} scope The feature scope (e.g. core/edit-post).
741 * @param {string} featureName The feature name.
742 */
743
744 function toggleFeature(scope, featureName) {
745 return function (_ref5) {
746 let {
747 registry
748 } = _ref5;
749 external_wp_deprecated_default()(`wp.dispatch( 'core/interface' ).toggleFeature`, {
750 since: '6.0',
751 alternative: `wp.dispatch( 'core/preferences' ).toggle`
752 });
753 registry.dispatch(external_wp_preferences_namespaceObject.store).toggle(scope, featureName);
754 };
755 }
756 /**
757 * Returns an action object used in signalling that a feature should be set to
758 * a true or false value
759 *
760 * @param {string} scope The feature scope (e.g. core/edit-post).
761 * @param {string} featureName The feature name.
762 * @param {boolean} value The value to set.
763 *
764 * @return {Object} Action object.
765 */
766
767 function setFeatureValue(scope, featureName, value) {
768 return function (_ref6) {
769 let {
770 registry
771 } = _ref6;
772 external_wp_deprecated_default()(`wp.dispatch( 'core/interface' ).setFeatureValue`, {
773 since: '6.0',
774 alternative: `wp.dispatch( 'core/preferences' ).set`
775 });
776 registry.dispatch(external_wp_preferences_namespaceObject.store).set(scope, featureName, !!value);
777 };
778 }
779 /**
780 * Returns an action object used in signalling that defaults should be set for features.
781 *
782 * @param {string} scope The feature scope (e.g. core/edit-post).
783 * @param {Object<string, boolean>} defaults A key/value map of feature names to values.
784 *
785 * @return {Object} Action object.
786 */
787
788 function setFeatureDefaults(scope, defaults) {
789 return function (_ref7) {
790 let {
791 registry
792 } = _ref7;
793 external_wp_deprecated_default()(`wp.dispatch( 'core/interface' ).setFeatureDefaults`, {
794 since: '6.0',
795 alternative: `wp.dispatch( 'core/preferences' ).setDefaults`
796 });
797 registry.dispatch(external_wp_preferences_namespaceObject.store).setDefaults(scope, defaults);
798 };
799 }
800
801 ;// CONCATENATED MODULE: ./packages/interface/build-module/store/selectors.js
802 /**
803 * WordPress dependencies
804 */
805
806
807
808 /**
809 * Returns the complementary area that is active in a given scope.
810 *
811 * @param {Object} state Global application state.
812 * @param {string} scope Item scope.
813 *
814 * @return {string} The complementary area that is active in the given scope.
815 */
816
817 const getActiveComplementaryArea = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (state, scope) => {
818 return select(external_wp_preferences_namespaceObject.store).get(scope, 'complementaryArea');
819 });
820 /**
821 * Returns a boolean indicating if an item is pinned or not.
822 *
823 * @param {Object} state Global application state.
824 * @param {string} scope Scope.
825 * @param {string} item Item to check.
826 *
827 * @return {boolean} True if the item is pinned and false otherwise.
828 */
829
830 const isItemPinned = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (state, scope, item) => {
831 var _pinnedItems$item;
832
833 const pinnedItems = select(external_wp_preferences_namespaceObject.store).get(scope, 'pinnedItems');
834 return (_pinnedItems$item = pinnedItems === null || pinnedItems === void 0 ? void 0 : pinnedItems[item]) !== null && _pinnedItems$item !== void 0 ? _pinnedItems$item : true;
835 });
836 /**
837 * Returns a boolean indicating whether a feature is active for a particular
838 * scope.
839 *
840 * @param {Object} state The store state.
841 * @param {string} scope The scope of the feature (e.g. core/edit-post).
842 * @param {string} featureName The name of the feature.
843 *
844 * @return {boolean} Is the feature enabled?
845 */
846
847 const isFeatureActive = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (state, scope, featureName) => {
848 external_wp_deprecated_default()(`wp.select( 'core/interface' ).isFeatureActive( scope, featureName )`, {
849 since: '6.0',
850 alternative: `!! wp.select( 'core/preferences' ).isFeatureActive( scope, featureName )`
851 });
852 return !!select(external_wp_preferences_namespaceObject.store).get(scope, featureName);
853 });
854
855 ;// CONCATENATED MODULE: ./packages/interface/build-module/store/constants.js
856 /**
857 * The identifier for the data store.
858 *
859 * @type {string}
860 */
861 const constants_STORE_NAME = 'core/interface';
862
863 ;// CONCATENATED MODULE: ./packages/interface/build-module/store/index.js
864 /**
865 * WordPress dependencies
866 */
867
868 /**
869 * Internal dependencies
870 */
871
872
873
874
875 /**
876 * Store definition for the interface namespace.
877 *
878 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#createReduxStore
879 *
880 * @type {Object}
881 */
882
883 const store_store = (0,external_wp_data_namespaceObject.createReduxStore)(constants_STORE_NAME, {
884 reducer: () => {},
885 actions: store_actions_namespaceObject,
886 selectors: store_selectors_namespaceObject
887 }); // Once we build a more generic persistence plugin that works across types of stores
888 // we'd be able to replace this with a register call.
889
890 (0,external_wp_data_namespaceObject.register)(store_store);
891
892 ;// CONCATENATED MODULE: ./packages/interface/build-module/index.js
893
894
895
896 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/keyboard-shortcut-help-modal/config.js
897 /**
898 * WordPress dependencies
899 */
900
901 const textFormattingShortcuts = [{
902 keyCombination: {
903 modifier: 'primary',
904 character: 'b'
905 },
906 description: (0,external_wp_i18n_namespaceObject.__)('Make the selected text bold.')
907 }, {
908 keyCombination: {
909 modifier: 'primary',
910 character: 'i'
911 },
912 description: (0,external_wp_i18n_namespaceObject.__)('Make the selected text italic.')
913 }, {
914 keyCombination: {
915 modifier: 'primary',
916 character: 'k'
917 },
918 description: (0,external_wp_i18n_namespaceObject.__)('Convert the selected text into a link.')
919 }, {
920 keyCombination: {
921 modifier: 'primaryShift',
922 character: 'k'
923 },
924 description: (0,external_wp_i18n_namespaceObject.__)('Remove a link.')
925 }, {
926 keyCombination: {
927 modifier: 'primary',
928 character: 'u'
929 },
930 description: (0,external_wp_i18n_namespaceObject.__)('Underline the selected text.')
931 }];
932
933 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/keyboard-shortcut-help-modal/shortcut.js
934
935
936 /**
937 * External dependencies
938 */
939
940 /**
941 * WordPress dependencies
942 */
943
944
945
946
947 function KeyCombination(_ref) {
948 let {
949 keyCombination,
950 forceAriaLabel
951 } = _ref;
952 const shortcut = keyCombination.modifier ? external_wp_keycodes_namespaceObject.displayShortcutList[keyCombination.modifier](keyCombination.character) : keyCombination.character;
953 const ariaLabel = keyCombination.modifier ? external_wp_keycodes_namespaceObject.shortcutAriaLabel[keyCombination.modifier](keyCombination.character) : keyCombination.character;
954 return (0,external_wp_element_namespaceObject.createElement)("kbd", {
955 className: "customize-widgets-keyboard-shortcut-help-modal__shortcut-key-combination",
956 "aria-label": forceAriaLabel || ariaLabel
957 }, (0,external_lodash_namespaceObject.castArray)(shortcut).map((character, index) => {
958 if (character === '+') {
959 return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, {
960 key: index
961 }, character);
962 }
963
964 return (0,external_wp_element_namespaceObject.createElement)("kbd", {
965 key: index,
966 className: "customize-widgets-keyboard-shortcut-help-modal__shortcut-key"
967 }, character);
968 }));
969 }
970
971 function Shortcut(_ref2) {
972 let {
973 description,
974 keyCombination,
975 aliases = [],
976 ariaLabel
977 } = _ref2;
978 return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, (0,external_wp_element_namespaceObject.createElement)("div", {
979 className: "customize-widgets-keyboard-shortcut-help-modal__shortcut-description"
980 }, description), (0,external_wp_element_namespaceObject.createElement)("div", {
981 className: "customize-widgets-keyboard-shortcut-help-modal__shortcut-term"
982 }, (0,external_wp_element_namespaceObject.createElement)(KeyCombination, {
983 keyCombination: keyCombination,
984 forceAriaLabel: ariaLabel
985 }), aliases.map((alias, index) => (0,external_wp_element_namespaceObject.createElement)(KeyCombination, {
986 keyCombination: alias,
987 forceAriaLabel: ariaLabel,
988 key: index
989 }))));
990 }
991
992 /* harmony default export */ var keyboard_shortcut_help_modal_shortcut = (Shortcut);
993
994 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/keyboard-shortcut-help-modal/dynamic-shortcut.js
995
996
997 /**
998 * WordPress dependencies
999 */
1000
1001
1002 /**
1003 * Internal dependencies
1004 */
1005
1006
1007
1008 function DynamicShortcut(_ref) {
1009 let {
1010 name
1011 } = _ref;
1012 const {
1013 keyCombination,
1014 description,
1015 aliases
1016 } = (0,external_wp_data_namespaceObject.useSelect)(select => {
1017 const {
1018 getShortcutKeyCombination,
1019 getShortcutDescription,
1020 getShortcutAliases
1021 } = select(external_wp_keyboardShortcuts_namespaceObject.store);
1022 return {
1023 keyCombination: getShortcutKeyCombination(name),
1024 aliases: getShortcutAliases(name),
1025 description: getShortcutDescription(name)
1026 };
1027 }, [name]);
1028
1029 if (!keyCombination) {
1030 return null;
1031 }
1032
1033 return (0,external_wp_element_namespaceObject.createElement)(keyboard_shortcut_help_modal_shortcut, {
1034 keyCombination: keyCombination,
1035 description: description,
1036 aliases: aliases
1037 });
1038 }
1039
1040 /* harmony default export */ var dynamic_shortcut = (DynamicShortcut);
1041
1042 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/keyboard-shortcut-help-modal/index.js
1043
1044
1045 /**
1046 * External dependencies
1047 */
1048
1049
1050 /**
1051 * WordPress dependencies
1052 */
1053
1054
1055
1056
1057
1058 /**
1059 * Internal dependencies
1060 */
1061
1062
1063
1064
1065
1066 const ShortcutList = _ref => {
1067 let {
1068 shortcuts
1069 } = _ref;
1070 return (
1071 /*
1072 * Disable reason: The `list` ARIA role is redundant but
1073 * Safari+VoiceOver won't announce the list otherwise.
1074 */
1075
1076 /* eslint-disable jsx-a11y/no-redundant-roles */
1077 (0,external_wp_element_namespaceObject.createElement)("ul", {
1078 className: "customize-widgets-keyboard-shortcut-help-modal__shortcut-list",
1079 role: "list"
1080 }, shortcuts.map((shortcut, index) => (0,external_wp_element_namespaceObject.createElement)("li", {
1081 className: "customize-widgets-keyboard-shortcut-help-modal__shortcut",
1082 key: index
1083 }, (0,external_lodash_namespaceObject.isString)(shortcut) ? (0,external_wp_element_namespaceObject.createElement)(dynamic_shortcut, {
1084 name: shortcut
1085 }) : (0,external_wp_element_namespaceObject.createElement)(keyboard_shortcut_help_modal_shortcut, shortcut))))
1086 /* eslint-enable jsx-a11y/no-redundant-roles */
1087
1088 );
1089 };
1090
1091 const ShortcutSection = _ref2 => {
1092 let {
1093 title,
1094 shortcuts,
1095 className
1096 } = _ref2;
1097 return (0,external_wp_element_namespaceObject.createElement)("section", {
1098 className: classnames_default()('customize-widgets-keyboard-shortcut-help-modal__section', className)
1099 }, !!title && (0,external_wp_element_namespaceObject.createElement)("h2", {
1100 className: "customize-widgets-keyboard-shortcut-help-modal__section-title"
1101 }, title), (0,external_wp_element_namespaceObject.createElement)(ShortcutList, {
1102 shortcuts: shortcuts
1103 }));
1104 };
1105
1106 const ShortcutCategorySection = _ref3 => {
1107 let {
1108 title,
1109 categoryName,
1110 additionalShortcuts = []
1111 } = _ref3;
1112 const categoryShortcuts = (0,external_wp_data_namespaceObject.useSelect)(select => {
1113 return select(external_wp_keyboardShortcuts_namespaceObject.store).getCategoryShortcuts(categoryName);
1114 }, [categoryName]);
1115 return (0,external_wp_element_namespaceObject.createElement)(ShortcutSection, {
1116 title: title,
1117 shortcuts: categoryShortcuts.concat(additionalShortcuts)
1118 });
1119 };
1120
1121 function KeyboardShortcutHelpModal(_ref4) {
1122 let {
1123 isModalActive,
1124 toggleModal
1125 } = _ref4;
1126 const {
1127 registerShortcut
1128 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_keyboardShortcuts_namespaceObject.store);
1129 registerShortcut({
1130 name: 'core/customize-widgets/keyboard-shortcuts',
1131 category: 'main',
1132 description: (0,external_wp_i18n_namespaceObject.__)('Display these keyboard shortcuts.'),
1133 keyCombination: {
1134 modifier: 'access',
1135 character: 'h'
1136 }
1137 });
1138 (0,external_wp_keyboardShortcuts_namespaceObject.useShortcut)('core/customize-widgets/keyboard-shortcuts', toggleModal);
1139
1140 if (!isModalActive) {
1141 return null;
1142 }
1143
1144 return (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.Modal, {
1145 className: "customize-widgets-keyboard-shortcut-help-modal",
1146 title: (0,external_wp_i18n_namespaceObject.__)('Keyboard shortcuts'),
1147 closeLabel: (0,external_wp_i18n_namespaceObject.__)('Close'),
1148 onRequestClose: toggleModal
1149 }, (0,external_wp_element_namespaceObject.createElement)(ShortcutSection, {
1150 className: "customize-widgets-keyboard-shortcut-help-modal__main-shortcuts",
1151 shortcuts: ['core/customize-widgets/keyboard-shortcuts']
1152 }), (0,external_wp_element_namespaceObject.createElement)(ShortcutCategorySection, {
1153 title: (0,external_wp_i18n_namespaceObject.__)('Global shortcuts'),
1154 categoryName: "global"
1155 }), (0,external_wp_element_namespaceObject.createElement)(ShortcutCategorySection, {
1156 title: (0,external_wp_i18n_namespaceObject.__)('Selection shortcuts'),
1157 categoryName: "selection"
1158 }), (0,external_wp_element_namespaceObject.createElement)(ShortcutCategorySection, {
1159 title: (0,external_wp_i18n_namespaceObject.__)('Block shortcuts'),
1160 categoryName: "block",
1161 additionalShortcuts: [{
1162 keyCombination: {
1163 character: '/'
1164 },
1165 description: (0,external_wp_i18n_namespaceObject.__)('Change the block type after adding a new paragraph.'),
1166
1167 /* translators: The forward-slash character. e.g. '/'. */
1168 ariaLabel: (0,external_wp_i18n_namespaceObject.__)('Forward-slash')
1169 }]
1170 }), (0,external_wp_element_namespaceObject.createElement)(ShortcutSection, {
1171 title: (0,external_wp_i18n_namespaceObject.__)('Text formatting'),
1172 shortcuts: textFormattingShortcuts
1173 }));
1174 }
1175
1176 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/more-menu/index.js
1177
1178
1179 /**
1180 * WordPress dependencies
1181 */
1182
1183
1184
1185
1186
1187
1188
1189
1190 /**
1191 * Internal dependencies
1192 */
1193
1194
1195 function MoreMenu() {
1196 const [isKeyboardShortcutsModalActive, setIsKeyboardShortcutsModalVisible] = (0,external_wp_element_namespaceObject.useState)(false);
1197
1198 const toggleKeyboardShortcutsModal = () => setIsKeyboardShortcutsModalVisible(!isKeyboardShortcutsModalActive);
1199
1200 (0,external_wp_keyboardShortcuts_namespaceObject.useShortcut)('core/customize-widgets/keyboard-shortcuts', toggleKeyboardShortcutsModal);
1201 return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, (0,external_wp_element_namespaceObject.createElement)(MoreMenuDropdown, {
1202 as: external_wp_components_namespaceObject.ToolbarDropdownMenu
1203 }, () => (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.MenuGroup, {
1204 label: (0,external_wp_i18n_namespaceObject._x)('View', 'noun')
1205 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_preferences_namespaceObject.PreferenceToggleMenuItem, {
1206 scope: "core/customize-widgets",
1207 name: "fixedToolbar",
1208 label: (0,external_wp_i18n_namespaceObject.__)('Top toolbar'),
1209 info: (0,external_wp_i18n_namespaceObject.__)('Access all block and document tools in a single place'),
1210 messageActivated: (0,external_wp_i18n_namespaceObject.__)('Top toolbar activated'),
1211 messageDeactivated: (0,external_wp_i18n_namespaceObject.__)('Top toolbar deactivated')
1212 })), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.MenuGroup, {
1213 label: (0,external_wp_i18n_namespaceObject.__)('Tools')
1214 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.MenuItem, {
1215 onClick: () => {
1216 setIsKeyboardShortcutsModalVisible(true);
1217 },
1218 shortcut: external_wp_keycodes_namespaceObject.displayShortcut.access('h')
1219 }, (0,external_wp_i18n_namespaceObject.__)('Keyboard shortcuts')), (0,external_wp_element_namespaceObject.createElement)(external_wp_preferences_namespaceObject.PreferenceToggleMenuItem, {
1220 scope: "core/customize-widgets",
1221 name: "welcomeGuide",
1222 label: (0,external_wp_i18n_namespaceObject.__)('Welcome Guide')
1223 }), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.MenuItem, {
1224 role: "menuitem",
1225 icon: library_external,
1226 href: (0,external_wp_i18n_namespaceObject.__)('https://wordpress.org/support/article/block-based-widgets-editor/'),
1227 target: "_blank",
1228 rel: "noopener noreferrer"
1229 }, (0,external_wp_i18n_namespaceObject.__)('Help'), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.VisuallyHidden, {
1230 as: "span"
1231 },
1232 /* translators: accessibility text */
1233 (0,external_wp_i18n_namespaceObject.__)('(opens in a new tab)')))), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.MenuGroup, {
1234 label: (0,external_wp_i18n_namespaceObject.__)('Preferences')
1235 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_preferences_namespaceObject.PreferenceToggleMenuItem, {
1236 scope: "core/customize-widgets",
1237 name: "keepCaretInsideBlock",
1238 label: (0,external_wp_i18n_namespaceObject.__)('Contain text cursor inside block'),
1239 info: (0,external_wp_i18n_namespaceObject.__)('Aids screen readers by stopping text caret from leaving blocks.'),
1240 messageActivated: (0,external_wp_i18n_namespaceObject.__)('Contain text cursor inside block activated'),
1241 messageDeactivated: (0,external_wp_i18n_namespaceObject.__)('Contain text cursor inside block deactivated')
1242 })))), (0,external_wp_element_namespaceObject.createElement)(KeyboardShortcutHelpModal, {
1243 isModalActive: isKeyboardShortcutsModalActive,
1244 toggleModal: toggleKeyboardShortcutsModal
1245 }));
1246 }
1247
1248 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/header/index.js
1249
1250
1251 /**
1252 * External dependencies
1253 */
1254
1255 /**
1256 * WordPress dependencies
1257 */
1258
1259
1260
1261
1262
1263
1264
1265 /**
1266 * Internal dependencies
1267 */
1268
1269
1270
1271
1272 function Header(_ref) {
1273 let {
1274 sidebar,
1275 inserter,
1276 isInserterOpened,
1277 setIsInserterOpened,
1278 isFixedToolbarActive
1279 } = _ref;
1280 const [[hasUndo, hasRedo], setUndoRedo] = (0,external_wp_element_namespaceObject.useState)([sidebar.hasUndo(), sidebar.hasRedo()]);
1281 (0,external_wp_element_namespaceObject.useEffect)(() => {
1282 return sidebar.subscribeHistory(() => {
1283 setUndoRedo([sidebar.hasUndo(), sidebar.hasRedo()]);
1284 });
1285 }, [sidebar]);
1286 return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, (0,external_wp_element_namespaceObject.createElement)("div", {
1287 className: classnames_default()('customize-widgets-header', {
1288 'is-fixed-toolbar-active': isFixedToolbarActive
1289 })
1290 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.NavigableToolbar, {
1291 className: "customize-widgets-header-toolbar",
1292 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Document tools')
1293 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.ToolbarButton, {
1294 icon: !(0,external_wp_i18n_namespaceObject.isRTL)() ? library_undo : library_redo
1295 /* translators: button label text should, if possible, be under 16 characters. */
1296 ,
1297 label: (0,external_wp_i18n_namespaceObject.__)('Undo'),
1298 shortcut: external_wp_keycodes_namespaceObject.displayShortcut.primary('z') // If there are no undo levels we don't want to actually disable this
1299 // button, because it will remove focus for keyboard users.
1300 // See: https://github.com/WordPress/gutenberg/issues/3486
1301 ,
1302 "aria-disabled": !hasUndo,
1303 onClick: sidebar.undo,
1304 className: "customize-widgets-editor-history-button undo-button"
1305 }), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.ToolbarButton, {
1306 icon: !(0,external_wp_i18n_namespaceObject.isRTL)() ? library_redo : library_undo
1307 /* translators: button label text should, if possible, be under 16 characters. */
1308 ,
1309 label: (0,external_wp_i18n_namespaceObject.__)('Redo'),
1310 shortcut: external_wp_keycodes_namespaceObject.displayShortcut.primaryShift('z') // If there are no undo levels we don't want to actually disable this
1311 // button, because it will remove focus for keyboard users.
1312 // See: https://github.com/WordPress/gutenberg/issues/3486
1313 ,
1314 "aria-disabled": !hasRedo,
1315 onClick: sidebar.redo,
1316 className: "customize-widgets-editor-history-button redo-button"
1317 }), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.ToolbarButton, {
1318 className: "customize-widgets-header-toolbar__inserter-toggle",
1319 isPressed: isInserterOpened,
1320 variant: "primary",
1321 icon: library_plus,
1322 label: (0,external_wp_i18n_namespaceObject._x)('Add block', 'Generic label for block inserter button'),
1323 onClick: () => {
1324 setIsInserterOpened(isOpen => !isOpen);
1325 }
1326 }), (0,external_wp_element_namespaceObject.createElement)(MoreMenu, null))), (0,external_wp_element_namespaceObject.createPortal)((0,external_wp_element_namespaceObject.createElement)(components_inserter, {
1327 setIsOpened: setIsInserterOpened
1328 }), inserter.contentContainer[0]));
1329 }
1330
1331 /* harmony default export */ var header = (Header);
1332
1333 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/inserter/use-inserter.js
1334 /**
1335 * WordPress dependencies
1336 */
1337
1338
1339 /**
1340 * Internal dependencies
1341 */
1342
1343
1344 function useInserter(inserter) {
1345 const isInserterOpened = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).isInserterOpened(), []);
1346 const {
1347 setIsInserterOpened
1348 } = (0,external_wp_data_namespaceObject.useDispatch)(store);
1349 (0,external_wp_element_namespaceObject.useEffect)(() => {
1350 if (isInserterOpened) {
1351 inserter.open();
1352 } else {
1353 inserter.close();
1354 }
1355 }, [inserter, isInserterOpened]);
1356 return [isInserterOpened, (0,external_wp_element_namespaceObject.useCallback)(updater => {
1357 let isOpen = updater;
1358
1359 if (typeof updater === 'function') {
1360 isOpen = updater((0,external_wp_data_namespaceObject.select)(store).isInserterOpened());
1361 }
1362
1363 setIsInserterOpened(isOpen);
1364 }, [setIsInserterOpened])];
1365 }
1366
1367 ;// CONCATENATED MODULE: external ["wp","isShallowEqual"]
1368 var external_wp_isShallowEqual_namespaceObject = window["wp"]["isShallowEqual"];
1369 var external_wp_isShallowEqual_default = /*#__PURE__*/__webpack_require__.n(external_wp_isShallowEqual_namespaceObject);
1370 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/utils.js
1371 // @ts-check
1372
1373 /**
1374 * WordPress dependencies
1375 */
1376
1377
1378 /**
1379 * External dependencies
1380 */
1381
1382
1383 /**
1384 * Convert settingId to widgetId.
1385 *
1386 * @param {string} settingId The setting id.
1387 * @return {string} The widget id.
1388 */
1389
1390 function settingIdToWidgetId(settingId) {
1391 const matches = settingId.match(/^widget_(.+)(?:\[(\d+)\])$/);
1392
1393 if (matches) {
1394 const idBase = matches[1];
1395 const number = parseInt(matches[2], 10);
1396 return `${idBase}-${number}`;
1397 }
1398
1399 return settingId;
1400 }
1401 /**
1402 * Transform a block to a customizable widget.
1403 *
1404 * @param {WPBlock} block The block to be transformed from.
1405 * @param {Object} existingWidget The widget to be extended from.
1406 * @return {Object} The transformed widget.
1407 */
1408
1409 function blockToWidget(block) {
1410 let existingWidget = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
1411 let widget;
1412 const isValidLegacyWidgetBlock = block.name === 'core/legacy-widget' && (block.attributes.id || block.attributes.instance);
1413
1414 if (isValidLegacyWidgetBlock) {
1415 if (block.attributes.id) {
1416 // Widget that does not extend WP_Widget.
1417 widget = {
1418 id: block.attributes.id
1419 };
1420 } else {
1421 const {
1422 encoded,
1423 hash,
1424 raw,
1425 ...rest
1426 } = block.attributes.instance; // Widget that extends WP_Widget.
1427
1428 widget = {
1429 idBase: block.attributes.idBase,
1430 instance: { ...(existingWidget === null || existingWidget === void 0 ? void 0 : existingWidget.instance),
1431 // Required only for the customizer.
1432 is_widget_customizer_js_value: true,
1433 encoded_serialized_instance: encoded,
1434 instance_hash_key: hash,
1435 raw_instance: raw,
1436 ...rest
1437 }
1438 };
1439 }
1440 } else {
1441 const instance = {
1442 content: (0,external_wp_blocks_namespaceObject.serialize)(block)
1443 };
1444 widget = {
1445 idBase: 'block',
1446 widgetClass: 'WP_Widget_Block',
1447 instance: {
1448 raw_instance: instance
1449 }
1450 };
1451 }
1452
1453 return { ...(0,external_lodash_namespaceObject.omit)(existingWidget, ['form', 'rendered']),
1454 ...widget
1455 };
1456 }
1457 /**
1458 * Transform a widget to a block.
1459 *
1460 * @param {Object} widget The widget to be transformed from.
1461 * @param {string} widget.id The widget id.
1462 * @param {string} widget.idBase The id base of the widget.
1463 * @param {number} widget.number The number/index of the widget.
1464 * @param {Object} widget.instance The instance of the widget.
1465 * @return {WPBlock} The transformed block.
1466 */
1467
1468 function widgetToBlock(_ref) {
1469 let {
1470 id,
1471 idBase,
1472 number,
1473 instance
1474 } = _ref;
1475 let block;
1476 const {
1477 encoded_serialized_instance: encoded,
1478 instance_hash_key: hash,
1479 raw_instance: raw,
1480 ...rest
1481 } = instance;
1482
1483 if (idBase === 'block') {
1484 const parsedBlocks = (0,external_wp_blocks_namespaceObject.parse)(raw.content);
1485 block = parsedBlocks.length ? parsedBlocks[0] : (0,external_wp_blocks_namespaceObject.createBlock)('core/paragraph', {});
1486 } else if (number) {
1487 // Widget that extends WP_Widget.
1488 block = (0,external_wp_blocks_namespaceObject.createBlock)('core/legacy-widget', {
1489 idBase,
1490 instance: {
1491 encoded,
1492 hash,
1493 raw,
1494 ...rest
1495 }
1496 });
1497 } else {
1498 // Widget that does not extend WP_Widget.
1499 block = (0,external_wp_blocks_namespaceObject.createBlock)('core/legacy-widget', {
1500 id
1501 });
1502 }
1503
1504 return (0,external_wp_widgets_namespaceObject.addWidgetIdToBlock)(block, id);
1505 }
1506
1507 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/sidebar-block-editor/use-sidebar-block-editor.js
1508 /**
1509 * External dependencies
1510 */
1511
1512 /**
1513 * WordPress dependencies
1514 */
1515
1516
1517
1518
1519 /**
1520 * Internal dependencies
1521 */
1522
1523
1524
1525 function widgetsToBlocks(widgets) {
1526 return widgets.map(widget => widgetToBlock(widget));
1527 }
1528
1529 function useSidebarBlockEditor(sidebar) {
1530 const [blocks, setBlocks] = (0,external_wp_element_namespaceObject.useState)(() => widgetsToBlocks(sidebar.getWidgets()));
1531 (0,external_wp_element_namespaceObject.useEffect)(() => {
1532 return sidebar.subscribe((prevWidgets, nextWidgets) => {
1533 setBlocks(prevBlocks => {
1534 const prevWidgetsMap = new Map(prevWidgets.map(widget => [widget.id, widget]));
1535 const prevBlocksMap = new Map(prevBlocks.map(block => [(0,external_wp_widgets_namespaceObject.getWidgetIdFromBlock)(block), block]));
1536 const nextBlocks = nextWidgets.map(nextWidget => {
1537 const prevWidget = prevWidgetsMap.get(nextWidget.id); // Bail out updates.
1538
1539 if (prevWidget && prevWidget === nextWidget) {
1540 return prevBlocksMap.get(nextWidget.id);
1541 }
1542
1543 return widgetToBlock(nextWidget);
1544 }); // Bail out updates.
1545
1546 if (external_wp_isShallowEqual_default()(prevBlocks, nextBlocks)) {
1547 return prevBlocks;
1548 }
1549
1550 return nextBlocks;
1551 });
1552 });
1553 }, [sidebar]);
1554 const onChangeBlocks = (0,external_wp_element_namespaceObject.useCallback)(nextBlocks => {
1555 setBlocks(prevBlocks => {
1556 if (external_wp_isShallowEqual_default()(prevBlocks, nextBlocks)) {
1557 return prevBlocks;
1558 }
1559
1560 const prevBlocksMap = new Map(prevBlocks.map(block => [(0,external_wp_widgets_namespaceObject.getWidgetIdFromBlock)(block), block]));
1561 const nextWidgets = nextBlocks.map(nextBlock => {
1562 const widgetId = (0,external_wp_widgets_namespaceObject.getWidgetIdFromBlock)(nextBlock); // Update existing widgets.
1563
1564 if (widgetId && prevBlocksMap.has(widgetId)) {
1565 const prevBlock = prevBlocksMap.get(widgetId);
1566 const prevWidget = sidebar.getWidget(widgetId); // Bail out updates by returning the previous widgets.
1567 // Deep equality is necessary until the block editor's internals changes.
1568
1569 if ((0,external_lodash_namespaceObject.isEqual)(nextBlock, prevBlock) && prevWidget) {
1570 return prevWidget;
1571 }
1572
1573 return blockToWidget(nextBlock, prevWidget);
1574 } // Add a new widget.
1575
1576
1577 return blockToWidget(nextBlock);
1578 }); // Bail out updates if the updated widgets are the same.
1579
1580 if (external_wp_isShallowEqual_default()(sidebar.getWidgets(), nextWidgets)) {
1581 return prevBlocks;
1582 }
1583
1584 const addedWidgetIds = sidebar.setWidgets(nextWidgets);
1585 return nextBlocks.reduce((updatedNextBlocks, nextBlock, index) => {
1586 const addedWidgetId = addedWidgetIds[index];
1587
1588 if (addedWidgetId !== null) {
1589 // Only create a new instance if necessary to prevent
1590 // the whole editor from re-rendering on every edit.
1591 if (updatedNextBlocks === nextBlocks) {
1592 updatedNextBlocks = nextBlocks.slice();
1593 }
1594
1595 updatedNextBlocks[index] = (0,external_wp_widgets_namespaceObject.addWidgetIdToBlock)(nextBlock, addedWidgetId);
1596 }
1597
1598 return updatedNextBlocks;
1599 }, nextBlocks);
1600 });
1601 }, [sidebar]);
1602 return [blocks, onChangeBlocks, onChangeBlocks];
1603 }
1604
1605 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/focus-control/index.js
1606
1607
1608 /**
1609 * WordPress dependencies
1610 */
1611
1612 /**
1613 * Internal dependencies
1614 */
1615
1616
1617 const FocusControlContext = (0,external_wp_element_namespaceObject.createContext)();
1618 function FocusControl(_ref) {
1619 let {
1620 api,
1621 sidebarControls,
1622 children
1623 } = _ref;
1624 const [focusedWidgetIdRef, setFocusedWidgetIdRef] = (0,external_wp_element_namespaceObject.useState)({
1625 current: null
1626 });
1627 const focusWidget = (0,external_wp_element_namespaceObject.useCallback)(widgetId => {
1628 for (const sidebarControl of sidebarControls) {
1629 const widgets = sidebarControl.setting.get();
1630
1631 if (widgets.includes(widgetId)) {
1632 sidebarControl.sectionInstance.expand({
1633 // Schedule it after the complete callback so that
1634 // it won't be overridden by the "Back" button focus.
1635 completeCallback() {
1636 // Create a "ref-like" object every time to ensure
1637 // the same widget id can also triggers the focus control.
1638 setFocusedWidgetIdRef({
1639 current: widgetId
1640 });
1641 }
1642
1643 });
1644 break;
1645 }
1646 }
1647 }, [sidebarControls]);
1648 (0,external_wp_element_namespaceObject.useEffect)(() => {
1649 function handleFocus(settingId) {
1650 const widgetId = settingIdToWidgetId(settingId);
1651 focusWidget(widgetId);
1652 }
1653
1654 function handleReady() {
1655 api.previewer.preview.bind('focus-control-for-setting', handleFocus);
1656 }
1657
1658 api.previewer.bind('ready', handleReady);
1659 return () => {
1660 api.previewer.unbind('ready', handleReady);
1661 api.previewer.preview.unbind('focus-control-for-setting', handleFocus);
1662 };
1663 }, [api, focusWidget]);
1664 const context = (0,external_wp_element_namespaceObject.useMemo)(() => [focusedWidgetIdRef, focusWidget], [focusedWidgetIdRef, focusWidget]);
1665 return (0,external_wp_element_namespaceObject.createElement)(FocusControlContext.Provider, {
1666 value: context
1667 }, children);
1668 }
1669 const useFocusControl = () => (0,external_wp_element_namespaceObject.useContext)(FocusControlContext);
1670
1671 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/focus-control/use-blocks-focus-control.js
1672 /**
1673 * WordPress dependencies
1674 */
1675
1676
1677
1678
1679 /**
1680 * Internal dependencies
1681 */
1682
1683
1684 function useBlocksFocusControl(blocks) {
1685 const {
1686 selectBlock
1687 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_blockEditor_namespaceObject.store);
1688 const [focusedWidgetIdRef] = useFocusControl();
1689 const blocksRef = (0,external_wp_element_namespaceObject.useRef)(blocks);
1690 (0,external_wp_element_namespaceObject.useEffect)(() => {
1691 blocksRef.current = blocks;
1692 }, [blocks]);
1693 (0,external_wp_element_namespaceObject.useEffect)(() => {
1694 if (focusedWidgetIdRef.current) {
1695 const focusedBlock = blocksRef.current.find(block => (0,external_wp_widgets_namespaceObject.getWidgetIdFromBlock)(block) === focusedWidgetIdRef.current);
1696
1697 if (focusedBlock) {
1698 selectBlock(focusedBlock.clientId); // If the block is already being selected, the DOM node won't
1699 // get focused again automatically.
1700 // We select the DOM and focus it manually here.
1701
1702 const blockNode = document.querySelector(`[data-block="${focusedBlock.clientId}"]`);
1703 blockNode === null || blockNode === void 0 ? void 0 : blockNode.focus();
1704 }
1705 }
1706 }, [focusedWidgetIdRef, selectBlock]);
1707 }
1708
1709 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/sidebar-block-editor/sidebar-editor-provider.js
1710
1711
1712 /**
1713 * WordPress dependencies
1714 */
1715
1716 /**
1717 * Internal dependencies
1718 */
1719
1720
1721
1722 function SidebarEditorProvider(_ref) {
1723 let {
1724 sidebar,
1725 settings,
1726 children
1727 } = _ref;
1728 const [blocks, onInput, onChange] = useSidebarBlockEditor(sidebar);
1729 useBlocksFocusControl(blocks);
1730 return (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.BlockEditorProvider, {
1731 value: blocks,
1732 onInput: onInput,
1733 onChange: onChange,
1734 settings: settings,
1735 useSubRegistry: false
1736 }, children);
1737 }
1738
1739 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/welcome-guide/index.js
1740
1741
1742 /**
1743 * WordPress dependencies
1744 */
1745
1746
1747
1748
1749 function WelcomeGuide(_ref) {
1750 let {
1751 sidebar
1752 } = _ref;
1753 const {
1754 toggle
1755 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_preferences_namespaceObject.store);
1756 const isEntirelyBlockWidgets = sidebar.getWidgets().every(widget => widget.id.startsWith('block-'));
1757 return (0,external_wp_element_namespaceObject.createElement)("div", {
1758 className: "customize-widgets-welcome-guide"
1759 }, (0,external_wp_element_namespaceObject.createElement)("div", {
1760 className: "customize-widgets-welcome-guide__image__wrapper"
1761 }, (0,external_wp_element_namespaceObject.createElement)("picture", null, (0,external_wp_element_namespaceObject.createElement)("source", {
1762 srcSet: "https://s.w.org/images/block-editor/welcome-editor.svg",
1763 media: "(prefers-reduced-motion: reduce)"
1764 }), (0,external_wp_element_namespaceObject.createElement)("img", {
1765 className: "customize-widgets-welcome-guide__image",
1766 src: "https://s.w.org/images/block-editor/welcome-editor.gif",
1767 width: "312",
1768 height: "240",
1769 alt: ""
1770 }))), (0,external_wp_element_namespaceObject.createElement)("h1", {
1771 className: "customize-widgets-welcome-guide__heading"
1772 }, (0,external_wp_i18n_namespaceObject.__)('Welcome to block Widgets')), (0,external_wp_element_namespaceObject.createElement)("p", {
1773 className: "customize-widgets-welcome-guide__text"
1774 }, isEntirelyBlockWidgets ? (0,external_wp_i18n_namespaceObject.__)('Your theme provides different “block” areas for you to add and edit content. Try adding a search bar, social icons, or other types of blocks here and see how they’ll look on your site.') : (0,external_wp_i18n_namespaceObject.__)('You can now add any block to your site’s widget areas. Don’t worry, all of your favorite widgets still work flawlessly.')), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.Button, {
1775 className: "customize-widgets-welcome-guide__button",
1776 variant: "primary",
1777 onClick: () => toggle('core/customize-widgets', 'welcomeGuide')
1778 }, (0,external_wp_i18n_namespaceObject.__)('Got it')), (0,external_wp_element_namespaceObject.createElement)("hr", {
1779 className: "customize-widgets-welcome-guide__separator"
1780 }), !isEntirelyBlockWidgets && (0,external_wp_element_namespaceObject.createElement)("p", {
1781 className: "customize-widgets-welcome-guide__more-info"
1782 }, (0,external_wp_i18n_namespaceObject.__)('Want to stick with the old widgets?'), (0,external_wp_element_namespaceObject.createElement)("br", null), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.ExternalLink, {
1783 href: (0,external_wp_i18n_namespaceObject.__)('https://wordpress.org/plugins/classic-widgets/')
1784 }, (0,external_wp_i18n_namespaceObject.__)('Get the Classic Widgets plugin.'))), (0,external_wp_element_namespaceObject.createElement)("p", {
1785 className: "customize-widgets-welcome-guide__more-info"
1786 }, (0,external_wp_i18n_namespaceObject.__)('New to the block editor?'), (0,external_wp_element_namespaceObject.createElement)("br", null), (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.ExternalLink, {
1787 href: (0,external_wp_i18n_namespaceObject.__)('https://wordpress.org/support/article/wordpress-editor/')
1788 }, (0,external_wp_i18n_namespaceObject.__)("Here's a detailed guide."))));
1789 }
1790
1791 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/keyboard-shortcuts/index.js
1792 /**
1793 * WordPress dependencies
1794 */
1795
1796
1797
1798
1799
1800 function KeyboardShortcuts(_ref) {
1801 let {
1802 undo,
1803 redo,
1804 save
1805 } = _ref;
1806 (0,external_wp_keyboardShortcuts_namespaceObject.useShortcut)('core/customize-widgets/undo', event => {
1807 undo();
1808 event.preventDefault();
1809 });
1810 (0,external_wp_keyboardShortcuts_namespaceObject.useShortcut)('core/customize-widgets/redo', event => {
1811 redo();
1812 event.preventDefault();
1813 });
1814 (0,external_wp_keyboardShortcuts_namespaceObject.useShortcut)('core/customize-widgets/save', event => {
1815 event.preventDefault();
1816 save();
1817 });
1818 return null;
1819 }
1820
1821 function KeyboardShortcutsRegister() {
1822 const {
1823 registerShortcut,
1824 unregisterShortcut
1825 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_keyboardShortcuts_namespaceObject.store);
1826 (0,external_wp_element_namespaceObject.useEffect)(() => {
1827 registerShortcut({
1828 name: 'core/customize-widgets/undo',
1829 category: 'global',
1830 description: (0,external_wp_i18n_namespaceObject.__)('Undo your last changes.'),
1831 keyCombination: {
1832 modifier: 'primary',
1833 character: 'z'
1834 }
1835 });
1836 registerShortcut({
1837 name: 'core/customize-widgets/redo',
1838 category: 'global',
1839 description: (0,external_wp_i18n_namespaceObject.__)('Redo your last undo.'),
1840 keyCombination: {
1841 modifier: 'primaryShift',
1842 character: 'z'
1843 }
1844 });
1845 registerShortcut({
1846 name: 'core/customize-widgets/save',
1847 category: 'global',
1848 description: (0,external_wp_i18n_namespaceObject.__)('Save your changes.'),
1849 keyCombination: {
1850 modifier: 'primary',
1851 character: 's'
1852 }
1853 });
1854 return () => {
1855 unregisterShortcut('core/customize-widgets/undo');
1856 unregisterShortcut('core/customize-widgets/redo');
1857 unregisterShortcut('core/customize-widgets/save');
1858 };
1859 }, [registerShortcut]);
1860 return null;
1861 }
1862
1863 KeyboardShortcuts.Register = KeyboardShortcutsRegister;
1864 /* harmony default export */ var keyboard_shortcuts = (KeyboardShortcuts);
1865
1866 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/block-appender/index.js
1867
1868
1869
1870 /**
1871 * WordPress dependencies
1872 */
1873
1874
1875
1876 function BlockAppender(props) {
1877 const ref = (0,external_wp_element_namespaceObject.useRef)();
1878 const isBlocksListEmpty = (0,external_wp_data_namespaceObject.useSelect)(select => select(external_wp_blockEditor_namespaceObject.store).getBlockCount() === 0); // Move the focus to the block appender to prevent focus from
1879 // being lost when emptying the widget area.
1880
1881 (0,external_wp_element_namespaceObject.useEffect)(() => {
1882 if (isBlocksListEmpty && ref.current) {
1883 const {
1884 ownerDocument
1885 } = ref.current;
1886
1887 if (!ownerDocument.activeElement || ownerDocument.activeElement === ownerDocument.body) {
1888 ref.current.focus();
1889 }
1890 }
1891 }, [isBlocksListEmpty]);
1892 return (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.ButtonBlockAppender, _extends({}, props, {
1893 ref: ref
1894 }));
1895 }
1896
1897 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/sidebar-block-editor/index.js
1898
1899
1900 /**
1901 * External dependencies
1902 */
1903
1904 /**
1905 * WordPress dependencies
1906 */
1907
1908
1909
1910
1911
1912
1913
1914 /**
1915 * Internal dependencies
1916 */
1917
1918
1919
1920
1921
1922
1923
1924
1925 function SidebarBlockEditor(_ref) {
1926 let {
1927 blockEditorSettings,
1928 sidebar,
1929 inserter,
1930 inspector
1931 } = _ref;
1932 const [isInserterOpened, setIsInserterOpened] = useInserter(inserter);
1933 const {
1934 hasUploadPermissions,
1935 isFixedToolbarActive,
1936 keepCaretInsideBlock,
1937 isWelcomeGuideActive
1938 } = (0,external_wp_data_namespaceObject.useSelect)(select => {
1939 const {
1940 get
1941 } = select(external_wp_preferences_namespaceObject.store);
1942 return {
1943 hasUploadPermissions: (0,external_lodash_namespaceObject.defaultTo)(select(external_wp_coreData_namespaceObject.store).canUser('create', 'media'), true),
1944 isFixedToolbarActive: !!get('core/customize-widgets', 'fixedToolbar'),
1945 keepCaretInsideBlock: !!get('core/customize-widgets', 'keepCaretInsideBlock'),
1946 isWelcomeGuideActive: !!get('core/customize-widgets', 'welcomeGuide')
1947 };
1948 }, []);
1949 const settings = (0,external_wp_element_namespaceObject.useMemo)(() => {
1950 let mediaUploadBlockEditor;
1951
1952 if (hasUploadPermissions) {
1953 mediaUploadBlockEditor = _ref2 => {
1954 let {
1955 onError,
1956 ...argumentsObject
1957 } = _ref2;
1958 (0,external_wp_mediaUtils_namespaceObject.uploadMedia)({
1959 wpAllowedMimeTypes: blockEditorSettings.allowedMimeTypes,
1960 onError: _ref3 => {
1961 let {
1962 message
1963 } = _ref3;
1964 return onError(message);
1965 },
1966 ...argumentsObject
1967 });
1968 };
1969 }
1970
1971 return { ...blockEditorSettings,
1972 __experimentalSetIsInserterOpened: setIsInserterOpened,
1973 mediaUpload: mediaUploadBlockEditor,
1974 hasFixedToolbar: isFixedToolbarActive,
1975 keepCaretInsideBlock,
1976 __unstableHasCustomAppender: true
1977 };
1978 }, [hasUploadPermissions, blockEditorSettings, isFixedToolbarActive, keepCaretInsideBlock, setIsInserterOpened]);
1979
1980 if (isWelcomeGuideActive) {
1981 return (0,external_wp_element_namespaceObject.createElement)(WelcomeGuide, {
1982 sidebar: sidebar
1983 });
1984 }
1985
1986 return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.BlockEditorKeyboardShortcuts.Register, null), (0,external_wp_element_namespaceObject.createElement)(keyboard_shortcuts.Register, null), (0,external_wp_element_namespaceObject.createElement)(SidebarEditorProvider, {
1987 sidebar: sidebar,
1988 settings: settings
1989 }, (0,external_wp_element_namespaceObject.createElement)(keyboard_shortcuts, {
1990 undo: sidebar.undo,
1991 redo: sidebar.redo,
1992 save: sidebar.save
1993 }), (0,external_wp_element_namespaceObject.createElement)(header, {
1994 sidebar: sidebar,
1995 inserter: inserter,
1996 isInserterOpened: isInserterOpened,
1997 setIsInserterOpened: setIsInserterOpened,
1998 isFixedToolbarActive: isFixedToolbarActive
1999 }), (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.CopyHandler, null, (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.BlockTools, null, (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.__unstableEditorStyles, {
2000 styles: settings.defaultEditorStyles
2001 }), (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.BlockSelectionClearer, null, (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.WritingFlow, {
2002 className: "editor-styles-wrapper"
2003 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.ObserveTyping, null, (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.BlockList, {
2004 renderAppender: BlockAppender
2005 })))))), (0,external_wp_element_namespaceObject.createPortal)( // This is a temporary hack to prevent button component inside <BlockInspector>
2006 // from submitting form when type="button" is not specified.
2007 (0,external_wp_element_namespaceObject.createElement)("form", {
2008 onSubmit: event => event.preventDefault()
2009 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.BlockInspector, null)), inspector.contentContainer[0])), (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.__unstableBlockSettingsMenuFirstItem, null, _ref4 => {
2010 let {
2011 onClose
2012 } = _ref4;
2013 return (0,external_wp_element_namespaceObject.createElement)(block_inspector_button, {
2014 inspector: inspector,
2015 closeMenu: onClose
2016 });
2017 }));
2018 }
2019
2020 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/sidebar-controls/index.js
2021
2022
2023 /**
2024 * WordPress dependencies
2025 */
2026
2027 const SidebarControlsContext = (0,external_wp_element_namespaceObject.createContext)();
2028 function SidebarControls(_ref) {
2029 let {
2030 sidebarControls,
2031 activeSidebarControl,
2032 children
2033 } = _ref;
2034 const context = (0,external_wp_element_namespaceObject.useMemo)(() => ({
2035 sidebarControls,
2036 activeSidebarControl
2037 }), [sidebarControls, activeSidebarControl]);
2038 return (0,external_wp_element_namespaceObject.createElement)(SidebarControlsContext.Provider, {
2039 value: context
2040 }, children);
2041 }
2042 function useSidebarControls() {
2043 const {
2044 sidebarControls
2045 } = (0,external_wp_element_namespaceObject.useContext)(SidebarControlsContext);
2046 return sidebarControls;
2047 }
2048 function useActiveSidebarControl() {
2049 const {
2050 activeSidebarControl
2051 } = (0,external_wp_element_namespaceObject.useContext)(SidebarControlsContext);
2052 return activeSidebarControl;
2053 }
2054
2055 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/customize-widgets/use-clear-selected-block.js
2056 /**
2057 * WordPress dependencies
2058 */
2059
2060
2061
2062 /**
2063 * We can't just use <BlockSelectionClearer> because the customizer has
2064 * many root nodes rather than just one in the post editor.
2065 * We need to listen to the focus events in all those roots, and also in
2066 * the preview iframe.
2067 * This hook will clear the selected block when focusing outside the editor,
2068 * with a few exceptions:
2069 * 1. Focusing on popovers.
2070 * 2. Focusing on the inspector.
2071 * 3. Focusing on any modals/dialogs.
2072 * These cases are normally triggered by user interactions from the editor,
2073 * not by explicitly focusing outside the editor, hence no need for clearing.
2074 *
2075 * @param {Object} sidebarControl The sidebar control instance.
2076 * @param {Object} popoverRef The ref object of the popover node container.
2077 */
2078
2079 function useClearSelectedBlock(sidebarControl, popoverRef) {
2080 const {
2081 hasSelectedBlock,
2082 hasMultiSelection
2083 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blockEditor_namespaceObject.store);
2084 const {
2085 clearSelectedBlock
2086 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_blockEditor_namespaceObject.store);
2087 (0,external_wp_element_namespaceObject.useEffect)(() => {
2088 if (popoverRef.current && sidebarControl) {
2089 const inspector = sidebarControl.inspector;
2090 const container = sidebarControl.container[0];
2091 const ownerDocument = container.ownerDocument;
2092 const ownerWindow = ownerDocument.defaultView;
2093
2094 function handleClearSelectedBlock(element) {
2095 if ( // 1. Make sure there are blocks being selected.
2096 (hasSelectedBlock() || hasMultiSelection()) && // 2. The element should exist in the DOM (not deleted).
2097 element && ownerDocument.contains(element) && // 3. It should also not exist in the container, the popover, nor the dialog.
2098 !container.contains(element) && !popoverRef.current.contains(element) && !element.closest('[role="dialog"]') && // 4. The inspector should not be opened.
2099 !inspector.expanded()) {
2100 clearSelectedBlock();
2101 }
2102 } // Handle mouse down in the same document.
2103
2104
2105 function handleMouseDown(event) {
2106 handleClearSelectedBlock(event.target);
2107 } // Handle focusing outside the current document, like to iframes.
2108
2109
2110 function handleBlur() {
2111 handleClearSelectedBlock(ownerDocument.activeElement);
2112 }
2113
2114 ownerDocument.addEventListener('mousedown', handleMouseDown);
2115 ownerWindow.addEventListener('blur', handleBlur);
2116 return () => {
2117 ownerDocument.removeEventListener('mousedown', handleMouseDown);
2118 ownerWindow.removeEventListener('blur', handleBlur);
2119 };
2120 }
2121 }, [popoverRef, sidebarControl, hasSelectedBlock, hasMultiSelection, clearSelectedBlock]);
2122 }
2123
2124 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/customize-widgets/index.js
2125
2126
2127 /**
2128 * WordPress dependencies
2129 */
2130
2131
2132
2133 /**
2134 * Internal dependencies
2135 */
2136
2137
2138
2139
2140
2141
2142 function CustomizeWidgets(_ref) {
2143 let {
2144 api,
2145 sidebarControls,
2146 blockEditorSettings
2147 } = _ref;
2148 const [activeSidebarControl, setActiveSidebarControl] = (0,external_wp_element_namespaceObject.useState)(null);
2149 const parentContainer = document.getElementById('customize-theme-controls');
2150 const popoverRef = (0,external_wp_element_namespaceObject.useRef)();
2151 useClearSelectedBlock(activeSidebarControl, popoverRef);
2152 (0,external_wp_element_namespaceObject.useEffect)(() => {
2153 const unsubscribers = sidebarControls.map(sidebarControl => sidebarControl.subscribe(expanded => {
2154 if (expanded) {
2155 setActiveSidebarControl(sidebarControl);
2156 }
2157 }));
2158 return () => {
2159 unsubscribers.forEach(unsubscriber => unsubscriber());
2160 };
2161 }, [sidebarControls]);
2162 const activeSidebar = activeSidebarControl && (0,external_wp_element_namespaceObject.createPortal)((0,external_wp_element_namespaceObject.createElement)(ErrorBoundary, null, (0,external_wp_element_namespaceObject.createElement)(SidebarBlockEditor, {
2163 key: activeSidebarControl.id,
2164 blockEditorSettings: blockEditorSettings,
2165 sidebar: activeSidebarControl.sidebarAdapter,
2166 inserter: activeSidebarControl.inserter,
2167 inspector: activeSidebarControl.inspector
2168 })), activeSidebarControl.container[0]); // We have to portal this to the parent of both the editor and the inspector,
2169 // so that the popovers will appear above both of them.
2170
2171 const popover = parentContainer && (0,external_wp_element_namespaceObject.createPortal)((0,external_wp_element_namespaceObject.createElement)("div", {
2172 className: "customize-widgets-popover",
2173 ref: popoverRef
2174 }, (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.Popover.Slot, null)), parentContainer);
2175 return (0,external_wp_element_namespaceObject.createElement)(external_wp_keyboardShortcuts_namespaceObject.ShortcutProvider, null, (0,external_wp_element_namespaceObject.createElement)(external_wp_components_namespaceObject.SlotFillProvider, null, (0,external_wp_element_namespaceObject.createElement)(SidebarControls, {
2176 sidebarControls: sidebarControls,
2177 activeSidebarControl: activeSidebarControl
2178 }, (0,external_wp_element_namespaceObject.createElement)(FocusControl, {
2179 api: api,
2180 sidebarControls: sidebarControls
2181 }, activeSidebar, popover))));
2182 }
2183
2184 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/controls/inspector-section.js
2185 function getInspectorSection() {
2186 const {
2187 wp: {
2188 customize
2189 }
2190 } = window;
2191 return class InspectorSection extends customize.Section {
2192 constructor(id, options) {
2193 super(id, options);
2194 this.parentSection = options.parentSection;
2195 this.returnFocusWhenClose = null;
2196 this._isOpen = false;
2197 }
2198
2199 get isOpen() {
2200 return this._isOpen;
2201 }
2202
2203 set isOpen(value) {
2204 this._isOpen = value;
2205 this.triggerActiveCallbacks();
2206 }
2207
2208 ready() {
2209 this.contentContainer[0].classList.add('customize-widgets-layout__inspector');
2210 }
2211
2212 isContextuallyActive() {
2213 return this.isOpen;
2214 }
2215
2216 onChangeExpanded(expanded, args) {
2217 super.onChangeExpanded(expanded, args);
2218
2219 if (this.parentSection && !args.unchanged) {
2220 if (expanded) {
2221 this.parentSection.collapse({
2222 manualTransition: true
2223 });
2224 } else {
2225 this.parentSection.expand({
2226 manualTransition: true,
2227 completeCallback: () => {
2228 // Return focus after finishing the transition.
2229 if (this.returnFocusWhenClose && !this.contentContainer[0].contains(this.returnFocusWhenClose)) {
2230 this.returnFocusWhenClose.focus();
2231 }
2232 }
2233 });
2234 }
2235 }
2236 }
2237
2238 open() {
2239 let {
2240 returnFocusWhenClose
2241 } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
2242 this.isOpen = true;
2243 this.returnFocusWhenClose = returnFocusWhenClose;
2244 this.expand({
2245 allowMultiple: true
2246 });
2247 }
2248
2249 close() {
2250 this.collapse({
2251 allowMultiple: true
2252 });
2253 }
2254
2255 collapse(options) {
2256 // Overridden collapse() function. Mostly call the parent collapse(), but also
2257 // move our .isOpen to false.
2258 // Initially, I tried tracking this with onChangeExpanded(), but it doesn't work
2259 // because the block settings sidebar is a layer "on top of" the G editor sidebar.
2260 //
2261 // For example, when closing the block settings sidebar, the G
2262 // editor sidebar would display, and onChangeExpanded in
2263 // inspector-section would run with expanded=true, but I want
2264 // isOpen to be false when the block settings is closed.
2265 this.isOpen = false;
2266 super.collapse(options);
2267 }
2268
2269 triggerActiveCallbacks() {
2270 // Manually fire the callbacks associated with moving this.active
2271 // from false to true. "active" is always true for this section,
2272 // and "isContextuallyActive" reflects if the block settings
2273 // sidebar is currently visible, that is, it has replaced the main
2274 // Gutenberg view.
2275 // The WP customizer only checks ".isContextuallyActive()" when
2276 // ".active" changes values. But our ".active" never changes value.
2277 // The WP customizer never foresaw a section being used a way we
2278 // fit the block settings sidebar into a section. By manually
2279 // triggering the "this.active" callbacks, we force the WP
2280 // customizer to query our .isContextuallyActive() function and
2281 // update its view of our status.
2282 this.active.callbacks.fireWith(this.active, [false, true]);
2283 }
2284
2285 };
2286 }
2287
2288 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/controls/sidebar-section.js
2289 /**
2290 * WordPress dependencies
2291 */
2292
2293 /**
2294 * Internal dependencies
2295 */
2296
2297
2298
2299 const getInspectorSectionId = sidebarId => `widgets-inspector-${sidebarId}`;
2300
2301 function getSidebarSection() {
2302 const {
2303 wp: {
2304 customize
2305 }
2306 } = window;
2307 const reduceMotionMediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
2308 let isReducedMotion = reduceMotionMediaQuery.matches;
2309 reduceMotionMediaQuery.addEventListener('change', event => {
2310 isReducedMotion = event.matches;
2311 });
2312 return class SidebarSection extends customize.Section {
2313 ready() {
2314 const InspectorSection = getInspectorSection();
2315 this.inspector = new InspectorSection(getInspectorSectionId(this.id), {
2316 title: (0,external_wp_i18n_namespaceObject.__)('Block Settings'),
2317 parentSection: this,
2318 customizeAction: [(0,external_wp_i18n_namespaceObject.__)('Customizing'), (0,external_wp_i18n_namespaceObject.__)('Widgets'), this.params.title].join('')
2319 });
2320 customize.section.add(this.inspector);
2321 this.contentContainer[0].classList.add('customize-widgets__sidebar-section');
2322 }
2323
2324 hasSubSectionOpened() {
2325 return this.inspector.expanded();
2326 }
2327
2328 onChangeExpanded(expanded, _args) {
2329 const controls = this.controls();
2330 const args = { ..._args,
2331
2332 completeCallback() {
2333 var _args$completeCallbac;
2334
2335 controls.forEach(control => {
2336 var _control$onChangeSect;
2337
2338 (_control$onChangeSect = control.onChangeSectionExpanded) === null || _control$onChangeSect === void 0 ? void 0 : _control$onChangeSect.call(control, expanded, args);
2339 });
2340 (_args$completeCallbac = _args.completeCallback) === null || _args$completeCallbac === void 0 ? void 0 : _args$completeCallbac.call(_args);
2341 }
2342
2343 };
2344
2345 if (args.manualTransition) {
2346 if (expanded) {
2347 this.contentContainer.addClass(['busy', 'open']);
2348 this.contentContainer.removeClass('is-sub-section-open');
2349 this.contentContainer.closest('.wp-full-overlay').addClass('section-open');
2350 } else {
2351 this.contentContainer.addClass(['busy', 'is-sub-section-open']);
2352 this.contentContainer.closest('.wp-full-overlay').addClass('section-open');
2353 this.contentContainer.removeClass('open');
2354 }
2355
2356 const handleTransitionEnd = () => {
2357 this.contentContainer.removeClass('busy');
2358 args.completeCallback();
2359 };
2360
2361 if (isReducedMotion) {
2362 handleTransitionEnd();
2363 } else {
2364 this.contentContainer.one('transitionend', handleTransitionEnd);
2365 }
2366 } else {
2367 super.onChangeExpanded(expanded, args);
2368 }
2369 }
2370
2371 };
2372 }
2373
2374 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/components/sidebar-block-editor/sidebar-adapter.js
2375 /**
2376 * Internal dependencies
2377 */
2378
2379 const {
2380 wp
2381 } = window;
2382
2383 function parseWidgetId(widgetId) {
2384 const matches = widgetId.match(/^(.+)-(\d+)$/);
2385
2386 if (matches) {
2387 return {
2388 idBase: matches[1],
2389 number: parseInt(matches[2], 10)
2390 };
2391 } // Likely an old single widget.
2392
2393
2394 return {
2395 idBase: widgetId
2396 };
2397 }
2398
2399 function widgetIdToSettingId(widgetId) {
2400 const {
2401 idBase,
2402 number
2403 } = parseWidgetId(widgetId);
2404
2405 if (number) {
2406 return `widget_${idBase}[${number}]`;
2407 }
2408
2409 return `widget_${idBase}`;
2410 }
2411 /**
2412 * This is a custom debounce function to call different callbacks depending on
2413 * whether it's the _leading_ call or not.
2414 *
2415 * @param {Function} leading The callback that gets called first.
2416 * @param {Function} callback The callback that gets called after the first time.
2417 * @param {number} timeout The debounced time in milliseconds.
2418 * @return {Function} The debounced function.
2419 */
2420
2421
2422 function debounce(leading, callback, timeout) {
2423 let isLeading = false;
2424 let timerID;
2425
2426 function debounced() {
2427 for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
2428 args[_key] = arguments[_key];
2429 }
2430
2431 const result = (isLeading ? callback : leading).apply(this, args);
2432 isLeading = true;
2433 clearTimeout(timerID);
2434 timerID = setTimeout(() => {
2435 isLeading = false;
2436 }, timeout);
2437 return result;
2438 }
2439
2440 debounced.cancel = () => {
2441 isLeading = false;
2442 clearTimeout(timerID);
2443 };
2444
2445 return debounced;
2446 }
2447
2448 class SidebarAdapter {
2449 constructor(setting, api) {
2450 this.setting = setting;
2451 this.api = api;
2452 this.locked = false;
2453 this.widgetsCache = new WeakMap();
2454 this.subscribers = new Set();
2455 this.history = [this._getWidgetIds().map(widgetId => this.getWidget(widgetId))];
2456 this.historyIndex = 0;
2457 this.historySubscribers = new Set(); // Debounce the input for 1 second.
2458
2459 this._debounceSetHistory = debounce(this._pushHistory, this._replaceHistory, 1000);
2460 this.setting.bind(this._handleSettingChange.bind(this));
2461 this.api.bind('change', this._handleAllSettingsChange.bind(this));
2462 this.undo = this.undo.bind(this);
2463 this.redo = this.redo.bind(this);
2464 this.save = this.save.bind(this);
2465 }
2466
2467 subscribe(callback) {
2468 this.subscribers.add(callback);
2469 return () => {
2470 this.subscribers.delete(callback);
2471 };
2472 }
2473
2474 getWidgets() {
2475 return this.history[this.historyIndex];
2476 }
2477
2478 _emit() {
2479 for (const callback of this.subscribers) {
2480 callback(...arguments);
2481 }
2482 }
2483
2484 _getWidgetIds() {
2485 return this.setting.get();
2486 }
2487
2488 _pushHistory() {
2489 this.history = [...this.history.slice(0, this.historyIndex + 1), this._getWidgetIds().map(widgetId => this.getWidget(widgetId))];
2490 this.historyIndex += 1;
2491 this.historySubscribers.forEach(listener => listener());
2492 }
2493
2494 _replaceHistory() {
2495 this.history[this.historyIndex] = this._getWidgetIds().map(widgetId => this.getWidget(widgetId));
2496 }
2497
2498 _handleSettingChange() {
2499 if (this.locked) {
2500 return;
2501 }
2502
2503 const prevWidgets = this.getWidgets();
2504
2505 this._pushHistory();
2506
2507 this._emit(prevWidgets, this.getWidgets());
2508 }
2509
2510 _handleAllSettingsChange(setting) {
2511 if (this.locked) {
2512 return;
2513 }
2514
2515 if (!setting.id.startsWith('widget_')) {
2516 return;
2517 }
2518
2519 const widgetId = settingIdToWidgetId(setting.id);
2520
2521 if (!this.setting.get().includes(widgetId)) {
2522 return;
2523 }
2524
2525 const prevWidgets = this.getWidgets();
2526
2527 this._pushHistory();
2528
2529 this._emit(prevWidgets, this.getWidgets());
2530 }
2531
2532 _createWidget(widget) {
2533 const widgetModel = wp.customize.Widgets.availableWidgets.findWhere({
2534 id_base: widget.idBase
2535 });
2536 let number = widget.number;
2537
2538 if (widgetModel.get('is_multi') && !number) {
2539 widgetModel.set('multi_number', widgetModel.get('multi_number') + 1);
2540 number = widgetModel.get('multi_number');
2541 }
2542
2543 const settingId = number ? `widget_${widget.idBase}[${number}]` : `widget_${widget.idBase}`;
2544 const settingArgs = {
2545 transport: wp.customize.Widgets.data.selectiveRefreshableWidgets[widgetModel.get('id_base')] ? 'postMessage' : 'refresh',
2546 previewer: this.setting.previewer
2547 };
2548 const setting = this.api.create(settingId, settingId, '', settingArgs);
2549 setting.set(widget.instance);
2550 const widgetId = settingIdToWidgetId(settingId);
2551 return widgetId;
2552 }
2553
2554 _removeWidget(widget) {
2555 const settingId = widgetIdToSettingId(widget.id);
2556 const setting = this.api(settingId);
2557
2558 if (setting) {
2559 const instance = setting.get();
2560 this.widgetsCache.delete(instance);
2561 }
2562
2563 this.api.remove(settingId);
2564 }
2565
2566 _updateWidget(widget) {
2567 const prevWidget = this.getWidget(widget.id); // Bail out update if nothing changed.
2568
2569 if (prevWidget === widget) {
2570 return widget.id;
2571 } // Update existing setting if only the widget's instance changed.
2572
2573
2574 if (prevWidget.idBase && widget.idBase && prevWidget.idBase === widget.idBase) {
2575 const settingId = widgetIdToSettingId(widget.id);
2576 this.api(settingId).set(widget.instance);
2577 return widget.id;
2578 } // Otherwise delete and re-create.
2579
2580
2581 this._removeWidget(widget);
2582
2583 return this._createWidget(widget);
2584 }
2585
2586 getWidget(widgetId) {
2587 if (!widgetId) {
2588 return null;
2589 }
2590
2591 const {
2592 idBase,
2593 number
2594 } = parseWidgetId(widgetId);
2595 const settingId = widgetIdToSettingId(widgetId);
2596 const setting = this.api(settingId);
2597
2598 if (!setting) {
2599 return null;
2600 }
2601
2602 const instance = setting.get();
2603
2604 if (this.widgetsCache.has(instance)) {
2605 return this.widgetsCache.get(instance);
2606 }
2607
2608 const widget = {
2609 id: widgetId,
2610 idBase,
2611 number,
2612 instance
2613 };
2614 this.widgetsCache.set(instance, widget);
2615 return widget;
2616 }
2617
2618 _updateWidgets(nextWidgets) {
2619 this.locked = true;
2620 const addedWidgetIds = [];
2621 const nextWidgetIds = nextWidgets.map(nextWidget => {
2622 if (nextWidget.id && this.getWidget(nextWidget.id)) {
2623 addedWidgetIds.push(null);
2624 return this._updateWidget(nextWidget);
2625 }
2626
2627 const widgetId = this._createWidget(nextWidget);
2628
2629 addedWidgetIds.push(widgetId);
2630 return widgetId;
2631 });
2632 const deletedWidgets = this.getWidgets().filter(widget => !nextWidgetIds.includes(widget.id));
2633 deletedWidgets.forEach(widget => this._removeWidget(widget));
2634 this.setting.set(nextWidgetIds);
2635 this.locked = false;
2636 return addedWidgetIds;
2637 }
2638
2639 setWidgets(nextWidgets) {
2640 const addedWidgetIds = this._updateWidgets(nextWidgets);
2641
2642 this._debounceSetHistory();
2643
2644 return addedWidgetIds;
2645 }
2646 /**
2647 * Undo/Redo related features
2648 */
2649
2650
2651 hasUndo() {
2652 return this.historyIndex > 0;
2653 }
2654
2655 hasRedo() {
2656 return this.historyIndex < this.history.length - 1;
2657 }
2658
2659 _seek(historyIndex) {
2660 const currentWidgets = this.getWidgets();
2661 this.historyIndex = historyIndex;
2662 const widgets = this.history[this.historyIndex];
2663
2664 this._updateWidgets(widgets);
2665
2666 this._emit(currentWidgets, this.getWidgets());
2667
2668 this.historySubscribers.forEach(listener => listener());
2669
2670 this._debounceSetHistory.cancel();
2671 }
2672
2673 undo() {
2674 if (!this.hasUndo()) {
2675 return;
2676 }
2677
2678 this._seek(this.historyIndex - 1);
2679 }
2680
2681 redo() {
2682 if (!this.hasRedo()) {
2683 return;
2684 }
2685
2686 this._seek(this.historyIndex + 1);
2687 }
2688
2689 subscribeHistory(listener) {
2690 this.historySubscribers.add(listener);
2691 return () => {
2692 this.historySubscribers.delete(listener);
2693 };
2694 }
2695
2696 save() {
2697 this.api.previewer.save();
2698 }
2699
2700 }
2701
2702 ;// CONCATENATED MODULE: external ["wp","dom"]
2703 var external_wp_dom_namespaceObject = window["wp"]["dom"];
2704 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/controls/inserter-outer-section.js
2705 /**
2706 * WordPress dependencies
2707 */
2708
2709
2710
2711 /**
2712 * Internal dependencies
2713 */
2714
2715
2716 function getInserterOuterSection() {
2717 const {
2718 wp: {
2719 customize
2720 }
2721 } = window;
2722 const OuterSection = customize.OuterSection; // Override the OuterSection class to handle multiple outer sections.
2723 // It closes all the other outer sections whenever one is opened.
2724 // The result is that at most one outer section can be opened at the same time.
2725
2726 customize.OuterSection = class extends OuterSection {
2727 onChangeExpanded(expanded, args) {
2728 if (expanded) {
2729 customize.section.each(section => {
2730 if (section.params.type === 'outer' && section.id !== this.id) {
2731 if (section.expanded()) {
2732 section.collapse();
2733 }
2734 }
2735 });
2736 }
2737
2738 return super.onChangeExpanded(expanded, args);
2739 }
2740
2741 }; // Handle constructor so that "params.type" can be correctly pointed to "outer".
2742
2743 customize.sectionConstructor.outer = customize.OuterSection;
2744 return class InserterOuterSection extends customize.OuterSection {
2745 constructor() {
2746 super(...arguments); // This is necessary since we're creating a new class which is not identical to the original OuterSection.
2747 // @See https://github.com/WordPress/wordpress-develop/blob/42b05c397c50d9dc244083eff52991413909d4bd/src/js/_enqueues/wp/customize/controls.js#L1427-L1436
2748
2749 this.params.type = 'outer';
2750 this.activeElementBeforeExpanded = null;
2751 const ownerWindow = this.contentContainer[0].ownerDocument.defaultView; // Handle closing the inserter when pressing the Escape key.
2752
2753 ownerWindow.addEventListener('keydown', event => {
2754 if (this.expanded() && (event.keyCode === external_wp_keycodes_namespaceObject.ESCAPE || event.code === 'Escape') && !event.defaultPrevented) {
2755 event.preventDefault();
2756 event.stopPropagation();
2757 (0,external_wp_data_namespaceObject.dispatch)(store).setIsInserterOpened(false);
2758 }
2759 }, // Use capture mode to make this run before other event listeners.
2760 true);
2761 this.contentContainer.addClass('widgets-inserter'); // Set a flag if the state is being changed from open() or close().
2762 // Don't propagate the event if it's an internal action to prevent infinite loop.
2763
2764 this.isFromInternalAction = false;
2765 this.expanded.bind(() => {
2766 if (!this.isFromInternalAction) {
2767 // Propagate the event to React to sync the state.
2768 (0,external_wp_data_namespaceObject.dispatch)(store).setIsInserterOpened(this.expanded());
2769 }
2770
2771 this.isFromInternalAction = false;
2772 });
2773 }
2774
2775 open() {
2776 if (!this.expanded()) {
2777 const contentContainer = this.contentContainer[0];
2778 this.activeElementBeforeExpanded = contentContainer.ownerDocument.activeElement;
2779 this.isFromInternalAction = true;
2780 this.expand({
2781 completeCallback() {
2782 // We have to do this in a "completeCallback" or else the elements will not yet be visible/tabbable.
2783 // The first one should be the close button,
2784 // we want to skip it and choose the second one instead, which is the search box.
2785 const searchBox = external_wp_dom_namespaceObject.focus.tabbable.find(contentContainer)[1];
2786
2787 if (searchBox) {
2788 searchBox.focus();
2789 }
2790 }
2791
2792 });
2793 }
2794 }
2795
2796 close() {
2797 if (this.expanded()) {
2798 const contentContainer = this.contentContainer[0];
2799 const activeElement = contentContainer.ownerDocument.activeElement;
2800 this.isFromInternalAction = true;
2801 this.collapse({
2802 completeCallback() {
2803 // Return back the focus when closing the inserter.
2804 // Only do this if the active element which triggers the action is inside the inserter,
2805 // (the close button for instance). In that case the focus will be lost.
2806 // Otherwise, we don't hijack the focus when the user is focusing on other elements
2807 // (like the quick inserter).
2808 if (contentContainer.contains(activeElement)) {
2809 // Return back the focus when closing the inserter.
2810 if (this.activeElementBeforeExpanded) {
2811 this.activeElementBeforeExpanded.focus();
2812 }
2813 }
2814 }
2815
2816 });
2817 }
2818 }
2819
2820 };
2821 }
2822
2823 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/controls/sidebar-control.js
2824 /**
2825 * WordPress dependencies
2826 */
2827
2828 /**
2829 * Internal dependencies
2830 */
2831
2832
2833
2834
2835
2836 const getInserterId = controlId => `widgets-inserter-${controlId}`;
2837
2838 function getSidebarControl() {
2839 const {
2840 wp: {
2841 customize
2842 }
2843 } = window;
2844 return class SidebarControl extends customize.Control {
2845 constructor() {
2846 super(...arguments);
2847 this.subscribers = new Set();
2848 }
2849
2850 ready() {
2851 const InserterOuterSection = getInserterOuterSection();
2852 this.inserter = new InserterOuterSection(getInserterId(this.id), {});
2853 customize.section.add(this.inserter);
2854 this.sectionInstance = customize.section(this.section());
2855 this.inspector = this.sectionInstance.inspector;
2856 this.sidebarAdapter = new SidebarAdapter(this.setting, customize);
2857 }
2858
2859 subscribe(callback) {
2860 this.subscribers.add(callback);
2861 return () => {
2862 this.subscribers.delete(callback);
2863 };
2864 }
2865
2866 onChangeSectionExpanded(expanded, args) {
2867 if (!args.unchanged) {
2868 // Close the inserter when the section collapses.
2869 if (!expanded) {
2870 (0,external_wp_data_namespaceObject.dispatch)(store).setIsInserterOpened(false);
2871 }
2872
2873 this.subscribers.forEach(subscriber => subscriber(expanded, args));
2874 }
2875 }
2876
2877 };
2878 }
2879
2880 ;// CONCATENATED MODULE: external ["wp","hooks"]
2881 var external_wp_hooks_namespaceObject = window["wp"]["hooks"];
2882 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/filters/move-to-sidebar.js
2883
2884
2885 /**
2886 * External dependencies
2887 */
2888
2889 /**
2890 * WordPress dependencies
2891 */
2892
2893
2894
2895
2896
2897
2898 /**
2899 * Internal dependencies
2900 */
2901
2902
2903
2904
2905 const withMoveToSidebarToolbarItem = (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(BlockEdit => props => {
2906 let widgetId = (0,external_wp_widgets_namespaceObject.getWidgetIdFromBlock)(props);
2907 const sidebarControls = useSidebarControls();
2908 const activeSidebarControl = useActiveSidebarControl();
2909 const hasMultipleSidebars = (sidebarControls === null || sidebarControls === void 0 ? void 0 : sidebarControls.length) > 1;
2910 const blockName = props.name;
2911 const clientId = props.clientId;
2912 const canInsertBlockInSidebar = (0,external_wp_data_namespaceObject.useSelect)(select => {
2913 // Use an empty string to represent the root block list, which
2914 // in the customizer editor represents a sidebar/widget area.
2915 return select(external_wp_blockEditor_namespaceObject.store).canInsertBlockType(blockName, '');
2916 }, [blockName]);
2917 const block = (0,external_wp_data_namespaceObject.useSelect)(select => select(external_wp_blockEditor_namespaceObject.store).getBlock(clientId), [clientId]);
2918 const {
2919 removeBlock
2920 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_blockEditor_namespaceObject.store);
2921 const [, focusWidget] = useFocusControl();
2922
2923 function moveToSidebar(sidebarControlId) {
2924 const newSidebarControl = sidebarControls.find(sidebarControl => sidebarControl.id === sidebarControlId);
2925
2926 if (widgetId) {
2927 /**
2928 * If there's a widgetId, move it to the other sidebar.
2929 */
2930 const oldSetting = activeSidebarControl.setting;
2931 const newSetting = newSidebarControl.setting;
2932 oldSetting((0,external_lodash_namespaceObject.without)(oldSetting(), widgetId));
2933 newSetting([...newSetting(), widgetId]);
2934 } else {
2935 /**
2936 * If there isn't a widgetId, it's most likely a inner block.
2937 * First, remove the block in the original sidebar,
2938 * then, create a new widget in the new sidebar and get back its widgetId.
2939 */
2940 const sidebarAdapter = newSidebarControl.sidebarAdapter;
2941 removeBlock(clientId);
2942 const addedWidgetIds = sidebarAdapter.setWidgets([...sidebarAdapter.getWidgets(), blockToWidget(block)]); // The last non-null id is the added widget's id.
2943
2944 widgetId = addedWidgetIds.reverse().find(id => !!id);
2945 } // Move focus to the moved widget and expand the sidebar.
2946
2947
2948 focusWidget(widgetId);
2949 }
2950
2951 return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, (0,external_wp_element_namespaceObject.createElement)(BlockEdit, props), hasMultipleSidebars && canInsertBlockInSidebar && (0,external_wp_element_namespaceObject.createElement)(external_wp_blockEditor_namespaceObject.BlockControls, null, (0,external_wp_element_namespaceObject.createElement)(external_wp_widgets_namespaceObject.MoveToWidgetArea, {
2952 widgetAreas: sidebarControls.map(sidebarControl => ({
2953 id: sidebarControl.id,
2954 name: sidebarControl.params.label,
2955 description: sidebarControl.params.description
2956 })),
2957 currentWidgetAreaId: activeSidebarControl === null || activeSidebarControl === void 0 ? void 0 : activeSidebarControl.id,
2958 onSelect: moveToSidebar
2959 })));
2960 }, 'withMoveToSidebarToolbarItem');
2961 (0,external_wp_hooks_namespaceObject.addFilter)('editor.BlockEdit', 'core/customize-widgets/block-edit', withMoveToSidebarToolbarItem);
2962
2963 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/filters/replace-media-upload.js
2964 /**
2965 * WordPress dependencies
2966 */
2967
2968
2969
2970 const replaceMediaUpload = () => external_wp_mediaUtils_namespaceObject.MediaUpload;
2971
2972 (0,external_wp_hooks_namespaceObject.addFilter)('editor.MediaUpload', 'core/edit-widgets/replace-media-upload', replaceMediaUpload);
2973
2974 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/filters/wide-widget-display.js
2975
2976
2977
2978 /**
2979 * WordPress dependencies
2980 */
2981
2982
2983 const {
2984 wp: wide_widget_display_wp
2985 } = window;
2986 const withWideWidgetDisplay = (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(BlockEdit => props => {
2987 var _wp$customize$Widgets, _wp$customize$Widgets2;
2988
2989 const {
2990 idBase
2991 } = props.attributes;
2992 const isWide = (_wp$customize$Widgets = (_wp$customize$Widgets2 = wide_widget_display_wp.customize.Widgets.data.availableWidgets.find(widget => widget.id_base === idBase)) === null || _wp$customize$Widgets2 === void 0 ? void 0 : _wp$customize$Widgets2.is_wide) !== null && _wp$customize$Widgets !== void 0 ? _wp$customize$Widgets : false;
2993 return (0,external_wp_element_namespaceObject.createElement)(BlockEdit, _extends({}, props, {
2994 isWide: isWide
2995 }));
2996 }, 'withWideWidgetDisplay');
2997 (0,external_wp_hooks_namespaceObject.addFilter)('editor.BlockEdit', 'core/customize-widgets/wide-widget-display', withWideWidgetDisplay);
2998
2999 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/filters/index.js
3000 /**
3001 * Internal dependencies
3002 */
3003
3004
3005
3006
3007 ;// CONCATENATED MODULE: ./packages/customize-widgets/build-module/index.js
3008
3009
3010 /**
3011 * WordPress dependencies
3012 */
3013
3014
3015
3016
3017
3018
3019 /**
3020 * Internal dependencies
3021 */
3022
3023
3024
3025
3026
3027 const {
3028 wp: build_module_wp
3029 } = window;
3030 const DISABLED_BLOCKS = ['core/more', 'core/block', 'core/freeform', 'core/template-part'];
3031 const ENABLE_EXPERIMENTAL_FSE_BLOCKS = false;
3032 /**
3033 * Initializes the widgets block editor in the customizer.
3034 *
3035 * @param {string} editorName The editor name.
3036 * @param {Object} blockEditorSettings Block editor settings.
3037 */
3038
3039 function initialize(editorName, blockEditorSettings) {
3040 (0,external_wp_data_namespaceObject.dispatch)(external_wp_preferences_namespaceObject.store).setDefaults('core/customize-widgets', {
3041 fixedToolbar: false,
3042 welcomeGuide: true
3043 });
3044
3045 (0,external_wp_data_namespaceObject.dispatch)(external_wp_blocks_namespaceObject.store).__experimentalReapplyBlockTypeFilters();
3046
3047 const coreBlocks = (0,external_wp_blockLibrary_namespaceObject.__experimentalGetCoreBlocks)().filter(block => {
3048 return !(DISABLED_BLOCKS.includes(block.name) || block.name.startsWith('core/post') || block.name.startsWith('core/query') || block.name.startsWith('core/site') || block.name.startsWith('core/navigation'));
3049 });
3050
3051 (0,external_wp_blockLibrary_namespaceObject.registerCoreBlocks)(coreBlocks);
3052 (0,external_wp_widgets_namespaceObject.registerLegacyWidgetBlock)();
3053
3054 if (true) {
3055 (0,external_wp_blockLibrary_namespaceObject.__experimentalRegisterExperimentalCoreBlocks)({
3056 enableFSEBlocks: ENABLE_EXPERIMENTAL_FSE_BLOCKS
3057 });
3058 }
3059
3060 (0,external_wp_widgets_namespaceObject.registerLegacyWidgetVariations)(blockEditorSettings);
3061 (0,external_wp_widgets_namespaceObject.registerWidgetGroupBlock)(); // As we are unregistering `core/freeform` to avoid the Classic block, we must
3062 // replace it with something as the default freeform content handler. Failure to
3063 // do this will result in errors in the default block parser.
3064 // see: https://github.com/WordPress/gutenberg/issues/33097
3065
3066 (0,external_wp_blocks_namespaceObject.setFreeformContentHandlerName)('core/html');
3067 const SidebarControl = getSidebarControl(blockEditorSettings);
3068 build_module_wp.customize.sectionConstructor.sidebar = getSidebarSection();
3069 build_module_wp.customize.controlConstructor.sidebar_block_editor = SidebarControl;
3070 const container = document.createElement('div');
3071 document.body.appendChild(container);
3072 build_module_wp.customize.bind('ready', () => {
3073 const sidebarControls = [];
3074 build_module_wp.customize.control.each(control => {
3075 if (control instanceof SidebarControl) {
3076 sidebarControls.push(control);
3077 }
3078 });
3079 (0,external_wp_element_namespaceObject.render)((0,external_wp_element_namespaceObject.createElement)(CustomizeWidgets, {
3080 api: build_module_wp.customize,
3081 sidebarControls: sidebarControls,
3082 blockEditorSettings: blockEditorSettings
3083 }), container);
3084 });
3085 }
3086
3087 }();
3088 (window.wp = window.wp || {}).customizeWidgets = __webpack_exports__;
3089 /******/ })()
3090 ;