| [ Index ] |
PHP Cross Reference of WordPress Trunk (Updated Daily) |
[Summary view] [Print] [Text view]
1 /******/ (() => { // webpackBootstrap 2 /******/ var __webpack_modules__ = ({ 3 4 /***/ 4306: 5 /***/ (function(module, exports) { 6 7 var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*! 8 autosize 4.0.4 9 license: MIT 10 http://www.jacklmoore.com/autosize 11 */ 12 (function (global, factory) { 13 if (true) { 14 !(__WEBPACK_AMD_DEFINE_ARRAY__ = [module, exports], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory), 15 __WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ? 16 (__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__), 17 __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); 18 } else { var mod; } 19 })(this, function (module, exports) { 20 'use strict'; 21 22 var map = typeof Map === "function" ? new Map() : function () { 23 var keys = []; 24 var values = []; 25 26 return { 27 has: function has(key) { 28 return keys.indexOf(key) > -1; 29 }, 30 get: function get(key) { 31 return values[keys.indexOf(key)]; 32 }, 33 set: function set(key, value) { 34 if (keys.indexOf(key) === -1) { 35 keys.push(key); 36 values.push(value); 37 } 38 }, 39 delete: function _delete(key) { 40 var index = keys.indexOf(key); 41 if (index > -1) { 42 keys.splice(index, 1); 43 values.splice(index, 1); 44 } 45 } 46 }; 47 }(); 48 49 var createEvent = function createEvent(name) { 50 return new Event(name, { bubbles: true }); 51 }; 52 try { 53 new Event('test'); 54 } catch (e) { 55 // IE does not support `new Event()` 56 createEvent = function createEvent(name) { 57 var evt = document.createEvent('Event'); 58 evt.initEvent(name, true, false); 59 return evt; 60 }; 61 } 62 63 function assign(ta) { 64 if (!ta || !ta.nodeName || ta.nodeName !== 'TEXTAREA' || map.has(ta)) return; 65 66 var heightOffset = null; 67 var clientWidth = null; 68 var cachedHeight = null; 69 70 function init() { 71 var style = window.getComputedStyle(ta, null); 72 73 if (style.resize === 'vertical') { 74 ta.style.resize = 'none'; 75 } else if (style.resize === 'both') { 76 ta.style.resize = 'horizontal'; 77 } 78 79 if (style.boxSizing === 'content-box') { 80 heightOffset = -(parseFloat(style.paddingTop) + parseFloat(style.paddingBottom)); 81 } else { 82 heightOffset = parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth); 83 } 84 // Fix when a textarea is not on document body and heightOffset is Not a Number 85 if (isNaN(heightOffset)) { 86 heightOffset = 0; 87 } 88 89 update(); 90 } 91 92 function changeOverflow(value) { 93 { 94 // Chrome/Safari-specific fix: 95 // When the textarea y-overflow is hidden, Chrome/Safari do not reflow the text to account for the space 96 // made available by removing the scrollbar. The following forces the necessary text reflow. 97 var width = ta.style.width; 98 ta.style.width = '0px'; 99 // Force reflow: 100 /* jshint ignore:start */ 101 ta.offsetWidth; 102 /* jshint ignore:end */ 103 ta.style.width = width; 104 } 105 106 ta.style.overflowY = value; 107 } 108 109 function getParentOverflows(el) { 110 var arr = []; 111 112 while (el && el.parentNode && el.parentNode instanceof Element) { 113 if (el.parentNode.scrollTop) { 114 arr.push({ 115 node: el.parentNode, 116 scrollTop: el.parentNode.scrollTop 117 }); 118 } 119 el = el.parentNode; 120 } 121 122 return arr; 123 } 124 125 function resize() { 126 if (ta.scrollHeight === 0) { 127 // If the scrollHeight is 0, then the element probably has display:none or is detached from the DOM. 128 return; 129 } 130 131 var overflows = getParentOverflows(ta); 132 var docTop = document.documentElement && document.documentElement.scrollTop; // Needed for Mobile IE (ticket #240) 133 134 ta.style.height = ''; 135 ta.style.height = ta.scrollHeight + heightOffset + 'px'; 136 137 // used to check if an update is actually necessary on window.resize 138 clientWidth = ta.clientWidth; 139 140 // prevents scroll-position jumping 141 overflows.forEach(function (el) { 142 el.node.scrollTop = el.scrollTop; 143 }); 144 145 if (docTop) { 146 document.documentElement.scrollTop = docTop; 147 } 148 } 149 150 function update() { 151 resize(); 152 153 var styleHeight = Math.round(parseFloat(ta.style.height)); 154 var computed = window.getComputedStyle(ta, null); 155 156 // Using offsetHeight as a replacement for computed.height in IE, because IE does not account use of border-box 157 var actualHeight = computed.boxSizing === 'content-box' ? Math.round(parseFloat(computed.height)) : ta.offsetHeight; 158 159 // The actual height not matching the style height (set via the resize method) indicates that 160 // the max-height has been exceeded, in which case the overflow should be allowed. 161 if (actualHeight < styleHeight) { 162 if (computed.overflowY === 'hidden') { 163 changeOverflow('scroll'); 164 resize(); 165 actualHeight = computed.boxSizing === 'content-box' ? Math.round(parseFloat(window.getComputedStyle(ta, null).height)) : ta.offsetHeight; 166 } 167 } else { 168 // Normally keep overflow set to hidden, to avoid flash of scrollbar as the textarea expands. 169 if (computed.overflowY !== 'hidden') { 170 changeOverflow('hidden'); 171 resize(); 172 actualHeight = computed.boxSizing === 'content-box' ? Math.round(parseFloat(window.getComputedStyle(ta, null).height)) : ta.offsetHeight; 173 } 174 } 175 176 if (cachedHeight !== actualHeight) { 177 cachedHeight = actualHeight; 178 var evt = createEvent('autosize:resized'); 179 try { 180 ta.dispatchEvent(evt); 181 } catch (err) { 182 // Firefox will throw an error on dispatchEvent for a detached element 183 // https://bugzilla.mozilla.org/show_bug.cgi?id=889376 184 } 185 } 186 } 187 188 var pageResize = function pageResize() { 189 if (ta.clientWidth !== clientWidth) { 190 update(); 191 } 192 }; 193 194 var destroy = function (style) { 195 window.removeEventListener('resize', pageResize, false); 196 ta.removeEventListener('input', update, false); 197 ta.removeEventListener('keyup', update, false); 198 ta.removeEventListener('autosize:destroy', destroy, false); 199 ta.removeEventListener('autosize:update', update, false); 200 201 Object.keys(style).forEach(function (key) { 202 ta.style[key] = style[key]; 203 }); 204 205 map.delete(ta); 206 }.bind(ta, { 207 height: ta.style.height, 208 resize: ta.style.resize, 209 overflowY: ta.style.overflowY, 210 overflowX: ta.style.overflowX, 211 wordWrap: ta.style.wordWrap 212 }); 213 214 ta.addEventListener('autosize:destroy', destroy, false); 215 216 // IE9 does not fire onpropertychange or oninput for deletions, 217 // so binding to onkeyup to catch most of those events. 218 // There is no way that I know of to detect something like 'cut' in IE9. 219 if ('onpropertychange' in ta && 'oninput' in ta) { 220 ta.addEventListener('keyup', update, false); 221 } 222 223 window.addEventListener('resize', pageResize, false); 224 ta.addEventListener('input', update, false); 225 ta.addEventListener('autosize:update', update, false); 226 ta.style.overflowX = 'hidden'; 227 ta.style.wordWrap = 'break-word'; 228 229 map.set(ta, { 230 destroy: destroy, 231 update: update 232 }); 233 234 init(); 235 } 236 237 function destroy(ta) { 238 var methods = map.get(ta); 239 if (methods) { 240 methods.destroy(); 241 } 242 } 243 244 function update(ta) { 245 var methods = map.get(ta); 246 if (methods) { 247 methods.update(); 248 } 249 } 250 251 var autosize = null; 252 253 // Do nothing in Node.js environment and IE8 (or lower) 254 if (typeof window === 'undefined' || typeof window.getComputedStyle !== 'function') { 255 autosize = function autosize(el) { 256 return el; 257 }; 258 autosize.destroy = function (el) { 259 return el; 260 }; 261 autosize.update = function (el) { 262 return el; 263 }; 264 } else { 265 autosize = function autosize(el, options) { 266 if (el) { 267 Array.prototype.forEach.call(el.length ? el : [el], function (x) { 268 return assign(x, options); 269 }); 270 } 271 return el; 272 }; 273 autosize.destroy = function (el) { 274 if (el) { 275 Array.prototype.forEach.call(el.length ? el : [el], destroy); 276 } 277 return el; 278 }; 279 autosize.update = function (el) { 280 if (el) { 281 Array.prototype.forEach.call(el.length ? el : [el], update); 282 } 283 return el; 284 }; 285 } 286 287 exports.default = autosize; 288 module.exports = exports['default']; 289 }); 290 291 /***/ }), 292 293 /***/ 6109: 294 /***/ ((module) => { 295 296 // This code has been refactored for 140 bytes 297 // You can see the original here: https://github.com/twolfson/computedStyle/blob/04cd1da2e30fa45844f95f5cb1ac898e9b9ef050/lib/computedStyle.js 298 var computedStyle = function (el, prop, getComputedStyle) { 299 getComputedStyle = window.getComputedStyle; 300 301 // In one fell swoop 302 return ( 303 // If we have getComputedStyle 304 getComputedStyle ? 305 // Query it 306 // TODO: From CSS-Query notes, we might need (node, null) for FF 307 getComputedStyle(el) : 308 309 // Otherwise, we are in IE and use currentStyle 310 el.currentStyle 311 )[ 312 // Switch to camelCase for CSSOM 313 // DEV: Grabbed from jQuery 314 // https://github.com/jquery/jquery/blob/1.9-stable/src/css.js#L191-L194 315 // https://github.com/jquery/jquery/blob/1.9-stable/src/core.js#L593-L597 316 prop.replace(/-(\w)/gi, function (word, letter) { 317 return letter.toUpperCase(); 318 }) 319 ]; 320 }; 321 322 module.exports = computedStyle; 323 324 325 /***/ }), 326 327 /***/ 5417: 328 /***/ ((__unused_webpack_module, exports) => { 329 330 "use strict"; 331 /*istanbul ignore start*/ 332 333 334 Object.defineProperty(exports, "__esModule", ({ 335 value: true 336 })); 337 exports["default"] = Diff; 338 339 /*istanbul ignore end*/ 340 function Diff() {} 341 342 Diff.prototype = { 343 /*istanbul ignore start*/ 344 345 /*istanbul ignore end*/ 346 diff: function diff(oldString, newString) { 347 /*istanbul ignore start*/ 348 var 349 /*istanbul ignore end*/ 350 options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; 351 var callback = options.callback; 352 353 if (typeof options === 'function') { 354 callback = options; 355 options = {}; 356 } 357 358 this.options = options; 359 var self = this; 360 361 function done(value) { 362 if (callback) { 363 setTimeout(function () { 364 callback(undefined, value); 365 }, 0); 366 return true; 367 } else { 368 return value; 369 } 370 } // Allow subclasses to massage the input prior to running 371 372 373 oldString = this.castInput(oldString); 374 newString = this.castInput(newString); 375 oldString = this.removeEmpty(this.tokenize(oldString)); 376 newString = this.removeEmpty(this.tokenize(newString)); 377 var newLen = newString.length, 378 oldLen = oldString.length; 379 var editLength = 1; 380 var maxEditLength = newLen + oldLen; 381 var bestPath = [{ 382 newPos: -1, 383 components: [] 384 }]; // Seed editLength = 0, i.e. the content starts with the same values 385 386 var oldPos = this.extractCommon(bestPath[0], newString, oldString, 0); 387 388 if (bestPath[0].newPos + 1 >= newLen && oldPos + 1 >= oldLen) { 389 // Identity per the equality and tokenizer 390 return done([{ 391 value: this.join(newString), 392 count: newString.length 393 }]); 394 } // Main worker method. checks all permutations of a given edit length for acceptance. 395 396 397 function execEditLength() { 398 for (var diagonalPath = -1 * editLength; diagonalPath <= editLength; diagonalPath += 2) { 399 var basePath = 400 /*istanbul ignore start*/ 401 void 0 402 /*istanbul ignore end*/ 403 ; 404 405 var addPath = bestPath[diagonalPath - 1], 406 removePath = bestPath[diagonalPath + 1], 407 _oldPos = (removePath ? removePath.newPos : 0) - diagonalPath; 408 409 if (addPath) { 410 // No one else is going to attempt to use this value, clear it 411 bestPath[diagonalPath - 1] = undefined; 412 } 413 414 var canAdd = addPath && addPath.newPos + 1 < newLen, 415 canRemove = removePath && 0 <= _oldPos && _oldPos < oldLen; 416 417 if (!canAdd && !canRemove) { 418 // If this path is a terminal then prune 419 bestPath[diagonalPath] = undefined; 420 continue; 421 } // Select the diagonal that we want to branch from. We select the prior 422 // path whose position in the new string is the farthest from the origin 423 // and does not pass the bounds of the diff graph 424 425 426 if (!canAdd || canRemove && addPath.newPos < removePath.newPos) { 427 basePath = clonePath(removePath); 428 self.pushComponent(basePath.components, undefined, true); 429 } else { 430 basePath = addPath; // No need to clone, we've pulled it from the list 431 432 basePath.newPos++; 433 self.pushComponent(basePath.components, true, undefined); 434 } 435 436 _oldPos = self.extractCommon(basePath, newString, oldString, diagonalPath); // If we have hit the end of both strings, then we are done 437 438 if (basePath.newPos + 1 >= newLen && _oldPos + 1 >= oldLen) { 439 return done(buildValues(self, basePath.components, newString, oldString, self.useLongestToken)); 440 } else { 441 // Otherwise track this path as a potential candidate and continue. 442 bestPath[diagonalPath] = basePath; 443 } 444 } 445 446 editLength++; 447 } // Performs the length of edit iteration. Is a bit fugly as this has to support the 448 // sync and async mode which is never fun. Loops over execEditLength until a value 449 // is produced. 450 451 452 if (callback) { 453 (function exec() { 454 setTimeout(function () { 455 // This should not happen, but we want to be safe. 456 457 /* istanbul ignore next */ 458 if (editLength > maxEditLength) { 459 return callback(); 460 } 461 462 if (!execEditLength()) { 463 exec(); 464 } 465 }, 0); 466 })(); 467 } else { 468 while (editLength <= maxEditLength) { 469 var ret = execEditLength(); 470 471 if (ret) { 472 return ret; 473 } 474 } 475 } 476 }, 477 478 /*istanbul ignore start*/ 479 480 /*istanbul ignore end*/ 481 pushComponent: function pushComponent(components, added, removed) { 482 var last = components[components.length - 1]; 483 484 if (last && last.added === added && last.removed === removed) { 485 // We need to clone here as the component clone operation is just 486 // as shallow array clone 487 components[components.length - 1] = { 488 count: last.count + 1, 489 added: added, 490 removed: removed 491 }; 492 } else { 493 components.push({ 494 count: 1, 495 added: added, 496 removed: removed 497 }); 498 } 499 }, 500 501 /*istanbul ignore start*/ 502 503 /*istanbul ignore end*/ 504 extractCommon: function extractCommon(basePath, newString, oldString, diagonalPath) { 505 var newLen = newString.length, 506 oldLen = oldString.length, 507 newPos = basePath.newPos, 508 oldPos = newPos - diagonalPath, 509 commonCount = 0; 510 511 while (newPos + 1 < newLen && oldPos + 1 < oldLen && this.equals(newString[newPos + 1], oldString[oldPos + 1])) { 512 newPos++; 513 oldPos++; 514 commonCount++; 515 } 516 517 if (commonCount) { 518 basePath.components.push({ 519 count: commonCount 520 }); 521 } 522 523 basePath.newPos = newPos; 524 return oldPos; 525 }, 526 527 /*istanbul ignore start*/ 528 529 /*istanbul ignore end*/ 530 equals: function equals(left, right) { 531 if (this.options.comparator) { 532 return this.options.comparator(left, right); 533 } else { 534 return left === right || this.options.ignoreCase && left.toLowerCase() === right.toLowerCase(); 535 } 536 }, 537 538 /*istanbul ignore start*/ 539 540 /*istanbul ignore end*/ 541 removeEmpty: function removeEmpty(array) { 542 var ret = []; 543 544 for (var i = 0; i < array.length; i++) { 545 if (array[i]) { 546 ret.push(array[i]); 547 } 548 } 549 550 return ret; 551 }, 552 553 /*istanbul ignore start*/ 554 555 /*istanbul ignore end*/ 556 castInput: function castInput(value) { 557 return value; 558 }, 559 560 /*istanbul ignore start*/ 561 562 /*istanbul ignore end*/ 563 tokenize: function tokenize(value) { 564 return value.split(''); 565 }, 566 567 /*istanbul ignore start*/ 568 569 /*istanbul ignore end*/ 570 join: function join(chars) { 571 return chars.join(''); 572 } 573 }; 574 575 function buildValues(diff, components, newString, oldString, useLongestToken) { 576 var componentPos = 0, 577 componentLen = components.length, 578 newPos = 0, 579 oldPos = 0; 580 581 for (; componentPos < componentLen; componentPos++) { 582 var component = components[componentPos]; 583 584 if (!component.removed) { 585 if (!component.added && useLongestToken) { 586 var value = newString.slice(newPos, newPos + component.count); 587 value = value.map(function (value, i) { 588 var oldValue = oldString[oldPos + i]; 589 return oldValue.length > value.length ? oldValue : value; 590 }); 591 component.value = diff.join(value); 592 } else { 593 component.value = diff.join(newString.slice(newPos, newPos + component.count)); 594 } 595 596 newPos += component.count; // Common case 597 598 if (!component.added) { 599 oldPos += component.count; 600 } 601 } else { 602 component.value = diff.join(oldString.slice(oldPos, oldPos + component.count)); 603 oldPos += component.count; // Reverse add and remove so removes are output first to match common convention 604 // The diffing algorithm is tied to add then remove output and this is the simplest 605 // route to get the desired output with minimal overhead. 606 607 if (componentPos && components[componentPos - 1].added) { 608 var tmp = components[componentPos - 1]; 609 components[componentPos - 1] = components[componentPos]; 610 components[componentPos] = tmp; 611 } 612 } 613 } // Special case handle for when one terminal is ignored (i.e. whitespace). 614 // For this case we merge the terminal into the prior string and drop the change. 615 // This is only available for string mode. 616 617 618 var lastComponent = components[componentLen - 1]; 619 620 if (componentLen > 1 && typeof lastComponent.value === 'string' && (lastComponent.added || lastComponent.removed) && diff.equals('', lastComponent.value)) { 621 components[componentLen - 2].value += lastComponent.value; 622 components.pop(); 623 } 624 625 return components; 626 } 627 628 function clonePath(path) { 629 return { 630 newPos: path.newPos, 631 components: path.components.slice(0) 632 }; 633 } 634 635 636 /***/ }), 637 638 /***/ 8021: 639 /***/ ((__unused_webpack_module, exports, __webpack_require__) => { 640 641 "use strict"; 642 var __webpack_unused_export__; 643 /*istanbul ignore start*/ 644 645 646 __webpack_unused_export__ = ({ 647 value: true 648 }); 649 exports.JJ = diffChars; 650 __webpack_unused_export__ = void 0; 651 652 /*istanbul ignore end*/ 653 var 654 /*istanbul ignore start*/ 655 _base = _interopRequireDefault(__webpack_require__(5417)) 656 /*istanbul ignore end*/ 657 ; 658 659 /*istanbul ignore start*/ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 660 661 /*istanbul ignore end*/ 662 var characterDiff = new 663 /*istanbul ignore start*/ 664 _base 665 /*istanbul ignore end*/ 666 . 667 /*istanbul ignore start*/ 668 default 669 /*istanbul ignore end*/ 670 (); 671 672 /*istanbul ignore start*/ 673 __webpack_unused_export__ = characterDiff; 674 675 /*istanbul ignore end*/ 676 function diffChars(oldStr, newStr, options) { 677 return characterDiff.diff(oldStr, newStr, options); 678 } 679 680 681 /***/ }), 682 683 /***/ 7734: 684 /***/ ((module) => { 685 686 "use strict"; 687 688 689 // do not edit .js files directly - edit src/index.jst 690 691 692 var envHasBigInt64Array = typeof BigInt64Array !== 'undefined'; 693 694 695 module.exports = function equal(a, b) { 696 if (a === b) return true; 697 698 if (a && b && typeof a == 'object' && typeof b == 'object') { 699 if (a.constructor !== b.constructor) return false; 700 701 var length, i, keys; 702 if (Array.isArray(a)) { 703 length = a.length; 704 if (length != b.length) return false; 705 for (i = length; i-- !== 0;) 706 if (!equal(a[i], b[i])) return false; 707 return true; 708 } 709 710 711 if ((a instanceof Map) && (b instanceof Map)) { 712 if (a.size !== b.size) return false; 713 for (i of a.entries()) 714 if (!b.has(i[0])) return false; 715 for (i of a.entries()) 716 if (!equal(i[1], b.get(i[0]))) return false; 717 return true; 718 } 719 720 if ((a instanceof Set) && (b instanceof Set)) { 721 if (a.size !== b.size) return false; 722 for (i of a.entries()) 723 if (!b.has(i[0])) return false; 724 return true; 725 } 726 727 if (ArrayBuffer.isView(a) && ArrayBuffer.isView(b)) { 728 length = a.length; 729 if (length != b.length) return false; 730 for (i = length; i-- !== 0;) 731 if (a[i] !== b[i]) return false; 732 return true; 733 } 734 735 736 if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags; 737 if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf(); 738 if (a.toString !== Object.prototype.toString) return a.toString() === b.toString(); 739 740 keys = Object.keys(a); 741 length = keys.length; 742 if (length !== Object.keys(b).length) return false; 743 744 for (i = length; i-- !== 0;) 745 if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false; 746 747 for (i = length; i-- !== 0;) { 748 var key = keys[i]; 749 750 if (!equal(a[key], b[key])) return false; 751 } 752 753 return true; 754 } 755 756 // true if both NaN, false otherwise 757 return a!==a && b!==b; 758 }; 759 760 761 /***/ }), 762 763 /***/ 5215: 764 /***/ ((module) => { 765 766 "use strict"; 767 768 769 // do not edit .js files directly - edit src/index.jst 770 771 772 773 module.exports = function equal(a, b) { 774 if (a === b) return true; 775 776 if (a && b && typeof a == 'object' && typeof b == 'object') { 777 if (a.constructor !== b.constructor) return false; 778 779 var length, i, keys; 780 if (Array.isArray(a)) { 781 length = a.length; 782 if (length != b.length) return false; 783 for (i = length; i-- !== 0;) 784 if (!equal(a[i], b[i])) return false; 785 return true; 786 } 787 788 789 790 if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags; 791 if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf(); 792 if (a.toString !== Object.prototype.toString) return a.toString() === b.toString(); 793 794 keys = Object.keys(a); 795 length = keys.length; 796 if (length !== Object.keys(b).length) return false; 797 798 for (i = length; i-- !== 0;) 799 if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false; 800 801 for (i = length; i-- !== 0;) { 802 var key = keys[i]; 803 804 if (!equal(a[key], b[key])) return false; 805 } 806 807 return true; 808 } 809 810 // true if both NaN, false otherwise 811 return a!==a && b!==b; 812 }; 813 814 815 /***/ }), 816 817 /***/ 461: 818 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 819 820 // Load in dependencies 821 var computedStyle = __webpack_require__(6109); 822 823 /** 824 * Calculate the `line-height` of a given node 825 * @param {HTMLElement} node Element to calculate line height of. Must be in the DOM. 826 * @returns {Number} `line-height` of the element in pixels 827 */ 828 function lineHeight(node) { 829 // Grab the line-height via style 830 var lnHeightStr = computedStyle(node, 'line-height'); 831 var lnHeight = parseFloat(lnHeightStr, 10); 832 833 // If the lineHeight did not contain a unit (i.e. it was numeric), convert it to ems (e.g. '2.3' === '2.3em') 834 if (lnHeightStr === lnHeight + '') { 835 // Save the old lineHeight style and update the em unit to the element 836 var _lnHeightStyle = node.style.lineHeight; 837 node.style.lineHeight = lnHeightStr + 'em'; 838 839 // Calculate the em based height 840 lnHeightStr = computedStyle(node, 'line-height'); 841 lnHeight = parseFloat(lnHeightStr, 10); 842 843 // Revert the lineHeight style 844 if (_lnHeightStyle) { 845 node.style.lineHeight = _lnHeightStyle; 846 } else { 847 delete node.style.lineHeight; 848 } 849 } 850 851 // If the lineHeight is in `pt`, convert it to pixels (4px for 3pt) 852 // DEV: `em` units are converted to `pt` in IE6 853 // Conversion ratio from https://developer.mozilla.org/en-US/docs/Web/CSS/length 854 if (lnHeightStr.indexOf('pt') !== -1) { 855 lnHeight *= 4; 856 lnHeight /= 3; 857 // Otherwise, if the lineHeight is in `mm`, convert it to pixels (96px for 25.4mm) 858 } else if (lnHeightStr.indexOf('mm') !== -1) { 859 lnHeight *= 96; 860 lnHeight /= 25.4; 861 // Otherwise, if the lineHeight is in `cm`, convert it to pixels (96px for 2.54cm) 862 } else if (lnHeightStr.indexOf('cm') !== -1) { 863 lnHeight *= 96; 864 lnHeight /= 2.54; 865 // Otherwise, if the lineHeight is in `in`, convert it to pixels (96px for 1in) 866 } else if (lnHeightStr.indexOf('in') !== -1) { 867 lnHeight *= 96; 868 // Otherwise, if the lineHeight is in `pc`, convert it to pixels (12pt for 1pc) 869 } else if (lnHeightStr.indexOf('pc') !== -1) { 870 lnHeight *= 16; 871 } 872 873 // Continue our computation 874 lnHeight = Math.round(lnHeight); 875 876 // If the line-height is "normal", calculate by font-size 877 if (lnHeightStr === 'normal') { 878 // Create a temporary node 879 var nodeName = node.nodeName; 880 var _node = document.createElement(nodeName); 881 _node.innerHTML = ' '; 882 883 // If we have a text area, reset it to only 1 row 884 // https://github.com/twolfson/line-height/issues/4 885 if (nodeName.toUpperCase() === 'TEXTAREA') { 886 _node.setAttribute('rows', '1'); 887 } 888 889 // Set the font-size of the element 890 var fontSizeStr = computedStyle(node, 'font-size'); 891 _node.style.fontSize = fontSizeStr; 892 893 // Remove default padding/border which can affect offset height 894 // https://github.com/twolfson/line-height/issues/4 895 // https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetHeight 896 _node.style.padding = '0px'; 897 _node.style.border = '0px'; 898 899 // Append it to the body 900 var body = document.body; 901 body.appendChild(_node); 902 903 // Assume the line height of the element is the height 904 var height = _node.offsetHeight; 905 lnHeight = height; 906 907 // Remove our child from the DOM 908 body.removeChild(_node); 909 } 910 911 // Return the calculated height 912 return lnHeight; 913 } 914 915 // Export lineHeight 916 module.exports = lineHeight; 917 918 919 /***/ }), 920 921 /***/ 7520: 922 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 923 924 module.exports = __webpack_require__(7191); 925 926 927 /***/ }), 928 929 /***/ 8202: 930 /***/ ((module) => { 931 932 "use strict"; 933 /** 934 * Copyright (c) 2015, Facebook, Inc. 935 * All rights reserved. 936 * 937 * This source code is licensed under the BSD-style license found in the 938 * LICENSE file in the root directory of this source tree. An additional grant 939 * of patent rights can be found in the PATENTS file in the same directory. 940 * 941 * @providesModule ExecutionEnvironment 942 */ 943 944 /*jslint evil: true */ 945 946 947 948 var canUseDOM = !!( 949 typeof window !== 'undefined' && 950 window.document && 951 window.document.createElement 952 ); 953 954 /** 955 * Simple, lightweight module assisting with the detection and context of 956 * Worker. Helps avoid circular dependencies and allows code to reason about 957 * whether or not they are in a Worker, even if they never include the main 958 * `ReactWorker` dependency. 959 */ 960 var ExecutionEnvironment = { 961 962 canUseDOM: canUseDOM, 963 964 canUseWorkers: typeof Worker !== 'undefined', 965 966 canUseEventListeners: 967 canUseDOM && !!(window.addEventListener || window.attachEvent), 968 969 canUseViewport: canUseDOM && !!window.screen, 970 971 isInWorker: !canUseDOM // For now, this is true - might change in the future. 972 973 }; 974 975 module.exports = ExecutionEnvironment; 976 977 978 /***/ }), 979 980 /***/ 2213: 981 /***/ ((module) => { 982 983 /** 984 * Copyright 2004-present Facebook. All Rights Reserved. 985 * 986 * @providesModule UserAgent_DEPRECATED 987 */ 988 989 /** 990 * Provides entirely client-side User Agent and OS detection. You should prefer 991 * the non-deprecated UserAgent module when possible, which exposes our 992 * authoritative server-side PHP-based detection to the client. 993 * 994 * Usage is straightforward: 995 * 996 * if (UserAgent_DEPRECATED.ie()) { 997 * // IE 998 * } 999 * 1000 * You can also do version checks: 1001 * 1002 * if (UserAgent_DEPRECATED.ie() >= 7) { 1003 * // IE7 or better 1004 * } 1005 * 1006 * The browser functions will return NaN if the browser does not match, so 1007 * you can also do version compares the other way: 1008 * 1009 * if (UserAgent_DEPRECATED.ie() < 7) { 1010 * // IE6 or worse 1011 * } 1012 * 1013 * Note that the version is a float and may include a minor version number, 1014 * so you should always use range operators to perform comparisons, not 1015 * strict equality. 1016 * 1017 * **Note:** You should **strongly** prefer capability detection to browser 1018 * version detection where it's reasonable: 1019 * 1020 * http://www.quirksmode.org/js/support.html 1021 * 1022 * Further, we have a large number of mature wrapper functions and classes 1023 * which abstract away many browser irregularities. Check the documentation, 1024 * grep for things, or ask on javascript@lists.facebook.com before writing yet 1025 * another copy of "event || window.event". 1026 * 1027 */ 1028 1029 var _populated = false; 1030 1031 // Browsers 1032 var _ie, _firefox, _opera, _webkit, _chrome; 1033 1034 // Actual IE browser for compatibility mode 1035 var _ie_real_version; 1036 1037 // Platforms 1038 var _osx, _windows, _linux, _android; 1039 1040 // Architectures 1041 var _win64; 1042 1043 // Devices 1044 var _iphone, _ipad, _native; 1045 1046 var _mobile; 1047 1048 function _populate() { 1049 if (_populated) { 1050 return; 1051 } 1052 1053 _populated = true; 1054 1055 // To work around buggy JS libraries that can't handle multi-digit 1056 // version numbers, Opera 10's user agent string claims it's Opera 1057 // 9, then later includes a Version/X.Y field: 1058 // 1059 // Opera/9.80 (foo) Presto/2.2.15 Version/10.10 1060 var uas = navigator.userAgent; 1061 var agent = /(?:MSIE.(\d+\.\d+))|(?:(?:Firefox|GranParadiso|Iceweasel).(\d+\.\d+))|(?:Opera(?:.+Version.|.)(\d+\.\d+))|(?:AppleWebKit.(\d+(?:\.\d+)?))|(?:Trident\/\d+\.\d+.*rv:(\d+\.\d+))/.exec(uas); 1062 var os = /(Mac OS X)|(Windows)|(Linux)/.exec(uas); 1063 1064 _iphone = /\b(iPhone|iP[ao]d)/.exec(uas); 1065 _ipad = /\b(iP[ao]d)/.exec(uas); 1066 _android = /Android/i.exec(uas); 1067 _native = /FBAN\/\w+;/i.exec(uas); 1068 _mobile = /Mobile/i.exec(uas); 1069 1070 // Note that the IE team blog would have you believe you should be checking 1071 // for 'Win64; x64'. But MSDN then reveals that you can actually be coming 1072 // from either x64 or ia64; so ultimately, you should just check for Win64 1073 // as in indicator of whether you're in 64-bit IE. 32-bit IE on 64-bit 1074 // Windows will send 'WOW64' instead. 1075 _win64 = !!(/Win64/.exec(uas)); 1076 1077 if (agent) { 1078 _ie = agent[1] ? parseFloat(agent[1]) : ( 1079 agent[5] ? parseFloat(agent[5]) : NaN); 1080 // IE compatibility mode 1081 if (_ie && document && document.documentMode) { 1082 _ie = document.documentMode; 1083 } 1084 // grab the "true" ie version from the trident token if available 1085 var trident = /(?:Trident\/(\d+.\d+))/.exec(uas); 1086 _ie_real_version = trident ? parseFloat(trident[1]) + 4 : _ie; 1087 1088 _firefox = agent[2] ? parseFloat(agent[2]) : NaN; 1089 _opera = agent[3] ? parseFloat(agent[3]) : NaN; 1090 _webkit = agent[4] ? parseFloat(agent[4]) : NaN; 1091 if (_webkit) { 1092 // We do not add the regexp to the above test, because it will always 1093 // match 'safari' only since 'AppleWebKit' appears before 'Chrome' in 1094 // the userAgent string. 1095 agent = /(?:Chrome\/(\d+\.\d+))/.exec(uas); 1096 _chrome = agent && agent[1] ? parseFloat(agent[1]) : NaN; 1097 } else { 1098 _chrome = NaN; 1099 } 1100 } else { 1101 _ie = _firefox = _opera = _chrome = _webkit = NaN; 1102 } 1103 1104 if (os) { 1105 if (os[1]) { 1106 // Detect OS X version. If no version number matches, set _osx to true. 1107 // Version examples: 10, 10_6_1, 10.7 1108 // Parses version number as a float, taking only first two sets of 1109 // digits. If only one set of digits is found, returns just the major 1110 // version number. 1111 var ver = /(?:Mac OS X (\d+(?:[._]\d+)?))/.exec(uas); 1112 1113 _osx = ver ? parseFloat(ver[1].replace('_', '.')) : true; 1114 } else { 1115 _osx = false; 1116 } 1117 _windows = !!os[2]; 1118 _linux = !!os[3]; 1119 } else { 1120 _osx = _windows = _linux = false; 1121 } 1122 } 1123 1124 var UserAgent_DEPRECATED = { 1125 1126 /** 1127 * Check if the UA is Internet Explorer. 1128 * 1129 * 1130 * @return float|NaN Version number (if match) or NaN. 1131 */ 1132 ie: function() { 1133 return _populate() || _ie; 1134 }, 1135 1136 /** 1137 * Check if we're in Internet Explorer compatibility mode. 1138 * 1139 * @return bool true if in compatibility mode, false if 1140 * not compatibility mode or not ie 1141 */ 1142 ieCompatibilityMode: function() { 1143 return _populate() || (_ie_real_version > _ie); 1144 }, 1145 1146 1147 /** 1148 * Whether the browser is 64-bit IE. Really, this is kind of weak sauce; we 1149 * only need this because Skype can't handle 64-bit IE yet. We need to remove 1150 * this when we don't need it -- tracked by #601957. 1151 */ 1152 ie64: function() { 1153 return UserAgent_DEPRECATED.ie() && _win64; 1154 }, 1155 1156 /** 1157 * Check if the UA is Firefox. 1158 * 1159 * 1160 * @return float|NaN Version number (if match) or NaN. 1161 */ 1162 firefox: function() { 1163 return _populate() || _firefox; 1164 }, 1165 1166 1167 /** 1168 * Check if the UA is Opera. 1169 * 1170 * 1171 * @return float|NaN Version number (if match) or NaN. 1172 */ 1173 opera: function() { 1174 return _populate() || _opera; 1175 }, 1176 1177 1178 /** 1179 * Check if the UA is WebKit. 1180 * 1181 * 1182 * @return float|NaN Version number (if match) or NaN. 1183 */ 1184 webkit: function() { 1185 return _populate() || _webkit; 1186 }, 1187 1188 /** 1189 * For Push 1190 * WILL BE REMOVED VERY SOON. Use UserAgent_DEPRECATED.webkit 1191 */ 1192 safari: function() { 1193 return UserAgent_DEPRECATED.webkit(); 1194 }, 1195 1196 /** 1197 * Check if the UA is a Chrome browser. 1198 * 1199 * 1200 * @return float|NaN Version number (if match) or NaN. 1201 */ 1202 chrome : function() { 1203 return _populate() || _chrome; 1204 }, 1205 1206 1207 /** 1208 * Check if the user is running Windows. 1209 * 1210 * @return bool `true' if the user's OS is Windows. 1211 */ 1212 windows: function() { 1213 return _populate() || _windows; 1214 }, 1215 1216 1217 /** 1218 * Check if the user is running Mac OS X. 1219 * 1220 * @return float|bool Returns a float if a version number is detected, 1221 * otherwise true/false. 1222 */ 1223 osx: function() { 1224 return _populate() || _osx; 1225 }, 1226 1227 /** 1228 * Check if the user is running Linux. 1229 * 1230 * @return bool `true' if the user's OS is some flavor of Linux. 1231 */ 1232 linux: function() { 1233 return _populate() || _linux; 1234 }, 1235 1236 /** 1237 * Check if the user is running on an iPhone or iPod platform. 1238 * 1239 * @return bool `true' if the user is running some flavor of the 1240 * iPhone OS. 1241 */ 1242 iphone: function() { 1243 return _populate() || _iphone; 1244 }, 1245 1246 mobile: function() { 1247 return _populate() || (_iphone || _ipad || _android || _mobile); 1248 }, 1249 1250 nativeApp: function() { 1251 // webviews inside of the native apps 1252 return _populate() || _native; 1253 }, 1254 1255 android: function() { 1256 return _populate() || _android; 1257 }, 1258 1259 ipad: function() { 1260 return _populate() || _ipad; 1261 } 1262 }; 1263 1264 module.exports = UserAgent_DEPRECATED; 1265 1266 1267 /***/ }), 1268 1269 /***/ 1087: 1270 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 1271 1272 "use strict"; 1273 /** 1274 * Copyright 2013-2015, Facebook, Inc. 1275 * All rights reserved. 1276 * 1277 * This source code is licensed under the BSD-style license found in the 1278 * LICENSE file in the root directory of this source tree. An additional grant 1279 * of patent rights can be found in the PATENTS file in the same directory. 1280 * 1281 * @providesModule isEventSupported 1282 */ 1283 1284 1285 1286 var ExecutionEnvironment = __webpack_require__(8202); 1287 1288 var useHasFeature; 1289 if (ExecutionEnvironment.canUseDOM) { 1290 useHasFeature = 1291 document.implementation && 1292 document.implementation.hasFeature && 1293 // always returns true in newer browsers as per the standard. 1294 // @see http://dom.spec.whatwg.org/#dom-domimplementation-hasfeature 1295 document.implementation.hasFeature('', '') !== true; 1296 } 1297 1298 /** 1299 * Checks if an event is supported in the current execution environment. 1300 * 1301 * NOTE: This will not work correctly for non-generic events such as `change`, 1302 * `reset`, `load`, `error`, and `select`. 1303 * 1304 * Borrows from Modernizr. 1305 * 1306 * @param {string} eventNameSuffix Event name, e.g. "click". 1307 * @param {?boolean} capture Check if the capture phase is supported. 1308 * @return {boolean} True if the event is supported. 1309 * @internal 1310 * @license Modernizr 3.0.0pre (Custom Build) | MIT 1311 */ 1312 function isEventSupported(eventNameSuffix, capture) { 1313 if (!ExecutionEnvironment.canUseDOM || 1314 capture && !('addEventListener' in document)) { 1315 return false; 1316 } 1317 1318 var eventName = 'on' + eventNameSuffix; 1319 var isSupported = eventName in document; 1320 1321 if (!isSupported) { 1322 var element = document.createElement('div'); 1323 element.setAttribute(eventName, 'return;'); 1324 isSupported = typeof element[eventName] === 'function'; 1325 } 1326 1327 if (!isSupported && useHasFeature && eventNameSuffix === 'wheel') { 1328 // This is the only way to test support for the `wheel` event in IE9+. 1329 isSupported = document.implementation.hasFeature('Events.wheel', '3.0'); 1330 } 1331 1332 return isSupported; 1333 } 1334 1335 module.exports = isEventSupported; 1336 1337 1338 /***/ }), 1339 1340 /***/ 7191: 1341 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 1342 1343 "use strict"; 1344 /** 1345 * Copyright (c) 2015, Facebook, Inc. 1346 * All rights reserved. 1347 * 1348 * This source code is licensed under the BSD-style license found in the 1349 * LICENSE file in the root directory of this source tree. An additional grant 1350 * of patent rights can be found in the PATENTS file in the same directory. 1351 * 1352 * @providesModule normalizeWheel 1353 * @typechecks 1354 */ 1355 1356 1357 1358 var UserAgent_DEPRECATED = __webpack_require__(2213); 1359 1360 var isEventSupported = __webpack_require__(1087); 1361 1362 1363 // Reasonable defaults 1364 var PIXEL_STEP = 10; 1365 var LINE_HEIGHT = 40; 1366 var PAGE_HEIGHT = 800; 1367 1368 /** 1369 * Mouse wheel (and 2-finger trackpad) support on the web sucks. It is 1370 * complicated, thus this doc is long and (hopefully) detailed enough to answer 1371 * your questions. 1372 * 1373 * If you need to react to the mouse wheel in a predictable way, this code is 1374 * like your bestest friend. * hugs * 1375 * 1376 * As of today, there are 4 DOM event types you can listen to: 1377 * 1378 * 'wheel' -- Chrome(31+), FF(17+), IE(9+) 1379 * 'mousewheel' -- Chrome, IE(6+), Opera, Safari 1380 * 'MozMousePixelScroll' -- FF(3.5 only!) (2010-2013) -- don't bother! 1381 * 'DOMMouseScroll' -- FF(0.9.7+) since 2003 1382 * 1383 * So what to do? The is the best: 1384 * 1385 * normalizeWheel.getEventType(); 1386 * 1387 * In your event callback, use this code to get sane interpretation of the 1388 * deltas. This code will return an object with properties: 1389 * 1390 * spinX -- normalized spin speed (use for zoom) - x plane 1391 * spinY -- " - y plane 1392 * pixelX -- normalized distance (to pixels) - x plane 1393 * pixelY -- " - y plane 1394 * 1395 * Wheel values are provided by the browser assuming you are using the wheel to 1396 * scroll a web page by a number of lines or pixels (or pages). Values can vary 1397 * significantly on different platforms and browsers, forgetting that you can 1398 * scroll at different speeds. Some devices (like trackpads) emit more events 1399 * at smaller increments with fine granularity, and some emit massive jumps with 1400 * linear speed or acceleration. 1401 * 1402 * This code does its best to normalize the deltas for you: 1403 * 1404 * - spin is trying to normalize how far the wheel was spun (or trackpad 1405 * dragged). This is super useful for zoom support where you want to 1406 * throw away the chunky scroll steps on the PC and make those equal to 1407 * the slow and smooth tiny steps on the Mac. Key data: This code tries to 1408 * resolve a single slow step on a wheel to 1. 1409 * 1410 * - pixel is normalizing the desired scroll delta in pixel units. You'll 1411 * get the crazy differences between browsers, but at least it'll be in 1412 * pixels! 1413 * 1414 * - positive value indicates scrolling DOWN/RIGHT, negative UP/LEFT. This 1415 * should translate to positive value zooming IN, negative zooming OUT. 1416 * This matches the newer 'wheel' event. 1417 * 1418 * Why are there spinX, spinY (or pixels)? 1419 * 1420 * - spinX is a 2-finger side drag on the trackpad, and a shift + wheel turn 1421 * with a mouse. It results in side-scrolling in the browser by default. 1422 * 1423 * - spinY is what you expect -- it's the classic axis of a mouse wheel. 1424 * 1425 * - I dropped spinZ/pixelZ. It is supported by the DOM 3 'wheel' event and 1426 * probably is by browsers in conjunction with fancy 3D controllers .. but 1427 * you know. 1428 * 1429 * Implementation info: 1430 * 1431 * Examples of 'wheel' event if you scroll slowly (down) by one step with an 1432 * average mouse: 1433 * 1434 * OS X + Chrome (mouse) - 4 pixel delta (wheelDelta -120) 1435 * OS X + Safari (mouse) - N/A pixel delta (wheelDelta -12) 1436 * OS X + Firefox (mouse) - 0.1 line delta (wheelDelta N/A) 1437 * Win8 + Chrome (mouse) - 100 pixel delta (wheelDelta -120) 1438 * Win8 + Firefox (mouse) - 3 line delta (wheelDelta -120) 1439 * 1440 * On the trackpad: 1441 * 1442 * OS X + Chrome (trackpad) - 2 pixel delta (wheelDelta -6) 1443 * OS X + Firefox (trackpad) - 1 pixel delta (wheelDelta N/A) 1444 * 1445 * On other/older browsers.. it's more complicated as there can be multiple and 1446 * also missing delta values. 1447 * 1448 * The 'wheel' event is more standard: 1449 * 1450 * http://www.w3.org/TR/DOM-Level-3-Events/#events-wheelevents 1451 * 1452 * The basics is that it includes a unit, deltaMode (pixels, lines, pages), and 1453 * deltaX, deltaY and deltaZ. Some browsers provide other values to maintain 1454 * backward compatibility with older events. Those other values help us 1455 * better normalize spin speed. Example of what the browsers provide: 1456 * 1457 * | event.wheelDelta | event.detail 1458 * ------------------+------------------+-------------- 1459 * Safari v5/OS X | -120 | 0 1460 * Safari v5/Win7 | -120 | 0 1461 * Chrome v17/OS X | -120 | 0 1462 * Chrome v17/Win7 | -120 | 0 1463 * IE9/Win7 | -120 | undefined 1464 * Firefox v4/OS X | undefined | 1 1465 * Firefox v4/Win7 | undefined | 3 1466 * 1467 */ 1468 function normalizeWheel(/*object*/ event) /*object*/ { 1469 var sX = 0, sY = 0, // spinX, spinY 1470 pX = 0, pY = 0; // pixelX, pixelY 1471 1472 // Legacy 1473 if ('detail' in event) { sY = event.detail; } 1474 if ('wheelDelta' in event) { sY = -event.wheelDelta / 120; } 1475 if ('wheelDeltaY' in event) { sY = -event.wheelDeltaY / 120; } 1476 if ('wheelDeltaX' in event) { sX = -event.wheelDeltaX / 120; } 1477 1478 // side scrolling on FF with DOMMouseScroll 1479 if ( 'axis' in event && event.axis === event.HORIZONTAL_AXIS ) { 1480 sX = sY; 1481 sY = 0; 1482 } 1483 1484 pX = sX * PIXEL_STEP; 1485 pY = sY * PIXEL_STEP; 1486 1487 if ('deltaY' in event) { pY = event.deltaY; } 1488 if ('deltaX' in event) { pX = event.deltaX; } 1489 1490 if ((pX || pY) && event.deltaMode) { 1491 if (event.deltaMode == 1) { // delta in LINE units 1492 pX *= LINE_HEIGHT; 1493 pY *= LINE_HEIGHT; 1494 } else { // delta in PAGE units 1495 pX *= PAGE_HEIGHT; 1496 pY *= PAGE_HEIGHT; 1497 } 1498 } 1499 1500 // Fall-back if spin cannot be determined 1501 if (pX && !sX) { sX = (pX < 1) ? -1 : 1; } 1502 if (pY && !sY) { sY = (pY < 1) ? -1 : 1; } 1503 1504 return { spinX : sX, 1505 spinY : sY, 1506 pixelX : pX, 1507 pixelY : pY }; 1508 } 1509 1510 1511 /** 1512 * The best combination if you prefer spinX + spinY normalization. It favors 1513 * the older DOMMouseScroll for Firefox, as FF does not include wheelDelta with 1514 * 'wheel' event, making spin speed determination impossible. 1515 */ 1516 normalizeWheel.getEventType = function() /*string*/ { 1517 return (UserAgent_DEPRECATED.firefox()) 1518 ? 'DOMMouseScroll' 1519 : (isEventSupported('wheel')) 1520 ? 'wheel' 1521 : 'mousewheel'; 1522 }; 1523 1524 module.exports = normalizeWheel; 1525 1526 1527 /***/ }), 1528 1529 /***/ 2775: 1530 /***/ ((module) => { 1531 1532 var x=String; 1533 var create=function() {return {isColorSupported:false,reset:x,bold:x,dim:x,italic:x,underline:x,inverse:x,hidden:x,strikethrough:x,black:x,red:x,green:x,yellow:x,blue:x,magenta:x,cyan:x,white:x,gray:x,bgBlack:x,bgRed:x,bgGreen:x,bgYellow:x,bgBlue:x,bgMagenta:x,bgCyan:x,bgWhite:x,blackBright:x,redBright:x,greenBright:x,yellowBright:x,blueBright:x,magentaBright:x,cyanBright:x,whiteBright:x,bgBlackBright:x,bgRedBright:x,bgGreenBright:x,bgYellowBright:x,bgBlueBright:x,bgMagentaBright:x,bgCyanBright:x,bgWhiteBright:x}}; 1534 module.exports=create(); 1535 module.exports.createColors = create; 1536 1537 1538 /***/ }), 1539 1540 /***/ 1443: 1541 /***/ ((module) => { 1542 1543 module.exports = function postcssPrefixSelector(options) { 1544 const prefix = options.prefix; 1545 const prefixWithSpace = /\s+$/.test(prefix) ? prefix : `$prefix} `; 1546 const ignoreFiles = options.ignoreFiles ? [].concat(options.ignoreFiles) : []; 1547 const includeFiles = options.includeFiles 1548 ? [].concat(options.includeFiles) 1549 : []; 1550 1551 return function (root) { 1552 if ( 1553 ignoreFiles.length && 1554 root.source.input.file && 1555 isFileInArray(root.source.input.file, ignoreFiles) 1556 ) { 1557 return; 1558 } 1559 if ( 1560 includeFiles.length && 1561 root.source.input.file && 1562 !isFileInArray(root.source.input.file, includeFiles) 1563 ) { 1564 return; 1565 } 1566 1567 root.walkRules((rule) => { 1568 const keyframeRules = [ 1569 'keyframes', 1570 '-webkit-keyframes', 1571 '-moz-keyframes', 1572 '-o-keyframes', 1573 '-ms-keyframes', 1574 ]; 1575 1576 if (rule.parent && keyframeRules.includes(rule.parent.name)) { 1577 return; 1578 } 1579 1580 rule.selectors = rule.selectors.map((selector) => { 1581 if (options.exclude && excludeSelector(selector, options.exclude)) { 1582 return selector; 1583 } 1584 1585 if (options.transform) { 1586 return options.transform( 1587 prefix, 1588 selector, 1589 prefixWithSpace + selector, 1590 root.source.input.file, 1591 rule 1592 ); 1593 } 1594 1595 return prefixWithSpace + selector; 1596 }); 1597 }); 1598 }; 1599 }; 1600 1601 function isFileInArray(file, arr) { 1602 return arr.some((ruleOrString) => { 1603 if (ruleOrString instanceof RegExp) { 1604 return ruleOrString.test(file); 1605 } 1606 1607 return file.includes(ruleOrString); 1608 }); 1609 } 1610 1611 function excludeSelector(selector, excludeArr) { 1612 return excludeArr.some((excludeRule) => { 1613 if (excludeRule instanceof RegExp) { 1614 return excludeRule.test(selector); 1615 } 1616 1617 return selector === excludeRule; 1618 }); 1619 } 1620 1621 1622 /***/ }), 1623 1624 /***/ 5404: 1625 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 1626 1627 const CSSValueParser = __webpack_require__(1544) 1628 1629 /** 1630 * @type {import('postcss').PluginCreator} 1631 */ 1632 module.exports = (opts) => { 1633 1634 const DEFAULTS = { 1635 skipHostRelativeUrls: true, 1636 } 1637 const config = Object.assign(DEFAULTS, opts) 1638 1639 return { 1640 postcssPlugin: 'rebaseUrl', 1641 1642 Declaration(decl) { 1643 // The faster way to find Declaration node 1644 const parsedValue = CSSValueParser(decl.value) 1645 1646 let valueChanged = false 1647 parsedValue.walk(node => { 1648 if (node.type !== 'function' || node.value !== 'url') { 1649 return 1650 } 1651 1652 const urlVal = node.nodes[0].value 1653 1654 // bases relative URLs with rootUrl 1655 const basedUrl = new URL(urlVal, opts.rootUrl) 1656 1657 // skip host-relative, already normalized URLs (e.g. `/images/image.jpg`, without `..`s) 1658 if ((basedUrl.pathname === urlVal) && config.skipHostRelativeUrls) { 1659 return false // skip this value 1660 } 1661 1662 node.nodes[0].value = basedUrl.toString() 1663 valueChanged = true 1664 1665 return false // do not walk deeper 1666 }) 1667 1668 if (valueChanged) { 1669 decl.value = CSSValueParser.stringify(parsedValue) 1670 } 1671 1672 } 1673 } 1674 } 1675 1676 module.exports.postcss = true 1677 1678 1679 /***/ }), 1680 1681 /***/ 1544: 1682 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 1683 1684 var parse = __webpack_require__(8491); 1685 var walk = __webpack_require__(3815); 1686 var stringify = __webpack_require__(4725); 1687 1688 function ValueParser(value) { 1689 if (this instanceof ValueParser) { 1690 this.nodes = parse(value); 1691 return this; 1692 } 1693 return new ValueParser(value); 1694 } 1695 1696 ValueParser.prototype.toString = function() { 1697 return Array.isArray(this.nodes) ? stringify(this.nodes) : ""; 1698 }; 1699 1700 ValueParser.prototype.walk = function(cb, bubble) { 1701 walk(this.nodes, cb, bubble); 1702 return this; 1703 }; 1704 1705 ValueParser.unit = __webpack_require__(1524); 1706 1707 ValueParser.walk = walk; 1708 1709 ValueParser.stringify = stringify; 1710 1711 module.exports = ValueParser; 1712 1713 1714 /***/ }), 1715 1716 /***/ 8491: 1717 /***/ ((module) => { 1718 1719 var openParentheses = "(".charCodeAt(0); 1720 var closeParentheses = ")".charCodeAt(0); 1721 var singleQuote = "'".charCodeAt(0); 1722 var doubleQuote = '"'.charCodeAt(0); 1723 var backslash = "\\".charCodeAt(0); 1724 var slash = "/".charCodeAt(0); 1725 var comma = ",".charCodeAt(0); 1726 var colon = ":".charCodeAt(0); 1727 var star = "*".charCodeAt(0); 1728 var uLower = "u".charCodeAt(0); 1729 var uUpper = "U".charCodeAt(0); 1730 var plus = "+".charCodeAt(0); 1731 var isUnicodeRange = /^[a-f0-9?-]+$/i; 1732 1733 module.exports = function(input) { 1734 var tokens = []; 1735 var value = input; 1736 1737 var next, 1738 quote, 1739 prev, 1740 token, 1741 escape, 1742 escapePos, 1743 whitespacePos, 1744 parenthesesOpenPos; 1745 var pos = 0; 1746 var code = value.charCodeAt(pos); 1747 var max = value.length; 1748 var stack = [{ nodes: tokens }]; 1749 var balanced = 0; 1750 var parent; 1751 1752 var name = ""; 1753 var before = ""; 1754 var after = ""; 1755 1756 while (pos < max) { 1757 // Whitespaces 1758 if (code <= 32) { 1759 next = pos; 1760 do { 1761 next += 1; 1762 code = value.charCodeAt(next); 1763 } while (code <= 32); 1764 token = value.slice(pos, next); 1765 1766 prev = tokens[tokens.length - 1]; 1767 if (code === closeParentheses && balanced) { 1768 after = token; 1769 } else if (prev && prev.type === "div") { 1770 prev.after = token; 1771 prev.sourceEndIndex += token.length; 1772 } else if ( 1773 code === comma || 1774 code === colon || 1775 (code === slash && 1776 value.charCodeAt(next + 1) !== star && 1777 (!parent || 1778 (parent && parent.type === "function" && parent.value !== "calc"))) 1779 ) { 1780 before = token; 1781 } else { 1782 tokens.push({ 1783 type: "space", 1784 sourceIndex: pos, 1785 sourceEndIndex: next, 1786 value: token 1787 }); 1788 } 1789 1790 pos = next; 1791 1792 // Quotes 1793 } else if (code === singleQuote || code === doubleQuote) { 1794 next = pos; 1795 quote = code === singleQuote ? "'" : '"'; 1796 token = { 1797 type: "string", 1798 sourceIndex: pos, 1799 quote: quote 1800 }; 1801 do { 1802 escape = false; 1803 next = value.indexOf(quote, next + 1); 1804 if (~next) { 1805 escapePos = next; 1806 while (value.charCodeAt(escapePos - 1) === backslash) { 1807 escapePos -= 1; 1808 escape = !escape; 1809 } 1810 } else { 1811 value += quote; 1812 next = value.length - 1; 1813 token.unclosed = true; 1814 } 1815 } while (escape); 1816 token.value = value.slice(pos + 1, next); 1817 token.sourceEndIndex = token.unclosed ? next : next + 1; 1818 tokens.push(token); 1819 pos = next + 1; 1820 code = value.charCodeAt(pos); 1821 1822 // Comments 1823 } else if (code === slash && value.charCodeAt(pos + 1) === star) { 1824 next = value.indexOf("*/", pos); 1825 1826 token = { 1827 type: "comment", 1828 sourceIndex: pos, 1829 sourceEndIndex: next + 2 1830 }; 1831 1832 if (next === -1) { 1833 token.unclosed = true; 1834 next = value.length; 1835 token.sourceEndIndex = next; 1836 } 1837 1838 token.value = value.slice(pos + 2, next); 1839 tokens.push(token); 1840 1841 pos = next + 2; 1842 code = value.charCodeAt(pos); 1843 1844 // Operation within calc 1845 } else if ( 1846 (code === slash || code === star) && 1847 parent && 1848 parent.type === "function" && 1849 parent.value === "calc" 1850 ) { 1851 token = value[pos]; 1852 tokens.push({ 1853 type: "word", 1854 sourceIndex: pos - before.length, 1855 sourceEndIndex: pos + token.length, 1856 value: token 1857 }); 1858 pos += 1; 1859 code = value.charCodeAt(pos); 1860 1861 // Dividers 1862 } else if (code === slash || code === comma || code === colon) { 1863 token = value[pos]; 1864 1865 tokens.push({ 1866 type: "div", 1867 sourceIndex: pos - before.length, 1868 sourceEndIndex: pos + token.length, 1869 value: token, 1870 before: before, 1871 after: "" 1872 }); 1873 before = ""; 1874 1875 pos += 1; 1876 code = value.charCodeAt(pos); 1877 1878 // Open parentheses 1879 } else if (openParentheses === code) { 1880 // Whitespaces after open parentheses 1881 next = pos; 1882 do { 1883 next += 1; 1884 code = value.charCodeAt(next); 1885 } while (code <= 32); 1886 parenthesesOpenPos = pos; 1887 token = { 1888 type: "function", 1889 sourceIndex: pos - name.length, 1890 value: name, 1891 before: value.slice(parenthesesOpenPos + 1, next) 1892 }; 1893 pos = next; 1894 1895 if (name === "url" && code !== singleQuote && code !== doubleQuote) { 1896 next -= 1; 1897 do { 1898 escape = false; 1899 next = value.indexOf(")", next + 1); 1900 if (~next) { 1901 escapePos = next; 1902 while (value.charCodeAt(escapePos - 1) === backslash) { 1903 escapePos -= 1; 1904 escape = !escape; 1905 } 1906 } else { 1907 value += ")"; 1908 next = value.length - 1; 1909 token.unclosed = true; 1910 } 1911 } while (escape); 1912 // Whitespaces before closed 1913 whitespacePos = next; 1914 do { 1915 whitespacePos -= 1; 1916 code = value.charCodeAt(whitespacePos); 1917 } while (code <= 32); 1918 if (parenthesesOpenPos < whitespacePos) { 1919 if (pos !== whitespacePos + 1) { 1920 token.nodes = [ 1921 { 1922 type: "word", 1923 sourceIndex: pos, 1924 sourceEndIndex: whitespacePos + 1, 1925 value: value.slice(pos, whitespacePos + 1) 1926 } 1927 ]; 1928 } else { 1929 token.nodes = []; 1930 } 1931 if (token.unclosed && whitespacePos + 1 !== next) { 1932 token.after = ""; 1933 token.nodes.push({ 1934 type: "space", 1935 sourceIndex: whitespacePos + 1, 1936 sourceEndIndex: next, 1937 value: value.slice(whitespacePos + 1, next) 1938 }); 1939 } else { 1940 token.after = value.slice(whitespacePos + 1, next); 1941 token.sourceEndIndex = next; 1942 } 1943 } else { 1944 token.after = ""; 1945 token.nodes = []; 1946 } 1947 pos = next + 1; 1948 token.sourceEndIndex = token.unclosed ? next : pos; 1949 code = value.charCodeAt(pos); 1950 tokens.push(token); 1951 } else { 1952 balanced += 1; 1953 token.after = ""; 1954 token.sourceEndIndex = pos + 1; 1955 tokens.push(token); 1956 stack.push(token); 1957 tokens = token.nodes = []; 1958 parent = token; 1959 } 1960 name = ""; 1961 1962 // Close parentheses 1963 } else if (closeParentheses === code && balanced) { 1964 pos += 1; 1965 code = value.charCodeAt(pos); 1966 1967 parent.after = after; 1968 parent.sourceEndIndex += after.length; 1969 after = ""; 1970 balanced -= 1; 1971 stack[stack.length - 1].sourceEndIndex = pos; 1972 stack.pop(); 1973 parent = stack[balanced]; 1974 tokens = parent.nodes; 1975 1976 // Words 1977 } else { 1978 next = pos; 1979 do { 1980 if (code === backslash) { 1981 next += 1; 1982 } 1983 next += 1; 1984 code = value.charCodeAt(next); 1985 } while ( 1986 next < max && 1987 !( 1988 code <= 32 || 1989 code === singleQuote || 1990 code === doubleQuote || 1991 code === comma || 1992 code === colon || 1993 code === slash || 1994 code === openParentheses || 1995 (code === star && 1996 parent && 1997 parent.type === "function" && 1998 parent.value === "calc") || 1999 (code === slash && 2000 parent.type === "function" && 2001 parent.value === "calc") || 2002 (code === closeParentheses && balanced) 2003 ) 2004 ); 2005 token = value.slice(pos, next); 2006 2007 if (openParentheses === code) { 2008 name = token; 2009 } else if ( 2010 (uLower === token.charCodeAt(0) || uUpper === token.charCodeAt(0)) && 2011 plus === token.charCodeAt(1) && 2012 isUnicodeRange.test(token.slice(2)) 2013 ) { 2014 tokens.push({ 2015 type: "unicode-range", 2016 sourceIndex: pos, 2017 sourceEndIndex: next, 2018 value: token 2019 }); 2020 } else { 2021 tokens.push({ 2022 type: "word", 2023 sourceIndex: pos, 2024 sourceEndIndex: next, 2025 value: token 2026 }); 2027 } 2028 2029 pos = next; 2030 } 2031 } 2032 2033 for (pos = stack.length - 1; pos; pos -= 1) { 2034 stack[pos].unclosed = true; 2035 stack[pos].sourceEndIndex = value.length; 2036 } 2037 2038 return stack[0].nodes; 2039 }; 2040 2041 2042 /***/ }), 2043 2044 /***/ 4725: 2045 /***/ ((module) => { 2046 2047 function stringifyNode(node, custom) { 2048 var type = node.type; 2049 var value = node.value; 2050 var buf; 2051 var customResult; 2052 2053 if (custom && (customResult = custom(node)) !== undefined) { 2054 return customResult; 2055 } else if (type === "word" || type === "space") { 2056 return value; 2057 } else if (type === "string") { 2058 buf = node.quote || ""; 2059 return buf + value + (node.unclosed ? "" : buf); 2060 } else if (type === "comment") { 2061 return "/*" + value + (node.unclosed ? "" : "*/"); 2062 } else if (type === "div") { 2063 return (node.before || "") + value + (node.after || ""); 2064 } else if (Array.isArray(node.nodes)) { 2065 buf = stringify(node.nodes, custom); 2066 if (type !== "function") { 2067 return buf; 2068 } 2069 return ( 2070 value + 2071 "(" + 2072 (node.before || "") + 2073 buf + 2074 (node.after || "") + 2075 (node.unclosed ? "" : ")") 2076 ); 2077 } 2078 return value; 2079 } 2080 2081 function stringify(nodes, custom) { 2082 var result, i; 2083 2084 if (Array.isArray(nodes)) { 2085 result = ""; 2086 for (i = nodes.length - 1; ~i; i -= 1) { 2087 result = stringifyNode(nodes[i], custom) + result; 2088 } 2089 return result; 2090 } 2091 return stringifyNode(nodes, custom); 2092 } 2093 2094 module.exports = stringify; 2095 2096 2097 /***/ }), 2098 2099 /***/ 1524: 2100 /***/ ((module) => { 2101 2102 var minus = "-".charCodeAt(0); 2103 var plus = "+".charCodeAt(0); 2104 var dot = ".".charCodeAt(0); 2105 var exp = "e".charCodeAt(0); 2106 var EXP = "E".charCodeAt(0); 2107 2108 // Check if three code points would start a number 2109 // https://www.w3.org/TR/css-syntax-3/#starts-with-a-number 2110 function likeNumber(value) { 2111 var code = value.charCodeAt(0); 2112 var nextCode; 2113 2114 if (code === plus || code === minus) { 2115 nextCode = value.charCodeAt(1); 2116 2117 if (nextCode >= 48 && nextCode <= 57) { 2118 return true; 2119 } 2120 2121 var nextNextCode = value.charCodeAt(2); 2122 2123 if (nextCode === dot && nextNextCode >= 48 && nextNextCode <= 57) { 2124 return true; 2125 } 2126 2127 return false; 2128 } 2129 2130 if (code === dot) { 2131 nextCode = value.charCodeAt(1); 2132 2133 if (nextCode >= 48 && nextCode <= 57) { 2134 return true; 2135 } 2136 2137 return false; 2138 } 2139 2140 if (code >= 48 && code <= 57) { 2141 return true; 2142 } 2143 2144 return false; 2145 } 2146 2147 // Consume a number 2148 // https://www.w3.org/TR/css-syntax-3/#consume-number 2149 module.exports = function(value) { 2150 var pos = 0; 2151 var length = value.length; 2152 var code; 2153 var nextCode; 2154 var nextNextCode; 2155 2156 if (length === 0 || !likeNumber(value)) { 2157 return false; 2158 } 2159 2160 code = value.charCodeAt(pos); 2161 2162 if (code === plus || code === minus) { 2163 pos++; 2164 } 2165 2166 while (pos < length) { 2167 code = value.charCodeAt(pos); 2168 2169 if (code < 48 || code > 57) { 2170 break; 2171 } 2172 2173 pos += 1; 2174 } 2175 2176 code = value.charCodeAt(pos); 2177 nextCode = value.charCodeAt(pos + 1); 2178 2179 if (code === dot && nextCode >= 48 && nextCode <= 57) { 2180 pos += 2; 2181 2182 while (pos < length) { 2183 code = value.charCodeAt(pos); 2184 2185 if (code < 48 || code > 57) { 2186 break; 2187 } 2188 2189 pos += 1; 2190 } 2191 } 2192 2193 code = value.charCodeAt(pos); 2194 nextCode = value.charCodeAt(pos + 1); 2195 nextNextCode = value.charCodeAt(pos + 2); 2196 2197 if ( 2198 (code === exp || code === EXP) && 2199 ((nextCode >= 48 && nextCode <= 57) || 2200 ((nextCode === plus || nextCode === minus) && 2201 nextNextCode >= 48 && 2202 nextNextCode <= 57)) 2203 ) { 2204 pos += nextCode === plus || nextCode === minus ? 3 : 2; 2205 2206 while (pos < length) { 2207 code = value.charCodeAt(pos); 2208 2209 if (code < 48 || code > 57) { 2210 break; 2211 } 2212 2213 pos += 1; 2214 } 2215 } 2216 2217 return { 2218 number: value.slice(0, pos), 2219 unit: value.slice(pos) 2220 }; 2221 }; 2222 2223 2224 /***/ }), 2225 2226 /***/ 3815: 2227 /***/ ((module) => { 2228 2229 module.exports = function walk(nodes, cb, bubble) { 2230 var i, max, node, result; 2231 2232 for (i = 0, max = nodes.length; i < max; i += 1) { 2233 node = nodes[i]; 2234 if (!bubble) { 2235 result = cb(node, i, nodes); 2236 } 2237 2238 if ( 2239 result !== false && 2240 node.type === "function" && 2241 Array.isArray(node.nodes) 2242 ) { 2243 walk(node.nodes, cb, bubble); 2244 } 2245 2246 if (bubble) { 2247 cb(node, i, nodes); 2248 } 2249 } 2250 }; 2251 2252 2253 /***/ }), 2254 2255 /***/ 1326: 2256 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 2257 2258 "use strict"; 2259 2260 2261 let Container = __webpack_require__(683) 2262 2263 class AtRule extends Container { 2264 constructor(defaults) { 2265 super(defaults) 2266 this.type = 'atrule' 2267 } 2268 2269 append(...children) { 2270 if (!this.proxyOf.nodes) this.nodes = [] 2271 return super.append(...children) 2272 } 2273 2274 prepend(...children) { 2275 if (!this.proxyOf.nodes) this.nodes = [] 2276 return super.prepend(...children) 2277 } 2278 } 2279 2280 module.exports = AtRule 2281 AtRule.default = AtRule 2282 2283 Container.registerAtRule(AtRule) 2284 2285 2286 /***/ }), 2287 2288 /***/ 6589: 2289 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 2290 2291 "use strict"; 2292 2293 2294 let Node = __webpack_require__(7490) 2295 2296 class Comment extends Node { 2297 constructor(defaults) { 2298 super(defaults) 2299 this.type = 'comment' 2300 } 2301 } 2302 2303 module.exports = Comment 2304 Comment.default = Comment 2305 2306 2307 /***/ }), 2308 2309 /***/ 683: 2310 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 2311 2312 "use strict"; 2313 2314 2315 let Comment = __webpack_require__(6589) 2316 let Declaration = __webpack_require__(1516) 2317 let Node = __webpack_require__(7490) 2318 let { isClean, my } = __webpack_require__(1381) 2319 2320 let AtRule, parse, Root, Rule 2321 2322 function cleanSource(nodes) { 2323 return nodes.map(i => { 2324 if (i.nodes) i.nodes = cleanSource(i.nodes) 2325 delete i.source 2326 return i 2327 }) 2328 } 2329 2330 function markTreeDirty(node) { 2331 node[isClean] = false 2332 if (node.proxyOf.nodes) { 2333 for (let i of node.proxyOf.nodes) { 2334 markTreeDirty(i) 2335 } 2336 } 2337 } 2338 2339 class Container extends Node { 2340 append(...children) { 2341 for (let child of children) { 2342 let nodes = this.normalize(child, this.last) 2343 for (let node of nodes) this.proxyOf.nodes.push(node) 2344 } 2345 2346 this.markDirty() 2347 2348 return this 2349 } 2350 2351 cleanRaws(keepBetween) { 2352 super.cleanRaws(keepBetween) 2353 if (this.nodes) { 2354 for (let node of this.nodes) node.cleanRaws(keepBetween) 2355 } 2356 } 2357 2358 each(callback) { 2359 if (!this.proxyOf.nodes) return undefined 2360 let iterator = this.getIterator() 2361 2362 let index, result 2363 while (this.indexes[iterator] < this.proxyOf.nodes.length) { 2364 index = this.indexes[iterator] 2365 result = callback(this.proxyOf.nodes[index], index) 2366 if (result === false) break 2367 2368 this.indexes[iterator] += 1 2369 } 2370 2371 delete this.indexes[iterator] 2372 return result 2373 } 2374 2375 every(condition) { 2376 return this.nodes.every(condition) 2377 } 2378 2379 getIterator() { 2380 if (!this.lastEach) this.lastEach = 0 2381 if (!this.indexes) this.indexes = {} 2382 2383 this.lastEach += 1 2384 let iterator = this.lastEach 2385 this.indexes[iterator] = 0 2386 2387 return iterator 2388 } 2389 2390 getProxyProcessor() { 2391 return { 2392 get(node, prop) { 2393 if (prop === 'proxyOf') { 2394 return node 2395 } else if (!node[prop]) { 2396 return node[prop] 2397 } else if ( 2398 prop === 'each' || 2399 (typeof prop === 'string' && prop.startsWith('walk')) 2400 ) { 2401 return (...args) => { 2402 return node[prop]( 2403 ...args.map(i => { 2404 if (typeof i === 'function') { 2405 return (child, index) => i(child.toProxy(), index) 2406 } else { 2407 return i 2408 } 2409 }) 2410 ) 2411 } 2412 } else if (prop === 'every' || prop === 'some') { 2413 return cb => { 2414 return node[prop]((child, ...other) => 2415 cb(child.toProxy(), ...other) 2416 ) 2417 } 2418 } else if (prop === 'root') { 2419 return () => node.root().toProxy() 2420 } else if (prop === 'nodes') { 2421 return node.nodes.map(i => i.toProxy()) 2422 } else if (prop === 'first' || prop === 'last') { 2423 return node[prop].toProxy() 2424 } else { 2425 return node[prop] 2426 } 2427 }, 2428 2429 set(node, prop, value) { 2430 if (node[prop] === value) return true 2431 node[prop] = value 2432 if (prop === 'name' || prop === 'params' || prop === 'selector') { 2433 node.markDirty() 2434 } 2435 return true 2436 } 2437 } 2438 } 2439 2440 index(child) { 2441 if (typeof child === 'number') return child 2442 if (child.proxyOf) child = child.proxyOf 2443 return this.proxyOf.nodes.indexOf(child) 2444 } 2445 2446 insertAfter(exist, add) { 2447 let existIndex = this.index(exist) 2448 let nodes = this.normalize(add, this.proxyOf.nodes[existIndex]).reverse() 2449 existIndex = this.index(exist) 2450 for (let node of nodes) this.proxyOf.nodes.splice(existIndex + 1, 0, node) 2451 2452 let index 2453 for (let id in this.indexes) { 2454 index = this.indexes[id] 2455 if (existIndex < index) { 2456 this.indexes[id] = index + nodes.length 2457 } 2458 } 2459 2460 this.markDirty() 2461 2462 return this 2463 } 2464 2465 insertBefore(exist, add) { 2466 let existIndex = this.index(exist) 2467 let type = existIndex === 0 ? 'prepend' : false 2468 let nodes = this.normalize( 2469 add, 2470 this.proxyOf.nodes[existIndex], 2471 type 2472 ).reverse() 2473 existIndex = this.index(exist) 2474 for (let node of nodes) this.proxyOf.nodes.splice(existIndex, 0, node) 2475 2476 let index 2477 for (let id in this.indexes) { 2478 index = this.indexes[id] 2479 if (existIndex <= index) { 2480 this.indexes[id] = index + nodes.length 2481 } 2482 } 2483 2484 this.markDirty() 2485 2486 return this 2487 } 2488 2489 normalize(nodes, sample) { 2490 if (typeof nodes === 'string') { 2491 nodes = cleanSource(parse(nodes).nodes) 2492 } else if (typeof nodes === 'undefined') { 2493 nodes = [] 2494 } else if (Array.isArray(nodes)) { 2495 nodes = nodes.slice(0) 2496 for (let i of nodes) { 2497 if (i.parent) i.parent.removeChild(i, 'ignore') 2498 } 2499 } else if (nodes.type === 'root' && this.type !== 'document') { 2500 nodes = nodes.nodes.slice(0) 2501 for (let i of nodes) { 2502 if (i.parent) i.parent.removeChild(i, 'ignore') 2503 } 2504 } else if (nodes.type) { 2505 nodes = [nodes] 2506 } else if (nodes.prop) { 2507 if (typeof nodes.value === 'undefined') { 2508 throw new Error('Value field is missed in node creation') 2509 } else if (typeof nodes.value !== 'string') { 2510 nodes.value = String(nodes.value) 2511 } 2512 nodes = [new Declaration(nodes)] 2513 } else if (nodes.selector || nodes.selectors) { 2514 nodes = [new Rule(nodes)] 2515 } else if (nodes.name) { 2516 nodes = [new AtRule(nodes)] 2517 } else if (nodes.text) { 2518 nodes = [new Comment(nodes)] 2519 } else { 2520 throw new Error('Unknown node type in node creation') 2521 } 2522 2523 let processed = nodes.map(i => { 2524 /* c8 ignore next */ 2525 if (!i[my]) Container.rebuild(i) 2526 i = i.proxyOf 2527 if (i.parent) i.parent.removeChild(i) 2528 if (i[isClean]) markTreeDirty(i) 2529 2530 if (!i.raws) i.raws = {} 2531 if (typeof i.raws.before === 'undefined') { 2532 if (sample && typeof sample.raws.before !== 'undefined') { 2533 i.raws.before = sample.raws.before.replace(/\S/g, '') 2534 } 2535 } 2536 i.parent = this.proxyOf 2537 return i 2538 }) 2539 2540 return processed 2541 } 2542 2543 prepend(...children) { 2544 children = children.reverse() 2545 for (let child of children) { 2546 let nodes = this.normalize(child, this.first, 'prepend').reverse() 2547 for (let node of nodes) this.proxyOf.nodes.unshift(node) 2548 for (let id in this.indexes) { 2549 this.indexes[id] = this.indexes[id] + nodes.length 2550 } 2551 } 2552 2553 this.markDirty() 2554 2555 return this 2556 } 2557 2558 push(child) { 2559 child.parent = this 2560 this.proxyOf.nodes.push(child) 2561 return this 2562 } 2563 2564 removeAll() { 2565 for (let node of this.proxyOf.nodes) node.parent = undefined 2566 this.proxyOf.nodes = [] 2567 2568 this.markDirty() 2569 2570 return this 2571 } 2572 2573 removeChild(child) { 2574 child = this.index(child) 2575 this.proxyOf.nodes[child].parent = undefined 2576 this.proxyOf.nodes.splice(child, 1) 2577 2578 let index 2579 for (let id in this.indexes) { 2580 index = this.indexes[id] 2581 if (index >= child) { 2582 this.indexes[id] = index - 1 2583 } 2584 } 2585 2586 this.markDirty() 2587 2588 return this 2589 } 2590 2591 replaceValues(pattern, opts, callback) { 2592 if (!callback) { 2593 callback = opts 2594 opts = {} 2595 } 2596 2597 this.walkDecls(decl => { 2598 if (opts.props && !opts.props.includes(decl.prop)) return 2599 if (opts.fast && !decl.value.includes(opts.fast)) return 2600 2601 decl.value = decl.value.replace(pattern, callback) 2602 }) 2603 2604 this.markDirty() 2605 2606 return this 2607 } 2608 2609 some(condition) { 2610 return this.nodes.some(condition) 2611 } 2612 2613 walk(callback) { 2614 return this.each((child, i) => { 2615 let result 2616 try { 2617 result = callback(child, i) 2618 } catch (e) { 2619 throw child.addToError(e) 2620 } 2621 if (result !== false && child.walk) { 2622 result = child.walk(callback) 2623 } 2624 2625 return result 2626 }) 2627 } 2628 2629 walkAtRules(name, callback) { 2630 if (!callback) { 2631 callback = name 2632 return this.walk((child, i) => { 2633 if (child.type === 'atrule') { 2634 return callback(child, i) 2635 } 2636 }) 2637 } 2638 if (name instanceof RegExp) { 2639 return this.walk((child, i) => { 2640 if (child.type === 'atrule' && name.test(child.name)) { 2641 return callback(child, i) 2642 } 2643 }) 2644 } 2645 return this.walk((child, i) => { 2646 if (child.type === 'atrule' && child.name === name) { 2647 return callback(child, i) 2648 } 2649 }) 2650 } 2651 2652 walkComments(callback) { 2653 return this.walk((child, i) => { 2654 if (child.type === 'comment') { 2655 return callback(child, i) 2656 } 2657 }) 2658 } 2659 2660 walkDecls(prop, callback) { 2661 if (!callback) { 2662 callback = prop 2663 return this.walk((child, i) => { 2664 if (child.type === 'decl') { 2665 return callback(child, i) 2666 } 2667 }) 2668 } 2669 if (prop instanceof RegExp) { 2670 return this.walk((child, i) => { 2671 if (child.type === 'decl' && prop.test(child.prop)) { 2672 return callback(child, i) 2673 } 2674 }) 2675 } 2676 return this.walk((child, i) => { 2677 if (child.type === 'decl' && child.prop === prop) { 2678 return callback(child, i) 2679 } 2680 }) 2681 } 2682 2683 walkRules(selector, callback) { 2684 if (!callback) { 2685 callback = selector 2686 2687 return this.walk((child, i) => { 2688 if (child.type === 'rule') { 2689 return callback(child, i) 2690 } 2691 }) 2692 } 2693 if (selector instanceof RegExp) { 2694 return this.walk((child, i) => { 2695 if (child.type === 'rule' && selector.test(child.selector)) { 2696 return callback(child, i) 2697 } 2698 }) 2699 } 2700 return this.walk((child, i) => { 2701 if (child.type === 'rule' && child.selector === selector) { 2702 return callback(child, i) 2703 } 2704 }) 2705 } 2706 2707 get first() { 2708 if (!this.proxyOf.nodes) return undefined 2709 return this.proxyOf.nodes[0] 2710 } 2711 2712 get last() { 2713 if (!this.proxyOf.nodes) return undefined 2714 return this.proxyOf.nodes[this.proxyOf.nodes.length - 1] 2715 } 2716 } 2717 2718 Container.registerParse = dependant => { 2719 parse = dependant 2720 } 2721 2722 Container.registerRule = dependant => { 2723 Rule = dependant 2724 } 2725 2726 Container.registerAtRule = dependant => { 2727 AtRule = dependant 2728 } 2729 2730 Container.registerRoot = dependant => { 2731 Root = dependant 2732 } 2733 2734 module.exports = Container 2735 Container.default = Container 2736 2737 /* c8 ignore start */ 2738 Container.rebuild = node => { 2739 if (node.type === 'atrule') { 2740 Object.setPrototypeOf(node, AtRule.prototype) 2741 } else if (node.type === 'rule') { 2742 Object.setPrototypeOf(node, Rule.prototype) 2743 } else if (node.type === 'decl') { 2744 Object.setPrototypeOf(node, Declaration.prototype) 2745 } else if (node.type === 'comment') { 2746 Object.setPrototypeOf(node, Comment.prototype) 2747 } else if (node.type === 'root') { 2748 Object.setPrototypeOf(node, Root.prototype) 2749 } 2750 2751 node[my] = true 2752 2753 if (node.nodes) { 2754 node.nodes.forEach(child => { 2755 Container.rebuild(child) 2756 }) 2757 } 2758 } 2759 /* c8 ignore stop */ 2760 2761 2762 /***/ }), 2763 2764 /***/ 356: 2765 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 2766 2767 "use strict"; 2768 2769 2770 let pico = __webpack_require__(2775) 2771 2772 let terminalHighlight = __webpack_require__(9746) 2773 2774 class CssSyntaxError extends Error { 2775 constructor(message, line, column, source, file, plugin) { 2776 super(message) 2777 this.name = 'CssSyntaxError' 2778 this.reason = message 2779 2780 if (file) { 2781 this.file = file 2782 } 2783 if (source) { 2784 this.source = source 2785 } 2786 if (plugin) { 2787 this.plugin = plugin 2788 } 2789 if (typeof line !== 'undefined' && typeof column !== 'undefined') { 2790 if (typeof line === 'number') { 2791 this.line = line 2792 this.column = column 2793 } else { 2794 this.line = line.line 2795 this.column = line.column 2796 this.endLine = column.line 2797 this.endColumn = column.column 2798 } 2799 } 2800 2801 this.setMessage() 2802 2803 if (Error.captureStackTrace) { 2804 Error.captureStackTrace(this, CssSyntaxError) 2805 } 2806 } 2807 2808 setMessage() { 2809 this.message = this.plugin ? this.plugin + ': ' : '' 2810 this.message += this.file ? this.file : '<css input>' 2811 if (typeof this.line !== 'undefined') { 2812 this.message += ':' + this.line + ':' + this.column 2813 } 2814 this.message += ': ' + this.reason 2815 } 2816 2817 showSourceCode(color) { 2818 if (!this.source) return '' 2819 2820 let css = this.source 2821 if (color == null) color = pico.isColorSupported 2822 2823 let aside = text => text 2824 let mark = text => text 2825 let highlight = text => text 2826 if (color) { 2827 let { bold, gray, red } = pico.createColors(true) 2828 mark = text => bold(red(text)) 2829 aside = text => gray(text) 2830 if (terminalHighlight) { 2831 highlight = text => terminalHighlight(text) 2832 } 2833 } 2834 2835 let lines = css.split(/\r?\n/) 2836 let start = Math.max(this.line - 3, 0) 2837 let end = Math.min(this.line + 2, lines.length) 2838 let maxWidth = String(end).length 2839 2840 return lines 2841 .slice(start, end) 2842 .map((line, index) => { 2843 let number = start + 1 + index 2844 let gutter = ' ' + (' ' + number).slice(-maxWidth) + ' | ' 2845 if (number === this.line) { 2846 if (line.length > 160) { 2847 let padding = 20 2848 let subLineStart = Math.max(0, this.column - padding) 2849 let subLineEnd = Math.max( 2850 this.column + padding, 2851 this.endColumn + padding 2852 ) 2853 let subLine = line.slice(subLineStart, subLineEnd) 2854 2855 let spacing = 2856 aside(gutter.replace(/\d/g, ' ')) + 2857 line 2858 .slice(0, Math.min(this.column - 1, padding - 1)) 2859 .replace(/[^\t]/g, ' ') 2860 2861 return ( 2862 mark('>') + 2863 aside(gutter) + 2864 highlight(subLine) + 2865 '\n ' + 2866 spacing + 2867 mark('^') 2868 ) 2869 } 2870 2871 let spacing = 2872 aside(gutter.replace(/\d/g, ' ')) + 2873 line.slice(0, this.column - 1).replace(/[^\t]/g, ' ') 2874 2875 return ( 2876 mark('>') + 2877 aside(gutter) + 2878 highlight(line) + 2879 '\n ' + 2880 spacing + 2881 mark('^') 2882 ) 2883 } 2884 2885 return ' ' + aside(gutter) + highlight(line) 2886 }) 2887 .join('\n') 2888 } 2889 2890 toString() { 2891 let code = this.showSourceCode() 2892 if (code) { 2893 code = '\n\n' + code + '\n' 2894 } 2895 return this.name + ': ' + this.message + code 2896 } 2897 } 2898 2899 module.exports = CssSyntaxError 2900 CssSyntaxError.default = CssSyntaxError 2901 2902 2903 /***/ }), 2904 2905 /***/ 1516: 2906 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 2907 2908 "use strict"; 2909 2910 2911 let Node = __webpack_require__(7490) 2912 2913 class Declaration extends Node { 2914 constructor(defaults) { 2915 if ( 2916 defaults && 2917 typeof defaults.value !== 'undefined' && 2918 typeof defaults.value !== 'string' 2919 ) { 2920 defaults = { ...defaults, value: String(defaults.value) } 2921 } 2922 super(defaults) 2923 this.type = 'decl' 2924 } 2925 2926 get variable() { 2927 return this.prop.startsWith('--') || this.prop[0] === '$' 2928 } 2929 } 2930 2931 module.exports = Declaration 2932 Declaration.default = Declaration 2933 2934 2935 /***/ }), 2936 2937 /***/ 271: 2938 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 2939 2940 "use strict"; 2941 2942 2943 let Container = __webpack_require__(683) 2944 2945 let LazyResult, Processor 2946 2947 class Document extends Container { 2948 constructor(defaults) { 2949 // type needs to be passed to super, otherwise child roots won't be normalized correctly 2950 super({ type: 'document', ...defaults }) 2951 2952 if (!this.nodes) { 2953 this.nodes = [] 2954 } 2955 } 2956 2957 toResult(opts = {}) { 2958 let lazy = new LazyResult(new Processor(), this, opts) 2959 2960 return lazy.stringify() 2961 } 2962 } 2963 2964 Document.registerLazyResult = dependant => { 2965 LazyResult = dependant 2966 } 2967 2968 Document.registerProcessor = dependant => { 2969 Processor = dependant 2970 } 2971 2972 module.exports = Document 2973 Document.default = Document 2974 2975 2976 /***/ }), 2977 2978 /***/ 8940: 2979 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 2980 2981 "use strict"; 2982 2983 2984 let AtRule = __webpack_require__(1326) 2985 let Comment = __webpack_require__(6589) 2986 let Declaration = __webpack_require__(1516) 2987 let Input = __webpack_require__(5380) 2988 let PreviousMap = __webpack_require__(5696) 2989 let Root = __webpack_require__(9434) 2990 let Rule = __webpack_require__(4092) 2991 2992 function fromJSON(json, inputs) { 2993 if (Array.isArray(json)) return json.map(n => fromJSON(n)) 2994 2995 let { inputs: ownInputs, ...defaults } = json 2996 if (ownInputs) { 2997 inputs = [] 2998 for (let input of ownInputs) { 2999 let inputHydrated = { ...input, __proto__: Input.prototype } 3000 if (inputHydrated.map) { 3001 inputHydrated.map = { 3002 ...inputHydrated.map, 3003 __proto__: PreviousMap.prototype 3004 } 3005 } 3006 inputs.push(inputHydrated) 3007 } 3008 } 3009 if (defaults.nodes) { 3010 defaults.nodes = json.nodes.map(n => fromJSON(n, inputs)) 3011 } 3012 if (defaults.source) { 3013 let { inputId, ...source } = defaults.source 3014 defaults.source = source 3015 if (inputId != null) { 3016 defaults.source.input = inputs[inputId] 3017 } 3018 } 3019 if (defaults.type === 'root') { 3020 return new Root(defaults) 3021 } else if (defaults.type === 'decl') { 3022 return new Declaration(defaults) 3023 } else if (defaults.type === 'rule') { 3024 return new Rule(defaults) 3025 } else if (defaults.type === 'comment') { 3026 return new Comment(defaults) 3027 } else if (defaults.type === 'atrule') { 3028 return new AtRule(defaults) 3029 } else { 3030 throw new Error('Unknown node type: ' + json.type) 3031 } 3032 } 3033 3034 module.exports = fromJSON 3035 fromJSON.default = fromJSON 3036 3037 3038 /***/ }), 3039 3040 /***/ 5380: 3041 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 3042 3043 "use strict"; 3044 3045 3046 let { nanoid } = __webpack_require__(5042) 3047 let { isAbsolute, resolve } = __webpack_require__(197) 3048 let { SourceMapConsumer, SourceMapGenerator } = __webpack_require__(1866) 3049 let { fileURLToPath, pathToFileURL } = __webpack_require__(2739) 3050 3051 let CssSyntaxError = __webpack_require__(356) 3052 let PreviousMap = __webpack_require__(5696) 3053 let terminalHighlight = __webpack_require__(9746) 3054 3055 let fromOffsetCache = Symbol('fromOffsetCache') 3056 3057 let sourceMapAvailable = Boolean(SourceMapConsumer && SourceMapGenerator) 3058 let pathAvailable = Boolean(resolve && isAbsolute) 3059 3060 class Input { 3061 constructor(css, opts = {}) { 3062 if ( 3063 css === null || 3064 typeof css === 'undefined' || 3065 (typeof css === 'object' && !css.toString) 3066 ) { 3067 throw new Error(`PostCSS received $css} instead of CSS string`) 3068 } 3069 3070 this.css = css.toString() 3071 3072 if (this.css[0] === '\uFEFF' || this.css[0] === '\uFFFE') { 3073 this.hasBOM = true 3074 this.css = this.css.slice(1) 3075 } else { 3076 this.hasBOM = false 3077 } 3078 3079 if (opts.from) { 3080 if ( 3081 !pathAvailable || 3082 /^\w+:\/\//.test(opts.from) || 3083 isAbsolute(opts.from) 3084 ) { 3085 this.file = opts.from 3086 } else { 3087 this.file = resolve(opts.from) 3088 } 3089 } 3090 3091 if (pathAvailable && sourceMapAvailable) { 3092 let map = new PreviousMap(this.css, opts) 3093 if (map.text) { 3094 this.map = map 3095 let file = map.consumer().file 3096 if (!this.file && file) this.file = this.mapResolve(file) 3097 } 3098 } 3099 3100 if (!this.file) { 3101 this.id = '<input css ' + nanoid(6) + '>' 3102 } 3103 if (this.map) this.map.file = this.from 3104 } 3105 3106 error(message, line, column, opts = {}) { 3107 let endColumn, endLine, result 3108 3109 if (line && typeof line === 'object') { 3110 let start = line 3111 let end = column 3112 if (typeof start.offset === 'number') { 3113 let pos = this.fromOffset(start.offset) 3114 line = pos.line 3115 column = pos.col 3116 } else { 3117 line = start.line 3118 column = start.column 3119 } 3120 if (typeof end.offset === 'number') { 3121 let pos = this.fromOffset(end.offset) 3122 endLine = pos.line 3123 endColumn = pos.col 3124 } else { 3125 endLine = end.line 3126 endColumn = end.column 3127 } 3128 } else if (!column) { 3129 let pos = this.fromOffset(line) 3130 line = pos.line 3131 column = pos.col 3132 } 3133 3134 let origin = this.origin(line, column, endLine, endColumn) 3135 if (origin) { 3136 result = new CssSyntaxError( 3137 message, 3138 origin.endLine === undefined 3139 ? origin.line 3140 : { column: origin.column, line: origin.line }, 3141 origin.endLine === undefined 3142 ? origin.column 3143 : { column: origin.endColumn, line: origin.endLine }, 3144 origin.source, 3145 origin.file, 3146 opts.plugin 3147 ) 3148 } else { 3149 result = new CssSyntaxError( 3150 message, 3151 endLine === undefined ? line : { column, line }, 3152 endLine === undefined ? column : { column: endColumn, line: endLine }, 3153 this.css, 3154 this.file, 3155 opts.plugin 3156 ) 3157 } 3158 3159 result.input = { column, endColumn, endLine, line, source: this.css } 3160 if (this.file) { 3161 if (pathToFileURL) { 3162 result.input.url = pathToFileURL(this.file).toString() 3163 } 3164 result.input.file = this.file 3165 } 3166 3167 return result 3168 } 3169 3170 fromOffset(offset) { 3171 let lastLine, lineToIndex 3172 if (!this[fromOffsetCache]) { 3173 let lines = this.css.split('\n') 3174 lineToIndex = new Array(lines.length) 3175 let prevIndex = 0 3176 3177 for (let i = 0, l = lines.length; i < l; i++) { 3178 lineToIndex[i] = prevIndex 3179 prevIndex += lines[i].length + 1 3180 } 3181 3182 this[fromOffsetCache] = lineToIndex 3183 } else { 3184 lineToIndex = this[fromOffsetCache] 3185 } 3186 lastLine = lineToIndex[lineToIndex.length - 1] 3187 3188 let min = 0 3189 if (offset >= lastLine) { 3190 min = lineToIndex.length - 1 3191 } else { 3192 let max = lineToIndex.length - 2 3193 let mid 3194 while (min < max) { 3195 mid = min + ((max - min) >> 1) 3196 if (offset < lineToIndex[mid]) { 3197 max = mid - 1 3198 } else if (offset >= lineToIndex[mid + 1]) { 3199 min = mid + 1 3200 } else { 3201 min = mid 3202 break 3203 } 3204 } 3205 } 3206 return { 3207 col: offset - lineToIndex[min] + 1, 3208 line: min + 1 3209 } 3210 } 3211 3212 mapResolve(file) { 3213 if (/^\w+:\/\//.test(file)) { 3214 return file 3215 } 3216 return resolve(this.map.consumer().sourceRoot || this.map.root || '.', file) 3217 } 3218 3219 origin(line, column, endLine, endColumn) { 3220 if (!this.map) return false 3221 let consumer = this.map.consumer() 3222 3223 let from = consumer.originalPositionFor({ column, line }) 3224 if (!from.source) return false 3225 3226 let to 3227 if (typeof endLine === 'number') { 3228 to = consumer.originalPositionFor({ column: endColumn, line: endLine }) 3229 } 3230 3231 let fromUrl 3232 3233 if (isAbsolute(from.source)) { 3234 fromUrl = pathToFileURL(from.source) 3235 } else { 3236 fromUrl = new URL( 3237 from.source, 3238 this.map.consumer().sourceRoot || pathToFileURL(this.map.mapFile) 3239 ) 3240 } 3241 3242 let result = { 3243 column: from.column, 3244 endColumn: to && to.column, 3245 endLine: to && to.line, 3246 line: from.line, 3247 url: fromUrl.toString() 3248 } 3249 3250 if (fromUrl.protocol === 'file:') { 3251 if (fileURLToPath) { 3252 result.file = fileURLToPath(fromUrl) 3253 } else { 3254 /* c8 ignore next 2 */ 3255 throw new Error(`file: protocol is not available in this PostCSS build`) 3256 } 3257 } 3258 3259 let source = consumer.sourceContentFor(from.source) 3260 if (source) result.source = source 3261 3262 return result 3263 } 3264 3265 toJSON() { 3266 let json = {} 3267 for (let name of ['hasBOM', 'css', 'file', 'id']) { 3268 if (this[name] != null) { 3269 json[name] = this[name] 3270 } 3271 } 3272 if (this.map) { 3273 json.map = { ...this.map } 3274 if (json.map.consumerCache) { 3275 json.map.consumerCache = undefined 3276 } 3277 } 3278 return json 3279 } 3280 3281 get from() { 3282 return this.file || this.id 3283 } 3284 } 3285 3286 module.exports = Input 3287 Input.default = Input 3288 3289 if (terminalHighlight && terminalHighlight.registerInput) { 3290 terminalHighlight.registerInput(Input) 3291 } 3292 3293 3294 /***/ }), 3295 3296 /***/ 448: 3297 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 3298 3299 "use strict"; 3300 3301 3302 let Container = __webpack_require__(683) 3303 let Document = __webpack_require__(271) 3304 let MapGenerator = __webpack_require__(1670) 3305 let parse = __webpack_require__(4295) 3306 let Result = __webpack_require__(9055) 3307 let Root = __webpack_require__(9434) 3308 let stringify = __webpack_require__(633) 3309 let { isClean, my } = __webpack_require__(1381) 3310 let warnOnce = __webpack_require__(3122) 3311 3312 const TYPE_TO_CLASS_NAME = { 3313 atrule: 'AtRule', 3314 comment: 'Comment', 3315 decl: 'Declaration', 3316 document: 'Document', 3317 root: 'Root', 3318 rule: 'Rule' 3319 } 3320 3321 const PLUGIN_PROPS = { 3322 AtRule: true, 3323 AtRuleExit: true, 3324 Comment: true, 3325 CommentExit: true, 3326 Declaration: true, 3327 DeclarationExit: true, 3328 Document: true, 3329 DocumentExit: true, 3330 Once: true, 3331 OnceExit: true, 3332 postcssPlugin: true, 3333 prepare: true, 3334 Root: true, 3335 RootExit: true, 3336 Rule: true, 3337 RuleExit: true 3338 } 3339 3340 const NOT_VISITORS = { 3341 Once: true, 3342 postcssPlugin: true, 3343 prepare: true 3344 } 3345 3346 const CHILDREN = 0 3347 3348 function isPromise(obj) { 3349 return typeof obj === 'object' && typeof obj.then === 'function' 3350 } 3351 3352 function getEvents(node) { 3353 let key = false 3354 let type = TYPE_TO_CLASS_NAME[node.type] 3355 if (node.type === 'decl') { 3356 key = node.prop.toLowerCase() 3357 } else if (node.type === 'atrule') { 3358 key = node.name.toLowerCase() 3359 } 3360 3361 if (key && node.append) { 3362 return [ 3363 type, 3364 type + '-' + key, 3365 CHILDREN, 3366 type + 'Exit', 3367 type + 'Exit-' + key 3368 ] 3369 } else if (key) { 3370 return [type, type + '-' + key, type + 'Exit', type + 'Exit-' + key] 3371 } else if (node.append) { 3372 return [type, CHILDREN, type + 'Exit'] 3373 } else { 3374 return [type, type + 'Exit'] 3375 } 3376 } 3377 3378 function toStack(node) { 3379 let events 3380 if (node.type === 'document') { 3381 events = ['Document', CHILDREN, 'DocumentExit'] 3382 } else if (node.type === 'root') { 3383 events = ['Root', CHILDREN, 'RootExit'] 3384 } else { 3385 events = getEvents(node) 3386 } 3387 3388 return { 3389 eventIndex: 0, 3390 events, 3391 iterator: 0, 3392 node, 3393 visitorIndex: 0, 3394 visitors: [] 3395 } 3396 } 3397 3398 function cleanMarks(node) { 3399 node[isClean] = false 3400 if (node.nodes) node.nodes.forEach(i => cleanMarks(i)) 3401 return node 3402 } 3403 3404 let postcss = {} 3405 3406 class LazyResult { 3407 constructor(processor, css, opts) { 3408 this.stringified = false 3409 this.processed = false 3410 3411 let root 3412 if ( 3413 typeof css === 'object' && 3414 css !== null && 3415 (css.type === 'root' || css.type === 'document') 3416 ) { 3417 root = cleanMarks(css) 3418 } else if (css instanceof LazyResult || css instanceof Result) { 3419 root = cleanMarks(css.root) 3420 if (css.map) { 3421 if (typeof opts.map === 'undefined') opts.map = {} 3422 if (!opts.map.inline) opts.map.inline = false 3423 opts.map.prev = css.map 3424 } 3425 } else { 3426 let parser = parse 3427 if (opts.syntax) parser = opts.syntax.parse 3428 if (opts.parser) parser = opts.parser 3429 if (parser.parse) parser = parser.parse 3430 3431 try { 3432 root = parser(css, opts) 3433 } catch (error) { 3434 this.processed = true 3435 this.error = error 3436 } 3437 3438 if (root && !root[my]) { 3439 /* c8 ignore next 2 */ 3440 Container.rebuild(root) 3441 } 3442 } 3443 3444 this.result = new Result(processor, root, opts) 3445 this.helpers = { ...postcss, postcss, result: this.result } 3446 this.plugins = this.processor.plugins.map(plugin => { 3447 if (typeof plugin === 'object' && plugin.prepare) { 3448 return { ...plugin, ...plugin.prepare(this.result) } 3449 } else { 3450 return plugin 3451 } 3452 }) 3453 } 3454 3455 async() { 3456 if (this.error) return Promise.reject(this.error) 3457 if (this.processed) return Promise.resolve(this.result) 3458 if (!this.processing) { 3459 this.processing = this.runAsync() 3460 } 3461 return this.processing 3462 } 3463 3464 catch(onRejected) { 3465 return this.async().catch(onRejected) 3466 } 3467 3468 finally(onFinally) { 3469 return this.async().then(onFinally, onFinally) 3470 } 3471 3472 getAsyncError() { 3473 throw new Error('Use process(css).then(cb) to work with async plugins') 3474 } 3475 3476 handleError(error, node) { 3477 let plugin = this.result.lastPlugin 3478 try { 3479 if (node) node.addToError(error) 3480 this.error = error 3481 if (error.name === 'CssSyntaxError' && !error.plugin) { 3482 error.plugin = plugin.postcssPlugin 3483 error.setMessage() 3484 } else if (plugin.postcssVersion) { 3485 if (false) {} 3486 } 3487 } catch (err) { 3488 /* c8 ignore next 3 */ 3489 // eslint-disable-next-line no-console 3490 if (console && console.error) console.error(err) 3491 } 3492 return error 3493 } 3494 3495 prepareVisitors() { 3496 this.listeners = {} 3497 let add = (plugin, type, cb) => { 3498 if (!this.listeners[type]) this.listeners[type] = [] 3499 this.listeners[type].push([plugin, cb]) 3500 } 3501 for (let plugin of this.plugins) { 3502 if (typeof plugin === 'object') { 3503 for (let event in plugin) { 3504 if (!PLUGIN_PROPS[event] && /^[A-Z]/.test(event)) { 3505 throw new Error( 3506 `Unknown event $event} in $plugin.postcssPlugin}. ` + 3507 `Try to update PostCSS ($this.processor.version} now).` 3508 ) 3509 } 3510 if (!NOT_VISITORS[event]) { 3511 if (typeof plugin[event] === 'object') { 3512 for (let filter in plugin[event]) { 3513 if (filter === '*') { 3514 add(plugin, event, plugin[event][filter]) 3515 } else { 3516 add( 3517 plugin, 3518 event + '-' + filter.toLowerCase(), 3519 plugin[event][filter] 3520 ) 3521 } 3522 } 3523 } else if (typeof plugin[event] === 'function') { 3524 add(plugin, event, plugin[event]) 3525 } 3526 } 3527 } 3528 } 3529 } 3530 this.hasListener = Object.keys(this.listeners).length > 0 3531 } 3532 3533 async runAsync() { 3534 this.plugin = 0 3535 for (let i = 0; i < this.plugins.length; i++) { 3536 let plugin = this.plugins[i] 3537 let promise = this.runOnRoot(plugin) 3538 if (isPromise(promise)) { 3539 try { 3540 await promise 3541 } catch (error) { 3542 throw this.handleError(error) 3543 } 3544 } 3545 } 3546 3547 this.prepareVisitors() 3548 if (this.hasListener) { 3549 let root = this.result.root 3550 while (!root[isClean]) { 3551 root[isClean] = true 3552 let stack = [toStack(root)] 3553 while (stack.length > 0) { 3554 let promise = this.visitTick(stack) 3555 if (isPromise(promise)) { 3556 try { 3557 await promise 3558 } catch (e) { 3559 let node = stack[stack.length - 1].node 3560 throw this.handleError(e, node) 3561 } 3562 } 3563 } 3564 } 3565 3566 if (this.listeners.OnceExit) { 3567 for (let [plugin, visitor] of this.listeners.OnceExit) { 3568 this.result.lastPlugin = plugin 3569 try { 3570 if (root.type === 'document') { 3571 let roots = root.nodes.map(subRoot => 3572 visitor(subRoot, this.helpers) 3573 ) 3574 3575 await Promise.all(roots) 3576 } else { 3577 await visitor(root, this.helpers) 3578 } 3579 } catch (e) { 3580 throw this.handleError(e) 3581 } 3582 } 3583 } 3584 } 3585 3586 this.processed = true 3587 return this.stringify() 3588 } 3589 3590 runOnRoot(plugin) { 3591 this.result.lastPlugin = plugin 3592 try { 3593 if (typeof plugin === 'object' && plugin.Once) { 3594 if (this.result.root.type === 'document') { 3595 let roots = this.result.root.nodes.map(root => 3596 plugin.Once(root, this.helpers) 3597 ) 3598 3599 if (isPromise(roots[0])) { 3600 return Promise.all(roots) 3601 } 3602 3603 return roots 3604 } 3605 3606 return plugin.Once(this.result.root, this.helpers) 3607 } else if (typeof plugin === 'function') { 3608 return plugin(this.result.root, this.result) 3609 } 3610 } catch (error) { 3611 throw this.handleError(error) 3612 } 3613 } 3614 3615 stringify() { 3616 if (this.error) throw this.error 3617 if (this.stringified) return this.result 3618 this.stringified = true 3619 3620 this.sync() 3621 3622 let opts = this.result.opts 3623 let str = stringify 3624 if (opts.syntax) str = opts.syntax.stringify 3625 if (opts.stringifier) str = opts.stringifier 3626 if (str.stringify) str = str.stringify 3627 3628 let map = new MapGenerator(str, this.result.root, this.result.opts) 3629 let data = map.generate() 3630 this.result.css = data[0] 3631 this.result.map = data[1] 3632 3633 return this.result 3634 } 3635 3636 sync() { 3637 if (this.error) throw this.error 3638 if (this.processed) return this.result 3639 this.processed = true 3640 3641 if (this.processing) { 3642 throw this.getAsyncError() 3643 } 3644 3645 for (let plugin of this.plugins) { 3646 let promise = this.runOnRoot(plugin) 3647 if (isPromise(promise)) { 3648 throw this.getAsyncError() 3649 } 3650 } 3651 3652 this.prepareVisitors() 3653 if (this.hasListener) { 3654 let root = this.result.root 3655 while (!root[isClean]) { 3656 root[isClean] = true 3657 this.walkSync(root) 3658 } 3659 if (this.listeners.OnceExit) { 3660 if (root.type === 'document') { 3661 for (let subRoot of root.nodes) { 3662 this.visitSync(this.listeners.OnceExit, subRoot) 3663 } 3664 } else { 3665 this.visitSync(this.listeners.OnceExit, root) 3666 } 3667 } 3668 } 3669 3670 return this.result 3671 } 3672 3673 then(onFulfilled, onRejected) { 3674 if (false) {} 3675 return this.async().then(onFulfilled, onRejected) 3676 } 3677 3678 toString() { 3679 return this.css 3680 } 3681 3682 visitSync(visitors, node) { 3683 for (let [plugin, visitor] of visitors) { 3684 this.result.lastPlugin = plugin 3685 let promise 3686 try { 3687 promise = visitor(node, this.helpers) 3688 } catch (e) { 3689 throw this.handleError(e, node.proxyOf) 3690 } 3691 if (node.type !== 'root' && node.type !== 'document' && !node.parent) { 3692 return true 3693 } 3694 if (isPromise(promise)) { 3695 throw this.getAsyncError() 3696 } 3697 } 3698 } 3699 3700 visitTick(stack) { 3701 let visit = stack[stack.length - 1] 3702 let { node, visitors } = visit 3703 3704 if (node.type !== 'root' && node.type !== 'document' && !node.parent) { 3705 stack.pop() 3706 return 3707 } 3708 3709 if (visitors.length > 0 && visit.visitorIndex < visitors.length) { 3710 let [plugin, visitor] = visitors[visit.visitorIndex] 3711 visit.visitorIndex += 1 3712 if (visit.visitorIndex === visitors.length) { 3713 visit.visitors = [] 3714 visit.visitorIndex = 0 3715 } 3716 this.result.lastPlugin = plugin 3717 try { 3718 return visitor(node.toProxy(), this.helpers) 3719 } catch (e) { 3720 throw this.handleError(e, node) 3721 } 3722 } 3723 3724 if (visit.iterator !== 0) { 3725 let iterator = visit.iterator 3726 let child 3727 while ((child = node.nodes[node.indexes[iterator]])) { 3728 node.indexes[iterator] += 1 3729 if (!child[isClean]) { 3730 child[isClean] = true 3731 stack.push(toStack(child)) 3732 return 3733 } 3734 } 3735 visit.iterator = 0 3736 delete node.indexes[iterator] 3737 } 3738 3739 let events = visit.events 3740 while (visit.eventIndex < events.length) { 3741 let event = events[visit.eventIndex] 3742 visit.eventIndex += 1 3743 if (event === CHILDREN) { 3744 if (node.nodes && node.nodes.length) { 3745 node[isClean] = true 3746 visit.iterator = node.getIterator() 3747 } 3748 return 3749 } else if (this.listeners[event]) { 3750 visit.visitors = this.listeners[event] 3751 return 3752 } 3753 } 3754 stack.pop() 3755 } 3756 3757 walkSync(node) { 3758 node[isClean] = true 3759 let events = getEvents(node) 3760 for (let event of events) { 3761 if (event === CHILDREN) { 3762 if (node.nodes) { 3763 node.each(child => { 3764 if (!child[isClean]) this.walkSync(child) 3765 }) 3766 } 3767 } else { 3768 let visitors = this.listeners[event] 3769 if (visitors) { 3770 if (this.visitSync(visitors, node.toProxy())) return 3771 } 3772 } 3773 } 3774 } 3775 3776 warnings() { 3777 return this.sync().warnings() 3778 } 3779 3780 get content() { 3781 return this.stringify().content 3782 } 3783 3784 get css() { 3785 return this.stringify().css 3786 } 3787 3788 get map() { 3789 return this.stringify().map 3790 } 3791 3792 get messages() { 3793 return this.sync().messages 3794 } 3795 3796 get opts() { 3797 return this.result.opts 3798 } 3799 3800 get processor() { 3801 return this.result.processor 3802 } 3803 3804 get root() { 3805 return this.sync().root 3806 } 3807 3808 get [Symbol.toStringTag]() { 3809 return 'LazyResult' 3810 } 3811 } 3812 3813 LazyResult.registerPostcss = dependant => { 3814 postcss = dependant 3815 } 3816 3817 module.exports = LazyResult 3818 LazyResult.default = LazyResult 3819 3820 Root.registerLazyResult(LazyResult) 3821 Document.registerLazyResult(LazyResult) 3822 3823 3824 /***/ }), 3825 3826 /***/ 7374: 3827 /***/ ((module) => { 3828 3829 "use strict"; 3830 3831 3832 let list = { 3833 comma(string) { 3834 return list.split(string, [','], true) 3835 }, 3836 3837 space(string) { 3838 let spaces = [' ', '\n', '\t'] 3839 return list.split(string, spaces) 3840 }, 3841 3842 split(string, separators, last) { 3843 let array = [] 3844 let current = '' 3845 let split = false 3846 3847 let func = 0 3848 let inQuote = false 3849 let prevQuote = '' 3850 let escape = false 3851 3852 for (let letter of string) { 3853 if (escape) { 3854 escape = false 3855 } else if (letter === '\\') { 3856 escape = true 3857 } else if (inQuote) { 3858 if (letter === prevQuote) { 3859 inQuote = false 3860 } 3861 } else if (letter === '"' || letter === "'") { 3862 inQuote = true 3863 prevQuote = letter 3864 } else if (letter === '(') { 3865 func += 1 3866 } else if (letter === ')') { 3867 if (func > 0) func -= 1 3868 } else if (func === 0) { 3869 if (separators.includes(letter)) split = true 3870 } 3871 3872 if (split) { 3873 if (current !== '') array.push(current.trim()) 3874 current = '' 3875 split = false 3876 } else { 3877 current += letter 3878 } 3879 } 3880 3881 if (last || current !== '') array.push(current.trim()) 3882 return array 3883 } 3884 } 3885 3886 module.exports = list 3887 list.default = list 3888 3889 3890 /***/ }), 3891 3892 /***/ 1670: 3893 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 3894 3895 "use strict"; 3896 3897 3898 let { dirname, relative, resolve, sep } = __webpack_require__(197) 3899 let { SourceMapConsumer, SourceMapGenerator } = __webpack_require__(1866) 3900 let { pathToFileURL } = __webpack_require__(2739) 3901 3902 let Input = __webpack_require__(5380) 3903 3904 let sourceMapAvailable = Boolean(SourceMapConsumer && SourceMapGenerator) 3905 let pathAvailable = Boolean(dirname && resolve && relative && sep) 3906 3907 class MapGenerator { 3908 constructor(stringify, root, opts, cssString) { 3909 this.stringify = stringify 3910 this.mapOpts = opts.map || {} 3911 this.root = root 3912 this.opts = opts 3913 this.css = cssString 3914 this.originalCSS = cssString 3915 this.usesFileUrls = !this.mapOpts.from && this.mapOpts.absolute 3916 3917 this.memoizedFileURLs = new Map() 3918 this.memoizedPaths = new Map() 3919 this.memoizedURLs = new Map() 3920 } 3921 3922 addAnnotation() { 3923 let content 3924 3925 if (this.isInline()) { 3926 content = 3927 'data:application/json;base64,' + this.toBase64(this.map.toString()) 3928 } else if (typeof this.mapOpts.annotation === 'string') { 3929 content = this.mapOpts.annotation 3930 } else if (typeof this.mapOpts.annotation === 'function') { 3931 content = this.mapOpts.annotation(this.opts.to, this.root) 3932 } else { 3933 content = this.outputFile() + '.map' 3934 } 3935 let eol = '\n' 3936 if (this.css.includes('\r\n')) eol = '\r\n' 3937 3938 this.css += eol + '/*# sourceMappingURL=' + content + ' */' 3939 } 3940 3941 applyPrevMaps() { 3942 for (let prev of this.previous()) { 3943 let from = this.toUrl(this.path(prev.file)) 3944 let root = prev.root || dirname(prev.file) 3945 let map 3946 3947 if (this.mapOpts.sourcesContent === false) { 3948 map = new SourceMapConsumer(prev.text) 3949 if (map.sourcesContent) { 3950 map.sourcesContent = null 3951 } 3952 } else { 3953 map = prev.consumer() 3954 } 3955 3956 this.map.applySourceMap(map, from, this.toUrl(this.path(root))) 3957 } 3958 } 3959 3960 clearAnnotation() { 3961 if (this.mapOpts.annotation === false) return 3962 3963 if (this.root) { 3964 let node 3965 for (let i = this.root.nodes.length - 1; i >= 0; i--) { 3966 node = this.root.nodes[i] 3967 if (node.type !== 'comment') continue 3968 if (node.text.startsWith('# sourceMappingURL=')) { 3969 this.root.removeChild(i) 3970 } 3971 } 3972 } else if (this.css) { 3973 this.css = this.css.replace(/\n*\/\*#[\S\s]*?\*\/$/gm, '') 3974 } 3975 } 3976 3977 generate() { 3978 this.clearAnnotation() 3979 if (pathAvailable && sourceMapAvailable && this.isMap()) { 3980 return this.generateMap() 3981 } else { 3982 let result = '' 3983 this.stringify(this.root, i => { 3984 result += i 3985 }) 3986 return [result] 3987 } 3988 } 3989 3990 generateMap() { 3991 if (this.root) { 3992 this.generateString() 3993 } else if (this.previous().length === 1) { 3994 let prev = this.previous()[0].consumer() 3995 prev.file = this.outputFile() 3996 this.map = SourceMapGenerator.fromSourceMap(prev, { 3997 ignoreInvalidMapping: true 3998 }) 3999 } else { 4000 this.map = new SourceMapGenerator({ 4001 file: this.outputFile(), 4002 ignoreInvalidMapping: true 4003 }) 4004 this.map.addMapping({ 4005 generated: { column: 0, line: 1 }, 4006 original: { column: 0, line: 1 }, 4007 source: this.opts.from 4008 ? this.toUrl(this.path(this.opts.from)) 4009 : '<no source>' 4010 }) 4011 } 4012 4013 if (this.isSourcesContent()) this.setSourcesContent() 4014 if (this.root && this.previous().length > 0) this.applyPrevMaps() 4015 if (this.isAnnotation()) this.addAnnotation() 4016 4017 if (this.isInline()) { 4018 return [this.css] 4019 } else { 4020 return [this.css, this.map] 4021 } 4022 } 4023 4024 generateString() { 4025 this.css = '' 4026 this.map = new SourceMapGenerator({ 4027 file: this.outputFile(), 4028 ignoreInvalidMapping: true 4029 }) 4030 4031 let line = 1 4032 let column = 1 4033 4034 let noSource = '<no source>' 4035 let mapping = { 4036 generated: { column: 0, line: 0 }, 4037 original: { column: 0, line: 0 }, 4038 source: '' 4039 } 4040 4041 let last, lines 4042 this.stringify(this.root, (str, node, type) => { 4043 this.css += str 4044 4045 if (node && type !== 'end') { 4046 mapping.generated.line = line 4047 mapping.generated.column = column - 1 4048 if (node.source && node.source.start) { 4049 mapping.source = this.sourcePath(node) 4050 mapping.original.line = node.source.start.line 4051 mapping.original.column = node.source.start.column - 1 4052 this.map.addMapping(mapping) 4053 } else { 4054 mapping.source = noSource 4055 mapping.original.line = 1 4056 mapping.original.column = 0 4057 this.map.addMapping(mapping) 4058 } 4059 } 4060 4061 lines = str.match(/\n/g) 4062 if (lines) { 4063 line += lines.length 4064 last = str.lastIndexOf('\n') 4065 column = str.length - last 4066 } else { 4067 column += str.length 4068 } 4069 4070 if (node && type !== 'start') { 4071 let p = node.parent || { raws: {} } 4072 let childless = 4073 node.type === 'decl' || (node.type === 'atrule' && !node.nodes) 4074 if (!childless || node !== p.last || p.raws.semicolon) { 4075 if (node.source && node.source.end) { 4076 mapping.source = this.sourcePath(node) 4077 mapping.original.line = node.source.end.line 4078 mapping.original.column = node.source.end.column - 1 4079 mapping.generated.line = line 4080 mapping.generated.column = column - 2 4081 this.map.addMapping(mapping) 4082 } else { 4083 mapping.source = noSource 4084 mapping.original.line = 1 4085 mapping.original.column = 0 4086 mapping.generated.line = line 4087 mapping.generated.column = column - 1 4088 this.map.addMapping(mapping) 4089 } 4090 } 4091 } 4092 }) 4093 } 4094 4095 isAnnotation() { 4096 if (this.isInline()) { 4097 return true 4098 } 4099 if (typeof this.mapOpts.annotation !== 'undefined') { 4100 return this.mapOpts.annotation 4101 } 4102 if (this.previous().length) { 4103 return this.previous().some(i => i.annotation) 4104 } 4105 return true 4106 } 4107 4108 isInline() { 4109 if (typeof this.mapOpts.inline !== 'undefined') { 4110 return this.mapOpts.inline 4111 } 4112 4113 let annotation = this.mapOpts.annotation 4114 if (typeof annotation !== 'undefined' && annotation !== true) { 4115 return false 4116 } 4117 4118 if (this.previous().length) { 4119 return this.previous().some(i => i.inline) 4120 } 4121 return true 4122 } 4123 4124 isMap() { 4125 if (typeof this.opts.map !== 'undefined') { 4126 return !!this.opts.map 4127 } 4128 return this.previous().length > 0 4129 } 4130 4131 isSourcesContent() { 4132 if (typeof this.mapOpts.sourcesContent !== 'undefined') { 4133 return this.mapOpts.sourcesContent 4134 } 4135 if (this.previous().length) { 4136 return this.previous().some(i => i.withContent()) 4137 } 4138 return true 4139 } 4140 4141 outputFile() { 4142 if (this.opts.to) { 4143 return this.path(this.opts.to) 4144 } else if (this.opts.from) { 4145 return this.path(this.opts.from) 4146 } else { 4147 return 'to.css' 4148 } 4149 } 4150 4151 path(file) { 4152 if (this.mapOpts.absolute) return file 4153 if (file.charCodeAt(0) === 60 /* `<` */) return file 4154 if (/^\w+:\/\//.test(file)) return file 4155 let cached = this.memoizedPaths.get(file) 4156 if (cached) return cached 4157 4158 let from = this.opts.to ? dirname(this.opts.to) : '.' 4159 4160 if (typeof this.mapOpts.annotation === 'string') { 4161 from = dirname(resolve(from, this.mapOpts.annotation)) 4162 } 4163 4164 let path = relative(from, file) 4165 this.memoizedPaths.set(file, path) 4166 4167 return path 4168 } 4169 4170 previous() { 4171 if (!this.previousMaps) { 4172 this.previousMaps = [] 4173 if (this.root) { 4174 this.root.walk(node => { 4175 if (node.source && node.source.input.map) { 4176 let map = node.source.input.map 4177 if (!this.previousMaps.includes(map)) { 4178 this.previousMaps.push(map) 4179 } 4180 } 4181 }) 4182 } else { 4183 let input = new Input(this.originalCSS, this.opts) 4184 if (input.map) this.previousMaps.push(input.map) 4185 } 4186 } 4187 4188 return this.previousMaps 4189 } 4190 4191 setSourcesContent() { 4192 let already = {} 4193 if (this.root) { 4194 this.root.walk(node => { 4195 if (node.source) { 4196 let from = node.source.input.from 4197 if (from && !already[from]) { 4198 already[from] = true 4199 let fromUrl = this.usesFileUrls 4200 ? this.toFileUrl(from) 4201 : this.toUrl(this.path(from)) 4202 this.map.setSourceContent(fromUrl, node.source.input.css) 4203 } 4204 } 4205 }) 4206 } else if (this.css) { 4207 let from = this.opts.from 4208 ? this.toUrl(this.path(this.opts.from)) 4209 : '<no source>' 4210 this.map.setSourceContent(from, this.css) 4211 } 4212 } 4213 4214 sourcePath(node) { 4215 if (this.mapOpts.from) { 4216 return this.toUrl(this.mapOpts.from) 4217 } else if (this.usesFileUrls) { 4218 return this.toFileUrl(node.source.input.from) 4219 } else { 4220 return this.toUrl(this.path(node.source.input.from)) 4221 } 4222 } 4223 4224 toBase64(str) { 4225 if (Buffer) { 4226 return Buffer.from(str).toString('base64') 4227 } else { 4228 return window.btoa(unescape(encodeURIComponent(str))) 4229 } 4230 } 4231 4232 toFileUrl(path) { 4233 let cached = this.memoizedFileURLs.get(path) 4234 if (cached) return cached 4235 4236 if (pathToFileURL) { 4237 let fileURL = pathToFileURL(path).toString() 4238 this.memoizedFileURLs.set(path, fileURL) 4239 4240 return fileURL 4241 } else { 4242 throw new Error( 4243 '`map.absolute` option is not available in this PostCSS build' 4244 ) 4245 } 4246 } 4247 4248 toUrl(path) { 4249 let cached = this.memoizedURLs.get(path) 4250 if (cached) return cached 4251 4252 if (sep === '\\') { 4253 path = path.replace(/\\/g, '/') 4254 } 4255 4256 let url = encodeURI(path).replace(/[#?]/g, encodeURIComponent) 4257 this.memoizedURLs.set(path, url) 4258 4259 return url 4260 } 4261 } 4262 4263 module.exports = MapGenerator 4264 4265 4266 /***/ }), 4267 4268 /***/ 7661: 4269 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 4270 4271 "use strict"; 4272 4273 4274 let MapGenerator = __webpack_require__(1670) 4275 let parse = __webpack_require__(4295) 4276 const Result = __webpack_require__(9055) 4277 let stringify = __webpack_require__(633) 4278 let warnOnce = __webpack_require__(3122) 4279 4280 class NoWorkResult { 4281 constructor(processor, css, opts) { 4282 css = css.toString() 4283 this.stringified = false 4284 4285 this._processor = processor 4286 this._css = css 4287 this._opts = opts 4288 this._map = undefined 4289 let root 4290 4291 let str = stringify 4292 this.result = new Result(this._processor, root, this._opts) 4293 this.result.css = css 4294 4295 let self = this 4296 Object.defineProperty(this.result, 'root', { 4297 get() { 4298 return self.root 4299 } 4300 }) 4301 4302 let map = new MapGenerator(str, root, this._opts, css) 4303 if (map.isMap()) { 4304 let [generatedCSS, generatedMap] = map.generate() 4305 if (generatedCSS) { 4306 this.result.css = generatedCSS 4307 } 4308 if (generatedMap) { 4309 this.result.map = generatedMap 4310 } 4311 } else { 4312 map.clearAnnotation() 4313 this.result.css = map.css 4314 } 4315 } 4316 4317 async() { 4318 if (this.error) return Promise.reject(this.error) 4319 return Promise.resolve(this.result) 4320 } 4321 4322 catch(onRejected) { 4323 return this.async().catch(onRejected) 4324 } 4325 4326 finally(onFinally) { 4327 return this.async().then(onFinally, onFinally) 4328 } 4329 4330 sync() { 4331 if (this.error) throw this.error 4332 return this.result 4333 } 4334 4335 then(onFulfilled, onRejected) { 4336 if (false) {} 4337 4338 return this.async().then(onFulfilled, onRejected) 4339 } 4340 4341 toString() { 4342 return this._css 4343 } 4344 4345 warnings() { 4346 return [] 4347 } 4348 4349 get content() { 4350 return this.result.css 4351 } 4352 4353 get css() { 4354 return this.result.css 4355 } 4356 4357 get map() { 4358 return this.result.map 4359 } 4360 4361 get messages() { 4362 return [] 4363 } 4364 4365 get opts() { 4366 return this.result.opts 4367 } 4368 4369 get processor() { 4370 return this.result.processor 4371 } 4372 4373 get root() { 4374 if (this._root) { 4375 return this._root 4376 } 4377 4378 let root 4379 let parser = parse 4380 4381 try { 4382 root = parser(this._css, this._opts) 4383 } catch (error) { 4384 this.error = error 4385 } 4386 4387 if (this.error) { 4388 throw this.error 4389 } else { 4390 this._root = root 4391 return root 4392 } 4393 } 4394 4395 get [Symbol.toStringTag]() { 4396 return 'NoWorkResult' 4397 } 4398 } 4399 4400 module.exports = NoWorkResult 4401 NoWorkResult.default = NoWorkResult 4402 4403 4404 /***/ }), 4405 4406 /***/ 7490: 4407 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 4408 4409 "use strict"; 4410 4411 4412 let CssSyntaxError = __webpack_require__(356) 4413 let Stringifier = __webpack_require__(346) 4414 let stringify = __webpack_require__(633) 4415 let { isClean, my } = __webpack_require__(1381) 4416 4417 function cloneNode(obj, parent) { 4418 let cloned = new obj.constructor() 4419 4420 for (let i in obj) { 4421 if (!Object.prototype.hasOwnProperty.call(obj, i)) { 4422 /* c8 ignore next 2 */ 4423 continue 4424 } 4425 if (i === 'proxyCache') continue 4426 let value = obj[i] 4427 let type = typeof value 4428 4429 if (i === 'parent' && type === 'object') { 4430 if (parent) cloned[i] = parent 4431 } else if (i === 'source') { 4432 cloned[i] = value 4433 } else if (Array.isArray(value)) { 4434 cloned[i] = value.map(j => cloneNode(j, cloned)) 4435 } else { 4436 if (type === 'object' && value !== null) value = cloneNode(value) 4437 cloned[i] = value 4438 } 4439 } 4440 4441 return cloned 4442 } 4443 4444 class Node { 4445 constructor(defaults = {}) { 4446 this.raws = {} 4447 this[isClean] = false 4448 this[my] = true 4449 4450 for (let name in defaults) { 4451 if (name === 'nodes') { 4452 this.nodes = [] 4453 for (let node of defaults[name]) { 4454 if (typeof node.clone === 'function') { 4455 this.append(node.clone()) 4456 } else { 4457 this.append(node) 4458 } 4459 } 4460 } else { 4461 this[name] = defaults[name] 4462 } 4463 } 4464 } 4465 4466 addToError(error) { 4467 error.postcssNode = this 4468 if (error.stack && this.source && /\n\s{4}at /.test(error.stack)) { 4469 let s = this.source 4470 error.stack = error.stack.replace( 4471 /\n\s{4}at /, 4472 `$&$s.input.from}:$s.start.line}:$s.start.column}$&` 4473 ) 4474 } 4475 return error 4476 } 4477 4478 after(add) { 4479 this.parent.insertAfter(this, add) 4480 return this 4481 } 4482 4483 assign(overrides = {}) { 4484 for (let name in overrides) { 4485 this[name] = overrides[name] 4486 } 4487 return this 4488 } 4489 4490 before(add) { 4491 this.parent.insertBefore(this, add) 4492 return this 4493 } 4494 4495 cleanRaws(keepBetween) { 4496 delete this.raws.before 4497 delete this.raws.after 4498 if (!keepBetween) delete this.raws.between 4499 } 4500 4501 clone(overrides = {}) { 4502 let cloned = cloneNode(this) 4503 for (let name in overrides) { 4504 cloned[name] = overrides[name] 4505 } 4506 return cloned 4507 } 4508 4509 cloneAfter(overrides = {}) { 4510 let cloned = this.clone(overrides) 4511 this.parent.insertAfter(this, cloned) 4512 return cloned 4513 } 4514 4515 cloneBefore(overrides = {}) { 4516 let cloned = this.clone(overrides) 4517 this.parent.insertBefore(this, cloned) 4518 return cloned 4519 } 4520 4521 error(message, opts = {}) { 4522 if (this.source) { 4523 let { end, start } = this.rangeBy(opts) 4524 return this.source.input.error( 4525 message, 4526 { column: start.column, line: start.line }, 4527 { column: end.column, line: end.line }, 4528 opts 4529 ) 4530 } 4531 return new CssSyntaxError(message) 4532 } 4533 4534 getProxyProcessor() { 4535 return { 4536 get(node, prop) { 4537 if (prop === 'proxyOf') { 4538 return node 4539 } else if (prop === 'root') { 4540 return () => node.root().toProxy() 4541 } else { 4542 return node[prop] 4543 } 4544 }, 4545 4546 set(node, prop, value) { 4547 if (node[prop] === value) return true 4548 node[prop] = value 4549 if ( 4550 prop === 'prop' || 4551 prop === 'value' || 4552 prop === 'name' || 4553 prop === 'params' || 4554 prop === 'important' || 4555 /* c8 ignore next */ 4556 prop === 'text' 4557 ) { 4558 node.markDirty() 4559 } 4560 return true 4561 } 4562 } 4563 } 4564 4565 /* c8 ignore next 3 */ 4566 markClean() { 4567 this[isClean] = true 4568 } 4569 4570 markDirty() { 4571 if (this[isClean]) { 4572 this[isClean] = false 4573 let next = this 4574 while ((next = next.parent)) { 4575 next[isClean] = false 4576 } 4577 } 4578 } 4579 4580 next() { 4581 if (!this.parent) return undefined 4582 let index = this.parent.index(this) 4583 return this.parent.nodes[index + 1] 4584 } 4585 4586 positionBy(opts, stringRepresentation) { 4587 let pos = this.source.start 4588 if (opts.index) { 4589 pos = this.positionInside(opts.index, stringRepresentation) 4590 } else if (opts.word) { 4591 stringRepresentation = this.toString() 4592 let index = stringRepresentation.indexOf(opts.word) 4593 if (index !== -1) pos = this.positionInside(index, stringRepresentation) 4594 } 4595 return pos 4596 } 4597 4598 positionInside(index, stringRepresentation) { 4599 let string = stringRepresentation || this.toString() 4600 let column = this.source.start.column 4601 let line = this.source.start.line 4602 4603 for (let i = 0; i < index; i++) { 4604 if (string[i] === '\n') { 4605 column = 1 4606 line += 1 4607 } else { 4608 column += 1 4609 } 4610 } 4611 4612 return { column, line } 4613 } 4614 4615 prev() { 4616 if (!this.parent) return undefined 4617 let index = this.parent.index(this) 4618 return this.parent.nodes[index - 1] 4619 } 4620 4621 rangeBy(opts) { 4622 let start = { 4623 column: this.source.start.column, 4624 line: this.source.start.line 4625 } 4626 let end = this.source.end 4627 ? { 4628 column: this.source.end.column + 1, 4629 line: this.source.end.line 4630 } 4631 : { 4632 column: start.column + 1, 4633 line: start.line 4634 } 4635 4636 if (opts.word) { 4637 let stringRepresentation = this.toString() 4638 let index = stringRepresentation.indexOf(opts.word) 4639 if (index !== -1) { 4640 start = this.positionInside(index, stringRepresentation) 4641 end = this.positionInside( 4642 index + opts.word.length, 4643 stringRepresentation 4644 ) 4645 } 4646 } else { 4647 if (opts.start) { 4648 start = { 4649 column: opts.start.column, 4650 line: opts.start.line 4651 } 4652 } else if (opts.index) { 4653 start = this.positionInside(opts.index) 4654 } 4655 4656 if (opts.end) { 4657 end = { 4658 column: opts.end.column, 4659 line: opts.end.line 4660 } 4661 } else if (typeof opts.endIndex === 'number') { 4662 end = this.positionInside(opts.endIndex) 4663 } else if (opts.index) { 4664 end = this.positionInside(opts.index + 1) 4665 } 4666 } 4667 4668 if ( 4669 end.line < start.line || 4670 (end.line === start.line && end.column <= start.column) 4671 ) { 4672 end = { column: start.column + 1, line: start.line } 4673 } 4674 4675 return { end, start } 4676 } 4677 4678 raw(prop, defaultType) { 4679 let str = new Stringifier() 4680 return str.raw(this, prop, defaultType) 4681 } 4682 4683 remove() { 4684 if (this.parent) { 4685 this.parent.removeChild(this) 4686 } 4687 this.parent = undefined 4688 return this 4689 } 4690 4691 replaceWith(...nodes) { 4692 if (this.parent) { 4693 let bookmark = this 4694 let foundSelf = false 4695 for (let node of nodes) { 4696 if (node === this) { 4697 foundSelf = true 4698 } else if (foundSelf) { 4699 this.parent.insertAfter(bookmark, node) 4700 bookmark = node 4701 } else { 4702 this.parent.insertBefore(bookmark, node) 4703 } 4704 } 4705 4706 if (!foundSelf) { 4707 this.remove() 4708 } 4709 } 4710 4711 return this 4712 } 4713 4714 root() { 4715 let result = this 4716 while (result.parent && result.parent.type !== 'document') { 4717 result = result.parent 4718 } 4719 return result 4720 } 4721 4722 toJSON(_, inputs) { 4723 let fixed = {} 4724 let emitInputs = inputs == null 4725 inputs = inputs || new Map() 4726 let inputsNextIndex = 0 4727 4728 for (let name in this) { 4729 if (!Object.prototype.hasOwnProperty.call(this, name)) { 4730 /* c8 ignore next 2 */ 4731 continue 4732 } 4733 if (name === 'parent' || name === 'proxyCache') continue 4734 let value = this[name] 4735 4736 if (Array.isArray(value)) { 4737 fixed[name] = value.map(i => { 4738 if (typeof i === 'object' && i.toJSON) { 4739 return i.toJSON(null, inputs) 4740 } else { 4741 return i 4742 } 4743 }) 4744 } else if (typeof value === 'object' && value.toJSON) { 4745 fixed[name] = value.toJSON(null, inputs) 4746 } else if (name === 'source') { 4747 let inputId = inputs.get(value.input) 4748 if (inputId == null) { 4749 inputId = inputsNextIndex 4750 inputs.set(value.input, inputsNextIndex) 4751 inputsNextIndex++ 4752 } 4753 fixed[name] = { 4754 end: value.end, 4755 inputId, 4756 start: value.start 4757 } 4758 } else { 4759 fixed[name] = value 4760 } 4761 } 4762 4763 if (emitInputs) { 4764 fixed.inputs = [...inputs.keys()].map(input => input.toJSON()) 4765 } 4766 4767 return fixed 4768 } 4769 4770 toProxy() { 4771 if (!this.proxyCache) { 4772 this.proxyCache = new Proxy(this, this.getProxyProcessor()) 4773 } 4774 return this.proxyCache 4775 } 4776 4777 toString(stringifier = stringify) { 4778 if (stringifier.stringify) stringifier = stringifier.stringify 4779 let result = '' 4780 stringifier(this, i => { 4781 result += i 4782 }) 4783 return result 4784 } 4785 4786 warn(result, text, opts) { 4787 let data = { node: this } 4788 for (let i in opts) data[i] = opts[i] 4789 return result.warn(text, data) 4790 } 4791 4792 get proxyOf() { 4793 return this 4794 } 4795 } 4796 4797 module.exports = Node 4798 Node.default = Node 4799 4800 4801 /***/ }), 4802 4803 /***/ 4295: 4804 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 4805 4806 "use strict"; 4807 4808 4809 let Container = __webpack_require__(683) 4810 let Input = __webpack_require__(5380) 4811 let Parser = __webpack_require__(3937) 4812 4813 function parse(css, opts) { 4814 let input = new Input(css, opts) 4815 let parser = new Parser(input) 4816 try { 4817 parser.parse() 4818 } catch (e) { 4819 if (false) {} 4820 throw e 4821 } 4822 4823 return parser.root 4824 } 4825 4826 module.exports = parse 4827 parse.default = parse 4828 4829 Container.registerParse(parse) 4830 4831 4832 /***/ }), 4833 4834 /***/ 3937: 4835 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 4836 4837 "use strict"; 4838 4839 4840 let AtRule = __webpack_require__(1326) 4841 let Comment = __webpack_require__(6589) 4842 let Declaration = __webpack_require__(1516) 4843 let Root = __webpack_require__(9434) 4844 let Rule = __webpack_require__(4092) 4845 let tokenizer = __webpack_require__(2327) 4846 4847 const SAFE_COMMENT_NEIGHBOR = { 4848 empty: true, 4849 space: true 4850 } 4851 4852 function findLastWithPosition(tokens) { 4853 for (let i = tokens.length - 1; i >= 0; i--) { 4854 let token = tokens[i] 4855 let pos = token[3] || token[2] 4856 if (pos) return pos 4857 } 4858 } 4859 4860 class Parser { 4861 constructor(input) { 4862 this.input = input 4863 4864 this.root = new Root() 4865 this.current = this.root 4866 this.spaces = '' 4867 this.semicolon = false 4868 4869 this.createTokenizer() 4870 this.root.source = { input, start: { column: 1, line: 1, offset: 0 } } 4871 } 4872 4873 atrule(token) { 4874 let node = new AtRule() 4875 node.name = token[1].slice(1) 4876 if (node.name === '') { 4877 this.unnamedAtrule(node, token) 4878 } 4879 this.init(node, token[2]) 4880 4881 let type 4882 let prev 4883 let shift 4884 let last = false 4885 let open = false 4886 let params = [] 4887 let brackets = [] 4888 4889 while (!this.tokenizer.endOfFile()) { 4890 token = this.tokenizer.nextToken() 4891 type = token[0] 4892 4893 if (type === '(' || type === '[') { 4894 brackets.push(type === '(' ? ')' : ']') 4895 } else if (type === '{' && brackets.length > 0) { 4896 brackets.push('}') 4897 } else if (type === brackets[brackets.length - 1]) { 4898 brackets.pop() 4899 } 4900 4901 if (brackets.length === 0) { 4902 if (type === ';') { 4903 node.source.end = this.getPosition(token[2]) 4904 node.source.end.offset++ 4905 this.semicolon = true 4906 break 4907 } else if (type === '{') { 4908 open = true 4909 break 4910 } else if (type === '}') { 4911 if (params.length > 0) { 4912 shift = params.length - 1 4913 prev = params[shift] 4914 while (prev && prev[0] === 'space') { 4915 prev = params[--shift] 4916 } 4917 if (prev) { 4918 node.source.end = this.getPosition(prev[3] || prev[2]) 4919 node.source.end.offset++ 4920 } 4921 } 4922 this.end(token) 4923 break 4924 } else { 4925 params.push(token) 4926 } 4927 } else { 4928 params.push(token) 4929 } 4930 4931 if (this.tokenizer.endOfFile()) { 4932 last = true 4933 break 4934 } 4935 } 4936 4937 node.raws.between = this.spacesAndCommentsFromEnd(params) 4938 if (params.length) { 4939 node.raws.afterName = this.spacesAndCommentsFromStart(params) 4940 this.raw(node, 'params', params) 4941 if (last) { 4942 token = params[params.length - 1] 4943 node.source.end = this.getPosition(token[3] || token[2]) 4944 node.source.end.offset++ 4945 this.spaces = node.raws.between 4946 node.raws.between = '' 4947 } 4948 } else { 4949 node.raws.afterName = '' 4950 node.params = '' 4951 } 4952 4953 if (open) { 4954 node.nodes = [] 4955 this.current = node 4956 } 4957 } 4958 4959 checkMissedSemicolon(tokens) { 4960 let colon = this.colon(tokens) 4961 if (colon === false) return 4962 4963 let founded = 0 4964 let token 4965 for (let j = colon - 1; j >= 0; j--) { 4966 token = tokens[j] 4967 if (token[0] !== 'space') { 4968 founded += 1 4969 if (founded === 2) break 4970 } 4971 } 4972 // If the token is a word, e.g. `!important`, `red` or any other valid property's value. 4973 // Then we need to return the colon after that word token. [3] is the "end" colon of that word. 4974 // And because we need it after that one we do +1 to get the next one. 4975 throw this.input.error( 4976 'Missed semicolon', 4977 token[0] === 'word' ? token[3] + 1 : token[2] 4978 ) 4979 } 4980 4981 colon(tokens) { 4982 let brackets = 0 4983 let prev, token, type 4984 for (let [i, element] of tokens.entries()) { 4985 token = element 4986 type = token[0] 4987 4988 if (type === '(') { 4989 brackets += 1 4990 } 4991 if (type === ')') { 4992 brackets -= 1 4993 } 4994 if (brackets === 0 && type === ':') { 4995 if (!prev) { 4996 this.doubleColon(token) 4997 } else if (prev[0] === 'word' && prev[1] === 'progid') { 4998 continue 4999 } else { 5000 return i 5001 } 5002 } 5003 5004 prev = token 5005 } 5006 return false 5007 } 5008 5009 comment(token) { 5010 let node = new Comment() 5011 this.init(node, token[2]) 5012 node.source.end = this.getPosition(token[3] || token[2]) 5013 node.source.end.offset++ 5014 5015 let text = token[1].slice(2, -2) 5016 if (/^\s*$/.test(text)) { 5017 node.text = '' 5018 node.raws.left = text 5019 node.raws.right = '' 5020 } else { 5021 let match = text.match(/^(\s*)([^]*\S)(\s*)$/) 5022 node.text = match[2] 5023 node.raws.left = match[1] 5024 node.raws.right = match[3] 5025 } 5026 } 5027 5028 createTokenizer() { 5029 this.tokenizer = tokenizer(this.input) 5030 } 5031 5032 decl(tokens, customProperty) { 5033 let node = new Declaration() 5034 this.init(node, tokens[0][2]) 5035 5036 let last = tokens[tokens.length - 1] 5037 if (last[0] === ';') { 5038 this.semicolon = true 5039 tokens.pop() 5040 } 5041 5042 node.source.end = this.getPosition( 5043 last[3] || last[2] || findLastWithPosition(tokens) 5044 ) 5045 node.source.end.offset++ 5046 5047 while (tokens[0][0] !== 'word') { 5048 if (tokens.length === 1) this.unknownWord(tokens) 5049 node.raws.before += tokens.shift()[1] 5050 } 5051 node.source.start = this.getPosition(tokens[0][2]) 5052 5053 node.prop = '' 5054 while (tokens.length) { 5055 let type = tokens[0][0] 5056 if (type === ':' || type === 'space' || type === 'comment') { 5057 break 5058 } 5059 node.prop += tokens.shift()[1] 5060 } 5061 5062 node.raws.between = '' 5063 5064 let token 5065 while (tokens.length) { 5066 token = tokens.shift() 5067 5068 if (token[0] === ':') { 5069 node.raws.between += token[1] 5070 break 5071 } else { 5072 if (token[0] === 'word' && /\w/.test(token[1])) { 5073 this.unknownWord([token]) 5074 } 5075 node.raws.between += token[1] 5076 } 5077 } 5078 5079 if (node.prop[0] === '_' || node.prop[0] === '*') { 5080 node.raws.before += node.prop[0] 5081 node.prop = node.prop.slice(1) 5082 } 5083 5084 let firstSpaces = [] 5085 let next 5086 while (tokens.length) { 5087 next = tokens[0][0] 5088 if (next !== 'space' && next !== 'comment') break 5089 firstSpaces.push(tokens.shift()) 5090 } 5091 5092 this.precheckMissedSemicolon(tokens) 5093 5094 for (let i = tokens.length - 1; i >= 0; i--) { 5095 token = tokens[i] 5096 if (token[1].toLowerCase() === '!important') { 5097 node.important = true 5098 let string = this.stringFrom(tokens, i) 5099 string = this.spacesFromEnd(tokens) + string 5100 if (string !== ' !important') node.raws.important = string 5101 break 5102 } else if (token[1].toLowerCase() === 'important') { 5103 let cache = tokens.slice(0) 5104 let str = '' 5105 for (let j = i; j > 0; j--) { 5106 let type = cache[j][0] 5107 if (str.trim().startsWith('!') && type !== 'space') { 5108 break 5109 } 5110 str = cache.pop()[1] + str 5111 } 5112 if (str.trim().startsWith('!')) { 5113 node.important = true 5114 node.raws.important = str 5115 tokens = cache 5116 } 5117 } 5118 5119 if (token[0] !== 'space' && token[0] !== 'comment') { 5120 break 5121 } 5122 } 5123 5124 let hasWord = tokens.some(i => i[0] !== 'space' && i[0] !== 'comment') 5125 5126 if (hasWord) { 5127 node.raws.between += firstSpaces.map(i => i[1]).join('') 5128 firstSpaces = [] 5129 } 5130 this.raw(node, 'value', firstSpaces.concat(tokens), customProperty) 5131 5132 if (node.value.includes(':') && !customProperty) { 5133 this.checkMissedSemicolon(tokens) 5134 } 5135 } 5136 5137 doubleColon(token) { 5138 throw this.input.error( 5139 'Double colon', 5140 { offset: token[2] }, 5141 { offset: token[2] + token[1].length } 5142 ) 5143 } 5144 5145 emptyRule(token) { 5146 let node = new Rule() 5147 this.init(node, token[2]) 5148 node.selector = '' 5149 node.raws.between = '' 5150 this.current = node 5151 } 5152 5153 end(token) { 5154 if (this.current.nodes && this.current.nodes.length) { 5155 this.current.raws.semicolon = this.semicolon 5156 } 5157 this.semicolon = false 5158 5159 this.current.raws.after = (this.current.raws.after || '') + this.spaces 5160 this.spaces = '' 5161 5162 if (this.current.parent) { 5163 this.current.source.end = this.getPosition(token[2]) 5164 this.current.source.end.offset++ 5165 this.current = this.current.parent 5166 } else { 5167 this.unexpectedClose(token) 5168 } 5169 } 5170 5171 endFile() { 5172 if (this.current.parent) this.unclosedBlock() 5173 if (this.current.nodes && this.current.nodes.length) { 5174 this.current.raws.semicolon = this.semicolon 5175 } 5176 this.current.raws.after = (this.current.raws.after || '') + this.spaces 5177 this.root.source.end = this.getPosition(this.tokenizer.position()) 5178 } 5179 5180 freeSemicolon(token) { 5181 this.spaces += token[1] 5182 if (this.current.nodes) { 5183 let prev = this.current.nodes[this.current.nodes.length - 1] 5184 if (prev && prev.type === 'rule' && !prev.raws.ownSemicolon) { 5185 prev.raws.ownSemicolon = this.spaces 5186 this.spaces = '' 5187 } 5188 } 5189 } 5190 5191 // Helpers 5192 5193 getPosition(offset) { 5194 let pos = this.input.fromOffset(offset) 5195 return { 5196 column: pos.col, 5197 line: pos.line, 5198 offset 5199 } 5200 } 5201 5202 init(node, offset) { 5203 this.current.push(node) 5204 node.source = { 5205 input: this.input, 5206 start: this.getPosition(offset) 5207 } 5208 node.raws.before = this.spaces 5209 this.spaces = '' 5210 if (node.type !== 'comment') this.semicolon = false 5211 } 5212 5213 other(start) { 5214 let end = false 5215 let type = null 5216 let colon = false 5217 let bracket = null 5218 let brackets = [] 5219 let customProperty = start[1].startsWith('--') 5220 5221 let tokens = [] 5222 let token = start 5223 while (token) { 5224 type = token[0] 5225 tokens.push(token) 5226 5227 if (type === '(' || type === '[') { 5228 if (!bracket) bracket = token 5229 brackets.push(type === '(' ? ')' : ']') 5230 } else if (customProperty && colon && type === '{') { 5231 if (!bracket) bracket = token 5232 brackets.push('}') 5233 } else if (brackets.length === 0) { 5234 if (type === ';') { 5235 if (colon) { 5236 this.decl(tokens, customProperty) 5237 return 5238 } else { 5239 break 5240 } 5241 } else if (type === '{') { 5242 this.rule(tokens) 5243 return 5244 } else if (type === '}') { 5245 this.tokenizer.back(tokens.pop()) 5246 end = true 5247 break 5248 } else if (type === ':') { 5249 colon = true 5250 } 5251 } else if (type === brackets[brackets.length - 1]) { 5252 brackets.pop() 5253 if (brackets.length === 0) bracket = null 5254 } 5255 5256 token = this.tokenizer.nextToken() 5257 } 5258 5259 if (this.tokenizer.endOfFile()) end = true 5260 if (brackets.length > 0) this.unclosedBracket(bracket) 5261 5262 if (end && colon) { 5263 if (!customProperty) { 5264 while (tokens.length) { 5265 token = tokens[tokens.length - 1][0] 5266 if (token !== 'space' && token !== 'comment') break 5267 this.tokenizer.back(tokens.pop()) 5268 } 5269 } 5270 this.decl(tokens, customProperty) 5271 } else { 5272 this.unknownWord(tokens) 5273 } 5274 } 5275 5276 parse() { 5277 let token 5278 while (!this.tokenizer.endOfFile()) { 5279 token = this.tokenizer.nextToken() 5280 5281 switch (token[0]) { 5282 case 'space': 5283 this.spaces += token[1] 5284 break 5285 5286 case ';': 5287 this.freeSemicolon(token) 5288 break 5289 5290 case '}': 5291 this.end(token) 5292 break 5293 5294 case 'comment': 5295 this.comment(token) 5296 break 5297 5298 case 'at-word': 5299 this.atrule(token) 5300 break 5301 5302 case '{': 5303 this.emptyRule(token) 5304 break 5305 5306 default: 5307 this.other(token) 5308 break 5309 } 5310 } 5311 this.endFile() 5312 } 5313 5314 precheckMissedSemicolon(/* tokens */) { 5315 // Hook for Safe Parser 5316 } 5317 5318 raw(node, prop, tokens, customProperty) { 5319 let token, type 5320 let length = tokens.length 5321 let value = '' 5322 let clean = true 5323 let next, prev 5324 5325 for (let i = 0; i < length; i += 1) { 5326 token = tokens[i] 5327 type = token[0] 5328 if (type === 'space' && i === length - 1 && !customProperty) { 5329 clean = false 5330 } else if (type === 'comment') { 5331 prev = tokens[i - 1] ? tokens[i - 1][0] : 'empty' 5332 next = tokens[i + 1] ? tokens[i + 1][0] : 'empty' 5333 if (!SAFE_COMMENT_NEIGHBOR[prev] && !SAFE_COMMENT_NEIGHBOR[next]) { 5334 if (value.slice(-1) === ',') { 5335 clean = false 5336 } else { 5337 value += token[1] 5338 } 5339 } else { 5340 clean = false 5341 } 5342 } else { 5343 value += token[1] 5344 } 5345 } 5346 if (!clean) { 5347 let raw = tokens.reduce((all, i) => all + i[1], '') 5348 node.raws[prop] = { raw, value } 5349 } 5350 node[prop] = value 5351 } 5352 5353 rule(tokens) { 5354 tokens.pop() 5355 5356 let node = new Rule() 5357 this.init(node, tokens[0][2]) 5358 5359 node.raws.between = this.spacesAndCommentsFromEnd(tokens) 5360 this.raw(node, 'selector', tokens) 5361 this.current = node 5362 } 5363 5364 spacesAndCommentsFromEnd(tokens) { 5365 let lastTokenType 5366 let spaces = '' 5367 while (tokens.length) { 5368 lastTokenType = tokens[tokens.length - 1][0] 5369 if (lastTokenType !== 'space' && lastTokenType !== 'comment') break 5370 spaces = tokens.pop()[1] + spaces 5371 } 5372 return spaces 5373 } 5374 5375 // Errors 5376 5377 spacesAndCommentsFromStart(tokens) { 5378 let next 5379 let spaces = '' 5380 while (tokens.length) { 5381 next = tokens[0][0] 5382 if (next !== 'space' && next !== 'comment') break 5383 spaces += tokens.shift()[1] 5384 } 5385 return spaces 5386 } 5387 5388 spacesFromEnd(tokens) { 5389 let lastTokenType 5390 let spaces = '' 5391 while (tokens.length) { 5392 lastTokenType = tokens[tokens.length - 1][0] 5393 if (lastTokenType !== 'space') break 5394 spaces = tokens.pop()[1] + spaces 5395 } 5396 return spaces 5397 } 5398 5399 stringFrom(tokens, from) { 5400 let result = '' 5401 for (let i = from; i < tokens.length; i++) { 5402 result += tokens[i][1] 5403 } 5404 tokens.splice(from, tokens.length - from) 5405 return result 5406 } 5407 5408 unclosedBlock() { 5409 let pos = this.current.source.start 5410 throw this.input.error('Unclosed block', pos.line, pos.column) 5411 } 5412 5413 unclosedBracket(bracket) { 5414 throw this.input.error( 5415 'Unclosed bracket', 5416 { offset: bracket[2] }, 5417 { offset: bracket[2] + 1 } 5418 ) 5419 } 5420 5421 unexpectedClose(token) { 5422 throw this.input.error( 5423 'Unexpected }', 5424 { offset: token[2] }, 5425 { offset: token[2] + 1 } 5426 ) 5427 } 5428 5429 unknownWord(tokens) { 5430 throw this.input.error( 5431 'Unknown word', 5432 { offset: tokens[0][2] }, 5433 { offset: tokens[0][2] + tokens[0][1].length } 5434 ) 5435 } 5436 5437 unnamedAtrule(node, token) { 5438 throw this.input.error( 5439 'At-rule without name', 5440 { offset: token[2] }, 5441 { offset: token[2] + token[1].length } 5442 ) 5443 } 5444 } 5445 5446 module.exports = Parser 5447 5448 5449 /***/ }), 5450 5451 /***/ 4529: 5452 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 5453 5454 "use strict"; 5455 5456 5457 let AtRule = __webpack_require__(1326) 5458 let Comment = __webpack_require__(6589) 5459 let Container = __webpack_require__(683) 5460 let CssSyntaxError = __webpack_require__(356) 5461 let Declaration = __webpack_require__(1516) 5462 let Document = __webpack_require__(271) 5463 let fromJSON = __webpack_require__(8940) 5464 let Input = __webpack_require__(5380) 5465 let LazyResult = __webpack_require__(448) 5466 let list = __webpack_require__(7374) 5467 let Node = __webpack_require__(7490) 5468 let parse = __webpack_require__(4295) 5469 let Processor = __webpack_require__(9656) 5470 let Result = __webpack_require__(9055) 5471 let Root = __webpack_require__(9434) 5472 let Rule = __webpack_require__(4092) 5473 let stringify = __webpack_require__(633) 5474 let Warning = __webpack_require__(5776) 5475 5476 function postcss(...plugins) { 5477 if (plugins.length === 1 && Array.isArray(plugins[0])) { 5478 plugins = plugins[0] 5479 } 5480 return new Processor(plugins) 5481 } 5482 5483 postcss.plugin = function plugin(name, initializer) { 5484 let warningPrinted = false 5485 function creator(...args) { 5486 // eslint-disable-next-line no-console 5487 if (console && console.warn && !warningPrinted) { 5488 warningPrinted = true 5489 // eslint-disable-next-line no-console 5490 console.warn( 5491 name + 5492 ': postcss.plugin was deprecated. Migration guide:\n' + 5493 'https://evilmartians.com/chronicles/postcss-8-plugin-migration' 5494 ) 5495 if (process.env.LANG && process.env.LANG.startsWith('cn')) { 5496 /* c8 ignore next 7 */ 5497 // eslint-disable-next-line no-console 5498 console.warn( 5499 name + 5500 ': 里面 postcss.plugin 被弃用. 迁移指南:\n' + 5501 'https://www.w3ctech.com/topic/2226' 5502 ) 5503 } 5504 } 5505 let transformer = initializer(...args) 5506 transformer.postcssPlugin = name 5507 transformer.postcssVersion = new Processor().version 5508 return transformer 5509 } 5510 5511 let cache 5512 Object.defineProperty(creator, 'postcss', { 5513 get() { 5514 if (!cache) cache = creator() 5515 return cache 5516 } 5517 }) 5518 5519 creator.process = function (css, processOpts, pluginOpts) { 5520 return postcss([creator(pluginOpts)]).process(css, processOpts) 5521 } 5522 5523 return creator 5524 } 5525 5526 postcss.stringify = stringify 5527 postcss.parse = parse 5528 postcss.fromJSON = fromJSON 5529 postcss.list = list 5530 5531 postcss.comment = defaults => new Comment(defaults) 5532 postcss.atRule = defaults => new AtRule(defaults) 5533 postcss.decl = defaults => new Declaration(defaults) 5534 postcss.rule = defaults => new Rule(defaults) 5535 postcss.root = defaults => new Root(defaults) 5536 postcss.document = defaults => new Document(defaults) 5537 5538 postcss.CssSyntaxError = CssSyntaxError 5539 postcss.Declaration = Declaration 5540 postcss.Container = Container 5541 postcss.Processor = Processor 5542 postcss.Document = Document 5543 postcss.Comment = Comment 5544 postcss.Warning = Warning 5545 postcss.AtRule = AtRule 5546 postcss.Result = Result 5547 postcss.Input = Input 5548 postcss.Rule = Rule 5549 postcss.Root = Root 5550 postcss.Node = Node 5551 5552 LazyResult.registerPostcss(postcss) 5553 5554 module.exports = postcss 5555 postcss.default = postcss 5556 5557 5558 /***/ }), 5559 5560 /***/ 5696: 5561 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 5562 5563 "use strict"; 5564 5565 5566 let { existsSync, readFileSync } = __webpack_require__(9977) 5567 let { dirname, join } = __webpack_require__(197) 5568 let { SourceMapConsumer, SourceMapGenerator } = __webpack_require__(1866) 5569 5570 function fromBase64(str) { 5571 if (Buffer) { 5572 return Buffer.from(str, 'base64').toString() 5573 } else { 5574 /* c8 ignore next 2 */ 5575 return window.atob(str) 5576 } 5577 } 5578 5579 class PreviousMap { 5580 constructor(css, opts) { 5581 if (opts.map === false) return 5582 this.loadAnnotation(css) 5583 this.inline = this.startWith(this.annotation, 'data:') 5584 5585 let prev = opts.map ? opts.map.prev : undefined 5586 let text = this.loadMap(opts.from, prev) 5587 if (!this.mapFile && opts.from) { 5588 this.mapFile = opts.from 5589 } 5590 if (this.mapFile) this.root = dirname(this.mapFile) 5591 if (text) this.text = text 5592 } 5593 5594 consumer() { 5595 if (!this.consumerCache) { 5596 this.consumerCache = new SourceMapConsumer(this.text) 5597 } 5598 return this.consumerCache 5599 } 5600 5601 decodeInline(text) { 5602 let baseCharsetUri = /^data:application\/json;charset=utf-?8;base64,/ 5603 let baseUri = /^data:application\/json;base64,/ 5604 let charsetUri = /^data:application\/json;charset=utf-?8,/ 5605 let uri = /^data:application\/json,/ 5606 5607 let uriMatch = text.match(charsetUri) || text.match(uri) 5608 if (uriMatch) { 5609 return decodeURIComponent(text.substr(uriMatch[0].length)) 5610 } 5611 5612 let baseUriMatch = text.match(baseCharsetUri) || text.match(baseUri) 5613 if (baseUriMatch) { 5614 return fromBase64(text.substr(baseUriMatch[0].length)) 5615 } 5616 5617 let encoding = text.match(/data:application\/json;([^,]+),/)[1] 5618 throw new Error('Unsupported source map encoding ' + encoding) 5619 } 5620 5621 getAnnotationURL(sourceMapString) { 5622 return sourceMapString.replace(/^\/\*\s*# sourceMappingURL=/, '').trim() 5623 } 5624 5625 isMap(map) { 5626 if (typeof map !== 'object') return false 5627 return ( 5628 typeof map.mappings === 'string' || 5629 typeof map._mappings === 'string' || 5630 Array.isArray(map.sections) 5631 ) 5632 } 5633 5634 loadAnnotation(css) { 5635 let comments = css.match(/\/\*\s*# sourceMappingURL=/g) 5636 if (!comments) return 5637 5638 // sourceMappingURLs from comments, strings, etc. 5639 let start = css.lastIndexOf(comments.pop()) 5640 let end = css.indexOf('*/', start) 5641 5642 if (start > -1 && end > -1) { 5643 // Locate the last sourceMappingURL to avoid pickin 5644 this.annotation = this.getAnnotationURL(css.substring(start, end)) 5645 } 5646 } 5647 5648 loadFile(path) { 5649 this.root = dirname(path) 5650 if (existsSync(path)) { 5651 this.mapFile = path 5652 return readFileSync(path, 'utf-8').toString().trim() 5653 } 5654 } 5655 5656 loadMap(file, prev) { 5657 if (prev === false) return false 5658 5659 if (prev) { 5660 if (typeof prev === 'string') { 5661 return prev 5662 } else if (typeof prev === 'function') { 5663 let prevPath = prev(file) 5664 if (prevPath) { 5665 let map = this.loadFile(prevPath) 5666 if (!map) { 5667 throw new Error( 5668 'Unable to load previous source map: ' + prevPath.toString() 5669 ) 5670 } 5671 return map 5672 } 5673 } else if (prev instanceof SourceMapConsumer) { 5674 return SourceMapGenerator.fromSourceMap(prev).toString() 5675 } else if (prev instanceof SourceMapGenerator) { 5676 return prev.toString() 5677 } else if (this.isMap(prev)) { 5678 return JSON.stringify(prev) 5679 } else { 5680 throw new Error( 5681 'Unsupported previous source map format: ' + prev.toString() 5682 ) 5683 } 5684 } else if (this.inline) { 5685 return this.decodeInline(this.annotation) 5686 } else if (this.annotation) { 5687 let map = this.annotation 5688 if (file) map = join(dirname(file), map) 5689 return this.loadFile(map) 5690 } 5691 } 5692 5693 startWith(string, start) { 5694 if (!string) return false 5695 return string.substr(0, start.length) === start 5696 } 5697 5698 withContent() { 5699 return !!( 5700 this.consumer().sourcesContent && 5701 this.consumer().sourcesContent.length > 0 5702 ) 5703 } 5704 } 5705 5706 module.exports = PreviousMap 5707 PreviousMap.default = PreviousMap 5708 5709 5710 /***/ }), 5711 5712 /***/ 9656: 5713 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 5714 5715 "use strict"; 5716 5717 5718 let Document = __webpack_require__(271) 5719 let LazyResult = __webpack_require__(448) 5720 let NoWorkResult = __webpack_require__(7661) 5721 let Root = __webpack_require__(9434) 5722 5723 class Processor { 5724 constructor(plugins = []) { 5725 this.version = '8.4.47' 5726 this.plugins = this.normalize(plugins) 5727 } 5728 5729 normalize(plugins) { 5730 let normalized = [] 5731 for (let i of plugins) { 5732 if (i.postcss === true) { 5733 i = i() 5734 } else if (i.postcss) { 5735 i = i.postcss 5736 } 5737 5738 if (typeof i === 'object' && Array.isArray(i.plugins)) { 5739 normalized = normalized.concat(i.plugins) 5740 } else if (typeof i === 'object' && i.postcssPlugin) { 5741 normalized.push(i) 5742 } else if (typeof i === 'function') { 5743 normalized.push(i) 5744 } else if (typeof i === 'object' && (i.parse || i.stringify)) { 5745 if (false) {} 5746 } else { 5747 throw new Error(i + ' is not a PostCSS plugin') 5748 } 5749 } 5750 return normalized 5751 } 5752 5753 process(css, opts = {}) { 5754 if ( 5755 !this.plugins.length && 5756 !opts.parser && 5757 !opts.stringifier && 5758 !opts.syntax 5759 ) { 5760 return new NoWorkResult(this, css, opts) 5761 } else { 5762 return new LazyResult(this, css, opts) 5763 } 5764 } 5765 5766 use(plugin) { 5767 this.plugins = this.plugins.concat(this.normalize([plugin])) 5768 return this 5769 } 5770 } 5771 5772 module.exports = Processor 5773 Processor.default = Processor 5774 5775 Root.registerProcessor(Processor) 5776 Document.registerProcessor(Processor) 5777 5778 5779 /***/ }), 5780 5781 /***/ 9055: 5782 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 5783 5784 "use strict"; 5785 5786 5787 let Warning = __webpack_require__(5776) 5788 5789 class Result { 5790 constructor(processor, root, opts) { 5791 this.processor = processor 5792 this.messages = [] 5793 this.root = root 5794 this.opts = opts 5795 this.css = undefined 5796 this.map = undefined 5797 } 5798 5799 toString() { 5800 return this.css 5801 } 5802 5803 warn(text, opts = {}) { 5804 if (!opts.plugin) { 5805 if (this.lastPlugin && this.lastPlugin.postcssPlugin) { 5806 opts.plugin = this.lastPlugin.postcssPlugin 5807 } 5808 } 5809 5810 let warning = new Warning(text, opts) 5811 this.messages.push(warning) 5812 5813 return warning 5814 } 5815 5816 warnings() { 5817 return this.messages.filter(i => i.type === 'warning') 5818 } 5819 5820 get content() { 5821 return this.css 5822 } 5823 } 5824 5825 module.exports = Result 5826 Result.default = Result 5827 5828 5829 /***/ }), 5830 5831 /***/ 9434: 5832 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 5833 5834 "use strict"; 5835 5836 5837 let Container = __webpack_require__(683) 5838 5839 let LazyResult, Processor 5840 5841 class Root extends Container { 5842 constructor(defaults) { 5843 super(defaults) 5844 this.type = 'root' 5845 if (!this.nodes) this.nodes = [] 5846 } 5847 5848 normalize(child, sample, type) { 5849 let nodes = super.normalize(child) 5850 5851 if (sample) { 5852 if (type === 'prepend') { 5853 if (this.nodes.length > 1) { 5854 sample.raws.before = this.nodes[1].raws.before 5855 } else { 5856 delete sample.raws.before 5857 } 5858 } else if (this.first !== sample) { 5859 for (let node of nodes) { 5860 node.raws.before = sample.raws.before 5861 } 5862 } 5863 } 5864 5865 return nodes 5866 } 5867 5868 removeChild(child, ignore) { 5869 let index = this.index(child) 5870 5871 if (!ignore && index === 0 && this.nodes.length > 1) { 5872 this.nodes[1].raws.before = this.nodes[index].raws.before 5873 } 5874 5875 return super.removeChild(child) 5876 } 5877 5878 toResult(opts = {}) { 5879 let lazy = new LazyResult(new Processor(), this, opts) 5880 return lazy.stringify() 5881 } 5882 } 5883 5884 Root.registerLazyResult = dependant => { 5885 LazyResult = dependant 5886 } 5887 5888 Root.registerProcessor = dependant => { 5889 Processor = dependant 5890 } 5891 5892 module.exports = Root 5893 Root.default = Root 5894 5895 Container.registerRoot(Root) 5896 5897 5898 /***/ }), 5899 5900 /***/ 4092: 5901 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 5902 5903 "use strict"; 5904 5905 5906 let Container = __webpack_require__(683) 5907 let list = __webpack_require__(7374) 5908 5909 class Rule extends Container { 5910 constructor(defaults) { 5911 super(defaults) 5912 this.type = 'rule' 5913 if (!this.nodes) this.nodes = [] 5914 } 5915 5916 get selectors() { 5917 return list.comma(this.selector) 5918 } 5919 5920 set selectors(values) { 5921 let match = this.selector ? this.selector.match(/,\s*/) : null 5922 let sep = match ? match[0] : ',' + this.raw('between', 'beforeOpen') 5923 this.selector = values.join(sep) 5924 } 5925 } 5926 5927 module.exports = Rule 5928 Rule.default = Rule 5929 5930 Container.registerRule(Rule) 5931 5932 5933 /***/ }), 5934 5935 /***/ 346: 5936 /***/ ((module) => { 5937 5938 "use strict"; 5939 5940 5941 const DEFAULT_RAW = { 5942 after: '\n', 5943 beforeClose: '\n', 5944 beforeComment: '\n', 5945 beforeDecl: '\n', 5946 beforeOpen: ' ', 5947 beforeRule: '\n', 5948 colon: ': ', 5949 commentLeft: ' ', 5950 commentRight: ' ', 5951 emptyBody: '', 5952 indent: ' ', 5953 semicolon: false 5954 } 5955 5956 function capitalize(str) { 5957 return str[0].toUpperCase() + str.slice(1) 5958 } 5959 5960 class Stringifier { 5961 constructor(builder) { 5962 this.builder = builder 5963 } 5964 5965 atrule(node, semicolon) { 5966 let name = '@' + node.name 5967 let params = node.params ? this.rawValue(node, 'params') : '' 5968 5969 if (typeof node.raws.afterName !== 'undefined') { 5970 name += node.raws.afterName 5971 } else if (params) { 5972 name += ' ' 5973 } 5974 5975 if (node.nodes) { 5976 this.block(node, name + params) 5977 } else { 5978 let end = (node.raws.between || '') + (semicolon ? ';' : '') 5979 this.builder(name + params + end, node) 5980 } 5981 } 5982 5983 beforeAfter(node, detect) { 5984 let value 5985 if (node.type === 'decl') { 5986 value = this.raw(node, null, 'beforeDecl') 5987 } else if (node.type === 'comment') { 5988 value = this.raw(node, null, 'beforeComment') 5989 } else if (detect === 'before') { 5990 value = this.raw(node, null, 'beforeRule') 5991 } else { 5992 value = this.raw(node, null, 'beforeClose') 5993 } 5994 5995 let buf = node.parent 5996 let depth = 0 5997 while (buf && buf.type !== 'root') { 5998 depth += 1 5999 buf = buf.parent 6000 } 6001 6002 if (value.includes('\n')) { 6003 let indent = this.raw(node, null, 'indent') 6004 if (indent.length) { 6005 for (let step = 0; step < depth; step++) value += indent 6006 } 6007 } 6008 6009 return value 6010 } 6011 6012 block(node, start) { 6013 let between = this.raw(node, 'between', 'beforeOpen') 6014 this.builder(start + between + '{', node, 'start') 6015 6016 let after 6017 if (node.nodes && node.nodes.length) { 6018 this.body(node) 6019 after = this.raw(node, 'after') 6020 } else { 6021 after = this.raw(node, 'after', 'emptyBody') 6022 } 6023 6024 if (after) this.builder(after) 6025 this.builder('}', node, 'end') 6026 } 6027 6028 body(node) { 6029 let last = node.nodes.length - 1 6030 while (last > 0) { 6031 if (node.nodes[last].type !== 'comment') break 6032 last -= 1 6033 } 6034 6035 let semicolon = this.raw(node, 'semicolon') 6036 for (let i = 0; i < node.nodes.length; i++) { 6037 let child = node.nodes[i] 6038 let before = this.raw(child, 'before') 6039 if (before) this.builder(before) 6040 this.stringify(child, last !== i || semicolon) 6041 } 6042 } 6043 6044 comment(node) { 6045 let left = this.raw(node, 'left', 'commentLeft') 6046 let right = this.raw(node, 'right', 'commentRight') 6047 this.builder('/*' + left + node.text + right + '*/', node) 6048 } 6049 6050 decl(node, semicolon) { 6051 let between = this.raw(node, 'between', 'colon') 6052 let string = node.prop + between + this.rawValue(node, 'value') 6053 6054 if (node.important) { 6055 string += node.raws.important || ' !important' 6056 } 6057 6058 if (semicolon) string += ';' 6059 this.builder(string, node) 6060 } 6061 6062 document(node) { 6063 this.body(node) 6064 } 6065 6066 raw(node, own, detect) { 6067 let value 6068 if (!detect) detect = own 6069 6070 // Already had 6071 if (own) { 6072 value = node.raws[own] 6073 if (typeof value !== 'undefined') return value 6074 } 6075 6076 let parent = node.parent 6077 6078 if (detect === 'before') { 6079 // Hack for first rule in CSS 6080 if (!parent || (parent.type === 'root' && parent.first === node)) { 6081 return '' 6082 } 6083 6084 // `root` nodes in `document` should use only their own raws 6085 if (parent && parent.type === 'document') { 6086 return '' 6087 } 6088 } 6089 6090 // Floating child without parent 6091 if (!parent) return DEFAULT_RAW[detect] 6092 6093 // Detect style by other nodes 6094 let root = node.root() 6095 if (!root.rawCache) root.rawCache = {} 6096 if (typeof root.rawCache[detect] !== 'undefined') { 6097 return root.rawCache[detect] 6098 } 6099 6100 if (detect === 'before' || detect === 'after') { 6101 return this.beforeAfter(node, detect) 6102 } else { 6103 let method = 'raw' + capitalize(detect) 6104 if (this[method]) { 6105 value = this[method](root, node) 6106 } else { 6107 root.walk(i => { 6108 value = i.raws[own] 6109 if (typeof value !== 'undefined') return false 6110 }) 6111 } 6112 } 6113 6114 if (typeof value === 'undefined') value = DEFAULT_RAW[detect] 6115 6116 root.rawCache[detect] = value 6117 return value 6118 } 6119 6120 rawBeforeClose(root) { 6121 let value 6122 root.walk(i => { 6123 if (i.nodes && i.nodes.length > 0) { 6124 if (typeof i.raws.after !== 'undefined') { 6125 value = i.raws.after 6126 if (value.includes('\n')) { 6127 value = value.replace(/[^\n]+$/, '') 6128 } 6129 return false 6130 } 6131 } 6132 }) 6133 if (value) value = value.replace(/\S/g, '') 6134 return value 6135 } 6136 6137 rawBeforeComment(root, node) { 6138 let value 6139 root.walkComments(i => { 6140 if (typeof i.raws.before !== 'undefined') { 6141 value = i.raws.before 6142 if (value.includes('\n')) { 6143 value = value.replace(/[^\n]+$/, '') 6144 } 6145 return false 6146 } 6147 }) 6148 if (typeof value === 'undefined') { 6149 value = this.raw(node, null, 'beforeDecl') 6150 } else if (value) { 6151 value = value.replace(/\S/g, '') 6152 } 6153 return value 6154 } 6155 6156 rawBeforeDecl(root, node) { 6157 let value 6158 root.walkDecls(i => { 6159 if (typeof i.raws.before !== 'undefined') { 6160 value = i.raws.before 6161 if (value.includes('\n')) { 6162 value = value.replace(/[^\n]+$/, '') 6163 } 6164 return false 6165 } 6166 }) 6167 if (typeof value === 'undefined') { 6168 value = this.raw(node, null, 'beforeRule') 6169 } else if (value) { 6170 value = value.replace(/\S/g, '') 6171 } 6172 return value 6173 } 6174 6175 rawBeforeOpen(root) { 6176 let value 6177 root.walk(i => { 6178 if (i.type !== 'decl') { 6179 value = i.raws.between 6180 if (typeof value !== 'undefined') return false 6181 } 6182 }) 6183 return value 6184 } 6185 6186 rawBeforeRule(root) { 6187 let value 6188 root.walk(i => { 6189 if (i.nodes && (i.parent !== root || root.first !== i)) { 6190 if (typeof i.raws.before !== 'undefined') { 6191 value = i.raws.before 6192 if (value.includes('\n')) { 6193 value = value.replace(/[^\n]+$/, '') 6194 } 6195 return false 6196 } 6197 } 6198 }) 6199 if (value) value = value.replace(/\S/g, '') 6200 return value 6201 } 6202 6203 rawColon(root) { 6204 let value 6205 root.walkDecls(i => { 6206 if (typeof i.raws.between !== 'undefined') { 6207 value = i.raws.between.replace(/[^\s:]/g, '') 6208 return false 6209 } 6210 }) 6211 return value 6212 } 6213 6214 rawEmptyBody(root) { 6215 let value 6216 root.walk(i => { 6217 if (i.nodes && i.nodes.length === 0) { 6218 value = i.raws.after 6219 if (typeof value !== 'undefined') return false 6220 } 6221 }) 6222 return value 6223 } 6224 6225 rawIndent(root) { 6226 if (root.raws.indent) return root.raws.indent 6227 let value 6228 root.walk(i => { 6229 let p = i.parent 6230 if (p && p !== root && p.parent && p.parent === root) { 6231 if (typeof i.raws.before !== 'undefined') { 6232 let parts = i.raws.before.split('\n') 6233 value = parts[parts.length - 1] 6234 value = value.replace(/\S/g, '') 6235 return false 6236 } 6237 } 6238 }) 6239 return value 6240 } 6241 6242 rawSemicolon(root) { 6243 let value 6244 root.walk(i => { 6245 if (i.nodes && i.nodes.length && i.last.type === 'decl') { 6246 value = i.raws.semicolon 6247 if (typeof value !== 'undefined') return false 6248 } 6249 }) 6250 return value 6251 } 6252 6253 rawValue(node, prop) { 6254 let value = node[prop] 6255 let raw = node.raws[prop] 6256 if (raw && raw.value === value) { 6257 return raw.raw 6258 } 6259 6260 return value 6261 } 6262 6263 root(node) { 6264 this.body(node) 6265 if (node.raws.after) this.builder(node.raws.after) 6266 } 6267 6268 rule(node) { 6269 this.block(node, this.rawValue(node, 'selector')) 6270 if (node.raws.ownSemicolon) { 6271 this.builder(node.raws.ownSemicolon, node, 'end') 6272 } 6273 } 6274 6275 stringify(node, semicolon) { 6276 /* c8 ignore start */ 6277 if (!this[node.type]) { 6278 throw new Error( 6279 'Unknown AST node type ' + 6280 node.type + 6281 '. ' + 6282 'Maybe you need to change PostCSS stringifier.' 6283 ) 6284 } 6285 /* c8 ignore stop */ 6286 this[node.type](node, semicolon) 6287 } 6288 } 6289 6290 module.exports = Stringifier 6291 Stringifier.default = Stringifier 6292 6293 6294 /***/ }), 6295 6296 /***/ 633: 6297 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 6298 6299 "use strict"; 6300 6301 6302 let Stringifier = __webpack_require__(346) 6303 6304 function stringify(node, builder) { 6305 let str = new Stringifier(builder) 6306 str.stringify(node) 6307 } 6308 6309 module.exports = stringify 6310 stringify.default = stringify 6311 6312 6313 /***/ }), 6314 6315 /***/ 1381: 6316 /***/ ((module) => { 6317 6318 "use strict"; 6319 6320 6321 module.exports.isClean = Symbol('isClean') 6322 6323 module.exports.my = Symbol('my') 6324 6325 6326 /***/ }), 6327 6328 /***/ 2327: 6329 /***/ ((module) => { 6330 6331 "use strict"; 6332 6333 6334 const SINGLE_QUOTE = "'".charCodeAt(0) 6335 const DOUBLE_QUOTE = '"'.charCodeAt(0) 6336 const BACKSLASH = '\\'.charCodeAt(0) 6337 const SLASH = '/'.charCodeAt(0) 6338 const NEWLINE = '\n'.charCodeAt(0) 6339 const SPACE = ' '.charCodeAt(0) 6340 const FEED = '\f'.charCodeAt(0) 6341 const TAB = '\t'.charCodeAt(0) 6342 const CR = '\r'.charCodeAt(0) 6343 const OPEN_SQUARE = '['.charCodeAt(0) 6344 const CLOSE_SQUARE = ']'.charCodeAt(0) 6345 const OPEN_PARENTHESES = '('.charCodeAt(0) 6346 const CLOSE_PARENTHESES = ')'.charCodeAt(0) 6347 const OPEN_CURLY = '{'.charCodeAt(0) 6348 const CLOSE_CURLY = '}'.charCodeAt(0) 6349 const SEMICOLON = ';'.charCodeAt(0) 6350 const ASTERISK = '*'.charCodeAt(0) 6351 const COLON = ':'.charCodeAt(0) 6352 const AT = '@'.charCodeAt(0) 6353 6354 const RE_AT_END = /[\t\n\f\r "#'()/;[\\\]{}]/g 6355 const RE_WORD_END = /[\t\n\f\r !"#'():;@[\\\]{}]|\/(?=\*)/g 6356 const RE_BAD_BRACKET = /.[\r\n"'(/\\]/ 6357 const RE_HEX_ESCAPE = /[\da-f]/i 6358 6359 module.exports = function tokenizer(input, options = {}) { 6360 let css = input.css.valueOf() 6361 let ignore = options.ignoreErrors 6362 6363 let code, content, escape, next, quote 6364 let currentToken, escaped, escapePos, n, prev 6365 6366 let length = css.length 6367 let pos = 0 6368 let buffer = [] 6369 let returned = [] 6370 6371 function position() { 6372 return pos 6373 } 6374 6375 function unclosed(what) { 6376 throw input.error('Unclosed ' + what, pos) 6377 } 6378 6379 function endOfFile() { 6380 return returned.length === 0 && pos >= length 6381 } 6382 6383 function nextToken(opts) { 6384 if (returned.length) return returned.pop() 6385 if (pos >= length) return 6386 6387 let ignoreUnclosed = opts ? opts.ignoreUnclosed : false 6388 6389 code = css.charCodeAt(pos) 6390 6391 switch (code) { 6392 case NEWLINE: 6393 case SPACE: 6394 case TAB: 6395 case CR: 6396 case FEED: { 6397 next = pos 6398 do { 6399 next += 1 6400 code = css.charCodeAt(next) 6401 } while ( 6402 code === SPACE || 6403 code === NEWLINE || 6404 code === TAB || 6405 code === CR || 6406 code === FEED 6407 ) 6408 6409 currentToken = ['space', css.slice(pos, next)] 6410 pos = next - 1 6411 break 6412 } 6413 6414 case OPEN_SQUARE: 6415 case CLOSE_SQUARE: 6416 case OPEN_CURLY: 6417 case CLOSE_CURLY: 6418 case COLON: 6419 case SEMICOLON: 6420 case CLOSE_PARENTHESES: { 6421 let controlChar = String.fromCharCode(code) 6422 currentToken = [controlChar, controlChar, pos] 6423 break 6424 } 6425 6426 case OPEN_PARENTHESES: { 6427 prev = buffer.length ? buffer.pop()[1] : '' 6428 n = css.charCodeAt(pos + 1) 6429 if ( 6430 prev === 'url' && 6431 n !== SINGLE_QUOTE && 6432 n !== DOUBLE_QUOTE && 6433 n !== SPACE && 6434 n !== NEWLINE && 6435 n !== TAB && 6436 n !== FEED && 6437 n !== CR 6438 ) { 6439 next = pos 6440 do { 6441 escaped = false 6442 next = css.indexOf(')', next + 1) 6443 if (next === -1) { 6444 if (ignore || ignoreUnclosed) { 6445 next = pos 6446 break 6447 } else { 6448 unclosed('bracket') 6449 } 6450 } 6451 escapePos = next 6452 while (css.charCodeAt(escapePos - 1) === BACKSLASH) { 6453 escapePos -= 1 6454 escaped = !escaped 6455 } 6456 } while (escaped) 6457 6458 currentToken = ['brackets', css.slice(pos, next + 1), pos, next] 6459 6460 pos = next 6461 } else { 6462 next = css.indexOf(')', pos + 1) 6463 content = css.slice(pos, next + 1) 6464 6465 if (next === -1 || RE_BAD_BRACKET.test(content)) { 6466 currentToken = ['(', '(', pos] 6467 } else { 6468 currentToken = ['brackets', content, pos, next] 6469 pos = next 6470 } 6471 } 6472 6473 break 6474 } 6475 6476 case SINGLE_QUOTE: 6477 case DOUBLE_QUOTE: { 6478 quote = code === SINGLE_QUOTE ? "'" : '"' 6479 next = pos 6480 do { 6481 escaped = false 6482 next = css.indexOf(quote, next + 1) 6483 if (next === -1) { 6484 if (ignore || ignoreUnclosed) { 6485 next = pos + 1 6486 break 6487 } else { 6488 unclosed('string') 6489 } 6490 } 6491 escapePos = next 6492 while (css.charCodeAt(escapePos - 1) === BACKSLASH) { 6493 escapePos -= 1 6494 escaped = !escaped 6495 } 6496 } while (escaped) 6497 6498 currentToken = ['string', css.slice(pos, next + 1), pos, next] 6499 pos = next 6500 break 6501 } 6502 6503 case AT: { 6504 RE_AT_END.lastIndex = pos + 1 6505 RE_AT_END.test(css) 6506 if (RE_AT_END.lastIndex === 0) { 6507 next = css.length - 1 6508 } else { 6509 next = RE_AT_END.lastIndex - 2 6510 } 6511 6512 currentToken = ['at-word', css.slice(pos, next + 1), pos, next] 6513 6514 pos = next 6515 break 6516 } 6517 6518 case BACKSLASH: { 6519 next = pos 6520 escape = true 6521 while (css.charCodeAt(next + 1) === BACKSLASH) { 6522 next += 1 6523 escape = !escape 6524 } 6525 code = css.charCodeAt(next + 1) 6526 if ( 6527 escape && 6528 code !== SLASH && 6529 code !== SPACE && 6530 code !== NEWLINE && 6531 code !== TAB && 6532 code !== CR && 6533 code !== FEED 6534 ) { 6535 next += 1 6536 if (RE_HEX_ESCAPE.test(css.charAt(next))) { 6537 while (RE_HEX_ESCAPE.test(css.charAt(next + 1))) { 6538 next += 1 6539 } 6540 if (css.charCodeAt(next + 1) === SPACE) { 6541 next += 1 6542 } 6543 } 6544 } 6545 6546 currentToken = ['word', css.slice(pos, next + 1), pos, next] 6547 6548 pos = next 6549 break 6550 } 6551 6552 default: { 6553 if (code === SLASH && css.charCodeAt(pos + 1) === ASTERISK) { 6554 next = css.indexOf('*/', pos + 2) + 1 6555 if (next === 0) { 6556 if (ignore || ignoreUnclosed) { 6557 next = css.length 6558 } else { 6559 unclosed('comment') 6560 } 6561 } 6562 6563 currentToken = ['comment', css.slice(pos, next + 1), pos, next] 6564 pos = next 6565 } else { 6566 RE_WORD_END.lastIndex = pos + 1 6567 RE_WORD_END.test(css) 6568 if (RE_WORD_END.lastIndex === 0) { 6569 next = css.length - 1 6570 } else { 6571 next = RE_WORD_END.lastIndex - 2 6572 } 6573 6574 currentToken = ['word', css.slice(pos, next + 1), pos, next] 6575 buffer.push(currentToken) 6576 pos = next 6577 } 6578 6579 break 6580 } 6581 } 6582 6583 pos++ 6584 return currentToken 6585 } 6586 6587 function back(token) { 6588 returned.push(token) 6589 } 6590 6591 return { 6592 back, 6593 endOfFile, 6594 nextToken, 6595 position 6596 } 6597 } 6598 6599 6600 /***/ }), 6601 6602 /***/ 3122: 6603 /***/ ((module) => { 6604 6605 "use strict"; 6606 /* eslint-disable no-console */ 6607 6608 6609 let printed = {} 6610 6611 module.exports = function warnOnce(message) { 6612 if (printed[message]) return 6613 printed[message] = true 6614 6615 if (typeof console !== 'undefined' && console.warn) { 6616 console.warn(message) 6617 } 6618 } 6619 6620 6621 /***/ }), 6622 6623 /***/ 5776: 6624 /***/ ((module) => { 6625 6626 "use strict"; 6627 6628 6629 class Warning { 6630 constructor(text, opts = {}) { 6631 this.type = 'warning' 6632 this.text = text 6633 6634 if (opts.node && opts.node.source) { 6635 let range = opts.node.rangeBy(opts) 6636 this.line = range.start.line 6637 this.column = range.start.column 6638 this.endLine = range.end.line 6639 this.endColumn = range.end.column 6640 } 6641 6642 for (let opt in opts) this[opt] = opts[opt] 6643 } 6644 6645 toString() { 6646 if (this.node) { 6647 return this.node.error(this.text, { 6648 index: this.index, 6649 plugin: this.plugin, 6650 word: this.word 6651 }).message 6652 } 6653 6654 if (this.plugin) { 6655 return this.plugin + ': ' + this.text 6656 } 6657 6658 return this.text 6659 } 6660 } 6661 6662 module.exports = Warning 6663 Warning.default = Warning 6664 6665 6666 /***/ }), 6667 6668 /***/ 628: 6669 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 6670 6671 "use strict"; 6672 /** 6673 * Copyright (c) 2013-present, Facebook, Inc. 6674 * 6675 * This source code is licensed under the MIT license found in the 6676 * LICENSE file in the root directory of this source tree. 6677 */ 6678 6679 6680 6681 var ReactPropTypesSecret = __webpack_require__(4067); 6682 6683 function emptyFunction() {} 6684 function emptyFunctionWithReset() {} 6685 emptyFunctionWithReset.resetWarningCache = emptyFunction; 6686 6687 module.exports = function() { 6688 function shim(props, propName, componentName, location, propFullName, secret) { 6689 if (secret === ReactPropTypesSecret) { 6690 // It is still safe when called from React. 6691 return; 6692 } 6693 var err = new Error( 6694 'Calling PropTypes validators directly is not supported by the `prop-types` package. ' + 6695 'Use PropTypes.checkPropTypes() to call them. ' + 6696 'Read more at http://fb.me/use-check-prop-types' 6697 ); 6698 err.name = 'Invariant Violation'; 6699 throw err; 6700 }; 6701 shim.isRequired = shim; 6702 function getShim() { 6703 return shim; 6704 }; 6705 // Important! 6706 // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`. 6707 var ReactPropTypes = { 6708 array: shim, 6709 bigint: shim, 6710 bool: shim, 6711 func: shim, 6712 number: shim, 6713 object: shim, 6714 string: shim, 6715 symbol: shim, 6716 6717 any: shim, 6718 arrayOf: getShim, 6719 element: shim, 6720 elementType: shim, 6721 instanceOf: getShim, 6722 node: shim, 6723 objectOf: getShim, 6724 oneOf: getShim, 6725 oneOfType: getShim, 6726 shape: getShim, 6727 exact: getShim, 6728 6729 checkPropTypes: emptyFunctionWithReset, 6730 resetWarningCache: emptyFunction 6731 }; 6732 6733 ReactPropTypes.PropTypes = ReactPropTypes; 6734 6735 return ReactPropTypes; 6736 }; 6737 6738 6739 /***/ }), 6740 6741 /***/ 5826: 6742 /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 6743 6744 /** 6745 * Copyright (c) 2013-present, Facebook, Inc. 6746 * 6747 * This source code is licensed under the MIT license found in the 6748 * LICENSE file in the root directory of this source tree. 6749 */ 6750 6751 if (false) { var throwOnDirectAccess, ReactIs; } else { 6752 // By explicitly using `prop-types` you are opting into new production behavior. 6753 // http://fb.me/prop-types-in-prod 6754 module.exports = __webpack_require__(628)(); 6755 } 6756 6757 6758 /***/ }), 6759 6760 /***/ 4067: 6761 /***/ ((module) => { 6762 6763 "use strict"; 6764 /** 6765 * Copyright (c) 2013-present, Facebook, Inc. 6766 * 6767 * This source code is licensed under the MIT license found in the 6768 * LICENSE file in the root directory of this source tree. 6769 */ 6770 6771 6772 6773 var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED'; 6774 6775 module.exports = ReactPropTypesSecret; 6776 6777 6778 /***/ }), 6779 6780 /***/ 4462: 6781 /***/ (function(__unused_webpack_module, exports, __webpack_require__) { 6782 6783 "use strict"; 6784 6785 var __extends = (this && this.__extends) || (function () { 6786 var extendStatics = Object.setPrototypeOf || 6787 ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || 6788 function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; 6789 return function (d, b) { 6790 extendStatics(d, b); 6791 function __() { this.constructor = d; } 6792 d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); 6793 }; 6794 })(); 6795 var __assign = (this && this.__assign) || Object.assign || function(t) { 6796 for (var s, i = 1, n = arguments.length; i < n; i++) { 6797 s = arguments[i]; 6798 for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) 6799 t[p] = s[p]; 6800 } 6801 return t; 6802 }; 6803 var __rest = (this && this.__rest) || function (s, e) { 6804 var t = {}; 6805 for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) 6806 t[p] = s[p]; 6807 if (s != null && typeof Object.getOwnPropertySymbols === "function") 6808 for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0) 6809 t[p[i]] = s[p[i]]; 6810 return t; 6811 }; 6812 exports.__esModule = true; 6813 var React = __webpack_require__(1609); 6814 var PropTypes = __webpack_require__(5826); 6815 var autosize = __webpack_require__(4306); 6816 var _getLineHeight = __webpack_require__(461); 6817 var getLineHeight = _getLineHeight; 6818 var RESIZED = "autosize:resized"; 6819 /** 6820 * A light replacement for built-in textarea component 6821 * which automaticaly adjusts its height to match the content 6822 */ 6823 var TextareaAutosizeClass = /** @class */ (function (_super) { 6824 __extends(TextareaAutosizeClass, _super); 6825 function TextareaAutosizeClass() { 6826 var _this = _super !== null && _super.apply(this, arguments) || this; 6827 _this.state = { 6828 lineHeight: null 6829 }; 6830 _this.textarea = null; 6831 _this.onResize = function (e) { 6832 if (_this.props.onResize) { 6833 _this.props.onResize(e); 6834 } 6835 }; 6836 _this.updateLineHeight = function () { 6837 if (_this.textarea) { 6838 _this.setState({ 6839 lineHeight: getLineHeight(_this.textarea) 6840 }); 6841 } 6842 }; 6843 _this.onChange = function (e) { 6844 var onChange = _this.props.onChange; 6845 _this.currentValue = e.currentTarget.value; 6846 onChange && onChange(e); 6847 }; 6848 return _this; 6849 } 6850 TextareaAutosizeClass.prototype.componentDidMount = function () { 6851 var _this = this; 6852 var _a = this.props, maxRows = _a.maxRows, async = _a.async; 6853 if (typeof maxRows === "number") { 6854 this.updateLineHeight(); 6855 } 6856 if (typeof maxRows === "number" || async) { 6857 /* 6858 the defer is needed to: 6859 - force "autosize" to activate the scrollbar when this.props.maxRows is passed 6860 - support StyledComponents (see #71) 6861 */ 6862 setTimeout(function () { return _this.textarea && autosize(_this.textarea); }); 6863 } 6864 else { 6865 this.textarea && autosize(this.textarea); 6866 } 6867 if (this.textarea) { 6868 this.textarea.addEventListener(RESIZED, this.onResize); 6869 } 6870 }; 6871 TextareaAutosizeClass.prototype.componentWillUnmount = function () { 6872 if (this.textarea) { 6873 this.textarea.removeEventListener(RESIZED, this.onResize); 6874 autosize.destroy(this.textarea); 6875 } 6876 }; 6877 TextareaAutosizeClass.prototype.render = function () { 6878 var _this = this; 6879 var _a = this, _b = _a.props, onResize = _b.onResize, maxRows = _b.maxRows, onChange = _b.onChange, style = _b.style, innerRef = _b.innerRef, children = _b.children, props = __rest(_b, ["onResize", "maxRows", "onChange", "style", "innerRef", "children"]), lineHeight = _a.state.lineHeight; 6880 var maxHeight = maxRows && lineHeight ? lineHeight * maxRows : null; 6881 return (React.createElement("textarea", __assign({}, props, { onChange: this.onChange, style: maxHeight ? __assign({}, style, { maxHeight: maxHeight }) : style, ref: function (element) { 6882 _this.textarea = element; 6883 if (typeof _this.props.innerRef === 'function') { 6884 _this.props.innerRef(element); 6885 } 6886 else if (_this.props.innerRef) { 6887 _this.props.innerRef.current = element; 6888 } 6889 } }), children)); 6890 }; 6891 TextareaAutosizeClass.prototype.componentDidUpdate = function () { 6892 this.textarea && autosize.update(this.textarea); 6893 }; 6894 TextareaAutosizeClass.defaultProps = { 6895 rows: 1, 6896 async: false 6897 }; 6898 TextareaAutosizeClass.propTypes = { 6899 rows: PropTypes.number, 6900 maxRows: PropTypes.number, 6901 onResize: PropTypes.func, 6902 innerRef: PropTypes.any, 6903 async: PropTypes.bool 6904 }; 6905 return TextareaAutosizeClass; 6906 }(React.Component)); 6907 exports.TextareaAutosize = React.forwardRef(function (props, ref) { 6908 return React.createElement(TextareaAutosizeClass, __assign({}, props, { innerRef: ref })); 6909 }); 6910 6911 6912 /***/ }), 6913 6914 /***/ 4132: 6915 /***/ ((__unused_webpack_module, exports, __webpack_require__) => { 6916 6917 "use strict"; 6918 var __webpack_unused_export__; 6919 6920 __webpack_unused_export__ = true; 6921 var TextareaAutosize_1 = __webpack_require__(4462); 6922 exports.A = TextareaAutosize_1.TextareaAutosize; 6923 6924 6925 /***/ }), 6926 6927 /***/ 9681: 6928 /***/ ((module) => { 6929 6930 var characterMap = { 6931 "À": "A", 6932 "Á": "A", 6933 "Â": "A", 6934 "Ã": "A", 6935 "Ä": "A", 6936 "Å": "A", 6937 "Ấ": "A", 6938 "Ắ": "A", 6939 "Ẳ": "A", 6940 "Ẵ": "A", 6941 "Ặ": "A", 6942 "Æ": "AE", 6943 "Ầ": "A", 6944 "Ằ": "A", 6945 "Ȃ": "A", 6946 "Ả": "A", 6947 "Ạ": "A", 6948 "Ẩ": "A", 6949 "Ẫ": "A", 6950 "Ậ": "A", 6951 "Ç": "C", 6952 "Ḉ": "C", 6953 "È": "E", 6954 "É": "E", 6955 "Ê": "E", 6956 "Ë": "E", 6957 "Ế": "E", 6958 "Ḗ": "E", 6959 "Ề": "E", 6960 "Ḕ": "E", 6961 "Ḝ": "E", 6962 "Ȇ": "E", 6963 "Ẻ": "E", 6964 "Ẽ": "E", 6965 "Ẹ": "E", 6966 "Ể": "E", 6967 "Ễ": "E", 6968 "Ệ": "E", 6969 "Ì": "I", 6970 "Í": "I", 6971 "Î": "I", 6972 "Ï": "I", 6973 "Ḯ": "I", 6974 "Ȋ": "I", 6975 "Ỉ": "I", 6976 "Ị": "I", 6977 "Ð": "D", 6978 "Ñ": "N", 6979 "Ò": "O", 6980 "Ó": "O", 6981 "Ô": "O", 6982 "Õ": "O", 6983 "Ö": "O", 6984 "Ø": "O", 6985 "Ố": "O", 6986 "Ṍ": "O", 6987 "Ṓ": "O", 6988 "Ȏ": "O", 6989 "Ỏ": "O", 6990 "Ọ": "O", 6991 "Ổ": "O", 6992 "Ỗ": "O", 6993 "Ộ": "O", 6994 "Ờ": "O", 6995 "Ở": "O", 6996 "Ỡ": "O", 6997 "Ớ": "O", 6998 "Ợ": "O", 6999 "Ù": "U", 7000 "Ú": "U", 7001 "Û": "U", 7002 "Ü": "U", 7003 "Ủ": "U", 7004 "Ụ": "U", 7005 "Ử": "U", 7006 "Ữ": "U", 7007 "Ự": "U", 7008 "Ý": "Y", 7009 "à": "a", 7010 "á": "a", 7011 "â": "a", 7012 "ã": "a", 7013 "ä": "a", 7014 "å": "a", 7015 "ấ": "a", 7016 "ắ": "a", 7017 "ẳ": "a", 7018 "ẵ": "a", 7019 "ặ": "a", 7020 "æ": "ae", 7021 "ầ": "a", 7022 "ằ": "a", 7023 "ȃ": "a", 7024 "ả": "a", 7025 "ạ": "a", 7026 "ẩ": "a", 7027 "ẫ": "a", 7028 "ậ": "a", 7029 "ç": "c", 7030 "ḉ": "c", 7031 "è": "e", 7032 "é": "e", 7033 "ê": "e", 7034 "ë": "e", 7035 "ế": "e", 7036 "ḗ": "e", 7037 "ề": "e", 7038 "ḕ": "e", 7039 "ḝ": "e", 7040 "ȇ": "e", 7041 "ẻ": "e", 7042 "ẽ": "e", 7043 "ẹ": "e", 7044 "ể": "e", 7045 "ễ": "e", 7046 "ệ": "e", 7047 "ì": "i", 7048 "í": "i", 7049 "î": "i", 7050 "ï": "i", 7051 "ḯ": "i", 7052 "ȋ": "i", 7053 "ỉ": "i", 7054 "ị": "i", 7055 "ð": "d", 7056 "ñ": "n", 7057 "ò": "o", 7058 "ó": "o", 7059 "ô": "o", 7060 "õ": "o", 7061 "ö": "o", 7062 "ø": "o", 7063 "ố": "o", 7064 "ṍ": "o", 7065 "ṓ": "o", 7066 "ȏ": "o", 7067 "ỏ": "o", 7068 "ọ": "o", 7069 "ổ": "o", 7070 "ỗ": "o", 7071 "ộ": "o", 7072 "ờ": "o", 7073 "ở": "o", 7074 "ỡ": "o", 7075 "ớ": "o", 7076 "ợ": "o", 7077 "ù": "u", 7078 "ú": "u", 7079 "û": "u", 7080 "ü": "u", 7081 "ủ": "u", 7082 "ụ": "u", 7083 "ử": "u", 7084 "ữ": "u", 7085 "ự": "u", 7086 "ý": "y", 7087 "ÿ": "y", 7088 "Ā": "A", 7089 "ā": "a", 7090 "Ă": "A", 7091 "ă": "a", 7092 "Ą": "A", 7093 "ą": "a", 7094 "Ć": "C", 7095 "ć": "c", 7096 "Ĉ": "C", 7097 "ĉ": "c", 7098 "Ċ": "C", 7099 "ċ": "c", 7100 "Č": "C", 7101 "č": "c", 7102 "C̆": "C", 7103 "c̆": "c", 7104 "Ď": "D", 7105 "ď": "d", 7106 "Đ": "D", 7107 "đ": "d", 7108 "Ē": "E", 7109 "ē": "e", 7110 "Ĕ": "E", 7111 "ĕ": "e", 7112 "Ė": "E", 7113 "ė": "e", 7114 "Ę": "E", 7115 "ę": "e", 7116 "Ě": "E", 7117 "ě": "e", 7118 "Ĝ": "G", 7119 "Ǵ": "G", 7120 "ĝ": "g", 7121 "ǵ": "g", 7122 "Ğ": "G", 7123 "ğ": "g", 7124 "Ġ": "G", 7125 "ġ": "g", 7126 "Ģ": "G", 7127 "ģ": "g", 7128 "Ĥ": "H", 7129 "ĥ": "h", 7130 "Ħ": "H", 7131 "ħ": "h", 7132 "Ḫ": "H", 7133 "ḫ": "h", 7134 "Ĩ": "I", 7135 "ĩ": "i", 7136 "Ī": "I", 7137 "ī": "i", 7138 "Ĭ": "I", 7139 "ĭ": "i", 7140 "Į": "I", 7141 "į": "i", 7142 "İ": "I", 7143 "ı": "i", 7144 "IJ": "IJ", 7145 "ij": "ij", 7146 "Ĵ": "J", 7147 "ĵ": "j", 7148 "Ķ": "K", 7149 "ķ": "k", 7150 "Ḱ": "K", 7151 "ḱ": "k", 7152 "K̆": "K", 7153 "k̆": "k", 7154 "Ĺ": "L", 7155 "ĺ": "l", 7156 "Ļ": "L", 7157 "ļ": "l", 7158 "Ľ": "L", 7159 "ľ": "l", 7160 "Ŀ": "L", 7161 "ŀ": "l", 7162 "Ł": "l", 7163 "ł": "l", 7164 "Ḿ": "M", 7165 "ḿ": "m", 7166 "M̆": "M", 7167 "m̆": "m", 7168 "Ń": "N", 7169 "ń": "n", 7170 "Ņ": "N", 7171 "ņ": "n", 7172 "Ň": "N", 7173 "ň": "n", 7174 "ʼn": "n", 7175 "N̆": "N", 7176 "n̆": "n", 7177 "Ō": "O", 7178 "ō": "o", 7179 "Ŏ": "O", 7180 "ŏ": "o", 7181 "Ő": "O", 7182 "ő": "o", 7183 "Œ": "OE", 7184 "œ": "oe", 7185 "P̆": "P", 7186 "p̆": "p", 7187 "Ŕ": "R", 7188 "ŕ": "r", 7189 "Ŗ": "R", 7190 "ŗ": "r", 7191 "Ř": "R", 7192 "ř": "r", 7193 "R̆": "R", 7194 "r̆": "r", 7195 "Ȓ": "R", 7196 "ȓ": "r", 7197 "Ś": "S", 7198 "ś": "s", 7199 "Ŝ": "S", 7200 "ŝ": "s", 7201 "Ş": "S", 7202 "Ș": "S", 7203 "ș": "s", 7204 "ş": "s", 7205 "Š": "S", 7206 "š": "s", 7207 "Ţ": "T", 7208 "ţ": "t", 7209 "ț": "t", 7210 "Ț": "T", 7211 "Ť": "T", 7212 "ť": "t", 7213 "Ŧ": "T", 7214 "ŧ": "t", 7215 "T̆": "T", 7216 "t̆": "t", 7217 "Ũ": "U", 7218 "ũ": "u", 7219 "Ū": "U", 7220 "ū": "u", 7221 "Ŭ": "U", 7222 "ŭ": "u", 7223 "Ů": "U", 7224 "ů": "u", 7225 "Ű": "U", 7226 "ű": "u", 7227 "Ų": "U", 7228 "ų": "u", 7229 "Ȗ": "U", 7230 "ȗ": "u", 7231 "V̆": "V", 7232 "v̆": "v", 7233 "Ŵ": "W", 7234 "ŵ": "w", 7235 "Ẃ": "W", 7236 "ẃ": "w", 7237 "X̆": "X", 7238 "x̆": "x", 7239 "Ŷ": "Y", 7240 "ŷ": "y", 7241 "Ÿ": "Y", 7242 "Y̆": "Y", 7243 "y̆": "y", 7244 "Ź": "Z", 7245 "ź": "z", 7246 "Ż": "Z", 7247 "ż": "z", 7248 "Ž": "Z", 7249 "ž": "z", 7250 "ſ": "s", 7251 "ƒ": "f", 7252 "Ơ": "O", 7253 "ơ": "o", 7254 "Ư": "U", 7255 "ư": "u", 7256 "Ǎ": "A", 7257 "ǎ": "a", 7258 "Ǐ": "I", 7259 "ǐ": "i", 7260 "Ǒ": "O", 7261 "ǒ": "o", 7262 "Ǔ": "U", 7263 "ǔ": "u", 7264 "Ǖ": "U", 7265 "ǖ": "u", 7266 "Ǘ": "U", 7267 "ǘ": "u", 7268 "Ǚ": "U", 7269 "ǚ": "u", 7270 "Ǜ": "U", 7271 "ǜ": "u", 7272 "Ứ": "U", 7273 "ứ": "u", 7274 "Ṹ": "U", 7275 "ṹ": "u", 7276 "Ǻ": "A", 7277 "ǻ": "a", 7278 "Ǽ": "AE", 7279 "ǽ": "ae", 7280 "Ǿ": "O", 7281 "ǿ": "o", 7282 "Þ": "TH", 7283 "þ": "th", 7284 "Ṕ": "P", 7285 "ṕ": "p", 7286 "Ṥ": "S", 7287 "ṥ": "s", 7288 "X́": "X", 7289 "x́": "x", 7290 "Ѓ": "Г", 7291 "ѓ": "г", 7292 "Ќ": "К", 7293 "ќ": "к", 7294 "A̋": "A", 7295 "a̋": "a", 7296 "E̋": "E", 7297 "e̋": "e", 7298 "I̋": "I", 7299 "i̋": "i", 7300 "Ǹ": "N", 7301 "ǹ": "n", 7302 "Ồ": "O", 7303 "ồ": "o", 7304 "Ṑ": "O", 7305 "ṑ": "o", 7306 "Ừ": "U", 7307 "ừ": "u", 7308 "Ẁ": "W", 7309 "ẁ": "w", 7310 "Ỳ": "Y", 7311 "ỳ": "y", 7312 "Ȁ": "A", 7313 "ȁ": "a", 7314 "Ȅ": "E", 7315 "ȅ": "e", 7316 "Ȉ": "I", 7317 "ȉ": "i", 7318 "Ȍ": "O", 7319 "ȍ": "o", 7320 "Ȑ": "R", 7321 "ȑ": "r", 7322 "Ȕ": "U", 7323 "ȕ": "u", 7324 "B̌": "B", 7325 "b̌": "b", 7326 "Č̣": "C", 7327 "č̣": "c", 7328 "Ê̌": "E", 7329 "ê̌": "e", 7330 "F̌": "F", 7331 "f̌": "f", 7332 "Ǧ": "G", 7333 "ǧ": "g", 7334 "Ȟ": "H", 7335 "ȟ": "h", 7336 "J̌": "J", 7337 "ǰ": "j", 7338 "Ǩ": "K", 7339 "ǩ": "k", 7340 "M̌": "M", 7341 "m̌": "m", 7342 "P̌": "P", 7343 "p̌": "p", 7344 "Q̌": "Q", 7345 "q̌": "q", 7346 "Ř̩": "R", 7347 "ř̩": "r", 7348 "Ṧ": "S", 7349 "ṧ": "s", 7350 "V̌": "V", 7351 "v̌": "v", 7352 "W̌": "W", 7353 "w̌": "w", 7354 "X̌": "X", 7355 "x̌": "x", 7356 "Y̌": "Y", 7357 "y̌": "y", 7358 "A̧": "A", 7359 "a̧": "a", 7360 "B̧": "B", 7361 "b̧": "b", 7362 "Ḑ": "D", 7363 "ḑ": "d", 7364 "Ȩ": "E", 7365 "ȩ": "e", 7366 "Ɛ̧": "E", 7367 "ɛ̧": "e", 7368 "Ḩ": "H", 7369 "ḩ": "h", 7370 "I̧": "I", 7371 "i̧": "i", 7372 "Ɨ̧": "I", 7373 "ɨ̧": "i", 7374 "M̧": "M", 7375 "m̧": "m", 7376 "O̧": "O", 7377 "o̧": "o", 7378 "Q̧": "Q", 7379 "q̧": "q", 7380 "U̧": "U", 7381 "u̧": "u", 7382 "X̧": "X", 7383 "x̧": "x", 7384 "Z̧": "Z", 7385 "z̧": "z", 7386 "й":"и", 7387 "Й":"И", 7388 "ё":"е", 7389 "Ё":"Е", 7390 }; 7391 7392 var chars = Object.keys(characterMap).join('|'); 7393 var allAccents = new RegExp(chars, 'g'); 7394 var firstAccent = new RegExp(chars, ''); 7395 7396 function matcher(match) { 7397 return characterMap[match]; 7398 } 7399 7400 var removeAccents = function(string) { 7401 return string.replace(allAccents, matcher); 7402 }; 7403 7404 var hasAccents = function(string) { 7405 return !!string.match(firstAccent); 7406 }; 7407 7408 module.exports = removeAccents; 7409 module.exports.has = hasAccents; 7410 module.exports.remove = removeAccents; 7411 7412 7413 /***/ }), 7414 7415 /***/ 1609: 7416 /***/ ((module) => { 7417 7418 "use strict"; 7419 module.exports = window["React"]; 7420 7421 /***/ }), 7422 7423 /***/ 9746: 7424 /***/ (() => { 7425 7426 /* (ignored) */ 7427 7428 /***/ }), 7429 7430 /***/ 9977: 7431 /***/ (() => { 7432 7433 /* (ignored) */ 7434 7435 /***/ }), 7436 7437 /***/ 197: 7438 /***/ (() => { 7439 7440 /* (ignored) */ 7441 7442 /***/ }), 7443 7444 /***/ 1866: 7445 /***/ (() => { 7446 7447 /* (ignored) */ 7448 7449 /***/ }), 7450 7451 /***/ 2739: 7452 /***/ (() => { 7453 7454 /* (ignored) */ 7455 7456 /***/ }), 7457 7458 /***/ 5042: 7459 /***/ ((module) => { 7460 7461 let urlAlphabet = 7462 'useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict' 7463 let customAlphabet = (alphabet, defaultSize = 21) => { 7464 return (size = defaultSize) => { 7465 let id = '' 7466 let i = size 7467 while (i--) { 7468 id += alphabet[(Math.random() * alphabet.length) | 0] 7469 } 7470 return id 7471 } 7472 } 7473 let nanoid = (size = 21) => { 7474 let id = '' 7475 let i = size 7476 while (i--) { 7477 id += urlAlphabet[(Math.random() * 64) | 0] 7478 } 7479 return id 7480 } 7481 module.exports = { nanoid, customAlphabet } 7482 7483 7484 /***/ }) 7485 7486 /******/ }); 7487 /************************************************************************/ 7488 /******/ // The module cache 7489 /******/ var __webpack_module_cache__ = {}; 7490 /******/ 7491 /******/ // The require function 7492 /******/ function __webpack_require__(moduleId) { 7493 /******/ // Check if module is in cache 7494 /******/ var cachedModule = __webpack_module_cache__[moduleId]; 7495 /******/ if (cachedModule !== undefined) { 7496 /******/ return cachedModule.exports; 7497 /******/ } 7498 /******/ // Create a new module (and put it into the cache) 7499 /******/ var module = __webpack_module_cache__[moduleId] = { 7500 /******/ // no module.id needed 7501 /******/ // no module.loaded needed 7502 /******/ exports: {} 7503 /******/ }; 7504 /******/ 7505 /******/ // Execute the module function 7506 /******/ __webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__); 7507 /******/ 7508 /******/ // Return the exports of the module 7509 /******/ return module.exports; 7510 /******/ } 7511 /******/ 7512 /************************************************************************/ 7513 /******/ /* webpack/runtime/compat get default export */ 7514 /******/ (() => { 7515 /******/ // getDefaultExport function for compatibility with non-harmony modules 7516 /******/ __webpack_require__.n = (module) => { 7517 /******/ var getter = module && module.__esModule ? 7518 /******/ () => (module['default']) : 7519 /******/ () => (module); 7520 /******/ __webpack_require__.d(getter, { a: getter }); 7521 /******/ return getter; 7522 /******/ }; 7523 /******/ })(); 7524 /******/ 7525 /******/ /* webpack/runtime/define property getters */ 7526 /******/ (() => { 7527 /******/ // define getter functions for harmony exports 7528 /******/ __webpack_require__.d = (exports, definition) => { 7529 /******/ for(var key in definition) { 7530 /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) { 7531 /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] }); 7532 /******/ } 7533 /******/ } 7534 /******/ }; 7535 /******/ })(); 7536 /******/ 7537 /******/ /* webpack/runtime/hasOwnProperty shorthand */ 7538 /******/ (() => { 7539 /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop)) 7540 /******/ })(); 7541 /******/ 7542 /******/ /* webpack/runtime/make namespace object */ 7543 /******/ (() => { 7544 /******/ // define __esModule on exports 7545 /******/ __webpack_require__.r = (exports) => { 7546 /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { 7547 /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); 7548 /******/ } 7549 /******/ Object.defineProperty(exports, '__esModule', { value: true }); 7550 /******/ }; 7551 /******/ })(); 7552 /******/ 7553 /************************************************************************/ 7554 var __webpack_exports__ = {}; 7555 // This entry need to be wrapped in an IIFE because it need to be in strict mode. 7556 (() => { 7557 "use strict"; 7558 // ESM COMPAT FLAG 7559 __webpack_require__.r(__webpack_exports__); 7560 7561 // EXPORTS 7562 __webpack_require__.d(__webpack_exports__, { 7563 AlignmentControl: () => (/* reexport */ AlignmentControl), 7564 AlignmentToolbar: () => (/* reexport */ AlignmentToolbar), 7565 Autocomplete: () => (/* reexport */ autocomplete), 7566 BlockAlignmentControl: () => (/* reexport */ BlockAlignmentControl), 7567 BlockAlignmentToolbar: () => (/* reexport */ BlockAlignmentToolbar), 7568 BlockBreadcrumb: () => (/* reexport */ block_breadcrumb), 7569 BlockCanvas: () => (/* reexport */ block_canvas), 7570 BlockColorsStyleSelector: () => (/* reexport */ color_style_selector), 7571 BlockContextProvider: () => (/* reexport */ BlockContextProvider), 7572 BlockControls: () => (/* reexport */ block_controls), 7573 BlockEdit: () => (/* reexport */ BlockEdit), 7574 BlockEditorKeyboardShortcuts: () => (/* reexport */ keyboard_shortcuts), 7575 BlockEditorProvider: () => (/* reexport */ provider), 7576 BlockFormatControls: () => (/* reexport */ BlockFormatControls), 7577 BlockIcon: () => (/* reexport */ block_icon), 7578 BlockInspector: () => (/* reexport */ block_inspector), 7579 BlockList: () => (/* reexport */ BlockList), 7580 BlockMover: () => (/* reexport */ block_mover), 7581 BlockNavigationDropdown: () => (/* reexport */ dropdown), 7582 BlockPopover: () => (/* reexport */ block_popover), 7583 BlockPreview: () => (/* reexport */ block_preview), 7584 BlockSelectionClearer: () => (/* reexport */ BlockSelectionClearer), 7585 BlockSettingsMenu: () => (/* reexport */ block_settings_menu), 7586 BlockSettingsMenuControls: () => (/* reexport */ block_settings_menu_controls), 7587 BlockStyles: () => (/* reexport */ block_styles), 7588 BlockTitle: () => (/* reexport */ BlockTitle), 7589 BlockToolbar: () => (/* reexport */ BlockToolbar), 7590 BlockTools: () => (/* reexport */ BlockTools), 7591 BlockVerticalAlignmentControl: () => (/* reexport */ BlockVerticalAlignmentControl), 7592 BlockVerticalAlignmentToolbar: () => (/* reexport */ BlockVerticalAlignmentToolbar), 7593 ButtonBlockAppender: () => (/* reexport */ button_block_appender), 7594 ButtonBlockerAppender: () => (/* reexport */ ButtonBlockerAppender), 7595 ColorPalette: () => (/* reexport */ color_palette), 7596 ColorPaletteControl: () => (/* reexport */ ColorPaletteControl), 7597 ContrastChecker: () => (/* reexport */ contrast_checker), 7598 CopyHandler: () => (/* reexport */ CopyHandler), 7599 DefaultBlockAppender: () => (/* reexport */ DefaultBlockAppender), 7600 FontSizePicker: () => (/* reexport */ font_size_picker), 7601 HeadingLevelDropdown: () => (/* reexport */ HeadingLevelDropdown), 7602 HeightControl: () => (/* reexport */ HeightControl), 7603 InnerBlocks: () => (/* reexport */ inner_blocks), 7604 Inserter: () => (/* reexport */ inserter), 7605 InspectorAdvancedControls: () => (/* reexport */ InspectorAdvancedControls), 7606 InspectorControls: () => (/* reexport */ inspector_controls), 7607 JustifyContentControl: () => (/* reexport */ JustifyContentControl), 7608 JustifyToolbar: () => (/* reexport */ JustifyToolbar), 7609 LineHeightControl: () => (/* reexport */ line_height_control), 7610 MediaPlaceholder: () => (/* reexport */ media_placeholder), 7611 MediaReplaceFlow: () => (/* reexport */ media_replace_flow), 7612 MediaUpload: () => (/* reexport */ media_upload), 7613 MediaUploadCheck: () => (/* reexport */ check), 7614 MultiSelectScrollIntoView: () => (/* reexport */ MultiSelectScrollIntoView), 7615 NavigableToolbar: () => (/* reexport */ NavigableToolbar), 7616 ObserveTyping: () => (/* reexport */ observe_typing), 7617 PanelColorSettings: () => (/* reexport */ panel_color_settings), 7618 PlainText: () => (/* reexport */ plain_text), 7619 RecursionProvider: () => (/* reexport */ RecursionProvider), 7620 RichText: () => (/* reexport */ rich_text), 7621 RichTextShortcut: () => (/* reexport */ RichTextShortcut), 7622 RichTextToolbarButton: () => (/* reexport */ RichTextToolbarButton), 7623 SETTINGS_DEFAULTS: () => (/* reexport */ SETTINGS_DEFAULTS), 7624 SkipToSelectedBlock: () => (/* reexport */ SkipToSelectedBlock), 7625 ToolSelector: () => (/* reexport */ tool_selector), 7626 Typewriter: () => (/* reexport */ typewriter), 7627 URLInput: () => (/* reexport */ url_input), 7628 URLInputButton: () => (/* reexport */ url_input_button), 7629 URLPopover: () => (/* reexport */ url_popover), 7630 Warning: () => (/* reexport */ warning), 7631 WritingFlow: () => (/* reexport */ writing_flow), 7632 __experimentalBlockAlignmentMatrixControl: () => (/* reexport */ block_alignment_matrix_control), 7633 __experimentalBlockFullHeightAligmentControl: () => (/* reexport */ block_full_height_alignment_control), 7634 __experimentalBlockPatternSetup: () => (/* reexport */ block_pattern_setup), 7635 __experimentalBlockPatternsList: () => (/* reexport */ block_patterns_list), 7636 __experimentalBlockVariationPicker: () => (/* reexport */ block_variation_picker), 7637 __experimentalBlockVariationTransforms: () => (/* reexport */ block_variation_transforms), 7638 __experimentalBorderRadiusControl: () => (/* reexport */ BorderRadiusControl), 7639 __experimentalColorGradientControl: () => (/* reexport */ control), 7640 __experimentalColorGradientSettingsDropdown: () => (/* reexport */ ColorGradientSettingsDropdown), 7641 __experimentalDateFormatPicker: () => (/* reexport */ DateFormatPicker), 7642 __experimentalDuotoneControl: () => (/* reexport */ duotone_control), 7643 __experimentalFontAppearanceControl: () => (/* reexport */ FontAppearanceControl), 7644 __experimentalFontFamilyControl: () => (/* reexport */ FontFamilyControl), 7645 __experimentalGetBorderClassesAndStyles: () => (/* reexport */ getBorderClassesAndStyles), 7646 __experimentalGetColorClassesAndStyles: () => (/* reexport */ getColorClassesAndStyles), 7647 __experimentalGetElementClassName: () => (/* reexport */ __experimentalGetElementClassName), 7648 __experimentalGetGapCSSValue: () => (/* reexport */ getGapCSSValue), 7649 __experimentalGetGradientClass: () => (/* reexport */ __experimentalGetGradientClass), 7650 __experimentalGetGradientObjectByGradientValue: () => (/* reexport */ __experimentalGetGradientObjectByGradientValue), 7651 __experimentalGetShadowClassesAndStyles: () => (/* reexport */ getShadowClassesAndStyles), 7652 __experimentalGetSpacingClassesAndStyles: () => (/* reexport */ getSpacingClassesAndStyles), 7653 __experimentalImageEditor: () => (/* reexport */ ImageEditor), 7654 __experimentalImageSizeControl: () => (/* reexport */ ImageSizeControl), 7655 __experimentalImageURLInputUI: () => (/* reexport */ ImageURLInputUI), 7656 __experimentalInspectorPopoverHeader: () => (/* reexport */ InspectorPopoverHeader), 7657 __experimentalLetterSpacingControl: () => (/* reexport */ LetterSpacingControl), 7658 __experimentalLibrary: () => (/* reexport */ library), 7659 __experimentalLinkControl: () => (/* reexport */ link_control), 7660 __experimentalLinkControlSearchInput: () => (/* reexport */ search_input), 7661 __experimentalLinkControlSearchItem: () => (/* reexport */ search_item), 7662 __experimentalLinkControlSearchResults: () => (/* reexport */ LinkControlSearchResults), 7663 __experimentalListView: () => (/* reexport */ components_list_view), 7664 __experimentalPanelColorGradientSettings: () => (/* reexport */ panel_color_gradient_settings), 7665 __experimentalPreviewOptions: () => (/* reexport */ PreviewOptions), 7666 __experimentalPublishDateTimePicker: () => (/* reexport */ publish_date_time_picker), 7667 __experimentalRecursionProvider: () => (/* reexport */ DeprecatedExperimentalRecursionProvider), 7668 __experimentalResponsiveBlockControl: () => (/* reexport */ responsive_block_control), 7669 __experimentalSpacingSizesControl: () => (/* reexport */ SpacingSizesControl), 7670 __experimentalTextDecorationControl: () => (/* reexport */ TextDecorationControl), 7671 __experimentalTextTransformControl: () => (/* reexport */ TextTransformControl), 7672 __experimentalUnitControl: () => (/* reexport */ UnitControl), 7673 __experimentalUseBlockOverlayActive: () => (/* reexport */ useBlockOverlayActive), 7674 __experimentalUseBlockPreview: () => (/* reexport */ useBlockPreview), 7675 __experimentalUseBorderProps: () => (/* reexport */ useBorderProps), 7676 __experimentalUseColorProps: () => (/* reexport */ useColorProps), 7677 __experimentalUseCustomSides: () => (/* reexport */ useCustomSides), 7678 __experimentalUseGradient: () => (/* reexport */ __experimentalUseGradient), 7679 __experimentalUseHasRecursion: () => (/* reexport */ DeprecatedExperimentalUseHasRecursion), 7680 __experimentalUseMultipleOriginColorsAndGradients: () => (/* reexport */ useMultipleOriginColorsAndGradients), 7681 __experimentalUseResizeCanvas: () => (/* reexport */ useResizeCanvas), 7682 __experimentalWritingModeControl: () => (/* reexport */ WritingModeControl), 7683 __unstableBlockNameContext: () => (/* reexport */ block_name_context), 7684 __unstableBlockSettingsMenuFirstItem: () => (/* reexport */ block_settings_menu_first_item), 7685 __unstableBlockToolbarLastItem: () => (/* reexport */ block_toolbar_last_item), 7686 __unstableEditorStyles: () => (/* reexport */ editor_styles), 7687 __unstableIframe: () => (/* reexport */ iframe), 7688 __unstableInserterMenuExtension: () => (/* reexport */ inserter_menu_extension), 7689 __unstableRichTextInputEvent: () => (/* reexport */ __unstableRichTextInputEvent), 7690 __unstableUseBlockSelectionClearer: () => (/* reexport */ useBlockSelectionClearer), 7691 __unstableUseClipboardHandler: () => (/* reexport */ __unstableUseClipboardHandler), 7692 __unstableUseMouseMoveTypingReset: () => (/* reexport */ useMouseMoveTypingReset), 7693 __unstableUseTypewriter: () => (/* reexport */ useTypewriter), 7694 __unstableUseTypingObserver: () => (/* reexport */ useTypingObserver), 7695 createCustomColorsHOC: () => (/* reexport */ createCustomColorsHOC), 7696 getColorClassName: () => (/* reexport */ getColorClassName), 7697 getColorObjectByAttributeValues: () => (/* reexport */ getColorObjectByAttributeValues), 7698 getColorObjectByColorValue: () => (/* reexport */ getColorObjectByColorValue), 7699 getComputedFluidTypographyValue: () => (/* reexport */ getComputedFluidTypographyValue), 7700 getCustomValueFromPreset: () => (/* reexport */ getCustomValueFromPreset), 7701 getFontSize: () => (/* reexport */ utils_getFontSize), 7702 getFontSizeClass: () => (/* reexport */ getFontSizeClass), 7703 getFontSizeObjectByValue: () => (/* reexport */ utils_getFontSizeObjectByValue), 7704 getGradientSlugByValue: () => (/* reexport */ getGradientSlugByValue), 7705 getGradientValueBySlug: () => (/* reexport */ getGradientValueBySlug), 7706 getPxFromCssUnit: () => (/* reexport */ get_px_from_css_unit), 7707 getSpacingPresetCssVar: () => (/* reexport */ getSpacingPresetCssVar), 7708 getTypographyClassesAndStyles: () => (/* reexport */ getTypographyClassesAndStyles), 7709 isValueSpacingPreset: () => (/* reexport */ isValueSpacingPreset), 7710 privateApis: () => (/* reexport */ privateApis), 7711 store: () => (/* reexport */ store), 7712 storeConfig: () => (/* reexport */ storeConfig), 7713 transformStyles: () => (/* reexport */ transform_styles), 7714 useBlockBindingsUtils: () => (/* reexport */ useBlockBindingsUtils), 7715 useBlockCommands: () => (/* reexport */ useBlockCommands), 7716 useBlockDisplayInformation: () => (/* reexport */ useBlockDisplayInformation), 7717 useBlockEditContext: () => (/* reexport */ useBlockEditContext), 7718 useBlockEditingMode: () => (/* reexport */ useBlockEditingMode), 7719 useBlockProps: () => (/* reexport */ use_block_props_useBlockProps), 7720 useCachedTruthy: () => (/* reexport */ useCachedTruthy), 7721 useHasRecursion: () => (/* reexport */ useHasRecursion), 7722 useInnerBlocksProps: () => (/* reexport */ useInnerBlocksProps), 7723 useSetting: () => (/* reexport */ useSetting), 7724 useSettings: () => (/* reexport */ use_settings_useSettings), 7725 useStyleOverride: () => (/* reexport */ useStyleOverride), 7726 withColorContext: () => (/* reexport */ with_color_context), 7727 withColors: () => (/* reexport */ withColors), 7728 withFontSizes: () => (/* reexport */ with_font_sizes) 7729 }); 7730 7731 // NAMESPACE OBJECT: ./node_modules/@wordpress/block-editor/build-module/store/private-selectors.js 7732 var private_selectors_namespaceObject = {}; 7733 __webpack_require__.r(private_selectors_namespaceObject); 7734 __webpack_require__.d(private_selectors_namespaceObject, { 7735 getAllPatterns: () => (getAllPatterns), 7736 getBlockRemovalRules: () => (getBlockRemovalRules), 7737 getBlockSettings: () => (getBlockSettings), 7738 getBlockStyles: () => (getBlockStyles), 7739 getBlockWithoutAttributes: () => (getBlockWithoutAttributes), 7740 getContentLockingParent: () => (getContentLockingParent), 7741 getEnabledBlockParents: () => (getEnabledBlockParents), 7742 getEnabledClientIdsTree: () => (getEnabledClientIdsTree), 7743 getExpandedBlock: () => (getExpandedBlock), 7744 getInserterMediaCategories: () => (getInserterMediaCategories), 7745 getLastFocus: () => (getLastFocus), 7746 getLastInsertedBlocksClientIds: () => (getLastInsertedBlocksClientIds), 7747 getOpenedBlockSettingsMenu: () => (getOpenedBlockSettingsMenu), 7748 getParentSectionBlock: () => (getParentSectionBlock), 7749 getPatternBySlug: () => (getPatternBySlug), 7750 getRegisteredInserterMediaCategories: () => (getRegisteredInserterMediaCategories), 7751 getRemovalPromptData: () => (getRemovalPromptData), 7752 getReusableBlocks: () => (getReusableBlocks), 7753 getSectionRootClientId: () => (getSectionRootClientId), 7754 getStyleOverrides: () => (getStyleOverrides), 7755 getTemporarilyEditingAsBlocks: () => (getTemporarilyEditingAsBlocks), 7756 getTemporarilyEditingFocusModeToRevert: () => (getTemporarilyEditingFocusModeToRevert), 7757 getZoomLevel: () => (getZoomLevel), 7758 hasAllowedPatterns: () => (hasAllowedPatterns), 7759 isBlockInterfaceHidden: () => (private_selectors_isBlockInterfaceHidden), 7760 isBlockSubtreeDisabled: () => (isBlockSubtreeDisabled), 7761 isDragging: () => (private_selectors_isDragging), 7762 isResolvingPatterns: () => (isResolvingPatterns), 7763 isSectionBlock: () => (isSectionBlock), 7764 isZoomOut: () => (isZoomOut), 7765 isZoomOutMode: () => (isZoomOutMode) 7766 }); 7767 7768 // NAMESPACE OBJECT: ./node_modules/@wordpress/block-editor/build-module/store/selectors.js 7769 var selectors_namespaceObject = {}; 7770 __webpack_require__.r(selectors_namespaceObject); 7771 __webpack_require__.d(selectors_namespaceObject, { 7772 __experimentalGetActiveBlockIdByBlockNames: () => (__experimentalGetActiveBlockIdByBlockNames), 7773 __experimentalGetAllowedBlocks: () => (__experimentalGetAllowedBlocks), 7774 __experimentalGetAllowedPatterns: () => (__experimentalGetAllowedPatterns), 7775 __experimentalGetBlockListSettingsForBlocks: () => (__experimentalGetBlockListSettingsForBlocks), 7776 __experimentalGetDirectInsertBlock: () => (__experimentalGetDirectInsertBlock), 7777 __experimentalGetGlobalBlocksByName: () => (__experimentalGetGlobalBlocksByName), 7778 __experimentalGetLastBlockAttributeChanges: () => (__experimentalGetLastBlockAttributeChanges), 7779 __experimentalGetParsedPattern: () => (__experimentalGetParsedPattern), 7780 __experimentalGetPatternTransformItems: () => (__experimentalGetPatternTransformItems), 7781 __experimentalGetPatternsByBlockTypes: () => (__experimentalGetPatternsByBlockTypes), 7782 __experimentalGetReusableBlockTitle: () => (__experimentalGetReusableBlockTitle), 7783 __unstableGetBlockWithoutInnerBlocks: () => (__unstableGetBlockWithoutInnerBlocks), 7784 __unstableGetClientIdWithClientIdsTree: () => (__unstableGetClientIdWithClientIdsTree), 7785 __unstableGetClientIdsTree: () => (__unstableGetClientIdsTree), 7786 __unstableGetContentLockingParent: () => (__unstableGetContentLockingParent), 7787 __unstableGetEditorMode: () => (__unstableGetEditorMode), 7788 __unstableGetSelectedBlocksWithPartialSelection: () => (__unstableGetSelectedBlocksWithPartialSelection), 7789 __unstableGetTemporarilyEditingAsBlocks: () => (__unstableGetTemporarilyEditingAsBlocks), 7790 __unstableGetTemporarilyEditingFocusModeToRevert: () => (__unstableGetTemporarilyEditingFocusModeToRevert), 7791 __unstableGetVisibleBlocks: () => (__unstableGetVisibleBlocks), 7792 __unstableHasActiveBlockOverlayActive: () => (__unstableHasActiveBlockOverlayActive), 7793 __unstableIsFullySelected: () => (__unstableIsFullySelected), 7794 __unstableIsLastBlockChangeIgnored: () => (__unstableIsLastBlockChangeIgnored), 7795 __unstableIsSelectionCollapsed: () => (__unstableIsSelectionCollapsed), 7796 __unstableIsSelectionMergeable: () => (__unstableIsSelectionMergeable), 7797 __unstableIsWithinBlockOverlay: () => (__unstableIsWithinBlockOverlay), 7798 __unstableSelectionHasUnmergeableBlock: () => (__unstableSelectionHasUnmergeableBlock), 7799 areInnerBlocksControlled: () => (areInnerBlocksControlled), 7800 canEditBlock: () => (canEditBlock), 7801 canInsertBlockType: () => (canInsertBlockType), 7802 canInsertBlocks: () => (canInsertBlocks), 7803 canLockBlockType: () => (canLockBlockType), 7804 canMoveBlock: () => (canMoveBlock), 7805 canMoveBlocks: () => (canMoveBlocks), 7806 canRemoveBlock: () => (canRemoveBlock), 7807 canRemoveBlocks: () => (canRemoveBlocks), 7808 didAutomaticChange: () => (didAutomaticChange), 7809 getAdjacentBlockClientId: () => (getAdjacentBlockClientId), 7810 getAllowedBlocks: () => (getAllowedBlocks), 7811 getBlock: () => (getBlock), 7812 getBlockAttributes: () => (getBlockAttributes), 7813 getBlockCount: () => (getBlockCount), 7814 getBlockEditingMode: () => (getBlockEditingMode), 7815 getBlockHierarchyRootClientId: () => (getBlockHierarchyRootClientId), 7816 getBlockIndex: () => (getBlockIndex), 7817 getBlockInsertionPoint: () => (getBlockInsertionPoint), 7818 getBlockListSettings: () => (getBlockListSettings), 7819 getBlockMode: () => (getBlockMode), 7820 getBlockName: () => (getBlockName), 7821 getBlockNamesByClientId: () => (getBlockNamesByClientId), 7822 getBlockOrder: () => (getBlockOrder), 7823 getBlockParents: () => (getBlockParents), 7824 getBlockParentsByBlockName: () => (getBlockParentsByBlockName), 7825 getBlockRootClientId: () => (getBlockRootClientId), 7826 getBlockSelectionEnd: () => (getBlockSelectionEnd), 7827 getBlockSelectionStart: () => (getBlockSelectionStart), 7828 getBlockTransformItems: () => (getBlockTransformItems), 7829 getBlocks: () => (getBlocks), 7830 getBlocksByClientId: () => (getBlocksByClientId), 7831 getBlocksByName: () => (getBlocksByName), 7832 getClientIdsOfDescendants: () => (getClientIdsOfDescendants), 7833 getClientIdsWithDescendants: () => (getClientIdsWithDescendants), 7834 getDirectInsertBlock: () => (getDirectInsertBlock), 7835 getDraggedBlockClientIds: () => (getDraggedBlockClientIds), 7836 getFirstMultiSelectedBlockClientId: () => (getFirstMultiSelectedBlockClientId), 7837 getGlobalBlockCount: () => (getGlobalBlockCount), 7838 getHoveredBlockClientId: () => (getHoveredBlockClientId), 7839 getInserterItems: () => (getInserterItems), 7840 getLastMultiSelectedBlockClientId: () => (getLastMultiSelectedBlockClientId), 7841 getLowestCommonAncestorWithSelectedBlock: () => (getLowestCommonAncestorWithSelectedBlock), 7842 getMultiSelectedBlockClientIds: () => (getMultiSelectedBlockClientIds), 7843 getMultiSelectedBlocks: () => (getMultiSelectedBlocks), 7844 getMultiSelectedBlocksEndClientId: () => (getMultiSelectedBlocksEndClientId), 7845 getMultiSelectedBlocksStartClientId: () => (getMultiSelectedBlocksStartClientId), 7846 getNextBlockClientId: () => (getNextBlockClientId), 7847 getPatternsByBlockTypes: () => (getPatternsByBlockTypes), 7848 getPreviousBlockClientId: () => (getPreviousBlockClientId), 7849 getSelectedBlock: () => (getSelectedBlock), 7850 getSelectedBlockClientId: () => (getSelectedBlockClientId), 7851 getSelectedBlockClientIds: () => (getSelectedBlockClientIds), 7852 getSelectedBlockCount: () => (getSelectedBlockCount), 7853 getSelectedBlocksInitialCaretPosition: () => (getSelectedBlocksInitialCaretPosition), 7854 getSelectionEnd: () => (getSelectionEnd), 7855 getSelectionStart: () => (getSelectionStart), 7856 getSettings: () => (getSettings), 7857 getTemplate: () => (getTemplate), 7858 getTemplateLock: () => (getTemplateLock), 7859 hasBlockMovingClientId: () => (selectors_hasBlockMovingClientId), 7860 hasDraggedInnerBlock: () => (hasDraggedInnerBlock), 7861 hasInserterItems: () => (hasInserterItems), 7862 hasMultiSelection: () => (hasMultiSelection), 7863 hasSelectedBlock: () => (hasSelectedBlock), 7864 hasSelectedInnerBlock: () => (hasSelectedInnerBlock), 7865 isAncestorBeingDragged: () => (isAncestorBeingDragged), 7866 isAncestorMultiSelected: () => (isAncestorMultiSelected), 7867 isBlockBeingDragged: () => (isBlockBeingDragged), 7868 isBlockHighlighted: () => (isBlockHighlighted), 7869 isBlockInsertionPointVisible: () => (isBlockInsertionPointVisible), 7870 isBlockMultiSelected: () => (isBlockMultiSelected), 7871 isBlockSelected: () => (isBlockSelected), 7872 isBlockValid: () => (isBlockValid), 7873 isBlockVisible: () => (isBlockVisible), 7874 isBlockWithinSelection: () => (isBlockWithinSelection), 7875 isCaretWithinFormattedText: () => (isCaretWithinFormattedText), 7876 isDraggingBlocks: () => (isDraggingBlocks), 7877 isFirstMultiSelectedBlock: () => (isFirstMultiSelectedBlock), 7878 isGroupable: () => (isGroupable), 7879 isLastBlockChangePersistent: () => (isLastBlockChangePersistent), 7880 isMultiSelecting: () => (selectors_isMultiSelecting), 7881 isNavigationMode: () => (isNavigationMode), 7882 isSelectionEnabled: () => (selectors_isSelectionEnabled), 7883 isTyping: () => (selectors_isTyping), 7884 isUngroupable: () => (isUngroupable), 7885 isValidTemplate: () => (isValidTemplate), 7886 wasBlockJustInserted: () => (wasBlockJustInserted) 7887 }); 7888 7889 // NAMESPACE OBJECT: ./node_modules/@wordpress/block-editor/build-module/store/private-actions.js 7890 var private_actions_namespaceObject = {}; 7891 __webpack_require__.r(private_actions_namespaceObject); 7892 __webpack_require__.d(private_actions_namespaceObject, { 7893 __experimentalUpdateSettings: () => (__experimentalUpdateSettings), 7894 clearBlockRemovalPrompt: () => (clearBlockRemovalPrompt), 7895 deleteStyleOverride: () => (deleteStyleOverride), 7896 ensureDefaultBlock: () => (ensureDefaultBlock), 7897 expandBlock: () => (expandBlock), 7898 hideBlockInterface: () => (hideBlockInterface), 7899 modifyContentLockBlock: () => (modifyContentLockBlock), 7900 privateRemoveBlocks: () => (privateRemoveBlocks), 7901 resetZoomLevel: () => (resetZoomLevel), 7902 setBlockRemovalRules: () => (setBlockRemovalRules), 7903 setLastFocus: () => (setLastFocus), 7904 setOpenedBlockSettingsMenu: () => (setOpenedBlockSettingsMenu), 7905 setStyleOverride: () => (setStyleOverride), 7906 setZoomLevel: () => (setZoomLevel), 7907 showBlockInterface: () => (showBlockInterface), 7908 startDragging: () => (startDragging), 7909 stopDragging: () => (stopDragging), 7910 stopEditingAsBlocks: () => (stopEditingAsBlocks) 7911 }); 7912 7913 // NAMESPACE OBJECT: ./node_modules/@wordpress/block-editor/build-module/store/actions.js 7914 var actions_namespaceObject = {}; 7915 __webpack_require__.r(actions_namespaceObject); 7916 __webpack_require__.d(actions_namespaceObject, { 7917 __unstableDeleteSelection: () => (__unstableDeleteSelection), 7918 __unstableExpandSelection: () => (__unstableExpandSelection), 7919 __unstableMarkAutomaticChange: () => (__unstableMarkAutomaticChange), 7920 __unstableMarkLastChangeAsPersistent: () => (__unstableMarkLastChangeAsPersistent), 7921 __unstableMarkNextChangeAsNotPersistent: () => (__unstableMarkNextChangeAsNotPersistent), 7922 __unstableSaveReusableBlock: () => (__unstableSaveReusableBlock), 7923 __unstableSetEditorMode: () => (__unstableSetEditorMode), 7924 __unstableSetTemporarilyEditingAsBlocks: () => (__unstableSetTemporarilyEditingAsBlocks), 7925 __unstableSplitSelection: () => (__unstableSplitSelection), 7926 clearSelectedBlock: () => (clearSelectedBlock), 7927 duplicateBlocks: () => (duplicateBlocks), 7928 enterFormattedText: () => (enterFormattedText), 7929 exitFormattedText: () => (exitFormattedText), 7930 flashBlock: () => (flashBlock), 7931 hideInsertionPoint: () => (hideInsertionPoint), 7932 hoverBlock: () => (hoverBlock), 7933 insertAfterBlock: () => (insertAfterBlock), 7934 insertBeforeBlock: () => (insertBeforeBlock), 7935 insertBlock: () => (insertBlock), 7936 insertBlocks: () => (insertBlocks), 7937 insertDefaultBlock: () => (insertDefaultBlock), 7938 mergeBlocks: () => (mergeBlocks), 7939 moveBlockToPosition: () => (moveBlockToPosition), 7940 moveBlocksDown: () => (moveBlocksDown), 7941 moveBlocksToPosition: () => (moveBlocksToPosition), 7942 moveBlocksUp: () => (moveBlocksUp), 7943 multiSelect: () => (multiSelect), 7944 receiveBlocks: () => (receiveBlocks), 7945 registerInserterMediaCategory: () => (registerInserterMediaCategory), 7946 removeBlock: () => (removeBlock), 7947 removeBlocks: () => (removeBlocks), 7948 replaceBlock: () => (replaceBlock), 7949 replaceBlocks: () => (replaceBlocks), 7950 replaceInnerBlocks: () => (replaceInnerBlocks), 7951 resetBlocks: () => (resetBlocks), 7952 resetSelection: () => (resetSelection), 7953 selectBlock: () => (selectBlock), 7954 selectNextBlock: () => (selectNextBlock), 7955 selectPreviousBlock: () => (selectPreviousBlock), 7956 selectionChange: () => (selectionChange), 7957 setBlockEditingMode: () => (setBlockEditingMode), 7958 setBlockMovingClientId: () => (setBlockMovingClientId), 7959 setBlockVisibility: () => (setBlockVisibility), 7960 setHasControlledInnerBlocks: () => (setHasControlledInnerBlocks), 7961 setNavigationMode: () => (setNavigationMode), 7962 setTemplateValidity: () => (setTemplateValidity), 7963 showInsertionPoint: () => (showInsertionPoint), 7964 startDraggingBlocks: () => (startDraggingBlocks), 7965 startMultiSelect: () => (startMultiSelect), 7966 startTyping: () => (startTyping), 7967 stopDraggingBlocks: () => (stopDraggingBlocks), 7968 stopMultiSelect: () => (stopMultiSelect), 7969 stopTyping: () => (stopTyping), 7970 synchronizeTemplate: () => (synchronizeTemplate), 7971 toggleBlockHighlight: () => (toggleBlockHighlight), 7972 toggleBlockMode: () => (toggleBlockMode), 7973 toggleSelection: () => (toggleSelection), 7974 unsetBlockEditingMode: () => (unsetBlockEditingMode), 7975 updateBlock: () => (updateBlock), 7976 updateBlockAttributes: () => (updateBlockAttributes), 7977 updateBlockListSettings: () => (updateBlockListSettings), 7978 updateSettings: () => (updateSettings), 7979 validateBlocksToTemplate: () => (validateBlocksToTemplate) 7980 }); 7981 7982 // NAMESPACE OBJECT: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/index.js 7983 var global_styles_namespaceObject = {}; 7984 __webpack_require__.r(global_styles_namespaceObject); 7985 __webpack_require__.d(global_styles_namespaceObject, { 7986 AdvancedPanel: () => (AdvancedPanel), 7987 BackgroundPanel: () => (background_panel_BackgroundImagePanel), 7988 BorderPanel: () => (BorderPanel), 7989 ColorPanel: () => (ColorPanel), 7990 DimensionsPanel: () => (DimensionsPanel), 7991 FiltersPanel: () => (FiltersPanel), 7992 GlobalStylesContext: () => (GlobalStylesContext), 7993 ImageSettingsPanel: () => (ImageSettingsPanel), 7994 TypographyPanel: () => (TypographyPanel), 7995 areGlobalStyleConfigsEqual: () => (areGlobalStyleConfigsEqual), 7996 getBlockCSSSelector: () => (getBlockCSSSelector), 7997 getBlockSelectors: () => (getBlockSelectors), 7998 getGlobalStylesChanges: () => (getGlobalStylesChanges), 7999 getLayoutStyles: () => (getLayoutStyles), 8000 toStyles: () => (toStyles), 8001 useGlobalSetting: () => (useGlobalSetting), 8002 useGlobalStyle: () => (useGlobalStyle), 8003 useGlobalStylesOutput: () => (useGlobalStylesOutput), 8004 useGlobalStylesOutputWithConfig: () => (useGlobalStylesOutputWithConfig), 8005 useGlobalStylesReset: () => (useGlobalStylesReset), 8006 useHasBackgroundPanel: () => (useHasBackgroundPanel), 8007 useHasBorderPanel: () => (useHasBorderPanel), 8008 useHasBorderPanelControls: () => (useHasBorderPanelControls), 8009 useHasColorPanel: () => (useHasColorPanel), 8010 useHasDimensionsPanel: () => (useHasDimensionsPanel), 8011 useHasFiltersPanel: () => (useHasFiltersPanel), 8012 useHasImageSettingsPanel: () => (useHasImageSettingsPanel), 8013 useHasTypographyPanel: () => (useHasTypographyPanel), 8014 useSettingsForBlockElement: () => (useSettingsForBlockElement) 8015 }); 8016 8017 ;// CONCATENATED MODULE: external ["wp","blocks"] 8018 const external_wp_blocks_namespaceObject = window["wp"]["blocks"]; 8019 ;// CONCATENATED MODULE: external ["wp","element"] 8020 const external_wp_element_namespaceObject = window["wp"]["element"]; 8021 ;// CONCATENATED MODULE: external ["wp","data"] 8022 const external_wp_data_namespaceObject = window["wp"]["data"]; 8023 ;// CONCATENATED MODULE: external ["wp","compose"] 8024 const external_wp_compose_namespaceObject = window["wp"]["compose"]; 8025 ;// CONCATENATED MODULE: external ["wp","hooks"] 8026 const external_wp_hooks_namespaceObject = window["wp"]["hooks"]; 8027 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-edit/context.js 8028 /** 8029 * WordPress dependencies 8030 */ 8031 8032 const mayDisplayControlsKey = Symbol('mayDisplayControls'); 8033 const mayDisplayParentControlsKey = Symbol('mayDisplayParentControls'); 8034 const blockEditingModeKey = Symbol('blockEditingMode'); 8035 const blockBindingsKey = Symbol('blockBindings'); 8036 const isPreviewModeKey = Symbol('isPreviewMode'); 8037 const DEFAULT_BLOCK_EDIT_CONTEXT = { 8038 name: '', 8039 isSelected: false 8040 }; 8041 const Context = (0,external_wp_element_namespaceObject.createContext)(DEFAULT_BLOCK_EDIT_CONTEXT); 8042 const { 8043 Provider 8044 } = Context; 8045 8046 8047 /** 8048 * A hook that returns the block edit context. 8049 * 8050 * @return {Object} Block edit context 8051 */ 8052 function useBlockEditContext() { 8053 return (0,external_wp_element_namespaceObject.useContext)(Context); 8054 } 8055 8056 ;// CONCATENATED MODULE: external ["wp","deprecated"] 8057 const external_wp_deprecated_namespaceObject = window["wp"]["deprecated"]; 8058 var external_wp_deprecated_default = /*#__PURE__*/__webpack_require__.n(external_wp_deprecated_namespaceObject); 8059 // EXTERNAL MODULE: ./node_modules/fast-deep-equal/es6/index.js 8060 var es6 = __webpack_require__(7734); 8061 var es6_default = /*#__PURE__*/__webpack_require__.n(es6); 8062 ;// CONCATENATED MODULE: external ["wp","i18n"] 8063 const external_wp_i18n_namespaceObject = window["wp"]["i18n"]; 8064 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/defaults.js 8065 /** 8066 * WordPress dependencies 8067 */ 8068 8069 const PREFERENCES_DEFAULTS = { 8070 insertUsage: {} 8071 }; 8072 8073 /** 8074 * The default editor settings 8075 * 8076 * @typedef {Object} SETTINGS_DEFAULT 8077 * @property {boolean} alignWide Enable/Disable Wide/Full Alignments 8078 * @property {boolean} supportsLayout Enable/disable layouts support in container blocks. 8079 * @property {boolean} imageEditing Image Editing settings set to false to disable. 8080 * @property {Array} imageSizes Available image sizes 8081 * @property {number} maxWidth Max width to constraint resizing 8082 * @property {boolean|Array} allowedBlockTypes Allowed block types 8083 * @property {boolean} hasFixedToolbar Whether or not the editor toolbar is fixed 8084 * @property {boolean} distractionFree Whether or not the editor UI is distraction free 8085 * @property {boolean} focusMode Whether the focus mode is enabled or not 8086 * @property {Array} styles Editor Styles 8087 * @property {boolean} keepCaretInsideBlock Whether caret should move between blocks in edit mode 8088 * @property {string} bodyPlaceholder Empty post placeholder 8089 * @property {string} titlePlaceholder Empty title placeholder 8090 * @property {boolean} canLockBlocks Whether the user can manage Block Lock state 8091 * @property {boolean} codeEditingEnabled Whether or not the user can switch to the code editor 8092 * @property {boolean} generateAnchors Enable/Disable auto anchor generation for Heading blocks 8093 * @property {boolean} enableOpenverseMediaCategory Enable/Disable the Openverse media category in the inserter. 8094 * @property {boolean} clearBlockSelection Whether the block editor should clear selection on mousedown when a block is not clicked. 8095 * @property {boolean} __experimentalCanUserUseUnfilteredHTML Whether the user should be able to use unfiltered HTML or the HTML should be filtered e.g., to remove elements considered insecure like iframes. 8096 * @property {boolean} __experimentalBlockDirectory Whether the user has enabled the Block Directory 8097 * @property {Array} __experimentalBlockPatterns Array of objects representing the block patterns 8098 * @property {Array} __experimentalBlockPatternCategories Array of objects representing the block pattern categories 8099 */ 8100 const SETTINGS_DEFAULTS = { 8101 alignWide: false, 8102 supportsLayout: true, 8103 // colors setting is not used anymore now defaults are passed from theme.json on the server and core has its own defaults. 8104 // The setting is only kept for backward compatibility purposes. 8105 colors: [{ 8106 name: (0,external_wp_i18n_namespaceObject.__)('Black'), 8107 slug: 'black', 8108 color: '#000000' 8109 }, { 8110 name: (0,external_wp_i18n_namespaceObject.__)('Cyan bluish gray'), 8111 slug: 'cyan-bluish-gray', 8112 color: '#abb8c3' 8113 }, { 8114 name: (0,external_wp_i18n_namespaceObject.__)('White'), 8115 slug: 'white', 8116 color: '#ffffff' 8117 }, { 8118 name: (0,external_wp_i18n_namespaceObject.__)('Pale pink'), 8119 slug: 'pale-pink', 8120 color: '#f78da7' 8121 }, { 8122 name: (0,external_wp_i18n_namespaceObject.__)('Vivid red'), 8123 slug: 'vivid-red', 8124 color: '#cf2e2e' 8125 }, { 8126 name: (0,external_wp_i18n_namespaceObject.__)('Luminous vivid orange'), 8127 slug: 'luminous-vivid-orange', 8128 color: '#ff6900' 8129 }, { 8130 name: (0,external_wp_i18n_namespaceObject.__)('Luminous vivid amber'), 8131 slug: 'luminous-vivid-amber', 8132 color: '#fcb900' 8133 }, { 8134 name: (0,external_wp_i18n_namespaceObject.__)('Light green cyan'), 8135 slug: 'light-green-cyan', 8136 color: '#7bdcb5' 8137 }, { 8138 name: (0,external_wp_i18n_namespaceObject.__)('Vivid green cyan'), 8139 slug: 'vivid-green-cyan', 8140 color: '#00d084' 8141 }, { 8142 name: (0,external_wp_i18n_namespaceObject.__)('Pale cyan blue'), 8143 slug: 'pale-cyan-blue', 8144 color: '#8ed1fc' 8145 }, { 8146 name: (0,external_wp_i18n_namespaceObject.__)('Vivid cyan blue'), 8147 slug: 'vivid-cyan-blue', 8148 color: '#0693e3' 8149 }, { 8150 name: (0,external_wp_i18n_namespaceObject.__)('Vivid purple'), 8151 slug: 'vivid-purple', 8152 color: '#9b51e0' 8153 }], 8154 // fontSizes setting is not used anymore now defaults are passed from theme.json on the server and core has its own defaults. 8155 // The setting is only kept for backward compatibility purposes. 8156 fontSizes: [{ 8157 name: (0,external_wp_i18n_namespaceObject._x)('Small', 'font size name'), 8158 size: 13, 8159 slug: 'small' 8160 }, { 8161 name: (0,external_wp_i18n_namespaceObject._x)('Normal', 'font size name'), 8162 size: 16, 8163 slug: 'normal' 8164 }, { 8165 name: (0,external_wp_i18n_namespaceObject._x)('Medium', 'font size name'), 8166 size: 20, 8167 slug: 'medium' 8168 }, { 8169 name: (0,external_wp_i18n_namespaceObject._x)('Large', 'font size name'), 8170 size: 36, 8171 slug: 'large' 8172 }, { 8173 name: (0,external_wp_i18n_namespaceObject._x)('Huge', 'font size name'), 8174 size: 42, 8175 slug: 'huge' 8176 }], 8177 // Image default size slug. 8178 imageDefaultSize: 'large', 8179 imageSizes: [{ 8180 slug: 'thumbnail', 8181 name: (0,external_wp_i18n_namespaceObject.__)('Thumbnail') 8182 }, { 8183 slug: 'medium', 8184 name: (0,external_wp_i18n_namespaceObject.__)('Medium') 8185 }, { 8186 slug: 'large', 8187 name: (0,external_wp_i18n_namespaceObject.__)('Large') 8188 }, { 8189 slug: 'full', 8190 name: (0,external_wp_i18n_namespaceObject.__)('Full Size') 8191 }], 8192 // Allow plugin to disable Image Editor if need be. 8193 imageEditing: true, 8194 // This is current max width of the block inner area 8195 // It's used to constraint image resizing and this value could be overridden later by themes 8196 maxWidth: 580, 8197 // Allowed block types for the editor, defaulting to true (all supported). 8198 allowedBlockTypes: true, 8199 // Maximum upload size in bytes allowed for the site. 8200 maxUploadFileSize: 0, 8201 // List of allowed mime types and file extensions. 8202 allowedMimeTypes: null, 8203 // Allows to disable block locking interface. 8204 canLockBlocks: true, 8205 // Allows to disable Openverse media category in the inserter. 8206 enableOpenverseMediaCategory: true, 8207 clearBlockSelection: true, 8208 __experimentalCanUserUseUnfilteredHTML: false, 8209 __experimentalBlockDirectory: false, 8210 __mobileEnablePageTemplates: false, 8211 __experimentalBlockPatterns: [], 8212 __experimentalBlockPatternCategories: [], 8213 __unstableIsPreviewMode: false, 8214 // These settings will be completely revamped in the future. 8215 // The goal is to evolve this into an API which will instruct 8216 // the block inspector to animate transitions between what it 8217 // displays based on the relationship between the selected block 8218 // and its parent, and only enable it if the parent is controlling 8219 // its children blocks. 8220 blockInspectorAnimation: { 8221 animationParent: 'core/navigation', 8222 'core/navigation': { 8223 enterDirection: 'leftToRight' 8224 }, 8225 'core/navigation-submenu': { 8226 enterDirection: 'rightToLeft' 8227 }, 8228 'core/navigation-link': { 8229 enterDirection: 'rightToLeft' 8230 }, 8231 'core/search': { 8232 enterDirection: 'rightToLeft' 8233 }, 8234 'core/social-links': { 8235 enterDirection: 'rightToLeft' 8236 }, 8237 'core/page-list': { 8238 enterDirection: 'rightToLeft' 8239 }, 8240 'core/spacer': { 8241 enterDirection: 'rightToLeft' 8242 }, 8243 'core/home-link': { 8244 enterDirection: 'rightToLeft' 8245 }, 8246 'core/site-title': { 8247 enterDirection: 'rightToLeft' 8248 }, 8249 'core/site-logo': { 8250 enterDirection: 'rightToLeft' 8251 } 8252 }, 8253 generateAnchors: false, 8254 // gradients setting is not used anymore now defaults are passed from theme.json on the server and core has its own defaults. 8255 // The setting is only kept for backward compatibility purposes. 8256 gradients: [{ 8257 name: (0,external_wp_i18n_namespaceObject.__)('Vivid cyan blue to vivid purple'), 8258 gradient: 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)', 8259 slug: 'vivid-cyan-blue-to-vivid-purple' 8260 }, { 8261 name: (0,external_wp_i18n_namespaceObject.__)('Light green cyan to vivid green cyan'), 8262 gradient: 'linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%)', 8263 slug: 'light-green-cyan-to-vivid-green-cyan' 8264 }, { 8265 name: (0,external_wp_i18n_namespaceObject.__)('Luminous vivid amber to luminous vivid orange'), 8266 gradient: 'linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%)', 8267 slug: 'luminous-vivid-amber-to-luminous-vivid-orange' 8268 }, { 8269 name: (0,external_wp_i18n_namespaceObject.__)('Luminous vivid orange to vivid red'), 8270 gradient: 'linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%)', 8271 slug: 'luminous-vivid-orange-to-vivid-red' 8272 }, { 8273 name: (0,external_wp_i18n_namespaceObject.__)('Very light gray to cyan bluish gray'), 8274 gradient: 'linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%)', 8275 slug: 'very-light-gray-to-cyan-bluish-gray' 8276 }, { 8277 name: (0,external_wp_i18n_namespaceObject.__)('Cool to warm spectrum'), 8278 gradient: 'linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%)', 8279 slug: 'cool-to-warm-spectrum' 8280 }, { 8281 name: (0,external_wp_i18n_namespaceObject.__)('Blush light purple'), 8282 gradient: 'linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%)', 8283 slug: 'blush-light-purple' 8284 }, { 8285 name: (0,external_wp_i18n_namespaceObject.__)('Blush bordeaux'), 8286 gradient: 'linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%)', 8287 slug: 'blush-bordeaux' 8288 }, { 8289 name: (0,external_wp_i18n_namespaceObject.__)('Luminous dusk'), 8290 gradient: 'linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%)', 8291 slug: 'luminous-dusk' 8292 }, { 8293 name: (0,external_wp_i18n_namespaceObject.__)('Pale ocean'), 8294 gradient: 'linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%)', 8295 slug: 'pale-ocean' 8296 }, { 8297 name: (0,external_wp_i18n_namespaceObject.__)('Electric grass'), 8298 gradient: 'linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%)', 8299 slug: 'electric-grass' 8300 }, { 8301 name: (0,external_wp_i18n_namespaceObject.__)('Midnight'), 8302 gradient: 'linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%)', 8303 slug: 'midnight' 8304 }], 8305 __unstableResolvedAssets: { 8306 styles: [], 8307 scripts: [] 8308 } 8309 }; 8310 8311 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/array.js 8312 /** 8313 * Insert one or multiple elements into a given position of an array. 8314 * 8315 * @param {Array} array Source array. 8316 * @param {*} elements Elements to insert. 8317 * @param {number} index Insert Position. 8318 * 8319 * @return {Array} Result. 8320 */ 8321 function insertAt(array, elements, index) { 8322 return [...array.slice(0, index), ...(Array.isArray(elements) ? elements : [elements]), ...array.slice(index)]; 8323 } 8324 8325 /** 8326 * Moves an element in an array. 8327 * 8328 * @param {Array} array Source array. 8329 * @param {number} from Source index. 8330 * @param {number} to Destination index. 8331 * @param {number} count Number of elements to move. 8332 * 8333 * @return {Array} Result. 8334 */ 8335 function moveTo(array, from, to, count = 1) { 8336 const withoutMovedElements = [...array]; 8337 withoutMovedElements.splice(from, count); 8338 return insertAt(withoutMovedElements, array.slice(from, from + count), to); 8339 } 8340 8341 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/reducer.js 8342 /** 8343 * External dependencies 8344 */ 8345 8346 8347 /** 8348 * WordPress dependencies 8349 */ 8350 8351 8352 8353 /** 8354 * Internal dependencies 8355 */ 8356 8357 8358 const identity = x => x; 8359 8360 /** 8361 * Given an array of blocks, returns an object where each key is a nesting 8362 * context, the value of which is an array of block client IDs existing within 8363 * that nesting context. 8364 * 8365 * @param {Array} blocks Blocks to map. 8366 * @param {?string} rootClientId Assumed root client ID. 8367 * 8368 * @return {Object} Block order map object. 8369 */ 8370 function mapBlockOrder(blocks, rootClientId = '') { 8371 const result = new Map(); 8372 const current = []; 8373 result.set(rootClientId, current); 8374 blocks.forEach(block => { 8375 const { 8376 clientId, 8377 innerBlocks 8378 } = block; 8379 current.push(clientId); 8380 mapBlockOrder(innerBlocks, clientId).forEach((order, subClientId) => { 8381 result.set(subClientId, order); 8382 }); 8383 }); 8384 return result; 8385 } 8386 8387 /** 8388 * Given an array of blocks, returns an object where each key contains 8389 * the clientId of the block and the value is the parent of the block. 8390 * 8391 * @param {Array} blocks Blocks to map. 8392 * @param {?string} rootClientId Assumed root client ID. 8393 * 8394 * @return {Object} Block order map object. 8395 */ 8396 function mapBlockParents(blocks, rootClientId = '') { 8397 const result = []; 8398 const stack = [[rootClientId, blocks]]; 8399 while (stack.length) { 8400 const [parent, currentBlocks] = stack.shift(); 8401 currentBlocks.forEach(({ 8402 innerBlocks, 8403 ...block 8404 }) => { 8405 result.push([block.clientId, parent]); 8406 if (innerBlocks?.length) { 8407 stack.push([block.clientId, innerBlocks]); 8408 } 8409 }); 8410 } 8411 return result; 8412 } 8413 8414 /** 8415 * Helper method to iterate through all blocks, recursing into inner blocks, 8416 * applying a transformation function to each one. 8417 * Returns a flattened object with the transformed blocks. 8418 * 8419 * @param {Array} blocks Blocks to flatten. 8420 * @param {Function} transform Transforming function to be applied to each block. 8421 * 8422 * @return {Array} Flattened object. 8423 */ 8424 function flattenBlocks(blocks, transform = identity) { 8425 const result = []; 8426 const stack = [...blocks]; 8427 while (stack.length) { 8428 const { 8429 innerBlocks, 8430 ...block 8431 } = stack.shift(); 8432 stack.push(...innerBlocks); 8433 result.push([block.clientId, transform(block)]); 8434 } 8435 return result; 8436 } 8437 function getFlattenedClientIds(blocks) { 8438 const result = {}; 8439 const stack = [...blocks]; 8440 while (stack.length) { 8441 const { 8442 innerBlocks, 8443 ...block 8444 } = stack.shift(); 8445 stack.push(...innerBlocks); 8446 result[block.clientId] = true; 8447 } 8448 return result; 8449 } 8450 8451 /** 8452 * Given an array of blocks, returns an object containing all blocks, without 8453 * attributes, recursing into inner blocks. Keys correspond to the block client 8454 * ID, the value of which is the attributes object. 8455 * 8456 * @param {Array} blocks Blocks to flatten. 8457 * 8458 * @return {Array} Flattened block attributes object. 8459 */ 8460 function getFlattenedBlocksWithoutAttributes(blocks) { 8461 return flattenBlocks(blocks, block => { 8462 const { 8463 attributes, 8464 ...restBlock 8465 } = block; 8466 return restBlock; 8467 }); 8468 } 8469 8470 /** 8471 * Given an array of blocks, returns an object containing all block attributes, 8472 * recursing into inner blocks. Keys correspond to the block client ID, the 8473 * value of which is the attributes object. 8474 * 8475 * @param {Array} blocks Blocks to flatten. 8476 * 8477 * @return {Array} Flattened block attributes object. 8478 */ 8479 function getFlattenedBlockAttributes(blocks) { 8480 return flattenBlocks(blocks, block => block.attributes); 8481 } 8482 8483 /** 8484 * Returns true if the two object arguments have the same keys, or false 8485 * otherwise. 8486 * 8487 * @param {Object} a First object. 8488 * @param {Object} b Second object. 8489 * 8490 * @return {boolean} Whether the two objects have the same keys. 8491 */ 8492 function hasSameKeys(a, b) { 8493 return es6_default()(Object.keys(a), Object.keys(b)); 8494 } 8495 8496 /** 8497 * Returns true if, given the currently dispatching action and the previously 8498 * dispatched action, the two actions are updating the same block attribute, or 8499 * false otherwise. 8500 * 8501 * @param {Object} action Currently dispatching action. 8502 * @param {Object} lastAction Previously dispatched action. 8503 * 8504 * @return {boolean} Whether actions are updating the same block attribute. 8505 */ 8506 function isUpdatingSameBlockAttribute(action, lastAction) { 8507 return action.type === 'UPDATE_BLOCK_ATTRIBUTES' && lastAction !== undefined && lastAction.type === 'UPDATE_BLOCK_ATTRIBUTES' && es6_default()(action.clientIds, lastAction.clientIds) && hasSameKeys(action.attributes, lastAction.attributes); 8508 } 8509 function updateBlockTreeForBlocks(state, blocks) { 8510 const treeToUpdate = state.tree; 8511 const stack = [...blocks]; 8512 const flattenedBlocks = [...blocks]; 8513 while (stack.length) { 8514 const block = stack.shift(); 8515 stack.push(...block.innerBlocks); 8516 flattenedBlocks.push(...block.innerBlocks); 8517 } 8518 // Create objects before mutating them, that way it's always defined. 8519 for (const block of flattenedBlocks) { 8520 treeToUpdate.set(block.clientId, {}); 8521 } 8522 for (const block of flattenedBlocks) { 8523 treeToUpdate.set(block.clientId, Object.assign(treeToUpdate.get(block.clientId), { 8524 ...state.byClientId.get(block.clientId), 8525 attributes: state.attributes.get(block.clientId), 8526 innerBlocks: block.innerBlocks.map(subBlock => treeToUpdate.get(subBlock.clientId)) 8527 })); 8528 } 8529 } 8530 function updateParentInnerBlocksInTree(state, updatedClientIds, updateChildrenOfUpdatedClientIds = false) { 8531 const treeToUpdate = state.tree; 8532 const uncontrolledParents = new Set([]); 8533 const controlledParents = new Set(); 8534 for (const clientId of updatedClientIds) { 8535 let current = updateChildrenOfUpdatedClientIds ? clientId : state.parents.get(clientId); 8536 do { 8537 if (state.controlledInnerBlocks[current]) { 8538 // Should stop on controlled blocks. 8539 // If we reach a controlled parent, break out of the loop. 8540 controlledParents.add(current); 8541 break; 8542 } else { 8543 // Else continue traversing up through parents. 8544 uncontrolledParents.add(current); 8545 current = state.parents.get(current); 8546 } 8547 } while (current !== undefined); 8548 } 8549 8550 // To make sure the order of assignments doesn't matter, 8551 // we first create empty objects and mutates the inner blocks later. 8552 for (const clientId of uncontrolledParents) { 8553 treeToUpdate.set(clientId, { 8554 ...treeToUpdate.get(clientId) 8555 }); 8556 } 8557 for (const clientId of uncontrolledParents) { 8558 treeToUpdate.get(clientId).innerBlocks = (state.order.get(clientId) || []).map(subClientId => treeToUpdate.get(subClientId)); 8559 } 8560 8561 // Controlled parent blocks, need a dedicated key for their inner blocks 8562 // to be used when doing getBlocks( controlledBlockClientId ). 8563 for (const clientId of controlledParents) { 8564 treeToUpdate.set('controlled||' + clientId, { 8565 innerBlocks: (state.order.get(clientId) || []).map(subClientId => treeToUpdate.get(subClientId)) 8566 }); 8567 } 8568 } 8569 8570 /** 8571 * Higher-order reducer intended to compute full block objects key for each block in the post. 8572 * This is a denormalization to optimize the performance of the getBlock selectors and avoid 8573 * recomputing the block objects and avoid heavy memoization. 8574 * 8575 * @param {Function} reducer Original reducer function. 8576 * 8577 * @return {Function} Enhanced reducer function. 8578 */ 8579 const withBlockTree = reducer => (state = {}, action) => { 8580 const newState = reducer(state, action); 8581 if (newState === state) { 8582 return state; 8583 } 8584 newState.tree = state.tree ? state.tree : new Map(); 8585 switch (action.type) { 8586 case 'RECEIVE_BLOCKS': 8587 case 'INSERT_BLOCKS': 8588 { 8589 newState.tree = new Map(newState.tree); 8590 updateBlockTreeForBlocks(newState, action.blocks); 8591 updateParentInnerBlocksInTree(newState, action.rootClientId ? [action.rootClientId] : [''], true); 8592 break; 8593 } 8594 case 'UPDATE_BLOCK': 8595 newState.tree = new Map(newState.tree); 8596 newState.tree.set(action.clientId, { 8597 ...newState.tree.get(action.clientId), 8598 ...newState.byClientId.get(action.clientId), 8599 attributes: newState.attributes.get(action.clientId) 8600 }); 8601 updateParentInnerBlocksInTree(newState, [action.clientId], false); 8602 break; 8603 case 'SYNC_DERIVED_BLOCK_ATTRIBUTES': 8604 case 'UPDATE_BLOCK_ATTRIBUTES': 8605 { 8606 newState.tree = new Map(newState.tree); 8607 action.clientIds.forEach(clientId => { 8608 newState.tree.set(clientId, { 8609 ...newState.tree.get(clientId), 8610 attributes: newState.attributes.get(clientId) 8611 }); 8612 }); 8613 updateParentInnerBlocksInTree(newState, action.clientIds, false); 8614 break; 8615 } 8616 case 'REPLACE_BLOCKS_AUGMENTED_WITH_CHILDREN': 8617 { 8618 const inserterClientIds = getFlattenedClientIds(action.blocks); 8619 newState.tree = new Map(newState.tree); 8620 action.replacedClientIds.forEach(clientId => { 8621 newState.tree.delete(clientId); 8622 // Controlled inner blocks are only removed 8623 // if the block doesn't move to another position 8624 // otherwise their content will be lost. 8625 if (!inserterClientIds[clientId]) { 8626 newState.tree.delete('controlled||' + clientId); 8627 } 8628 }); 8629 updateBlockTreeForBlocks(newState, action.blocks); 8630 updateParentInnerBlocksInTree(newState, action.blocks.map(b => b.clientId), false); 8631 8632 // If there are no replaced blocks, it means we're removing blocks so we need to update their parent. 8633 const parentsOfRemovedBlocks = []; 8634 for (const clientId of action.clientIds) { 8635 const parentId = state.parents.get(clientId); 8636 if (parentId !== undefined && (parentId === '' || newState.byClientId.get(parentId))) { 8637 parentsOfRemovedBlocks.push(parentId); 8638 } 8639 } 8640 updateParentInnerBlocksInTree(newState, parentsOfRemovedBlocks, true); 8641 break; 8642 } 8643 case 'REMOVE_BLOCKS_AUGMENTED_WITH_CHILDREN': 8644 const parentsOfRemovedBlocks = []; 8645 for (const clientId of action.clientIds) { 8646 const parentId = state.parents.get(clientId); 8647 if (parentId !== undefined && (parentId === '' || newState.byClientId.get(parentId))) { 8648 parentsOfRemovedBlocks.push(parentId); 8649 } 8650 } 8651 newState.tree = new Map(newState.tree); 8652 action.removedClientIds.forEach(clientId => { 8653 newState.tree.delete(clientId); 8654 newState.tree.delete('controlled||' + clientId); 8655 }); 8656 updateParentInnerBlocksInTree(newState, parentsOfRemovedBlocks, true); 8657 break; 8658 case 'MOVE_BLOCKS_TO_POSITION': 8659 { 8660 const updatedBlockUids = []; 8661 if (action.fromRootClientId) { 8662 updatedBlockUids.push(action.fromRootClientId); 8663 } else { 8664 updatedBlockUids.push(''); 8665 } 8666 if (action.toRootClientId) { 8667 updatedBlockUids.push(action.toRootClientId); 8668 } 8669 newState.tree = new Map(newState.tree); 8670 updateParentInnerBlocksInTree(newState, updatedBlockUids, true); 8671 break; 8672 } 8673 case 'MOVE_BLOCKS_UP': 8674 case 'MOVE_BLOCKS_DOWN': 8675 { 8676 const updatedBlockUids = [action.rootClientId ? action.rootClientId : '']; 8677 newState.tree = new Map(newState.tree); 8678 updateParentInnerBlocksInTree(newState, updatedBlockUids, true); 8679 break; 8680 } 8681 case 'SAVE_REUSABLE_BLOCK_SUCCESS': 8682 { 8683 const updatedBlockUids = []; 8684 newState.attributes.forEach((attributes, clientId) => { 8685 if (newState.byClientId.get(clientId).name === 'core/block' && attributes.ref === action.updatedId) { 8686 updatedBlockUids.push(clientId); 8687 } 8688 }); 8689 newState.tree = new Map(newState.tree); 8690 updatedBlockUids.forEach(clientId => { 8691 newState.tree.set(clientId, { 8692 ...newState.byClientId.get(clientId), 8693 attributes: newState.attributes.get(clientId), 8694 innerBlocks: newState.tree.get(clientId).innerBlocks 8695 }); 8696 }); 8697 updateParentInnerBlocksInTree(newState, updatedBlockUids, false); 8698 } 8699 } 8700 return newState; 8701 }; 8702 8703 /** 8704 * Higher-order reducer intended to augment the blocks reducer, assigning an 8705 * `isPersistentChange` property value corresponding to whether a change in 8706 * state can be considered as persistent. All changes are considered persistent 8707 * except when updating the same block attribute as in the previous action. 8708 * 8709 * @param {Function} reducer Original reducer function. 8710 * 8711 * @return {Function} Enhanced reducer function. 8712 */ 8713 function withPersistentBlockChange(reducer) { 8714 let lastAction; 8715 let markNextChangeAsNotPersistent = false; 8716 let explicitPersistent; 8717 return (state, action) => { 8718 let nextState = reducer(state, action); 8719 let nextIsPersistentChange; 8720 if (action.type === 'SET_EXPLICIT_PERSISTENT') { 8721 var _state$isPersistentCh; 8722 explicitPersistent = action.isPersistentChange; 8723 nextIsPersistentChange = (_state$isPersistentCh = state.isPersistentChange) !== null && _state$isPersistentCh !== void 0 ? _state$isPersistentCh : true; 8724 } 8725 if (explicitPersistent !== undefined) { 8726 nextIsPersistentChange = explicitPersistent; 8727 return nextIsPersistentChange === nextState.isPersistentChange ? nextState : { 8728 ...nextState, 8729 isPersistentChange: nextIsPersistentChange 8730 }; 8731 } 8732 const isExplicitPersistentChange = action.type === 'MARK_LAST_CHANGE_AS_PERSISTENT' || markNextChangeAsNotPersistent; 8733 8734 // Defer to previous state value (or default) unless changing or 8735 // explicitly marking as persistent. 8736 if (state === nextState && !isExplicitPersistentChange) { 8737 var _state$isPersistentCh2; 8738 markNextChangeAsNotPersistent = action.type === 'MARK_NEXT_CHANGE_AS_NOT_PERSISTENT'; 8739 nextIsPersistentChange = (_state$isPersistentCh2 = state?.isPersistentChange) !== null && _state$isPersistentCh2 !== void 0 ? _state$isPersistentCh2 : true; 8740 if (state.isPersistentChange === nextIsPersistentChange) { 8741 return state; 8742 } 8743 return { 8744 ...nextState, 8745 isPersistentChange: nextIsPersistentChange 8746 }; 8747 } 8748 nextState = { 8749 ...nextState, 8750 isPersistentChange: isExplicitPersistentChange ? !markNextChangeAsNotPersistent : !isUpdatingSameBlockAttribute(action, lastAction) 8751 }; 8752 8753 // In comparing against the previous action, consider only those which 8754 // would have qualified as one which would have been ignored or not 8755 // have resulted in a changed state. 8756 lastAction = action; 8757 markNextChangeAsNotPersistent = action.type === 'MARK_NEXT_CHANGE_AS_NOT_PERSISTENT'; 8758 return nextState; 8759 }; 8760 } 8761 8762 /** 8763 * Higher-order reducer intended to augment the blocks reducer, assigning an 8764 * `isIgnoredChange` property value corresponding to whether a change in state 8765 * can be considered as ignored. A change is considered ignored when the result 8766 * of an action not incurred by direct user interaction. 8767 * 8768 * @param {Function} reducer Original reducer function. 8769 * 8770 * @return {Function} Enhanced reducer function. 8771 */ 8772 function withIgnoredBlockChange(reducer) { 8773 /** 8774 * Set of action types for which a blocks state change should be ignored. 8775 * 8776 * @type {Set} 8777 */ 8778 const IGNORED_ACTION_TYPES = new Set(['RECEIVE_BLOCKS']); 8779 return (state, action) => { 8780 const nextState = reducer(state, action); 8781 if (nextState !== state) { 8782 nextState.isIgnoredChange = IGNORED_ACTION_TYPES.has(action.type); 8783 } 8784 return nextState; 8785 }; 8786 } 8787 8788 /** 8789 * Higher-order reducer targeting the combined blocks reducer, augmenting 8790 * block client IDs in remove action to include cascade of inner blocks. 8791 * 8792 * @param {Function} reducer Original reducer function. 8793 * 8794 * @return {Function} Enhanced reducer function. 8795 */ 8796 const withInnerBlocksRemoveCascade = reducer => (state, action) => { 8797 // Gets all children which need to be removed. 8798 const getAllChildren = clientIds => { 8799 let result = clientIds; 8800 for (let i = 0; i < result.length; i++) { 8801 if (!state.order.get(result[i]) || action.keepControlledInnerBlocks && action.keepControlledInnerBlocks[result[i]]) { 8802 continue; 8803 } 8804 if (result === clientIds) { 8805 result = [...result]; 8806 } 8807 result.push(...state.order.get(result[i])); 8808 } 8809 return result; 8810 }; 8811 if (state) { 8812 switch (action.type) { 8813 case 'REMOVE_BLOCKS': 8814 action = { 8815 ...action, 8816 type: 'REMOVE_BLOCKS_AUGMENTED_WITH_CHILDREN', 8817 removedClientIds: getAllChildren(action.clientIds) 8818 }; 8819 break; 8820 case 'REPLACE_BLOCKS': 8821 action = { 8822 ...action, 8823 type: 'REPLACE_BLOCKS_AUGMENTED_WITH_CHILDREN', 8824 replacedClientIds: getAllChildren(action.clientIds) 8825 }; 8826 break; 8827 } 8828 } 8829 return reducer(state, action); 8830 }; 8831 8832 /** 8833 * Higher-order reducer which targets the combined blocks reducer and handles 8834 * the `RESET_BLOCKS` action. When dispatched, this action will replace all 8835 * blocks that exist in the post, leaving blocks that exist only in state (e.g. 8836 * reusable blocks and blocks controlled by inner blocks controllers) alone. 8837 * 8838 * @param {Function} reducer Original reducer function. 8839 * 8840 * @return {Function} Enhanced reducer function. 8841 */ 8842 const withBlockReset = reducer => (state, action) => { 8843 if (action.type === 'RESET_BLOCKS') { 8844 const newState = { 8845 ...state, 8846 byClientId: new Map(getFlattenedBlocksWithoutAttributes(action.blocks)), 8847 attributes: new Map(getFlattenedBlockAttributes(action.blocks)), 8848 order: mapBlockOrder(action.blocks), 8849 parents: new Map(mapBlockParents(action.blocks)), 8850 controlledInnerBlocks: {} 8851 }; 8852 newState.tree = new Map(state?.tree); 8853 updateBlockTreeForBlocks(newState, action.blocks); 8854 newState.tree.set('', { 8855 innerBlocks: action.blocks.map(subBlock => newState.tree.get(subBlock.clientId)) 8856 }); 8857 return newState; 8858 } 8859 return reducer(state, action); 8860 }; 8861 8862 /** 8863 * Higher-order reducer which targets the combined blocks reducer and handles 8864 * the `REPLACE_INNER_BLOCKS` action. When dispatched, this action the state 8865 * should become equivalent to the execution of a `REMOVE_BLOCKS` action 8866 * containing all the child's of the root block followed by the execution of 8867 * `INSERT_BLOCKS` with the new blocks. 8868 * 8869 * @param {Function} reducer Original reducer function. 8870 * 8871 * @return {Function} Enhanced reducer function. 8872 */ 8873 const withReplaceInnerBlocks = reducer => (state, action) => { 8874 if (action.type !== 'REPLACE_INNER_BLOCKS') { 8875 return reducer(state, action); 8876 } 8877 8878 // Finds every nested inner block controller. We must check the action blocks 8879 // and not just the block parent state because some inner block controllers 8880 // should be deleted if specified, whereas others should not be deleted. If 8881 // a controlled should not be deleted, then we need to avoid deleting its 8882 // inner blocks from the block state because its inner blocks will not be 8883 // attached to the block in the action. 8884 const nestedControllers = {}; 8885 if (Object.keys(state.controlledInnerBlocks).length) { 8886 const stack = [...action.blocks]; 8887 while (stack.length) { 8888 const { 8889 innerBlocks, 8890 ...block 8891 } = stack.shift(); 8892 stack.push(...innerBlocks); 8893 if (!!state.controlledInnerBlocks[block.clientId]) { 8894 nestedControllers[block.clientId] = true; 8895 } 8896 } 8897 } 8898 8899 // The `keepControlledInnerBlocks` prop will keep the inner blocks of the 8900 // marked block in the block state so that they can be reattached to the 8901 // marked block when we re-insert everything a few lines below. 8902 let stateAfterBlocksRemoval = state; 8903 if (state.order.get(action.rootClientId)) { 8904 stateAfterBlocksRemoval = reducer(stateAfterBlocksRemoval, { 8905 type: 'REMOVE_BLOCKS', 8906 keepControlledInnerBlocks: nestedControllers, 8907 clientIds: state.order.get(action.rootClientId) 8908 }); 8909 } 8910 let stateAfterInsert = stateAfterBlocksRemoval; 8911 if (action.blocks.length) { 8912 stateAfterInsert = reducer(stateAfterInsert, { 8913 ...action, 8914 type: 'INSERT_BLOCKS', 8915 index: 0 8916 }); 8917 8918 // We need to re-attach the controlled inner blocks to the blocks tree and 8919 // preserve their block order. Otherwise, an inner block controller's blocks 8920 // will be deleted entirely from its entity. 8921 const stateAfterInsertOrder = new Map(stateAfterInsert.order); 8922 Object.keys(nestedControllers).forEach(key => { 8923 if (state.order.get(key)) { 8924 stateAfterInsertOrder.set(key, state.order.get(key)); 8925 } 8926 }); 8927 stateAfterInsert.order = stateAfterInsertOrder; 8928 stateAfterInsert.tree = new Map(stateAfterInsert.tree); 8929 Object.keys(nestedControllers).forEach(_key => { 8930 const key = `controlled||$_key}`; 8931 if (state.tree.has(key)) { 8932 stateAfterInsert.tree.set(key, state.tree.get(key)); 8933 } 8934 }); 8935 } 8936 return stateAfterInsert; 8937 }; 8938 8939 /** 8940 * Higher-order reducer which targets the combined blocks reducer and handles 8941 * the `SAVE_REUSABLE_BLOCK_SUCCESS` action. This action can't be handled by 8942 * regular reducers and needs a higher-order reducer since it needs access to 8943 * both `byClientId` and `attributes` simultaneously. 8944 * 8945 * @param {Function} reducer Original reducer function. 8946 * 8947 * @return {Function} Enhanced reducer function. 8948 */ 8949 const withSaveReusableBlock = reducer => (state, action) => { 8950 if (state && action.type === 'SAVE_REUSABLE_BLOCK_SUCCESS') { 8951 const { 8952 id, 8953 updatedId 8954 } = action; 8955 8956 // If a temporary reusable block is saved, we swap the temporary id with the final one. 8957 if (id === updatedId) { 8958 return state; 8959 } 8960 state = { 8961 ...state 8962 }; 8963 state.attributes = new Map(state.attributes); 8964 state.attributes.forEach((attributes, clientId) => { 8965 const { 8966 name 8967 } = state.byClientId.get(clientId); 8968 if (name === 'core/block' && attributes.ref === id) { 8969 state.attributes.set(clientId, { 8970 ...attributes, 8971 ref: updatedId 8972 }); 8973 } 8974 }); 8975 } 8976 return reducer(state, action); 8977 }; 8978 /** 8979 * Higher-order reducer which removes blocks from state when switching parent block controlled state. 8980 * 8981 * @param {Function} reducer Original reducer function. 8982 * 8983 * @return {Function} Enhanced reducer function. 8984 */ 8985 const withResetControlledBlocks = reducer => (state, action) => { 8986 if (action.type === 'SET_HAS_CONTROLLED_INNER_BLOCKS') { 8987 // when switching a block from controlled to uncontrolled or inverse, 8988 // we need to remove its content first. 8989 const tempState = reducer(state, { 8990 type: 'REPLACE_INNER_BLOCKS', 8991 rootClientId: action.clientId, 8992 blocks: [] 8993 }); 8994 return reducer(tempState, action); 8995 } 8996 return reducer(state, action); 8997 }; 8998 8999 /** 9000 * Reducer returning the blocks state. 9001 * 9002 * @param {Object} state Current state. 9003 * @param {Object} action Dispatched action. 9004 * 9005 * @return {Object} Updated state. 9006 */ 9007 const blocks = (0,external_wp_compose_namespaceObject.pipe)(external_wp_data_namespaceObject.combineReducers, withSaveReusableBlock, 9008 // Needs to be before withBlockCache. 9009 withBlockTree, 9010 // Needs to be before withInnerBlocksRemoveCascade. 9011 withInnerBlocksRemoveCascade, withReplaceInnerBlocks, 9012 // Needs to be after withInnerBlocksRemoveCascade. 9013 withBlockReset, withPersistentBlockChange, withIgnoredBlockChange, withResetControlledBlocks)({ 9014 // The state is using a Map instead of a plain object for performance reasons. 9015 // You can run the "./test/performance.js" unit test to check the impact 9016 // code changes can have on this reducer. 9017 byClientId(state = new Map(), action) { 9018 switch (action.type) { 9019 case 'RECEIVE_BLOCKS': 9020 case 'INSERT_BLOCKS': 9021 { 9022 const newState = new Map(state); 9023 getFlattenedBlocksWithoutAttributes(action.blocks).forEach(([key, value]) => { 9024 newState.set(key, value); 9025 }); 9026 return newState; 9027 } 9028 case 'UPDATE_BLOCK': 9029 { 9030 // Ignore updates if block isn't known. 9031 if (!state.has(action.clientId)) { 9032 return state; 9033 } 9034 9035 // Do nothing if only attributes change. 9036 const { 9037 attributes, 9038 ...changes 9039 } = action.updates; 9040 if (Object.values(changes).length === 0) { 9041 return state; 9042 } 9043 const newState = new Map(state); 9044 newState.set(action.clientId, { 9045 ...state.get(action.clientId), 9046 ...changes 9047 }); 9048 return newState; 9049 } 9050 case 'REPLACE_BLOCKS_AUGMENTED_WITH_CHILDREN': 9051 { 9052 if (!action.blocks) { 9053 return state; 9054 } 9055 const newState = new Map(state); 9056 action.replacedClientIds.forEach(clientId => { 9057 newState.delete(clientId); 9058 }); 9059 getFlattenedBlocksWithoutAttributes(action.blocks).forEach(([key, value]) => { 9060 newState.set(key, value); 9061 }); 9062 return newState; 9063 } 9064 case 'REMOVE_BLOCKS_AUGMENTED_WITH_CHILDREN': 9065 { 9066 const newState = new Map(state); 9067 action.removedClientIds.forEach(clientId => { 9068 newState.delete(clientId); 9069 }); 9070 return newState; 9071 } 9072 } 9073 return state; 9074 }, 9075 // The state is using a Map instead of a plain object for performance reasons. 9076 // You can run the "./test/performance.js" unit test to check the impact 9077 // code changes can have on this reducer. 9078 attributes(state = new Map(), action) { 9079 switch (action.type) { 9080 case 'RECEIVE_BLOCKS': 9081 case 'INSERT_BLOCKS': 9082 { 9083 const newState = new Map(state); 9084 getFlattenedBlockAttributes(action.blocks).forEach(([key, value]) => { 9085 newState.set(key, value); 9086 }); 9087 return newState; 9088 } 9089 case 'UPDATE_BLOCK': 9090 { 9091 // Ignore updates if block isn't known or there are no attribute changes. 9092 if (!state.get(action.clientId) || !action.updates.attributes) { 9093 return state; 9094 } 9095 const newState = new Map(state); 9096 newState.set(action.clientId, { 9097 ...state.get(action.clientId), 9098 ...action.updates.attributes 9099 }); 9100 return newState; 9101 } 9102 case 'SYNC_DERIVED_BLOCK_ATTRIBUTES': 9103 case 'UPDATE_BLOCK_ATTRIBUTES': 9104 { 9105 // Avoid a state change if none of the block IDs are known. 9106 if (action.clientIds.every(id => !state.get(id))) { 9107 return state; 9108 } 9109 let hasChange = false; 9110 const newState = new Map(state); 9111 for (const clientId of action.clientIds) { 9112 var _action$attributes; 9113 const updatedAttributeEntries = Object.entries(action.uniqueByBlock ? action.attributes[clientId] : (_action$attributes = action.attributes) !== null && _action$attributes !== void 0 ? _action$attributes : {}); 9114 if (updatedAttributeEntries.length === 0) { 9115 continue; 9116 } 9117 let hasUpdatedAttributes = false; 9118 const existingAttributes = state.get(clientId); 9119 const newAttributes = {}; 9120 updatedAttributeEntries.forEach(([key, value]) => { 9121 if (existingAttributes[key] !== value) { 9122 hasUpdatedAttributes = true; 9123 newAttributes[key] = value; 9124 } 9125 }); 9126 hasChange = hasChange || hasUpdatedAttributes; 9127 if (hasUpdatedAttributes) { 9128 newState.set(clientId, { 9129 ...existingAttributes, 9130 ...newAttributes 9131 }); 9132 } 9133 } 9134 return hasChange ? newState : state; 9135 } 9136 case 'REPLACE_BLOCKS_AUGMENTED_WITH_CHILDREN': 9137 { 9138 if (!action.blocks) { 9139 return state; 9140 } 9141 const newState = new Map(state); 9142 action.replacedClientIds.forEach(clientId => { 9143 newState.delete(clientId); 9144 }); 9145 getFlattenedBlockAttributes(action.blocks).forEach(([key, value]) => { 9146 newState.set(key, value); 9147 }); 9148 return newState; 9149 } 9150 case 'REMOVE_BLOCKS_AUGMENTED_WITH_CHILDREN': 9151 { 9152 const newState = new Map(state); 9153 action.removedClientIds.forEach(clientId => { 9154 newState.delete(clientId); 9155 }); 9156 return newState; 9157 } 9158 } 9159 return state; 9160 }, 9161 // The state is using a Map instead of a plain object for performance reasons. 9162 // You can run the "./test/performance.js" unit test to check the impact 9163 // code changes can have on this reducer. 9164 order(state = new Map(), action) { 9165 switch (action.type) { 9166 case 'RECEIVE_BLOCKS': 9167 { 9168 var _state$get; 9169 const blockOrder = mapBlockOrder(action.blocks); 9170 const newState = new Map(state); 9171 blockOrder.forEach((order, clientId) => { 9172 if (clientId !== '') { 9173 newState.set(clientId, order); 9174 } 9175 }); 9176 newState.set('', ((_state$get = state.get('')) !== null && _state$get !== void 0 ? _state$get : []).concat(blockOrder[''])); 9177 return newState; 9178 } 9179 case 'INSERT_BLOCKS': 9180 { 9181 const { 9182 rootClientId = '' 9183 } = action; 9184 const subState = state.get(rootClientId) || []; 9185 const mappedBlocks = mapBlockOrder(action.blocks, rootClientId); 9186 const { 9187 index = subState.length 9188 } = action; 9189 const newState = new Map(state); 9190 mappedBlocks.forEach((order, clientId) => { 9191 newState.set(clientId, order); 9192 }); 9193 newState.set(rootClientId, insertAt(subState, mappedBlocks.get(rootClientId), index)); 9194 return newState; 9195 } 9196 case 'MOVE_BLOCKS_TO_POSITION': 9197 { 9198 var _state$get$filter; 9199 const { 9200 fromRootClientId = '', 9201 toRootClientId = '', 9202 clientIds 9203 } = action; 9204 const { 9205 index = state.get(toRootClientId).length 9206 } = action; 9207 9208 // Moving inside the same parent block. 9209 if (fromRootClientId === toRootClientId) { 9210 const subState = state.get(toRootClientId); 9211 const fromIndex = subState.indexOf(clientIds[0]); 9212 const newState = new Map(state); 9213 newState.set(toRootClientId, moveTo(state.get(toRootClientId), fromIndex, index, clientIds.length)); 9214 return newState; 9215 } 9216 9217 // Moving from a parent block to another. 9218 const newState = new Map(state); 9219 newState.set(fromRootClientId, (_state$get$filter = state.get(fromRootClientId)?.filter(id => !clientIds.includes(id))) !== null && _state$get$filter !== void 0 ? _state$get$filter : []); 9220 newState.set(toRootClientId, insertAt(state.get(toRootClientId), clientIds, index)); 9221 return newState; 9222 } 9223 case 'MOVE_BLOCKS_UP': 9224 { 9225 const { 9226 clientIds, 9227 rootClientId = '' 9228 } = action; 9229 const firstClientId = clientIds[0]; 9230 const subState = state.get(rootClientId); 9231 if (!subState.length || firstClientId === subState[0]) { 9232 return state; 9233 } 9234 const firstIndex = subState.indexOf(firstClientId); 9235 const newState = new Map(state); 9236 newState.set(rootClientId, moveTo(subState, firstIndex, firstIndex - 1, clientIds.length)); 9237 return newState; 9238 } 9239 case 'MOVE_BLOCKS_DOWN': 9240 { 9241 const { 9242 clientIds, 9243 rootClientId = '' 9244 } = action; 9245 const firstClientId = clientIds[0]; 9246 const lastClientId = clientIds[clientIds.length - 1]; 9247 const subState = state.get(rootClientId); 9248 if (!subState.length || lastClientId === subState[subState.length - 1]) { 9249 return state; 9250 } 9251 const firstIndex = subState.indexOf(firstClientId); 9252 const newState = new Map(state); 9253 newState.set(rootClientId, moveTo(subState, firstIndex, firstIndex + 1, clientIds.length)); 9254 return newState; 9255 } 9256 case 'REPLACE_BLOCKS_AUGMENTED_WITH_CHILDREN': 9257 { 9258 const { 9259 clientIds 9260 } = action; 9261 if (!action.blocks) { 9262 return state; 9263 } 9264 const mappedBlocks = mapBlockOrder(action.blocks); 9265 const newState = new Map(state); 9266 action.replacedClientIds.forEach(clientId => { 9267 newState.delete(clientId); 9268 }); 9269 mappedBlocks.forEach((order, clientId) => { 9270 if (clientId !== '') { 9271 newState.set(clientId, order); 9272 } 9273 }); 9274 newState.forEach((order, clientId) => { 9275 const newSubOrder = Object.values(order).reduce((result, subClientId) => { 9276 if (subClientId === clientIds[0]) { 9277 return [...result, ...mappedBlocks.get('')]; 9278 } 9279 if (clientIds.indexOf(subClientId) === -1) { 9280 result.push(subClientId); 9281 } 9282 return result; 9283 }, []); 9284 newState.set(clientId, newSubOrder); 9285 }); 9286 return newState; 9287 } 9288 case 'REMOVE_BLOCKS_AUGMENTED_WITH_CHILDREN': 9289 { 9290 const newState = new Map(state); 9291 // Remove inner block ordering for removed blocks. 9292 action.removedClientIds.forEach(clientId => { 9293 newState.delete(clientId); 9294 }); 9295 newState.forEach((order, clientId) => { 9296 var _order$filter; 9297 const newSubOrder = (_order$filter = order?.filter(id => !action.removedClientIds.includes(id))) !== null && _order$filter !== void 0 ? _order$filter : []; 9298 if (newSubOrder.length !== order.length) { 9299 newState.set(clientId, newSubOrder); 9300 } 9301 }); 9302 return newState; 9303 } 9304 } 9305 return state; 9306 }, 9307 // While technically redundant data as the inverse of `order`, it serves as 9308 // an optimization for the selectors which derive the ancestry of a block. 9309 parents(state = new Map(), action) { 9310 switch (action.type) { 9311 case 'RECEIVE_BLOCKS': 9312 { 9313 const newState = new Map(state); 9314 mapBlockParents(action.blocks).forEach(([key, value]) => { 9315 newState.set(key, value); 9316 }); 9317 return newState; 9318 } 9319 case 'INSERT_BLOCKS': 9320 { 9321 const newState = new Map(state); 9322 mapBlockParents(action.blocks, action.rootClientId || '').forEach(([key, value]) => { 9323 newState.set(key, value); 9324 }); 9325 return newState; 9326 } 9327 case 'MOVE_BLOCKS_TO_POSITION': 9328 { 9329 const newState = new Map(state); 9330 action.clientIds.forEach(id => { 9331 newState.set(id, action.toRootClientId || ''); 9332 }); 9333 return newState; 9334 } 9335 case 'REPLACE_BLOCKS_AUGMENTED_WITH_CHILDREN': 9336 { 9337 const newState = new Map(state); 9338 action.replacedClientIds.forEach(clientId => { 9339 newState.delete(clientId); 9340 }); 9341 mapBlockParents(action.blocks, state.get(action.clientIds[0])).forEach(([key, value]) => { 9342 newState.set(key, value); 9343 }); 9344 return newState; 9345 } 9346 case 'REMOVE_BLOCKS_AUGMENTED_WITH_CHILDREN': 9347 { 9348 const newState = new Map(state); 9349 action.removedClientIds.forEach(clientId => { 9350 newState.delete(clientId); 9351 }); 9352 return newState; 9353 } 9354 } 9355 return state; 9356 }, 9357 controlledInnerBlocks(state = {}, { 9358 type, 9359 clientId, 9360 hasControlledInnerBlocks 9361 }) { 9362 if (type === 'SET_HAS_CONTROLLED_INNER_BLOCKS') { 9363 return { 9364 ...state, 9365 [clientId]: hasControlledInnerBlocks 9366 }; 9367 } 9368 return state; 9369 } 9370 }); 9371 9372 /** 9373 * Reducer returning visibility status of block interface. 9374 * 9375 * @param {boolean} state Current state. 9376 * @param {Object} action Dispatched action. 9377 * 9378 * @return {boolean} Updated state. 9379 */ 9380 function isBlockInterfaceHidden(state = false, action) { 9381 switch (action.type) { 9382 case 'HIDE_BLOCK_INTERFACE': 9383 return true; 9384 case 'SHOW_BLOCK_INTERFACE': 9385 return false; 9386 } 9387 return state; 9388 } 9389 9390 /** 9391 * Reducer returning typing state. 9392 * 9393 * @param {boolean} state Current state. 9394 * @param {Object} action Dispatched action. 9395 * 9396 * @return {boolean} Updated state. 9397 */ 9398 function isTyping(state = false, action) { 9399 switch (action.type) { 9400 case 'START_TYPING': 9401 return true; 9402 case 'STOP_TYPING': 9403 return false; 9404 } 9405 return state; 9406 } 9407 9408 /** 9409 * Reducer returning dragging state. It is possible for a user to be dragging 9410 * data from outside of the editor, so this state is separate from `draggedBlocks`. 9411 * 9412 * @param {boolean} state Current state. 9413 * @param {Object} action Dispatched action. 9414 * 9415 * @return {boolean} Updated state. 9416 */ 9417 function isDragging(state = false, action) { 9418 switch (action.type) { 9419 case 'START_DRAGGING': 9420 return true; 9421 case 'STOP_DRAGGING': 9422 return false; 9423 } 9424 return state; 9425 } 9426 9427 /** 9428 * Reducer returning dragged block client id. 9429 * 9430 * @param {string[]} state Current state. 9431 * @param {Object} action Dispatched action. 9432 * 9433 * @return {string[]} Updated state. 9434 */ 9435 function draggedBlocks(state = [], action) { 9436 switch (action.type) { 9437 case 'START_DRAGGING_BLOCKS': 9438 return action.clientIds; 9439 case 'STOP_DRAGGING_BLOCKS': 9440 return []; 9441 } 9442 return state; 9443 } 9444 9445 /** 9446 * Reducer tracking the visible blocks. 9447 * 9448 * @param {Record<string,boolean>} state Current state. 9449 * @param {Object} action Dispatched action. 9450 * 9451 * @return {Record<string,boolean>} Block visibility. 9452 */ 9453 function blockVisibility(state = {}, action) { 9454 if (action.type === 'SET_BLOCK_VISIBILITY') { 9455 return { 9456 ...state, 9457 ...action.updates 9458 }; 9459 } 9460 return state; 9461 } 9462 9463 /** 9464 * Internal helper reducer for selectionStart and selectionEnd. Can hold a block 9465 * selection, represented by an object with property clientId. 9466 * 9467 * @param {Object} state Current state. 9468 * @param {Object} action Dispatched action. 9469 * 9470 * @return {Object} Updated state. 9471 */ 9472 function selectionHelper(state = {}, action) { 9473 switch (action.type) { 9474 case 'CLEAR_SELECTED_BLOCK': 9475 { 9476 if (state.clientId) { 9477 return {}; 9478 } 9479 return state; 9480 } 9481 case 'SELECT_BLOCK': 9482 if (action.clientId === state.clientId) { 9483 return state; 9484 } 9485 return { 9486 clientId: action.clientId 9487 }; 9488 case 'REPLACE_INNER_BLOCKS': 9489 case 'INSERT_BLOCKS': 9490 { 9491 if (!action.updateSelection || !action.blocks.length) { 9492 return state; 9493 } 9494 return { 9495 clientId: action.blocks[0].clientId 9496 }; 9497 } 9498 case 'REMOVE_BLOCKS': 9499 if (!action.clientIds || !action.clientIds.length || action.clientIds.indexOf(state.clientId) === -1) { 9500 return state; 9501 } 9502 return {}; 9503 case 'REPLACE_BLOCKS': 9504 { 9505 if (action.clientIds.indexOf(state.clientId) === -1) { 9506 return state; 9507 } 9508 const blockToSelect = action.blocks[action.indexToSelect] || action.blocks[action.blocks.length - 1]; 9509 if (!blockToSelect) { 9510 return {}; 9511 } 9512 if (blockToSelect.clientId === state.clientId) { 9513 return state; 9514 } 9515 return { 9516 clientId: blockToSelect.clientId 9517 }; 9518 } 9519 } 9520 return state; 9521 } 9522 9523 /** 9524 * Reducer returning the selection state. 9525 * 9526 * @param {boolean} state Current state. 9527 * @param {Object} action Dispatched action. 9528 * 9529 * @return {boolean} Updated state. 9530 */ 9531 function selection(state = {}, action) { 9532 switch (action.type) { 9533 case 'SELECTION_CHANGE': 9534 if (action.clientId) { 9535 return { 9536 selectionStart: { 9537 clientId: action.clientId, 9538 attributeKey: action.attributeKey, 9539 offset: action.startOffset 9540 }, 9541 selectionEnd: { 9542 clientId: action.clientId, 9543 attributeKey: action.attributeKey, 9544 offset: action.endOffset 9545 } 9546 }; 9547 } 9548 return { 9549 selectionStart: action.start || state.selectionStart, 9550 selectionEnd: action.end || state.selectionEnd 9551 }; 9552 case 'RESET_SELECTION': 9553 const { 9554 selectionStart, 9555 selectionEnd 9556 } = action; 9557 return { 9558 selectionStart, 9559 selectionEnd 9560 }; 9561 case 'MULTI_SELECT': 9562 const { 9563 start, 9564 end 9565 } = action; 9566 if (start === state.selectionStart?.clientId && end === state.selectionEnd?.clientId) { 9567 return state; 9568 } 9569 return { 9570 selectionStart: { 9571 clientId: start 9572 }, 9573 selectionEnd: { 9574 clientId: end 9575 } 9576 }; 9577 case 'RESET_BLOCKS': 9578 const startClientId = state?.selectionStart?.clientId; 9579 const endClientId = state?.selectionEnd?.clientId; 9580 9581 // Do nothing if there's no selected block. 9582 if (!startClientId && !endClientId) { 9583 return state; 9584 } 9585 9586 // If the start of the selection won't exist after reset, remove selection. 9587 if (!action.blocks.some(block => block.clientId === startClientId)) { 9588 return { 9589 selectionStart: {}, 9590 selectionEnd: {} 9591 }; 9592 } 9593 9594 // If the end of the selection won't exist after reset, collapse selection. 9595 if (!action.blocks.some(block => block.clientId === endClientId)) { 9596 return { 9597 ...state, 9598 selectionEnd: state.selectionStart 9599 }; 9600 } 9601 } 9602 const selectionStart = selectionHelper(state.selectionStart, action); 9603 const selectionEnd = selectionHelper(state.selectionEnd, action); 9604 if (selectionStart === state.selectionStart && selectionEnd === state.selectionEnd) { 9605 return state; 9606 } 9607 return { 9608 selectionStart, 9609 selectionEnd 9610 }; 9611 } 9612 9613 /** 9614 * Reducer returning whether the user is multi-selecting. 9615 * 9616 * @param {boolean} state Current state. 9617 * @param {Object} action Dispatched action. 9618 * 9619 * @return {boolean} Updated state. 9620 */ 9621 function isMultiSelecting(state = false, action) { 9622 switch (action.type) { 9623 case 'START_MULTI_SELECT': 9624 return true; 9625 case 'STOP_MULTI_SELECT': 9626 return false; 9627 } 9628 return state; 9629 } 9630 9631 /** 9632 * Reducer returning whether selection is enabled. 9633 * 9634 * @param {boolean} state Current state. 9635 * @param {Object} action Dispatched action. 9636 * 9637 * @return {boolean} Updated state. 9638 */ 9639 function isSelectionEnabled(state = true, action) { 9640 switch (action.type) { 9641 case 'TOGGLE_SELECTION': 9642 return action.isSelectionEnabled; 9643 } 9644 return state; 9645 } 9646 9647 /** 9648 * Reducer returning the data needed to display a prompt when certain blocks 9649 * are removed, or `false` if no such prompt is requested. 9650 * 9651 * @param {boolean} state Current state. 9652 * @param {Object} action Dispatched action. 9653 * 9654 * @return {Object|false} Data for removal prompt display, if any. 9655 */ 9656 function removalPromptData(state = false, action) { 9657 switch (action.type) { 9658 case 'DISPLAY_BLOCK_REMOVAL_PROMPT': 9659 const { 9660 clientIds, 9661 selectPrevious, 9662 message 9663 } = action; 9664 return { 9665 clientIds, 9666 selectPrevious, 9667 message 9668 }; 9669 case 'CLEAR_BLOCK_REMOVAL_PROMPT': 9670 return false; 9671 } 9672 return state; 9673 } 9674 9675 /** 9676 * Reducer returning any rules that a block editor may provide in order to 9677 * prevent a user from accidentally removing certain blocks. These rules are 9678 * then used to display a confirmation prompt to the user. For instance, in the 9679 * Site Editor, the Query Loop block is important enough to warrant such 9680 * confirmation. 9681 * 9682 * The data is a record whose keys are block types (e.g. 'core/query') and 9683 * whose values are the explanation to be shown to users (e.g. 'Query Loop 9684 * displays a list of posts or pages.'). 9685 * 9686 * @param {boolean} state Current state. 9687 * @param {Object} action Dispatched action. 9688 * 9689 * @return {Record<string,string>} Updated state. 9690 */ 9691 function blockRemovalRules(state = false, action) { 9692 switch (action.type) { 9693 case 'SET_BLOCK_REMOVAL_RULES': 9694 return action.rules; 9695 } 9696 return state; 9697 } 9698 9699 /** 9700 * Reducer returning the initial block selection. 9701 * 9702 * Currently this in only used to restore the selection after block deletion and 9703 * pasting new content.This reducer should eventually be removed in favour of setting 9704 * selection directly. 9705 * 9706 * @param {boolean} state Current state. 9707 * @param {Object} action Dispatched action. 9708 * 9709 * @return {number|null} Initial position: 0, -1 or null. 9710 */ 9711 function initialPosition(state = null, action) { 9712 if (action.type === 'REPLACE_BLOCKS' && action.initialPosition !== undefined) { 9713 return action.initialPosition; 9714 } else if (['MULTI_SELECT', 'SELECT_BLOCK', 'RESET_SELECTION', 'INSERT_BLOCKS', 'REPLACE_INNER_BLOCKS'].includes(action.type)) { 9715 return action.initialPosition; 9716 } 9717 return state; 9718 } 9719 function blocksMode(state = {}, action) { 9720 if (action.type === 'TOGGLE_BLOCK_MODE') { 9721 const { 9722 clientId 9723 } = action; 9724 return { 9725 ...state, 9726 [clientId]: state[clientId] && state[clientId] === 'html' ? 'visual' : 'html' 9727 }; 9728 } 9729 return state; 9730 } 9731 9732 /** 9733 * Reducer returning the block insertion point visibility, either null if there 9734 * is not an explicit insertion point assigned, or an object of its `index` and 9735 * `rootClientId`. 9736 * 9737 * @param {Object} state Current state. 9738 * @param {Object} action Dispatched action. 9739 * 9740 * @return {Object} Updated state. 9741 */ 9742 function insertionPoint(state = null, action) { 9743 switch (action.type) { 9744 case 'SHOW_INSERTION_POINT': 9745 { 9746 const { 9747 rootClientId, 9748 index, 9749 __unstableWithInserter, 9750 operation, 9751 nearestSide 9752 } = action; 9753 const nextState = { 9754 rootClientId, 9755 index, 9756 __unstableWithInserter, 9757 operation, 9758 nearestSide 9759 }; 9760 9761 // Bail out updates if the states are the same. 9762 return es6_default()(state, nextState) ? state : nextState; 9763 } 9764 case 'HIDE_INSERTION_POINT': 9765 return null; 9766 } 9767 return state; 9768 } 9769 9770 /** 9771 * Reducer returning whether the post blocks match the defined template or not. 9772 * 9773 * @param {Object} state Current state. 9774 * @param {Object} action Dispatched action. 9775 * 9776 * @return {boolean} Updated state. 9777 */ 9778 function template(state = { 9779 isValid: true 9780 }, action) { 9781 switch (action.type) { 9782 case 'SET_TEMPLATE_VALIDITY': 9783 return { 9784 ...state, 9785 isValid: action.isValid 9786 }; 9787 } 9788 return state; 9789 } 9790 9791 /** 9792 * Reducer returning the editor setting. 9793 * 9794 * @param {Object} state Current state. 9795 * @param {Object} action Dispatched action. 9796 * 9797 * @return {Object} Updated state. 9798 */ 9799 function settings(state = SETTINGS_DEFAULTS, action) { 9800 switch (action.type) { 9801 case 'UPDATE_SETTINGS': 9802 if (action.reset) { 9803 return { 9804 ...SETTINGS_DEFAULTS, 9805 ...action.settings 9806 }; 9807 } 9808 return { 9809 ...state, 9810 ...action.settings 9811 }; 9812 } 9813 return state; 9814 } 9815 9816 /** 9817 * Reducer returning the user preferences. 9818 * 9819 * @param {Object} state Current state. 9820 * @param {Object} action Dispatched action. 9821 * 9822 * @return {string} Updated state. 9823 */ 9824 function preferences(state = PREFERENCES_DEFAULTS, action) { 9825 switch (action.type) { 9826 case 'INSERT_BLOCKS': 9827 case 'REPLACE_BLOCKS': 9828 { 9829 const nextInsertUsage = action.blocks.reduce((prevUsage, block) => { 9830 const { 9831 attributes, 9832 name: blockName 9833 } = block; 9834 let id = blockName; 9835 // If a block variation match is found change the name to be the same with the 9836 // one that is used for block variations in the Inserter (`getItemFromVariation`). 9837 const match = (0,external_wp_data_namespaceObject.select)(external_wp_blocks_namespaceObject.store).getActiveBlockVariation(blockName, attributes); 9838 if (match?.name) { 9839 id += '/' + match.name; 9840 } 9841 if (blockName === 'core/block') { 9842 id += '/' + attributes.ref; 9843 } 9844 return { 9845 ...prevUsage, 9846 [id]: { 9847 time: action.time, 9848 count: prevUsage[id] ? prevUsage[id].count + 1 : 1 9849 } 9850 }; 9851 }, state.insertUsage); 9852 return { 9853 ...state, 9854 insertUsage: nextInsertUsage 9855 }; 9856 } 9857 } 9858 return state; 9859 } 9860 9861 /** 9862 * Reducer returning an object where each key is a block client ID, its value 9863 * representing the settings for its nested blocks. 9864 * 9865 * @param {Object} state Current state. 9866 * @param {Object} action Dispatched action. 9867 * 9868 * @return {Object} Updated state. 9869 */ 9870 const blockListSettings = (state = {}, action) => { 9871 switch (action.type) { 9872 // Even if the replaced blocks have the same client ID, our logic 9873 // should correct the state. 9874 case 'REPLACE_BLOCKS': 9875 case 'REMOVE_BLOCKS': 9876 { 9877 return Object.fromEntries(Object.entries(state).filter(([id]) => !action.clientIds.includes(id))); 9878 } 9879 case 'UPDATE_BLOCK_LIST_SETTINGS': 9880 { 9881 const updates = typeof action.clientId === 'string' ? { 9882 [action.clientId]: action.settings 9883 } : action.clientId; 9884 9885 // Remove settings that are the same as the current state. 9886 for (const clientId in updates) { 9887 if (!updates[clientId]) { 9888 if (!state[clientId]) { 9889 delete updates[clientId]; 9890 } 9891 } else if (es6_default()(state[clientId], updates[clientId])) { 9892 delete updates[clientId]; 9893 } 9894 } 9895 if (Object.keys(updates).length === 0) { 9896 return state; 9897 } 9898 const merged = { 9899 ...state, 9900 ...updates 9901 }; 9902 for (const clientId in updates) { 9903 if (!updates[clientId]) { 9904 delete merged[clientId]; 9905 } 9906 } 9907 return merged; 9908 } 9909 } 9910 return state; 9911 }; 9912 9913 /** 9914 * Reducer returning which mode is enabled. 9915 * 9916 * @param {string} state Current state. 9917 * @param {Object} action Dispatched action. 9918 * 9919 * @return {string} Updated state. 9920 */ 9921 function editorMode(state = 'edit', action) { 9922 // Let inserting block in navigation mode always trigger Edit mode. 9923 if (action.type === 'INSERT_BLOCKS' && state === 'navigation') { 9924 return 'edit'; 9925 } 9926 if (action.type === 'SET_EDITOR_MODE') { 9927 return action.mode; 9928 } 9929 return state; 9930 } 9931 9932 /** 9933 * Reducer returning whether the block moving mode is enabled or not. 9934 * 9935 * @param {string|null} state Current state. 9936 * @param {Object} action Dispatched action. 9937 * 9938 * @return {string|null} Updated state. 9939 */ 9940 function hasBlockMovingClientId(state = null, action) { 9941 if (action.type === 'SET_BLOCK_MOVING_MODE') { 9942 return action.hasBlockMovingClientId; 9943 } 9944 if (action.type === 'SET_EDITOR_MODE') { 9945 return null; 9946 } 9947 return state; 9948 } 9949 9950 /** 9951 * Reducer return an updated state representing the most recent block attribute 9952 * update. The state is structured as an object where the keys represent the 9953 * client IDs of blocks, the values a subset of attributes from the most recent 9954 * block update. The state is always reset to null if the last action is 9955 * anything other than an attributes update. 9956 * 9957 * @param {Object<string,Object>} state Current state. 9958 * @param {Object} action Action object. 9959 * 9960 * @return {[string,Object]} Updated state. 9961 */ 9962 function lastBlockAttributesChange(state = null, action) { 9963 switch (action.type) { 9964 case 'UPDATE_BLOCK': 9965 if (!action.updates.attributes) { 9966 break; 9967 } 9968 return { 9969 [action.clientId]: action.updates.attributes 9970 }; 9971 case 'UPDATE_BLOCK_ATTRIBUTES': 9972 return action.clientIds.reduce((accumulator, id) => ({ 9973 ...accumulator, 9974 [id]: action.uniqueByBlock ? action.attributes[id] : action.attributes 9975 }), {}); 9976 } 9977 return state; 9978 } 9979 9980 /** 9981 * Reducer returning current highlighted block. 9982 * 9983 * @param {boolean} state Current highlighted block. 9984 * @param {Object} action Dispatched action. 9985 * 9986 * @return {string} Updated state. 9987 */ 9988 function highlightedBlock(state, action) { 9989 switch (action.type) { 9990 case 'TOGGLE_BLOCK_HIGHLIGHT': 9991 const { 9992 clientId, 9993 isHighlighted 9994 } = action; 9995 if (isHighlighted) { 9996 return clientId; 9997 } else if (state === clientId) { 9998 return null; 9999 } 10000 return state; 10001 case 'SELECT_BLOCK': 10002 if (action.clientId !== state) { 10003 return null; 10004 } 10005 } 10006 return state; 10007 } 10008 10009 /** 10010 * Reducer returning current expanded block in the list view. 10011 * 10012 * @param {string|null} state Current expanded block. 10013 * @param {Object} action Dispatched action. 10014 * 10015 * @return {string|null} Updated state. 10016 */ 10017 function expandedBlock(state = null, action) { 10018 switch (action.type) { 10019 case 'SET_BLOCK_EXPANDED_IN_LIST_VIEW': 10020 return action.clientId; 10021 case 'SELECT_BLOCK': 10022 if (action.clientId !== state) { 10023 return null; 10024 } 10025 } 10026 return state; 10027 } 10028 10029 /** 10030 * Reducer returning the block insertion event list state. 10031 * 10032 * @param {Object} state Current state. 10033 * @param {Object} action Dispatched action. 10034 * 10035 * @return {Object} Updated state. 10036 */ 10037 function lastBlockInserted(state = {}, action) { 10038 switch (action.type) { 10039 case 'INSERT_BLOCKS': 10040 case 'REPLACE_BLOCKS': 10041 if (!action.blocks.length) { 10042 return state; 10043 } 10044 const clientIds = action.blocks.map(block => { 10045 return block.clientId; 10046 }); 10047 const source = action.meta?.source; 10048 return { 10049 clientIds, 10050 source 10051 }; 10052 case 'RESET_BLOCKS': 10053 return {}; 10054 } 10055 return state; 10056 } 10057 10058 /** 10059 * Reducer returning the block that is eding temporarily edited as blocks. 10060 * 10061 * @param {Object} state Current state. 10062 * @param {Object} action Dispatched action. 10063 * 10064 * @return {Object} Updated state. 10065 */ 10066 function temporarilyEditingAsBlocks(state = '', action) { 10067 if (action.type === 'SET_TEMPORARILY_EDITING_AS_BLOCKS') { 10068 return action.temporarilyEditingAsBlocks; 10069 } 10070 return state; 10071 } 10072 10073 /** 10074 * Reducer returning the focus mode that should be used when temporarily edit as blocks finishes. 10075 * 10076 * @param {Object} state Current state. 10077 * @param {Object} action Dispatched action. 10078 * 10079 * @return {Object} Updated state. 10080 */ 10081 function temporarilyEditingFocusModeRevert(state = '', action) { 10082 if (action.type === 'SET_TEMPORARILY_EDITING_AS_BLOCKS') { 10083 return action.focusModeToRevert; 10084 } 10085 return state; 10086 } 10087 10088 /** 10089 * Reducer returning a map of block client IDs to block editing modes. 10090 * 10091 * @param {Map} state Current state. 10092 * @param {Object} action Dispatched action. 10093 * 10094 * @return {Map} Updated state. 10095 */ 10096 function blockEditingModes(state = new Map(), action) { 10097 switch (action.type) { 10098 case 'SET_BLOCK_EDITING_MODE': 10099 return new Map(state).set(action.clientId, action.mode); 10100 case 'UNSET_BLOCK_EDITING_MODE': 10101 { 10102 const newState = new Map(state); 10103 newState.delete(action.clientId); 10104 return newState; 10105 } 10106 case 'RESET_BLOCKS': 10107 { 10108 return state.has('') ? new Map().set('', state.get('')) : state; 10109 } 10110 } 10111 return state; 10112 } 10113 10114 /** 10115 * Reducer returning the clientId of the block settings menu that is currently open. 10116 * 10117 * @param {string|null} state Current state. 10118 * @param {Object} action Dispatched action. 10119 * 10120 * @return {string|null} Updated state. 10121 */ 10122 function openedBlockSettingsMenu(state = null, action) { 10123 if ('SET_OPENED_BLOCK_SETTINGS_MENU' === action.type) { 10124 var _action$clientId; 10125 return (_action$clientId = action?.clientId) !== null && _action$clientId !== void 0 ? _action$clientId : null; 10126 } 10127 return state; 10128 } 10129 10130 /** 10131 * Reducer returning a map of style IDs to style overrides. 10132 * 10133 * @param {Map} state Current state. 10134 * @param {Object} action Dispatched action. 10135 * 10136 * @return {Map} Updated state. 10137 */ 10138 function styleOverrides(state = new Map(), action) { 10139 switch (action.type) { 10140 case 'SET_STYLE_OVERRIDE': 10141 return new Map(state).set(action.id, action.style); 10142 case 'DELETE_STYLE_OVERRIDE': 10143 { 10144 const newState = new Map(state); 10145 newState.delete(action.id); 10146 return newState; 10147 } 10148 } 10149 return state; 10150 } 10151 10152 /** 10153 * Reducer returning a map of the registered inserter media categories. 10154 * 10155 * @param {Array} state Current state. 10156 * @param {Object} action Dispatched action. 10157 * 10158 * @return {Array} Updated state. 10159 */ 10160 function registeredInserterMediaCategories(state = [], action) { 10161 switch (action.type) { 10162 case 'REGISTER_INSERTER_MEDIA_CATEGORY': 10163 return [...state, action.category]; 10164 } 10165 return state; 10166 } 10167 10168 /** 10169 * Reducer setting last focused element 10170 * 10171 * @param {boolean} state Current state. 10172 * @param {Object} action Dispatched action. 10173 * 10174 * @return {boolean} Updated state. 10175 */ 10176 function lastFocus(state = false, action) { 10177 switch (action.type) { 10178 case 'LAST_FOCUS': 10179 return action.lastFocus; 10180 } 10181 return state; 10182 } 10183 10184 /** 10185 * Reducer setting currently hovered block. 10186 * 10187 * @param {boolean} state Current state. 10188 * @param {Object} action Dispatched action. 10189 * 10190 * @return {boolean} Updated state. 10191 */ 10192 function hoveredBlockClientId(state = false, action) { 10193 switch (action.type) { 10194 case 'HOVER_BLOCK': 10195 return action.clientId; 10196 } 10197 return state; 10198 } 10199 10200 /** 10201 * Reducer setting zoom out state. 10202 * 10203 * @param {boolean} state Current state. 10204 * @param {Object} action Dispatched action. 10205 * 10206 * @return {boolean} Updated state. 10207 */ 10208 function zoomLevel(state = 100, action) { 10209 switch (action.type) { 10210 case 'SET_ZOOM_LEVEL': 10211 return action.zoom; 10212 case 'RESET_ZOOM_LEVEL': 10213 return 100; 10214 } 10215 return state; 10216 } 10217 const combinedReducers = (0,external_wp_data_namespaceObject.combineReducers)({ 10218 blocks, 10219 isDragging, 10220 isTyping, 10221 isBlockInterfaceHidden, 10222 draggedBlocks, 10223 selection, 10224 isMultiSelecting, 10225 isSelectionEnabled, 10226 initialPosition, 10227 blocksMode, 10228 blockListSettings, 10229 insertionPoint, 10230 template, 10231 settings, 10232 preferences, 10233 lastBlockAttributesChange, 10234 lastFocus, 10235 editorMode, 10236 hasBlockMovingClientId, 10237 expandedBlock, 10238 highlightedBlock, 10239 lastBlockInserted, 10240 temporarilyEditingAsBlocks, 10241 temporarilyEditingFocusModeRevert, 10242 blockVisibility, 10243 blockEditingModes, 10244 styleOverrides, 10245 removalPromptData, 10246 blockRemovalRules, 10247 openedBlockSettingsMenu, 10248 registeredInserterMediaCategories, 10249 hoveredBlockClientId, 10250 zoomLevel 10251 }); 10252 function withAutomaticChangeReset(reducer) { 10253 return (state, action) => { 10254 const nextState = reducer(state, action); 10255 if (!state) { 10256 return nextState; 10257 } 10258 10259 // Take over the last value without creating a new reference. 10260 nextState.automaticChangeStatus = state.automaticChangeStatus; 10261 if (action.type === 'MARK_AUTOMATIC_CHANGE') { 10262 return { 10263 ...nextState, 10264 automaticChangeStatus: 'pending' 10265 }; 10266 } 10267 if (action.type === 'MARK_AUTOMATIC_CHANGE_FINAL' && state.automaticChangeStatus === 'pending') { 10268 return { 10269 ...nextState, 10270 automaticChangeStatus: 'final' 10271 }; 10272 } 10273 10274 // If there's a change that doesn't affect blocks or selection, maintain 10275 // the current status. 10276 if (nextState.blocks === state.blocks && nextState.selection === state.selection) { 10277 return nextState; 10278 } 10279 10280 // As long as the state is not final, ignore any selection changes. 10281 if (nextState.automaticChangeStatus !== 'final' && nextState.selection !== state.selection) { 10282 return nextState; 10283 } 10284 10285 // Reset the status if blocks change or selection changes (when status is final). 10286 return { 10287 ...nextState, 10288 automaticChangeStatus: undefined 10289 }; 10290 }; 10291 } 10292 /* harmony default export */ const reducer = (withAutomaticChangeReset(combinedReducers)); 10293 10294 ;// CONCATENATED MODULE: external ["wp","primitives"] 10295 const external_wp_primitives_namespaceObject = window["wp"]["primitives"]; 10296 ;// CONCATENATED MODULE: external "ReactJSXRuntime" 10297 const external_ReactJSXRuntime_namespaceObject = window["ReactJSXRuntime"]; 10298 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/symbol.js 10299 /** 10300 * WordPress dependencies 10301 */ 10302 10303 10304 const symbol = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 10305 xmlns: "http://www.w3.org/2000/svg", 10306 viewBox: "0 0 24 24", 10307 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 10308 d: "M21.3 10.8l-5.6-5.6c-.7-.7-1.8-.7-2.5 0l-5.6 5.6c-.7.7-.7 1.8 0 2.5l5.6 5.6c.3.3.8.5 1.2.5s.9-.2 1.2-.5l5.6-5.6c.8-.7.8-1.9.1-2.5zm-1 1.4l-5.6 5.6c-.1.1-.3.1-.4 0l-5.6-5.6c-.1-.1-.1-.3 0-.4l5.6-5.6s.1-.1.2-.1.1 0 .2.1l5.6 5.6c.1.1.1.3 0 .4zm-16.6-.4L10 5.5l-1-1-6.3 6.3c-.7.7-.7 1.8 0 2.5L9 19.5l1.1-1.1-6.3-6.3c-.2 0-.2-.2-.1-.3z" 10309 }) 10310 }); 10311 /* harmony default export */ const library_symbol = (symbol); 10312 10313 ;// CONCATENATED MODULE: external ["wp","richText"] 10314 const external_wp_richText_namespaceObject = window["wp"]["richText"]; 10315 ;// CONCATENATED MODULE: external ["wp","blockSerializationDefaultParser"] 10316 const external_wp_blockSerializationDefaultParser_namespaceObject = window["wp"]["blockSerializationDefaultParser"]; 10317 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/private-keys.js 10318 const globalStylesDataKey = Symbol('globalStylesDataKey'); 10319 const globalStylesLinksDataKey = Symbol('globalStylesLinks'); 10320 const selectBlockPatternsKey = Symbol('selectBlockPatternsKey'); 10321 const reusableBlocksSelectKey = Symbol('reusableBlocksSelect'); 10322 const sectionRootClientIdKey = Symbol('sectionRootClientIdKey'); 10323 10324 ;// CONCATENATED MODULE: external ["wp","privateApis"] 10325 const external_wp_privateApis_namespaceObject = window["wp"]["privateApis"]; 10326 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/lock-unlock.js 10327 /** 10328 * WordPress dependencies 10329 */ 10330 10331 const { 10332 lock, 10333 unlock 10334 } = (0,external_wp_privateApis_namespaceObject.__dangerousOptInToUnstableAPIsOnlyForCoreModules)('I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.', '@wordpress/block-editor'); 10335 10336 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/constants.js 10337 const STORE_NAME = 'core/block-editor'; 10338 10339 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/utils.js 10340 /** 10341 * WordPress dependencies 10342 */ 10343 10344 10345 10346 /** 10347 * Internal dependencies 10348 */ 10349 10350 10351 10352 const withRootClientIdOptionKey = Symbol('withRootClientId'); 10353 const parsedPatternCache = new WeakMap(); 10354 const grammarMapCache = new WeakMap(); 10355 function parsePattern(pattern) { 10356 const blocks = (0,external_wp_blocks_namespaceObject.parse)(pattern.content, { 10357 __unstableSkipMigrationLogs: true 10358 }); 10359 if (blocks.length === 1) { 10360 blocks[0].attributes = { 10361 ...blocks[0].attributes, 10362 metadata: { 10363 ...(blocks[0].attributes.metadata || {}), 10364 categories: pattern.categories, 10365 patternName: pattern.name, 10366 name: blocks[0].attributes.metadata?.name || pattern.title 10367 } 10368 }; 10369 } 10370 return { 10371 ...pattern, 10372 blocks 10373 }; 10374 } 10375 function getParsedPattern(pattern) { 10376 let parsedPattern = parsedPatternCache.get(pattern); 10377 if (!parsedPattern) { 10378 parsedPattern = parsePattern(pattern); 10379 parsedPatternCache.set(pattern, parsedPattern); 10380 } 10381 return parsedPattern; 10382 } 10383 function getGrammar(pattern) { 10384 let grammarMap = grammarMapCache.get(pattern); 10385 if (!grammarMap) { 10386 grammarMap = (0,external_wp_blockSerializationDefaultParser_namespaceObject.parse)(pattern.content); 10387 // Block names are null only at the top level for whitespace. 10388 grammarMap = grammarMap.filter(block => block.blockName !== null); 10389 grammarMapCache.set(pattern, grammarMap); 10390 } 10391 return grammarMap; 10392 } 10393 const checkAllowList = (list, item, defaultResult = null) => { 10394 if (typeof list === 'boolean') { 10395 return list; 10396 } 10397 if (Array.isArray(list)) { 10398 // TODO: when there is a canonical way to detect that we are editing a post 10399 // the following check should be changed to something like: 10400 // if ( list.includes( 'core/post-content' ) && getEditorMode() === 'post-content' && item === null ) 10401 if (list.includes('core/post-content') && item === null) { 10402 return true; 10403 } 10404 return list.includes(item); 10405 } 10406 return defaultResult; 10407 }; 10408 const checkAllowListRecursive = (blocks, allowedBlockTypes) => { 10409 if (typeof allowedBlockTypes === 'boolean') { 10410 return allowedBlockTypes; 10411 } 10412 const blocksQueue = [...blocks]; 10413 while (blocksQueue.length > 0) { 10414 const block = blocksQueue.shift(); 10415 const isAllowed = checkAllowList(allowedBlockTypes, block.name || block.blockName, true); 10416 if (!isAllowed) { 10417 return false; 10418 } 10419 block.innerBlocks?.forEach(innerBlock => { 10420 blocksQueue.push(innerBlock); 10421 }); 10422 } 10423 return true; 10424 }; 10425 const getAllPatternsDependants = select => state => { 10426 return [state.settings.__experimentalBlockPatterns, state.settings.__experimentalUserPatternCategories, state.settings.__experimentalReusableBlocks, state.settings[selectBlockPatternsKey]?.(select), state.blockPatterns, unlock(select(STORE_NAME)).getReusableBlocks()]; 10427 }; 10428 function getInsertBlockTypeDependants(state, rootClientId) { 10429 return [state.blockListSettings[rootClientId], state.blocks.byClientId.get(rootClientId), state.settings.allowedBlockTypes, state.settings.templateLock, state.blockEditingModes]; 10430 } 10431 10432 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/sorting.js 10433 /** 10434 * Recursive stable sorting comparator function. 10435 * 10436 * @param {string|Function} field Field to sort by. 10437 * @param {Array} items Items to sort. 10438 * @param {string} order Order, 'asc' or 'desc'. 10439 * @return {Function} Comparison function to be used in a `.sort()`. 10440 */ 10441 const comparator = (field, items, order) => { 10442 return (a, b) => { 10443 let cmpA, cmpB; 10444 if (typeof field === 'function') { 10445 cmpA = field(a); 10446 cmpB = field(b); 10447 } else { 10448 cmpA = a[field]; 10449 cmpB = b[field]; 10450 } 10451 if (cmpA > cmpB) { 10452 return order === 'asc' ? 1 : -1; 10453 } else if (cmpB > cmpA) { 10454 return order === 'asc' ? -1 : 1; 10455 } 10456 const orderA = items.findIndex(item => item === a); 10457 const orderB = items.findIndex(item => item === b); 10458 10459 // Stable sort: maintaining original array order 10460 if (orderA > orderB) { 10461 return 1; 10462 } else if (orderB > orderA) { 10463 return -1; 10464 } 10465 return 0; 10466 }; 10467 }; 10468 10469 /** 10470 * Order items by a certain key. 10471 * Supports decorator functions that allow complex picking of a comparison field. 10472 * Sorts in ascending order by default, but supports descending as well. 10473 * Stable sort - maintains original order of equal items. 10474 * 10475 * @param {Array} items Items to order. 10476 * @param {string|Function} field Field to order by. 10477 * @param {string} order Sorting order, `asc` or `desc`. 10478 * @return {Array} Sorted items. 10479 */ 10480 function orderBy(items, field, order = 'asc') { 10481 return items.concat().sort(comparator(field, items, order)); 10482 } 10483 10484 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-patterns-tab/utils.js 10485 /** 10486 * WordPress dependencies 10487 */ 10488 10489 10490 const INSERTER_PATTERN_TYPES = { 10491 user: 'user', 10492 theme: 'theme', 10493 directory: 'directory' 10494 }; 10495 const INSERTER_SYNC_TYPES = { 10496 full: 'fully', 10497 unsynced: 'unsynced' 10498 }; 10499 const allPatternsCategory = { 10500 name: 'allPatterns', 10501 label: (0,external_wp_i18n_namespaceObject._x)('All', 'patterns') 10502 }; 10503 const myPatternsCategory = { 10504 name: 'myPatterns', 10505 label: (0,external_wp_i18n_namespaceObject.__)('My patterns') 10506 }; 10507 function isPatternFiltered(pattern, sourceFilter, syncFilter) { 10508 const isUserPattern = pattern.name.startsWith('core/block'); 10509 const isDirectoryPattern = pattern.source === 'core' || pattern.source?.startsWith('pattern-directory'); 10510 10511 // If theme source selected, filter out user created patterns and those from 10512 // the core patterns directory. 10513 if (sourceFilter === INSERTER_PATTERN_TYPES.theme && (isUserPattern || isDirectoryPattern)) { 10514 return true; 10515 } 10516 10517 // If the directory source is selected, filter out user created patterns 10518 // and those bundled with the theme. 10519 if (sourceFilter === INSERTER_PATTERN_TYPES.directory && (isUserPattern || !isDirectoryPattern)) { 10520 return true; 10521 } 10522 10523 // If user source selected, filter out theme patterns. 10524 if (sourceFilter === INSERTER_PATTERN_TYPES.user && pattern.type !== INSERTER_PATTERN_TYPES.user) { 10525 return true; 10526 } 10527 10528 // Filter by sync status. 10529 if (syncFilter === INSERTER_SYNC_TYPES.full && pattern.syncStatus !== '') { 10530 return true; 10531 } 10532 if (syncFilter === INSERTER_SYNC_TYPES.unsynced && pattern.syncStatus !== 'unsynced' && isUserPattern) { 10533 return true; 10534 } 10535 return false; 10536 } 10537 10538 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/object.js 10539 /** 10540 * Immutably sets a value inside an object. Like `lodash#set`, but returning a 10541 * new object. Treats nullish initial values as empty objects. Clones any 10542 * nested objects. Supports arrays, too. 10543 * 10544 * @param {Object} object Object to set a value in. 10545 * @param {number|string|Array} path Path in the object to modify. 10546 * @param {*} value New value to set. 10547 * @return {Object} Cloned object with the new value set. 10548 */ 10549 function setImmutably(object, path, value) { 10550 // Normalize path 10551 path = Array.isArray(path) ? [...path] : [path]; 10552 10553 // Shallowly clone the base of the object 10554 object = Array.isArray(object) ? [...object] : { 10555 ...object 10556 }; 10557 const leaf = path.pop(); 10558 10559 // Traverse object from root to leaf, shallowly cloning at each level 10560 let prev = object; 10561 for (const key of path) { 10562 const lvl = prev[key]; 10563 prev = prev[key] = Array.isArray(lvl) ? [...lvl] : { 10564 ...lvl 10565 }; 10566 } 10567 prev[leaf] = value; 10568 return object; 10569 } 10570 10571 /** 10572 * Helper util to return a value from a certain path of the object. 10573 * Path is specified as either: 10574 * - a string of properties, separated by dots, for example: "x.y". 10575 * - an array of properties, for example `[ 'x', 'y' ]`. 10576 * You can also specify a default value in case the result is nullish. 10577 * 10578 * @param {Object} object Input object. 10579 * @param {string|Array} path Path to the object property. 10580 * @param {*} defaultValue Default value if the value at the specified path is nullish. 10581 * @return {*} Value of the object property at the specified path. 10582 */ 10583 const getValueFromObjectPath = (object, path, defaultValue) => { 10584 var _value; 10585 const arrayPath = Array.isArray(path) ? path : path.split('.'); 10586 let value = object; 10587 arrayPath.forEach(fieldName => { 10588 value = value?.[fieldName]; 10589 }); 10590 return (_value = value) !== null && _value !== void 0 ? _value : defaultValue; 10591 }; 10592 10593 /** 10594 * Helper util to filter out objects with duplicate values for a given property. 10595 * 10596 * @param {Object[]} array Array of objects to filter. 10597 * @param {string} property Property to filter unique values by. 10598 * 10599 * @return {Object[]} Array of objects with unique values for the specified property. 10600 */ 10601 function uniqByProperty(array, property) { 10602 const seen = new Set(); 10603 return array.filter(item => { 10604 const value = item[property]; 10605 return seen.has(value) ? false : seen.add(value); 10606 }); 10607 } 10608 10609 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/get-block-settings.js 10610 /** 10611 * WordPress dependencies 10612 */ 10613 10614 10615 10616 /** 10617 * Internal dependencies 10618 */ 10619 10620 10621 const blockedPaths = ['color', 'border', 'dimensions', 'typography', 'spacing']; 10622 const deprecatedFlags = { 10623 'color.palette': settings => settings.colors, 10624 'color.gradients': settings => settings.gradients, 10625 'color.custom': settings => settings.disableCustomColors === undefined ? undefined : !settings.disableCustomColors, 10626 'color.customGradient': settings => settings.disableCustomGradients === undefined ? undefined : !settings.disableCustomGradients, 10627 'typography.fontSizes': settings => settings.fontSizes, 10628 'typography.customFontSize': settings => settings.disableCustomFontSizes === undefined ? undefined : !settings.disableCustomFontSizes, 10629 'typography.lineHeight': settings => settings.enableCustomLineHeight, 10630 'spacing.units': settings => { 10631 if (settings.enableCustomUnits === undefined) { 10632 return; 10633 } 10634 if (settings.enableCustomUnits === true) { 10635 return ['px', 'em', 'rem', 'vh', 'vw', '%']; 10636 } 10637 return settings.enableCustomUnits; 10638 }, 10639 'spacing.padding': settings => settings.enableCustomSpacing 10640 }; 10641 const prefixedFlags = { 10642 /* 10643 * These were only available in the plugin 10644 * and can be removed when the minimum WordPress version 10645 * for the plugin is 5.9. 10646 */ 10647 'border.customColor': 'border.color', 10648 'border.customStyle': 'border.style', 10649 'border.customWidth': 'border.width', 10650 'typography.customFontStyle': 'typography.fontStyle', 10651 'typography.customFontWeight': 'typography.fontWeight', 10652 'typography.customLetterSpacing': 'typography.letterSpacing', 10653 'typography.customTextDecorations': 'typography.textDecoration', 10654 'typography.customTextTransforms': 'typography.textTransform', 10655 /* 10656 * These were part of WordPress 5.8 and we need to keep them. 10657 */ 10658 'border.customRadius': 'border.radius', 10659 'spacing.customMargin': 'spacing.margin', 10660 'spacing.customPadding': 'spacing.padding', 10661 'typography.customLineHeight': 'typography.lineHeight' 10662 }; 10663 10664 /** 10665 * Remove `custom` prefixes for flags that did not land in 5.8. 10666 * 10667 * This provides continued support for `custom` prefixed properties. It will 10668 * be removed once third party devs have had sufficient time to update themes, 10669 * plugins, etc. 10670 * 10671 * @see https://github.com/WordPress/gutenberg/pull/34485 10672 * 10673 * @param {string} path Path to desired value in settings. 10674 * @return {string} The value for defined setting. 10675 */ 10676 const removeCustomPrefixes = path => { 10677 return prefixedFlags[path] || path; 10678 }; 10679 function getBlockSettings(state, clientId, ...paths) { 10680 const blockName = getBlockName(state, clientId); 10681 const candidates = []; 10682 if (clientId) { 10683 let id = clientId; 10684 do { 10685 const name = getBlockName(state, id); 10686 if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, '__experimentalSettings', false)) { 10687 candidates.push(id); 10688 } 10689 } while (id = state.blocks.parents.get(id)); 10690 } 10691 return paths.map(path => { 10692 if (blockedPaths.includes(path)) { 10693 // eslint-disable-next-line no-console 10694 console.warn('Top level useSetting paths are disabled. Please use a subpath to query the information needed.'); 10695 return undefined; 10696 } 10697 10698 // 0. Allow third parties to filter the block's settings at runtime. 10699 let result = (0,external_wp_hooks_namespaceObject.applyFilters)('blockEditor.useSetting.before', undefined, path, clientId, blockName); 10700 if (undefined !== result) { 10701 return result; 10702 } 10703 const normalizedPath = removeCustomPrefixes(path); 10704 10705 // 1. Take settings from the block instance or its ancestors. 10706 // Start from the current block and work our way up the ancestors. 10707 for (const candidateClientId of candidates) { 10708 var _getValueFromObjectPa; 10709 const candidateAtts = getBlockAttributes(state, candidateClientId); 10710 result = (_getValueFromObjectPa = getValueFromObjectPath(candidateAtts.settings?.blocks?.[blockName], normalizedPath)) !== null && _getValueFromObjectPa !== void 0 ? _getValueFromObjectPa : getValueFromObjectPath(candidateAtts.settings, normalizedPath); 10711 if (result !== undefined) { 10712 // Stop the search for more distant ancestors and move on. 10713 break; 10714 } 10715 } 10716 10717 // 2. Fall back to the settings from the block editor store (__experimentalFeatures). 10718 const settings = getSettings(state); 10719 if (result === undefined && blockName) { 10720 result = getValueFromObjectPath(settings.__experimentalFeatures?.blocks?.[blockName], normalizedPath); 10721 } 10722 if (result === undefined) { 10723 result = getValueFromObjectPath(settings.__experimentalFeatures, normalizedPath); 10724 } 10725 10726 // Return if the setting was found in either the block instance or the store. 10727 if (result !== undefined) { 10728 if (external_wp_blocks_namespaceObject.__EXPERIMENTAL_PATHS_WITH_OVERRIDE[normalizedPath]) { 10729 var _ref, _result$custom; 10730 return (_ref = (_result$custom = result.custom) !== null && _result$custom !== void 0 ? _result$custom : result.theme) !== null && _ref !== void 0 ? _ref : result.default; 10731 } 10732 return result; 10733 } 10734 10735 // 3. Otherwise, use deprecated settings. 10736 const deprecatedSettingsValue = deprecatedFlags[normalizedPath]?.(settings); 10737 if (deprecatedSettingsValue !== undefined) { 10738 return deprecatedSettingsValue; 10739 } 10740 10741 // 4. Fallback for typography.dropCap: 10742 // This is only necessary to support typography.dropCap. 10743 // when __experimentalFeatures are not present (core without plugin). 10744 // To remove when __experimentalFeatures are ported to core. 10745 return normalizedPath === 'typography.dropCap' ? true : undefined; 10746 }); 10747 } 10748 10749 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/private-selectors.js 10750 /** 10751 * WordPress dependencies 10752 */ 10753 10754 10755 /** 10756 * Internal dependencies 10757 */ 10758 10759 10760 10761 10762 10763 10764 10765 10766 /** 10767 * Returns true if the block interface is hidden, or false otherwise. 10768 * 10769 * @param {Object} state Global application state. 10770 * 10771 * @return {boolean} Whether the block toolbar is hidden. 10772 */ 10773 function private_selectors_isBlockInterfaceHidden(state) { 10774 return state.isBlockInterfaceHidden; 10775 } 10776 10777 /** 10778 * Gets the client ids of the last inserted blocks. 10779 * 10780 * @param {Object} state Global application state. 10781 * @return {Array|undefined} Client Ids of the last inserted block(s). 10782 */ 10783 function getLastInsertedBlocksClientIds(state) { 10784 return state?.lastBlockInserted?.clientIds; 10785 } 10786 function getBlockWithoutAttributes(state, clientId) { 10787 return state.blocks.byClientId.get(clientId); 10788 } 10789 10790 /** 10791 * Returns true if all of the descendants of a block with the given client ID 10792 * have an editing mode of 'disabled', or false otherwise. 10793 * 10794 * @param {Object} state Global application state. 10795 * @param {string} clientId The block client ID. 10796 * 10797 * @return {boolean} Whether the block descendants are disabled. 10798 */ 10799 const isBlockSubtreeDisabled = (state, clientId) => { 10800 const isChildSubtreeDisabled = childClientId => { 10801 return getBlockEditingMode(state, childClientId) === 'disabled' && getBlockOrder(state, childClientId).every(isChildSubtreeDisabled); 10802 }; 10803 return getBlockOrder(state, clientId).every(isChildSubtreeDisabled); 10804 }; 10805 function getEnabledClientIdsTreeUnmemoized(state, rootClientId) { 10806 const blockOrder = getBlockOrder(state, rootClientId); 10807 const result = []; 10808 for (const clientId of blockOrder) { 10809 const innerBlocks = getEnabledClientIdsTreeUnmemoized(state, clientId); 10810 if (getBlockEditingMode(state, clientId) !== 'disabled') { 10811 result.push({ 10812 clientId, 10813 innerBlocks 10814 }); 10815 } else { 10816 result.push(...innerBlocks); 10817 } 10818 } 10819 return result; 10820 } 10821 10822 /** 10823 * Returns a tree of block objects with only clientID and innerBlocks set. 10824 * Blocks with a 'disabled' editing mode are not included. 10825 * 10826 * @param {Object} state Global application state. 10827 * @param {?string} rootClientId Optional root client ID of block list. 10828 * 10829 * @return {Object[]} Tree of block objects with only clientID and innerBlocks set. 10830 */ 10831 const getEnabledClientIdsTree = (0,external_wp_data_namespaceObject.createSelector)(getEnabledClientIdsTreeUnmemoized, state => [state.blocks.order, state.blockEditingModes, state.settings.templateLock, state.blockListSettings, state.editorMode]); 10832 10833 /** 10834 * Returns a list of a given block's ancestors, from top to bottom. Blocks with 10835 * a 'disabled' editing mode are excluded. 10836 * 10837 * @see getBlockParents 10838 * 10839 * @param {Object} state Global application state. 10840 * @param {string} clientId The block client ID. 10841 * @param {boolean} ascending Order results from bottom to top (true) or top 10842 * to bottom (false). 10843 */ 10844 const getEnabledBlockParents = (0,external_wp_data_namespaceObject.createSelector)((state, clientId, ascending = false) => { 10845 return getBlockParents(state, clientId, ascending).filter(parent => getBlockEditingMode(state, parent) !== 'disabled'); 10846 }, state => [state.blocks.parents, state.blockEditingModes, state.settings.templateLock, state.blockListSettings]); 10847 10848 /** 10849 * Selector that returns the data needed to display a prompt when certain 10850 * blocks are removed, or `false` if no such prompt is requested. 10851 * 10852 * @param {Object} state Global application state. 10853 * 10854 * @return {Object|false} Data for removal prompt display, if any. 10855 */ 10856 function getRemovalPromptData(state) { 10857 return state.removalPromptData; 10858 } 10859 10860 /** 10861 * Returns true if removal prompt exists, or false otherwise. 10862 * 10863 * @param {Object} state Global application state. 10864 * 10865 * @return {boolean} Whether removal prompt exists. 10866 */ 10867 function getBlockRemovalRules(state) { 10868 return state.blockRemovalRules; 10869 } 10870 10871 /** 10872 * Returns the client ID of the block settings menu that is currently open. 10873 * 10874 * @param {Object} state Global application state. 10875 * @return {string|null} The client ID of the block menu that is currently open. 10876 */ 10877 function getOpenedBlockSettingsMenu(state) { 10878 return state.openedBlockSettingsMenu; 10879 } 10880 10881 /** 10882 * Returns all style overrides, intended to be merged with global editor styles. 10883 * 10884 * Overrides are sorted to match the order of the blocks they relate to. This 10885 * is useful to maintain correct CSS cascade order. 10886 * 10887 * @param {Object} state Global application state. 10888 * 10889 * @return {Array} An array of style ID to style override pairs. 10890 */ 10891 const getStyleOverrides = (0,external_wp_data_namespaceObject.createSelector)(state => { 10892 const clientIds = getClientIdsWithDescendants(state); 10893 const clientIdMap = clientIds.reduce((acc, clientId, index) => { 10894 acc[clientId] = index; 10895 return acc; 10896 }, {}); 10897 return [...state.styleOverrides].sort((overrideA, overrideB) => { 10898 var _clientIdMap$clientId, _clientIdMap$clientId2; 10899 // Once the overrides Map is spread to an array, the first element 10900 // is the key, while the second is the override itself including 10901 // the clientId to sort by. 10902 const [, { 10903 clientId: clientIdA 10904 }] = overrideA; 10905 const [, { 10906 clientId: clientIdB 10907 }] = overrideB; 10908 const aIndex = (_clientIdMap$clientId = clientIdMap[clientIdA]) !== null && _clientIdMap$clientId !== void 0 ? _clientIdMap$clientId : -1; 10909 const bIndex = (_clientIdMap$clientId2 = clientIdMap[clientIdB]) !== null && _clientIdMap$clientId2 !== void 0 ? _clientIdMap$clientId2 : -1; 10910 return aIndex - bIndex; 10911 }); 10912 }, state => [state.blocks.order, state.styleOverrides]); 10913 10914 /** @typedef {import('./actions').InserterMediaCategory} InserterMediaCategory */ 10915 /** 10916 * Returns the registered inserter media categories through the public API. 10917 * 10918 * @param {Object} state Editor state. 10919 * 10920 * @return {InserterMediaCategory[]} Inserter media categories. 10921 */ 10922 function getRegisteredInserterMediaCategories(state) { 10923 return state.registeredInserterMediaCategories; 10924 } 10925 10926 /** 10927 * Returns an array containing the allowed inserter media categories. 10928 * It merges the registered media categories from extenders with the 10929 * core ones. It also takes into account the allowed `mime_types`, which 10930 * can be altered by `upload_mimes` filter and restrict some of them. 10931 * 10932 * @param {Object} state Global application state. 10933 * 10934 * @return {InserterMediaCategory[]} Client IDs of descendants. 10935 */ 10936 const getInserterMediaCategories = (0,external_wp_data_namespaceObject.createSelector)(state => { 10937 const { 10938 settings: { 10939 inserterMediaCategories, 10940 allowedMimeTypes, 10941 enableOpenverseMediaCategory 10942 }, 10943 registeredInserterMediaCategories 10944 } = state; 10945 // The allowed `mime_types` can be altered by `upload_mimes` filter and restrict 10946 // some of them. In this case we shouldn't add the category to the available media 10947 // categories list in the inserter. 10948 if (!inserterMediaCategories && !registeredInserterMediaCategories.length || !allowedMimeTypes) { 10949 return; 10950 } 10951 const coreInserterMediaCategoriesNames = inserterMediaCategories?.map(({ 10952 name 10953 }) => name) || []; 10954 const mergedCategories = [...(inserterMediaCategories || []), ...(registeredInserterMediaCategories || []).filter(({ 10955 name 10956 }) => !coreInserterMediaCategoriesNames.includes(name))]; 10957 return mergedCategories.filter(category => { 10958 // Check if Openverse category is enabled. 10959 if (!enableOpenverseMediaCategory && category.name === 'openverse') { 10960 return false; 10961 } 10962 return Object.values(allowedMimeTypes).some(mimeType => mimeType.startsWith(`$category.mediaType}/`)); 10963 }); 10964 }, state => [state.settings.inserterMediaCategories, state.settings.allowedMimeTypes, state.settings.enableOpenverseMediaCategory, state.registeredInserterMediaCategories]); 10965 10966 /** 10967 * Returns whether there is at least one allowed pattern for inner blocks children. 10968 * This is useful for deferring the parsing of all patterns until needed. 10969 * 10970 * @param {Object} state Editor state. 10971 * @param {string} [rootClientId=null] Target root client ID. 10972 * 10973 * @return {boolean} If there is at least one allowed pattern. 10974 */ 10975 const hasAllowedPatterns = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (0,external_wp_data_namespaceObject.createSelector)((state, rootClientId = null) => { 10976 const { 10977 getAllPatterns 10978 } = unlock(select(STORE_NAME)); 10979 const patterns = getAllPatterns(); 10980 const { 10981 allowedBlockTypes 10982 } = getSettings(state); 10983 return patterns.some(pattern => { 10984 const { 10985 inserter = true 10986 } = pattern; 10987 if (!inserter) { 10988 return false; 10989 } 10990 const grammar = getGrammar(pattern); 10991 return checkAllowListRecursive(grammar, allowedBlockTypes) && grammar.every(({ 10992 name: blockName 10993 }) => canInsertBlockType(state, blockName, rootClientId)); 10994 }); 10995 }, (state, rootClientId) => [...getAllPatternsDependants(select)(state), ...getInsertBlockTypeDependants(state, rootClientId)])); 10996 function mapUserPattern(userPattern, __experimentalUserPatternCategories = []) { 10997 return { 10998 name: `core/block/$userPattern.id}`, 10999 id: userPattern.id, 11000 type: INSERTER_PATTERN_TYPES.user, 11001 title: userPattern.title.raw, 11002 categories: userPattern.wp_pattern_category.map(catId => { 11003 const category = __experimentalUserPatternCategories.find(({ 11004 id 11005 }) => id === catId); 11006 return category ? category.slug : catId; 11007 }), 11008 content: userPattern.content.raw, 11009 syncStatus: userPattern.wp_pattern_sync_status 11010 }; 11011 } 11012 const getPatternBySlug = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (0,external_wp_data_namespaceObject.createSelector)((state, patternName) => { 11013 var _state$settings$__exp, _state$settings$selec; 11014 // Only fetch reusable blocks if we know we need them. To do: maybe 11015 // use the entity record API to retrieve the block by slug. 11016 if (patternName?.startsWith('core/block/')) { 11017 const _id = parseInt(patternName.slice('core/block/'.length), 10); 11018 const block = unlock(select(STORE_NAME)).getReusableBlocks().find(({ 11019 id 11020 }) => id === _id); 11021 if (!block) { 11022 return null; 11023 } 11024 return mapUserPattern(block, state.settings.__experimentalUserPatternCategories); 11025 } 11026 return [ 11027 // This setting is left for back compat. 11028 ...((_state$settings$__exp = state.settings.__experimentalBlockPatterns) !== null && _state$settings$__exp !== void 0 ? _state$settings$__exp : []), ...((_state$settings$selec = state.settings[selectBlockPatternsKey]?.(select)) !== null && _state$settings$selec !== void 0 ? _state$settings$selec : [])].find(({ 11029 name 11030 }) => name === patternName); 11031 }, (state, patternName) => patternName?.startsWith('core/block/') ? [unlock(select(STORE_NAME)).getReusableBlocks(), state.settings.__experimentalReusableBlocks] : [state.settings.__experimentalBlockPatterns, state.settings[selectBlockPatternsKey]?.(select)])); 11032 const getAllPatterns = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (0,external_wp_data_namespaceObject.createSelector)(state => { 11033 var _state$settings$__exp2, _state$settings$selec2; 11034 return [...unlock(select(STORE_NAME)).getReusableBlocks().map(userPattern => mapUserPattern(userPattern, state.settings.__experimentalUserPatternCategories)), 11035 // This setting is left for back compat. 11036 ...((_state$settings$__exp2 = state.settings.__experimentalBlockPatterns) !== null && _state$settings$__exp2 !== void 0 ? _state$settings$__exp2 : []), ...((_state$settings$selec2 = state.settings[selectBlockPatternsKey]?.(select)) !== null && _state$settings$selec2 !== void 0 ? _state$settings$selec2 : [])].filter((x, index, arr) => index === arr.findIndex(y => x.name === y.name)); 11037 }, getAllPatternsDependants(select))); 11038 const isResolvingPatterns = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (0,external_wp_data_namespaceObject.createSelector)(state => { 11039 const blockPatternsSelect = state.settings[selectBlockPatternsKey]; 11040 const reusableBlocksSelect = state.settings[reusableBlocksSelectKey]; 11041 return (blockPatternsSelect ? blockPatternsSelect(select) === undefined : false) || (reusableBlocksSelect ? reusableBlocksSelect(select) === undefined : false); 11042 }, getAllPatternsDependants(select))); 11043 const EMPTY_ARRAY = []; 11044 const getReusableBlocks = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => state => { 11045 var _ref; 11046 const reusableBlocksSelect = state.settings[reusableBlocksSelectKey]; 11047 return (_ref = reusableBlocksSelect ? reusableBlocksSelect(select) : state.settings.__experimentalReusableBlocks) !== null && _ref !== void 0 ? _ref : EMPTY_ARRAY; 11048 }); 11049 11050 /** 11051 * Returns the element of the last element that had focus when focus left the editor canvas. 11052 * 11053 * @param {Object} state Block editor state. 11054 * 11055 * @return {Object} Element. 11056 */ 11057 function getLastFocus(state) { 11058 return state.lastFocus; 11059 } 11060 11061 /** 11062 * Returns true if the user is dragging anything, or false otherwise. It is possible for a 11063 * user to be dragging data from outside of the editor, so this selector is separate from 11064 * the `isDraggingBlocks` selector which only returns true if the user is dragging blocks. 11065 * 11066 * @param {Object} state Global application state. 11067 * 11068 * @return {boolean} Whether user is dragging. 11069 */ 11070 function private_selectors_isDragging(state) { 11071 return state.isDragging; 11072 } 11073 11074 /** 11075 * Retrieves the expanded block from the state. 11076 * 11077 * @param {Object} state Block editor state. 11078 * 11079 * @return {string|null} The client ID of the expanded block, if set. 11080 */ 11081 function getExpandedBlock(state) { 11082 return state.expandedBlock; 11083 } 11084 11085 /** 11086 * Retrieves the client ID of the ancestor block that is content locking the block 11087 * with the provided client ID. 11088 * 11089 * @param {Object} state Global application state. 11090 * @param {Object} clientId Client Id of the block. 11091 * 11092 * @return {?string} Client ID of the ancestor block that is content locking the block. 11093 */ 11094 const getContentLockingParent = (0,external_wp_data_namespaceObject.createSelector)((state, clientId) => { 11095 let current = clientId; 11096 let result; 11097 while (current = state.blocks.parents.get(current)) { 11098 if (getBlockName(state, current) === 'core/block' || getTemplateLock(state, current) === 'contentOnly') { 11099 result = current; 11100 } 11101 } 11102 return result; 11103 }, state => [state.blocks.parents, state.blockListSettings]); 11104 11105 /** 11106 * Retrieves the client ID of the block that is content locked but is 11107 * currently being temporarily edited as a non-locked block. 11108 * 11109 * @param {Object} state Global application state. 11110 * 11111 * @return {?string} The client ID of the block being temporarily edited as a non-locked block. 11112 */ 11113 function getTemporarilyEditingAsBlocks(state) { 11114 return state.temporarilyEditingAsBlocks; 11115 } 11116 11117 /** 11118 * Returns the focus mode that should be reapplied when the user stops editing 11119 * a content locked blocks as a block without locking. 11120 * 11121 * @param {Object} state Global application state. 11122 * 11123 * @return {?string} The focus mode that should be re-set when temporarily editing as blocks stops. 11124 */ 11125 function getTemporarilyEditingFocusModeToRevert(state) { 11126 return state.temporarilyEditingFocusModeRevert; 11127 } 11128 11129 /** 11130 * Returns the style attributes of multiple blocks. 11131 * 11132 * @param {Object} state Global application state. 11133 * @param {string[]} clientIds An array of block client IDs. 11134 * 11135 * @return {Object} An object where keys are client IDs and values are the corresponding block styles or undefined. 11136 */ 11137 const getBlockStyles = (0,external_wp_data_namespaceObject.createSelector)((state, clientIds) => clientIds.reduce((styles, clientId) => { 11138 styles[clientId] = state.blocks.attributes.get(clientId)?.style; 11139 return styles; 11140 }, {}), (state, clientIds) => [...clientIds.map(clientId => state.blocks.attributes.get(clientId)?.style)]); 11141 11142 /** 11143 * Returns whether zoom out mode is enabled. 11144 * 11145 * @param {Object} state Editor state. 11146 * 11147 * @return {boolean} Is zoom out mode enabled. 11148 */ 11149 function isZoomOutMode(state) { 11150 return __unstableGetEditorMode(state) === 'zoom-out'; 11151 } 11152 11153 /** 11154 * Retrieves the client ID of the block which contains the blocks 11155 * acting as "sections" in the editor. This is typically the "main content" 11156 * of the template/post. 11157 * 11158 * @param {Object} state Editor state. 11159 * 11160 * @return {string|undefined} The section root client ID or undefined if not set. 11161 */ 11162 function getSectionRootClientId(state) { 11163 return state.settings?.[sectionRootClientIdKey]; 11164 } 11165 11166 /** 11167 * Returns the zoom out state. 11168 * 11169 * @param {Object} state Global application state. 11170 * @return {boolean} The zoom out state. 11171 */ 11172 function getZoomLevel(state) { 11173 return state.zoomLevel; 11174 } 11175 11176 /** 11177 * Returns whether the editor is considered zoomed out. 11178 * 11179 * @param {Object} state Global application state. 11180 * @return {boolean} Whether the editor is zoomed. 11181 */ 11182 function isZoomOut(state) { 11183 return getZoomLevel(state) < 100; 11184 } 11185 11186 /** 11187 * Retrieves the client ID of the parent section block. 11188 * 11189 * @param {Object} state Global application state. 11190 * @param {string} clientId Client Id of the block. 11191 * 11192 * @return {?string} Client ID of the ancestor block that is content locking the block. 11193 */ 11194 const getParentSectionBlock = (state, clientId) => { 11195 let current = clientId; 11196 let result; 11197 while (!result && (current = state.blocks.parents.get(current))) { 11198 if (isSectionBlock(state, current)) { 11199 result = current; 11200 } 11201 } 11202 return result; 11203 }; 11204 11205 /** 11206 * Retrieves the client ID is a content locking parent 11207 * 11208 * @param {Object} state Global application state. 11209 * @param {string} clientId Client Id of the block. 11210 * 11211 * @return {boolean} Whether the block is a content locking parent. 11212 */ 11213 function isSectionBlock(state, clientId) { 11214 const sectionRootClientId = getSectionRootClientId(state); 11215 const sectionClientIds = getBlockOrder(state, sectionRootClientId); 11216 return getBlockName(state, clientId) === 'core/block' || getTemplateLock(state, clientId) === 'contentOnly' || isNavigationMode(state) && sectionClientIds.includes(clientId); 11217 } 11218 11219 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/selectors.js 11220 /** 11221 * WordPress dependencies 11222 */ 11223 11224 11225 11226 11227 11228 11229 11230 11231 /** 11232 * Internal dependencies 11233 */ 11234 11235 11236 11237 11238 11239 11240 /** 11241 * A block selection object. 11242 * 11243 * @typedef {Object} WPBlockSelection 11244 * 11245 * @property {string} clientId A block client ID. 11246 * @property {string} attributeKey A block attribute key. 11247 * @property {number} offset An attribute value offset, based on the rich 11248 * text value. See `wp.richText.create`. 11249 */ 11250 11251 // Module constants. 11252 const MILLISECONDS_PER_HOUR = 3600 * 1000; 11253 const MILLISECONDS_PER_DAY = 24 * 3600 * 1000; 11254 const MILLISECONDS_PER_WEEK = 7 * 24 * 3600 * 1000; 11255 11256 /** 11257 * Shared reference to an empty array for cases where it is important to avoid 11258 * returning a new array reference on every invocation, as in a connected or 11259 * other pure component which performs `shouldComponentUpdate` check on props. 11260 * This should be used as a last resort, since the normalized data should be 11261 * maintained by the reducer result in state. 11262 * 11263 * @type {Array} 11264 */ 11265 const selectors_EMPTY_ARRAY = []; 11266 11267 /** 11268 * Shared reference to an empty Set for cases where it is important to avoid 11269 * returning a new Set reference on every invocation, as in a connected or 11270 * other pure component which performs `shouldComponentUpdate` check on props. 11271 * This should be used as a last resort, since the normalized data should be 11272 * maintained by the reducer result in state. 11273 * 11274 * @type {Set} 11275 */ 11276 const EMPTY_SET = new Set(); 11277 const EMPTY_OBJECT = {}; 11278 11279 /** 11280 * Returns a block's name given its client ID, or null if no block exists with 11281 * the client ID. 11282 * 11283 * @param {Object} state Editor state. 11284 * @param {string} clientId Block client ID. 11285 * 11286 * @return {string} Block name. 11287 */ 11288 function getBlockName(state, clientId) { 11289 const block = state.blocks.byClientId.get(clientId); 11290 const socialLinkName = 'core/social-link'; 11291 if (external_wp_element_namespaceObject.Platform.OS !== 'web' && block?.name === socialLinkName) { 11292 const attributes = state.blocks.attributes.get(clientId); 11293 const { 11294 service 11295 } = attributes !== null && attributes !== void 0 ? attributes : {}; 11296 return service ? `$socialLinkName}-$service}` : socialLinkName; 11297 } 11298 return block ? block.name : null; 11299 } 11300 11301 /** 11302 * Returns whether a block is valid or not. 11303 * 11304 * @param {Object} state Editor state. 11305 * @param {string} clientId Block client ID. 11306 * 11307 * @return {boolean} Is Valid. 11308 */ 11309 function isBlockValid(state, clientId) { 11310 const block = state.blocks.byClientId.get(clientId); 11311 return !!block && block.isValid; 11312 } 11313 11314 /** 11315 * Returns a block's attributes given its client ID, or null if no block exists with 11316 * the client ID. 11317 * 11318 * @param {Object} state Editor state. 11319 * @param {string} clientId Block client ID. 11320 * 11321 * @return {Object?} Block attributes. 11322 */ 11323 function getBlockAttributes(state, clientId) { 11324 const block = state.blocks.byClientId.get(clientId); 11325 if (!block) { 11326 return null; 11327 } 11328 return state.blocks.attributes.get(clientId); 11329 } 11330 11331 /** 11332 * Returns a block given its client ID. This is a parsed copy of the block, 11333 * containing its `blockName`, `clientId`, and current `attributes` state. This 11334 * is not the block's registration settings, which must be retrieved from the 11335 * blocks module registration store. 11336 * 11337 * getBlock recurses through its inner blocks until all its children blocks have 11338 * been retrieved. Note that getBlock will not return the child inner blocks of 11339 * an inner block controller. This is because an inner block controller syncs 11340 * itself with its own entity, and should therefore not be included with the 11341 * blocks of a different entity. For example, say you call `getBlocks( TP )` to 11342 * get the blocks of a template part. If another template part is a child of TP, 11343 * then the nested template part's child blocks will not be returned. This way, 11344 * the template block itself is considered part of the parent, but the children 11345 * are not. 11346 * 11347 * @param {Object} state Editor state. 11348 * @param {string} clientId Block client ID. 11349 * 11350 * @return {Object} Parsed block object. 11351 */ 11352 function getBlock(state, clientId) { 11353 if (!state.blocks.byClientId.has(clientId)) { 11354 return null; 11355 } 11356 return state.blocks.tree.get(clientId); 11357 } 11358 const __unstableGetBlockWithoutInnerBlocks = (0,external_wp_data_namespaceObject.createSelector)((state, clientId) => { 11359 const block = state.blocks.byClientId.get(clientId); 11360 if (!block) { 11361 return null; 11362 } 11363 return { 11364 ...block, 11365 attributes: getBlockAttributes(state, clientId) 11366 }; 11367 }, (state, clientId) => [state.blocks.byClientId.get(clientId), state.blocks.attributes.get(clientId)]); 11368 11369 /** 11370 * Returns all block objects for the current post being edited as an array in 11371 * the order they appear in the post. Note that this will exclude child blocks 11372 * of nested inner block controllers. 11373 * 11374 * @param {Object} state Editor state. 11375 * @param {?string} rootClientId Optional root client ID of block list. 11376 * 11377 * @return {Object[]} Post blocks. 11378 */ 11379 function getBlocks(state, rootClientId) { 11380 const treeKey = !rootClientId || !areInnerBlocksControlled(state, rootClientId) ? rootClientId || '' : 'controlled||' + rootClientId; 11381 return state.blocks.tree.get(treeKey)?.innerBlocks || selectors_EMPTY_ARRAY; 11382 } 11383 11384 /** 11385 * Returns a stripped down block object containing only its client ID, 11386 * and its inner blocks' client IDs. 11387 * 11388 * @deprecated 11389 * 11390 * @param {Object} state Editor state. 11391 * @param {string} clientId Client ID of the block to get. 11392 * 11393 * @return {Object} Client IDs of the post blocks. 11394 */ 11395 const __unstableGetClientIdWithClientIdsTree = (0,external_wp_data_namespaceObject.createSelector)((state, clientId) => { 11396 external_wp_deprecated_default()("wp.data.select( 'core/block-editor' ).__unstableGetClientIdWithClientIdsTree", { 11397 since: '6.3', 11398 version: '6.5' 11399 }); 11400 return { 11401 clientId, 11402 innerBlocks: __unstableGetClientIdsTree(state, clientId) 11403 }; 11404 }, state => [state.blocks.order]); 11405 11406 /** 11407 * Returns the block tree represented in the block-editor store from the 11408 * given root, consisting of stripped down block objects containing only 11409 * their client IDs, and their inner blocks' client IDs. 11410 * 11411 * @deprecated 11412 * 11413 * @param {Object} state Editor state. 11414 * @param {?string} rootClientId Optional root client ID of block list. 11415 * 11416 * @return {Object[]} Client IDs of the post blocks. 11417 */ 11418 const __unstableGetClientIdsTree = (0,external_wp_data_namespaceObject.createSelector)((state, rootClientId = '') => { 11419 external_wp_deprecated_default()("wp.data.select( 'core/block-editor' ).__unstableGetClientIdsTree", { 11420 since: '6.3', 11421 version: '6.5' 11422 }); 11423 return getBlockOrder(state, rootClientId).map(clientId => __unstableGetClientIdWithClientIdsTree(state, clientId)); 11424 }, state => [state.blocks.order]); 11425 11426 /** 11427 * Returns an array containing the clientIds of all descendants of the blocks 11428 * given. Returned ids are ordered first by the order of the ids given, then 11429 * by the order that they appear in the editor. 11430 * 11431 * @param {Object} state Global application state. 11432 * @param {string|string[]} rootIds Client ID(s) for which descendant blocks are to be returned. 11433 * 11434 * @return {Array} Client IDs of descendants. 11435 */ 11436 const getClientIdsOfDescendants = (0,external_wp_data_namespaceObject.createSelector)((state, rootIds) => { 11437 rootIds = Array.isArray(rootIds) ? [...rootIds] : [rootIds]; 11438 const ids = []; 11439 11440 // Add the descendants of the root blocks first. 11441 for (const rootId of rootIds) { 11442 const order = state.blocks.order.get(rootId); 11443 if (order) { 11444 ids.push(...order); 11445 } 11446 } 11447 let index = 0; 11448 11449 // Add the descendants of the descendants, recursively. 11450 while (index < ids.length) { 11451 const id = ids[index]; 11452 const order = state.blocks.order.get(id); 11453 if (order) { 11454 ids.splice(index + 1, 0, ...order); 11455 } 11456 index++; 11457 } 11458 return ids; 11459 }, state => [state.blocks.order]); 11460 11461 /** 11462 * Returns an array containing the clientIds of the top-level blocks and 11463 * their descendants of any depth (for nested blocks). Ids are returned 11464 * in the same order that they appear in the editor. 11465 * 11466 * @param {Object} state Global application state. 11467 * 11468 * @return {Array} ids of top-level and descendant blocks. 11469 */ 11470 const getClientIdsWithDescendants = state => getClientIdsOfDescendants(state, ''); 11471 11472 /** 11473 * Returns the total number of blocks, or the total number of blocks with a specific name in a post. 11474 * The number returned includes nested blocks. 11475 * 11476 * @param {Object} state Global application state. 11477 * @param {?string} blockName Optional block name, if specified only blocks of that type will be counted. 11478 * 11479 * @return {number} Number of blocks in the post, or number of blocks with name equal to blockName. 11480 */ 11481 const getGlobalBlockCount = (0,external_wp_data_namespaceObject.createSelector)((state, blockName) => { 11482 const clientIds = getClientIdsWithDescendants(state); 11483 if (!blockName) { 11484 return clientIds.length; 11485 } 11486 let count = 0; 11487 for (const clientId of clientIds) { 11488 const block = state.blocks.byClientId.get(clientId); 11489 if (block.name === blockName) { 11490 count++; 11491 } 11492 } 11493 return count; 11494 }, state => [state.blocks.order, state.blocks.byClientId]); 11495 11496 /** 11497 * Returns all blocks that match a blockName. Results include nested blocks. 11498 * 11499 * @param {Object} state Global application state. 11500 * @param {string[]} blockName Block name(s) for which clientIds are to be returned. 11501 * 11502 * @return {Array} Array of clientIds of blocks with name equal to blockName. 11503 */ 11504 const getBlocksByName = (0,external_wp_data_namespaceObject.createSelector)((state, blockName) => { 11505 if (!blockName) { 11506 return selectors_EMPTY_ARRAY; 11507 } 11508 const blockNames = Array.isArray(blockName) ? blockName : [blockName]; 11509 const clientIds = getClientIdsWithDescendants(state); 11510 const foundBlocks = clientIds.filter(clientId => { 11511 const block = state.blocks.byClientId.get(clientId); 11512 return blockNames.includes(block.name); 11513 }); 11514 return foundBlocks.length > 0 ? foundBlocks : selectors_EMPTY_ARRAY; 11515 }, state => [state.blocks.order, state.blocks.byClientId]); 11516 11517 /** 11518 * Returns all global blocks that match a blockName. Results include nested blocks. 11519 * 11520 * @deprecated 11521 * 11522 * @param {Object} state Global application state. 11523 * @param {string[]} blockName Block name(s) for which clientIds are to be returned. 11524 * 11525 * @return {Array} Array of clientIds of blocks with name equal to blockName. 11526 */ 11527 function __experimentalGetGlobalBlocksByName(state, blockName) { 11528 external_wp_deprecated_default()("wp.data.select( 'core/block-editor' ).__experimentalGetGlobalBlocksByName", { 11529 since: '6.5', 11530 alternative: `wp.data.select( 'core/block-editor' ).getBlocksByName` 11531 }); 11532 return getBlocksByName(state, blockName); 11533 } 11534 11535 /** 11536 * Given an array of block client IDs, returns the corresponding array of block 11537 * objects. 11538 * 11539 * @param {Object} state Editor state. 11540 * @param {string[]} clientIds Client IDs for which blocks are to be returned. 11541 * 11542 * @return {WPBlock[]} Block objects. 11543 */ 11544 const getBlocksByClientId = (0,external_wp_data_namespaceObject.createSelector)((state, clientIds) => (Array.isArray(clientIds) ? clientIds : [clientIds]).map(clientId => getBlock(state, clientId)), (state, clientIds) => (Array.isArray(clientIds) ? clientIds : [clientIds]).map(clientId => state.blocks.tree.get(clientId))); 11545 11546 /** 11547 * Given an array of block client IDs, returns the corresponding array of block 11548 * names. 11549 * 11550 * @param {Object} state Editor state. 11551 * @param {string[]} clientIds Client IDs for which block names are to be returned. 11552 * 11553 * @return {string[]} Block names. 11554 */ 11555 const getBlockNamesByClientId = (0,external_wp_data_namespaceObject.createSelector)((state, clientIds) => getBlocksByClientId(state, clientIds).filter(Boolean).map(block => block.name), (state, clientIds) => getBlocksByClientId(state, clientIds)); 11556 11557 /** 11558 * Returns the number of blocks currently present in the post. 11559 * 11560 * @param {Object} state Editor state. 11561 * @param {?string} rootClientId Optional root client ID of block list. 11562 * 11563 * @return {number} Number of blocks in the post. 11564 */ 11565 function getBlockCount(state, rootClientId) { 11566 return getBlockOrder(state, rootClientId).length; 11567 } 11568 11569 /** 11570 * Returns the current selection start block client ID, attribute key and text 11571 * offset. 11572 * 11573 * @param {Object} state Block editor state. 11574 * 11575 * @return {WPBlockSelection} Selection start information. 11576 */ 11577 function getSelectionStart(state) { 11578 return state.selection.selectionStart; 11579 } 11580 11581 /** 11582 * Returns the current selection end block client ID, attribute key and text 11583 * offset. 11584 * 11585 * @param {Object} state Block editor state. 11586 * 11587 * @return {WPBlockSelection} Selection end information. 11588 */ 11589 function getSelectionEnd(state) { 11590 return state.selection.selectionEnd; 11591 } 11592 11593 /** 11594 * Returns the current block selection start. This value may be null, and it 11595 * may represent either a singular block selection or multi-selection start. 11596 * A selection is singular if its start and end match. 11597 * 11598 * @param {Object} state Global application state. 11599 * 11600 * @return {?string} Client ID of block selection start. 11601 */ 11602 function getBlockSelectionStart(state) { 11603 return state.selection.selectionStart.clientId; 11604 } 11605 11606 /** 11607 * Returns the current block selection end. This value may be null, and it 11608 * may represent either a singular block selection or multi-selection end. 11609 * A selection is singular if its start and end match. 11610 * 11611 * @param {Object} state Global application state. 11612 * 11613 * @return {?string} Client ID of block selection end. 11614 */ 11615 function getBlockSelectionEnd(state) { 11616 return state.selection.selectionEnd.clientId; 11617 } 11618 11619 /** 11620 * Returns the number of blocks currently selected in the post. 11621 * 11622 * @param {Object} state Global application state. 11623 * 11624 * @return {number} Number of blocks selected in the post. 11625 */ 11626 function getSelectedBlockCount(state) { 11627 const multiSelectedBlockCount = getMultiSelectedBlockClientIds(state).length; 11628 if (multiSelectedBlockCount) { 11629 return multiSelectedBlockCount; 11630 } 11631 return state.selection.selectionStart.clientId ? 1 : 0; 11632 } 11633 11634 /** 11635 * Returns true if there is a single selected block, or false otherwise. 11636 * 11637 * @param {Object} state Editor state. 11638 * 11639 * @return {boolean} Whether a single block is selected. 11640 */ 11641 function hasSelectedBlock(state) { 11642 const { 11643 selectionStart, 11644 selectionEnd 11645 } = state.selection; 11646 return !!selectionStart.clientId && selectionStart.clientId === selectionEnd.clientId; 11647 } 11648 11649 /** 11650 * Returns the currently selected block client ID, or null if there is no 11651 * selected block. 11652 * 11653 * @param {Object} state Editor state. 11654 * 11655 * @return {?string} Selected block client ID. 11656 */ 11657 function getSelectedBlockClientId(state) { 11658 const { 11659 selectionStart, 11660 selectionEnd 11661 } = state.selection; 11662 const { 11663 clientId 11664 } = selectionStart; 11665 if (!clientId || clientId !== selectionEnd.clientId) { 11666 return null; 11667 } 11668 return clientId; 11669 } 11670 11671 /** 11672 * Returns the currently selected block, or null if there is no selected block. 11673 * 11674 * @param {Object} state Global application state. 11675 * 11676 * @return {?Object} Selected block. 11677 */ 11678 function getSelectedBlock(state) { 11679 const clientId = getSelectedBlockClientId(state); 11680 return clientId ? getBlock(state, clientId) : null; 11681 } 11682 11683 /** 11684 * Given a block client ID, returns the root block from which the block is 11685 * nested, an empty string for top-level blocks, or null if the block does not 11686 * exist. 11687 * 11688 * @param {Object} state Editor state. 11689 * @param {string} clientId Block from which to find root client ID. 11690 * 11691 * @return {?string} Root client ID, if exists 11692 */ 11693 function getBlockRootClientId(state, clientId) { 11694 var _state$blocks$parents; 11695 return (_state$blocks$parents = state.blocks.parents.get(clientId)) !== null && _state$blocks$parents !== void 0 ? _state$blocks$parents : null; 11696 } 11697 11698 /** 11699 * Given a block client ID, returns the list of all its parents from top to bottom. 11700 * 11701 * @param {Object} state Editor state. 11702 * @param {string} clientId Block from which to find root client ID. 11703 * @param {boolean} ascending Order results from bottom to top (true) or top to bottom (false). 11704 * 11705 * @return {Array} ClientIDs of the parent blocks. 11706 */ 11707 const getBlockParents = (0,external_wp_data_namespaceObject.createSelector)((state, clientId, ascending = false) => { 11708 const parents = []; 11709 let current = clientId; 11710 while (current = state.blocks.parents.get(current)) { 11711 parents.push(current); 11712 } 11713 if (!parents.length) { 11714 return selectors_EMPTY_ARRAY; 11715 } 11716 return ascending ? parents : parents.reverse(); 11717 }, state => [state.blocks.parents]); 11718 11719 /** 11720 * Given a block client ID and a block name, returns the list of all its parents 11721 * from top to bottom, filtered by the given name(s). For example, if passed 11722 * 'core/group' as the blockName, it will only return parents which are group 11723 * blocks. If passed `[ 'core/group', 'core/cover']`, as the blockName, it will 11724 * return parents which are group blocks and parents which are cover blocks. 11725 * 11726 * @param {Object} state Editor state. 11727 * @param {string} clientId Block from which to find root client ID. 11728 * @param {string|string[]} blockName Block name(s) to filter. 11729 * @param {boolean} ascending Order results from bottom to top (true) or top to bottom (false). 11730 * 11731 * @return {Array} ClientIDs of the parent blocks. 11732 */ 11733 const getBlockParentsByBlockName = (0,external_wp_data_namespaceObject.createSelector)((state, clientId, blockName, ascending = false) => { 11734 const parents = getBlockParents(state, clientId, ascending); 11735 const hasName = Array.isArray(blockName) ? name => blockName.includes(name) : name => blockName === name; 11736 return parents.filter(id => hasName(getBlockName(state, id))); 11737 }, state => [state.blocks.parents]); 11738 /** 11739 * Given a block client ID, returns the root of the hierarchy from which the block is nested, return the block itself for root level blocks. 11740 * 11741 * @param {Object} state Editor state. 11742 * @param {string} clientId Block from which to find root client ID. 11743 * 11744 * @return {string} Root client ID 11745 */ 11746 function getBlockHierarchyRootClientId(state, clientId) { 11747 let current = clientId; 11748 let parent; 11749 do { 11750 parent = current; 11751 current = state.blocks.parents.get(current); 11752 } while (current); 11753 return parent; 11754 } 11755 11756 /** 11757 * Given a block client ID, returns the lowest common ancestor with selected client ID. 11758 * 11759 * @param {Object} state Editor state. 11760 * @param {string} clientId Block from which to find common ancestor client ID. 11761 * 11762 * @return {string} Common ancestor client ID or undefined 11763 */ 11764 function getLowestCommonAncestorWithSelectedBlock(state, clientId) { 11765 const selectedId = getSelectedBlockClientId(state); 11766 const clientParents = [...getBlockParents(state, clientId), clientId]; 11767 const selectedParents = [...getBlockParents(state, selectedId), selectedId]; 11768 let lowestCommonAncestor; 11769 const maxDepth = Math.min(clientParents.length, selectedParents.length); 11770 for (let index = 0; index < maxDepth; index++) { 11771 if (clientParents[index] === selectedParents[index]) { 11772 lowestCommonAncestor = clientParents[index]; 11773 } else { 11774 break; 11775 } 11776 } 11777 return lowestCommonAncestor; 11778 } 11779 11780 /** 11781 * Returns the client ID of the block adjacent one at the given reference 11782 * startClientId and modifier directionality. Defaults start startClientId to 11783 * the selected block, and direction as next block. Returns null if there is no 11784 * adjacent block. 11785 * 11786 * @param {Object} state Editor state. 11787 * @param {?string} startClientId Optional client ID of block from which to 11788 * search. 11789 * @param {?number} modifier Directionality multiplier (1 next, -1 11790 * previous). 11791 * 11792 * @return {?string} Return the client ID of the block, or null if none exists. 11793 */ 11794 function getAdjacentBlockClientId(state, startClientId, modifier = 1) { 11795 // Default to selected block. 11796 if (startClientId === undefined) { 11797 startClientId = getSelectedBlockClientId(state); 11798 } 11799 11800 // Try multi-selection starting at extent based on modifier. 11801 if (startClientId === undefined) { 11802 if (modifier < 0) { 11803 startClientId = getFirstMultiSelectedBlockClientId(state); 11804 } else { 11805 startClientId = getLastMultiSelectedBlockClientId(state); 11806 } 11807 } 11808 11809 // Validate working start client ID. 11810 if (!startClientId) { 11811 return null; 11812 } 11813 11814 // Retrieve start block root client ID, being careful to allow the falsey 11815 // empty string top-level root by explicitly testing against null. 11816 const rootClientId = getBlockRootClientId(state, startClientId); 11817 if (rootClientId === null) { 11818 return null; 11819 } 11820 const { 11821 order 11822 } = state.blocks; 11823 const orderSet = order.get(rootClientId); 11824 const index = orderSet.indexOf(startClientId); 11825 const nextIndex = index + 1 * modifier; 11826 11827 // Block was first in set and we're attempting to get previous. 11828 if (nextIndex < 0) { 11829 return null; 11830 } 11831 11832 // Block was last in set and we're attempting to get next. 11833 if (nextIndex === orderSet.length) { 11834 return null; 11835 } 11836 11837 // Assume incremented index is within the set. 11838 return orderSet[nextIndex]; 11839 } 11840 11841 /** 11842 * Returns the previous block's client ID from the given reference start ID. 11843 * Defaults start to the selected block. Returns null if there is no previous 11844 * block. 11845 * 11846 * @param {Object} state Editor state. 11847 * @param {?string} startClientId Optional client ID of block from which to 11848 * search. 11849 * 11850 * @return {?string} Adjacent block's client ID, or null if none exists. 11851 */ 11852 function getPreviousBlockClientId(state, startClientId) { 11853 return getAdjacentBlockClientId(state, startClientId, -1); 11854 } 11855 11856 /** 11857 * Returns the next block's client ID from the given reference start ID. 11858 * Defaults start to the selected block. Returns null if there is no next 11859 * block. 11860 * 11861 * @param {Object} state Editor state. 11862 * @param {?string} startClientId Optional client ID of block from which to 11863 * search. 11864 * 11865 * @return {?string} Adjacent block's client ID, or null if none exists. 11866 */ 11867 function getNextBlockClientId(state, startClientId) { 11868 return getAdjacentBlockClientId(state, startClientId, 1); 11869 } 11870 11871 /* eslint-disable jsdoc/valid-types */ 11872 /** 11873 * Returns the initial caret position for the selected block. 11874 * This position is to used to position the caret properly when the selected block changes. 11875 * If the current block is not a RichText, having initial position set to 0 means "focus block" 11876 * 11877 * @param {Object} state Global application state. 11878 * 11879 * @return {0|-1|null} Initial position. 11880 */ 11881 function getSelectedBlocksInitialCaretPosition(state) { 11882 /* eslint-enable jsdoc/valid-types */ 11883 return state.initialPosition; 11884 } 11885 11886 /** 11887 * Returns the current selection set of block client IDs (multiselection or single selection). 11888 * 11889 * @param {Object} state Editor state. 11890 * 11891 * @return {Array} Multi-selected block client IDs. 11892 */ 11893 const getSelectedBlockClientIds = (0,external_wp_data_namespaceObject.createSelector)(state => { 11894 const { 11895 selectionStart, 11896 selectionEnd 11897 } = state.selection; 11898 if (!selectionStart.clientId || !selectionEnd.clientId) { 11899 return selectors_EMPTY_ARRAY; 11900 } 11901 if (selectionStart.clientId === selectionEnd.clientId) { 11902 return [selectionStart.clientId]; 11903 } 11904 11905 // Retrieve root client ID to aid in retrieving relevant nested block 11906 // order, being careful to allow the falsey empty string top-level root 11907 // by explicitly testing against null. 11908 const rootClientId = getBlockRootClientId(state, selectionStart.clientId); 11909 if (rootClientId === null) { 11910 return selectors_EMPTY_ARRAY; 11911 } 11912 const blockOrder = getBlockOrder(state, rootClientId); 11913 const startIndex = blockOrder.indexOf(selectionStart.clientId); 11914 const endIndex = blockOrder.indexOf(selectionEnd.clientId); 11915 if (startIndex > endIndex) { 11916 return blockOrder.slice(endIndex, startIndex + 1); 11917 } 11918 return blockOrder.slice(startIndex, endIndex + 1); 11919 }, state => [state.blocks.order, state.selection.selectionStart.clientId, state.selection.selectionEnd.clientId]); 11920 11921 /** 11922 * Returns the current multi-selection set of block client IDs, or an empty 11923 * array if there is no multi-selection. 11924 * 11925 * @param {Object} state Editor state. 11926 * 11927 * @return {Array} Multi-selected block client IDs. 11928 */ 11929 function getMultiSelectedBlockClientIds(state) { 11930 const { 11931 selectionStart, 11932 selectionEnd 11933 } = state.selection; 11934 if (selectionStart.clientId === selectionEnd.clientId) { 11935 return selectors_EMPTY_ARRAY; 11936 } 11937 return getSelectedBlockClientIds(state); 11938 } 11939 11940 /** 11941 * Returns the current multi-selection set of blocks, or an empty array if 11942 * there is no multi-selection. 11943 * 11944 * @param {Object} state Editor state. 11945 * 11946 * @return {Array} Multi-selected block objects. 11947 */ 11948 const getMultiSelectedBlocks = (0,external_wp_data_namespaceObject.createSelector)(state => { 11949 const multiSelectedBlockClientIds = getMultiSelectedBlockClientIds(state); 11950 if (!multiSelectedBlockClientIds.length) { 11951 return selectors_EMPTY_ARRAY; 11952 } 11953 return multiSelectedBlockClientIds.map(clientId => getBlock(state, clientId)); 11954 }, state => [...getSelectedBlockClientIds.getDependants(state), state.blocks.byClientId, state.blocks.order, state.blocks.attributes]); 11955 11956 /** 11957 * Returns the client ID of the first block in the multi-selection set, or null 11958 * if there is no multi-selection. 11959 * 11960 * @param {Object} state Editor state. 11961 * 11962 * @return {?string} First block client ID in the multi-selection set. 11963 */ 11964 function getFirstMultiSelectedBlockClientId(state) { 11965 return getMultiSelectedBlockClientIds(state)[0] || null; 11966 } 11967 11968 /** 11969 * Returns the client ID of the last block in the multi-selection set, or null 11970 * if there is no multi-selection. 11971 * 11972 * @param {Object} state Editor state. 11973 * 11974 * @return {?string} Last block client ID in the multi-selection set. 11975 */ 11976 function getLastMultiSelectedBlockClientId(state) { 11977 const selectedClientIds = getMultiSelectedBlockClientIds(state); 11978 return selectedClientIds[selectedClientIds.length - 1] || null; 11979 } 11980 11981 /** 11982 * Returns true if a multi-selection exists, and the block corresponding to the 11983 * specified client ID is the first block of the multi-selection set, or false 11984 * otherwise. 11985 * 11986 * @param {Object} state Editor state. 11987 * @param {string} clientId Block client ID. 11988 * 11989 * @return {boolean} Whether block is first in multi-selection. 11990 */ 11991 function isFirstMultiSelectedBlock(state, clientId) { 11992 return getFirstMultiSelectedBlockClientId(state) === clientId; 11993 } 11994 11995 /** 11996 * Returns true if the client ID occurs within the block multi-selection, or 11997 * false otherwise. 11998 * 11999 * @param {Object} state Editor state. 12000 * @param {string} clientId Block client ID. 12001 * 12002 * @return {boolean} Whether block is in multi-selection set. 12003 */ 12004 function isBlockMultiSelected(state, clientId) { 12005 return getMultiSelectedBlockClientIds(state).indexOf(clientId) !== -1; 12006 } 12007 12008 /** 12009 * Returns true if an ancestor of the block is multi-selected, or false 12010 * otherwise. 12011 * 12012 * @param {Object} state Editor state. 12013 * @param {string} clientId Block client ID. 12014 * 12015 * @return {boolean} Whether an ancestor of the block is in multi-selection 12016 * set. 12017 */ 12018 const isAncestorMultiSelected = (0,external_wp_data_namespaceObject.createSelector)((state, clientId) => { 12019 let ancestorClientId = clientId; 12020 let isMultiSelected = false; 12021 while (ancestorClientId && !isMultiSelected) { 12022 ancestorClientId = getBlockRootClientId(state, ancestorClientId); 12023 isMultiSelected = isBlockMultiSelected(state, ancestorClientId); 12024 } 12025 return isMultiSelected; 12026 }, state => [state.blocks.order, state.selection.selectionStart.clientId, state.selection.selectionEnd.clientId]); 12027 12028 /** 12029 * Returns the client ID of the block which begins the multi-selection set, or 12030 * null if there is no multi-selection. 12031 * 12032 * This is not necessarily the first client ID in the selection. 12033 * 12034 * @see getFirstMultiSelectedBlockClientId 12035 * 12036 * @param {Object} state Editor state. 12037 * 12038 * @return {?string} Client ID of block beginning multi-selection. 12039 */ 12040 function getMultiSelectedBlocksStartClientId(state) { 12041 const { 12042 selectionStart, 12043 selectionEnd 12044 } = state.selection; 12045 if (selectionStart.clientId === selectionEnd.clientId) { 12046 return null; 12047 } 12048 return selectionStart.clientId || null; 12049 } 12050 12051 /** 12052 * Returns the client ID of the block which ends the multi-selection set, or 12053 * null if there is no multi-selection. 12054 * 12055 * This is not necessarily the last client ID in the selection. 12056 * 12057 * @see getLastMultiSelectedBlockClientId 12058 * 12059 * @param {Object} state Editor state. 12060 * 12061 * @return {?string} Client ID of block ending multi-selection. 12062 */ 12063 function getMultiSelectedBlocksEndClientId(state) { 12064 const { 12065 selectionStart, 12066 selectionEnd 12067 } = state.selection; 12068 if (selectionStart.clientId === selectionEnd.clientId) { 12069 return null; 12070 } 12071 return selectionEnd.clientId || null; 12072 } 12073 12074 /** 12075 * Returns true if the selection is not partial. 12076 * 12077 * @param {Object} state Editor state. 12078 * 12079 * @return {boolean} Whether the selection is mergeable. 12080 */ 12081 function __unstableIsFullySelected(state) { 12082 const selectionAnchor = getSelectionStart(state); 12083 const selectionFocus = getSelectionEnd(state); 12084 return !selectionAnchor.attributeKey && !selectionFocus.attributeKey && typeof selectionAnchor.offset === 'undefined' && typeof selectionFocus.offset === 'undefined'; 12085 } 12086 12087 /** 12088 * Returns true if the selection is collapsed. 12089 * 12090 * @param {Object} state Editor state. 12091 * 12092 * @return {boolean} Whether the selection is collapsed. 12093 */ 12094 function __unstableIsSelectionCollapsed(state) { 12095 const selectionAnchor = getSelectionStart(state); 12096 const selectionFocus = getSelectionEnd(state); 12097 return !!selectionAnchor && !!selectionFocus && selectionAnchor.clientId === selectionFocus.clientId && selectionAnchor.attributeKey === selectionFocus.attributeKey && selectionAnchor.offset === selectionFocus.offset; 12098 } 12099 function __unstableSelectionHasUnmergeableBlock(state) { 12100 return getSelectedBlockClientIds(state).some(clientId => { 12101 const blockName = getBlockName(state, clientId); 12102 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockName); 12103 return !blockType.merge; 12104 }); 12105 } 12106 12107 /** 12108 * Check whether the selection is mergeable. 12109 * 12110 * @param {Object} state Editor state. 12111 * @param {boolean} isForward Whether to merge forwards. 12112 * 12113 * @return {boolean} Whether the selection is mergeable. 12114 */ 12115 function __unstableIsSelectionMergeable(state, isForward) { 12116 const selectionAnchor = getSelectionStart(state); 12117 const selectionFocus = getSelectionEnd(state); 12118 12119 // It's not mergeable if the start and end are within the same block. 12120 if (selectionAnchor.clientId === selectionFocus.clientId) { 12121 return false; 12122 } 12123 12124 // It's not mergeable if there's no rich text selection. 12125 if (!selectionAnchor.attributeKey || !selectionFocus.attributeKey || typeof selectionAnchor.offset === 'undefined' || typeof selectionFocus.offset === 'undefined') { 12126 return false; 12127 } 12128 const anchorRootClientId = getBlockRootClientId(state, selectionAnchor.clientId); 12129 const focusRootClientId = getBlockRootClientId(state, selectionFocus.clientId); 12130 12131 // It's not mergeable if the selection doesn't start and end in the same 12132 // block list. Maybe in the future it should be allowed. 12133 if (anchorRootClientId !== focusRootClientId) { 12134 return false; 12135 } 12136 const blockOrder = getBlockOrder(state, anchorRootClientId); 12137 const anchorIndex = blockOrder.indexOf(selectionAnchor.clientId); 12138 const focusIndex = blockOrder.indexOf(selectionFocus.clientId); 12139 12140 // Reassign selection start and end based on order. 12141 let selectionStart, selectionEnd; 12142 if (anchorIndex > focusIndex) { 12143 selectionStart = selectionFocus; 12144 selectionEnd = selectionAnchor; 12145 } else { 12146 selectionStart = selectionAnchor; 12147 selectionEnd = selectionFocus; 12148 } 12149 const targetBlockClientId = isForward ? selectionEnd.clientId : selectionStart.clientId; 12150 const blockToMergeClientId = isForward ? selectionStart.clientId : selectionEnd.clientId; 12151 const targetBlockName = getBlockName(state, targetBlockClientId); 12152 const targetBlockType = (0,external_wp_blocks_namespaceObject.getBlockType)(targetBlockName); 12153 if (!targetBlockType.merge) { 12154 return false; 12155 } 12156 const blockToMerge = getBlock(state, blockToMergeClientId); 12157 12158 // It's mergeable if the blocks are of the same type. 12159 if (blockToMerge.name === targetBlockName) { 12160 return true; 12161 } 12162 12163 // If the blocks are of a different type, try to transform the block being 12164 // merged into the same type of block. 12165 const blocksToMerge = (0,external_wp_blocks_namespaceObject.switchToBlockType)(blockToMerge, targetBlockName); 12166 return blocksToMerge && blocksToMerge.length; 12167 } 12168 12169 /** 12170 * Get partial selected blocks with their content updated 12171 * based on the selection. 12172 * 12173 * @param {Object} state Editor state. 12174 * 12175 * @return {Object[]} Updated partial selected blocks. 12176 */ 12177 const __unstableGetSelectedBlocksWithPartialSelection = state => { 12178 const selectionAnchor = getSelectionStart(state); 12179 const selectionFocus = getSelectionEnd(state); 12180 if (selectionAnchor.clientId === selectionFocus.clientId) { 12181 return selectors_EMPTY_ARRAY; 12182 } 12183 12184 // Can't split if the selection is not set. 12185 if (!selectionAnchor.attributeKey || !selectionFocus.attributeKey || typeof selectionAnchor.offset === 'undefined' || typeof selectionFocus.offset === 'undefined') { 12186 return selectors_EMPTY_ARRAY; 12187 } 12188 const anchorRootClientId = getBlockRootClientId(state, selectionAnchor.clientId); 12189 const focusRootClientId = getBlockRootClientId(state, selectionFocus.clientId); 12190 12191 // It's not splittable if the selection doesn't start and end in the same 12192 // block list. Maybe in the future it should be allowed. 12193 if (anchorRootClientId !== focusRootClientId) { 12194 return selectors_EMPTY_ARRAY; 12195 } 12196 const blockOrder = getBlockOrder(state, anchorRootClientId); 12197 const anchorIndex = blockOrder.indexOf(selectionAnchor.clientId); 12198 const focusIndex = blockOrder.indexOf(selectionFocus.clientId); 12199 12200 // Reassign selection start and end based on order. 12201 const [selectionStart, selectionEnd] = anchorIndex > focusIndex ? [selectionFocus, selectionAnchor] : [selectionAnchor, selectionFocus]; 12202 const blockA = getBlock(state, selectionStart.clientId); 12203 const blockB = getBlock(state, selectionEnd.clientId); 12204 const htmlA = blockA.attributes[selectionStart.attributeKey]; 12205 const htmlB = blockB.attributes[selectionEnd.attributeKey]; 12206 let valueA = (0,external_wp_richText_namespaceObject.create)({ 12207 html: htmlA 12208 }); 12209 let valueB = (0,external_wp_richText_namespaceObject.create)({ 12210 html: htmlB 12211 }); 12212 valueA = (0,external_wp_richText_namespaceObject.remove)(valueA, 0, selectionStart.offset); 12213 valueB = (0,external_wp_richText_namespaceObject.remove)(valueB, selectionEnd.offset, valueB.text.length); 12214 return [{ 12215 ...blockA, 12216 attributes: { 12217 ...blockA.attributes, 12218 [selectionStart.attributeKey]: (0,external_wp_richText_namespaceObject.toHTMLString)({ 12219 value: valueA 12220 }) 12221 } 12222 }, { 12223 ...blockB, 12224 attributes: { 12225 ...blockB.attributes, 12226 [selectionEnd.attributeKey]: (0,external_wp_richText_namespaceObject.toHTMLString)({ 12227 value: valueB 12228 }) 12229 } 12230 }]; 12231 }; 12232 12233 /** 12234 * Returns an array containing all block client IDs in the editor in the order 12235 * they appear. Optionally accepts a root client ID of the block list for which 12236 * the order should be returned, defaulting to the top-level block order. 12237 * 12238 * @param {Object} state Editor state. 12239 * @param {?string} rootClientId Optional root client ID of block list. 12240 * 12241 * @return {Array} Ordered client IDs of editor blocks. 12242 */ 12243 function getBlockOrder(state, rootClientId) { 12244 return state.blocks.order.get(rootClientId || '') || selectors_EMPTY_ARRAY; 12245 } 12246 12247 /** 12248 * Returns the index at which the block corresponding to the specified client 12249 * ID occurs within the block order, or `-1` if the block does not exist. 12250 * 12251 * @param {Object} state Editor state. 12252 * @param {string} clientId Block client ID. 12253 * 12254 * @return {number} Index at which block exists in order. 12255 */ 12256 function getBlockIndex(state, clientId) { 12257 const rootClientId = getBlockRootClientId(state, clientId); 12258 return getBlockOrder(state, rootClientId).indexOf(clientId); 12259 } 12260 12261 /** 12262 * Returns true if the block corresponding to the specified client ID is 12263 * currently selected and no multi-selection exists, or false otherwise. 12264 * 12265 * @param {Object} state Editor state. 12266 * @param {string} clientId Block client ID. 12267 * 12268 * @return {boolean} Whether block is selected and multi-selection exists. 12269 */ 12270 function isBlockSelected(state, clientId) { 12271 const { 12272 selectionStart, 12273 selectionEnd 12274 } = state.selection; 12275 if (selectionStart.clientId !== selectionEnd.clientId) { 12276 return false; 12277 } 12278 return selectionStart.clientId === clientId; 12279 } 12280 12281 /** 12282 * Returns true if one of the block's inner blocks is selected. 12283 * 12284 * @param {Object} state Editor state. 12285 * @param {string} clientId Block client ID. 12286 * @param {boolean} deep Perform a deep check. 12287 * 12288 * @return {boolean} Whether the block has an inner block selected 12289 */ 12290 function hasSelectedInnerBlock(state, clientId, deep = false) { 12291 const selectedBlockClientIds = getSelectedBlockClientIds(state); 12292 if (!selectedBlockClientIds.length) { 12293 return false; 12294 } 12295 if (deep) { 12296 return selectedBlockClientIds.some(id => 12297 // Pass true because we don't care about order and it's more 12298 // performant. 12299 getBlockParents(state, id, true).includes(clientId)); 12300 } 12301 return selectedBlockClientIds.some(id => getBlockRootClientId(state, id) === clientId); 12302 } 12303 12304 /** 12305 * Returns true if one of the block's inner blocks is dragged. 12306 * 12307 * @param {Object} state Editor state. 12308 * @param {string} clientId Block client ID. 12309 * @param {boolean} deep Perform a deep check. 12310 * 12311 * @return {boolean} Whether the block has an inner block dragged 12312 */ 12313 function hasDraggedInnerBlock(state, clientId, deep = false) { 12314 return getBlockOrder(state, clientId).some(innerClientId => isBlockBeingDragged(state, innerClientId) || deep && hasDraggedInnerBlock(state, innerClientId, deep)); 12315 } 12316 12317 /** 12318 * Returns true if the block corresponding to the specified client ID is 12319 * currently selected but isn't the last of the selected blocks. Here "last" 12320 * refers to the block sequence in the document, _not_ the sequence of 12321 * multi-selection, which is why `state.selectionEnd` isn't used. 12322 * 12323 * @param {Object} state Editor state. 12324 * @param {string} clientId Block client ID. 12325 * 12326 * @return {boolean} Whether block is selected and not the last in the 12327 * selection. 12328 */ 12329 function isBlockWithinSelection(state, clientId) { 12330 if (!clientId) { 12331 return false; 12332 } 12333 const clientIds = getMultiSelectedBlockClientIds(state); 12334 const index = clientIds.indexOf(clientId); 12335 return index > -1 && index < clientIds.length - 1; 12336 } 12337 12338 /** 12339 * Returns true if a multi-selection has been made, or false otherwise. 12340 * 12341 * @param {Object} state Editor state. 12342 * 12343 * @return {boolean} Whether multi-selection has been made. 12344 */ 12345 function hasMultiSelection(state) { 12346 const { 12347 selectionStart, 12348 selectionEnd 12349 } = state.selection; 12350 return selectionStart.clientId !== selectionEnd.clientId; 12351 } 12352 12353 /** 12354 * Whether in the process of multi-selecting or not. This flag is only true 12355 * while the multi-selection is being selected (by mouse move), and is false 12356 * once the multi-selection has been settled. 12357 * 12358 * @see hasMultiSelection 12359 * 12360 * @param {Object} state Global application state. 12361 * 12362 * @return {boolean} True if multi-selecting, false if not. 12363 */ 12364 function selectors_isMultiSelecting(state) { 12365 return state.isMultiSelecting; 12366 } 12367 12368 /** 12369 * Selector that returns if multi-selection is enabled or not. 12370 * 12371 * @param {Object} state Global application state. 12372 * 12373 * @return {boolean} True if it should be possible to multi-select blocks, false if multi-selection is disabled. 12374 */ 12375 function selectors_isSelectionEnabled(state) { 12376 return state.isSelectionEnabled; 12377 } 12378 12379 /** 12380 * Returns the block's editing mode, defaulting to "visual" if not explicitly 12381 * assigned. 12382 * 12383 * @param {Object} state Editor state. 12384 * @param {string} clientId Block client ID. 12385 * 12386 * @return {Object} Block editing mode. 12387 */ 12388 function getBlockMode(state, clientId) { 12389 return state.blocksMode[clientId] || 'visual'; 12390 } 12391 12392 /** 12393 * Returns true if the user is typing, or false otherwise. 12394 * 12395 * @param {Object} state Global application state. 12396 * 12397 * @return {boolean} Whether user is typing. 12398 */ 12399 function selectors_isTyping(state) { 12400 return state.isTyping; 12401 } 12402 12403 /** 12404 * Returns true if the user is dragging blocks, or false otherwise. 12405 * 12406 * @param {Object} state Global application state. 12407 * 12408 * @return {boolean} Whether user is dragging blocks. 12409 */ 12410 function isDraggingBlocks(state) { 12411 return !!state.draggedBlocks.length; 12412 } 12413 12414 /** 12415 * Returns the client ids of any blocks being directly dragged. 12416 * 12417 * This does not include children of a parent being dragged. 12418 * 12419 * @param {Object} state Global application state. 12420 * 12421 * @return {string[]} Array of dragged block client ids. 12422 */ 12423 function getDraggedBlockClientIds(state) { 12424 return state.draggedBlocks; 12425 } 12426 12427 /** 12428 * Returns whether the block is being dragged. 12429 * 12430 * Only returns true if the block is being directly dragged, 12431 * not if the block is a child of a parent being dragged. 12432 * See `isAncestorBeingDragged` for child blocks. 12433 * 12434 * @param {Object} state Global application state. 12435 * @param {string} clientId Client id for block to check. 12436 * 12437 * @return {boolean} Whether the block is being dragged. 12438 */ 12439 function isBlockBeingDragged(state, clientId) { 12440 return state.draggedBlocks.includes(clientId); 12441 } 12442 12443 /** 12444 * Returns whether a parent/ancestor of the block is being dragged. 12445 * 12446 * @param {Object} state Global application state. 12447 * @param {string} clientId Client id for block to check. 12448 * 12449 * @return {boolean} Whether the block's ancestor is being dragged. 12450 */ 12451 function isAncestorBeingDragged(state, clientId) { 12452 // Return early if no blocks are being dragged rather than 12453 // the more expensive check for parents. 12454 if (!isDraggingBlocks(state)) { 12455 return false; 12456 } 12457 const parents = getBlockParents(state, clientId); 12458 return parents.some(parentClientId => isBlockBeingDragged(state, parentClientId)); 12459 } 12460 12461 /** 12462 * Returns true if the caret is within formatted text, or false otherwise. 12463 * 12464 * @deprecated 12465 * 12466 * @return {boolean} Whether the caret is within formatted text. 12467 */ 12468 function isCaretWithinFormattedText() { 12469 external_wp_deprecated_default()('wp.data.select( "core/block-editor" ).isCaretWithinFormattedText', { 12470 since: '6.1', 12471 version: '6.3' 12472 }); 12473 return false; 12474 } 12475 12476 /** 12477 * Returns the insertion point, the index at which the new inserted block would 12478 * be placed. Defaults to the last index. 12479 * 12480 * @param {Object} state Editor state. 12481 * 12482 * @return {Object} Insertion point object with `rootClientId`, `index`. 12483 */ 12484 const getBlockInsertionPoint = (0,external_wp_data_namespaceObject.createSelector)(state => { 12485 let rootClientId, index; 12486 const { 12487 insertionPoint, 12488 selection: { 12489 selectionEnd 12490 } 12491 } = state; 12492 if (insertionPoint !== null) { 12493 return insertionPoint; 12494 } 12495 const { 12496 clientId 12497 } = selectionEnd; 12498 if (clientId) { 12499 rootClientId = getBlockRootClientId(state, clientId) || undefined; 12500 index = getBlockIndex(state, selectionEnd.clientId) + 1; 12501 } else { 12502 index = getBlockOrder(state).length; 12503 } 12504 return { 12505 rootClientId, 12506 index 12507 }; 12508 }, state => [state.insertionPoint, state.selection.selectionEnd.clientId, state.blocks.parents, state.blocks.order]); 12509 12510 /** 12511 * Returns true if we should show the block insertion point. 12512 * 12513 * @param {Object} state Global application state. 12514 * 12515 * @return {?boolean} Whether the insertion point is visible or not. 12516 */ 12517 function isBlockInsertionPointVisible(state) { 12518 return state.insertionPoint !== null; 12519 } 12520 12521 /** 12522 * Returns whether the blocks matches the template or not. 12523 * 12524 * @param {boolean} state 12525 * @return {?boolean} Whether the template is valid or not. 12526 */ 12527 function isValidTemplate(state) { 12528 return state.template.isValid; 12529 } 12530 12531 /** 12532 * Returns the defined block template 12533 * 12534 * @param {boolean} state 12535 * 12536 * @return {?Array} Block Template. 12537 */ 12538 function getTemplate(state) { 12539 return state.settings.template; 12540 } 12541 12542 /** 12543 * Returns the defined block template lock. Optionally accepts a root block 12544 * client ID as context, otherwise defaulting to the global context. 12545 * 12546 * @param {Object} state Editor state. 12547 * @param {?string} rootClientId Optional block root client ID. 12548 * 12549 * @return {string|false} Block Template Lock 12550 */ 12551 function getTemplateLock(state, rootClientId) { 12552 var _getBlockListSettings; 12553 if (!rootClientId) { 12554 var _state$settings$templ; 12555 return (_state$settings$templ = state.settings.templateLock) !== null && _state$settings$templ !== void 0 ? _state$settings$templ : false; 12556 } 12557 return (_getBlockListSettings = getBlockListSettings(state, rootClientId)?.templateLock) !== null && _getBlockListSettings !== void 0 ? _getBlockListSettings : false; 12558 } 12559 12560 /** 12561 * Determines if the given block type is allowed to be inserted into the block list. 12562 * This function is not exported and not memoized because using a memoized selector 12563 * inside another memoized selector is just a waste of time. 12564 * 12565 * @param {Object} state Editor state. 12566 * @param {string|Object} blockName The block type object, e.g., the response 12567 * from the block directory; or a string name of 12568 * an installed block type, e.g.' core/paragraph'. 12569 * @param {?string} rootClientId Optional root client ID of block list. 12570 * 12571 * @return {boolean} Whether the given block type is allowed to be inserted. 12572 */ 12573 const canInsertBlockTypeUnmemoized = (state, blockName, rootClientId = null) => { 12574 let blockType; 12575 if (blockName && 'object' === typeof blockName) { 12576 blockType = blockName; 12577 blockName = blockType.name; 12578 } else { 12579 blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockName); 12580 } 12581 if (!blockType) { 12582 return false; 12583 } 12584 const { 12585 allowedBlockTypes 12586 } = getSettings(state); 12587 const isBlockAllowedInEditor = checkAllowList(allowedBlockTypes, blockName, true); 12588 if (!isBlockAllowedInEditor) { 12589 return false; 12590 } 12591 const isLocked = !!getTemplateLock(state, rootClientId); 12592 if (isLocked) { 12593 return false; 12594 } 12595 if (getBlockEditingMode(state, rootClientId !== null && rootClientId !== void 0 ? rootClientId : '') === 'disabled') { 12596 return false; 12597 } 12598 const parentBlockListSettings = getBlockListSettings(state, rootClientId); 12599 12600 // The parent block doesn't have settings indicating it doesn't support 12601 // inner blocks, return false. 12602 if (rootClientId && parentBlockListSettings === undefined) { 12603 return false; 12604 } 12605 const parentName = getBlockName(state, rootClientId); 12606 const parentBlockType = (0,external_wp_blocks_namespaceObject.getBlockType)(parentName); 12607 12608 // Look at the `blockType.allowedBlocks` field to determine whether this is an allowed child block. 12609 const parentAllowedChildBlocks = parentBlockType?.allowedBlocks; 12610 let hasParentAllowedBlock = checkAllowList(parentAllowedChildBlocks, blockName); 12611 12612 // The `allowedBlocks` block list setting can further limit which blocks are allowed children. 12613 if (hasParentAllowedBlock !== false) { 12614 const parentAllowedBlocks = parentBlockListSettings?.allowedBlocks; 12615 const hasParentListAllowedBlock = checkAllowList(parentAllowedBlocks, blockName); 12616 // Never downgrade the result from `true` to `null` 12617 if (hasParentListAllowedBlock !== null) { 12618 hasParentAllowedBlock = hasParentListAllowedBlock; 12619 } 12620 } 12621 const blockAllowedParentBlocks = blockType.parent; 12622 const hasBlockAllowedParent = checkAllowList(blockAllowedParentBlocks, parentName); 12623 let hasBlockAllowedAncestor = true; 12624 const blockAllowedAncestorBlocks = blockType.ancestor; 12625 if (blockAllowedAncestorBlocks) { 12626 const ancestors = [rootClientId, ...getBlockParents(state, rootClientId)]; 12627 hasBlockAllowedAncestor = ancestors.some(ancestorClientId => checkAllowList(blockAllowedAncestorBlocks, getBlockName(state, ancestorClientId))); 12628 } 12629 const canInsert = hasBlockAllowedAncestor && (hasParentAllowedBlock === null && hasBlockAllowedParent === null || hasParentAllowedBlock === true || hasBlockAllowedParent === true); 12630 if (!canInsert) { 12631 return canInsert; 12632 } 12633 12634 /** 12635 * This filter is an ad-hoc solution to prevent adding template parts inside post content. 12636 * Conceptually, having a filter inside a selector is bad pattern so this code will be 12637 * replaced by a declarative API that doesn't the following drawbacks: 12638 * 12639 * Filters are not reactive: Upon switching between "template mode" and non "template mode", 12640 * the filter and selector won't necessarily be executed again. For now, it doesn't matter much 12641 * because you can't switch between the two modes while the inserter stays open. 12642 * 12643 * Filters are global: Once they're defined, they will affect all editor instances and all registries. 12644 * An ideal API would only affect specific editor instances. 12645 */ 12646 return (0,external_wp_hooks_namespaceObject.applyFilters)('blockEditor.__unstableCanInsertBlockType', canInsert, blockType, rootClientId, { 12647 // Pass bound selectors of the current registry. If we're in a nested 12648 // context, the data will differ from the one selected from the root 12649 // registry. 12650 getBlock: getBlock.bind(null, state), 12651 getBlockParentsByBlockName: getBlockParentsByBlockName.bind(null, state) 12652 }); 12653 }; 12654 12655 /** 12656 * Determines if the given block type is allowed to be inserted into the block list. 12657 * 12658 * @param {Object} state Editor state. 12659 * @param {string} blockName The name of the block type, e.g.' core/paragraph'. 12660 * @param {?string} rootClientId Optional root client ID of block list. 12661 * 12662 * @return {boolean} Whether the given block type is allowed to be inserted. 12663 */ 12664 const canInsertBlockType = (0,external_wp_data_namespaceObject.createSelector)(canInsertBlockTypeUnmemoized, (state, blockName, rootClientId) => getInsertBlockTypeDependants(state, rootClientId)); 12665 12666 /** 12667 * Determines if the given blocks are allowed to be inserted into the block 12668 * list. 12669 * 12670 * @param {Object} state Editor state. 12671 * @param {string} clientIds The block client IDs to be inserted. 12672 * @param {?string} rootClientId Optional root client ID of block list. 12673 * 12674 * @return {boolean} Whether the given blocks are allowed to be inserted. 12675 */ 12676 function canInsertBlocks(state, clientIds, rootClientId = null) { 12677 return clientIds.every(id => canInsertBlockType(state, getBlockName(state, id), rootClientId)); 12678 } 12679 12680 /** 12681 * Determines if the given block is allowed to be deleted. 12682 * 12683 * @param {Object} state Editor state. 12684 * @param {string} clientId The block client Id. 12685 * 12686 * @return {boolean} Whether the given block is allowed to be removed. 12687 */ 12688 function canRemoveBlock(state, clientId) { 12689 const attributes = getBlockAttributes(state, clientId); 12690 if (attributes === null) { 12691 return true; 12692 } 12693 if (attributes.lock?.remove !== undefined) { 12694 return !attributes.lock.remove; 12695 } 12696 const rootClientId = getBlockRootClientId(state, clientId); 12697 if (getTemplateLock(state, rootClientId)) { 12698 return false; 12699 } 12700 return getBlockEditingMode(state, rootClientId) !== 'disabled'; 12701 } 12702 12703 /** 12704 * Determines if the given blocks are allowed to be removed. 12705 * 12706 * @param {Object} state Editor state. 12707 * @param {string} clientIds The block client IDs to be removed. 12708 * 12709 * @return {boolean} Whether the given blocks are allowed to be removed. 12710 */ 12711 function canRemoveBlocks(state, clientIds) { 12712 return clientIds.every(clientId => canRemoveBlock(state, clientId)); 12713 } 12714 12715 /** 12716 * Determines if the given block is allowed to be moved. 12717 * 12718 * @param {Object} state Editor state. 12719 * @param {string} clientId The block client Id. 12720 * 12721 * @return {boolean} Whether the given block is allowed to be moved. 12722 */ 12723 function canMoveBlock(state, clientId) { 12724 const attributes = getBlockAttributes(state, clientId); 12725 if (attributes === null) { 12726 return true; 12727 } 12728 if (attributes.lock?.move !== undefined) { 12729 return !attributes.lock.move; 12730 } 12731 const rootClientId = getBlockRootClientId(state, clientId); 12732 if (getTemplateLock(state, rootClientId) === 'all') { 12733 return false; 12734 } 12735 return getBlockEditingMode(state, rootClientId) !== 'disabled'; 12736 } 12737 12738 /** 12739 * Determines if the given blocks are allowed to be moved. 12740 * 12741 * @param {Object} state Editor state. 12742 * @param {string} clientIds The block client IDs to be moved. 12743 * 12744 * @return {boolean} Whether the given blocks are allowed to be moved. 12745 */ 12746 function canMoveBlocks(state, clientIds) { 12747 return clientIds.every(clientId => canMoveBlock(state, clientId)); 12748 } 12749 12750 /** 12751 * Determines if the given block is allowed to be edited. 12752 * 12753 * @param {Object} state Editor state. 12754 * @param {string} clientId The block client Id. 12755 * 12756 * @return {boolean} Whether the given block is allowed to be edited. 12757 */ 12758 function canEditBlock(state, clientId) { 12759 const attributes = getBlockAttributes(state, clientId); 12760 if (attributes === null) { 12761 return true; 12762 } 12763 const { 12764 lock 12765 } = attributes; 12766 12767 // When the edit is true, we cannot edit the block. 12768 return !lock?.edit; 12769 } 12770 12771 /** 12772 * Determines if the given block type can be locked/unlocked by a user. 12773 * 12774 * @param {Object} state Editor state. 12775 * @param {(string|Object)} nameOrType Block name or type object. 12776 * 12777 * @return {boolean} Whether a given block type can be locked/unlocked. 12778 */ 12779 function canLockBlockType(state, nameOrType) { 12780 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(nameOrType, 'lock', true)) { 12781 return false; 12782 } 12783 12784 // Use block editor settings as the default value. 12785 return !!state.settings?.canLockBlocks; 12786 } 12787 12788 /** 12789 * Returns information about how recently and frequently a block has been inserted. 12790 * 12791 * @param {Object} state Global application state. 12792 * @param {string} id A string which identifies the insert, e.g. 'core/block/12' 12793 * 12794 * @return {?{ time: number, count: number }} An object containing `time` which is when the last 12795 * insert occurred as a UNIX epoch, and `count` which is 12796 * the number of inserts that have occurred. 12797 */ 12798 function getInsertUsage(state, id) { 12799 var _state$preferences$in; 12800 return (_state$preferences$in = state.preferences.insertUsage?.[id]) !== null && _state$preferences$in !== void 0 ? _state$preferences$in : null; 12801 } 12802 12803 /** 12804 * Returns whether we can show a block type in the inserter 12805 * 12806 * @param {Object} state Global State 12807 * @param {Object} blockType BlockType 12808 * @param {?string} rootClientId Optional root client ID of block list. 12809 * 12810 * @return {boolean} Whether the given block type is allowed to be shown in the inserter. 12811 */ 12812 const canIncludeBlockTypeInInserter = (state, blockType, rootClientId) => { 12813 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'inserter', true)) { 12814 return false; 12815 } 12816 return canInsertBlockTypeUnmemoized(state, blockType.name, rootClientId); 12817 }; 12818 12819 /** 12820 * Return a function to be used to tranform a block variation to an inserter item 12821 * 12822 * @param {Object} state Global State 12823 * @param {Object} item Denormalized inserter item 12824 * @return {Function} Function to transform a block variation to inserter item 12825 */ 12826 const getItemFromVariation = (state, item) => variation => { 12827 const variationId = `$item.id}/$variation.name}`; 12828 const { 12829 time, 12830 count = 0 12831 } = getInsertUsage(state, variationId) || {}; 12832 return { 12833 ...item, 12834 id: variationId, 12835 icon: variation.icon || item.icon, 12836 title: variation.title || item.title, 12837 description: variation.description || item.description, 12838 category: variation.category || item.category, 12839 // If `example` is explicitly undefined for the variation, the preview will not be shown. 12840 example: variation.hasOwnProperty('example') ? variation.example : item.example, 12841 initialAttributes: { 12842 ...item.initialAttributes, 12843 ...variation.attributes 12844 }, 12845 innerBlocks: variation.innerBlocks, 12846 keywords: variation.keywords || item.keywords, 12847 frecency: calculateFrecency(time, count) 12848 }; 12849 }; 12850 12851 /** 12852 * Returns the calculated frecency. 12853 * 12854 * 'frecency' is a heuristic (https://en.wikipedia.org/wiki/Frecency) 12855 * that combines block usage frequenty and recency. 12856 * 12857 * @param {number} time When the last insert occurred as a UNIX epoch 12858 * @param {number} count The number of inserts that have occurred. 12859 * 12860 * @return {number} The calculated frecency. 12861 */ 12862 const calculateFrecency = (time, count) => { 12863 if (!time) { 12864 return count; 12865 } 12866 // The selector is cached, which means Date.now() is the last time that the 12867 // relevant state changed. This suits our needs. 12868 const duration = Date.now() - time; 12869 switch (true) { 12870 case duration < MILLISECONDS_PER_HOUR: 12871 return count * 4; 12872 case duration < MILLISECONDS_PER_DAY: 12873 return count * 2; 12874 case duration < MILLISECONDS_PER_WEEK: 12875 return count / 2; 12876 default: 12877 return count / 4; 12878 } 12879 }; 12880 12881 /** 12882 * Returns a function that accepts a block type and builds an item to be shown 12883 * in a specific context. It's used for building items for Inserter and available 12884 * block Transfroms list. 12885 * 12886 * @param {Object} state Editor state. 12887 * @param {Object} options Options object for handling the building of a block type. 12888 * @param {string} options.buildScope The scope for which the item is going to be used. 12889 * @return {Function} Function returns an item to be shown in a specific context (Inserter|Transforms list). 12890 */ 12891 const buildBlockTypeItem = (state, { 12892 buildScope = 'inserter' 12893 }) => blockType => { 12894 const id = blockType.name; 12895 let isDisabled = false; 12896 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType.name, 'multiple', true)) { 12897 isDisabled = getBlocksByClientId(state, getClientIdsWithDescendants(state)).some(({ 12898 name 12899 }) => name === blockType.name); 12900 } 12901 const { 12902 time, 12903 count = 0 12904 } = getInsertUsage(state, id) || {}; 12905 const blockItemBase = { 12906 id, 12907 name: blockType.name, 12908 title: blockType.title, 12909 icon: blockType.icon, 12910 isDisabled, 12911 frecency: calculateFrecency(time, count) 12912 }; 12913 if (buildScope === 'transform') { 12914 return blockItemBase; 12915 } 12916 const inserterVariations = (0,external_wp_blocks_namespaceObject.getBlockVariations)(blockType.name, 'inserter'); 12917 return { 12918 ...blockItemBase, 12919 initialAttributes: {}, 12920 description: blockType.description, 12921 category: blockType.category, 12922 keywords: blockType.keywords, 12923 variations: inserterVariations, 12924 example: blockType.example, 12925 utility: 1 // Deprecated. 12926 }; 12927 }; 12928 12929 /** 12930 * Determines the items that appear in the inserter. Includes both static 12931 * items (e.g. a regular block type) and dynamic items (e.g. a reusable block). 12932 * 12933 * Each item object contains what's necessary to display a button in the 12934 * inserter and handle its selection. 12935 * 12936 * The 'frecency' property is a heuristic (https://en.wikipedia.org/wiki/Frecency) 12937 * that combines block usage frequenty and recency. 12938 * 12939 * Items are returned ordered descendingly by their 'utility' and 'frecency'. 12940 * 12941 * @param {Object} state Editor state. 12942 * @param {?string} rootClientId Optional root client ID of block list. 12943 * 12944 * @return {WPEditorInserterItem[]} Items that appear in inserter. 12945 * 12946 * @typedef {Object} WPEditorInserterItem 12947 * @property {string} id Unique identifier for the item. 12948 * @property {string} name The type of block to create. 12949 * @property {Object} initialAttributes Attributes to pass to the newly created block. 12950 * @property {string} title Title of the item, as it appears in the inserter. 12951 * @property {string} icon Dashicon for the item, as it appears in the inserter. 12952 * @property {string} category Block category that the item is associated with. 12953 * @property {string[]} keywords Keywords that can be searched to find this item. 12954 * @property {boolean} isDisabled Whether or not the user should be prevented from inserting 12955 * this item. 12956 * @property {number} frecency Heuristic that combines frequency and recency. 12957 */ 12958 const getInserterItems = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (0,external_wp_data_namespaceObject.createSelector)((state, rootClientId = null, options = EMPTY_OBJECT) => { 12959 const buildReusableBlockInserterItem = reusableBlock => { 12960 const icon = !reusableBlock.wp_pattern_sync_status ? { 12961 src: library_symbol, 12962 foreground: 'var(--wp-block-synced-color)' 12963 } : library_symbol; 12964 const id = `core/block/$reusableBlock.id}`; 12965 const { 12966 time, 12967 count = 0 12968 } = getInsertUsage(state, id) || {}; 12969 const frecency = calculateFrecency(time, count); 12970 return { 12971 id, 12972 name: 'core/block', 12973 initialAttributes: { 12974 ref: reusableBlock.id 12975 }, 12976 title: reusableBlock.title?.raw, 12977 icon, 12978 category: 'reusable', 12979 keywords: ['reusable'], 12980 isDisabled: false, 12981 utility: 1, 12982 // Deprecated. 12983 frecency, 12984 content: reusableBlock.content?.raw, 12985 syncStatus: reusableBlock.wp_pattern_sync_status 12986 }; 12987 }; 12988 const syncedPatternInserterItems = canInsertBlockTypeUnmemoized(state, 'core/block', rootClientId) ? unlock(select(STORE_NAME)).getReusableBlocks().map(buildReusableBlockInserterItem) : []; 12989 const buildBlockTypeInserterItem = buildBlockTypeItem(state, { 12990 buildScope: 'inserter' 12991 }); 12992 let blockTypeInserterItems = (0,external_wp_blocks_namespaceObject.getBlockTypes)().filter(blockType => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'inserter', true)).map(buildBlockTypeInserterItem); 12993 if (options[withRootClientIdOptionKey]) { 12994 blockTypeInserterItems = blockTypeInserterItems.reduce((accumulator, item) => { 12995 item.rootClientId = rootClientId !== null && rootClientId !== void 0 ? rootClientId : ''; 12996 while (!canInsertBlockTypeUnmemoized(state, item.name, item.rootClientId)) { 12997 if (!item.rootClientId) { 12998 let sectionRootClientId; 12999 try { 13000 sectionRootClientId = getSectionRootClientId(state); 13001 } catch (e) {} 13002 if (sectionRootClientId && canInsertBlockTypeUnmemoized(state, item.name, sectionRootClientId)) { 13003 item.rootClientId = sectionRootClientId; 13004 } else { 13005 delete item.rootClientId; 13006 } 13007 break; 13008 } else { 13009 const parentClientId = getBlockRootClientId(state, item.rootClientId); 13010 item.rootClientId = parentClientId; 13011 } 13012 } 13013 13014 // We could also add non insertable items and gray them out. 13015 if (item.hasOwnProperty('rootClientId')) { 13016 accumulator.push(item); 13017 } 13018 return accumulator; 13019 }, []); 13020 } else { 13021 blockTypeInserterItems = blockTypeInserterItems.filter(blockType => canIncludeBlockTypeInInserter(state, blockType, rootClientId)); 13022 } 13023 const items = blockTypeInserterItems.reduce((accumulator, item) => { 13024 const { 13025 variations = [] 13026 } = item; 13027 // Exclude any block type item that is to be replaced by a default variation. 13028 if (!variations.some(({ 13029 isDefault 13030 }) => isDefault)) { 13031 accumulator.push(item); 13032 } 13033 if (variations.length) { 13034 const variationMapper = getItemFromVariation(state, item); 13035 accumulator.push(...variations.map(variationMapper)); 13036 } 13037 return accumulator; 13038 }, []); 13039 13040 // Ensure core blocks are prioritized in the returned results, 13041 // because third party blocks can be registered earlier than 13042 // the core blocks (usually by using the `init` action), 13043 // thus affecting the display order. 13044 // We don't sort reusable blocks as they are handled differently. 13045 const groupByType = (blocks, block) => { 13046 const { 13047 core, 13048 noncore 13049 } = blocks; 13050 const type = block.name.startsWith('core/') ? core : noncore; 13051 type.push(block); 13052 return blocks; 13053 }; 13054 const { 13055 core: coreItems, 13056 noncore: nonCoreItems 13057 } = items.reduce(groupByType, { 13058 core: [], 13059 noncore: [] 13060 }); 13061 const sortedBlockTypes = [...coreItems, ...nonCoreItems]; 13062 return [...sortedBlockTypes, ...syncedPatternInserterItems]; 13063 }, (state, rootClientId) => [(0,external_wp_blocks_namespaceObject.getBlockTypes)(), unlock(select(STORE_NAME)).getReusableBlocks(), state.blocks.order, state.preferences.insertUsage, ...getInsertBlockTypeDependants(state, rootClientId)])); 13064 13065 /** 13066 * Determines the items that appear in the available block transforms list. 13067 * 13068 * Each item object contains what's necessary to display a menu item in the 13069 * transform list and handle its selection. 13070 * 13071 * The 'frecency' property is a heuristic (https://en.wikipedia.org/wiki/Frecency) 13072 * that combines block usage frequenty and recency. 13073 * 13074 * Items are returned ordered descendingly by their 'frecency'. 13075 * 13076 * @param {Object} state Editor state. 13077 * @param {Object|Object[]} blocks Block object or array objects. 13078 * @param {?string} rootClientId Optional root client ID of block list. 13079 * 13080 * @return {WPEditorTransformItem[]} Items that appear in inserter. 13081 * 13082 * @typedef {Object} WPEditorTransformItem 13083 * @property {string} id Unique identifier for the item. 13084 * @property {string} name The type of block to create. 13085 * @property {string} title Title of the item, as it appears in the inserter. 13086 * @property {string} icon Dashicon for the item, as it appears in the inserter. 13087 * @property {boolean} isDisabled Whether or not the user should be prevented from inserting 13088 * this item. 13089 * @property {number} frecency Heuristic that combines frequency and recency. 13090 */ 13091 const getBlockTransformItems = (0,external_wp_data_namespaceObject.createSelector)((state, blocks, rootClientId = null) => { 13092 const normalizedBlocks = Array.isArray(blocks) ? blocks : [blocks]; 13093 const buildBlockTypeTransformItem = buildBlockTypeItem(state, { 13094 buildScope: 'transform' 13095 }); 13096 const blockTypeTransformItems = (0,external_wp_blocks_namespaceObject.getBlockTypes)().filter(blockType => canIncludeBlockTypeInInserter(state, blockType, rootClientId)).map(buildBlockTypeTransformItem); 13097 const itemsByName = Object.fromEntries(Object.entries(blockTypeTransformItems).map(([, value]) => [value.name, value])); 13098 const possibleTransforms = (0,external_wp_blocks_namespaceObject.getPossibleBlockTransformations)(normalizedBlocks).reduce((accumulator, block) => { 13099 if (itemsByName[block?.name]) { 13100 accumulator.push(itemsByName[block.name]); 13101 } 13102 return accumulator; 13103 }, []); 13104 return orderBy(possibleTransforms, block => itemsByName[block.name].frecency, 'desc'); 13105 }, (state, blocks, rootClientId) => [(0,external_wp_blocks_namespaceObject.getBlockTypes)(), state.preferences.insertUsage, ...getInsertBlockTypeDependants(state, rootClientId)]); 13106 13107 /** 13108 * Determines whether there are items to show in the inserter. 13109 * 13110 * @param {Object} state Editor state. 13111 * @param {?string} rootClientId Optional root client ID of block list. 13112 * 13113 * @return {boolean} Items that appear in inserter. 13114 */ 13115 const hasInserterItems = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (state, rootClientId = null) => { 13116 const hasBlockType = (0,external_wp_blocks_namespaceObject.getBlockTypes)().some(blockType => canIncludeBlockTypeInInserter(state, blockType, rootClientId)); 13117 if (hasBlockType) { 13118 return true; 13119 } 13120 const hasReusableBlock = canInsertBlockTypeUnmemoized(state, 'core/block', rootClientId) && unlock(select(STORE_NAME)).getReusableBlocks().length > 0; 13121 return hasReusableBlock; 13122 }); 13123 13124 /** 13125 * Returns the list of allowed inserter blocks for inner blocks children. 13126 * 13127 * @param {Object} state Editor state. 13128 * @param {?string} rootClientId Optional root client ID of block list. 13129 * 13130 * @return {Array?} The list of allowed block types. 13131 */ 13132 const getAllowedBlocks = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (0,external_wp_data_namespaceObject.createSelector)((state, rootClientId = null) => { 13133 if (!rootClientId) { 13134 return; 13135 } 13136 const blockTypes = (0,external_wp_blocks_namespaceObject.getBlockTypes)().filter(blockType => canIncludeBlockTypeInInserter(state, blockType, rootClientId)); 13137 const hasReusableBlock = canInsertBlockTypeUnmemoized(state, 'core/block', rootClientId) && unlock(select(STORE_NAME)).getReusableBlocks().length > 0; 13138 if (hasReusableBlock) { 13139 blockTypes.push('core/block'); 13140 } 13141 return blockTypes; 13142 }, (state, rootClientId) => [(0,external_wp_blocks_namespaceObject.getBlockTypes)(), unlock(select(STORE_NAME)).getReusableBlocks(), ...getInsertBlockTypeDependants(state, rootClientId)])); 13143 const __experimentalGetAllowedBlocks = (0,external_wp_data_namespaceObject.createSelector)((state, rootClientId = null) => { 13144 external_wp_deprecated_default()('wp.data.select( "core/block-editor" ).__experimentalGetAllowedBlocks', { 13145 alternative: 'wp.data.select( "core/block-editor" ).getAllowedBlocks', 13146 since: '6.2', 13147 version: '6.4' 13148 }); 13149 return getAllowedBlocks(state, rootClientId); 13150 }, (state, rootClientId) => getAllowedBlocks.getDependants(state, rootClientId)); 13151 13152 /** 13153 * Returns the block to be directly inserted by the block appender. 13154 * 13155 * @param {Object} state Editor state. 13156 * @param {?string} rootClientId Optional root client ID of block list. 13157 * 13158 * @return {WPDirectInsertBlock|undefined} The block type to be directly inserted. 13159 * 13160 * @typedef {Object} WPDirectInsertBlock 13161 * @property {string} name The type of block. 13162 * @property {?Object} attributes Attributes to pass to the newly created block. 13163 * @property {?Array<string>} attributesToCopy Attributes to be copied from adjecent blocks when inserted. 13164 */ 13165 function getDirectInsertBlock(state, rootClientId = null) { 13166 var _state$blockListSetti; 13167 if (!rootClientId) { 13168 return; 13169 } 13170 const { 13171 defaultBlock, 13172 directInsert 13173 } = (_state$blockListSetti = state.blockListSettings[rootClientId]) !== null && _state$blockListSetti !== void 0 ? _state$blockListSetti : {}; 13174 if (!defaultBlock || !directInsert) { 13175 return; 13176 } 13177 return defaultBlock; 13178 } 13179 function __experimentalGetDirectInsertBlock(state, rootClientId = null) { 13180 external_wp_deprecated_default()('wp.data.select( "core/block-editor" ).__experimentalGetDirectInsertBlock', { 13181 alternative: 'wp.data.select( "core/block-editor" ).getDirectInsertBlock', 13182 since: '6.3', 13183 version: '6.4' 13184 }); 13185 return getDirectInsertBlock(state, rootClientId); 13186 } 13187 const __experimentalGetParsedPattern = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (state, patternName) => { 13188 const pattern = unlock(select(STORE_NAME)).getPatternBySlug(patternName); 13189 return pattern ? getParsedPattern(pattern) : null; 13190 }); 13191 const getAllowedPatternsDependants = select => (state, rootClientId) => [...getAllPatternsDependants(select)(state), ...getInsertBlockTypeDependants(state, rootClientId)]; 13192 const patternsWithParsedBlocks = new WeakMap(); 13193 function enhancePatternWithParsedBlocks(pattern) { 13194 let enhancedPattern = patternsWithParsedBlocks.get(pattern); 13195 if (!enhancedPattern) { 13196 enhancedPattern = { 13197 ...pattern, 13198 get blocks() { 13199 return getParsedPattern(pattern).blocks; 13200 } 13201 }; 13202 patternsWithParsedBlocks.set(pattern, enhancedPattern); 13203 } 13204 return enhancedPattern; 13205 } 13206 13207 /** 13208 * Returns the list of allowed patterns for inner blocks children. 13209 * 13210 * @param {Object} state Editor state. 13211 * @param {?string} rootClientId Optional target root client ID. 13212 * 13213 * @return {Array?} The list of allowed patterns. 13214 */ 13215 const __experimentalGetAllowedPatterns = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => { 13216 return (0,external_wp_data_namespaceObject.createSelector)((state, rootClientId = null) => { 13217 const { 13218 getAllPatterns 13219 } = unlock(select(STORE_NAME)); 13220 const patterns = getAllPatterns(); 13221 const { 13222 allowedBlockTypes 13223 } = getSettings(state); 13224 const parsedPatterns = patterns.filter(({ 13225 inserter = true 13226 }) => !!inserter).map(enhancePatternWithParsedBlocks); 13227 const availableParsedPatterns = parsedPatterns.filter(pattern => checkAllowListRecursive(getGrammar(pattern), allowedBlockTypes)); 13228 const patternsAllowed = availableParsedPatterns.filter(pattern => getGrammar(pattern).every(({ 13229 blockName: name 13230 }) => canInsertBlockType(state, name, rootClientId))); 13231 return patternsAllowed; 13232 }, getAllowedPatternsDependants(select)); 13233 }); 13234 13235 /** 13236 * Returns the list of patterns based on their declared `blockTypes` 13237 * and a block's name. 13238 * Patterns can use `blockTypes` to integrate in work flows like 13239 * suggesting appropriate patterns in a Placeholder state(during insertion) 13240 * or blocks transformations. 13241 * 13242 * @param {Object} state Editor state. 13243 * @param {string|string[]} blockNames Block's name or array of block names to find matching pattens. 13244 * @param {?string} rootClientId Optional target root client ID. 13245 * 13246 * @return {Array} The list of matched block patterns based on declared `blockTypes` and block name. 13247 */ 13248 const getPatternsByBlockTypes = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (0,external_wp_data_namespaceObject.createSelector)((state, blockNames, rootClientId = null) => { 13249 if (!blockNames) { 13250 return selectors_EMPTY_ARRAY; 13251 } 13252 const patterns = select(STORE_NAME).__experimentalGetAllowedPatterns(rootClientId); 13253 const normalizedBlockNames = Array.isArray(blockNames) ? blockNames : [blockNames]; 13254 const filteredPatterns = patterns.filter(pattern => pattern?.blockTypes?.some?.(blockName => normalizedBlockNames.includes(blockName))); 13255 if (filteredPatterns.length === 0) { 13256 return selectors_EMPTY_ARRAY; 13257 } 13258 return filteredPatterns; 13259 }, (state, blockNames, rootClientId) => getAllowedPatternsDependants(select)(state, rootClientId))); 13260 const __experimentalGetPatternsByBlockTypes = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => { 13261 external_wp_deprecated_default()('wp.data.select( "core/block-editor" ).__experimentalGetPatternsByBlockTypes', { 13262 alternative: 'wp.data.select( "core/block-editor" ).getPatternsByBlockTypes', 13263 since: '6.2', 13264 version: '6.4' 13265 }); 13266 return select(STORE_NAME).getPatternsByBlockTypes; 13267 }); 13268 13269 /** 13270 * Determines the items that appear in the available pattern transforms list. 13271 * 13272 * For now we only handle blocks without InnerBlocks and take into account 13273 * the `role` property of blocks' attributes for the transformation. 13274 * 13275 * We return the first set of possible eligible block patterns, 13276 * by checking the `blockTypes` property. We still have to recurse through 13277 * block pattern's blocks and try to find matches from the selected blocks. 13278 * Now this happens in the consumer to avoid heavy operations in the selector. 13279 * 13280 * @param {Object} state Editor state. 13281 * @param {Object[]} blocks The selected blocks. 13282 * @param {?string} rootClientId Optional root client ID of block list. 13283 * 13284 * @return {WPBlockPattern[]} Items that are eligible for a pattern transformation. 13285 */ 13286 const __experimentalGetPatternTransformItems = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (0,external_wp_data_namespaceObject.createSelector)((state, blocks, rootClientId = null) => { 13287 if (!blocks) { 13288 return selectors_EMPTY_ARRAY; 13289 } 13290 /** 13291 * For now we only handle blocks without InnerBlocks and take into account 13292 * the `role` property of blocks' attributes for the transformation. 13293 * Note that the blocks have been retrieved through `getBlock`, which doesn't 13294 * return the inner blocks of an inner block controller, so we still need 13295 * to check for this case too. 13296 */ 13297 if (blocks.some(({ 13298 clientId, 13299 innerBlocks 13300 }) => innerBlocks.length || areInnerBlocksControlled(state, clientId))) { 13301 return selectors_EMPTY_ARRAY; 13302 } 13303 13304 // Create a Set of the selected block names that is used in patterns filtering. 13305 const selectedBlockNames = Array.from(new Set(blocks.map(({ 13306 name 13307 }) => name))); 13308 /** 13309 * Here we will return first set of possible eligible block patterns, 13310 * by checking the `blockTypes` property. We still have to recurse through 13311 * block pattern's blocks and try to find matches from the selected blocks. 13312 * Now this happens in the consumer to avoid heavy operations in the selector. 13313 */ 13314 return select(STORE_NAME).getPatternsByBlockTypes(selectedBlockNames, rootClientId); 13315 }, (state, blocks, rootClientId) => getAllowedPatternsDependants(select)(state, rootClientId))); 13316 13317 /** 13318 * Returns the Block List settings of a block, if any exist. 13319 * 13320 * @param {Object} state Editor state. 13321 * @param {?string} clientId Block client ID. 13322 * 13323 * @return {?Object} Block settings of the block if set. 13324 */ 13325 function getBlockListSettings(state, clientId) { 13326 return state.blockListSettings[clientId]; 13327 } 13328 13329 /** 13330 * Returns the editor settings. 13331 * 13332 * @param {Object} state Editor state. 13333 * 13334 * @return {Object} The editor settings object. 13335 */ 13336 function getSettings(state) { 13337 return state.settings; 13338 } 13339 13340 /** 13341 * Returns true if the most recent block change is be considered persistent, or 13342 * false otherwise. A persistent change is one committed by BlockEditorProvider 13343 * via its `onChange` callback, in addition to `onInput`. 13344 * 13345 * @param {Object} state Block editor state. 13346 * 13347 * @return {boolean} Whether the most recent block change was persistent. 13348 */ 13349 function isLastBlockChangePersistent(state) { 13350 return state.blocks.isPersistentChange; 13351 } 13352 13353 /** 13354 * Returns the block list settings for an array of blocks, if any exist. 13355 * 13356 * @param {Object} state Editor state. 13357 * @param {Array} clientIds Block client IDs. 13358 * 13359 * @return {Object} An object where the keys are client ids and the values are 13360 * a block list setting object. 13361 */ 13362 const __experimentalGetBlockListSettingsForBlocks = (0,external_wp_data_namespaceObject.createSelector)((state, clientIds = []) => { 13363 return clientIds.reduce((blockListSettingsForBlocks, clientId) => { 13364 if (!state.blockListSettings[clientId]) { 13365 return blockListSettingsForBlocks; 13366 } 13367 return { 13368 ...blockListSettingsForBlocks, 13369 [clientId]: state.blockListSettings[clientId] 13370 }; 13371 }, {}); 13372 }, state => [state.blockListSettings]); 13373 13374 /** 13375 * Returns the title of a given reusable block 13376 * 13377 * @param {Object} state Global application state. 13378 * @param {number|string} ref The shared block's ID. 13379 * 13380 * @return {string} The reusable block saved title. 13381 */ 13382 const __experimentalGetReusableBlockTitle = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (0,external_wp_data_namespaceObject.createSelector)((state, ref) => { 13383 external_wp_deprecated_default()("wp.data.select( 'core/block-editor' ).__experimentalGetReusableBlockTitle", { 13384 since: '6.6', 13385 version: '6.8' 13386 }); 13387 const reusableBlock = unlock(select(STORE_NAME)).getReusableBlocks().find(block => block.id === ref); 13388 if (!reusableBlock) { 13389 return null; 13390 } 13391 return reusableBlock.title?.raw; 13392 }, () => [unlock(select(STORE_NAME)).getReusableBlocks()])); 13393 13394 /** 13395 * Returns true if the most recent block change is be considered ignored, or 13396 * false otherwise. An ignored change is one not to be committed by 13397 * BlockEditorProvider, neither via `onChange` nor `onInput`. 13398 * 13399 * @param {Object} state Block editor state. 13400 * 13401 * @return {boolean} Whether the most recent block change was ignored. 13402 */ 13403 function __unstableIsLastBlockChangeIgnored(state) { 13404 // TODO: Removal Plan: Changes incurred by RECEIVE_BLOCKS should not be 13405 // ignored if in-fact they result in a change in blocks state. The current 13406 // need to ignore changes not a result of user interaction should be 13407 // accounted for in the refactoring of reusable blocks as occurring within 13408 // their own separate block editor / state (#7119). 13409 return state.blocks.isIgnoredChange; 13410 } 13411 13412 /** 13413 * Returns the block attributes changed as a result of the last dispatched 13414 * action. 13415 * 13416 * @param {Object} state Block editor state. 13417 * 13418 * @return {Object<string,Object>} Subsets of block attributes changed, keyed 13419 * by block client ID. 13420 */ 13421 function __experimentalGetLastBlockAttributeChanges(state) { 13422 return state.lastBlockAttributesChange; 13423 } 13424 13425 /** 13426 * Returns whether the navigation mode is enabled. 13427 * 13428 * @param {Object} state Editor state. 13429 * 13430 * @return {boolean} Is navigation mode enabled. 13431 */ 13432 function isNavigationMode(state) { 13433 return state.editorMode === 'navigation'; 13434 } 13435 13436 /** 13437 * Returns the current editor mode. 13438 * 13439 * @param {Object} state Editor state. 13440 * 13441 * @return {string} the editor mode. 13442 */ 13443 function __unstableGetEditorMode(state) { 13444 return state.editorMode; 13445 } 13446 13447 /** 13448 * Returns whether block moving mode is enabled. 13449 * 13450 * @param {Object} state Editor state. 13451 * 13452 * @return {string} Client Id of moving block. 13453 */ 13454 function selectors_hasBlockMovingClientId(state) { 13455 return state.hasBlockMovingClientId; 13456 } 13457 13458 /** 13459 * Returns true if the last change was an automatic change, false otherwise. 13460 * 13461 * @param {Object} state Global application state. 13462 * 13463 * @return {boolean} Whether the last change was automatic. 13464 */ 13465 function didAutomaticChange(state) { 13466 return !!state.automaticChangeStatus; 13467 } 13468 13469 /** 13470 * Returns true if the current highlighted block matches the block clientId. 13471 * 13472 * @param {Object} state Global application state. 13473 * @param {string} clientId The block to check. 13474 * 13475 * @return {boolean} Whether the block is currently highlighted. 13476 */ 13477 function isBlockHighlighted(state, clientId) { 13478 return state.highlightedBlock === clientId; 13479 } 13480 13481 /** 13482 * Checks if a given block has controlled inner blocks. 13483 * 13484 * @param {Object} state Global application state. 13485 * @param {string} clientId The block to check. 13486 * 13487 * @return {boolean} True if the block has controlled inner blocks. 13488 */ 13489 function areInnerBlocksControlled(state, clientId) { 13490 return !!state.blocks.controlledInnerBlocks[clientId]; 13491 } 13492 13493 /** 13494 * Returns the clientId for the first 'active' block of a given array of block names. 13495 * A block is 'active' if it (or a child) is the selected block. 13496 * Returns the first match moving up the DOM from the selected block. 13497 * 13498 * @param {Object} state Global application state. 13499 * @param {string[]} validBlocksNames The names of block types to check for. 13500 * 13501 * @return {string} The matching block's clientId. 13502 */ 13503 const __experimentalGetActiveBlockIdByBlockNames = (0,external_wp_data_namespaceObject.createSelector)((state, validBlockNames) => { 13504 if (!validBlockNames.length) { 13505 return null; 13506 } 13507 // Check if selected block is a valid entity area. 13508 const selectedBlockClientId = getSelectedBlockClientId(state); 13509 if (validBlockNames.includes(getBlockName(state, selectedBlockClientId))) { 13510 return selectedBlockClientId; 13511 } 13512 // Check if first selected block is a child of a valid entity area. 13513 const multiSelectedBlockClientIds = getMultiSelectedBlockClientIds(state); 13514 const entityAreaParents = getBlockParentsByBlockName(state, selectedBlockClientId || multiSelectedBlockClientIds[0], validBlockNames); 13515 if (entityAreaParents) { 13516 // Last parent closest/most interior. 13517 return entityAreaParents[entityAreaParents.length - 1]; 13518 } 13519 return null; 13520 }, (state, validBlockNames) => [state.selection.selectionStart.clientId, state.selection.selectionEnd.clientId, validBlockNames]); 13521 13522 /** 13523 * Tells if the block with the passed clientId was just inserted. 13524 * 13525 * @param {Object} state Global application state. 13526 * @param {Object} clientId Client Id of the block. 13527 * @param {?string} source Optional insertion source of the block. 13528 * @return {boolean} True if the block matches the last block inserted from the specified source. 13529 */ 13530 function wasBlockJustInserted(state, clientId, source) { 13531 const { 13532 lastBlockInserted 13533 } = state; 13534 return lastBlockInserted.clientIds?.includes(clientId) && lastBlockInserted.source === source; 13535 } 13536 13537 /** 13538 * Tells if the block is visible on the canvas or not. 13539 * 13540 * @param {Object} state Global application state. 13541 * @param {Object} clientId Client Id of the block. 13542 * @return {boolean} True if the block is visible. 13543 */ 13544 function isBlockVisible(state, clientId) { 13545 var _state$blockVisibilit; 13546 return (_state$blockVisibilit = state.blockVisibility?.[clientId]) !== null && _state$blockVisibilit !== void 0 ? _state$blockVisibilit : true; 13547 } 13548 13549 /** 13550 * Returns the currently hovered block. 13551 * 13552 * @param {Object} state Global application state. 13553 * @return {Object} Client Id of the hovered block. 13554 */ 13555 function getHoveredBlockClientId(state) { 13556 return state.hoveredBlockClientId; 13557 } 13558 13559 /** 13560 * Returns the list of all hidden blocks. 13561 * 13562 * @param {Object} state Global application state. 13563 * @return {[string]} List of hidden blocks. 13564 */ 13565 const __unstableGetVisibleBlocks = (0,external_wp_data_namespaceObject.createSelector)(state => { 13566 const visibleBlocks = new Set(Object.keys(state.blockVisibility).filter(key => state.blockVisibility[key])); 13567 if (visibleBlocks.size === 0) { 13568 return EMPTY_SET; 13569 } 13570 return visibleBlocks; 13571 }, state => [state.blockVisibility]); 13572 function __unstableHasActiveBlockOverlayActive(state, clientId) { 13573 // Prevent overlay on blocks with a non-default editing mode. If the mdoe is 13574 // 'disabled' then the overlay is redundant since the block can't be 13575 // selected. If the mode is 'contentOnly' then the overlay is redundant 13576 // since there will be no controls to interact with once selected. 13577 if (getBlockEditingMode(state, clientId) !== 'default') { 13578 return false; 13579 } 13580 13581 // If the block editing is locked, the block overlay is always active. 13582 if (!canEditBlock(state, clientId)) { 13583 return true; 13584 } 13585 const editorMode = __unstableGetEditorMode(state); 13586 13587 // In zoom-out mode, the block overlay is always active for section level blocks. 13588 if (editorMode === 'zoom-out') { 13589 const sectionRootClientId = getSectionRootClientId(state); 13590 if (sectionRootClientId) { 13591 const sectionClientIds = getBlockOrder(state, sectionRootClientId); 13592 if (sectionClientIds?.includes(clientId)) { 13593 return true; 13594 } 13595 } else if (clientId && !getBlockRootClientId(state, clientId)) { 13596 return true; 13597 } 13598 } 13599 13600 // In navigation mode, the block overlay is active when the block is not 13601 // selected (and doesn't contain a selected child). The same behavior is 13602 // also enabled in all modes for blocks that have controlled children 13603 // (reusable block, template part, navigation), unless explicitly disabled 13604 // with `supports.__experimentalDisableBlockOverlay`. 13605 const blockSupportDisable = (0,external_wp_blocks_namespaceObject.hasBlockSupport)(getBlockName(state, clientId), '__experimentalDisableBlockOverlay', false); 13606 const shouldEnableIfUnselected = editorMode === 'navigation' || (blockSupportDisable ? false : areInnerBlocksControlled(state, clientId)); 13607 return shouldEnableIfUnselected && !isBlockSelected(state, clientId) && !hasSelectedInnerBlock(state, clientId, true); 13608 } 13609 function __unstableIsWithinBlockOverlay(state, clientId) { 13610 let parent = state.blocks.parents.get(clientId); 13611 while (!!parent) { 13612 if (__unstableHasActiveBlockOverlayActive(state, parent)) { 13613 return true; 13614 } 13615 parent = state.blocks.parents.get(parent); 13616 } 13617 return false; 13618 } 13619 13620 /** 13621 * @typedef {import('../components/block-editing-mode').BlockEditingMode} BlockEditingMode 13622 */ 13623 13624 /** 13625 * Returns the block editing mode for a given block. 13626 * 13627 * The mode can be one of three options: 13628 * 13629 * - `'disabled'`: Prevents editing the block entirely, i.e. it cannot be 13630 * selected. 13631 * - `'contentOnly'`: Hides all non-content UI, e.g. auxiliary controls in the 13632 * toolbar, the block movers, block settings. 13633 * - `'default'`: Allows editing the block as normal. 13634 * 13635 * Blocks can set a mode using the `useBlockEditingMode` hook. 13636 * 13637 * The mode is inherited by all of the block's inner blocks, unless they have 13638 * their own mode. 13639 * 13640 * A template lock can also set a mode. If the template lock is `'contentOnly'`, 13641 * the block's mode is overridden to `'contentOnly'` if the block has a content 13642 * role attribute, or `'disabled'` otherwise. 13643 * 13644 * @see useBlockEditingMode 13645 * 13646 * @param {Object} state Global application state. 13647 * @param {string} clientId The block client ID, or `''` for the root container. 13648 * 13649 * @return {BlockEditingMode} The block editing mode. One of `'disabled'`, 13650 * `'contentOnly'`, or `'default'`. 13651 */ 13652 const getBlockEditingMode = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (state, clientId = '') => { 13653 // Some selectors that call this provide `null` as the default 13654 // rootClientId, but the default rootClientId is actually `''`. 13655 if (clientId === null) { 13656 clientId = ''; 13657 } 13658 13659 // In zoom-out mode, override the behavior set by 13660 // __unstableSetBlockEditingMode to only allow editing the top-level 13661 // sections. 13662 const editorMode = __unstableGetEditorMode(state); 13663 if (editorMode === 'zoom-out') { 13664 const sectionRootClientId = getSectionRootClientId(state); 13665 if (clientId === '' /* ROOT_CONTAINER_CLIENT_ID */) { 13666 return sectionRootClientId ? 'disabled' : 'contentOnly'; 13667 } 13668 if (clientId === sectionRootClientId) { 13669 return 'contentOnly'; 13670 } 13671 const sectionsClientIds = getBlockOrder(state, sectionRootClientId); 13672 13673 // Sections are always contentOnly. 13674 if (sectionsClientIds?.includes(clientId)) { 13675 return 'contentOnly'; 13676 } 13677 return 'disabled'; 13678 } 13679 const blockEditingMode = state.blockEditingModes.get(clientId); 13680 if (blockEditingMode) { 13681 return blockEditingMode; 13682 } 13683 if (!clientId) { 13684 return 'default'; 13685 } 13686 const rootClientId = getBlockRootClientId(state, clientId); 13687 const templateLock = getTemplateLock(state, rootClientId); 13688 if (templateLock === 'contentOnly') { 13689 const name = getBlockName(state, clientId); 13690 const { 13691 hasContentRoleAttribute 13692 } = unlock(select(external_wp_blocks_namespaceObject.store)); 13693 const isContent = hasContentRoleAttribute(name); 13694 return isContent ? 'contentOnly' : 'disabled'; 13695 } 13696 const parentMode = getBlockEditingMode(state, rootClientId); 13697 return parentMode === 'contentOnly' ? 'default' : parentMode; 13698 }); 13699 13700 /** 13701 * Indicates if a block is ungroupable. 13702 * A block is ungroupable if it is a single grouping block with inner blocks. 13703 * If a block has an `ungroup` transform, it is also ungroupable, without the 13704 * requirement of being the default grouping block. 13705 * Additionally a block can only be ungrouped if it has inner blocks and can 13706 * be removed. 13707 * 13708 * @param {Object} state Global application state. 13709 * @param {string} clientId Client Id of the block. If not passed the selected block's client id will be used. 13710 * @return {boolean} True if the block is ungroupable. 13711 */ 13712 const isUngroupable = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (state, clientId = '') => { 13713 const _clientId = clientId || getSelectedBlockClientId(state); 13714 if (!_clientId) { 13715 return false; 13716 } 13717 const { 13718 getGroupingBlockName 13719 } = select(external_wp_blocks_namespaceObject.store); 13720 const block = getBlock(state, _clientId); 13721 const groupingBlockName = getGroupingBlockName(); 13722 const _isUngroupable = block && (block.name === groupingBlockName || (0,external_wp_blocks_namespaceObject.getBlockType)(block.name)?.transforms?.ungroup) && !!block.innerBlocks.length; 13723 return _isUngroupable && canRemoveBlock(state, _clientId); 13724 }); 13725 13726 /** 13727 * Indicates if the provided blocks(by client ids) are groupable. 13728 * We need to have at least one block, have a grouping block name set and 13729 * be able to remove these blocks. 13730 * 13731 * @param {Object} state Global application state. 13732 * @param {string[]} clientIds Block client ids. If not passed the selected blocks client ids will be used. 13733 * @return {boolean} True if the blocks are groupable. 13734 */ 13735 const isGroupable = (0,external_wp_data_namespaceObject.createRegistrySelector)(select => (state, clientIds = selectors_EMPTY_ARRAY) => { 13736 const { 13737 getGroupingBlockName 13738 } = select(external_wp_blocks_namespaceObject.store); 13739 const groupingBlockName = getGroupingBlockName(); 13740 const _clientIds = clientIds?.length ? clientIds : getSelectedBlockClientIds(state); 13741 const rootClientId = _clientIds?.length ? getBlockRootClientId(state, _clientIds[0]) : undefined; 13742 const groupingBlockAvailable = canInsertBlockType(state, groupingBlockName, rootClientId); 13743 const _isGroupable = groupingBlockAvailable && _clientIds.length; 13744 return _isGroupable && canRemoveBlocks(state, _clientIds); 13745 }); 13746 13747 /** 13748 * DO-NOT-USE in production. 13749 * This selector is created for internal/experimental only usage and may be 13750 * removed anytime without any warning, causing breakage on any plugin or theme invoking it. 13751 * 13752 * @deprecated 13753 * 13754 * @param {Object} state Global application state. 13755 * @param {Object} clientId Client Id of the block. 13756 * 13757 * @return {?string} Client ID of the ancestor block that is content locking the block. 13758 */ 13759 const __unstableGetContentLockingParent = (state, clientId) => { 13760 external_wp_deprecated_default()("wp.data.select( 'core/block-editor' ).__unstableGetContentLockingParent", { 13761 since: '6.1', 13762 version: '6.7' 13763 }); 13764 return getContentLockingParent(state, clientId); 13765 }; 13766 13767 /** 13768 * DO-NOT-USE in production. 13769 * This selector is created for internal/experimental only usage and may be 13770 * removed anytime without any warning, causing breakage on any plugin or theme invoking it. 13771 * 13772 * @deprecated 13773 * 13774 * @param {Object} state Global application state. 13775 */ 13776 function __unstableGetTemporarilyEditingAsBlocks(state) { 13777 external_wp_deprecated_default()("wp.data.select( 'core/block-editor' ).__unstableGetTemporarilyEditingAsBlocks", { 13778 since: '6.1', 13779 version: '6.7' 13780 }); 13781 return getTemporarilyEditingAsBlocks(state); 13782 } 13783 13784 /** 13785 * DO-NOT-USE in production. 13786 * This selector is created for internal/experimental only usage and may be 13787 * removed anytime without any warning, causing breakage on any plugin or theme invoking it. 13788 * 13789 * @deprecated 13790 * 13791 * @param {Object} state Global application state. 13792 */ 13793 function __unstableGetTemporarilyEditingFocusModeToRevert(state) { 13794 external_wp_deprecated_default()("wp.data.select( 'core/block-editor' ).__unstableGetTemporarilyEditingFocusModeToRevert", { 13795 since: '6.5', 13796 version: '6.7' 13797 }); 13798 return getTemporarilyEditingFocusModeToRevert(state); 13799 } 13800 13801 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/private-actions.js 13802 /** 13803 * WordPress dependencies 13804 */ 13805 13806 13807 /** 13808 * Internal dependencies 13809 */ 13810 13811 13812 const castArray = maybeArray => Array.isArray(maybeArray) ? maybeArray : [maybeArray]; 13813 13814 /** 13815 * A list of private/experimental block editor settings that 13816 * should not become a part of the WordPress public API. 13817 * BlockEditorProvider will remove these settings from the 13818 * settings object it receives. 13819 * 13820 * @see https://github.com/WordPress/gutenberg/pull/46131 13821 */ 13822 const privateSettings = ['inserterMediaCategories', 'blockInspectorAnimation']; 13823 13824 /** 13825 * Action that updates the block editor settings and 13826 * conditionally preserves the experimental ones. 13827 * 13828 * @param {Object} settings Updated settings 13829 * @param {Object} options Options object. 13830 * @param {boolean} options.stripExperimentalSettings Whether to strip experimental settings. 13831 * @param {boolean} options.reset Whether to reset the settings. 13832 * @return {Object} Action object 13833 */ 13834 function __experimentalUpdateSettings(settings, { 13835 stripExperimentalSettings = false, 13836 reset = false 13837 } = {}) { 13838 let cleanSettings = settings; 13839 // There are no plugins in the mobile apps, so there is no 13840 // need to strip the experimental settings: 13841 if (stripExperimentalSettings && external_wp_element_namespaceObject.Platform.OS === 'web') { 13842 cleanSettings = {}; 13843 for (const key in settings) { 13844 if (!privateSettings.includes(key)) { 13845 cleanSettings[key] = settings[key]; 13846 } 13847 } 13848 } 13849 return { 13850 type: 'UPDATE_SETTINGS', 13851 settings: cleanSettings, 13852 reset 13853 }; 13854 } 13855 13856 /** 13857 * Hides the block interface (eg. toolbar, outline, etc.) 13858 * 13859 * @return {Object} Action object. 13860 */ 13861 function hideBlockInterface() { 13862 return { 13863 type: 'HIDE_BLOCK_INTERFACE' 13864 }; 13865 } 13866 13867 /** 13868 * Shows the block interface (eg. toolbar, outline, etc.) 13869 * 13870 * @return {Object} Action object. 13871 */ 13872 function showBlockInterface() { 13873 return { 13874 type: 'SHOW_BLOCK_INTERFACE' 13875 }; 13876 } 13877 13878 /** 13879 * Yields action objects used in signalling that the blocks corresponding to 13880 * the set of specified client IDs are to be removed. 13881 * 13882 * Compared to `removeBlocks`, this private interface exposes an additional 13883 * parameter; see `forceRemove`. 13884 * 13885 * @param {string|string[]} clientIds Client IDs of blocks to remove. 13886 * @param {boolean} selectPrevious True if the previous block 13887 * or the immediate parent 13888 * (if no previous block exists) 13889 * should be selected 13890 * when a block is removed. 13891 * @param {boolean} forceRemove Whether to force the operation, 13892 * bypassing any checks for certain 13893 * block types. 13894 */ 13895 const privateRemoveBlocks = (clientIds, selectPrevious = true, forceRemove = false) => ({ 13896 select, 13897 dispatch, 13898 registry 13899 }) => { 13900 if (!clientIds || !clientIds.length) { 13901 return; 13902 } 13903 clientIds = castArray(clientIds); 13904 const canRemoveBlocks = select.canRemoveBlocks(clientIds); 13905 if (!canRemoveBlocks) { 13906 return; 13907 } 13908 13909 // In certain editing contexts, we'd like to prevent accidental removal 13910 // of important blocks. For example, in the site editor, the Query Loop 13911 // block is deemed important. In such cases, we'll ask the user for 13912 // confirmation that they intended to remove such block(s). However, 13913 // the editor instance is responsible for presenting those confirmation 13914 // prompts to the user. Any instance opting into removal prompts must 13915 // register using `setBlockRemovalRules()`. 13916 // 13917 // @see https://github.com/WordPress/gutenberg/pull/51145 13918 const rules = !forceRemove && select.getBlockRemovalRules(); 13919 if (rules) { 13920 function flattenBlocks(blocks) { 13921 const result = []; 13922 const stack = [...blocks]; 13923 while (stack.length) { 13924 const { 13925 innerBlocks, 13926 ...block 13927 } = stack.shift(); 13928 stack.push(...innerBlocks); 13929 result.push(block); 13930 } 13931 return result; 13932 } 13933 const blockList = clientIds.map(select.getBlock); 13934 const flattenedBlocks = flattenBlocks(blockList); 13935 13936 // Find the first message and use it. 13937 let message; 13938 for (const rule of rules) { 13939 message = rule.callback(flattenedBlocks); 13940 if (message) { 13941 dispatch(displayBlockRemovalPrompt(clientIds, selectPrevious, message)); 13942 return; 13943 } 13944 } 13945 } 13946 if (selectPrevious) { 13947 dispatch.selectPreviousBlock(clientIds[0], selectPrevious); 13948 } 13949 13950 // We're batching these two actions because an extra `undo/redo` step can 13951 // be created, based on whether we insert a default block or not. 13952 registry.batch(() => { 13953 dispatch({ 13954 type: 'REMOVE_BLOCKS', 13955 clientIds 13956 }); 13957 // To avoid a focus loss when removing the last block, assure there is 13958 // always a default block if the last of the blocks have been removed. 13959 dispatch(ensureDefaultBlock()); 13960 }); 13961 }; 13962 13963 /** 13964 * Action which will insert a default block insert action if there 13965 * are no other blocks at the root of the editor. This action should be used 13966 * in actions which may result in no blocks remaining in the editor (removal, 13967 * replacement, etc). 13968 */ 13969 const ensureDefaultBlock = () => ({ 13970 select, 13971 dispatch 13972 }) => { 13973 // To avoid a focus loss when removing the last block, assure there is 13974 // always a default block if the last of the blocks have been removed. 13975 const count = select.getBlockCount(); 13976 if (count > 0) { 13977 return; 13978 } 13979 13980 // If there's an custom appender, don't insert default block. 13981 // We have to remember to manually move the focus elsewhere to 13982 // prevent it from being lost though. 13983 const { 13984 __unstableHasCustomAppender 13985 } = select.getSettings(); 13986 if (__unstableHasCustomAppender) { 13987 return; 13988 } 13989 dispatch.insertDefaultBlock(); 13990 }; 13991 13992 /** 13993 * Returns an action object used in signalling that a block removal prompt must 13994 * be displayed. 13995 * 13996 * Contrast with `setBlockRemovalRules`. 13997 * 13998 * @param {string|string[]} clientIds Client IDs of blocks to remove. 13999 * @param {boolean} selectPrevious True if the previous block or the 14000 * immediate parent (if no previous 14001 * block exists) should be selected 14002 * when a block is removed. 14003 * @param {string} message Message to display in the prompt. 14004 * 14005 * @return {Object} Action object. 14006 */ 14007 function displayBlockRemovalPrompt(clientIds, selectPrevious, message) { 14008 return { 14009 type: 'DISPLAY_BLOCK_REMOVAL_PROMPT', 14010 clientIds, 14011 selectPrevious, 14012 message 14013 }; 14014 } 14015 14016 /** 14017 * Returns an action object used in signalling that a block removal prompt must 14018 * be cleared, either be cause the user has confirmed or canceled the request 14019 * for removal. 14020 * 14021 * @return {Object} Action object. 14022 */ 14023 function clearBlockRemovalPrompt() { 14024 return { 14025 type: 'CLEAR_BLOCK_REMOVAL_PROMPT' 14026 }; 14027 } 14028 14029 /** 14030 * Returns an action object used to set up any rules that a block editor may 14031 * provide in order to prevent a user from accidentally removing certain 14032 * blocks. These rules are then used to display a confirmation prompt to the 14033 * user. For instance, in the Site Editor, the Query Loop block is important 14034 * enough to warrant such confirmation. 14035 * 14036 * IMPORTANT: Registering rules implicitly signals to the `privateRemoveBlocks` 14037 * action that the editor will be responsible for displaying block removal 14038 * prompts and confirming deletions. This action is meant to be used by 14039 * component `BlockRemovalWarningModal` only. 14040 * 14041 * The data is a record whose keys are block types (e.g. 'core/query') and 14042 * whose values are the explanation to be shown to users (e.g. 'Query Loop 14043 * displays a list of posts or pages.'). 14044 * 14045 * Contrast with `displayBlockRemovalPrompt`. 14046 * 14047 * @param {Record<string,string>|false} rules Block removal rules. 14048 * @return {Object} Action object. 14049 */ 14050 function setBlockRemovalRules(rules = false) { 14051 return { 14052 type: 'SET_BLOCK_REMOVAL_RULES', 14053 rules 14054 }; 14055 } 14056 14057 /** 14058 * Sets the client ID of the block settings menu that is currently open. 14059 * 14060 * @param {?string} clientId The block client ID. 14061 * @return {Object} Action object. 14062 */ 14063 function setOpenedBlockSettingsMenu(clientId) { 14064 return { 14065 type: 'SET_OPENED_BLOCK_SETTINGS_MENU', 14066 clientId 14067 }; 14068 } 14069 function setStyleOverride(id, style) { 14070 return { 14071 type: 'SET_STYLE_OVERRIDE', 14072 id, 14073 style 14074 }; 14075 } 14076 function deleteStyleOverride(id) { 14077 return { 14078 type: 'DELETE_STYLE_OVERRIDE', 14079 id 14080 }; 14081 } 14082 14083 /** 14084 * Action that sets the element that had focus when focus leaves the editor canvas. 14085 * 14086 * @param {Object} lastFocus The last focused element. 14087 * 14088 * 14089 * @return {Object} Action object. 14090 */ 14091 function setLastFocus(lastFocus = null) { 14092 return { 14093 type: 'LAST_FOCUS', 14094 lastFocus 14095 }; 14096 } 14097 14098 /** 14099 * Action that stops temporarily editing as blocks. 14100 * 14101 * @param {string} clientId The block's clientId. 14102 */ 14103 function stopEditingAsBlocks(clientId) { 14104 return ({ 14105 select, 14106 dispatch, 14107 registry 14108 }) => { 14109 const focusModeToRevert = unlock(registry.select(store)).getTemporarilyEditingFocusModeToRevert(); 14110 dispatch.__unstableMarkNextChangeAsNotPersistent(); 14111 dispatch.updateBlockAttributes(clientId, { 14112 templateLock: 'contentOnly' 14113 }); 14114 dispatch.updateBlockListSettings(clientId, { 14115 ...select.getBlockListSettings(clientId), 14116 templateLock: 'contentOnly' 14117 }); 14118 dispatch.updateSettings({ 14119 focusMode: focusModeToRevert 14120 }); 14121 dispatch.__unstableSetTemporarilyEditingAsBlocks(); 14122 }; 14123 } 14124 14125 /** 14126 * Returns an action object used in signalling that the user has begun to drag. 14127 * 14128 * @return {Object} Action object. 14129 */ 14130 function startDragging() { 14131 return { 14132 type: 'START_DRAGGING' 14133 }; 14134 } 14135 14136 /** 14137 * Returns an action object used in signalling that the user has stopped dragging. 14138 * 14139 * @return {Object} Action object. 14140 */ 14141 function stopDragging() { 14142 return { 14143 type: 'STOP_DRAGGING' 14144 }; 14145 } 14146 14147 /** 14148 * @param {string|null} clientId The block's clientId, or `null` to clear. 14149 * 14150 * @return {Object} Action object. 14151 */ 14152 function expandBlock(clientId) { 14153 return { 14154 type: 'SET_BLOCK_EXPANDED_IN_LIST_VIEW', 14155 clientId 14156 }; 14157 } 14158 14159 /** 14160 * Temporarily modify/unlock the content-only block for editions. 14161 * 14162 * @param {string} clientId The client id of the block. 14163 */ 14164 const modifyContentLockBlock = clientId => ({ 14165 select, 14166 dispatch 14167 }) => { 14168 dispatch.selectBlock(clientId); 14169 dispatch.__unstableMarkNextChangeAsNotPersistent(); 14170 dispatch.updateBlockAttributes(clientId, { 14171 templateLock: undefined 14172 }); 14173 dispatch.updateBlockListSettings(clientId, { 14174 ...select.getBlockListSettings(clientId), 14175 templateLock: false 14176 }); 14177 const focusModeToRevert = select.getSettings().focusMode; 14178 dispatch.updateSettings({ 14179 focusMode: true 14180 }); 14181 dispatch.__unstableSetTemporarilyEditingAsBlocks(clientId, focusModeToRevert); 14182 }; 14183 14184 /** 14185 * Sets the zoom level. 14186 * 14187 * @param {number} zoom the new zoom level 14188 * @return {Object} Action object. 14189 */ 14190 function setZoomLevel(zoom = 100) { 14191 return { 14192 type: 'SET_ZOOM_LEVEL', 14193 zoom 14194 }; 14195 } 14196 14197 /** 14198 * Resets the Zoom state. 14199 * @return {Object} Action object. 14200 */ 14201 function resetZoomLevel() { 14202 return { 14203 type: 'RESET_ZOOM_LEVEL' 14204 }; 14205 } 14206 14207 ;// CONCATENATED MODULE: external ["wp","a11y"] 14208 const external_wp_a11y_namespaceObject = window["wp"]["a11y"]; 14209 ;// CONCATENATED MODULE: external ["wp","notices"] 14210 const external_wp_notices_namespaceObject = window["wp"]["notices"]; 14211 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/selection.js 14212 /** 14213 * WordPress dependencies 14214 */ 14215 14216 14217 /** 14218 * A robust way to retain selection position through various 14219 * transforms is to insert a special character at the position and 14220 * then recover it. 14221 */ 14222 const START_OF_SELECTED_AREA = '\u0086'; 14223 14224 /** 14225 * Retrieve the block attribute that contains the selection position. 14226 * 14227 * @param {Object} blockAttributes Block attributes. 14228 * @return {string|void} The name of the block attribute that was previously selected. 14229 */ 14230 function retrieveSelectedAttribute(blockAttributes) { 14231 if (!blockAttributes) { 14232 return; 14233 } 14234 return Object.keys(blockAttributes).find(name => { 14235 const value = blockAttributes[name]; 14236 return (typeof value === 'string' || value instanceof external_wp_richText_namespaceObject.RichTextData) && 14237 // To do: refactor this to use rich text's selection instead, so we 14238 // no longer have to use on this hack inserting a special character. 14239 value.toString().indexOf(START_OF_SELECTED_AREA) !== -1; 14240 }); 14241 } 14242 function findRichTextAttributeKey(blockType) { 14243 for (const [key, value] of Object.entries(blockType.attributes)) { 14244 if (value.source === 'rich-text' || value.source === 'html') { 14245 return key; 14246 } 14247 } 14248 } 14249 14250 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/actions.js 14251 /* eslint no-console: [ 'error', { allow: [ 'error', 'warn' ] } ] */ 14252 /** 14253 * WordPress dependencies 14254 */ 14255 14256 14257 14258 14259 14260 14261 14262 /** 14263 * Internal dependencies 14264 */ 14265 14266 14267 14268 /** @typedef {import('../components/use-on-block-drop/types').WPDropOperation} WPDropOperation */ 14269 14270 const actions_castArray = maybeArray => Array.isArray(maybeArray) ? maybeArray : [maybeArray]; 14271 14272 /** 14273 * Action that resets blocks state to the specified array of blocks, taking precedence 14274 * over any other content reflected as an edit in state. 14275 * 14276 * @param {Array} blocks Array of blocks. 14277 */ 14278 const resetBlocks = blocks => ({ 14279 dispatch 14280 }) => { 14281 dispatch({ 14282 type: 'RESET_BLOCKS', 14283 blocks 14284 }); 14285 dispatch(validateBlocksToTemplate(blocks)); 14286 }; 14287 14288 /** 14289 * Block validity is a function of blocks state (at the point of a 14290 * reset) and the template setting. As a compromise to its placement 14291 * across distinct parts of state, it is implemented here as a side 14292 * effect of the block reset action. 14293 * 14294 * @param {Array} blocks Array of blocks. 14295 */ 14296 const validateBlocksToTemplate = blocks => ({ 14297 select, 14298 dispatch 14299 }) => { 14300 const template = select.getTemplate(); 14301 const templateLock = select.getTemplateLock(); 14302 14303 // Unlocked templates are considered always valid because they act 14304 // as default values only. 14305 const isBlocksValidToTemplate = !template || templateLock !== 'all' || (0,external_wp_blocks_namespaceObject.doBlocksMatchTemplate)(blocks, template); 14306 14307 // Update if validity has changed. 14308 const isValidTemplate = select.isValidTemplate(); 14309 if (isBlocksValidToTemplate !== isValidTemplate) { 14310 dispatch.setTemplateValidity(isBlocksValidToTemplate); 14311 return isBlocksValidToTemplate; 14312 } 14313 }; 14314 14315 /** 14316 * A block selection object. 14317 * 14318 * @typedef {Object} WPBlockSelection 14319 * 14320 * @property {string} clientId A block client ID. 14321 * @property {string} attributeKey A block attribute key. 14322 * @property {number} offset An attribute value offset, based on the rich 14323 * text value. See `wp.richText.create`. 14324 */ 14325 14326 /** 14327 * A selection object. 14328 * 14329 * @typedef {Object} WPSelection 14330 * 14331 * @property {WPBlockSelection} start The selection start. 14332 * @property {WPBlockSelection} end The selection end. 14333 */ 14334 14335 /* eslint-disable jsdoc/valid-types */ 14336 /** 14337 * Returns an action object used in signalling that selection state should be 14338 * reset to the specified selection. 14339 * 14340 * @param {WPBlockSelection} selectionStart The selection start. 14341 * @param {WPBlockSelection} selectionEnd The selection end. 14342 * @param {0|-1|null} initialPosition Initial block position. 14343 * 14344 * @return {Object} Action object. 14345 */ 14346 function resetSelection(selectionStart, selectionEnd, initialPosition) { 14347 /* eslint-enable jsdoc/valid-types */ 14348 return { 14349 type: 'RESET_SELECTION', 14350 selectionStart, 14351 selectionEnd, 14352 initialPosition 14353 }; 14354 } 14355 14356 /** 14357 * Returns an action object used in signalling that blocks have been received. 14358 * Unlike resetBlocks, these should be appended to the existing known set, not 14359 * replacing. 14360 * 14361 * @deprecated 14362 * 14363 * @param {Object[]} blocks Array of block objects. 14364 * 14365 * @return {Object} Action object. 14366 */ 14367 function receiveBlocks(blocks) { 14368 external_wp_deprecated_default()('wp.data.dispatch( "core/block-editor" ).receiveBlocks', { 14369 since: '5.9', 14370 alternative: 'resetBlocks or insertBlocks' 14371 }); 14372 return { 14373 type: 'RECEIVE_BLOCKS', 14374 blocks 14375 }; 14376 } 14377 14378 /** 14379 * Action that updates attributes of multiple blocks with the specified client IDs. 14380 * 14381 * @param {string|string[]} clientIds Block client IDs. 14382 * @param {Object} attributes Block attributes to be merged. Should be keyed by clientIds if 14383 * uniqueByBlock is true. 14384 * @param {boolean} uniqueByBlock true if each block in clientIds array has a unique set of attributes 14385 * @return {Object} Action object. 14386 */ 14387 function updateBlockAttributes(clientIds, attributes, uniqueByBlock = false) { 14388 return { 14389 type: 'UPDATE_BLOCK_ATTRIBUTES', 14390 clientIds: actions_castArray(clientIds), 14391 attributes, 14392 uniqueByBlock 14393 }; 14394 } 14395 14396 /** 14397 * Action that updates the block with the specified client ID. 14398 * 14399 * @param {string} clientId Block client ID. 14400 * @param {Object} updates Block attributes to be merged. 14401 * 14402 * @return {Object} Action object. 14403 */ 14404 function updateBlock(clientId, updates) { 14405 return { 14406 type: 'UPDATE_BLOCK', 14407 clientId, 14408 updates 14409 }; 14410 } 14411 14412 /* eslint-disable jsdoc/valid-types */ 14413 /** 14414 * Returns an action object used in signalling that the block with the 14415 * specified client ID has been selected, optionally accepting a position 14416 * value reflecting its selection directionality. An initialPosition of -1 14417 * reflects a reverse selection. 14418 * 14419 * @param {string} clientId Block client ID. 14420 * @param {0|-1|null} initialPosition Optional initial position. Pass as -1 to 14421 * reflect reverse selection. 14422 * 14423 * @return {Object} Action object. 14424 */ 14425 function selectBlock(clientId, initialPosition = 0) { 14426 /* eslint-enable jsdoc/valid-types */ 14427 return { 14428 type: 'SELECT_BLOCK', 14429 initialPosition, 14430 clientId 14431 }; 14432 } 14433 14434 /** 14435 * Returns an action object used in signalling that the block with the 14436 * specified client ID has been hovered. 14437 * 14438 * @param {string} clientId Block client ID. 14439 * 14440 * @return {Object} Action object. 14441 */ 14442 function hoverBlock(clientId) { 14443 return { 14444 type: 'HOVER_BLOCK', 14445 clientId 14446 }; 14447 } 14448 14449 /** 14450 * Yields action objects used in signalling that the block preceding the given 14451 * clientId (or optionally, its first parent from bottom to top) 14452 * should be selected. 14453 * 14454 * @param {string} clientId Block client ID. 14455 * @param {boolean} fallbackToParent If true, select the first parent if there is no previous block. 14456 */ 14457 const selectPreviousBlock = (clientId, fallbackToParent = false) => ({ 14458 select, 14459 dispatch 14460 }) => { 14461 const previousBlockClientId = select.getPreviousBlockClientId(clientId); 14462 if (previousBlockClientId) { 14463 dispatch.selectBlock(previousBlockClientId, -1); 14464 } else if (fallbackToParent) { 14465 const firstParentClientId = select.getBlockRootClientId(clientId); 14466 if (firstParentClientId) { 14467 dispatch.selectBlock(firstParentClientId, -1); 14468 } 14469 } 14470 }; 14471 14472 /** 14473 * Yields action objects used in signalling that the block following the given 14474 * clientId should be selected. 14475 * 14476 * @param {string} clientId Block client ID. 14477 */ 14478 const selectNextBlock = clientId => ({ 14479 select, 14480 dispatch 14481 }) => { 14482 const nextBlockClientId = select.getNextBlockClientId(clientId); 14483 if (nextBlockClientId) { 14484 dispatch.selectBlock(nextBlockClientId); 14485 } 14486 }; 14487 14488 /** 14489 * Action that starts block multi-selection. 14490 * 14491 * @return {Object} Action object. 14492 */ 14493 function startMultiSelect() { 14494 return { 14495 type: 'START_MULTI_SELECT' 14496 }; 14497 } 14498 14499 /** 14500 * Action that stops block multi-selection. 14501 * 14502 * @return {Object} Action object. 14503 */ 14504 function stopMultiSelect() { 14505 return { 14506 type: 'STOP_MULTI_SELECT' 14507 }; 14508 } 14509 14510 /** 14511 * Action that changes block multi-selection. 14512 * 14513 * @param {string} start First block of the multi selection. 14514 * @param {string} end Last block of the multiselection. 14515 * @param {number|null} __experimentalInitialPosition Optional initial position. Pass as null to skip focus within editor canvas. 14516 */ 14517 const multiSelect = (start, end, __experimentalInitialPosition = 0) => ({ 14518 select, 14519 dispatch 14520 }) => { 14521 const startBlockRootClientId = select.getBlockRootClientId(start); 14522 const endBlockRootClientId = select.getBlockRootClientId(end); 14523 14524 // Only allow block multi-selections at the same level. 14525 if (startBlockRootClientId !== endBlockRootClientId) { 14526 return; 14527 } 14528 dispatch({ 14529 type: 'MULTI_SELECT', 14530 start, 14531 end, 14532 initialPosition: __experimentalInitialPosition 14533 }); 14534 const blockCount = select.getSelectedBlockCount(); 14535 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: number of selected blocks */ 14536 (0,external_wp_i18n_namespaceObject._n)('%s block selected.', '%s blocks selected.', blockCount), blockCount), 'assertive'); 14537 }; 14538 14539 /** 14540 * Action that clears the block selection. 14541 * 14542 * @return {Object} Action object. 14543 */ 14544 function clearSelectedBlock() { 14545 return { 14546 type: 'CLEAR_SELECTED_BLOCK' 14547 }; 14548 } 14549 14550 /** 14551 * Action that enables or disables block selection. 14552 * 14553 * @param {boolean} [isSelectionEnabled=true] Whether block selection should 14554 * be enabled. 14555 * 14556 * @return {Object} Action object. 14557 */ 14558 function toggleSelection(isSelectionEnabled = true) { 14559 return { 14560 type: 'TOGGLE_SELECTION', 14561 isSelectionEnabled 14562 }; 14563 } 14564 14565 /* eslint-disable jsdoc/valid-types */ 14566 /** 14567 * Action that replaces given blocks with one or more replacement blocks. 14568 * 14569 * @param {(string|string[])} clientIds Block client ID(s) to replace. 14570 * @param {(Object|Object[])} blocks Replacement block(s). 14571 * @param {number} indexToSelect Index of replacement block to select. 14572 * @param {0|-1|null} initialPosition Index of caret after in the selected block after the operation. 14573 * @param {?Object} meta Optional Meta values to be passed to the action object. 14574 * 14575 * @return {Object} Action object. 14576 */ 14577 const replaceBlocks = (clientIds, blocks, indexToSelect, initialPosition = 0, meta) => ({ 14578 select, 14579 dispatch, 14580 registry 14581 }) => { 14582 /* eslint-enable jsdoc/valid-types */ 14583 clientIds = actions_castArray(clientIds); 14584 blocks = actions_castArray(blocks); 14585 const rootClientId = select.getBlockRootClientId(clientIds[0]); 14586 // Replace is valid if the new blocks can be inserted in the root block. 14587 for (let index = 0; index < blocks.length; index++) { 14588 const block = blocks[index]; 14589 const canInsertBlock = select.canInsertBlockType(block.name, rootClientId); 14590 if (!canInsertBlock) { 14591 return; 14592 } 14593 } 14594 // We're batching these two actions because an extra `undo/redo` step can 14595 // be created, based on whether we insert a default block or not. 14596 registry.batch(() => { 14597 dispatch({ 14598 type: 'REPLACE_BLOCKS', 14599 clientIds, 14600 blocks, 14601 time: Date.now(), 14602 indexToSelect, 14603 initialPosition, 14604 meta 14605 }); 14606 // To avoid a focus loss when removing the last block, assure there is 14607 // always a default block if the last of the blocks have been removed. 14608 dispatch.ensureDefaultBlock(); 14609 }); 14610 }; 14611 14612 /** 14613 * Action that replaces a single block with one or more replacement blocks. 14614 * 14615 * @param {(string|string[])} clientId Block client ID to replace. 14616 * @param {(Object|Object[])} block Replacement block(s). 14617 * 14618 * @return {Object} Action object. 14619 */ 14620 function replaceBlock(clientId, block) { 14621 return replaceBlocks(clientId, block); 14622 } 14623 14624 /** 14625 * Higher-order action creator which, given the action type to dispatch creates 14626 * an action creator for managing block movement. 14627 * 14628 * @param {string} type Action type to dispatch. 14629 * 14630 * @return {Function} Action creator. 14631 */ 14632 const createOnMove = type => (clientIds, rootClientId) => ({ 14633 select, 14634 dispatch 14635 }) => { 14636 // If one of the blocks is locked or the parent is locked, we cannot move any block. 14637 const canMoveBlocks = select.canMoveBlocks(clientIds); 14638 if (!canMoveBlocks) { 14639 return; 14640 } 14641 dispatch({ 14642 type, 14643 clientIds: actions_castArray(clientIds), 14644 rootClientId 14645 }); 14646 }; 14647 const moveBlocksDown = createOnMove('MOVE_BLOCKS_DOWN'); 14648 const moveBlocksUp = createOnMove('MOVE_BLOCKS_UP'); 14649 14650 /** 14651 * Action that moves given blocks to a new position. 14652 * 14653 * @param {?string} clientIds The client IDs of the blocks. 14654 * @param {?string} fromRootClientId Root client ID source. 14655 * @param {?string} toRootClientId Root client ID destination. 14656 * @param {number} index The index to move the blocks to. 14657 */ 14658 const moveBlocksToPosition = (clientIds, fromRootClientId = '', toRootClientId = '', index) => ({ 14659 select, 14660 dispatch 14661 }) => { 14662 const canMoveBlocks = select.canMoveBlocks(clientIds); 14663 14664 // If one of the blocks is locked or the parent is locked, we cannot move any block. 14665 if (!canMoveBlocks) { 14666 return; 14667 } 14668 14669 // If moving inside the same root block the move is always possible. 14670 if (fromRootClientId !== toRootClientId) { 14671 const canRemoveBlocks = select.canRemoveBlocks(clientIds); 14672 14673 // If we're moving to another block, it means we're deleting blocks from 14674 // the original block, so we need to check if removing is possible. 14675 if (!canRemoveBlocks) { 14676 return; 14677 } 14678 const canInsertBlocks = select.canInsertBlocks(clientIds, toRootClientId); 14679 14680 // If moving to other parent block, the move is possible if we can insert a block of the same type inside the new parent block. 14681 if (!canInsertBlocks) { 14682 return; 14683 } 14684 } 14685 dispatch({ 14686 type: 'MOVE_BLOCKS_TO_POSITION', 14687 fromRootClientId, 14688 toRootClientId, 14689 clientIds, 14690 index 14691 }); 14692 }; 14693 14694 /** 14695 * Action that moves given block to a new position. 14696 * 14697 * @param {?string} clientId The client ID of the block. 14698 * @param {?string} fromRootClientId Root client ID source. 14699 * @param {?string} toRootClientId Root client ID destination. 14700 * @param {number} index The index to move the block to. 14701 */ 14702 function moveBlockToPosition(clientId, fromRootClientId = '', toRootClientId = '', index) { 14703 return moveBlocksToPosition([clientId], fromRootClientId, toRootClientId, index); 14704 } 14705 14706 /** 14707 * Action that inserts a single block, optionally at a specific index respective a root block list. 14708 * 14709 * Only allowed blocks are inserted. The action may fail silently for blocks that are not allowed or if 14710 * a templateLock is active on the block list. 14711 * 14712 * @param {Object} block Block object to insert. 14713 * @param {?number} index Index at which block should be inserted. 14714 * @param {?string} rootClientId Optional root client ID of block list on which to insert. 14715 * @param {?boolean} updateSelection If true block selection will be updated. If false, block selection will not change. Defaults to true. 14716 * @param {?Object} meta Optional Meta values to be passed to the action object. 14717 * 14718 * @return {Object} Action object. 14719 */ 14720 function insertBlock(block, index, rootClientId, updateSelection, meta) { 14721 return insertBlocks([block], index, rootClientId, updateSelection, 0, meta); 14722 } 14723 14724 /* eslint-disable jsdoc/valid-types */ 14725 /** 14726 * Action that inserts an array of blocks, optionally at a specific index respective a root block list. 14727 * 14728 * Only allowed blocks are inserted. The action may fail silently for blocks that are not allowed or if 14729 * a templateLock is active on the block list. 14730 * 14731 * @param {Object[]} blocks Block objects to insert. 14732 * @param {?number} index Index at which block should be inserted. 14733 * @param {?string} rootClientId Optional root client ID of block list on which to insert. 14734 * @param {?boolean} updateSelection If true block selection will be updated. If false, block selection will not change. Defaults to true. 14735 * @param {0|-1|null} initialPosition Initial focus position. Setting it to null prevent focusing the inserted block. 14736 * @param {?Object} meta Optional Meta values to be passed to the action object. 14737 * 14738 * @return {Object} Action object. 14739 */ 14740 const insertBlocks = (blocks, index, rootClientId, updateSelection = true, initialPosition = 0, meta) => ({ 14741 select, 14742 dispatch 14743 }) => { 14744 /* eslint-enable jsdoc/valid-types */ 14745 if (initialPosition !== null && typeof initialPosition === 'object') { 14746 meta = initialPosition; 14747 initialPosition = 0; 14748 external_wp_deprecated_default()("meta argument in wp.data.dispatch('core/block-editor')", { 14749 since: '5.8', 14750 hint: 'The meta argument is now the 6th argument of the function' 14751 }); 14752 } 14753 blocks = actions_castArray(blocks); 14754 const allowedBlocks = []; 14755 for (const block of blocks) { 14756 const isValid = select.canInsertBlockType(block.name, rootClientId); 14757 if (isValid) { 14758 allowedBlocks.push(block); 14759 } 14760 } 14761 if (allowedBlocks.length) { 14762 dispatch({ 14763 type: 'INSERT_BLOCKS', 14764 blocks: allowedBlocks, 14765 index, 14766 rootClientId, 14767 time: Date.now(), 14768 updateSelection, 14769 initialPosition: updateSelection ? initialPosition : null, 14770 meta 14771 }); 14772 } 14773 }; 14774 14775 /** 14776 * Action that shows the insertion point. 14777 * 14778 * @param {?string} rootClientId Optional root client ID of block list on 14779 * which to insert. 14780 * @param {?number} index Index at which block should be inserted. 14781 * @param {?Object} __unstableOptions Additional options. 14782 * @property {boolean} __unstableWithInserter Whether or not to show an inserter button. 14783 * @property {WPDropOperation} operation The operation to perform when applied, 14784 * either 'insert' or 'replace' for now. 14785 * 14786 * @return {Object} Action object. 14787 */ 14788 function showInsertionPoint(rootClientId, index, __unstableOptions = {}) { 14789 const { 14790 __unstableWithInserter, 14791 operation, 14792 nearestSide 14793 } = __unstableOptions; 14794 return { 14795 type: 'SHOW_INSERTION_POINT', 14796 rootClientId, 14797 index, 14798 __unstableWithInserter, 14799 operation, 14800 nearestSide 14801 }; 14802 } 14803 /** 14804 * Action that hides the insertion point. 14805 */ 14806 const hideInsertionPoint = () => ({ 14807 select, 14808 dispatch 14809 }) => { 14810 if (!select.isBlockInsertionPointVisible()) { 14811 return; 14812 } 14813 dispatch({ 14814 type: 'HIDE_INSERTION_POINT' 14815 }); 14816 }; 14817 14818 /** 14819 * Action that resets the template validity. 14820 * 14821 * @param {boolean} isValid template validity flag. 14822 * 14823 * @return {Object} Action object. 14824 */ 14825 function setTemplateValidity(isValid) { 14826 return { 14827 type: 'SET_TEMPLATE_VALIDITY', 14828 isValid 14829 }; 14830 } 14831 14832 /** 14833 * Action that synchronizes the template with the list of blocks. 14834 * 14835 * @return {Object} Action object. 14836 */ 14837 const synchronizeTemplate = () => ({ 14838 select, 14839 dispatch 14840 }) => { 14841 dispatch({ 14842 type: 'SYNCHRONIZE_TEMPLATE' 14843 }); 14844 const blocks = select.getBlocks(); 14845 const template = select.getTemplate(); 14846 const updatedBlockList = (0,external_wp_blocks_namespaceObject.synchronizeBlocksWithTemplate)(blocks, template); 14847 dispatch.resetBlocks(updatedBlockList); 14848 }; 14849 14850 /** 14851 * Delete the current selection. 14852 * 14853 * @param {boolean} isForward 14854 */ 14855 const __unstableDeleteSelection = isForward => ({ 14856 registry, 14857 select, 14858 dispatch 14859 }) => { 14860 const selectionAnchor = select.getSelectionStart(); 14861 const selectionFocus = select.getSelectionEnd(); 14862 if (selectionAnchor.clientId === selectionFocus.clientId) { 14863 return; 14864 } 14865 14866 // It's not mergeable if there's no rich text selection. 14867 if (!selectionAnchor.attributeKey || !selectionFocus.attributeKey || typeof selectionAnchor.offset === 'undefined' || typeof selectionFocus.offset === 'undefined') { 14868 return false; 14869 } 14870 const anchorRootClientId = select.getBlockRootClientId(selectionAnchor.clientId); 14871 const focusRootClientId = select.getBlockRootClientId(selectionFocus.clientId); 14872 14873 // It's not mergeable if the selection doesn't start and end in the same 14874 // block list. Maybe in the future it should be allowed. 14875 if (anchorRootClientId !== focusRootClientId) { 14876 return; 14877 } 14878 const blockOrder = select.getBlockOrder(anchorRootClientId); 14879 const anchorIndex = blockOrder.indexOf(selectionAnchor.clientId); 14880 const focusIndex = blockOrder.indexOf(selectionFocus.clientId); 14881 14882 // Reassign selection start and end based on order. 14883 let selectionStart, selectionEnd; 14884 if (anchorIndex > focusIndex) { 14885 selectionStart = selectionFocus; 14886 selectionEnd = selectionAnchor; 14887 } else { 14888 selectionStart = selectionAnchor; 14889 selectionEnd = selectionFocus; 14890 } 14891 const targetSelection = isForward ? selectionEnd : selectionStart; 14892 const targetBlock = select.getBlock(targetSelection.clientId); 14893 const targetBlockType = (0,external_wp_blocks_namespaceObject.getBlockType)(targetBlock.name); 14894 if (!targetBlockType.merge) { 14895 return; 14896 } 14897 const selectionA = selectionStart; 14898 const selectionB = selectionEnd; 14899 const blockA = select.getBlock(selectionA.clientId); 14900 const blockB = select.getBlock(selectionB.clientId); 14901 const htmlA = blockA.attributes[selectionA.attributeKey]; 14902 const htmlB = blockB.attributes[selectionB.attributeKey]; 14903 let valueA = (0,external_wp_richText_namespaceObject.create)({ 14904 html: htmlA 14905 }); 14906 let valueB = (0,external_wp_richText_namespaceObject.create)({ 14907 html: htmlB 14908 }); 14909 valueA = (0,external_wp_richText_namespaceObject.remove)(valueA, selectionA.offset, valueA.text.length); 14910 valueB = (0,external_wp_richText_namespaceObject.insert)(valueB, START_OF_SELECTED_AREA, 0, selectionB.offset); 14911 14912 // Clone the blocks so we don't manipulate the original. 14913 const cloneA = (0,external_wp_blocks_namespaceObject.cloneBlock)(blockA, { 14914 [selectionA.attributeKey]: (0,external_wp_richText_namespaceObject.toHTMLString)({ 14915 value: valueA 14916 }) 14917 }); 14918 const cloneB = (0,external_wp_blocks_namespaceObject.cloneBlock)(blockB, { 14919 [selectionB.attributeKey]: (0,external_wp_richText_namespaceObject.toHTMLString)({ 14920 value: valueB 14921 }) 14922 }); 14923 const followingBlock = isForward ? cloneA : cloneB; 14924 14925 // We can only merge blocks with similar types 14926 // thus, we transform the block to merge first 14927 const blocksWithTheSameType = blockA.name === blockB.name ? [followingBlock] : (0,external_wp_blocks_namespaceObject.switchToBlockType)(followingBlock, targetBlockType.name); 14928 14929 // If the block types can not match, do nothing 14930 if (!blocksWithTheSameType || !blocksWithTheSameType.length) { 14931 return; 14932 } 14933 let updatedAttributes; 14934 if (isForward) { 14935 const blockToMerge = blocksWithTheSameType.pop(); 14936 updatedAttributes = targetBlockType.merge(blockToMerge.attributes, cloneB.attributes); 14937 } else { 14938 const blockToMerge = blocksWithTheSameType.shift(); 14939 updatedAttributes = targetBlockType.merge(cloneA.attributes, blockToMerge.attributes); 14940 } 14941 const newAttributeKey = retrieveSelectedAttribute(updatedAttributes); 14942 const convertedHtml = updatedAttributes[newAttributeKey]; 14943 const convertedValue = (0,external_wp_richText_namespaceObject.create)({ 14944 html: convertedHtml 14945 }); 14946 const newOffset = convertedValue.text.indexOf(START_OF_SELECTED_AREA); 14947 const newValue = (0,external_wp_richText_namespaceObject.remove)(convertedValue, newOffset, newOffset + 1); 14948 const newHtml = (0,external_wp_richText_namespaceObject.toHTMLString)({ 14949 value: newValue 14950 }); 14951 updatedAttributes[newAttributeKey] = newHtml; 14952 const selectedBlockClientIds = select.getSelectedBlockClientIds(); 14953 const replacement = [...(isForward ? blocksWithTheSameType : []), { 14954 // Preserve the original client ID. 14955 ...targetBlock, 14956 attributes: { 14957 ...targetBlock.attributes, 14958 ...updatedAttributes 14959 } 14960 }, ...(isForward ? [] : blocksWithTheSameType)]; 14961 registry.batch(() => { 14962 dispatch.selectionChange(targetBlock.clientId, newAttributeKey, newOffset, newOffset); 14963 dispatch.replaceBlocks(selectedBlockClientIds, replacement, 0, 14964 // If we don't pass the `indexToSelect` it will default to the last block. 14965 select.getSelectedBlocksInitialCaretPosition()); 14966 }); 14967 }; 14968 14969 /** 14970 * Split the current selection. 14971 * @param {?Array} blocks 14972 */ 14973 const __unstableSplitSelection = (blocks = []) => ({ 14974 registry, 14975 select, 14976 dispatch 14977 }) => { 14978 const selectionAnchor = select.getSelectionStart(); 14979 const selectionFocus = select.getSelectionEnd(); 14980 const anchorRootClientId = select.getBlockRootClientId(selectionAnchor.clientId); 14981 const focusRootClientId = select.getBlockRootClientId(selectionFocus.clientId); 14982 14983 // It's not splittable if the selection doesn't start and end in the same 14984 // block list. Maybe in the future it should be allowed. 14985 if (anchorRootClientId !== focusRootClientId) { 14986 return; 14987 } 14988 const blockOrder = select.getBlockOrder(anchorRootClientId); 14989 const anchorIndex = blockOrder.indexOf(selectionAnchor.clientId); 14990 const focusIndex = blockOrder.indexOf(selectionFocus.clientId); 14991 14992 // Reassign selection start and end based on order. 14993 let selectionStart, selectionEnd; 14994 if (anchorIndex > focusIndex) { 14995 selectionStart = selectionFocus; 14996 selectionEnd = selectionAnchor; 14997 } else { 14998 selectionStart = selectionAnchor; 14999 selectionEnd = selectionFocus; 15000 } 15001 const selectionA = selectionStart; 15002 const selectionB = selectionEnd; 15003 const blockA = select.getBlock(selectionA.clientId); 15004 const blockB = select.getBlock(selectionB.clientId); 15005 const blockAType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockA.name); 15006 const blockBType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockB.name); 15007 const attributeKeyA = typeof selectionA.attributeKey === 'string' ? selectionA.attributeKey : findRichTextAttributeKey(blockAType); 15008 const attributeKeyB = typeof selectionB.attributeKey === 'string' ? selectionB.attributeKey : findRichTextAttributeKey(blockBType); 15009 const blockAttributes = select.getBlockAttributes(selectionA.clientId); 15010 const bindings = blockAttributes?.metadata?.bindings; 15011 15012 // If the attribute is bound, don't split the selection and insert a new block instead. 15013 if (bindings?.[attributeKeyA]) { 15014 // Show warning if user tries to insert a block into another block with bindings. 15015 if (blocks.length) { 15016 const { 15017 createWarningNotice 15018 } = registry.dispatch(external_wp_notices_namespaceObject.store); 15019 createWarningNotice((0,external_wp_i18n_namespaceObject.__)("Blocks can't be inserted into other blocks with bindings"), { 15020 type: 'snackbar' 15021 }); 15022 return; 15023 } 15024 dispatch.insertAfterBlock(selectionA.clientId); 15025 return; 15026 } 15027 15028 // Can't split if the selection is not set. 15029 if (!attributeKeyA || !attributeKeyB || typeof selectionAnchor.offset === 'undefined' || typeof selectionFocus.offset === 'undefined') { 15030 return; 15031 } 15032 15033 // We can do some short-circuiting if the selection is collapsed. 15034 if (selectionA.clientId === selectionB.clientId && attributeKeyA === attributeKeyB && selectionA.offset === selectionB.offset) { 15035 // If an unmodified default block is selected, replace it. We don't 15036 // want to be converting into a default block. 15037 if (blocks.length) { 15038 if ((0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(blockA)) { 15039 dispatch.replaceBlocks([selectionA.clientId], blocks, blocks.length - 1, -1); 15040 return; 15041 } 15042 } 15043 15044 // If selection is at the start or end, we can simply insert an 15045 // empty block, provided this block has no inner blocks. 15046 else if (!select.getBlockOrder(selectionA.clientId).length) { 15047 function createEmpty() { 15048 const defaultBlockName = (0,external_wp_blocks_namespaceObject.getDefaultBlockName)(); 15049 return select.canInsertBlockType(defaultBlockName, anchorRootClientId) ? (0,external_wp_blocks_namespaceObject.createBlock)(defaultBlockName) : (0,external_wp_blocks_namespaceObject.createBlock)(select.getBlockName(selectionA.clientId)); 15050 } 15051 const length = blockAttributes[attributeKeyA].length; 15052 if (selectionA.offset === 0 && length) { 15053 dispatch.insertBlocks([createEmpty()], select.getBlockIndex(selectionA.clientId), anchorRootClientId, false); 15054 return; 15055 } 15056 if (selectionA.offset === length) { 15057 dispatch.insertBlocks([createEmpty()], select.getBlockIndex(selectionA.clientId) + 1, anchorRootClientId); 15058 return; 15059 } 15060 } 15061 } 15062 const htmlA = blockA.attributes[attributeKeyA]; 15063 const htmlB = blockB.attributes[attributeKeyB]; 15064 let valueA = (0,external_wp_richText_namespaceObject.create)({ 15065 html: htmlA 15066 }); 15067 let valueB = (0,external_wp_richText_namespaceObject.create)({ 15068 html: htmlB 15069 }); 15070 valueA = (0,external_wp_richText_namespaceObject.remove)(valueA, selectionA.offset, valueA.text.length); 15071 valueB = (0,external_wp_richText_namespaceObject.remove)(valueB, 0, selectionB.offset); 15072 let head = { 15073 // Preserve the original client ID. 15074 ...blockA, 15075 // If both start and end are the same, should only copy innerBlocks 15076 // once. 15077 innerBlocks: blockA.clientId === blockB.clientId ? [] : blockA.innerBlocks, 15078 attributes: { 15079 ...blockA.attributes, 15080 [attributeKeyA]: (0,external_wp_richText_namespaceObject.toHTMLString)({ 15081 value: valueA 15082 }) 15083 } 15084 }; 15085 let tail = { 15086 ...blockB, 15087 // Only preserve the original client ID if the end is different. 15088 clientId: blockA.clientId === blockB.clientId ? (0,external_wp_blocks_namespaceObject.createBlock)(blockB.name).clientId : blockB.clientId, 15089 attributes: { 15090 ...blockB.attributes, 15091 [attributeKeyB]: (0,external_wp_richText_namespaceObject.toHTMLString)({ 15092 value: valueB 15093 }) 15094 } 15095 }; 15096 15097 // When splitting a block, attempt to convert the tail block to the 15098 // default block type. For example, when splitting a heading block, the 15099 // tail block will be converted to a paragraph block. Note that for 15100 // blocks such as a list item and button, this will be skipped because 15101 // the default block type cannot be inserted. 15102 const defaultBlockName = (0,external_wp_blocks_namespaceObject.getDefaultBlockName)(); 15103 if ( 15104 // A block is only split when the selection is within the same 15105 // block. 15106 blockA.clientId === blockB.clientId && defaultBlockName && tail.name !== defaultBlockName && select.canInsertBlockType(defaultBlockName, anchorRootClientId)) { 15107 const switched = (0,external_wp_blocks_namespaceObject.switchToBlockType)(tail, defaultBlockName); 15108 if (switched?.length === 1) { 15109 tail = switched[0]; 15110 } 15111 } 15112 if (!blocks.length) { 15113 dispatch.replaceBlocks(select.getSelectedBlockClientIds(), [head, tail]); 15114 return; 15115 } 15116 let selection; 15117 const output = []; 15118 const clonedBlocks = [...blocks]; 15119 const firstBlock = clonedBlocks.shift(); 15120 const headType = (0,external_wp_blocks_namespaceObject.getBlockType)(head.name); 15121 const firstBlocks = headType.merge && firstBlock.name === headType.name ? [firstBlock] : (0,external_wp_blocks_namespaceObject.switchToBlockType)(firstBlock, headType.name); 15122 if (firstBlocks?.length) { 15123 const first = firstBlocks.shift(); 15124 head = { 15125 ...head, 15126 attributes: { 15127 ...head.attributes, 15128 ...headType.merge(head.attributes, first.attributes) 15129 } 15130 }; 15131 output.push(head); 15132 selection = { 15133 clientId: head.clientId, 15134 attributeKey: attributeKeyA, 15135 offset: (0,external_wp_richText_namespaceObject.create)({ 15136 html: head.attributes[attributeKeyA] 15137 }).text.length 15138 }; 15139 clonedBlocks.unshift(...firstBlocks); 15140 } else { 15141 if (!(0,external_wp_blocks_namespaceObject.isUnmodifiedBlock)(head)) { 15142 output.push(head); 15143 } 15144 output.push(firstBlock); 15145 } 15146 const lastBlock = clonedBlocks.pop(); 15147 const tailType = (0,external_wp_blocks_namespaceObject.getBlockType)(tail.name); 15148 if (clonedBlocks.length) { 15149 output.push(...clonedBlocks); 15150 } 15151 if (lastBlock) { 15152 const lastBlocks = tailType.merge && tailType.name === lastBlock.name ? [lastBlock] : (0,external_wp_blocks_namespaceObject.switchToBlockType)(lastBlock, tailType.name); 15153 if (lastBlocks?.length) { 15154 const last = lastBlocks.pop(); 15155 output.push({ 15156 ...tail, 15157 attributes: { 15158 ...tail.attributes, 15159 ...tailType.merge(last.attributes, tail.attributes) 15160 } 15161 }); 15162 output.push(...lastBlocks); 15163 selection = { 15164 clientId: tail.clientId, 15165 attributeKey: attributeKeyB, 15166 offset: (0,external_wp_richText_namespaceObject.create)({ 15167 html: last.attributes[attributeKeyB] 15168 }).text.length 15169 }; 15170 } else { 15171 output.push(lastBlock); 15172 if (!(0,external_wp_blocks_namespaceObject.isUnmodifiedBlock)(tail)) { 15173 output.push(tail); 15174 } 15175 } 15176 } else if (!(0,external_wp_blocks_namespaceObject.isUnmodifiedBlock)(tail)) { 15177 output.push(tail); 15178 } 15179 registry.batch(() => { 15180 dispatch.replaceBlocks(select.getSelectedBlockClientIds(), output, output.length - 1, 0); 15181 if (selection) { 15182 dispatch.selectionChange(selection.clientId, selection.attributeKey, selection.offset, selection.offset); 15183 } 15184 }); 15185 }; 15186 15187 /** 15188 * Expand the selection to cover the entire blocks, removing partial selection. 15189 */ 15190 const __unstableExpandSelection = () => ({ 15191 select, 15192 dispatch 15193 }) => { 15194 const selectionAnchor = select.getSelectionStart(); 15195 const selectionFocus = select.getSelectionEnd(); 15196 dispatch.selectionChange({ 15197 start: { 15198 clientId: selectionAnchor.clientId 15199 }, 15200 end: { 15201 clientId: selectionFocus.clientId 15202 } 15203 }); 15204 }; 15205 15206 /** 15207 * Action that merges two blocks. 15208 * 15209 * @param {string} firstBlockClientId Client ID of the first block to merge. 15210 * @param {string} secondBlockClientId Client ID of the second block to merge. 15211 */ 15212 const mergeBlocks = (firstBlockClientId, secondBlockClientId) => ({ 15213 registry, 15214 select, 15215 dispatch 15216 }) => { 15217 const clientIdA = firstBlockClientId; 15218 const clientIdB = secondBlockClientId; 15219 const blockA = select.getBlock(clientIdA); 15220 const blockAType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockA.name); 15221 if (!blockAType) { 15222 return; 15223 } 15224 const blockB = select.getBlock(clientIdB); 15225 if (!blockAType.merge && (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockA.name, '__experimentalOnMerge')) { 15226 // If there's no merge function defined, attempt merging inner 15227 // blocks. 15228 const blocksWithTheSameType = (0,external_wp_blocks_namespaceObject.switchToBlockType)(blockB, blockAType.name); 15229 // Only focus the previous block if it's not mergeable. 15230 if (blocksWithTheSameType?.length !== 1) { 15231 dispatch.selectBlock(blockA.clientId); 15232 return; 15233 } 15234 const [blockWithSameType] = blocksWithTheSameType; 15235 if (blockWithSameType.innerBlocks.length < 1) { 15236 dispatch.selectBlock(blockA.clientId); 15237 return; 15238 } 15239 registry.batch(() => { 15240 dispatch.insertBlocks(blockWithSameType.innerBlocks, undefined, clientIdA); 15241 dispatch.removeBlock(clientIdB); 15242 dispatch.selectBlock(blockWithSameType.innerBlocks[0].clientId); 15243 15244 // Attempt to merge the next block if it's the same type and 15245 // same attributes. This is useful when merging a paragraph into 15246 // a list, and the next block is also a list. If we don't merge, 15247 // it looks like one list, but it's actually two lists. The same 15248 // applies to other blocks such as a group with the same 15249 // attributes. 15250 const nextBlockClientId = select.getNextBlockClientId(clientIdA); 15251 if (nextBlockClientId && select.getBlockName(clientIdA) === select.getBlockName(nextBlockClientId)) { 15252 const rootAttributes = select.getBlockAttributes(clientIdA); 15253 const previousRootAttributes = select.getBlockAttributes(nextBlockClientId); 15254 if (Object.keys(rootAttributes).every(key => rootAttributes[key] === previousRootAttributes[key])) { 15255 dispatch.moveBlocksToPosition(select.getBlockOrder(nextBlockClientId), nextBlockClientId, clientIdA); 15256 dispatch.removeBlock(nextBlockClientId, false); 15257 } 15258 } 15259 }); 15260 return; 15261 } 15262 if ((0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(blockA)) { 15263 dispatch.removeBlock(clientIdA, select.isBlockSelected(clientIdA)); 15264 return; 15265 } 15266 if ((0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(blockB)) { 15267 dispatch.removeBlock(clientIdB, select.isBlockSelected(clientIdB)); 15268 return; 15269 } 15270 if (!blockAType.merge) { 15271 dispatch.selectBlock(blockA.clientId); 15272 return; 15273 } 15274 const blockBType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockB.name); 15275 const { 15276 clientId, 15277 attributeKey, 15278 offset 15279 } = select.getSelectionStart(); 15280 const selectedBlockType = clientId === clientIdA ? blockAType : blockBType; 15281 const attributeDefinition = selectedBlockType.attributes[attributeKey]; 15282 const canRestoreTextSelection = (clientId === clientIdA || clientId === clientIdB) && attributeKey !== undefined && offset !== undefined && 15283 // We cannot restore text selection if the RichText identifier 15284 // is not a defined block attribute key. This can be the case if the 15285 // fallback intance ID is used to store selection (and no RichText 15286 // identifier is set), or when the identifier is wrong. 15287 !!attributeDefinition; 15288 if (!attributeDefinition) { 15289 if (typeof attributeKey === 'number') { 15290 window.console.error(`RichText needs an identifier prop that is the block attribute key of the attribute it controls. Its type is expected to be a string, but was $typeof attributeKey}`); 15291 } else { 15292 window.console.error('The RichText identifier prop does not match any attributes defined by the block.'); 15293 } 15294 } 15295 15296 // Clone the blocks so we don't insert the character in a "live" block. 15297 const cloneA = (0,external_wp_blocks_namespaceObject.cloneBlock)(blockA); 15298 const cloneB = (0,external_wp_blocks_namespaceObject.cloneBlock)(blockB); 15299 if (canRestoreTextSelection) { 15300 const selectedBlock = clientId === clientIdA ? cloneA : cloneB; 15301 const html = selectedBlock.attributes[attributeKey]; 15302 const value = (0,external_wp_richText_namespaceObject.insert)((0,external_wp_richText_namespaceObject.create)({ 15303 html 15304 }), START_OF_SELECTED_AREA, offset, offset); 15305 selectedBlock.attributes[attributeKey] = (0,external_wp_richText_namespaceObject.toHTMLString)({ 15306 value 15307 }); 15308 } 15309 15310 // We can only merge blocks with similar types 15311 // thus, we transform the block to merge first. 15312 const blocksWithTheSameType = blockA.name === blockB.name ? [cloneB] : (0,external_wp_blocks_namespaceObject.switchToBlockType)(cloneB, blockA.name); 15313 15314 // If the block types can not match, do nothing. 15315 if (!blocksWithTheSameType || !blocksWithTheSameType.length) { 15316 return; 15317 } 15318 15319 // Calling the merge to update the attributes and remove the block to be merged. 15320 const updatedAttributes = blockAType.merge(cloneA.attributes, blocksWithTheSameType[0].attributes); 15321 if (canRestoreTextSelection) { 15322 const newAttributeKey = retrieveSelectedAttribute(updatedAttributes); 15323 const convertedHtml = updatedAttributes[newAttributeKey]; 15324 const convertedValue = (0,external_wp_richText_namespaceObject.create)({ 15325 html: convertedHtml 15326 }); 15327 const newOffset = convertedValue.text.indexOf(START_OF_SELECTED_AREA); 15328 const newValue = (0,external_wp_richText_namespaceObject.remove)(convertedValue, newOffset, newOffset + 1); 15329 const newHtml = (0,external_wp_richText_namespaceObject.toHTMLString)({ 15330 value: newValue 15331 }); 15332 updatedAttributes[newAttributeKey] = newHtml; 15333 dispatch.selectionChange(blockA.clientId, newAttributeKey, newOffset, newOffset); 15334 } 15335 dispatch.replaceBlocks([blockA.clientId, blockB.clientId], [{ 15336 ...blockA, 15337 attributes: { 15338 ...blockA.attributes, 15339 ...updatedAttributes 15340 } 15341 }, ...blocksWithTheSameType.slice(1)], 0 // If we don't pass the `indexToSelect` it will default to the last block. 15342 ); 15343 }; 15344 15345 /** 15346 * Yields action objects used in signalling that the blocks corresponding to 15347 * the set of specified client IDs are to be removed. 15348 * 15349 * @param {string|string[]} clientIds Client IDs of blocks to remove. 15350 * @param {boolean} selectPrevious True if the previous block 15351 * or the immediate parent 15352 * (if no previous block exists) 15353 * should be selected 15354 * when a block is removed. 15355 */ 15356 const removeBlocks = (clientIds, selectPrevious = true) => privateRemoveBlocks(clientIds, selectPrevious); 15357 15358 /** 15359 * Returns an action object used in signalling that the block with the 15360 * specified client ID is to be removed. 15361 * 15362 * @param {string} clientId Client ID of block to remove. 15363 * @param {boolean} selectPrevious True if the previous block should be 15364 * selected when a block is removed. 15365 * 15366 * @return {Object} Action object. 15367 */ 15368 function removeBlock(clientId, selectPrevious) { 15369 return removeBlocks([clientId], selectPrevious); 15370 } 15371 15372 /* eslint-disable jsdoc/valid-types */ 15373 /** 15374 * Returns an action object used in signalling that the inner blocks with the 15375 * specified client ID should be replaced. 15376 * 15377 * @param {string} rootClientId Client ID of the block whose InnerBlocks will re replaced. 15378 * @param {Object[]} blocks Block objects to insert as new InnerBlocks 15379 * @param {?boolean} updateSelection If true block selection will be updated. If false, block selection will not change. Defaults to false. 15380 * @param {0|-1|null} initialPosition Initial block position. 15381 * @return {Object} Action object. 15382 */ 15383 function replaceInnerBlocks(rootClientId, blocks, updateSelection = false, initialPosition = 0) { 15384 /* eslint-enable jsdoc/valid-types */ 15385 return { 15386 type: 'REPLACE_INNER_BLOCKS', 15387 rootClientId, 15388 blocks, 15389 updateSelection, 15390 initialPosition: updateSelection ? initialPosition : null, 15391 time: Date.now() 15392 }; 15393 } 15394 15395 /** 15396 * Returns an action object used to toggle the block editing mode between 15397 * visual and HTML modes. 15398 * 15399 * @param {string} clientId Block client ID. 15400 * 15401 * @return {Object} Action object. 15402 */ 15403 function toggleBlockMode(clientId) { 15404 return { 15405 type: 'TOGGLE_BLOCK_MODE', 15406 clientId 15407 }; 15408 } 15409 15410 /** 15411 * Returns an action object used in signalling that the user has begun to type. 15412 * 15413 * @return {Object} Action object. 15414 */ 15415 function startTyping() { 15416 return { 15417 type: 'START_TYPING' 15418 }; 15419 } 15420 15421 /** 15422 * Returns an action object used in signalling that the user has stopped typing. 15423 * 15424 * @return {Object} Action object. 15425 */ 15426 function stopTyping() { 15427 return { 15428 type: 'STOP_TYPING' 15429 }; 15430 } 15431 15432 /** 15433 * Returns an action object used in signalling that the user has begun to drag blocks. 15434 * 15435 * @param {string[]} clientIds An array of client ids being dragged 15436 * 15437 * @return {Object} Action object. 15438 */ 15439 function startDraggingBlocks(clientIds = []) { 15440 return { 15441 type: 'START_DRAGGING_BLOCKS', 15442 clientIds 15443 }; 15444 } 15445 15446 /** 15447 * Returns an action object used in signalling that the user has stopped dragging blocks. 15448 * 15449 * @return {Object} Action object. 15450 */ 15451 function stopDraggingBlocks() { 15452 return { 15453 type: 'STOP_DRAGGING_BLOCKS' 15454 }; 15455 } 15456 15457 /** 15458 * Returns an action object used in signalling that the caret has entered formatted text. 15459 * 15460 * @deprecated 15461 * 15462 * @return {Object} Action object. 15463 */ 15464 function enterFormattedText() { 15465 external_wp_deprecated_default()('wp.data.dispatch( "core/block-editor" ).enterFormattedText', { 15466 since: '6.1', 15467 version: '6.3' 15468 }); 15469 return { 15470 type: 'DO_NOTHING' 15471 }; 15472 } 15473 15474 /** 15475 * Returns an action object used in signalling that the user caret has exited formatted text. 15476 * 15477 * @deprecated 15478 * 15479 * @return {Object} Action object. 15480 */ 15481 function exitFormattedText() { 15482 external_wp_deprecated_default()('wp.data.dispatch( "core/block-editor" ).exitFormattedText', { 15483 since: '6.1', 15484 version: '6.3' 15485 }); 15486 return { 15487 type: 'DO_NOTHING' 15488 }; 15489 } 15490 15491 /** 15492 * Action that changes the position of the user caret. 15493 * 15494 * @param {string|WPSelection} clientId The selected block client ID. 15495 * @param {string} attributeKey The selected block attribute key. 15496 * @param {number} startOffset The start offset. 15497 * @param {number} endOffset The end offset. 15498 * 15499 * @return {Object} Action object. 15500 */ 15501 function selectionChange(clientId, attributeKey, startOffset, endOffset) { 15502 if (typeof clientId === 'string') { 15503 return { 15504 type: 'SELECTION_CHANGE', 15505 clientId, 15506 attributeKey, 15507 startOffset, 15508 endOffset 15509 }; 15510 } 15511 return { 15512 type: 'SELECTION_CHANGE', 15513 ...clientId 15514 }; 15515 } 15516 15517 /** 15518 * Action that adds a new block of the default type to the block list. 15519 * 15520 * @param {?Object} attributes Optional attributes of the block to assign. 15521 * @param {?string} rootClientId Optional root client ID of block list on which 15522 * to append. 15523 * @param {?number} index Optional index where to insert the default block. 15524 */ 15525 const insertDefaultBlock = (attributes, rootClientId, index) => ({ 15526 dispatch 15527 }) => { 15528 // Abort if there is no default block type (if it has been unregistered). 15529 const defaultBlockName = (0,external_wp_blocks_namespaceObject.getDefaultBlockName)(); 15530 if (!defaultBlockName) { 15531 return; 15532 } 15533 const block = (0,external_wp_blocks_namespaceObject.createBlock)(defaultBlockName, attributes); 15534 return dispatch.insertBlock(block, index, rootClientId); 15535 }; 15536 15537 /** 15538 * @typedef {Object< string, Object >} SettingsByClientId 15539 */ 15540 15541 /** 15542 * Action that changes the nested settings of the given block(s). 15543 * 15544 * @param {string | SettingsByClientId} clientId Client ID of the block whose 15545 * nested setting are being 15546 * received, or object of settings 15547 * by client ID. 15548 * @param {Object} settings Object with the new settings 15549 * for the nested block. 15550 * 15551 * @return {Object} Action object 15552 */ 15553 function updateBlockListSettings(clientId, settings) { 15554 return { 15555 type: 'UPDATE_BLOCK_LIST_SETTINGS', 15556 clientId, 15557 settings 15558 }; 15559 } 15560 15561 /** 15562 * Action that updates the block editor settings. 15563 * 15564 * @param {Object} settings Updated settings 15565 * 15566 * @return {Object} Action object 15567 */ 15568 function updateSettings(settings) { 15569 return __experimentalUpdateSettings(settings, { 15570 stripExperimentalSettings: true 15571 }); 15572 } 15573 15574 /** 15575 * Action that signals that a temporary reusable block has been saved 15576 * in order to switch its temporary id with the real id. 15577 * 15578 * @param {string} id Reusable block's id. 15579 * @param {string} updatedId Updated block's id. 15580 * 15581 * @return {Object} Action object. 15582 */ 15583 function __unstableSaveReusableBlock(id, updatedId) { 15584 return { 15585 type: 'SAVE_REUSABLE_BLOCK_SUCCESS', 15586 id, 15587 updatedId 15588 }; 15589 } 15590 15591 /** 15592 * Action that marks the last block change explicitly as persistent. 15593 * 15594 * @return {Object} Action object. 15595 */ 15596 function __unstableMarkLastChangeAsPersistent() { 15597 return { 15598 type: 'MARK_LAST_CHANGE_AS_PERSISTENT' 15599 }; 15600 } 15601 15602 /** 15603 * Action that signals that the next block change should be marked explicitly as not persistent. 15604 * 15605 * @return {Object} Action object. 15606 */ 15607 function __unstableMarkNextChangeAsNotPersistent() { 15608 return { 15609 type: 'MARK_NEXT_CHANGE_AS_NOT_PERSISTENT' 15610 }; 15611 } 15612 15613 /** 15614 * Action that marks the last block change as an automatic change, meaning it was not 15615 * performed by the user, and can be undone using the `Escape` and `Backspace` keys. 15616 * This action must be called after the change was made, and any actions that are a 15617 * consequence of it, so it is recommended to be called at the next idle period to ensure all 15618 * selection changes have been recorded. 15619 */ 15620 const __unstableMarkAutomaticChange = () => ({ 15621 dispatch 15622 }) => { 15623 dispatch({ 15624 type: 'MARK_AUTOMATIC_CHANGE' 15625 }); 15626 const { 15627 requestIdleCallback = cb => setTimeout(cb, 100) 15628 } = window; 15629 requestIdleCallback(() => { 15630 dispatch({ 15631 type: 'MARK_AUTOMATIC_CHANGE_FINAL' 15632 }); 15633 }); 15634 }; 15635 15636 /** 15637 * Action that enables or disables the navigation mode. 15638 * 15639 * @param {boolean} isNavigationMode Enable/Disable navigation mode. 15640 */ 15641 const setNavigationMode = (isNavigationMode = true) => ({ 15642 dispatch 15643 }) => { 15644 dispatch.__unstableSetEditorMode(isNavigationMode ? 'navigation' : 'edit'); 15645 }; 15646 15647 /** 15648 * Action that sets the editor mode 15649 * 15650 * @param {string} mode Editor mode 15651 */ 15652 const __unstableSetEditorMode = mode => ({ 15653 dispatch, 15654 select 15655 }) => { 15656 // When switching to zoom-out mode, we need to select the parent section 15657 if (mode === 'zoom-out') { 15658 const firstSelectedClientId = select.getBlockSelectionStart(); 15659 const sectionRootClientId = select.getSectionRootClientId(); 15660 if (firstSelectedClientId) { 15661 let sectionClientId; 15662 if (sectionRootClientId) { 15663 const sectionClientIds = select.getBlockOrder(sectionRootClientId); 15664 15665 // If the selected block is a section block, use it. 15666 if (sectionClientIds?.includes(firstSelectedClientId)) { 15667 sectionClientId = firstSelectedClientId; 15668 } else { 15669 // If the selected block is not a section block, find 15670 // the parent section that contains the selected block. 15671 sectionClientId = select.getBlockParents(firstSelectedClientId).find(parent => sectionClientIds.includes(parent)); 15672 } 15673 } else { 15674 sectionClientId = select.getBlockHierarchyRootClientId(firstSelectedClientId); 15675 } 15676 if (sectionClientId) { 15677 dispatch.selectBlock(sectionClientId); 15678 } else { 15679 dispatch.clearSelectedBlock(); 15680 } 15681 } 15682 } 15683 dispatch({ 15684 type: 'SET_EDITOR_MODE', 15685 mode 15686 }); 15687 if (mode === 'navigation') { 15688 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.__)('You are currently in navigation mode. Navigate blocks using the Tab key and Arrow keys. Use Left and Right Arrow keys to move between nesting levels. To exit navigation mode and edit the selected block, press Enter.')); 15689 } else if (mode === 'edit') { 15690 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.__)('You are currently in edit mode. To return to the navigation mode, press Escape.')); 15691 } else if (mode === 'zoom-out') { 15692 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.__)('You are currently in zoom-out mode.')); 15693 } 15694 }; 15695 15696 /** 15697 * Action that enables or disables the block moving mode. 15698 * 15699 * @param {string|null} hasBlockMovingClientId Enable/Disable block moving mode. 15700 */ 15701 const setBlockMovingClientId = (hasBlockMovingClientId = null) => ({ 15702 dispatch 15703 }) => { 15704 dispatch({ 15705 type: 'SET_BLOCK_MOVING_MODE', 15706 hasBlockMovingClientId 15707 }); 15708 if (hasBlockMovingClientId) { 15709 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.__)('Use the Tab key and Arrow keys to choose new block location. Use Left and Right Arrow keys to move between nesting levels. Once location is selected press Enter or Space to move the block.')); 15710 } 15711 }; 15712 15713 /** 15714 * Action that duplicates a list of blocks. 15715 * 15716 * @param {string[]} clientIds 15717 * @param {boolean} updateSelection 15718 */ 15719 const duplicateBlocks = (clientIds, updateSelection = true) => ({ 15720 select, 15721 dispatch 15722 }) => { 15723 if (!clientIds || !clientIds.length) { 15724 return; 15725 } 15726 15727 // Return early if blocks don't exist. 15728 const blocks = select.getBlocksByClientId(clientIds); 15729 if (blocks.some(block => !block)) { 15730 return; 15731 } 15732 15733 // Return early if blocks don't support multiple usage. 15734 const blockNames = blocks.map(block => block.name); 15735 if (blockNames.some(blockName => !(0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockName, 'multiple', true))) { 15736 return; 15737 } 15738 const rootClientId = select.getBlockRootClientId(clientIds[0]); 15739 const clientIdsArray = actions_castArray(clientIds); 15740 const lastSelectedIndex = select.getBlockIndex(clientIdsArray[clientIdsArray.length - 1]); 15741 const clonedBlocks = blocks.map(block => (0,external_wp_blocks_namespaceObject.__experimentalCloneSanitizedBlock)(block)); 15742 dispatch.insertBlocks(clonedBlocks, lastSelectedIndex + 1, rootClientId, updateSelection); 15743 if (clonedBlocks.length > 1 && updateSelection) { 15744 dispatch.multiSelect(clonedBlocks[0].clientId, clonedBlocks[clonedBlocks.length - 1].clientId); 15745 } 15746 return clonedBlocks.map(block => block.clientId); 15747 }; 15748 15749 /** 15750 * Action that inserts a default block before a given block. 15751 * 15752 * @param {string} clientId 15753 */ 15754 const insertBeforeBlock = clientId => ({ 15755 select, 15756 dispatch 15757 }) => { 15758 if (!clientId) { 15759 return; 15760 } 15761 const rootClientId = select.getBlockRootClientId(clientId); 15762 const isLocked = select.getTemplateLock(rootClientId); 15763 if (isLocked) { 15764 return; 15765 } 15766 const blockIndex = select.getBlockIndex(clientId); 15767 const directInsertBlock = rootClientId ? select.getDirectInsertBlock(rootClientId) : null; 15768 if (!directInsertBlock) { 15769 return dispatch.insertDefaultBlock({}, rootClientId, blockIndex); 15770 } 15771 const copiedAttributes = {}; 15772 if (directInsertBlock.attributesToCopy) { 15773 const attributes = select.getBlockAttributes(clientId); 15774 directInsertBlock.attributesToCopy.forEach(key => { 15775 if (attributes[key]) { 15776 copiedAttributes[key] = attributes[key]; 15777 } 15778 }); 15779 } 15780 const block = (0,external_wp_blocks_namespaceObject.createBlock)(directInsertBlock.name, { 15781 ...directInsertBlock.attributes, 15782 ...copiedAttributes 15783 }); 15784 return dispatch.insertBlock(block, blockIndex, rootClientId); 15785 }; 15786 15787 /** 15788 * Action that inserts a default block after a given block. 15789 * 15790 * @param {string} clientId 15791 */ 15792 const insertAfterBlock = clientId => ({ 15793 select, 15794 dispatch 15795 }) => { 15796 if (!clientId) { 15797 return; 15798 } 15799 const rootClientId = select.getBlockRootClientId(clientId); 15800 const isLocked = select.getTemplateLock(rootClientId); 15801 if (isLocked) { 15802 return; 15803 } 15804 const blockIndex = select.getBlockIndex(clientId); 15805 const directInsertBlock = rootClientId ? select.getDirectInsertBlock(rootClientId) : null; 15806 if (!directInsertBlock) { 15807 return dispatch.insertDefaultBlock({}, rootClientId, blockIndex + 1); 15808 } 15809 const copiedAttributes = {}; 15810 if (directInsertBlock.attributesToCopy) { 15811 const attributes = select.getBlockAttributes(clientId); 15812 directInsertBlock.attributesToCopy.forEach(key => { 15813 if (attributes[key]) { 15814 copiedAttributes[key] = attributes[key]; 15815 } 15816 }); 15817 } 15818 const block = (0,external_wp_blocks_namespaceObject.createBlock)(directInsertBlock.name, { 15819 ...directInsertBlock.attributes, 15820 ...copiedAttributes 15821 }); 15822 return dispatch.insertBlock(block, blockIndex + 1, rootClientId); 15823 }; 15824 15825 /** 15826 * Action that toggles the highlighted block state. 15827 * 15828 * @param {string} clientId The block's clientId. 15829 * @param {boolean} isHighlighted The highlight state. 15830 */ 15831 function toggleBlockHighlight(clientId, isHighlighted) { 15832 return { 15833 type: 'TOGGLE_BLOCK_HIGHLIGHT', 15834 clientId, 15835 isHighlighted 15836 }; 15837 } 15838 15839 /** 15840 * Action that "flashes" the block with a given `clientId` by rhythmically highlighting it. 15841 * 15842 * @param {string} clientId Target block client ID. 15843 */ 15844 const flashBlock = clientId => async ({ 15845 dispatch 15846 }) => { 15847 dispatch(toggleBlockHighlight(clientId, true)); 15848 await new Promise(resolve => setTimeout(resolve, 150)); 15849 dispatch(toggleBlockHighlight(clientId, false)); 15850 }; 15851 15852 /** 15853 * Action that sets whether a block has controlled inner blocks. 15854 * 15855 * @param {string} clientId The block's clientId. 15856 * @param {boolean} hasControlledInnerBlocks True if the block's inner blocks are controlled. 15857 */ 15858 function setHasControlledInnerBlocks(clientId, hasControlledInnerBlocks) { 15859 return { 15860 type: 'SET_HAS_CONTROLLED_INNER_BLOCKS', 15861 hasControlledInnerBlocks, 15862 clientId 15863 }; 15864 } 15865 15866 /** 15867 * Action that sets whether given blocks are visible on the canvas. 15868 * 15869 * @param {Record<string,boolean>} updates For each block's clientId, its new visibility setting. 15870 */ 15871 function setBlockVisibility(updates) { 15872 return { 15873 type: 'SET_BLOCK_VISIBILITY', 15874 updates 15875 }; 15876 } 15877 15878 /** 15879 * Action that sets whether a block is being temporarily edited as blocks. 15880 * 15881 * DO-NOT-USE in production. 15882 * This action is created for internal/experimental only usage and may be 15883 * removed anytime without any warning, causing breakage on any plugin or theme invoking it. 15884 * 15885 * @param {?string} temporarilyEditingAsBlocks The block's clientId being temporarily edited as blocks. 15886 * @param {?string} focusModeToRevert The focus mode to revert after temporarily edit as blocks finishes. 15887 */ 15888 function __unstableSetTemporarilyEditingAsBlocks(temporarilyEditingAsBlocks, focusModeToRevert) { 15889 return { 15890 type: 'SET_TEMPORARILY_EDITING_AS_BLOCKS', 15891 temporarilyEditingAsBlocks, 15892 focusModeToRevert 15893 }; 15894 } 15895 15896 /** 15897 * Interface for inserter media requests. 15898 * 15899 * @typedef {Object} InserterMediaRequest 15900 * @property {number} per_page How many items to fetch per page. 15901 * @property {string} search The search term to use for filtering the results. 15902 */ 15903 15904 /** 15905 * Interface for inserter media responses. Any media resource should 15906 * map their response to this interface, in order to create the core 15907 * WordPress media blocks (image, video, audio). 15908 * 15909 * @typedef {Object} InserterMediaItem 15910 * @property {string} title The title of the media item. 15911 * @property {string} url The source url of the media item. 15912 * @property {string} [previewUrl] The preview source url of the media item to display in the media list. 15913 * @property {number} [id] The WordPress id of the media item. 15914 * @property {number|string} [sourceId] The id of the media item from external source. 15915 * @property {string} [alt] The alt text of the media item. 15916 * @property {string} [caption] The caption of the media item. 15917 */ 15918 15919 /** 15920 * Registers a new inserter media category. Once registered, the media category is 15921 * available in the inserter's media tab. 15922 * 15923 * The following interfaces are used: 15924 * 15925 * _Type Definition_ 15926 * 15927 * - _InserterMediaRequest_ `Object`: Interface for inserter media requests. 15928 * 15929 * _Properties_ 15930 * 15931 * - _per_page_ `number`: How many items to fetch per page. 15932 * - _search_ `string`: The search term to use for filtering the results. 15933 * 15934 * _Type Definition_ 15935 * 15936 * - _InserterMediaItem_ `Object`: Interface for inserter media responses. Any media resource should 15937 * map their response to this interface, in order to create the core 15938 * WordPress media blocks (image, video, audio). 15939 * 15940 * _Properties_ 15941 * 15942 * - _title_ `string`: The title of the media item. 15943 * - _url_ `string: The source url of the media item. 15944 * - _previewUrl_ `[string]`: The preview source url of the media item to display in the media list. 15945 * - _id_ `[number]`: The WordPress id of the media item. 15946 * - _sourceId_ `[number|string]`: The id of the media item from external source. 15947 * - _alt_ `[string]`: The alt text of the media item. 15948 * - _caption_ `[string]`: The caption of the media item. 15949 * 15950 * @param {InserterMediaCategory} category The inserter media category to register. 15951 * 15952 * @example 15953 * ```js 15954 * 15955 * wp.data.dispatch('core/block-editor').registerInserterMediaCategory( { 15956 * name: 'openverse', 15957 * labels: { 15958 * name: 'Openverse', 15959 * search_items: 'Search Openverse', 15960 * }, 15961 * mediaType: 'image', 15962 * async fetch( query = {} ) { 15963 * const defaultArgs = { 15964 * mature: false, 15965 * excluded_source: 'flickr,inaturalist,wikimedia', 15966 * license: 'pdm,cc0', 15967 * }; 15968 * const finalQuery = { ...query, ...defaultArgs }; 15969 * // Sometimes you might need to map the supported request params according to `InserterMediaRequest`. 15970 * // interface. In this example the `search` query param is named `q`. 15971 * const mapFromInserterMediaRequest = { 15972 * per_page: 'page_size', 15973 * search: 'q', 15974 * }; 15975 * const url = new URL( 'https://api.openverse.org/v1/images/' ); 15976 * Object.entries( finalQuery ).forEach( ( [ key, value ] ) => { 15977 * const queryKey = mapFromInserterMediaRequest[ key ] || key; 15978 * url.searchParams.set( queryKey, value ); 15979 * } ); 15980 * const response = await window.fetch( url, { 15981 * headers: { 15982 * 'User-Agent': 'WordPress/inserter-media-fetch', 15983 * }, 15984 * } ); 15985 * const jsonResponse = await response.json(); 15986 * const results = jsonResponse.results; 15987 * return results.map( ( result ) => ( { 15988 * ...result, 15989 * // If your response result includes an `id` prop that you want to access later, it should 15990 * // be mapped to `InserterMediaItem`'s `sourceId` prop. This can be useful if you provide 15991 * // a report URL getter. 15992 * // Additionally you should always clear the `id` value of your response results because 15993 * // it is used to identify WordPress media items. 15994 * sourceId: result.id, 15995 * id: undefined, 15996 * caption: result.caption, 15997 * previewUrl: result.thumbnail, 15998 * } ) ); 15999 * }, 16000 * getReportUrl: ( { sourceId } ) => 16001 * `https://wordpress.org/openverse/image/${ sourceId }/report/`, 16002 * isExternalResource: true, 16003 * } ); 16004 * ``` 16005 * 16006 * @typedef {Object} InserterMediaCategory Interface for inserter media category. 16007 * @property {string} name The name of the media category, that should be unique among all media categories. 16008 * @property {Object} labels Labels for the media category. 16009 * @property {string} labels.name General name of the media category. It's used in the inserter media items list. 16010 * @property {string} [labels.search_items='Search'] Label for searching items. Default is ‘Search Posts’ / ‘Search Pages’. 16011 * @property {('image'|'audio'|'video')} mediaType The media type of the media category. 16012 * @property {(InserterMediaRequest) => Promise<InserterMediaItem[]>} fetch The function to fetch media items for the category. 16013 * @property {(InserterMediaItem) => string} [getReportUrl] If the media category supports reporting media items, this function should return 16014 * the report url for the media item. It accepts the `InserterMediaItem` as an argument. 16015 * @property {boolean} [isExternalResource] If the media category is an external resource, this should be set to true. 16016 * This is used to avoid making a request to the external resource when the user 16017 */ 16018 const registerInserterMediaCategory = category => ({ 16019 select, 16020 dispatch 16021 }) => { 16022 if (!category || typeof category !== 'object') { 16023 console.error('Category should be an `InserterMediaCategory` object.'); 16024 return; 16025 } 16026 if (!category.name) { 16027 console.error('Category should have a `name` that should be unique among all media categories.'); 16028 return; 16029 } 16030 if (!category.labels?.name) { 16031 console.error('Category should have a `labels.name`.'); 16032 return; 16033 } 16034 if (!['image', 'audio', 'video'].includes(category.mediaType)) { 16035 console.error('Category should have `mediaType` property that is one of `image|audio|video`.'); 16036 return; 16037 } 16038 if (!category.fetch || typeof category.fetch !== 'function') { 16039 console.error('Category should have a `fetch` function defined with the following signature `(InserterMediaRequest) => Promise<InserterMediaItem[]>`.'); 16040 return; 16041 } 16042 const registeredInserterMediaCategories = select.getRegisteredInserterMediaCategories(); 16043 if (registeredInserterMediaCategories.some(({ 16044 name 16045 }) => name === category.name)) { 16046 console.error(`A category is already registered with the same name: "$category.name}".`); 16047 return; 16048 } 16049 if (registeredInserterMediaCategories.some(({ 16050 labels: { 16051 name 16052 } = {} 16053 }) => name === category.labels?.name)) { 16054 console.error(`A category is already registered with the same labels.name: "$category.labels.name}".`); 16055 return; 16056 } 16057 // `inserterMediaCategories` is a private block editor setting, which means it cannot 16058 // be updated through the public `updateSettings` action. We preserve this setting as 16059 // private, so extenders can only add new inserter media categories and don't have any 16060 // control over the core media categories. 16061 dispatch({ 16062 type: 'REGISTER_INSERTER_MEDIA_CATEGORY', 16063 category: { 16064 ...category, 16065 isExternalResource: true 16066 } 16067 }); 16068 }; 16069 16070 /** 16071 * @typedef {import('../components/block-editing-mode').BlockEditingMode} BlockEditingMode 16072 */ 16073 16074 /** 16075 * Sets the block editing mode for a given block. 16076 * 16077 * @see useBlockEditingMode 16078 * 16079 * @param {string} clientId The block client ID, or `''` for the root container. 16080 * @param {BlockEditingMode} mode The block editing mode. One of `'disabled'`, 16081 * `'contentOnly'`, or `'default'`. 16082 * 16083 * @return {Object} Action object. 16084 */ 16085 function setBlockEditingMode(clientId = '', mode) { 16086 return { 16087 type: 'SET_BLOCK_EDITING_MODE', 16088 clientId, 16089 mode 16090 }; 16091 } 16092 16093 /** 16094 * Clears the block editing mode for a given block. 16095 * 16096 * @see useBlockEditingMode 16097 * 16098 * @param {string} clientId The block client ID, or `''` for the root container. 16099 * 16100 * @return {Object} Action object. 16101 */ 16102 function unsetBlockEditingMode(clientId = '') { 16103 return { 16104 type: 'UNSET_BLOCK_EDITING_MODE', 16105 clientId 16106 }; 16107 } 16108 16109 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/index.js 16110 /** 16111 * WordPress dependencies 16112 */ 16113 16114 16115 /** 16116 * Internal dependencies 16117 */ 16118 16119 16120 16121 16122 16123 16124 16125 16126 /** 16127 * Block editor data store configuration. 16128 * 16129 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#registerStore 16130 */ 16131 const storeConfig = { 16132 reducer: reducer, 16133 selectors: selectors_namespaceObject, 16134 actions: actions_namespaceObject 16135 }; 16136 16137 /** 16138 * Store definition for the block editor namespace. 16139 * 16140 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#createReduxStore 16141 */ 16142 const store = (0,external_wp_data_namespaceObject.createReduxStore)(STORE_NAME, { 16143 ...storeConfig, 16144 persist: ['preferences'] 16145 }); 16146 16147 // We will be able to use the `register` function once we switch 16148 // the "preferences" persistence to use the new preferences package. 16149 const registeredStore = (0,external_wp_data_namespaceObject.registerStore)(STORE_NAME, { 16150 ...storeConfig, 16151 persist: ['preferences'] 16152 }); 16153 unlock(registeredStore).registerPrivateActions(private_actions_namespaceObject); 16154 unlock(registeredStore).registerPrivateSelectors(private_selectors_namespaceObject); 16155 16156 // TODO: Remove once we switch to the `register` function (see above). 16157 // 16158 // Until then, private functions also need to be attached to the original 16159 // `store` descriptor in order to avoid unit tests failing, which could happen 16160 // when tests create new registries in which they register stores. 16161 // 16162 // @see https://github.com/WordPress/gutenberg/pull/51145#discussion_r1239999590 16163 unlock(store).registerPrivateActions(private_actions_namespaceObject); 16164 unlock(store).registerPrivateSelectors(private_selectors_namespaceObject); 16165 16166 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-settings/index.js 16167 /** 16168 * WordPress dependencies 16169 */ 16170 16171 16172 16173 /** 16174 * Internal dependencies 16175 */ 16176 16177 16178 16179 16180 /** 16181 * Hook that retrieves the given settings for the block instance in use. 16182 * 16183 * It looks up the settings first in the block instance hierarchy. 16184 * If none are found, it'll look them up in the block editor settings. 16185 * 16186 * @param {string[]} paths The paths to the settings. 16187 * @return {any[]} Returns the values defined for the settings. 16188 * @example 16189 * ```js 16190 * const [ fixed, sticky ] = useSettings( 'position.fixed', 'position.sticky' ); 16191 * ``` 16192 */ 16193 function use_settings_useSettings(...paths) { 16194 const { 16195 clientId = null 16196 } = useBlockEditContext(); 16197 return (0,external_wp_data_namespaceObject.useSelect)(select => unlock(select(store)).getBlockSettings(clientId, ...paths), 16198 // eslint-disable-next-line react-hooks/exhaustive-deps 16199 [clientId, ...paths]); 16200 } 16201 16202 /** 16203 * Hook that retrieves the given setting for the block instance in use. 16204 * 16205 * It looks up the setting first in the block instance hierarchy. 16206 * If none is found, it'll look it up in the block editor settings. 16207 * 16208 * @deprecated 6.5.0 Use useSettings instead. 16209 * 16210 * @param {string} path The path to the setting. 16211 * @return {any} Returns the value defined for the setting. 16212 * @example 16213 * ```js 16214 * const isEnabled = useSetting( 'typography.dropCap' ); 16215 * ``` 16216 */ 16217 function useSetting(path) { 16218 external_wp_deprecated_default()('wp.blockEditor.useSetting', { 16219 since: '6.5', 16220 alternative: 'wp.blockEditor.useSettings', 16221 note: 'The new useSettings function can retrieve multiple settings at once, with better performance.' 16222 }); 16223 const [value] = use_settings_useSettings(path); 16224 return value; 16225 } 16226 16227 ;// CONCATENATED MODULE: external ["wp","styleEngine"] 16228 const external_wp_styleEngine_namespaceObject = window["wp"]["styleEngine"]; 16229 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/font-sizes/fluid-utils.js 16230 /** 16231 * The fluid utilities must match the backend equivalent. 16232 * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php 16233 * --------------------------------------------------------------- 16234 */ 16235 16236 // Defaults. 16237 const DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px'; 16238 const DEFAULT_MINIMUM_VIEWPORT_WIDTH = '320px'; 16239 const DEFAULT_SCALE_FACTOR = 1; 16240 const DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MIN = 0.25; 16241 const DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MAX = 0.75; 16242 const DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px'; 16243 16244 /** 16245 * Computes a fluid font-size value that uses clamp(). A minimum and maximum 16246 * font size OR a single font size can be specified. 16247 * 16248 * If a single font size is specified, it is scaled up and down using a logarithmic scale. 16249 * 16250 * @example 16251 * ```js 16252 * // Calculate fluid font-size value from a minimum and maximum value. 16253 * const fontSize = getComputedFluidTypographyValue( { 16254 * minimumFontSize: '20px', 16255 * maximumFontSize: '45px' 16256 * } ); 16257 * // Calculate fluid font-size value from a single font size. 16258 * const fontSize = getComputedFluidTypographyValue( { 16259 * fontSize: '30px', 16260 * } ); 16261 * ``` 16262 * 16263 * @param {Object} args 16264 * @param {?string} args.minimumViewportWidth Minimum viewport size from which type will have fluidity. Optional if fontSize is specified. 16265 * @param {?string} args.maximumViewportWidth Maximum size up to which type will have fluidity. Optional if fontSize is specified. 16266 * @param {string|number} [args.fontSize] Size to derive maximumFontSize and minimumFontSize from, if necessary. Optional if minimumFontSize and maximumFontSize are specified. 16267 * @param {?string} args.maximumFontSize Maximum font size for any clamp() calculation. Optional. 16268 * @param {?string} args.minimumFontSize Minimum font size for any clamp() calculation. Optional. 16269 * @param {?number} args.scaleFactor A scale factor to determine how fast a font scales within boundaries. Optional. 16270 * @param {?string} args.minimumFontSizeLimit The smallest a calculated font size may be. Optional. 16271 * 16272 * @return {string|null} A font-size value using clamp(). 16273 */ 16274 function getComputedFluidTypographyValue({ 16275 minimumFontSize, 16276 maximumFontSize, 16277 fontSize, 16278 minimumViewportWidth = DEFAULT_MINIMUM_VIEWPORT_WIDTH, 16279 maximumViewportWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH, 16280 scaleFactor = DEFAULT_SCALE_FACTOR, 16281 minimumFontSizeLimit 16282 }) { 16283 // Validate incoming settings and set defaults. 16284 minimumFontSizeLimit = !!getTypographyValueAndUnit(minimumFontSizeLimit) ? minimumFontSizeLimit : DEFAULT_MINIMUM_FONT_SIZE_LIMIT; 16285 16286 /* 16287 * Calculates missing minimumFontSize and maximumFontSize from 16288 * defaultFontSize if provided. 16289 */ 16290 if (fontSize) { 16291 // Parses default font size. 16292 const fontSizeParsed = getTypographyValueAndUnit(fontSize); 16293 16294 // Protect against invalid units. 16295 if (!fontSizeParsed?.unit) { 16296 return null; 16297 } 16298 16299 // Parses the minimum font size limit, so we can perform checks using it. 16300 const minimumFontSizeLimitParsed = getTypographyValueAndUnit(minimumFontSizeLimit, { 16301 coerceTo: fontSizeParsed.unit 16302 }); 16303 16304 // Don't enforce minimum font size if a font size has explicitly set a min and max value. 16305 if (!!minimumFontSizeLimitParsed?.value && !minimumFontSize && !maximumFontSize) { 16306 /* 16307 * If a minimum size was not passed to this function 16308 * and the user-defined font size is lower than $minimum_font_size_limit, 16309 * do not calculate a fluid value. 16310 */ 16311 if (fontSizeParsed?.value <= minimumFontSizeLimitParsed?.value) { 16312 return null; 16313 } 16314 } 16315 16316 // If no fluid max font size is available use the incoming value. 16317 if (!maximumFontSize) { 16318 maximumFontSize = `$fontSizeParsed.value}$fontSizeParsed.unit}`; 16319 } 16320 16321 /* 16322 * If no minimumFontSize is provided, create one using 16323 * the given font size multiplied by the min font size scale factor. 16324 */ 16325 if (!minimumFontSize) { 16326 const fontSizeValueInPx = fontSizeParsed.unit === 'px' ? fontSizeParsed.value : fontSizeParsed.value * 16; 16327 16328 /* 16329 * The scale factor is a multiplier that affects how quickly the curve will move towards the minimum, 16330 * that is, how quickly the size factor reaches 0 given increasing font size values. 16331 * For a - b * log2(), lower values of b will make the curve move towards the minimum faster. 16332 * The scale factor is constrained between min and max values. 16333 */ 16334 const minimumFontSizeFactor = Math.min(Math.max(1 - 0.075 * Math.log2(fontSizeValueInPx), DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MIN), DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MAX); 16335 16336 // Calculates the minimum font size. 16337 const calculatedMinimumFontSize = roundToPrecision(fontSizeParsed.value * minimumFontSizeFactor, 3); 16338 16339 // Only use calculated min font size if it's > $minimum_font_size_limit value. 16340 if (!!minimumFontSizeLimitParsed?.value && calculatedMinimumFontSize < minimumFontSizeLimitParsed?.value) { 16341 minimumFontSize = `$minimumFontSizeLimitParsed.value}$minimumFontSizeLimitParsed.unit}`; 16342 } else { 16343 minimumFontSize = `$calculatedMinimumFontSize}$fontSizeParsed.unit}`; 16344 } 16345 } 16346 } 16347 16348 // Grab the minimum font size and normalize it in order to use the value for calculations. 16349 const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSize); 16350 16351 // We get a 'preferred' unit to keep units consistent when calculating, 16352 // otherwise the result will not be accurate. 16353 const fontSizeUnit = minimumFontSizeParsed?.unit || 'rem'; 16354 16355 // Grabs the maximum font size and normalize it in order to use the value for calculations. 16356 const maximumFontSizeParsed = getTypographyValueAndUnit(maximumFontSize, { 16357 coerceTo: fontSizeUnit 16358 }); 16359 16360 // Checks for mandatory min and max sizes, and protects against unsupported units. 16361 if (!minimumFontSizeParsed || !maximumFontSizeParsed) { 16362 return null; 16363 } 16364 16365 // Uses rem for accessible fluid target font scaling. 16366 const minimumFontSizeRem = getTypographyValueAndUnit(minimumFontSize, { 16367 coerceTo: 'rem' 16368 }); 16369 16370 // Viewport widths defined for fluid typography. Normalize units 16371 const maximumViewportWidthParsed = getTypographyValueAndUnit(maximumViewportWidth, { 16372 coerceTo: fontSizeUnit 16373 }); 16374 const minimumViewportWidthParsed = getTypographyValueAndUnit(minimumViewportWidth, { 16375 coerceTo: fontSizeUnit 16376 }); 16377 16378 // Protect against unsupported units. 16379 if (!maximumViewportWidthParsed || !minimumViewportWidthParsed || !minimumFontSizeRem) { 16380 return null; 16381 } 16382 16383 // Calculates the linear factor denominator. If it's 0, we cannot calculate a fluid value. 16384 const linearDenominator = maximumViewportWidthParsed.value - minimumViewportWidthParsed.value; 16385 if (!linearDenominator) { 16386 return null; 16387 } 16388 16389 // Build CSS rule. 16390 // Borrowed from https://websemantics.uk/tools/responsive-font-calculator/. 16391 const minViewportWidthOffsetValue = roundToPrecision(minimumViewportWidthParsed.value / 100, 3); 16392 const viewportWidthOffset = roundToPrecision(minViewportWidthOffsetValue, 3) + fontSizeUnit; 16393 const linearFactor = 100 * ((maximumFontSizeParsed.value - minimumFontSizeParsed.value) / linearDenominator); 16394 const linearFactorScaled = roundToPrecision((linearFactor || 1) * scaleFactor, 3); 16395 const fluidTargetFontSize = `$minimumFontSizeRem.value}$minimumFontSizeRem.unit} + ((1vw - $viewportWidthOffset}) * $linearFactorScaled})`; 16396 return `clamp($minimumFontSize}, $fluidTargetFontSize}, $maximumFontSize})`; 16397 } 16398 16399 /** 16400 * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ]. 16401 * A raw font size of `value + unit` is expected. If the value is an integer, it will convert to `value + 'px'`. 16402 * 16403 * @param {string|number} rawValue Raw size value from theme.json. 16404 * @param {Object|undefined} options Calculation options. 16405 * 16406 * @return {{ unit: string, value: number }|null} An object consisting of `'value'` and `'unit'` properties. 16407 */ 16408 function getTypographyValueAndUnit(rawValue, options = {}) { 16409 if (typeof rawValue !== 'string' && typeof rawValue !== 'number') { 16410 return null; 16411 } 16412 16413 // Converts numeric values to pixel values by default. 16414 if (isFinite(rawValue)) { 16415 rawValue = `$rawValue}px`; 16416 } 16417 const { 16418 coerceTo, 16419 rootSizeValue, 16420 acceptableUnits 16421 } = { 16422 coerceTo: '', 16423 // Default browser font size. Later we could inject some JS to compute this `getComputedStyle( document.querySelector( "html" ) ).fontSize`. 16424 rootSizeValue: 16, 16425 acceptableUnits: ['rem', 'px', 'em'], 16426 ...options 16427 }; 16428 const acceptableUnitsGroup = acceptableUnits?.join('|'); 16429 const regexUnits = new RegExp(`^(\\d*\\.?\\d+)($acceptableUnitsGroup}){1,1}$`); 16430 const matches = rawValue.match(regexUnits); 16431 16432 // We need a number value and a unit. 16433 if (!matches || matches.length < 3) { 16434 return null; 16435 } 16436 let [, value, unit] = matches; 16437 let returnValue = parseFloat(value); 16438 if ('px' === coerceTo && ('em' === unit || 'rem' === unit)) { 16439 returnValue = returnValue * rootSizeValue; 16440 unit = coerceTo; 16441 } 16442 if ('px' === unit && ('em' === coerceTo || 'rem' === coerceTo)) { 16443 returnValue = returnValue / rootSizeValue; 16444 unit = coerceTo; 16445 } 16446 16447 /* 16448 * No calculation is required if swapping between em and rem yet, 16449 * since we assume a root size value. Later we might like to differentiate between 16450 * :root font size (rem) and parent element font size (em) relativity. 16451 */ 16452 if (('em' === coerceTo || 'rem' === coerceTo) && ('em' === unit || 'rem' === unit)) { 16453 unit = coerceTo; 16454 } 16455 return { 16456 value: roundToPrecision(returnValue, 3), 16457 unit 16458 }; 16459 } 16460 16461 /** 16462 * Returns a value rounded to defined precision. 16463 * Returns `undefined` if the value is not a valid finite number. 16464 * 16465 * @param {number} value Raw value. 16466 * @param {number} digits The number of digits to appear after the decimal point 16467 * 16468 * @return {number|undefined} Value rounded to standard precision. 16469 */ 16470 function roundToPrecision(value, digits = 3) { 16471 const base = Math.pow(10, digits); 16472 return Number.isFinite(value) ? parseFloat(Math.round(value * base) / base) : undefined; 16473 } 16474 16475 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/format-font-style.js 16476 /** 16477 * WordPress dependencies 16478 */ 16479 16480 16481 /** 16482 * Formats font styles to human readable names. 16483 * 16484 * @param {string} fontStyle font style string 16485 * @return {Object} new object with formatted font style 16486 */ 16487 function formatFontStyle(fontStyle) { 16488 if (!fontStyle) { 16489 return {}; 16490 } 16491 if (typeof fontStyle === 'object') { 16492 return fontStyle; 16493 } 16494 let name; 16495 switch (fontStyle) { 16496 case 'normal': 16497 name = (0,external_wp_i18n_namespaceObject._x)('Regular', 'font style'); 16498 break; 16499 case 'italic': 16500 name = (0,external_wp_i18n_namespaceObject._x)('Italic', 'font style'); 16501 break; 16502 case 'oblique': 16503 name = (0,external_wp_i18n_namespaceObject._x)('Oblique', 'font style'); 16504 break; 16505 default: 16506 name = fontStyle; 16507 break; 16508 } 16509 return { 16510 name, 16511 value: fontStyle 16512 }; 16513 } 16514 16515 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/format-font-weight.js 16516 /** 16517 * WordPress dependencies 16518 */ 16519 16520 16521 /** 16522 * Formats font weights to human readable names. 16523 * 16524 * @param {string} fontWeight font weight string 16525 * @return {Object} new object with formatted font weight 16526 */ 16527 function formatFontWeight(fontWeight) { 16528 if (!fontWeight) { 16529 return {}; 16530 } 16531 if (typeof fontWeight === 'object') { 16532 return fontWeight; 16533 } 16534 let name; 16535 switch (fontWeight) { 16536 case 'normal': 16537 case '400': 16538 name = (0,external_wp_i18n_namespaceObject._x)('Regular', 'font weight'); 16539 break; 16540 case 'bold': 16541 case '700': 16542 name = (0,external_wp_i18n_namespaceObject._x)('Bold', 'font weight'); 16543 break; 16544 case '100': 16545 name = (0,external_wp_i18n_namespaceObject._x)('Thin', 'font weight'); 16546 break; 16547 case '200': 16548 name = (0,external_wp_i18n_namespaceObject._x)('Extra Light', 'font weight'); 16549 break; 16550 case '300': 16551 name = (0,external_wp_i18n_namespaceObject._x)('Light', 'font weight'); 16552 break; 16553 case '500': 16554 name = (0,external_wp_i18n_namespaceObject._x)('Medium', 'font weight'); 16555 break; 16556 case '600': 16557 name = (0,external_wp_i18n_namespaceObject._x)('Semi Bold', 'font weight'); 16558 break; 16559 case '800': 16560 name = (0,external_wp_i18n_namespaceObject._x)('Extra Bold', 'font weight'); 16561 break; 16562 case '900': 16563 name = (0,external_wp_i18n_namespaceObject._x)('Black', 'font weight'); 16564 break; 16565 case '1000': 16566 name = (0,external_wp_i18n_namespaceObject._x)('Extra Black', 'font weight'); 16567 break; 16568 default: 16569 name = fontWeight; 16570 break; 16571 } 16572 return { 16573 name, 16574 value: fontWeight 16575 }; 16576 } 16577 16578 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/get-font-styles-and-weights.js 16579 /** 16580 * WordPress dependencies 16581 */ 16582 16583 16584 /** 16585 * Internal dependencies 16586 */ 16587 16588 16589 const FONT_STYLES = [{ 16590 name: (0,external_wp_i18n_namespaceObject._x)('Regular', 'font style'), 16591 value: 'normal' 16592 }, { 16593 name: (0,external_wp_i18n_namespaceObject._x)('Italic', 'font style'), 16594 value: 'italic' 16595 }]; 16596 const FONT_WEIGHTS = [{ 16597 name: (0,external_wp_i18n_namespaceObject._x)('Thin', 'font weight'), 16598 value: '100' 16599 }, { 16600 name: (0,external_wp_i18n_namespaceObject._x)('Extra Light', 'font weight'), 16601 value: '200' 16602 }, { 16603 name: (0,external_wp_i18n_namespaceObject._x)('Light', 'font weight'), 16604 value: '300' 16605 }, { 16606 name: (0,external_wp_i18n_namespaceObject._x)('Regular', 'font weight'), 16607 value: '400' 16608 }, { 16609 name: (0,external_wp_i18n_namespaceObject._x)('Medium', 'font weight'), 16610 value: '500' 16611 }, { 16612 name: (0,external_wp_i18n_namespaceObject._x)('Semi Bold', 'font weight'), 16613 value: '600' 16614 }, { 16615 name: (0,external_wp_i18n_namespaceObject._x)('Bold', 'font weight'), 16616 value: '700' 16617 }, { 16618 name: (0,external_wp_i18n_namespaceObject._x)('Extra Bold', 'font weight'), 16619 value: '800' 16620 }, { 16621 name: (0,external_wp_i18n_namespaceObject._x)('Black', 'font weight'), 16622 value: '900' 16623 }, { 16624 name: (0,external_wp_i18n_namespaceObject._x)('Extra Black', 'font weight'), 16625 value: '1000' 16626 }]; 16627 16628 /** 16629 * Builds a list of font style and weight options based on font family faces. 16630 * Defaults to the standard font styles and weights if no font family faces are provided. 16631 * 16632 * @param {Array} fontFamilyFaces font family faces array 16633 * @return {Object} new object with combined and separated font style and weight properties 16634 */ 16635 function getFontStylesAndWeights(fontFamilyFaces) { 16636 let fontStyles = []; 16637 let fontWeights = []; 16638 const combinedStyleAndWeightOptions = []; 16639 const isSystemFont = !fontFamilyFaces || fontFamilyFaces?.length === 0; 16640 let isVariableFont = false; 16641 fontFamilyFaces?.forEach(face => { 16642 // Check for variable font by looking for a space in the font weight value. e.g. "100 900" 16643 if ('string' === typeof face.fontWeight && /\s/.test(face.fontWeight.trim())) { 16644 isVariableFont = true; 16645 16646 // Find font weight start and end values. 16647 let [startValue, endValue] = face.fontWeight.split(' '); 16648 startValue = parseInt(startValue.slice(0, 1)); 16649 if (endValue === '1000') { 16650 endValue = 10; 16651 } else { 16652 endValue = parseInt(endValue.slice(0, 1)); 16653 } 16654 16655 // Create font weight options for available variable weights. 16656 for (let i = startValue; i <= endValue; i++) { 16657 const fontWeightValue = `$i.toString()}00`; 16658 if (!fontWeights.some(weight => weight.value === fontWeightValue)) { 16659 fontWeights.push(formatFontWeight(fontWeightValue)); 16660 } 16661 } 16662 } 16663 16664 // Format font style and weight values. 16665 const fontWeight = formatFontWeight('number' === typeof face.fontWeight ? face.fontWeight.toString() : face.fontWeight); 16666 const fontStyle = formatFontStyle(face.fontStyle); 16667 16668 // Create font style and font weight lists without duplicates. 16669 if (fontStyle && Object.keys(fontStyle).length) { 16670 if (!fontStyles.some(style => style.value === fontStyle.value)) { 16671 fontStyles.push(fontStyle); 16672 } 16673 } 16674 if (fontWeight && Object.keys(fontWeight).length) { 16675 if (!fontWeights.some(weight => weight.value === fontWeight.value)) { 16676 if (!isVariableFont) { 16677 fontWeights.push(fontWeight); 16678 } 16679 } 16680 } 16681 }); 16682 16683 // If there is no font weight of 600 or above, then include faux bold as an option. 16684 if (!fontWeights.some(weight => weight.value >= '600')) { 16685 fontWeights.push({ 16686 name: (0,external_wp_i18n_namespaceObject._x)('Bold', 'font weight'), 16687 value: '700' 16688 }); 16689 } 16690 16691 // If there is no italic font style, then include faux italic as an option. 16692 if (!fontStyles.some(style => style.value === 'italic')) { 16693 fontStyles.push({ 16694 name: (0,external_wp_i18n_namespaceObject._x)('Italic', 'font style'), 16695 value: 'italic' 16696 }); 16697 } 16698 16699 // Use default font styles and weights for system fonts. 16700 if (isSystemFont) { 16701 fontStyles = FONT_STYLES; 16702 fontWeights = FONT_WEIGHTS; 16703 } 16704 16705 // Use default styles and weights if there are no available styles or weights from the provided font faces. 16706 fontStyles = fontStyles.length === 0 ? FONT_STYLES : fontStyles; 16707 fontWeights = fontWeights.length === 0 ? FONT_WEIGHTS : fontWeights; 16708 16709 // Generate combined font style and weight options for available fonts. 16710 fontStyles.forEach(({ 16711 name: styleName, 16712 value: styleValue 16713 }) => { 16714 fontWeights.forEach(({ 16715 name: weightName, 16716 value: weightValue 16717 }) => { 16718 const optionName = styleValue === 'normal' ? weightName : (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: 1: Font weight name. 2: Font style name. */ 16719 (0,external_wp_i18n_namespaceObject._x)('%1$s %2$s', 'font'), weightName, styleName); 16720 combinedStyleAndWeightOptions.push({ 16721 key: `$styleValue}-$weightValue}`, 16722 name: optionName, 16723 style: { 16724 fontStyle: styleValue, 16725 fontWeight: weightValue 16726 } 16727 }); 16728 }); 16729 }); 16730 return { 16731 fontStyles, 16732 fontWeights, 16733 combinedStyleAndWeightOptions, 16734 isSystemFont, 16735 isVariableFont 16736 }; 16737 } 16738 16739 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/typography-utils.js 16740 /** 16741 * The fluid utilities must match the backend equivalent. 16742 * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php 16743 * --------------------------------------------------------------- 16744 */ 16745 16746 /** 16747 * Internal dependencies 16748 */ 16749 16750 16751 16752 /** 16753 * @typedef {Object} FluidPreset 16754 * @property {string|undefined} max A maximum font size value. 16755 * @property {?string|undefined} min A minimum font size value. 16756 */ 16757 16758 /** 16759 * @typedef {Object} Preset 16760 * @property {?string|?number} size A default font size. 16761 * @property {string} name A font size name, displayed in the UI. 16762 * @property {string} slug A font size slug 16763 * @property {boolean|FluidPreset|undefined} fluid Specifies the minimum and maximum font size value of a fluid font size. 16764 */ 16765 16766 /** 16767 * @typedef {Object} TypographySettings 16768 * @property {?string} minViewportWidth Minimum viewport size from which type will have fluidity. Optional if size is specified. 16769 * @property {?string} maxViewportWidth Maximum size up to which type will have fluidity. Optional if size is specified. 16770 * @property {?number} scaleFactor A scale factor to determine how fast a font scales within boundaries. Optional. 16771 * @property {?number} minFontSizeFactor How much to scale defaultFontSize by to derive minimumFontSize. Optional. 16772 * @property {?string} minFontSize The smallest a calculated font size may be. Optional. 16773 */ 16774 16775 /** 16776 * Returns a font-size value based on a given font-size preset. 16777 * Takes into account fluid typography parameters and attempts to return a css formula depending on available, valid values. 16778 * 16779 * The Core PHP equivalent is wp_get_typography_font_size_value(). 16780 * 16781 * @param {Preset} preset 16782 * @param {Object} settings 16783 * @param {boolean|TypographySettings} settings.typography.fluid Whether fluid typography is enabled, and, optionally, fluid font size options. 16784 * @param {Object?} settings.typography.layout Layout options. 16785 * 16786 * @return {string|*} A font-size value or the value of preset.size. 16787 */ 16788 function getTypographyFontSizeValue(preset, settings) { 16789 const { 16790 size: defaultSize 16791 } = preset; 16792 16793 /* 16794 * Catch falsy values and 0/'0'. Fluid calculations cannot be performed on `0`. 16795 * Also return early when a preset font size explicitly disables fluid typography with `false`. 16796 */ 16797 if (!defaultSize || '0' === defaultSize || false === preset?.fluid) { 16798 return defaultSize; 16799 } 16800 16801 /* 16802 * Return early when fluid typography is disabled in the settings, and there 16803 * are no local settings to enable it for the individual preset. 16804 * 16805 * If this condition isn't met, either the settings or individual preset settings 16806 * have enabled fluid typography. 16807 */ 16808 if (!isFluidTypographyEnabled(settings?.typography) && !isFluidTypographyEnabled(preset)) { 16809 return defaultSize; 16810 } 16811 let fluidTypographySettings = getFluidTypographyOptionsFromSettings(settings); 16812 fluidTypographySettings = typeof fluidTypographySettings?.fluid === 'object' ? fluidTypographySettings?.fluid : {}; 16813 const fluidFontSizeValue = getComputedFluidTypographyValue({ 16814 minimumFontSize: preset?.fluid?.min, 16815 maximumFontSize: preset?.fluid?.max, 16816 fontSize: defaultSize, 16817 minimumFontSizeLimit: fluidTypographySettings?.minFontSize, 16818 maximumViewportWidth: fluidTypographySettings?.maxViewportWidth, 16819 minimumViewportWidth: fluidTypographySettings?.minViewportWidth 16820 }); 16821 if (!!fluidFontSizeValue) { 16822 return fluidFontSizeValue; 16823 } 16824 return defaultSize; 16825 } 16826 function isFluidTypographyEnabled(typographySettings) { 16827 const fluidSettings = typographySettings?.fluid; 16828 return true === fluidSettings || fluidSettings && typeof fluidSettings === 'object' && Object.keys(fluidSettings).length > 0; 16829 } 16830 16831 /** 16832 * Returns fluid typography settings from theme.json setting object. 16833 * 16834 * @param {Object} settings Theme.json settings 16835 * @param {Object} settings.typography Theme.json typography settings 16836 * @param {Object} settings.layout Theme.json layout settings 16837 * @return {TypographySettings} Fluid typography settings 16838 */ 16839 function getFluidTypographyOptionsFromSettings(settings) { 16840 const typographySettings = settings?.typography; 16841 const layoutSettings = settings?.layout; 16842 const defaultMaxViewportWidth = getTypographyValueAndUnit(layoutSettings?.wideSize) ? layoutSettings?.wideSize : null; 16843 return isFluidTypographyEnabled(typographySettings) && defaultMaxViewportWidth ? { 16844 fluid: { 16845 maxViewportWidth: defaultMaxViewportWidth, 16846 ...typographySettings.fluid 16847 } 16848 } : { 16849 fluid: typographySettings?.fluid 16850 }; 16851 } 16852 16853 /** 16854 * Returns an object of merged font families and the font faces from the selected font family 16855 * based on the theme.json settings object and the currently selected font family. 16856 * 16857 * @param {Object} settings Theme.json settings. 16858 * @param {string} selectedFontFamily Decoded font family string. 16859 * @return {Object} Merged font families and font faces from the selected font family. 16860 */ 16861 function getMergedFontFamiliesAndFontFamilyFaces(settings, selectedFontFamily) { 16862 var _fontFamilies$find$fo; 16863 const fontFamiliesFromSettings = settings?.typography?.fontFamilies; 16864 const fontFamilies = ['default', 'theme', 'custom'].flatMap(key => { 16865 var _fontFamiliesFromSett; 16866 return (_fontFamiliesFromSett = fontFamiliesFromSettings?.[key]) !== null && _fontFamiliesFromSett !== void 0 ? _fontFamiliesFromSett : []; 16867 }); 16868 const fontFamilyFaces = (_fontFamilies$find$fo = fontFamilies.find(family => family.fontFamily === selectedFontFamily)?.fontFace) !== null && _fontFamilies$find$fo !== void 0 ? _fontFamilies$find$fo : []; 16869 return { 16870 fontFamilies, 16871 fontFamilyFaces 16872 }; 16873 } 16874 16875 /** 16876 * Returns the nearest font weight value from the available font weight list based on the new font weight. 16877 * The nearest font weight is the one with the smallest difference from the new font weight. 16878 * 16879 * @param {Array} availableFontWeights Array of available font weights. 16880 * @param {string} newFontWeightValue New font weight value. 16881 * @return {string} Nearest font weight. 16882 */ 16883 function findNearestFontWeight(availableFontWeights, newFontWeightValue) { 16884 newFontWeightValue = 'number' === typeof newFontWeightValue ? newFontWeightValue.toString() : newFontWeightValue; 16885 if (!newFontWeightValue || typeof newFontWeightValue !== 'string') { 16886 return ''; 16887 } 16888 if (!availableFontWeights || availableFontWeights.length === 0) { 16889 return newFontWeightValue; 16890 } 16891 const nearestFontWeight = availableFontWeights?.reduce((nearest, { 16892 value: fw 16893 }) => { 16894 const currentDiff = Math.abs(parseInt(fw) - parseInt(newFontWeightValue)); 16895 const nearestDiff = Math.abs(parseInt(nearest) - parseInt(newFontWeightValue)); 16896 return currentDiff < nearestDiff ? fw : nearest; 16897 }, availableFontWeights[0]?.value); 16898 return nearestFontWeight; 16899 } 16900 16901 /** 16902 * Returns the nearest font style based on the new font style. 16903 * Defaults to an empty string if the new font style is not valid or available. 16904 * 16905 * @param {Array} availableFontStyles Array of available font weights. 16906 * @param {string} newFontStyleValue New font style value. 16907 * @return {string} Nearest font style or an empty string. 16908 */ 16909 function findNearestFontStyle(availableFontStyles, newFontStyleValue) { 16910 if (typeof newFontStyleValue !== 'string' || !newFontStyleValue) { 16911 return ''; 16912 } 16913 const validStyles = ['normal', 'italic', 'oblique']; 16914 if (!validStyles.includes(newFontStyleValue)) { 16915 return ''; 16916 } 16917 if (!availableFontStyles || availableFontStyles.length === 0 || availableFontStyles.find(style => style.value === newFontStyleValue)) { 16918 return newFontStyleValue; 16919 } 16920 if (newFontStyleValue === 'oblique' && !availableFontStyles.find(style => style.value === 'oblique')) { 16921 return 'italic'; 16922 } 16923 return ''; 16924 } 16925 16926 /** 16927 * Returns the nearest font style and weight based on the available font family faces and the new font style and weight. 16928 * 16929 * @param {Array} fontFamilyFaces Array of available font family faces. 16930 * @param {string} fontStyle New font style. Defaults to previous value. 16931 * @param {string} fontWeight New font weight. Defaults to previous value. 16932 * @return {Object} Nearest font style and font weight. 16933 */ 16934 function findNearestStyleAndWeight(fontFamilyFaces, fontStyle, fontWeight) { 16935 let nearestFontStyle = fontStyle; 16936 let nearestFontWeight = fontWeight; 16937 const { 16938 fontStyles, 16939 fontWeights, 16940 combinedStyleAndWeightOptions 16941 } = getFontStylesAndWeights(fontFamilyFaces); 16942 16943 // Check if the new font style and weight are available in the font family faces. 16944 const hasFontStyle = fontStyles?.some(({ 16945 value: fs 16946 }) => fs === fontStyle); 16947 const hasFontWeight = fontWeights?.some(({ 16948 value: fw 16949 }) => fw?.toString() === fontWeight?.toString()); 16950 if (!hasFontStyle) { 16951 /* 16952 * Default to italic if oblique is not available. 16953 * Or find the nearest font style based on the nearest font weight. 16954 */ 16955 nearestFontStyle = fontStyle ? findNearestFontStyle(fontStyles, fontStyle) : combinedStyleAndWeightOptions?.find(option => option.style.fontWeight === findNearestFontWeight(fontWeights, fontWeight))?.style?.fontStyle; 16956 } 16957 if (!hasFontWeight) { 16958 /* 16959 * Find the nearest font weight based on available weights. 16960 * Or find the nearest font weight based on the nearest font style. 16961 */ 16962 nearestFontWeight = fontWeight ? findNearestFontWeight(fontWeights, fontWeight) : combinedStyleAndWeightOptions?.find(option => option.style.fontStyle === (nearestFontStyle || fontStyle))?.style?.fontWeight; 16963 } 16964 return { 16965 nearestFontStyle, 16966 nearestFontWeight 16967 }; 16968 } 16969 16970 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/utils.js 16971 /** 16972 * External dependencies 16973 */ 16974 16975 16976 /** 16977 * WordPress dependencies 16978 */ 16979 16980 16981 16982 /** 16983 * Internal dependencies 16984 */ 16985 16986 16987 16988 /* Supporting data. */ 16989 const ROOT_BLOCK_SELECTOR = 'body'; 16990 const ROOT_CSS_PROPERTIES_SELECTOR = ':root'; 16991 const PRESET_METADATA = [{ 16992 path: ['color', 'palette'], 16993 valueKey: 'color', 16994 cssVarInfix: 'color', 16995 classes: [{ 16996 classSuffix: 'color', 16997 propertyName: 'color' 16998 }, { 16999 classSuffix: 'background-color', 17000 propertyName: 'background-color' 17001 }, { 17002 classSuffix: 'border-color', 17003 propertyName: 'border-color' 17004 }] 17005 }, { 17006 path: ['color', 'gradients'], 17007 valueKey: 'gradient', 17008 cssVarInfix: 'gradient', 17009 classes: [{ 17010 classSuffix: 'gradient-background', 17011 propertyName: 'background' 17012 }] 17013 }, { 17014 path: ['color', 'duotone'], 17015 valueKey: 'colors', 17016 cssVarInfix: 'duotone', 17017 valueFunc: ({ 17018 slug 17019 }) => `url( '#wp-duotone-$slug}' )`, 17020 classes: [] 17021 }, { 17022 path: ['shadow', 'presets'], 17023 valueKey: 'shadow', 17024 cssVarInfix: 'shadow', 17025 classes: [] 17026 }, { 17027 path: ['typography', 'fontSizes'], 17028 valueFunc: (preset, settings) => getTypographyFontSizeValue(preset, settings), 17029 valueKey: 'size', 17030 cssVarInfix: 'font-size', 17031 classes: [{ 17032 classSuffix: 'font-size', 17033 propertyName: 'font-size' 17034 }] 17035 }, { 17036 path: ['typography', 'fontFamilies'], 17037 valueKey: 'fontFamily', 17038 cssVarInfix: 'font-family', 17039 classes: [{ 17040 classSuffix: 'font-family', 17041 propertyName: 'font-family' 17042 }] 17043 }, { 17044 path: ['spacing', 'spacingSizes'], 17045 valueKey: 'size', 17046 cssVarInfix: 'spacing', 17047 valueFunc: ({ 17048 size 17049 }) => size, 17050 classes: [] 17051 }]; 17052 const STYLE_PATH_TO_CSS_VAR_INFIX = { 17053 'color.background': 'color', 17054 'color.text': 'color', 17055 'filter.duotone': 'duotone', 17056 'elements.link.color.text': 'color', 17057 'elements.link.:hover.color.text': 'color', 17058 'elements.link.typography.fontFamily': 'font-family', 17059 'elements.link.typography.fontSize': 'font-size', 17060 'elements.button.color.text': 'color', 17061 'elements.button.color.background': 'color', 17062 'elements.caption.color.text': 'color', 17063 'elements.button.typography.fontFamily': 'font-family', 17064 'elements.button.typography.fontSize': 'font-size', 17065 'elements.heading.color': 'color', 17066 'elements.heading.color.background': 'color', 17067 'elements.heading.typography.fontFamily': 'font-family', 17068 'elements.heading.gradient': 'gradient', 17069 'elements.heading.color.gradient': 'gradient', 17070 'elements.h1.color': 'color', 17071 'elements.h1.color.background': 'color', 17072 'elements.h1.typography.fontFamily': 'font-family', 17073 'elements.h1.color.gradient': 'gradient', 17074 'elements.h2.color': 'color', 17075 'elements.h2.color.background': 'color', 17076 'elements.h2.typography.fontFamily': 'font-family', 17077 'elements.h2.color.gradient': 'gradient', 17078 'elements.h3.color': 'color', 17079 'elements.h3.color.background': 'color', 17080 'elements.h3.typography.fontFamily': 'font-family', 17081 'elements.h3.color.gradient': 'gradient', 17082 'elements.h4.color': 'color', 17083 'elements.h4.color.background': 'color', 17084 'elements.h4.typography.fontFamily': 'font-family', 17085 'elements.h4.color.gradient': 'gradient', 17086 'elements.h5.color': 'color', 17087 'elements.h5.color.background': 'color', 17088 'elements.h5.typography.fontFamily': 'font-family', 17089 'elements.h5.color.gradient': 'gradient', 17090 'elements.h6.color': 'color', 17091 'elements.h6.color.background': 'color', 17092 'elements.h6.typography.fontFamily': 'font-family', 17093 'elements.h6.color.gradient': 'gradient', 17094 'color.gradient': 'gradient', 17095 shadow: 'shadow', 17096 'typography.fontSize': 'font-size', 17097 'typography.fontFamily': 'font-family' 17098 }; 17099 17100 // A static list of block attributes that store global style preset slugs. 17101 const STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE = { 17102 'color.background': 'backgroundColor', 17103 'color.text': 'textColor', 17104 'color.gradient': 'gradient', 17105 'typography.fontSize': 'fontSize', 17106 'typography.fontFamily': 'fontFamily' 17107 }; 17108 function useToolsPanelDropdownMenuProps() { 17109 const isMobile = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 17110 return !isMobile ? { 17111 popoverProps: { 17112 placement: 'left-start', 17113 // For non-mobile, inner sidebar width (248px) - button width (24px) - border (1px) + padding (16px) + spacing (20px) 17114 offset: 259 17115 } 17116 } : {}; 17117 } 17118 function findInPresetsBy(features, blockName, presetPath, presetProperty, presetValueValue) { 17119 // Block presets take priority above root level presets. 17120 const orderedPresetsByOrigin = [getValueFromObjectPath(features, ['blocks', blockName, ...presetPath]), getValueFromObjectPath(features, presetPath)]; 17121 for (const presetByOrigin of orderedPresetsByOrigin) { 17122 if (presetByOrigin) { 17123 // Preset origins ordered by priority. 17124 const origins = ['custom', 'theme', 'default']; 17125 for (const origin of origins) { 17126 const presets = presetByOrigin[origin]; 17127 if (presets) { 17128 const presetObject = presets.find(preset => preset[presetProperty] === presetValueValue); 17129 if (presetObject) { 17130 if (presetProperty === 'slug') { 17131 return presetObject; 17132 } 17133 // If there is a highest priority preset with the same slug but different value the preset we found was overwritten and should be ignored. 17134 const highestPresetObjectWithSameSlug = findInPresetsBy(features, blockName, presetPath, 'slug', presetObject.slug); 17135 if (highestPresetObjectWithSameSlug[presetProperty] === presetObject[presetProperty]) { 17136 return presetObject; 17137 } 17138 return undefined; 17139 } 17140 } 17141 } 17142 } 17143 } 17144 } 17145 function getPresetVariableFromValue(features, blockName, variableStylePath, presetPropertyValue) { 17146 if (!presetPropertyValue) { 17147 return presetPropertyValue; 17148 } 17149 const cssVarInfix = STYLE_PATH_TO_CSS_VAR_INFIX[variableStylePath]; 17150 const metadata = PRESET_METADATA.find(data => data.cssVarInfix === cssVarInfix); 17151 if (!metadata) { 17152 // The property doesn't have preset data 17153 // so the value should be returned as it is. 17154 return presetPropertyValue; 17155 } 17156 const { 17157 valueKey, 17158 path 17159 } = metadata; 17160 const presetObject = findInPresetsBy(features, blockName, path, valueKey, presetPropertyValue); 17161 if (!presetObject) { 17162 // Value wasn't found in the presets, 17163 // so it must be a custom value. 17164 return presetPropertyValue; 17165 } 17166 return `var:preset|$cssVarInfix}|$presetObject.slug}`; 17167 } 17168 function getValueFromPresetVariable(features, blockName, variable, [presetType, slug]) { 17169 const metadata = PRESET_METADATA.find(data => data.cssVarInfix === presetType); 17170 if (!metadata) { 17171 return variable; 17172 } 17173 const presetObject = findInPresetsBy(features.settings, blockName, metadata.path, 'slug', slug); 17174 if (presetObject) { 17175 const { 17176 valueKey 17177 } = metadata; 17178 const result = presetObject[valueKey]; 17179 return getValueFromVariable(features, blockName, result); 17180 } 17181 return variable; 17182 } 17183 function getValueFromCustomVariable(features, blockName, variable, path) { 17184 var _getValueFromObjectPa; 17185 const result = (_getValueFromObjectPa = getValueFromObjectPath(features.settings, ['blocks', blockName, 'custom', ...path])) !== null && _getValueFromObjectPa !== void 0 ? _getValueFromObjectPa : getValueFromObjectPath(features.settings, ['custom', ...path]); 17186 if (!result) { 17187 return variable; 17188 } 17189 // A variable may reference another variable so we need recursion until we find the value. 17190 return getValueFromVariable(features, blockName, result); 17191 } 17192 17193 /** 17194 * Attempts to fetch the value of a theme.json CSS variable. 17195 * 17196 * @param {Object} features GlobalStylesContext config, e.g., user, base or merged. Represents the theme.json tree. 17197 * @param {string} blockName The name of a block as represented in the styles property. E.g., 'root' for root-level, and 'core/${blockName}' for blocks. 17198 * @param {string|*} variable An incoming style value. A CSS var value is expected, but it could be any value. 17199 * @return {string|*|{ref}} The value of the CSS var, if found. If not found, the passed variable argument. 17200 */ 17201 function getValueFromVariable(features, blockName, variable) { 17202 if (!variable || typeof variable !== 'string') { 17203 if (typeof variable?.ref === 'string') { 17204 variable = getValueFromObjectPath(features, variable.ref); 17205 // Presence of another ref indicates a reference to another dynamic value. 17206 // Pointing to another dynamic value is not supported. 17207 if (!variable || !!variable?.ref) { 17208 return variable; 17209 } 17210 } else { 17211 return variable; 17212 } 17213 } 17214 const USER_VALUE_PREFIX = 'var:'; 17215 const THEME_VALUE_PREFIX = 'var(--wp--'; 17216 const THEME_VALUE_SUFFIX = ')'; 17217 let parsedVar; 17218 if (variable.startsWith(USER_VALUE_PREFIX)) { 17219 parsedVar = variable.slice(USER_VALUE_PREFIX.length).split('|'); 17220 } else if (variable.startsWith(THEME_VALUE_PREFIX) && variable.endsWith(THEME_VALUE_SUFFIX)) { 17221 parsedVar = variable.slice(THEME_VALUE_PREFIX.length, -THEME_VALUE_SUFFIX.length).split('--'); 17222 } else { 17223 // We don't know how to parse the value: either is raw of uses complex CSS such as `calc(1px * var(--wp--variable) )` 17224 return variable; 17225 } 17226 const [type, ...path] = parsedVar; 17227 if (type === 'preset') { 17228 return getValueFromPresetVariable(features, blockName, variable, path); 17229 } 17230 if (type === 'custom') { 17231 return getValueFromCustomVariable(features, blockName, variable, path); 17232 } 17233 return variable; 17234 } 17235 17236 /** 17237 * Function that scopes a selector with another one. This works a bit like 17238 * SCSS nesting except the `&` operator isn't supported. 17239 * 17240 * @example 17241 * ```js 17242 * const scope = '.a, .b .c'; 17243 * const selector = '> .x, .y'; 17244 * const merged = scopeSelector( scope, selector ); 17245 * // merged is '.a > .x, .a .y, .b .c > .x, .b .c .y' 17246 * ``` 17247 * 17248 * @param {string} scope Selector to scope to. 17249 * @param {string} selector Original selector. 17250 * 17251 * @return {string} Scoped selector. 17252 */ 17253 function scopeSelector(scope, selector) { 17254 if (!scope || !selector) { 17255 return selector; 17256 } 17257 const scopes = scope.split(','); 17258 const selectors = selector.split(','); 17259 const selectorsScoped = []; 17260 scopes.forEach(outer => { 17261 selectors.forEach(inner => { 17262 selectorsScoped.push(`$outer.trim()} $inner.trim()}`); 17263 }); 17264 }); 17265 return selectorsScoped.join(', '); 17266 } 17267 17268 /** 17269 * Scopes a collection of selectors for features and subfeatures. 17270 * 17271 * @example 17272 * ```js 17273 * const scope = '.custom-scope'; 17274 * const selectors = { 17275 * color: '.wp-my-block p', 17276 * typography: { fontSize: '.wp-my-block caption' }, 17277 * }; 17278 * const result = scopeFeatureSelector( scope, selectors ); 17279 * // result is { 17280 * // color: '.custom-scope .wp-my-block p', 17281 * // typography: { fonSize: '.custom-scope .wp-my-block caption' }, 17282 * // } 17283 * ``` 17284 * 17285 * @param {string} scope Selector to scope collection of selectors with. 17286 * @param {Object} selectors Collection of feature selectors e.g. 17287 * 17288 * @return {Object|undefined} Scoped collection of feature selectors. 17289 */ 17290 function scopeFeatureSelectors(scope, selectors) { 17291 if (!scope || !selectors) { 17292 return; 17293 } 17294 const featureSelectors = {}; 17295 Object.entries(selectors).forEach(([feature, selector]) => { 17296 if (typeof selector === 'string') { 17297 featureSelectors[feature] = scopeSelector(scope, selector); 17298 } 17299 if (typeof selector === 'object') { 17300 featureSelectors[feature] = {}; 17301 Object.entries(selector).forEach(([subfeature, subfeatureSelector]) => { 17302 featureSelectors[feature][subfeature] = scopeSelector(scope, subfeatureSelector); 17303 }); 17304 } 17305 }); 17306 return featureSelectors; 17307 } 17308 17309 /** 17310 * Appends a sub-selector to an existing one. 17311 * 17312 * Given the compounded `selector` "h1, h2, h3" 17313 * and the `toAppend` selector ".some-class" the result will be 17314 * "h1.some-class, h2.some-class, h3.some-class". 17315 * 17316 * @param {string} selector Original selector. 17317 * @param {string} toAppend Selector to append. 17318 * 17319 * @return {string} The new selector. 17320 */ 17321 function appendToSelector(selector, toAppend) { 17322 if (!selector.includes(',')) { 17323 return selector + toAppend; 17324 } 17325 const selectors = selector.split(','); 17326 const newSelectors = selectors.map(sel => sel + toAppend); 17327 return newSelectors.join(','); 17328 } 17329 17330 /** 17331 * Compares global style variations according to their styles and settings properties. 17332 * 17333 * @example 17334 * ```js 17335 * const globalStyles = { styles: { typography: { fontSize: '10px' } }, settings: {} }; 17336 * const variation = { styles: { typography: { fontSize: '10000px' } }, settings: {} }; 17337 * const isEqual = areGlobalStyleConfigsEqual( globalStyles, variation ); 17338 * // false 17339 * ``` 17340 * 17341 * @param {Object} original A global styles object. 17342 * @param {Object} variation A global styles object. 17343 * 17344 * @return {boolean} Whether `original` and `variation` match. 17345 */ 17346 function areGlobalStyleConfigsEqual(original, variation) { 17347 if (typeof original !== 'object' || typeof variation !== 'object') { 17348 return original === variation; 17349 } 17350 return es6_default()(original?.styles, variation?.styles) && es6_default()(original?.settings, variation?.settings); 17351 } 17352 17353 /** 17354 * Generates the selector for a block style variation by creating the 17355 * appropriate CSS class and adding it to the ancestor portion of the block's 17356 * selector. 17357 * 17358 * For example, take the Button block which has a compound selector: 17359 * `.wp-block-button .wp-block-button__link`. With a variation named 'custom', 17360 * the class `.is-style-custom` should be added to the `.wp-block-button` 17361 * ancestor only. 17362 * 17363 * This function will take into account comma separated and complex selectors. 17364 * 17365 * @param {string} variation Name for the variation. 17366 * @param {string} blockSelector CSS selector for the block. 17367 * 17368 * @return {string} CSS selector for the block style variation. 17369 */ 17370 function getBlockStyleVariationSelector(variation, blockSelector) { 17371 const variationClass = `.is-style-$variation}`; 17372 if (!blockSelector) { 17373 return variationClass; 17374 } 17375 const ancestorRegex = /((?::\([^)]+\))?\s*)([^\s:]+)/; 17376 const addVariationClass = (_match, group1, group2) => { 17377 return group1 + group2 + variationClass; 17378 }; 17379 const result = blockSelector.split(',').map(part => part.replace(ancestorRegex, addVariationClass)); 17380 return result.join(','); 17381 } 17382 17383 /** 17384 * Looks up a theme file URI based on a relative path. 17385 * 17386 * @param {string} file A relative path. 17387 * @param {Array<Object>} themeFileURIs A collection of absolute theme file URIs and their corresponding file paths. 17388 * @return {string} A resolved theme file URI, if one is found in the themeFileURIs collection. 17389 */ 17390 function getResolvedThemeFilePath(file, themeFileURIs) { 17391 if (!file || !themeFileURIs || !Array.isArray(themeFileURIs)) { 17392 return file; 17393 } 17394 const uri = themeFileURIs.find(themeFileUri => themeFileUri?.name === file); 17395 if (!uri?.href) { 17396 return file; 17397 } 17398 return uri?.href; 17399 } 17400 17401 /** 17402 * Resolves ref values in theme JSON. 17403 * 17404 * @param {Object|string} ruleValue A block style value that may contain a reference to a theme.json value. 17405 * @param {Object} tree A theme.json object. 17406 * @return {*} The resolved value or incoming ruleValue. 17407 */ 17408 function getResolvedRefValue(ruleValue, tree) { 17409 if (!ruleValue || !tree) { 17410 return ruleValue; 17411 } 17412 17413 /* 17414 * Where the rule value is an object with a 'ref' property pointing 17415 * to a path, this converts that path into the value at that path. 17416 * For example: { "ref": "style.color.background" } => "#fff". 17417 */ 17418 if (typeof ruleValue !== 'string' && ruleValue?.ref) { 17419 const resolvedRuleValue = (0,external_wp_styleEngine_namespaceObject.getCSSValueFromRawStyle)(getValueFromObjectPath(tree, ruleValue.ref)); 17420 17421 /* 17422 * Presence of another ref indicates a reference to another dynamic value. 17423 * Pointing to another dynamic value is not supported. 17424 */ 17425 if (resolvedRuleValue?.ref) { 17426 return undefined; 17427 } 17428 if (resolvedRuleValue === undefined) { 17429 return ruleValue; 17430 } 17431 return resolvedRuleValue; 17432 } 17433 return ruleValue; 17434 } 17435 17436 /** 17437 * Resolves ref and relative path values in theme JSON. 17438 * 17439 * @param {Object|string} ruleValue A block style value that may contain a reference to a theme.json value. 17440 * @param {Object} tree A theme.json object. 17441 * @return {*} The resolved value or incoming ruleValue. 17442 */ 17443 function getResolvedValue(ruleValue, tree) { 17444 if (!ruleValue || !tree) { 17445 return ruleValue; 17446 } 17447 17448 // Resolve ref values. 17449 const resolvedValue = getResolvedRefValue(ruleValue, tree); 17450 17451 // Resolve relative paths. 17452 if (resolvedValue?.url) { 17453 resolvedValue.url = getResolvedThemeFilePath(resolvedValue.url, tree?._links?.['wp:theme-file']); 17454 } 17455 return resolvedValue; 17456 } 17457 17458 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/context.js 17459 /** 17460 * WordPress dependencies 17461 */ 17462 17463 const DEFAULT_GLOBAL_STYLES_CONTEXT = { 17464 user: {}, 17465 base: {}, 17466 merged: {}, 17467 setUserConfig: () => {} 17468 }; 17469 const GlobalStylesContext = (0,external_wp_element_namespaceObject.createContext)(DEFAULT_GLOBAL_STYLES_CONTEXT); 17470 17471 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/hooks.js 17472 /** 17473 * External dependencies 17474 */ 17475 17476 17477 /** 17478 * WordPress dependencies 17479 */ 17480 17481 17482 17483 17484 17485 /** 17486 * Internal dependencies 17487 */ 17488 17489 17490 17491 17492 const EMPTY_CONFIG = { 17493 settings: {}, 17494 styles: {} 17495 }; 17496 const VALID_SETTINGS = ['appearanceTools', 'useRootPaddingAwareAlignments', 'background.backgroundImage', 'background.backgroundRepeat', 'background.backgroundSize', 'background.backgroundPosition', 'border.color', 'border.radius', 'border.style', 'border.width', 'shadow.presets', 'shadow.defaultPresets', 'color.background', 'color.button', 'color.caption', 'color.custom', 'color.customDuotone', 'color.customGradient', 'color.defaultDuotone', 'color.defaultGradients', 'color.defaultPalette', 'color.duotone', 'color.gradients', 'color.heading', 'color.link', 'color.palette', 'color.text', 'custom', 'dimensions.aspectRatio', 'dimensions.minHeight', 'layout.contentSize', 'layout.definitions', 'layout.wideSize', 'lightbox.enabled', 'lightbox.allowEditing', 'position.fixed', 'position.sticky', 'spacing.customSpacingSize', 'spacing.defaultSpacingSizes', 'spacing.spacingSizes', 'spacing.spacingScale', 'spacing.blockGap', 'spacing.margin', 'spacing.padding', 'spacing.units', 'typography.fluid', 'typography.customFontSize', 'typography.defaultFontSizes', 'typography.dropCap', 'typography.fontFamilies', 'typography.fontSizes', 'typography.fontStyle', 'typography.fontWeight', 'typography.letterSpacing', 'typography.lineHeight', 'typography.textAlign', 'typography.textColumns', 'typography.textDecoration', 'typography.textTransform', 'typography.writingMode']; 17497 const useGlobalStylesReset = () => { 17498 const { 17499 user, 17500 setUserConfig 17501 } = (0,external_wp_element_namespaceObject.useContext)(GlobalStylesContext); 17502 const config = { 17503 settings: user.settings, 17504 styles: user.styles 17505 }; 17506 const canReset = !!config && !es6_default()(config, EMPTY_CONFIG); 17507 return [canReset, (0,external_wp_element_namespaceObject.useCallback)(() => setUserConfig(EMPTY_CONFIG), [setUserConfig])]; 17508 }; 17509 function useGlobalSetting(propertyPath, blockName, source = 'all') { 17510 const { 17511 setUserConfig, 17512 ...configs 17513 } = (0,external_wp_element_namespaceObject.useContext)(GlobalStylesContext); 17514 const appendedBlockPath = blockName ? '.blocks.' + blockName : ''; 17515 const appendedPropertyPath = propertyPath ? '.' + propertyPath : ''; 17516 const contextualPath = `settings$appendedBlockPath}$appendedPropertyPath}`; 17517 const globalPath = `settings$appendedPropertyPath}`; 17518 const sourceKey = source === 'all' ? 'merged' : source; 17519 const settingValue = (0,external_wp_element_namespaceObject.useMemo)(() => { 17520 const configToUse = configs[sourceKey]; 17521 if (!configToUse) { 17522 throw 'Unsupported source'; 17523 } 17524 if (propertyPath) { 17525 var _getValueFromObjectPa; 17526 return (_getValueFromObjectPa = getValueFromObjectPath(configToUse, contextualPath)) !== null && _getValueFromObjectPa !== void 0 ? _getValueFromObjectPa : getValueFromObjectPath(configToUse, globalPath); 17527 } 17528 let result = {}; 17529 VALID_SETTINGS.forEach(setting => { 17530 var _getValueFromObjectPa2; 17531 const value = (_getValueFromObjectPa2 = getValueFromObjectPath(configToUse, `settings$appendedBlockPath}.$setting}`)) !== null && _getValueFromObjectPa2 !== void 0 ? _getValueFromObjectPa2 : getValueFromObjectPath(configToUse, `settings.$setting}`); 17532 if (value !== undefined) { 17533 result = setImmutably(result, setting.split('.'), value); 17534 } 17535 }); 17536 return result; 17537 }, [configs, sourceKey, propertyPath, contextualPath, globalPath, appendedBlockPath]); 17538 const setSetting = newValue => { 17539 setUserConfig(currentConfig => setImmutably(currentConfig, contextualPath.split('.'), newValue)); 17540 }; 17541 return [settingValue, setSetting]; 17542 } 17543 function useGlobalStyle(path, blockName, source = 'all', { 17544 shouldDecodeEncode = true 17545 } = {}) { 17546 const { 17547 merged: mergedConfig, 17548 base: baseConfig, 17549 user: userConfig, 17550 setUserConfig 17551 } = (0,external_wp_element_namespaceObject.useContext)(GlobalStylesContext); 17552 const appendedPath = path ? '.' + path : ''; 17553 const finalPath = !blockName ? `styles$appendedPath}` : `styles.blocks.$blockName}$appendedPath}`; 17554 const setStyle = newValue => { 17555 setUserConfig(currentConfig => setImmutably(currentConfig, finalPath.split('.'), shouldDecodeEncode ? getPresetVariableFromValue(mergedConfig.settings, blockName, path, newValue) : newValue)); 17556 }; 17557 let rawResult, result; 17558 switch (source) { 17559 case 'all': 17560 rawResult = getValueFromObjectPath(mergedConfig, finalPath); 17561 result = shouldDecodeEncode ? getValueFromVariable(mergedConfig, blockName, rawResult) : rawResult; 17562 break; 17563 case 'user': 17564 rawResult = getValueFromObjectPath(userConfig, finalPath); 17565 result = shouldDecodeEncode ? getValueFromVariable(mergedConfig, blockName, rawResult) : rawResult; 17566 break; 17567 case 'base': 17568 rawResult = getValueFromObjectPath(baseConfig, finalPath); 17569 result = shouldDecodeEncode ? getValueFromVariable(baseConfig, blockName, rawResult) : rawResult; 17570 break; 17571 default: 17572 throw 'Unsupported source'; 17573 } 17574 return [result, setStyle]; 17575 } 17576 17577 /** 17578 * React hook that overrides a global settings object with block and element specific settings. 17579 * 17580 * @param {Object} parentSettings Settings object. 17581 * @param {blockName?} blockName Block name. 17582 * @param {element?} element Element name. 17583 * 17584 * @return {Object} Merge of settings and supports. 17585 */ 17586 function useSettingsForBlockElement(parentSettings, blockName, element) { 17587 const { 17588 supportedStyles, 17589 supports 17590 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 17591 return { 17592 supportedStyles: unlock(select(external_wp_blocks_namespaceObject.store)).getSupportedStyles(blockName, element), 17593 supports: select(external_wp_blocks_namespaceObject.store).getBlockType(blockName)?.supports 17594 }; 17595 }, [blockName, element]); 17596 return (0,external_wp_element_namespaceObject.useMemo)(() => { 17597 const updatedSettings = { 17598 ...parentSettings 17599 }; 17600 if (!supportedStyles.includes('fontSize')) { 17601 updatedSettings.typography = { 17602 ...updatedSettings.typography, 17603 fontSizes: {}, 17604 customFontSize: false, 17605 defaultFontSizes: false 17606 }; 17607 } 17608 if (!supportedStyles.includes('fontFamily')) { 17609 updatedSettings.typography = { 17610 ...updatedSettings.typography, 17611 fontFamilies: {} 17612 }; 17613 } 17614 updatedSettings.color = { 17615 ...updatedSettings.color, 17616 text: updatedSettings.color?.text && supportedStyles.includes('color'), 17617 background: updatedSettings.color?.background && (supportedStyles.includes('background') || supportedStyles.includes('backgroundColor')), 17618 button: updatedSettings.color?.button && supportedStyles.includes('buttonColor'), 17619 heading: updatedSettings.color?.heading && supportedStyles.includes('headingColor'), 17620 link: updatedSettings.color?.link && supportedStyles.includes('linkColor'), 17621 caption: updatedSettings.color?.caption && supportedStyles.includes('captionColor') 17622 }; 17623 17624 // Some blocks can enable background colors but disable gradients. 17625 if (!supportedStyles.includes('background')) { 17626 updatedSettings.color.gradients = []; 17627 updatedSettings.color.customGradient = false; 17628 } 17629 17630 // If filters are not supported by the block/element, disable duotone. 17631 if (!supportedStyles.includes('filter')) { 17632 updatedSettings.color.defaultDuotone = false; 17633 updatedSettings.color.customDuotone = false; 17634 } 17635 ['lineHeight', 'fontStyle', 'fontWeight', 'letterSpacing', 'textAlign', 'textTransform', 'textDecoration', 'writingMode'].forEach(key => { 17636 if (!supportedStyles.includes(key)) { 17637 updatedSettings.typography = { 17638 ...updatedSettings.typography, 17639 [key]: false 17640 }; 17641 } 17642 }); 17643 17644 // The column-count style is named text column to reduce confusion with 17645 // the columns block and manage expectations from the support. 17646 // See: https://github.com/WordPress/gutenberg/pull/33587 17647 if (!supportedStyles.includes('columnCount')) { 17648 updatedSettings.typography = { 17649 ...updatedSettings.typography, 17650 textColumns: false 17651 }; 17652 } 17653 ['contentSize', 'wideSize'].forEach(key => { 17654 if (!supportedStyles.includes(key)) { 17655 updatedSettings.layout = { 17656 ...updatedSettings.layout, 17657 [key]: false 17658 }; 17659 } 17660 }); 17661 ['padding', 'margin', 'blockGap'].forEach(key => { 17662 if (!supportedStyles.includes(key)) { 17663 updatedSettings.spacing = { 17664 ...updatedSettings.spacing, 17665 [key]: false 17666 }; 17667 } 17668 const sides = Array.isArray(supports?.spacing?.[key]) ? supports?.spacing?.[key] : supports?.spacing?.[key]?.sides; 17669 // Check if spacing type is supported before adding sides. 17670 if (sides?.length && updatedSettings.spacing?.[key]) { 17671 updatedSettings.spacing = { 17672 ...updatedSettings.spacing, 17673 [key]: { 17674 ...updatedSettings.spacing?.[key], 17675 sides 17676 } 17677 }; 17678 } 17679 }); 17680 ['aspectRatio', 'minHeight'].forEach(key => { 17681 if (!supportedStyles.includes(key)) { 17682 updatedSettings.dimensions = { 17683 ...updatedSettings.dimensions, 17684 [key]: false 17685 }; 17686 } 17687 }); 17688 ['radius', 'color', 'style', 'width'].forEach(key => { 17689 if (!supportedStyles.includes('border' + key.charAt(0).toUpperCase() + key.slice(1))) { 17690 updatedSettings.border = { 17691 ...updatedSettings.border, 17692 [key]: false 17693 }; 17694 } 17695 }); 17696 ['backgroundImage', 'backgroundSize'].forEach(key => { 17697 if (!supportedStyles.includes(key)) { 17698 updatedSettings.background = { 17699 ...updatedSettings.background, 17700 [key]: false 17701 }; 17702 } 17703 }); 17704 updatedSettings.shadow = supportedStyles.includes('shadow') ? updatedSettings.shadow : false; 17705 17706 // Text alignment is only available for blocks. 17707 if (element) { 17708 updatedSettings.typography.textAlign = false; 17709 } 17710 return updatedSettings; 17711 }, [parentSettings, supportedStyles, supports, element]); 17712 } 17713 function useColorsPerOrigin(settings) { 17714 const customColors = settings?.color?.palette?.custom; 17715 const themeColors = settings?.color?.palette?.theme; 17716 const defaultColors = settings?.color?.palette?.default; 17717 const shouldDisplayDefaultColors = settings?.color?.defaultPalette; 17718 return (0,external_wp_element_namespaceObject.useMemo)(() => { 17719 const result = []; 17720 if (themeColors && themeColors.length) { 17721 result.push({ 17722 name: (0,external_wp_i18n_namespaceObject._x)('Theme', 'Indicates this palette comes from the theme.'), 17723 colors: themeColors 17724 }); 17725 } 17726 if (shouldDisplayDefaultColors && defaultColors && defaultColors.length) { 17727 result.push({ 17728 name: (0,external_wp_i18n_namespaceObject._x)('Default', 'Indicates this palette comes from WordPress.'), 17729 colors: defaultColors 17730 }); 17731 } 17732 if (customColors && customColors.length) { 17733 result.push({ 17734 name: (0,external_wp_i18n_namespaceObject._x)('Custom', 'Indicates this palette is created by the user.'), 17735 colors: customColors 17736 }); 17737 } 17738 return result; 17739 }, [customColors, themeColors, defaultColors, shouldDisplayDefaultColors]); 17740 } 17741 function useGradientsPerOrigin(settings) { 17742 const customGradients = settings?.color?.gradients?.custom; 17743 const themeGradients = settings?.color?.gradients?.theme; 17744 const defaultGradients = settings?.color?.gradients?.default; 17745 const shouldDisplayDefaultGradients = settings?.color?.defaultGradients; 17746 return (0,external_wp_element_namespaceObject.useMemo)(() => { 17747 const result = []; 17748 if (themeGradients && themeGradients.length) { 17749 result.push({ 17750 name: (0,external_wp_i18n_namespaceObject._x)('Theme', 'Indicates this palette comes from the theme.'), 17751 gradients: themeGradients 17752 }); 17753 } 17754 if (shouldDisplayDefaultGradients && defaultGradients && defaultGradients.length) { 17755 result.push({ 17756 name: (0,external_wp_i18n_namespaceObject._x)('Default', 'Indicates this palette comes from WordPress.'), 17757 gradients: defaultGradients 17758 }); 17759 } 17760 if (customGradients && customGradients.length) { 17761 result.push({ 17762 name: (0,external_wp_i18n_namespaceObject._x)('Custom', 'Indicates this palette is created by the user.'), 17763 gradients: customGradients 17764 }); 17765 } 17766 return result; 17767 }, [customGradients, themeGradients, defaultGradients, shouldDisplayDefaultGradients]); 17768 } 17769 17770 ;// CONCATENATED MODULE: ./node_modules/clsx/dist/clsx.mjs 17771 function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f)}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}/* harmony default export */ const dist_clsx = (clsx); 17772 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/utils.js 17773 /** 17774 * WordPress dependencies 17775 */ 17776 17777 17778 17779 17780 17781 17782 /** 17783 * Internal dependencies 17784 */ 17785 17786 17787 17788 17789 17790 17791 /** 17792 * External dependencies 17793 */ 17794 17795 17796 /** 17797 * Removed falsy values from nested object. 17798 * 17799 * @param {*} object 17800 * @return {*} Object cleaned from falsy values 17801 */ 17802 17803 const utils_cleanEmptyObject = object => { 17804 if (object === null || typeof object !== 'object' || Array.isArray(object)) { 17805 return object; 17806 } 17807 const cleanedNestedObjects = Object.entries(object).map(([key, value]) => [key, utils_cleanEmptyObject(value)]).filter(([, value]) => value !== undefined); 17808 return !cleanedNestedObjects.length ? undefined : Object.fromEntries(cleanedNestedObjects); 17809 }; 17810 function transformStyles(activeSupports, migrationPaths, result, source, index, results) { 17811 // If there are no active supports return early. 17812 if (Object.values(activeSupports !== null && activeSupports !== void 0 ? activeSupports : {}).every(isActive => !isActive)) { 17813 return result; 17814 } 17815 // If the condition verifies we are probably in the presence of a wrapping transform 17816 // e.g: nesting paragraphs in a group or columns and in that case the styles should not be transformed. 17817 if (results.length === 1 && result.innerBlocks.length === source.length) { 17818 return result; 17819 } 17820 // For cases where we have a transform from one block to multiple blocks 17821 // or multiple blocks to one block we apply the styles of the first source block 17822 // to the result(s). 17823 let referenceBlockAttributes = source[0]?.attributes; 17824 // If we are in presence of transform between more than one block in the source 17825 // that has more than one block in the result 17826 // we apply the styles on source N to the result N, 17827 // if source N does not exists we do nothing. 17828 if (results.length > 1 && source.length > 1) { 17829 if (source[index]) { 17830 referenceBlockAttributes = source[index]?.attributes; 17831 } else { 17832 return result; 17833 } 17834 } 17835 let returnBlock = result; 17836 Object.entries(activeSupports).forEach(([support, isActive]) => { 17837 if (isActive) { 17838 migrationPaths[support].forEach(path => { 17839 const styleValue = getValueFromObjectPath(referenceBlockAttributes, path); 17840 if (styleValue) { 17841 returnBlock = { 17842 ...returnBlock, 17843 attributes: setImmutably(returnBlock.attributes, path, styleValue) 17844 }; 17845 } 17846 }); 17847 } 17848 }); 17849 return returnBlock; 17850 } 17851 17852 /** 17853 * Check whether serialization of specific block support feature or set should 17854 * be skipped. 17855 * 17856 * @param {string|Object} blockNameOrType Block name or block type object. 17857 * @param {string} featureSet Name of block support feature set. 17858 * @param {string} feature Name of the individual feature to check. 17859 * 17860 * @return {boolean} Whether serialization should occur. 17861 */ 17862 function shouldSkipSerialization(blockNameOrType, featureSet, feature) { 17863 const support = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockNameOrType, featureSet); 17864 const skipSerialization = support?.__experimentalSkipSerialization; 17865 if (Array.isArray(skipSerialization)) { 17866 return skipSerialization.includes(feature); 17867 } 17868 return skipSerialization; 17869 } 17870 const pendingStyleOverrides = new WeakMap(); 17871 17872 /** 17873 * Override a block editor settings style. Leave the ID blank to create a new 17874 * style. 17875 * 17876 * @param {Object} override Override object. 17877 * @param {?string} override.id Id of the style override, leave blank to create 17878 * a new style. 17879 * @param {string} override.css CSS to apply. 17880 */ 17881 function useStyleOverride({ 17882 id, 17883 css 17884 }) { 17885 return usePrivateStyleOverride({ 17886 id, 17887 css 17888 }); 17889 } 17890 function usePrivateStyleOverride({ 17891 id, 17892 css, 17893 assets, 17894 __unstableType, 17895 variation, 17896 clientId 17897 } = {}) { 17898 const { 17899 setStyleOverride, 17900 deleteStyleOverride 17901 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 17902 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 17903 const fallbackId = (0,external_wp_element_namespaceObject.useId)(); 17904 (0,external_wp_element_namespaceObject.useEffect)(() => { 17905 // Unmount if there is CSS and assets are empty. 17906 if (!css && !assets) { 17907 return; 17908 } 17909 const _id = id || fallbackId; 17910 const override = { 17911 id, 17912 css, 17913 assets, 17914 __unstableType, 17915 variation, 17916 clientId 17917 }; 17918 // Batch updates to style overrides to avoid triggering cascading renders 17919 // for each style override block included in a tree and optimize initial render. 17920 if (!pendingStyleOverrides.get(registry)) { 17921 pendingStyleOverrides.set(registry, []); 17922 } 17923 pendingStyleOverrides.get(registry).push([_id, override]); 17924 window.queueMicrotask(() => { 17925 if (pendingStyleOverrides.get(registry)?.length) { 17926 registry.batch(() => { 17927 pendingStyleOverrides.get(registry).forEach(args => { 17928 setStyleOverride(...args); 17929 }); 17930 pendingStyleOverrides.set(registry, []); 17931 }); 17932 } 17933 }); 17934 return () => { 17935 const isPending = pendingStyleOverrides.get(registry)?.find(([currentId]) => currentId === _id); 17936 if (isPending) { 17937 pendingStyleOverrides.set(registry, pendingStyleOverrides.get(registry).filter(([currentId]) => currentId !== _id)); 17938 } else { 17939 deleteStyleOverride(_id); 17940 } 17941 }; 17942 }, [id, css, clientId, assets, __unstableType, fallbackId, setStyleOverride, deleteStyleOverride, registry]); 17943 } 17944 17945 /** 17946 * Based on the block and its context, returns an object of all the block settings. 17947 * This object can be passed as a prop to all the Styles UI components 17948 * (TypographyPanel, DimensionsPanel...). 17949 * 17950 * @param {string} name Block name. 17951 * @param {*} parentLayout Parent layout. 17952 * 17953 * @return {Object} Settings object. 17954 */ 17955 function useBlockSettings(name, parentLayout) { 17956 const [backgroundImage, backgroundSize, customFontFamilies, defaultFontFamilies, themeFontFamilies, defaultFontSizesEnabled, customFontSizes, defaultFontSizes, themeFontSizes, customFontSize, fontStyle, fontWeight, lineHeight, textAlign, textColumns, textDecoration, writingMode, textTransform, letterSpacing, padding, margin, blockGap, defaultSpacingSizesEnabled, customSpacingSize, userSpacingSizes, defaultSpacingSizes, themeSpacingSizes, units, aspectRatio, minHeight, layout, borderColor, borderRadius, borderStyle, borderWidth, customColorsEnabled, customColors, customDuotone, themeColors, defaultColors, defaultPalette, defaultDuotone, userDuotonePalette, themeDuotonePalette, defaultDuotonePalette, userGradientPalette, themeGradientPalette, defaultGradientPalette, defaultGradients, areCustomGradientsEnabled, isBackgroundEnabled, isLinkEnabled, isTextEnabled, isHeadingEnabled, isButtonEnabled, shadow] = use_settings_useSettings('background.backgroundImage', 'background.backgroundSize', 'typography.fontFamilies.custom', 'typography.fontFamilies.default', 'typography.fontFamilies.theme', 'typography.defaultFontSizes', 'typography.fontSizes.custom', 'typography.fontSizes.default', 'typography.fontSizes.theme', 'typography.customFontSize', 'typography.fontStyle', 'typography.fontWeight', 'typography.lineHeight', 'typography.textAlign', 'typography.textColumns', 'typography.textDecoration', 'typography.writingMode', 'typography.textTransform', 'typography.letterSpacing', 'spacing.padding', 'spacing.margin', 'spacing.blockGap', 'spacing.defaultSpacingSizes', 'spacing.customSpacingSize', 'spacing.spacingSizes.custom', 'spacing.spacingSizes.default', 'spacing.spacingSizes.theme', 'spacing.units', 'dimensions.aspectRatio', 'dimensions.minHeight', 'layout', 'border.color', 'border.radius', 'border.style', 'border.width', 'color.custom', 'color.palette.custom', 'color.customDuotone', 'color.palette.theme', 'color.palette.default', 'color.defaultPalette', 'color.defaultDuotone', 'color.duotone.custom', 'color.duotone.theme', 'color.duotone.default', 'color.gradients.custom', 'color.gradients.theme', 'color.gradients.default', 'color.defaultGradients', 'color.customGradient', 'color.background', 'color.link', 'color.text', 'color.heading', 'color.button', 'shadow'); 17957 const rawSettings = (0,external_wp_element_namespaceObject.useMemo)(() => { 17958 return { 17959 background: { 17960 backgroundImage, 17961 backgroundSize 17962 }, 17963 color: { 17964 palette: { 17965 custom: customColors, 17966 theme: themeColors, 17967 default: defaultColors 17968 }, 17969 gradients: { 17970 custom: userGradientPalette, 17971 theme: themeGradientPalette, 17972 default: defaultGradientPalette 17973 }, 17974 duotone: { 17975 custom: userDuotonePalette, 17976 theme: themeDuotonePalette, 17977 default: defaultDuotonePalette 17978 }, 17979 defaultGradients, 17980 defaultPalette, 17981 defaultDuotone, 17982 custom: customColorsEnabled, 17983 customGradient: areCustomGradientsEnabled, 17984 customDuotone, 17985 background: isBackgroundEnabled, 17986 link: isLinkEnabled, 17987 heading: isHeadingEnabled, 17988 button: isButtonEnabled, 17989 text: isTextEnabled 17990 }, 17991 typography: { 17992 fontFamilies: { 17993 custom: customFontFamilies, 17994 default: defaultFontFamilies, 17995 theme: themeFontFamilies 17996 }, 17997 fontSizes: { 17998 custom: customFontSizes, 17999 default: defaultFontSizes, 18000 theme: themeFontSizes 18001 }, 18002 customFontSize, 18003 defaultFontSizes: defaultFontSizesEnabled, 18004 fontStyle, 18005 fontWeight, 18006 lineHeight, 18007 textAlign, 18008 textColumns, 18009 textDecoration, 18010 textTransform, 18011 letterSpacing, 18012 writingMode 18013 }, 18014 spacing: { 18015 spacingSizes: { 18016 custom: userSpacingSizes, 18017 default: defaultSpacingSizes, 18018 theme: themeSpacingSizes 18019 }, 18020 customSpacingSize, 18021 defaultSpacingSizes: defaultSpacingSizesEnabled, 18022 padding, 18023 margin, 18024 blockGap, 18025 units 18026 }, 18027 border: { 18028 color: borderColor, 18029 radius: borderRadius, 18030 style: borderStyle, 18031 width: borderWidth 18032 }, 18033 dimensions: { 18034 aspectRatio, 18035 minHeight 18036 }, 18037 layout, 18038 parentLayout, 18039 shadow 18040 }; 18041 }, [backgroundImage, backgroundSize, customFontFamilies, defaultFontFamilies, themeFontFamilies, defaultFontSizesEnabled, customFontSizes, defaultFontSizes, themeFontSizes, customFontSize, fontStyle, fontWeight, lineHeight, textAlign, textColumns, textDecoration, textTransform, letterSpacing, writingMode, padding, margin, blockGap, defaultSpacingSizesEnabled, customSpacingSize, userSpacingSizes, defaultSpacingSizes, themeSpacingSizes, units, aspectRatio, minHeight, layout, parentLayout, borderColor, borderRadius, borderStyle, borderWidth, customColorsEnabled, customColors, customDuotone, themeColors, defaultColors, defaultPalette, defaultDuotone, userDuotonePalette, themeDuotonePalette, defaultDuotonePalette, userGradientPalette, themeGradientPalette, defaultGradientPalette, defaultGradients, areCustomGradientsEnabled, isBackgroundEnabled, isLinkEnabled, isTextEnabled, isHeadingEnabled, isButtonEnabled, shadow]); 18042 return useSettingsForBlockElement(rawSettings, name); 18043 } 18044 function createBlockEditFilter(features) { 18045 // We don't want block controls to re-render when typing inside a block. 18046 // `memo` will prevent re-renders unless props change, so only pass the 18047 // needed props and not the whole attributes object. 18048 features = features.map(settings => { 18049 return { 18050 ...settings, 18051 Edit: (0,external_wp_element_namespaceObject.memo)(settings.edit) 18052 }; 18053 }); 18054 const withBlockEditHooks = (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(OriginalBlockEdit => props => { 18055 const context = useBlockEditContext(); 18056 // CAUTION: code added before this line will be executed for all 18057 // blocks, not just those that support the feature! Code added 18058 // above this line should be carefully evaluated for its impact on 18059 // performance. 18060 return [...features.map((feature, i) => { 18061 const { 18062 Edit, 18063 hasSupport, 18064 attributeKeys = [], 18065 shareWithChildBlocks 18066 } = feature; 18067 const shouldDisplayControls = context[mayDisplayControlsKey] || context[mayDisplayParentControlsKey] && shareWithChildBlocks; 18068 if (!shouldDisplayControls || !hasSupport(props.name)) { 18069 return null; 18070 } 18071 const neededProps = {}; 18072 for (const key of attributeKeys) { 18073 if (props.attributes[key]) { 18074 neededProps[key] = props.attributes[key]; 18075 } 18076 } 18077 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Edit 18078 // We can use the index because the array length 18079 // is fixed per page load right now. 18080 , { 18081 name: props.name, 18082 isSelected: props.isSelected, 18083 clientId: props.clientId, 18084 setAttributes: props.setAttributes, 18085 __unstableParentLayout: props.__unstableParentLayout 18086 // This component is pure, so only pass needed 18087 // props!!! 18088 , 18089 ...neededProps 18090 }, i); 18091 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OriginalBlockEdit, { 18092 ...props 18093 }, "edit")]; 18094 }, 'withBlockEditHooks'); 18095 (0,external_wp_hooks_namespaceObject.addFilter)('editor.BlockEdit', 'core/editor/hooks', withBlockEditHooks); 18096 } 18097 function BlockProps({ 18098 index, 18099 useBlockProps, 18100 setAllWrapperProps, 18101 ...props 18102 }) { 18103 const wrapperProps = useBlockProps(props); 18104 const setWrapperProps = next => setAllWrapperProps(prev => { 18105 const nextAll = [...prev]; 18106 nextAll[index] = next; 18107 return nextAll; 18108 }); 18109 // Setting state after every render is fine because this component is 18110 // pure and will only re-render when needed props change. 18111 (0,external_wp_element_namespaceObject.useEffect)(() => { 18112 // We could shallow compare the props, but since this component only 18113 // changes when needed attributes change, the benefit is probably small. 18114 setWrapperProps(wrapperProps); 18115 return () => { 18116 setWrapperProps(undefined); 18117 }; 18118 }); 18119 return null; 18120 } 18121 const BlockPropsPure = (0,external_wp_element_namespaceObject.memo)(BlockProps); 18122 function createBlockListBlockFilter(features) { 18123 const withBlockListBlockHooks = (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(BlockListBlock => props => { 18124 const [allWrapperProps, setAllWrapperProps] = (0,external_wp_element_namespaceObject.useState)(Array(features.length).fill(undefined)); 18125 return [...features.map((feature, i) => { 18126 const { 18127 hasSupport, 18128 attributeKeys = [], 18129 useBlockProps, 18130 isMatch 18131 } = feature; 18132 const neededProps = {}; 18133 for (const key of attributeKeys) { 18134 if (props.attributes[key]) { 18135 neededProps[key] = props.attributes[key]; 18136 } 18137 } 18138 if ( 18139 // Skip rendering if none of the needed attributes are 18140 // set. 18141 !Object.keys(neededProps).length || !hasSupport(props.name) || isMatch && !isMatch(neededProps)) { 18142 return null; 18143 } 18144 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockPropsPure 18145 // We can use the index because the array length 18146 // is fixed per page load right now. 18147 , { 18148 index: i, 18149 useBlockProps: useBlockProps 18150 // This component is pure, so we must pass a stable 18151 // function reference. 18152 , 18153 setAllWrapperProps: setAllWrapperProps, 18154 name: props.name, 18155 clientId: props.clientId 18156 // This component is pure, so only pass needed 18157 // props!!! 18158 , 18159 ...neededProps 18160 }, i); 18161 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockListBlock, { 18162 ...props, 18163 wrapperProps: allWrapperProps.filter(Boolean).reduce((acc, wrapperProps) => { 18164 return { 18165 ...acc, 18166 ...wrapperProps, 18167 className: dist_clsx(acc.className, wrapperProps.className), 18168 style: { 18169 ...acc.style, 18170 ...wrapperProps.style 18171 } 18172 }; 18173 }, props.wrapperProps || {}) 18174 }, "edit")]; 18175 }, 'withBlockListBlockHooks'); 18176 (0,external_wp_hooks_namespaceObject.addFilter)('editor.BlockListBlock', 'core/editor/hooks', withBlockListBlockHooks); 18177 } 18178 function createBlockSaveFilter(features) { 18179 function extraPropsFromHooks(props, name, attributes) { 18180 return features.reduce((accu, feature) => { 18181 const { 18182 hasSupport, 18183 attributeKeys = [], 18184 addSaveProps 18185 } = feature; 18186 const neededAttributes = {}; 18187 for (const key of attributeKeys) { 18188 if (attributes[key]) { 18189 neededAttributes[key] = attributes[key]; 18190 } 18191 } 18192 if ( 18193 // Skip rendering if none of the needed attributes are 18194 // set. 18195 !Object.keys(neededAttributes).length || !hasSupport(name)) { 18196 return accu; 18197 } 18198 return addSaveProps(accu, name, neededAttributes); 18199 }, props); 18200 } 18201 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.getSaveContent.extraProps', 'core/editor/hooks', extraPropsFromHooks, 0); 18202 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.getSaveContent.extraProps', 'core/editor/hooks', props => { 18203 // Previously we had a filter deleting the className if it was an empty 18204 // string. That filter is no longer running, so now we need to delete it 18205 // here. 18206 if (props.hasOwnProperty('className') && !props.className) { 18207 delete props.className; 18208 } 18209 return props; 18210 }); 18211 } 18212 18213 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/compat.js 18214 /** 18215 * WordPress dependencies 18216 */ 18217 18218 18219 function migrateLightBlockWrapper(settings) { 18220 const { 18221 apiVersion = 1 18222 } = settings; 18223 if (apiVersion < 2 && (0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, 'lightBlockWrapper', false)) { 18224 settings.apiVersion = 2; 18225 } 18226 return settings; 18227 } 18228 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/compat/migrateLightBlockWrapper', migrateLightBlockWrapper); 18229 18230 ;// CONCATENATED MODULE: external ["wp","components"] 18231 const external_wp_components_namespaceObject = window["wp"]["components"]; 18232 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-controls/groups.js 18233 /** 18234 * WordPress dependencies 18235 */ 18236 18237 const BlockControlsDefault = (0,external_wp_components_namespaceObject.createSlotFill)('BlockControls'); 18238 const BlockControlsBlock = (0,external_wp_components_namespaceObject.createSlotFill)('BlockControlsBlock'); 18239 const BlockControlsInline = (0,external_wp_components_namespaceObject.createSlotFill)('BlockFormatControls'); 18240 const BlockControlsOther = (0,external_wp_components_namespaceObject.createSlotFill)('BlockControlsOther'); 18241 const BlockControlsParent = (0,external_wp_components_namespaceObject.createSlotFill)('BlockControlsParent'); 18242 const groups = { 18243 default: BlockControlsDefault, 18244 block: BlockControlsBlock, 18245 inline: BlockControlsInline, 18246 other: BlockControlsOther, 18247 parent: BlockControlsParent 18248 }; 18249 /* harmony default export */ const block_controls_groups = (groups); 18250 18251 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-controls/hook.js 18252 /** 18253 * WordPress dependencies 18254 */ 18255 18256 /** 18257 * Internal dependencies 18258 */ 18259 18260 18261 function useBlockControlsFill(group, shareWithChildBlocks) { 18262 const context = useBlockEditContext(); 18263 if (context[mayDisplayControlsKey]) { 18264 return block_controls_groups[group]?.Fill; 18265 } 18266 if (context[mayDisplayParentControlsKey] && shareWithChildBlocks) { 18267 return block_controls_groups.parent.Fill; 18268 } 18269 return null; 18270 } 18271 18272 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-controls/fill.js 18273 /** 18274 * WordPress dependencies 18275 */ 18276 18277 18278 /** 18279 * Internal dependencies 18280 */ 18281 18282 18283 18284 18285 function BlockControlsFill({ 18286 group = 'default', 18287 controls, 18288 children, 18289 __experimentalShareWithChildBlocks = false 18290 }) { 18291 const Fill = useBlockControlsFill(group, __experimentalShareWithChildBlocks); 18292 if (!Fill) { 18293 return null; 18294 } 18295 const innerMarkup = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 18296 children: [group === 'default' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 18297 controls: controls 18298 }), children] 18299 }); 18300 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalStyleProvider, { 18301 document: document, 18302 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Fill, { 18303 children: fillProps => { 18304 // `fillProps.forwardedContext` is an array of context provider entries, provided by slot, 18305 // that should wrap the fill markup. 18306 const { 18307 forwardedContext = [] 18308 } = fillProps; 18309 return forwardedContext.reduce((inner, [Provider, props]) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Provider, { 18310 ...props, 18311 children: inner 18312 }), innerMarkup); 18313 } 18314 }) 18315 }); 18316 } 18317 18318 ;// CONCATENATED MODULE: external ["wp","warning"] 18319 const external_wp_warning_namespaceObject = window["wp"]["warning"]; 18320 var external_wp_warning_default = /*#__PURE__*/__webpack_require__.n(external_wp_warning_namespaceObject); 18321 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-controls/slot.js 18322 /** 18323 * WordPress dependencies 18324 */ 18325 18326 18327 18328 18329 /** 18330 * Internal dependencies 18331 */ 18332 18333 18334 18335 const { 18336 ComponentsContext 18337 } = unlock(external_wp_components_namespaceObject.privateApis); 18338 function BlockControlsSlot({ 18339 group = 'default', 18340 ...props 18341 }) { 18342 const toolbarState = (0,external_wp_element_namespaceObject.useContext)(external_wp_components_namespaceObject.__experimentalToolbarContext); 18343 const contextState = (0,external_wp_element_namespaceObject.useContext)(ComponentsContext); 18344 const fillProps = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 18345 forwardedContext: [[external_wp_components_namespaceObject.__experimentalToolbarContext.Provider, { 18346 value: toolbarState 18347 }], [ComponentsContext.Provider, { 18348 value: contextState 18349 }]] 18350 }), [toolbarState, contextState]); 18351 const Slot = block_controls_groups[group]?.Slot; 18352 const fills = (0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(Slot?.__unstableName); 18353 if (!Slot) { 18354 true ? external_wp_warning_default()(`Unknown BlockControls group "$group}" provided.`) : 0; 18355 return null; 18356 } 18357 if (!fills?.length) { 18358 return null; 18359 } 18360 const slot = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Slot, { 18361 ...props, 18362 bubblesVirtually: true, 18363 fillProps: fillProps 18364 }); 18365 if (group === 'default') { 18366 return slot; 18367 } 18368 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 18369 children: slot 18370 }); 18371 } 18372 18373 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-controls/index.js 18374 /** 18375 * Internal dependencies 18376 */ 18377 18378 18379 18380 const BlockControls = BlockControlsFill; 18381 BlockControls.Slot = BlockControlsSlot; 18382 18383 // This is just here for backward compatibility. 18384 const BlockFormatControls = props => { 18385 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockControlsFill, { 18386 group: "inline", 18387 ...props 18388 }); 18389 }; 18390 BlockFormatControls.Slot = props => { 18391 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockControlsSlot, { 18392 group: "inline", 18393 ...props 18394 }); 18395 }; 18396 /* harmony default export */ const block_controls = (BlockControls); 18397 18398 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/justify-left.js 18399 /** 18400 * WordPress dependencies 18401 */ 18402 18403 18404 const justifyLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 18405 xmlns: "http://www.w3.org/2000/svg", 18406 viewBox: "0 0 24 24", 18407 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18408 d: "M9 9v6h11V9H9zM4 20h1.5V4H4v16z" 18409 }) 18410 }); 18411 /* harmony default export */ const justify_left = (justifyLeft); 18412 18413 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/justify-center.js 18414 /** 18415 * WordPress dependencies 18416 */ 18417 18418 18419 const justifyCenter = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 18420 xmlns: "http://www.w3.org/2000/svg", 18421 viewBox: "0 0 24 24", 18422 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18423 d: "M12.5 15v5H11v-5H4V9h7V4h1.5v5h7v6h-7Z" 18424 }) 18425 }); 18426 /* harmony default export */ const justify_center = (justifyCenter); 18427 18428 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/justify-right.js 18429 /** 18430 * WordPress dependencies 18431 */ 18432 18433 18434 const justifyRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 18435 xmlns: "http://www.w3.org/2000/svg", 18436 viewBox: "0 0 24 24", 18437 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18438 d: "M4 15h11V9H4v6zM18.5 4v16H20V4h-1.5z" 18439 }) 18440 }); 18441 /* harmony default export */ const justify_right = (justifyRight); 18442 18443 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/justify-space-between.js 18444 /** 18445 * WordPress dependencies 18446 */ 18447 18448 18449 const justifySpaceBetween = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 18450 xmlns: "http://www.w3.org/2000/svg", 18451 viewBox: "0 0 24 24", 18452 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18453 d: "M9 15h6V9H9v6zm-5 5h1.5V4H4v16zM18.5 4v16H20V4h-1.5z" 18454 }) 18455 }); 18456 /* harmony default export */ const justify_space_between = (justifySpaceBetween); 18457 18458 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/justify-stretch.js 18459 /** 18460 * WordPress dependencies 18461 */ 18462 18463 18464 const justifyStretch = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 18465 xmlns: "http://www.w3.org/2000/svg", 18466 viewBox: "0 0 24 24", 18467 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18468 d: "M4 4H5.5V20H4V4ZM7 10L17 10V14L7 14V10ZM20 4H18.5V20H20V4Z" 18469 }) 18470 }); 18471 /* harmony default export */ const justify_stretch = (justifyStretch); 18472 18473 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/arrow-right.js 18474 /** 18475 * WordPress dependencies 18476 */ 18477 18478 18479 const arrowRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 18480 xmlns: "http://www.w3.org/2000/svg", 18481 viewBox: "0 0 24 24", 18482 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18483 d: "m14.5 6.5-1 1 3.7 3.7H4v1.6h13.2l-3.7 3.7 1 1 5.6-5.5z" 18484 }) 18485 }); 18486 /* harmony default export */ const arrow_right = (arrowRight); 18487 18488 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/arrow-down.js 18489 /** 18490 * WordPress dependencies 18491 */ 18492 18493 18494 const arrowDown = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 18495 xmlns: "http://www.w3.org/2000/svg", 18496 viewBox: "0 0 24 24", 18497 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18498 d: "m16.5 13.5-3.7 3.7V4h-1.5v13.2l-3.8-3.7-1 1 5.5 5.6 5.5-5.6z" 18499 }) 18500 }); 18501 /* harmony default export */ const arrow_down = (arrowDown); 18502 18503 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/layouts/definitions.js 18504 // Layout definitions keyed by layout type. 18505 // Provides a common definition of slugs, classnames, base styles, and spacing styles for each layout type. 18506 // If making changes or additions to layout definitions, be sure to update the corresponding PHP definitions in 18507 // `block-supports/layout.php` so that the server-side and client-side definitions match. 18508 const LAYOUT_DEFINITIONS = { 18509 default: { 18510 name: 'default', 18511 slug: 'flow', 18512 className: 'is-layout-flow', 18513 baseStyles: [{ 18514 selector: ' > .alignleft', 18515 rules: { 18516 float: 'left', 18517 'margin-inline-start': '0', 18518 'margin-inline-end': '2em' 18519 } 18520 }, { 18521 selector: ' > .alignright', 18522 rules: { 18523 float: 'right', 18524 'margin-inline-start': '2em', 18525 'margin-inline-end': '0' 18526 } 18527 }, { 18528 selector: ' > .aligncenter', 18529 rules: { 18530 'margin-left': 'auto !important', 18531 'margin-right': 'auto !important' 18532 } 18533 }], 18534 spacingStyles: [{ 18535 selector: ' > :first-child', 18536 rules: { 18537 'margin-block-start': '0' 18538 } 18539 }, { 18540 selector: ' > :last-child', 18541 rules: { 18542 'margin-block-end': '0' 18543 } 18544 }, { 18545 selector: ' > *', 18546 rules: { 18547 'margin-block-start': null, 18548 'margin-block-end': '0' 18549 } 18550 }] 18551 }, 18552 constrained: { 18553 name: 'constrained', 18554 slug: 'constrained', 18555 className: 'is-layout-constrained', 18556 baseStyles: [{ 18557 selector: ' > .alignleft', 18558 rules: { 18559 float: 'left', 18560 'margin-inline-start': '0', 18561 'margin-inline-end': '2em' 18562 } 18563 }, { 18564 selector: ' > .alignright', 18565 rules: { 18566 float: 'right', 18567 'margin-inline-start': '2em', 18568 'margin-inline-end': '0' 18569 } 18570 }, { 18571 selector: ' > .aligncenter', 18572 rules: { 18573 'margin-left': 'auto !important', 18574 'margin-right': 'auto !important' 18575 } 18576 }, { 18577 selector: ' > :where(:not(.alignleft):not(.alignright):not(.alignfull))', 18578 rules: { 18579 'max-width': 'var(--wp--style--global--content-size)', 18580 'margin-left': 'auto !important', 18581 'margin-right': 'auto !important' 18582 } 18583 }, { 18584 selector: ' > .alignwide', 18585 rules: { 18586 'max-width': 'var(--wp--style--global--wide-size)' 18587 } 18588 }], 18589 spacingStyles: [{ 18590 selector: ' > :first-child', 18591 rules: { 18592 'margin-block-start': '0' 18593 } 18594 }, { 18595 selector: ' > :last-child', 18596 rules: { 18597 'margin-block-end': '0' 18598 } 18599 }, { 18600 selector: ' > *', 18601 rules: { 18602 'margin-block-start': null, 18603 'margin-block-end': '0' 18604 } 18605 }] 18606 }, 18607 flex: { 18608 name: 'flex', 18609 slug: 'flex', 18610 className: 'is-layout-flex', 18611 displayMode: 'flex', 18612 baseStyles: [{ 18613 selector: '', 18614 rules: { 18615 'flex-wrap': 'wrap', 18616 'align-items': 'center' 18617 } 18618 }, { 18619 selector: ' > :is(*, div)', 18620 // :is(*, div) instead of just * increases the specificity by 001. 18621 rules: { 18622 margin: '0' 18623 } 18624 }], 18625 spacingStyles: [{ 18626 selector: '', 18627 rules: { 18628 gap: null 18629 } 18630 }] 18631 }, 18632 grid: { 18633 name: 'grid', 18634 slug: 'grid', 18635 className: 'is-layout-grid', 18636 displayMode: 'grid', 18637 baseStyles: [{ 18638 selector: ' > :is(*, div)', 18639 // :is(*, div) instead of just * increases the specificity by 001. 18640 rules: { 18641 margin: '0' 18642 } 18643 }], 18644 spacingStyles: [{ 18645 selector: '', 18646 rules: { 18647 gap: null 18648 } 18649 }] 18650 } 18651 }; 18652 18653 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/layouts/utils.js 18654 /** 18655 * WordPress dependencies 18656 */ 18657 18658 18659 /** 18660 * Internal dependencies 18661 */ 18662 18663 18664 /** 18665 * Utility to generate the proper CSS selector for layout styles. 18666 * 18667 * @param {string} selectors CSS selector, also supports multiple comma-separated selectors. 18668 * @param {string} append The string to append. 18669 * 18670 * @return {string} - CSS selector. 18671 */ 18672 function appendSelectors(selectors, append = '') { 18673 return selectors.split(',').map(subselector => `$subselector}$append ? ` $append}` : ''}`).join(','); 18674 } 18675 18676 /** 18677 * Get generated blockGap CSS rules based on layout definitions provided in theme.json 18678 * Falsy values in the layout definition's spacingStyles rules will be swapped out 18679 * with the provided `blockGapValue`. 18680 * 18681 * @param {string} selector The CSS selector to target for the generated rules. 18682 * @param {Object} layoutDefinitions Layout definitions object. 18683 * @param {string} layoutType The layout type (e.g. `default` or `flex`). 18684 * @param {string} blockGapValue The current blockGap value to be applied. 18685 * @return {string} The generated CSS rules. 18686 */ 18687 function getBlockGapCSS(selector, layoutDefinitions = LAYOUT_DEFINITIONS, layoutType, blockGapValue) { 18688 let output = ''; 18689 if (layoutDefinitions?.[layoutType]?.spacingStyles?.length && blockGapValue) { 18690 layoutDefinitions[layoutType].spacingStyles.forEach(gapStyle => { 18691 output += `$appendSelectors(selector, gapStyle.selector.trim())} { `; 18692 output += Object.entries(gapStyle.rules).map(([cssProperty, value]) => `$cssProperty}: $value ? value : blockGapValue}`).join('; '); 18693 output += '; }'; 18694 }); 18695 } 18696 return output; 18697 } 18698 18699 /** 18700 * Helper method to assign contextual info to clarify 18701 * alignment settings. 18702 * 18703 * Besides checking if `contentSize` and `wideSize` have a 18704 * value, we now show this information only if their values 18705 * are not a `css var`. This needs to change when parsing 18706 * css variables land. 18707 * 18708 * @see https://github.com/WordPress/gutenberg/pull/34710#issuecomment-918000752 18709 * 18710 * @param {Object} layout The layout object. 18711 * @return {Object} An object with contextual info per alignment. 18712 */ 18713 function getAlignmentsInfo(layout) { 18714 const { 18715 contentSize, 18716 wideSize, 18717 type = 'default' 18718 } = layout; 18719 const alignmentInfo = {}; 18720 const sizeRegex = /^(?!0)\d+(px|em|rem|vw|vh|%|svw|lvw|dvw|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax)?$/i; 18721 if (sizeRegex.test(contentSize) && type === 'constrained') { 18722 // translators: %s: container size (i.e. 600px etc) 18723 alignmentInfo.none = (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Max %s wide'), contentSize); 18724 } 18725 if (sizeRegex.test(wideSize)) { 18726 // translators: %s: container size (i.e. 600px etc) 18727 alignmentInfo.wide = (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Max %s wide'), wideSize); 18728 } 18729 return alignmentInfo; 18730 } 18731 18732 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/sides-all.js 18733 /** 18734 * WordPress dependencies 18735 */ 18736 18737 18738 const sidesAll = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 18739 xmlns: "http://www.w3.org/2000/svg", 18740 viewBox: "0 0 24 24", 18741 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18742 d: "m7.5 6h9v-1.5h-9zm0 13.5h9v-1.5h-9zm-3-3h1.5v-9h-1.5zm13.5-9v9h1.5v-9z" 18743 }) 18744 }); 18745 /* harmony default export */ const sides_all = (sidesAll); 18746 18747 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/sides-horizontal.js 18748 /** 18749 * WordPress dependencies 18750 */ 18751 18752 18753 18754 const sidesHorizontal = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { 18755 xmlns: "http://www.w3.org/2000/svg", 18756 viewBox: "0 0 24 24", 18757 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18758 d: "m7.5 6h9v-1.5h-9zm0 13.5h9v-1.5h-9zm-3-3h1.5v-9h-1.5zm13.5-9v9h1.5v-9z", 18759 style: { 18760 opacity: 0.25 18761 } 18762 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18763 d: "m4.5 7.5v9h1.5v-9z" 18764 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18765 d: "m18 7.5v9h1.5v-9z" 18766 })] 18767 }); 18768 /* harmony default export */ const sides_horizontal = (sidesHorizontal); 18769 18770 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/sides-vertical.js 18771 /** 18772 * WordPress dependencies 18773 */ 18774 18775 18776 18777 const sidesVertical = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { 18778 xmlns: "http://www.w3.org/2000/svg", 18779 viewBox: "0 0 24 24", 18780 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18781 d: "m7.5 6h9v-1.5h-9zm0 13.5h9v-1.5h-9zm-3-3h1.5v-9h-1.5zm13.5-9v9h1.5v-9z", 18782 style: { 18783 opacity: 0.25 18784 } 18785 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18786 d: "m7.5 6h9v-1.5h-9z" 18787 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18788 d: "m7.5 19.5h9v-1.5h-9z" 18789 })] 18790 }); 18791 /* harmony default export */ const sides_vertical = (sidesVertical); 18792 18793 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/sides-top.js 18794 /** 18795 * WordPress dependencies 18796 */ 18797 18798 18799 18800 const sidesTop = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { 18801 xmlns: "http://www.w3.org/2000/svg", 18802 viewBox: "0 0 24 24", 18803 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18804 d: "m7.5 6h9v-1.5h-9zm0 13.5h9v-1.5h-9zm-3-3h1.5v-9h-1.5zm13.5-9v9h1.5v-9z", 18805 style: { 18806 opacity: 0.25 18807 } 18808 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18809 d: "m16.5 6h-9v-1.5h9z" 18810 })] 18811 }); 18812 /* harmony default export */ const sides_top = (sidesTop); 18813 18814 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/sides-right.js 18815 /** 18816 * WordPress dependencies 18817 */ 18818 18819 18820 18821 const sidesRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { 18822 xmlns: "http://www.w3.org/2000/svg", 18823 viewBox: "0 0 24 24", 18824 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18825 d: "m7.5 6h9v-1.5h-9zm0 13.5h9v-1.5h-9zm-3-3h1.5v-9h-1.5zm13.5-9v9h1.5v-9z", 18826 style: { 18827 opacity: 0.25 18828 } 18829 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18830 d: "m18 16.5v-9h1.5v9z" 18831 })] 18832 }); 18833 /* harmony default export */ const sides_right = (sidesRight); 18834 18835 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/sides-bottom.js 18836 /** 18837 * WordPress dependencies 18838 */ 18839 18840 18841 18842 const sidesBottom = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { 18843 xmlns: "http://www.w3.org/2000/svg", 18844 viewBox: "0 0 24 24", 18845 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18846 d: "m7.5 6h9v-1.5h-9zm0 13.5h9v-1.5h-9zm-3-3h1.5v-9h-1.5zm13.5-9v9h1.5v-9z", 18847 style: { 18848 opacity: 0.25 18849 } 18850 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18851 d: "m16.5 19.5h-9v-1.5h9z" 18852 })] 18853 }); 18854 /* harmony default export */ const sides_bottom = (sidesBottom); 18855 18856 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/sides-left.js 18857 /** 18858 * WordPress dependencies 18859 */ 18860 18861 18862 18863 const sidesLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { 18864 xmlns: "http://www.w3.org/2000/svg", 18865 viewBox: "0 0 24 24", 18866 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18867 d: "m7.5 6h9v-1.5h-9zm0 13.5h9v-1.5h-9zm-3-3h1.5v-9h-1.5zm13.5-9v9h1.5v-9z", 18868 style: { 18869 opacity: 0.25 18870 } 18871 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 18872 d: "m4.5 16.5v-9h1.5v9z" 18873 })] 18874 }); 18875 /* harmony default export */ const sides_left = (sidesLeft); 18876 18877 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/spacing-sizes-control/utils.js 18878 /** 18879 * WordPress dependencies 18880 */ 18881 18882 18883 const RANGE_CONTROL_MAX_SIZE = 8; 18884 const ALL_SIDES = ['top', 'right', 'bottom', 'left']; 18885 const DEFAULT_VALUES = { 18886 top: undefined, 18887 right: undefined, 18888 bottom: undefined, 18889 left: undefined 18890 }; 18891 const ICONS = { 18892 custom: sides_all, 18893 axial: sides_all, 18894 horizontal: sides_horizontal, 18895 vertical: sides_vertical, 18896 top: sides_top, 18897 right: sides_right, 18898 bottom: sides_bottom, 18899 left: sides_left 18900 }; 18901 const LABELS = { 18902 default: (0,external_wp_i18n_namespaceObject.__)('Spacing control'), 18903 top: (0,external_wp_i18n_namespaceObject.__)('Top'), 18904 bottom: (0,external_wp_i18n_namespaceObject.__)('Bottom'), 18905 left: (0,external_wp_i18n_namespaceObject.__)('Left'), 18906 right: (0,external_wp_i18n_namespaceObject.__)('Right'), 18907 mixed: (0,external_wp_i18n_namespaceObject.__)('Mixed'), 18908 vertical: (0,external_wp_i18n_namespaceObject.__)('Vertical'), 18909 horizontal: (0,external_wp_i18n_namespaceObject.__)('Horizontal'), 18910 axial: (0,external_wp_i18n_namespaceObject.__)('Horizontal & vertical'), 18911 custom: (0,external_wp_i18n_namespaceObject.__)('Custom') 18912 }; 18913 const VIEWS = { 18914 axial: 'axial', 18915 top: 'top', 18916 right: 'right', 18917 bottom: 'bottom', 18918 left: 'left', 18919 custom: 'custom' 18920 }; 18921 18922 /** 18923 * Checks is given value is a spacing preset. 18924 * 18925 * @param {string} value Value to check 18926 * 18927 * @return {boolean} Return true if value is string in format var:preset|spacing|. 18928 */ 18929 function isValueSpacingPreset(value) { 18930 if (!value?.includes) { 18931 return false; 18932 } 18933 return value === '0' || value.includes('var:preset|spacing|'); 18934 } 18935 18936 /** 18937 * Converts a spacing preset into a custom value. 18938 * 18939 * @param {string} value Value to convert 18940 * @param {Array} spacingSizes Array of the current spacing preset objects 18941 * 18942 * @return {string} Mapping of the spacing preset to its equivalent custom value. 18943 */ 18944 function getCustomValueFromPreset(value, spacingSizes) { 18945 if (!isValueSpacingPreset(value)) { 18946 return value; 18947 } 18948 const slug = getSpacingPresetSlug(value); 18949 const spacingSize = spacingSizes.find(size => String(size.slug) === slug); 18950 return spacingSize?.size; 18951 } 18952 18953 /** 18954 * Converts a custom value to preset value if one can be found. 18955 * 18956 * Returns value as-is if no match is found. 18957 * 18958 * @param {string} value Value to convert 18959 * @param {Array} spacingSizes Array of the current spacing preset objects 18960 * 18961 * @return {string} The preset value if it can be found. 18962 */ 18963 function getPresetValueFromCustomValue(value, spacingSizes) { 18964 // Return value as-is if it is undefined or is already a preset, or '0'; 18965 if (!value || isValueSpacingPreset(value) || value === '0') { 18966 return value; 18967 } 18968 const spacingMatch = spacingSizes.find(size => String(size.size) === String(value)); 18969 if (spacingMatch?.slug) { 18970 return `var:preset|spacing|$spacingMatch.slug}`; 18971 } 18972 return value; 18973 } 18974 18975 /** 18976 * Converts a spacing preset into a custom value. 18977 * 18978 * @param {string} value Value to convert. 18979 * 18980 * @return {string | undefined} CSS var string for given spacing preset value. 18981 */ 18982 function getSpacingPresetCssVar(value) { 18983 if (!value) { 18984 return; 18985 } 18986 const slug = value.match(/var:preset\|spacing\|(.+)/); 18987 if (!slug) { 18988 return value; 18989 } 18990 return `var(--wp--preset--spacing--$slug[1]})`; 18991 } 18992 18993 /** 18994 * Returns the slug section of the given spacing preset string. 18995 * 18996 * @param {string} value Value to extract slug from. 18997 * 18998 * @return {string|undefined} The int value of the slug from given spacing preset. 18999 */ 19000 function getSpacingPresetSlug(value) { 19001 if (!value) { 19002 return; 19003 } 19004 if (value === '0' || value === 'default') { 19005 return value; 19006 } 19007 const slug = value.match(/var:preset\|spacing\|(.+)/); 19008 return slug ? slug[1] : undefined; 19009 } 19010 19011 /** 19012 * Converts spacing preset value into a Range component value . 19013 * 19014 * @param {string} presetValue Value to convert to Range value. 19015 * @param {Array} spacingSizes Array of current spacing preset value objects. 19016 * 19017 * @return {number} The int value for use in Range control. 19018 */ 19019 function getSliderValueFromPreset(presetValue, spacingSizes) { 19020 if (presetValue === undefined) { 19021 return 0; 19022 } 19023 const slug = parseFloat(presetValue, 10) === 0 ? '0' : getSpacingPresetSlug(presetValue); 19024 const sliderValue = spacingSizes.findIndex(spacingSize => { 19025 return String(spacingSize.slug) === slug; 19026 }); 19027 19028 // Returning NaN rather than undefined as undefined makes range control thumb sit in center 19029 return sliderValue !== -1 ? sliderValue : NaN; 19030 } 19031 19032 /** 19033 * Gets an items with the most occurrence within an array 19034 * https://stackoverflow.com/a/20762713 19035 * 19036 * @param {Array<any>} arr Array of items to check. 19037 * @return {any} The item with the most occurrences. 19038 */ 19039 function mode(arr) { 19040 return arr.sort((a, b) => arr.filter(v => v === a).length - arr.filter(v => v === b).length).pop(); 19041 } 19042 19043 /** 19044 * Gets the 'all' input value from values data. 19045 * 19046 * @param {Object} values Box spacing values 19047 * 19048 * @return {string} The most common value from all sides of box. 19049 */ 19050 function getAllRawValue(values = {}) { 19051 return mode(Object.values(values)); 19052 } 19053 19054 /** 19055 * Checks to determine if values are mixed. 19056 * 19057 * @param {Object} values Box values. 19058 * @param {Array} sides Sides that values relate to. 19059 * 19060 * @return {boolean} Whether values are mixed. 19061 */ 19062 function isValuesMixed(values = {}, sides = ALL_SIDES) { 19063 return Object.values(values).length >= 1 && Object.values(values).length < sides.length || new Set(Object.values(values)).size > 1; 19064 } 19065 19066 /** 19067 * Checks to determine if values are defined. 19068 * 19069 * @param {Object} values Box values. 19070 * 19071 * @return {boolean} Whether values are defined. 19072 */ 19073 function isValuesDefined(values) { 19074 if (values === undefined || values === null) { 19075 return false; 19076 } 19077 return Object.values(values).filter(value => !!value).length > 0; 19078 } 19079 19080 /** 19081 * Determines whether a particular axis has support. If no axis is 19082 * specified, this function checks if either axis is supported. 19083 * 19084 * @param {Array} sides Supported sides. 19085 * @param {string} axis Which axis to check. 19086 * 19087 * @return {boolean} Whether there is support for the specified axis or both axes. 19088 */ 19089 function hasAxisSupport(sides, axis) { 19090 if (!sides || !sides.length) { 19091 return false; 19092 } 19093 const hasHorizontalSupport = sides.includes('horizontal') || sides.includes('left') && sides.includes('right'); 19094 const hasVerticalSupport = sides.includes('vertical') || sides.includes('top') && sides.includes('bottom'); 19095 if (axis === 'horizontal') { 19096 return hasHorizontalSupport; 19097 } 19098 if (axis === 'vertical') { 19099 return hasVerticalSupport; 19100 } 19101 return hasHorizontalSupport || hasVerticalSupport; 19102 } 19103 19104 /** 19105 * Determines which menu options should be included in the SidePicker. 19106 * 19107 * @param {Array} sides Supported sides. 19108 * 19109 * @return {Object} Menu options with each option containing label & icon. 19110 */ 19111 function getSupportedMenuItems(sides) { 19112 if (!sides || !sides.length) { 19113 return {}; 19114 } 19115 const menuItems = {}; 19116 19117 // Determine the primary "side" menu options. 19118 const hasHorizontalSupport = hasAxisSupport(sides, 'horizontal'); 19119 const hasVerticalSupport = hasAxisSupport(sides, 'vertical'); 19120 if (hasHorizontalSupport && hasVerticalSupport) { 19121 menuItems.axial = { 19122 label: LABELS.axial, 19123 icon: ICONS.axial 19124 }; 19125 } else if (hasHorizontalSupport) { 19126 menuItems.axial = { 19127 label: LABELS.horizontal, 19128 icon: ICONS.horizontal 19129 }; 19130 } else if (hasVerticalSupport) { 19131 menuItems.axial = { 19132 label: LABELS.vertical, 19133 icon: ICONS.vertical 19134 }; 19135 } 19136 19137 // Track whether we have any individual sides so we can omit the custom 19138 // option if required. 19139 let numberOfIndividualSides = 0; 19140 ALL_SIDES.forEach(side => { 19141 if (sides.includes(side)) { 19142 numberOfIndividualSides += 1; 19143 menuItems[side] = { 19144 label: LABELS[side], 19145 icon: ICONS[side] 19146 }; 19147 } 19148 }); 19149 19150 // Add custom item if there are enough sides to warrant a separated view. 19151 if (numberOfIndividualSides > 1) { 19152 menuItems.custom = { 19153 label: LABELS.custom, 19154 icon: ICONS.custom 19155 }; 19156 } 19157 return menuItems; 19158 } 19159 19160 /** 19161 * Checks if the supported sides are balanced for each axis. 19162 * - Horizontal - both left and right sides are supported. 19163 * - Vertical - both top and bottom are supported. 19164 * 19165 * @param {Array} sides The supported sides which may be axes as well. 19166 * 19167 * @return {boolean} Whether or not the supported sides are balanced. 19168 */ 19169 function hasBalancedSidesSupport(sides = []) { 19170 const counts = { 19171 top: 0, 19172 right: 0, 19173 bottom: 0, 19174 left: 0 19175 }; 19176 sides.forEach(side => counts[side] += 1); 19177 return (counts.top + counts.bottom) % 2 === 0 && (counts.left + counts.right) % 2 === 0; 19178 } 19179 19180 /** 19181 * Determines which view the SpacingSizesControl should default to on its 19182 * first render; Axial, Custom, or Single side. 19183 * 19184 * @param {Object} values Current side values. 19185 * @param {Array} sides Supported sides. 19186 * 19187 * @return {string} View to display. 19188 */ 19189 function getInitialView(values = {}, sides) { 19190 const { 19191 top, 19192 right, 19193 bottom, 19194 left 19195 } = values; 19196 const sideValues = [top, right, bottom, left].filter(Boolean); 19197 19198 // Axial ( Horizontal & vertical ). 19199 // - Has axial side support 19200 // - Has axial side values which match 19201 // - Has no values and the supported sides are balanced 19202 const hasMatchingAxialValues = top === bottom && left === right && (!!top || !!left); 19203 const hasNoValuesAndBalancedSides = !sideValues.length && hasBalancedSidesSupport(sides); 19204 const hasOnlyAxialSides = sides?.includes('horizontal') && sides?.includes('vertical') && sides?.length === 2; 19205 if (hasAxisSupport(sides) && (hasMatchingAxialValues || hasNoValuesAndBalancedSides)) { 19206 return VIEWS.axial; 19207 } 19208 19209 // Only axial sides are supported and single value defined. 19210 // - Ensure the side returned is the first side that has a value. 19211 if (hasOnlyAxialSides && sideValues.length === 1) { 19212 let side; 19213 Object.entries(values).some(([key, value]) => { 19214 side = key; 19215 return value !== undefined; 19216 }); 19217 return side; 19218 } 19219 19220 // Only single side supported and no value defined. 19221 if (sides?.length === 1 && !sideValues.length) { 19222 return sides[0]; 19223 } 19224 19225 // Default to the Custom (separated sides) view. 19226 return VIEWS.custom; 19227 } 19228 19229 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/gap.js 19230 /** 19231 * Internal dependencies 19232 */ 19233 19234 19235 /** 19236 * Returns a BoxControl object value from a given blockGap style value. 19237 * The string check is for backwards compatibility before Gutenberg supported 19238 * split gap values (row and column) and the value was a string n + unit. 19239 * 19240 * @param {string? | Object?} blockGapValue A block gap string or axial object value, e.g., '10px' or { top: '10px', left: '10px'}. 19241 * @return {Object|null} A value to pass to the BoxControl component. 19242 */ 19243 function getGapBoxControlValueFromStyle(blockGapValue) { 19244 if (!blockGapValue) { 19245 return null; 19246 } 19247 const isValueString = typeof blockGapValue === 'string'; 19248 return { 19249 top: isValueString ? blockGapValue : blockGapValue?.top, 19250 left: isValueString ? blockGapValue : blockGapValue?.left 19251 }; 19252 } 19253 19254 /** 19255 * Returns a CSS value for the `gap` property from a given blockGap style. 19256 * 19257 * @param {string? | Object?} blockGapValue A block gap string or axial object value, e.g., '10px' or { top: '10px', left: '10px'}. 19258 * @param {string?} defaultValue A default gap value. 19259 * @return {string|null} The concatenated gap value (row and column). 19260 */ 19261 function getGapCSSValue(blockGapValue, defaultValue = '0') { 19262 const blockGapBoxControlValue = getGapBoxControlValueFromStyle(blockGapValue); 19263 if (!blockGapBoxControlValue) { 19264 return null; 19265 } 19266 const row = getSpacingPresetCssVar(blockGapBoxControlValue?.top) || defaultValue; 19267 const column = getSpacingPresetCssVar(blockGapBoxControlValue?.left) || defaultValue; 19268 return row === column ? row : `$row} $column}`; 19269 } 19270 19271 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-vertical-alignment-control/icons.js 19272 /** 19273 * WordPress dependencies 19274 */ 19275 19276 19277 const alignBottom = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SVG, { 19278 xmlns: "http://www.w3.org/2000/svg", 19279 viewBox: "0 0 24 24", 19280 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Path, { 19281 d: "M15 4H9v11h6V4zM4 18.5V20h16v-1.5H4z" 19282 }) 19283 }); 19284 const alignCenter = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SVG, { 19285 xmlns: "http://www.w3.org/2000/svg", 19286 viewBox: "0 0 24 24", 19287 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Path, { 19288 d: "M20 11h-5V4H9v7H4v1.5h5V20h6v-7.5h5z" 19289 }) 19290 }); 19291 const alignTop = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SVG, { 19292 xmlns: "http://www.w3.org/2000/svg", 19293 viewBox: "0 0 24 24", 19294 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Path, { 19295 d: "M9 20h6V9H9v11zM4 4v1.5h16V4H4z" 19296 }) 19297 }); 19298 const alignStretch = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SVG, { 19299 xmlns: "http://www.w3.org/2000/svg", 19300 viewBox: "0 0 24 24", 19301 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Path, { 19302 d: "M4 4L20 4L20 5.5L4 5.5L4 4ZM10 7L14 7L14 17L10 17L10 7ZM20 18.5L4 18.5L4 20L20 20L20 18.5Z" 19303 }) 19304 }); 19305 const spaceBetween = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SVG, { 19306 xmlns: "http://www.w3.org/2000/svg", 19307 viewBox: "0 0 24 24", 19308 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Path, { 19309 d: "M7 4H17V8L7 8V4ZM7 16L17 16V20L7 20V16ZM20 11.25H4V12.75H20V11.25Z" 19310 }) 19311 }); 19312 19313 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-vertical-alignment-control/ui.js 19314 /** 19315 * WordPress dependencies 19316 */ 19317 19318 19319 19320 /** 19321 * Internal dependencies 19322 */ 19323 19324 19325 const BLOCK_ALIGNMENTS_CONTROLS = { 19326 top: { 19327 icon: alignTop, 19328 title: (0,external_wp_i18n_namespaceObject._x)('Align top', 'Block vertical alignment setting') 19329 }, 19330 center: { 19331 icon: alignCenter, 19332 title: (0,external_wp_i18n_namespaceObject._x)('Align middle', 'Block vertical alignment setting') 19333 }, 19334 bottom: { 19335 icon: alignBottom, 19336 title: (0,external_wp_i18n_namespaceObject._x)('Align bottom', 'Block vertical alignment setting') 19337 }, 19338 stretch: { 19339 icon: alignStretch, 19340 title: (0,external_wp_i18n_namespaceObject._x)('Stretch to fill', 'Block vertical alignment setting') 19341 }, 19342 'space-between': { 19343 icon: spaceBetween, 19344 title: (0,external_wp_i18n_namespaceObject._x)('Space between', 'Block vertical alignment setting') 19345 } 19346 }; 19347 const DEFAULT_CONTROLS = ['top', 'center', 'bottom']; 19348 const DEFAULT_CONTROL = 'top'; 19349 function BlockVerticalAlignmentUI({ 19350 value, 19351 onChange, 19352 controls = DEFAULT_CONTROLS, 19353 isCollapsed = true, 19354 isToolbar 19355 }) { 19356 function applyOrUnset(align) { 19357 return () => onChange(value === align ? undefined : align); 19358 } 19359 const activeAlignment = BLOCK_ALIGNMENTS_CONTROLS[value]; 19360 const defaultAlignmentControl = BLOCK_ALIGNMENTS_CONTROLS[DEFAULT_CONTROL]; 19361 const UIComponent = isToolbar ? external_wp_components_namespaceObject.ToolbarGroup : external_wp_components_namespaceObject.ToolbarDropdownMenu; 19362 const extraProps = isToolbar ? { 19363 isCollapsed 19364 } : {}; 19365 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(UIComponent, { 19366 icon: activeAlignment ? activeAlignment.icon : defaultAlignmentControl.icon, 19367 label: (0,external_wp_i18n_namespaceObject._x)('Change vertical alignment', 'Block vertical alignment setting label'), 19368 controls: controls.map(control => { 19369 return { 19370 ...BLOCK_ALIGNMENTS_CONTROLS[control], 19371 isActive: value === control, 19372 role: isCollapsed ? 'menuitemradio' : undefined, 19373 onClick: applyOrUnset(control) 19374 }; 19375 }), 19376 ...extraProps 19377 }); 19378 } 19379 19380 /** 19381 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-vertical-alignment-toolbar/README.md 19382 */ 19383 /* harmony default export */ const ui = (BlockVerticalAlignmentUI); 19384 19385 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-vertical-alignment-control/index.js 19386 /** 19387 * Internal dependencies 19388 */ 19389 19390 19391 const BlockVerticalAlignmentControl = props => { 19392 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ui, { 19393 ...props, 19394 isToolbar: false 19395 }); 19396 }; 19397 const BlockVerticalAlignmentToolbar = props => { 19398 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ui, { 19399 ...props, 19400 isToolbar: true 19401 }); 19402 }; 19403 19404 /** 19405 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-vertical-alignment-control/README.md 19406 */ 19407 19408 19409 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/justify-content-control/ui.js 19410 /** 19411 * WordPress dependencies 19412 */ 19413 19414 19415 19416 19417 const icons = { 19418 left: justify_left, 19419 center: justify_center, 19420 right: justify_right, 19421 'space-between': justify_space_between, 19422 stretch: justify_stretch 19423 }; 19424 function JustifyContentUI({ 19425 allowedControls = ['left', 'center', 'right', 'space-between'], 19426 isCollapsed = true, 19427 onChange, 19428 value, 19429 popoverProps, 19430 isToolbar 19431 }) { 19432 // If the control is already selected we want a click 19433 // again on the control to deselect the item, so we 19434 // call onChange( undefined ) 19435 const handleClick = next => { 19436 if (next === value) { 19437 onChange(undefined); 19438 } else { 19439 onChange(next); 19440 } 19441 }; 19442 const icon = value ? icons[value] : icons.left; 19443 const allControls = [{ 19444 name: 'left', 19445 icon: justify_left, 19446 title: (0,external_wp_i18n_namespaceObject.__)('Justify items left'), 19447 isActive: 'left' === value, 19448 onClick: () => handleClick('left') 19449 }, { 19450 name: 'center', 19451 icon: justify_center, 19452 title: (0,external_wp_i18n_namespaceObject.__)('Justify items center'), 19453 isActive: 'center' === value, 19454 onClick: () => handleClick('center') 19455 }, { 19456 name: 'right', 19457 icon: justify_right, 19458 title: (0,external_wp_i18n_namespaceObject.__)('Justify items right'), 19459 isActive: 'right' === value, 19460 onClick: () => handleClick('right') 19461 }, { 19462 name: 'space-between', 19463 icon: justify_space_between, 19464 title: (0,external_wp_i18n_namespaceObject.__)('Space between items'), 19465 isActive: 'space-between' === value, 19466 onClick: () => handleClick('space-between') 19467 }, { 19468 name: 'stretch', 19469 icon: justify_stretch, 19470 title: (0,external_wp_i18n_namespaceObject.__)('Stretch items'), 19471 isActive: 'stretch' === value, 19472 onClick: () => handleClick('stretch') 19473 }]; 19474 const UIComponent = isToolbar ? external_wp_components_namespaceObject.ToolbarGroup : external_wp_components_namespaceObject.ToolbarDropdownMenu; 19475 const extraProps = isToolbar ? { 19476 isCollapsed 19477 } : {}; 19478 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(UIComponent, { 19479 icon: icon, 19480 popoverProps: popoverProps, 19481 label: (0,external_wp_i18n_namespaceObject.__)('Change items justification'), 19482 controls: allControls.filter(elem => allowedControls.includes(elem.name)), 19483 ...extraProps 19484 }); 19485 } 19486 /* harmony default export */ const justify_content_control_ui = (JustifyContentUI); 19487 19488 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/justify-content-control/index.js 19489 /** 19490 * Internal dependencies 19491 */ 19492 19493 19494 const JustifyContentControl = props => { 19495 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(justify_content_control_ui, { 19496 ...props, 19497 isToolbar: false 19498 }); 19499 }; 19500 const JustifyToolbar = props => { 19501 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(justify_content_control_ui, { 19502 ...props, 19503 isToolbar: true 19504 }); 19505 }; 19506 19507 /** 19508 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/justify-content-control/README.md 19509 */ 19510 19511 19512 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/layouts/flex.js 19513 /** 19514 * WordPress dependencies 19515 */ 19516 19517 19518 19519 19520 /** 19521 * Internal dependencies 19522 */ 19523 19524 19525 19526 19527 19528 19529 // Used with the default, horizontal flex orientation. 19530 19531 19532 19533 const justifyContentMap = { 19534 left: 'flex-start', 19535 right: 'flex-end', 19536 center: 'center', 19537 'space-between': 'space-between' 19538 }; 19539 19540 // Used with the vertical (column) flex orientation. 19541 const alignItemsMap = { 19542 left: 'flex-start', 19543 right: 'flex-end', 19544 center: 'center', 19545 stretch: 'stretch' 19546 }; 19547 const verticalAlignmentMap = { 19548 top: 'flex-start', 19549 center: 'center', 19550 bottom: 'flex-end', 19551 stretch: 'stretch', 19552 'space-between': 'space-between' 19553 }; 19554 const flexWrapOptions = ['wrap', 'nowrap']; 19555 /* harmony default export */ const flex = ({ 19556 name: 'flex', 19557 label: (0,external_wp_i18n_namespaceObject.__)('Flex'), 19558 inspectorControls: function FlexLayoutInspectorControls({ 19559 layout = {}, 19560 onChange, 19561 layoutBlockSupport = {} 19562 }) { 19563 const { 19564 allowOrientation = true 19565 } = layoutBlockSupport; 19566 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 19567 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 19568 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 19569 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexLayoutJustifyContentControl, { 19570 layout: layout, 19571 onChange: onChange 19572 }) 19573 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 19574 children: allowOrientation && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OrientationControl, { 19575 layout: layout, 19576 onChange: onChange 19577 }) 19578 })] 19579 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexWrapControl, { 19580 layout: layout, 19581 onChange: onChange 19582 })] 19583 }); 19584 }, 19585 toolBarControls: function FlexLayoutToolbarControls({ 19586 layout = {}, 19587 onChange, 19588 layoutBlockSupport 19589 }) { 19590 if (layoutBlockSupport?.allowSwitching) { 19591 return null; 19592 } 19593 const { 19594 allowVerticalAlignment = true 19595 } = layoutBlockSupport; 19596 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(block_controls, { 19597 group: "block", 19598 __experimentalShareWithChildBlocks: true, 19599 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexLayoutJustifyContentControl, { 19600 layout: layout, 19601 onChange: onChange, 19602 isToolbar: true 19603 }), allowVerticalAlignment && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexLayoutVerticalAlignmentControl, { 19604 layout: layout, 19605 onChange: onChange 19606 })] 19607 }); 19608 }, 19609 getLayoutStyle: function getLayoutStyle({ 19610 selector, 19611 layout, 19612 style, 19613 blockName, 19614 hasBlockGapSupport, 19615 layoutDefinitions = LAYOUT_DEFINITIONS 19616 }) { 19617 const { 19618 orientation = 'horizontal' 19619 } = layout; 19620 19621 // If a block's block.json skips serialization for spacing or spacing.blockGap, 19622 // don't apply the user-defined value to the styles. 19623 const blockGapValue = style?.spacing?.blockGap && !shouldSkipSerialization(blockName, 'spacing', 'blockGap') ? getGapCSSValue(style?.spacing?.blockGap, '0.5em') : undefined; 19624 const justifyContent = justifyContentMap[layout.justifyContent]; 19625 const flexWrap = flexWrapOptions.includes(layout.flexWrap) ? layout.flexWrap : 'wrap'; 19626 const verticalAlignment = verticalAlignmentMap[layout.verticalAlignment]; 19627 const alignItems = alignItemsMap[layout.justifyContent] || alignItemsMap.left; 19628 let output = ''; 19629 const rules = []; 19630 if (flexWrap && flexWrap !== 'wrap') { 19631 rules.push(`flex-wrap: $flexWrap}`); 19632 } 19633 if (orientation === 'horizontal') { 19634 if (verticalAlignment) { 19635 rules.push(`align-items: $verticalAlignment}`); 19636 } 19637 if (justifyContent) { 19638 rules.push(`justify-content: $justifyContent}`); 19639 } 19640 } else { 19641 if (verticalAlignment) { 19642 rules.push(`justify-content: $verticalAlignment}`); 19643 } 19644 rules.push('flex-direction: column'); 19645 rules.push(`align-items: $alignItems}`); 19646 } 19647 if (rules.length) { 19648 output = `$appendSelectors(selector)} { 19649 $rules.join('; ')}; 19650 }`; 19651 } 19652 19653 // Output blockGap styles based on rules contained in layout definitions in theme.json. 19654 if (hasBlockGapSupport && blockGapValue) { 19655 output += getBlockGapCSS(selector, layoutDefinitions, 'flex', blockGapValue); 19656 } 19657 return output; 19658 }, 19659 getOrientation(layout) { 19660 const { 19661 orientation = 'horizontal' 19662 } = layout; 19663 return orientation; 19664 }, 19665 getAlignments() { 19666 return []; 19667 } 19668 }); 19669 function FlexLayoutVerticalAlignmentControl({ 19670 layout, 19671 onChange 19672 }) { 19673 const { 19674 orientation = 'horizontal' 19675 } = layout; 19676 const defaultVerticalAlignment = orientation === 'horizontal' ? verticalAlignmentMap.center : verticalAlignmentMap.top; 19677 const { 19678 verticalAlignment = defaultVerticalAlignment 19679 } = layout; 19680 const onVerticalAlignmentChange = value => { 19681 onChange({ 19682 ...layout, 19683 verticalAlignment: value 19684 }); 19685 }; 19686 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockVerticalAlignmentControl, { 19687 onChange: onVerticalAlignmentChange, 19688 value: verticalAlignment, 19689 controls: orientation === 'horizontal' ? ['top', 'center', 'bottom', 'stretch'] : ['top', 'center', 'bottom', 'space-between'] 19690 }); 19691 } 19692 const POPOVER_PROPS = { 19693 placement: 'bottom-start' 19694 }; 19695 function FlexLayoutJustifyContentControl({ 19696 layout, 19697 onChange, 19698 isToolbar = false 19699 }) { 19700 const { 19701 justifyContent = 'left', 19702 orientation = 'horizontal' 19703 } = layout; 19704 const onJustificationChange = value => { 19705 onChange({ 19706 ...layout, 19707 justifyContent: value 19708 }); 19709 }; 19710 const allowedControls = ['left', 'center', 'right']; 19711 if (orientation === 'horizontal') { 19712 allowedControls.push('space-between'); 19713 } else { 19714 allowedControls.push('stretch'); 19715 } 19716 if (isToolbar) { 19717 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(JustifyContentControl, { 19718 allowedControls: allowedControls, 19719 value: justifyContent, 19720 onChange: onJustificationChange, 19721 popoverProps: POPOVER_PROPS 19722 }); 19723 } 19724 const justificationOptions = [{ 19725 value: 'left', 19726 icon: justify_left, 19727 label: (0,external_wp_i18n_namespaceObject.__)('Justify items left') 19728 }, { 19729 value: 'center', 19730 icon: justify_center, 19731 label: (0,external_wp_i18n_namespaceObject.__)('Justify items center') 19732 }, { 19733 value: 'right', 19734 icon: justify_right, 19735 label: (0,external_wp_i18n_namespaceObject.__)('Justify items right') 19736 }]; 19737 if (orientation === 'horizontal') { 19738 justificationOptions.push({ 19739 value: 'space-between', 19740 icon: justify_space_between, 19741 label: (0,external_wp_i18n_namespaceObject.__)('Space between items') 19742 }); 19743 } else { 19744 justificationOptions.push({ 19745 value: 'stretch', 19746 icon: justify_stretch, 19747 label: (0,external_wp_i18n_namespaceObject.__)('Stretch items') 19748 }); 19749 } 19750 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 19751 __next40pxDefaultSize: true, 19752 __nextHasNoMarginBottom: true, 19753 label: (0,external_wp_i18n_namespaceObject.__)('Justification'), 19754 value: justifyContent, 19755 onChange: onJustificationChange, 19756 className: "block-editor-hooks__flex-layout-justification-controls", 19757 children: justificationOptions.map(({ 19758 value, 19759 icon, 19760 label 19761 }) => { 19762 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOptionIcon, { 19763 value: value, 19764 icon: icon, 19765 label: label 19766 }, value); 19767 }) 19768 }); 19769 } 19770 function FlexWrapControl({ 19771 layout, 19772 onChange 19773 }) { 19774 const { 19775 flexWrap = 'wrap' 19776 } = layout; 19777 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 19778 __nextHasNoMarginBottom: true, 19779 label: (0,external_wp_i18n_namespaceObject.__)('Allow to wrap to multiple lines'), 19780 onChange: value => { 19781 onChange({ 19782 ...layout, 19783 flexWrap: value ? 'wrap' : 'nowrap' 19784 }); 19785 }, 19786 checked: flexWrap === 'wrap' 19787 }); 19788 } 19789 function OrientationControl({ 19790 layout, 19791 onChange 19792 }) { 19793 const { 19794 orientation = 'horizontal', 19795 verticalAlignment, 19796 justifyContent 19797 } = layout; 19798 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 19799 __next40pxDefaultSize: true, 19800 __nextHasNoMarginBottom: true, 19801 className: "block-editor-hooks__flex-layout-orientation-controls", 19802 label: (0,external_wp_i18n_namespaceObject.__)('Orientation'), 19803 value: orientation, 19804 onChange: value => { 19805 // Make sure the vertical alignment and justification are compatible with the new orientation. 19806 let newVerticalAlignment = verticalAlignment; 19807 let newJustification = justifyContent; 19808 if (value === 'horizontal') { 19809 if (verticalAlignment === 'space-between') { 19810 newVerticalAlignment = 'center'; 19811 } 19812 if (justifyContent === 'stretch') { 19813 newJustification = 'left'; 19814 } 19815 } else { 19816 if (verticalAlignment === 'stretch') { 19817 newVerticalAlignment = 'top'; 19818 } 19819 if (justifyContent === 'space-between') { 19820 newJustification = 'left'; 19821 } 19822 } 19823 return onChange({ 19824 ...layout, 19825 orientation: value, 19826 verticalAlignment: newVerticalAlignment, 19827 justifyContent: newJustification 19828 }); 19829 }, 19830 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOptionIcon, { 19831 icon: arrow_right, 19832 value: "horizontal", 19833 label: (0,external_wp_i18n_namespaceObject.__)('Horizontal') 19834 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOptionIcon, { 19835 icon: arrow_down, 19836 value: "vertical", 19837 label: (0,external_wp_i18n_namespaceObject.__)('Vertical') 19838 })] 19839 }); 19840 } 19841 19842 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/layouts/flow.js 19843 /** 19844 * WordPress dependencies 19845 */ 19846 19847 19848 /** 19849 * Internal dependencies 19850 */ 19851 19852 19853 19854 19855 /* harmony default export */ const flow = ({ 19856 name: 'default', 19857 label: (0,external_wp_i18n_namespaceObject.__)('Flow'), 19858 inspectorControls: function DefaultLayoutInspectorControls() { 19859 return null; 19860 }, 19861 toolBarControls: function DefaultLayoutToolbarControls() { 19862 return null; 19863 }, 19864 getLayoutStyle: function getLayoutStyle({ 19865 selector, 19866 style, 19867 blockName, 19868 hasBlockGapSupport, 19869 layoutDefinitions = LAYOUT_DEFINITIONS 19870 }) { 19871 const blockGapStyleValue = getGapCSSValue(style?.spacing?.blockGap); 19872 19873 // If a block's block.json skips serialization for spacing or 19874 // spacing.blockGap, don't apply the user-defined value to the styles. 19875 let blockGapValue = ''; 19876 if (!shouldSkipSerialization(blockName, 'spacing', 'blockGap')) { 19877 // If an object is provided only use the 'top' value for this kind of gap. 19878 if (blockGapStyleValue?.top) { 19879 blockGapValue = getGapCSSValue(blockGapStyleValue?.top); 19880 } else if (typeof blockGapStyleValue === 'string') { 19881 blockGapValue = getGapCSSValue(blockGapStyleValue); 19882 } 19883 } 19884 let output = ''; 19885 19886 // Output blockGap styles based on rules contained in layout definitions in theme.json. 19887 if (hasBlockGapSupport && blockGapValue) { 19888 output += getBlockGapCSS(selector, layoutDefinitions, 'default', blockGapValue); 19889 } 19890 return output; 19891 }, 19892 getOrientation() { 19893 return 'vertical'; 19894 }, 19895 getAlignments(layout, isBlockBasedTheme) { 19896 const alignmentInfo = getAlignmentsInfo(layout); 19897 if (layout.alignments !== undefined) { 19898 if (!layout.alignments.includes('none')) { 19899 layout.alignments.unshift('none'); 19900 } 19901 return layout.alignments.map(alignment => ({ 19902 name: alignment, 19903 info: alignmentInfo[alignment] 19904 })); 19905 } 19906 const alignments = [{ 19907 name: 'left' 19908 }, { 19909 name: 'center' 19910 }, { 19911 name: 'right' 19912 }]; 19913 19914 // This is for backwards compatibility with hybrid themes. 19915 if (!isBlockBasedTheme) { 19916 const { 19917 contentSize, 19918 wideSize 19919 } = layout; 19920 if (contentSize) { 19921 alignments.unshift({ 19922 name: 'full' 19923 }); 19924 } 19925 if (wideSize) { 19926 alignments.unshift({ 19927 name: 'wide', 19928 info: alignmentInfo.wide 19929 }); 19930 } 19931 } 19932 alignments.unshift({ 19933 name: 'none', 19934 info: alignmentInfo.none 19935 }); 19936 return alignments; 19937 } 19938 }); 19939 19940 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/icon/index.js 19941 /** 19942 * WordPress dependencies 19943 */ 19944 19945 19946 /** @typedef {{icon: JSX.Element, size?: number} & import('@wordpress/primitives').SVGProps} IconProps */ 19947 19948 /** 19949 * Return an SVG icon. 19950 * 19951 * @param {IconProps} props icon is the SVG component to render 19952 * size is a number specifiying the icon size in pixels 19953 * Other props will be passed to wrapped SVG component 19954 * @param {import('react').ForwardedRef<HTMLElement>} ref The forwarded ref to the SVG element. 19955 * 19956 * @return {JSX.Element} Icon component 19957 */ 19958 function Icon({ 19959 icon, 19960 size = 24, 19961 ...props 19962 }, ref) { 19963 return (0,external_wp_element_namespaceObject.cloneElement)(icon, { 19964 width: size, 19965 height: size, 19966 ...props, 19967 ref 19968 }); 19969 } 19970 /* harmony default export */ const build_module_icon = ((0,external_wp_element_namespaceObject.forwardRef)(Icon)); 19971 19972 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/align-none.js 19973 /** 19974 * WordPress dependencies 19975 */ 19976 19977 19978 const alignNone = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 19979 xmlns: "http://www.w3.org/2000/svg", 19980 viewBox: "0 0 24 24", 19981 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 19982 d: "M19 5.5H5V4h14v1.5ZM19 20H5v-1.5h14V20ZM5 9h14v6H5V9Z" 19983 }) 19984 }); 19985 /* harmony default export */ const align_none = (alignNone); 19986 19987 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/stretch-wide.js 19988 /** 19989 * WordPress dependencies 19990 */ 19991 19992 19993 const stretchWide = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 19994 xmlns: "http://www.w3.org/2000/svg", 19995 viewBox: "0 0 24 24", 19996 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 19997 d: "M16 5.5H8V4h8v1.5ZM16 20H8v-1.5h8V20ZM5 9h14v6H5V9Z" 19998 }) 19999 }); 20000 /* harmony default export */ const stretch_wide = (stretchWide); 20001 20002 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/layouts/constrained.js 20003 /** 20004 * WordPress dependencies 20005 */ 20006 20007 20008 20009 20010 20011 /** 20012 * Internal dependencies 20013 */ 20014 20015 20016 20017 20018 20019 20020 20021 20022 20023 /* harmony default export */ const constrained = ({ 20024 name: 'constrained', 20025 label: (0,external_wp_i18n_namespaceObject.__)('Constrained'), 20026 inspectorControls: function DefaultLayoutInspectorControls({ 20027 layout, 20028 onChange, 20029 layoutBlockSupport = {} 20030 }) { 20031 const { 20032 wideSize, 20033 contentSize, 20034 justifyContent = 'center' 20035 } = layout; 20036 const { 20037 allowJustification = true, 20038 allowCustomContentAndWideSize = true 20039 } = layoutBlockSupport; 20040 const onJustificationChange = value => { 20041 onChange({ 20042 ...layout, 20043 justifyContent: value 20044 }); 20045 }; 20046 const justificationOptions = [{ 20047 value: 'left', 20048 icon: justify_left, 20049 label: (0,external_wp_i18n_namespaceObject.__)('Justify items left') 20050 }, { 20051 value: 'center', 20052 icon: justify_center, 20053 label: (0,external_wp_i18n_namespaceObject.__)('Justify items center') 20054 }, { 20055 value: 'right', 20056 icon: justify_right, 20057 label: (0,external_wp_i18n_namespaceObject.__)('Justify items right') 20058 }]; 20059 const [availableUnits] = use_settings_useSettings('spacing.units'); 20060 const units = (0,external_wp_components_namespaceObject.__experimentalUseCustomUnits)({ 20061 availableUnits: availableUnits || ['%', 'px', 'em', 'rem', 'vw'] 20062 }); 20063 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 20064 spacing: 4, 20065 className: "block-editor-hooks__layout-constrained", 20066 children: [allowCustomContentAndWideSize && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 20067 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 20068 __next40pxDefaultSize: true, 20069 label: (0,external_wp_i18n_namespaceObject.__)('Content width'), 20070 labelPosition: "top", 20071 value: contentSize || wideSize || '', 20072 onChange: nextWidth => { 20073 nextWidth = 0 > parseFloat(nextWidth) ? '0' : nextWidth; 20074 onChange({ 20075 ...layout, 20076 contentSize: nextWidth 20077 }); 20078 }, 20079 units: units, 20080 prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControlPrefixWrapper, { 20081 variant: "icon", 20082 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 20083 icon: align_none 20084 }) 20085 }) 20086 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 20087 __next40pxDefaultSize: true, 20088 label: (0,external_wp_i18n_namespaceObject.__)('Wide width'), 20089 labelPosition: "top", 20090 value: wideSize || contentSize || '', 20091 onChange: nextWidth => { 20092 nextWidth = 0 > parseFloat(nextWidth) ? '0' : nextWidth; 20093 onChange({ 20094 ...layout, 20095 wideSize: nextWidth 20096 }); 20097 }, 20098 units: units, 20099 prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControlPrefixWrapper, { 20100 variant: "icon", 20101 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 20102 icon: stretch_wide 20103 }) 20104 }) 20105 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 20106 className: "block-editor-hooks__layout-constrained-helptext", 20107 children: (0,external_wp_i18n_namespaceObject.__)('Customize the width for all elements that are assigned to the center or wide columns.') 20108 })] 20109 }), allowJustification && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 20110 __next40pxDefaultSize: true, 20111 __nextHasNoMarginBottom: true, 20112 label: (0,external_wp_i18n_namespaceObject.__)('Justification'), 20113 value: justifyContent, 20114 onChange: onJustificationChange, 20115 children: justificationOptions.map(({ 20116 value, 20117 icon, 20118 label 20119 }) => { 20120 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOptionIcon, { 20121 value: value, 20122 icon: icon, 20123 label: label 20124 }, value); 20125 }) 20126 })] 20127 }); 20128 }, 20129 toolBarControls: function DefaultLayoutToolbarControls({ 20130 layout = {}, 20131 onChange, 20132 layoutBlockSupport 20133 }) { 20134 const { 20135 allowJustification = true 20136 } = layoutBlockSupport; 20137 if (!allowJustification) { 20138 return null; 20139 } 20140 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls, { 20141 group: "block", 20142 __experimentalShareWithChildBlocks: true, 20143 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DefaultLayoutJustifyContentControl, { 20144 layout: layout, 20145 onChange: onChange 20146 }) 20147 }); 20148 }, 20149 getLayoutStyle: function getLayoutStyle({ 20150 selector, 20151 layout = {}, 20152 style, 20153 blockName, 20154 hasBlockGapSupport, 20155 layoutDefinitions = LAYOUT_DEFINITIONS 20156 }) { 20157 const { 20158 contentSize, 20159 wideSize, 20160 justifyContent 20161 } = layout; 20162 const blockGapStyleValue = getGapCSSValue(style?.spacing?.blockGap); 20163 20164 // If a block's block.json skips serialization for spacing or 20165 // spacing.blockGap, don't apply the user-defined value to the styles. 20166 let blockGapValue = ''; 20167 if (!shouldSkipSerialization(blockName, 'spacing', 'blockGap')) { 20168 // If an object is provided only use the 'top' value for this kind of gap. 20169 if (blockGapStyleValue?.top) { 20170 blockGapValue = getGapCSSValue(blockGapStyleValue?.top); 20171 } else if (typeof blockGapStyleValue === 'string') { 20172 blockGapValue = getGapCSSValue(blockGapStyleValue); 20173 } 20174 } 20175 const marginLeft = justifyContent === 'left' ? '0 !important' : 'auto !important'; 20176 const marginRight = justifyContent === 'right' ? '0 !important' : 'auto !important'; 20177 let output = !!contentSize || !!wideSize ? ` 20178 $appendSelectors(selector, '> :where(:not(.alignleft):not(.alignright):not(.alignfull))')} { 20179 max-width: $contentSize !== null && contentSize !== void 0 ? contentSize : wideSize}; 20180 margin-left: $marginLeft}; 20181 margin-right: $marginRight}; 20182 } 20183 $appendSelectors(selector, '> .alignwide')} { 20184 max-width: $wideSize !== null && wideSize !== void 0 ? wideSize : contentSize}; 20185 } 20186 $appendSelectors(selector, '> .alignfull')} { 20187 max-width: none; 20188 } 20189 ` : ''; 20190 if (justifyContent === 'left') { 20191 output += `$appendSelectors(selector, '> :where(:not(.alignleft):not(.alignright):not(.alignfull))')} 20192 { margin-left: $marginLeft}; }`; 20193 } else if (justifyContent === 'right') { 20194 output += `$appendSelectors(selector, '> :where(:not(.alignleft):not(.alignright):not(.alignfull))')} 20195 { margin-right: $marginRight}; }`; 20196 } 20197 20198 // If there is custom padding, add negative margins for alignfull blocks. 20199 if (style?.spacing?.padding) { 20200 // The style object might be storing a preset so we need to make sure we get a usable value. 20201 const paddingValues = (0,external_wp_styleEngine_namespaceObject.getCSSRules)(style); 20202 paddingValues.forEach(rule => { 20203 if (rule.key === 'paddingRight') { 20204 // Add unit if 0, to avoid calc(0 * -1) which is invalid. 20205 const paddingRightValue = rule.value === '0' ? '0px' : rule.value; 20206 output += ` 20207 $appendSelectors(selector, '> .alignfull')} { 20208 margin-right: calc($paddingRightValue} * -1); 20209 } 20210 `; 20211 } else if (rule.key === 'paddingLeft') { 20212 // Add unit if 0, to avoid calc(0 * -1) which is invalid. 20213 const paddingLeftValue = rule.value === '0' ? '0px' : rule.value; 20214 output += ` 20215 $appendSelectors(selector, '> .alignfull')} { 20216 margin-left: calc($paddingLeftValue} * -1); 20217 } 20218 `; 20219 } 20220 }); 20221 } 20222 20223 // Output blockGap styles based on rules contained in layout definitions in theme.json. 20224 if (hasBlockGapSupport && blockGapValue) { 20225 output += getBlockGapCSS(selector, layoutDefinitions, 'constrained', blockGapValue); 20226 } 20227 return output; 20228 }, 20229 getOrientation() { 20230 return 'vertical'; 20231 }, 20232 getAlignments(layout) { 20233 const alignmentInfo = getAlignmentsInfo(layout); 20234 if (layout.alignments !== undefined) { 20235 if (!layout.alignments.includes('none')) { 20236 layout.alignments.unshift('none'); 20237 } 20238 return layout.alignments.map(alignment => ({ 20239 name: alignment, 20240 info: alignmentInfo[alignment] 20241 })); 20242 } 20243 const { 20244 contentSize, 20245 wideSize 20246 } = layout; 20247 const alignments = [{ 20248 name: 'left' 20249 }, { 20250 name: 'center' 20251 }, { 20252 name: 'right' 20253 }]; 20254 if (contentSize) { 20255 alignments.unshift({ 20256 name: 'full' 20257 }); 20258 } 20259 if (wideSize) { 20260 alignments.unshift({ 20261 name: 'wide', 20262 info: alignmentInfo.wide 20263 }); 20264 } 20265 alignments.unshift({ 20266 name: 'none', 20267 info: alignmentInfo.none 20268 }); 20269 return alignments; 20270 } 20271 }); 20272 const constrained_POPOVER_PROPS = { 20273 placement: 'bottom-start' 20274 }; 20275 function DefaultLayoutJustifyContentControl({ 20276 layout, 20277 onChange 20278 }) { 20279 const { 20280 justifyContent = 'center' 20281 } = layout; 20282 const onJustificationChange = value => { 20283 onChange({ 20284 ...layout, 20285 justifyContent: value 20286 }); 20287 }; 20288 const allowedControls = ['left', 'center', 'right']; 20289 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(JustifyContentControl, { 20290 allowedControls: allowedControls, 20291 value: justifyContent, 20292 onChange: onJustificationChange, 20293 popoverProps: constrained_POPOVER_PROPS 20294 }); 20295 } 20296 20297 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/layouts/grid.js 20298 /** 20299 * WordPress dependencies 20300 */ 20301 20302 20303 20304 20305 /** 20306 * Internal dependencies 20307 */ 20308 20309 20310 20311 20312 20313 20314 20315 const RANGE_CONTROL_MAX_VALUES = { 20316 px: 600, 20317 '%': 100, 20318 vw: 100, 20319 vh: 100, 20320 em: 38, 20321 rem: 38, 20322 svw: 100, 20323 lvw: 100, 20324 dvw: 100, 20325 svh: 100, 20326 lvh: 100, 20327 dvh: 100, 20328 vi: 100, 20329 svi: 100, 20330 lvi: 100, 20331 dvi: 100, 20332 vb: 100, 20333 svb: 100, 20334 lvb: 100, 20335 dvb: 100, 20336 vmin: 100, 20337 svmin: 100, 20338 lvmin: 100, 20339 dvmin: 100, 20340 vmax: 100, 20341 svmax: 100, 20342 lvmax: 100, 20343 dvmax: 100 20344 }; 20345 const units = [{ 20346 value: 'px', 20347 label: 'px', 20348 default: 0 20349 }, { 20350 value: 'rem', 20351 label: 'rem', 20352 default: 0 20353 }, { 20354 value: 'em', 20355 label: 'em', 20356 default: 0 20357 }]; 20358 /* harmony default export */ const grid = ({ 20359 name: 'grid', 20360 label: (0,external_wp_i18n_namespaceObject.__)('Grid'), 20361 inspectorControls: function GridLayoutInspectorControls({ 20362 layout = {}, 20363 onChange, 20364 layoutBlockSupport = {} 20365 }) { 20366 const { 20367 allowSizingOnChildren = false 20368 } = layoutBlockSupport; 20369 20370 // In the experiment we want to also show column control in Auto mode, and 20371 // the minimum width control in Manual mode. 20372 const showColumnsControl = window.__experimentalEnableGridInteractivity || !!layout?.columnCount; 20373 const showMinWidthControl = window.__experimentalEnableGridInteractivity || !layout?.columnCount; 20374 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 20375 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLayoutTypeControl, { 20376 layout: layout, 20377 onChange: onChange 20378 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 20379 spacing: 4, 20380 children: [showColumnsControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLayoutColumnsAndRowsControl, { 20381 layout: layout, 20382 onChange: onChange, 20383 allowSizingOnChildren: allowSizingOnChildren 20384 }), showMinWidthControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLayoutMinimumWidthControl, { 20385 layout: layout, 20386 onChange: onChange 20387 })] 20388 })] 20389 }); 20390 }, 20391 toolBarControls: function GridLayoutToolbarControls() { 20392 return null; 20393 }, 20394 getLayoutStyle: function getLayoutStyle({ 20395 selector, 20396 layout, 20397 style, 20398 blockName, 20399 hasBlockGapSupport, 20400 layoutDefinitions = LAYOUT_DEFINITIONS 20401 }) { 20402 const { 20403 minimumColumnWidth = null, 20404 columnCount = null, 20405 rowCount = null 20406 } = layout; 20407 20408 // Check that the grid layout attributes are of the correct type, so that we don't accidentally 20409 // write code that stores a string attribute instead of a number. 20410 if (false) {} 20411 20412 // If a block's block.json skips serialization for spacing or spacing.blockGap, 20413 // don't apply the user-defined value to the styles. 20414 const blockGapValue = style?.spacing?.blockGap && !shouldSkipSerialization(blockName, 'spacing', 'blockGap') ? getGapCSSValue(style?.spacing?.blockGap, '0.5em') : undefined; 20415 let output = ''; 20416 const rules = []; 20417 if (minimumColumnWidth && columnCount > 0) { 20418 const maxValue = `max($minimumColumnWidth}, ( 100% - ($blockGapValue || '1.2rem'}*$columnCount - 1}) ) / $columnCount})`; 20419 rules.push(`grid-template-columns: repeat(auto-fill, minmax($maxValue}, 1fr))`, `container-type: inline-size`); 20420 if (rowCount) { 20421 rules.push(`grid-template-rows: repeat($rowCount}, minmax(1rem, auto))`); 20422 } 20423 } else if (columnCount) { 20424 rules.push(`grid-template-columns: repeat($columnCount}, minmax(0, 1fr))`); 20425 if (rowCount) { 20426 rules.push(`grid-template-rows: repeat($rowCount}, minmax(1rem, auto))`); 20427 } 20428 } else { 20429 rules.push(`grid-template-columns: repeat(auto-fill, minmax(min($minimumColumnWidth || '12rem'}, 100%), 1fr))`, 'container-type: inline-size'); 20430 } 20431 if (rules.length) { 20432 // Reason to disable: the extra line breaks added by prettier mess with the unit tests. 20433 // eslint-disable-next-line prettier/prettier 20434 output = `$appendSelectors(selector)} { $rules.join('; ')}; }`; 20435 } 20436 20437 // Output blockGap styles based on rules contained in layout definitions in theme.json. 20438 if (hasBlockGapSupport && blockGapValue) { 20439 output += getBlockGapCSS(selector, layoutDefinitions, 'grid', blockGapValue); 20440 } 20441 return output; 20442 }, 20443 getOrientation() { 20444 return 'horizontal'; 20445 }, 20446 getAlignments() { 20447 return []; 20448 } 20449 }); 20450 20451 // Enables setting minimum width of grid items. 20452 function GridLayoutMinimumWidthControl({ 20453 layout, 20454 onChange 20455 }) { 20456 const { 20457 minimumColumnWidth, 20458 columnCount, 20459 isManualPlacement 20460 } = layout; 20461 const defaultValue = isManualPlacement || columnCount ? null : '12rem'; 20462 const value = minimumColumnWidth || defaultValue; 20463 const [quantity, unit = 'rem'] = (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(value); 20464 const handleSliderChange = next => { 20465 onChange({ 20466 ...layout, 20467 minimumColumnWidth: [next, unit].join('') 20468 }); 20469 }; 20470 20471 // Mostly copied from HeightControl. 20472 const handleUnitChange = newUnit => { 20473 // Attempt to smooth over differences between currentUnit and newUnit. 20474 // This should slightly improve the experience of switching between unit types. 20475 let newValue; 20476 if (['em', 'rem'].includes(newUnit) && unit === 'px') { 20477 // Convert pixel value to an approximate of the new unit, assuming a root size of 16px. 20478 newValue = (quantity / 16).toFixed(2) + newUnit; 20479 } else if (['em', 'rem'].includes(unit) && newUnit === 'px') { 20480 // Convert to pixel value assuming a root size of 16px. 20481 newValue = Math.round(quantity * 16) + newUnit; 20482 } 20483 onChange({ 20484 ...layout, 20485 minimumColumnWidth: newValue 20486 }); 20487 }; 20488 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 20489 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, { 20490 as: "legend", 20491 children: (0,external_wp_i18n_namespaceObject.__)('Minimum column width') 20492 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 20493 gap: 4, 20494 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 20495 isBlock: true, 20496 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 20497 size: "__unstable-large", 20498 onChange: newValue => { 20499 onChange({ 20500 ...layout, 20501 minimumColumnWidth: newValue === '' ? undefined : newValue 20502 }); 20503 }, 20504 onUnitChange: handleUnitChange, 20505 value: value, 20506 units: units, 20507 min: 0, 20508 label: (0,external_wp_i18n_namespaceObject.__)('Minimum column width'), 20509 hideLabelFromVision: true 20510 }) 20511 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 20512 isBlock: true, 20513 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.RangeControl, { 20514 __next40pxDefaultSize: true, 20515 __nextHasNoMarginBottom: true, 20516 onChange: handleSliderChange, 20517 value: quantity || 0, 20518 min: 0, 20519 max: RANGE_CONTROL_MAX_VALUES[unit] || 600, 20520 withInputField: false, 20521 label: (0,external_wp_i18n_namespaceObject.__)('Minimum column width'), 20522 hideLabelFromVision: true 20523 }) 20524 })] 20525 })] 20526 }); 20527 } 20528 20529 // Enables setting number of grid columns 20530 function GridLayoutColumnsAndRowsControl({ 20531 layout, 20532 onChange, 20533 allowSizingOnChildren 20534 }) { 20535 // If the grid interactivity experiment is enabled, allow unsetting the column count. 20536 const defaultColumnCount = window.__experimentalEnableGridInteractivity ? undefined : 3; 20537 const { 20538 columnCount = defaultColumnCount, 20539 rowCount, 20540 isManualPlacement 20541 } = layout; 20542 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 20543 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 20544 children: [(!window.__experimentalEnableGridInteractivity || !isManualPlacement) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, { 20545 as: "legend", 20546 children: (0,external_wp_i18n_namespaceObject.__)('Columns') 20547 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 20548 gap: 4, 20549 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 20550 isBlock: true, 20551 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNumberControl, { 20552 size: "__unstable-large", 20553 onChange: value => { 20554 if (window.__experimentalEnableGridInteractivity) { 20555 // Allow unsetting the column count when in auto mode. 20556 const defaultNewColumnCount = isManualPlacement ? 1 : undefined; 20557 const newColumnCount = value === '' || value === '0' ? defaultNewColumnCount : parseInt(value, 10); 20558 onChange({ 20559 ...layout, 20560 columnCount: newColumnCount 20561 }); 20562 } else { 20563 // Don't allow unsetting the column count. 20564 const newColumnCount = value === '' || value === '0' ? 1 : parseInt(value, 10); 20565 onChange({ 20566 ...layout, 20567 columnCount: newColumnCount 20568 }); 20569 } 20570 }, 20571 value: columnCount, 20572 min: 1, 20573 label: (0,external_wp_i18n_namespaceObject.__)('Columns'), 20574 hideLabelFromVision: !window.__experimentalEnableGridInteractivity || !isManualPlacement 20575 }) 20576 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 20577 isBlock: true, 20578 children: window.__experimentalEnableGridInteractivity && allowSizingOnChildren && isManualPlacement ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNumberControl, { 20579 size: "__unstable-large", 20580 onChange: value => { 20581 // Don't allow unsetting the row count. 20582 const newRowCount = value === '' || value === '0' ? 1 : parseInt(value, 10); 20583 onChange({ 20584 ...layout, 20585 rowCount: newRowCount 20586 }); 20587 }, 20588 value: rowCount, 20589 min: 1, 20590 label: (0,external_wp_i18n_namespaceObject.__)('Rows') 20591 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.RangeControl, { 20592 __next40pxDefaultSize: true, 20593 __nextHasNoMarginBottom: true, 20594 value: columnCount !== null && columnCount !== void 0 ? columnCount : 1, 20595 onChange: value => onChange({ 20596 ...layout, 20597 columnCount: value === '' || value === '0' ? 1 : value 20598 }), 20599 min: 1, 20600 max: 16, 20601 withInputField: false, 20602 label: (0,external_wp_i18n_namespaceObject.__)('Columns'), 20603 hideLabelFromVision: true 20604 }) 20605 })] 20606 })] 20607 }) 20608 }); 20609 } 20610 20611 // Enables switching between grid types 20612 function GridLayoutTypeControl({ 20613 layout, 20614 onChange 20615 }) { 20616 const { 20617 columnCount, 20618 rowCount, 20619 minimumColumnWidth, 20620 isManualPlacement 20621 } = layout; 20622 20623 /** 20624 * When switching, temporarily save any custom values set on the 20625 * previous type so we can switch back without loss. 20626 */ 20627 const [tempColumnCount, setTempColumnCount] = (0,external_wp_element_namespaceObject.useState)(columnCount || 3); 20628 const [tempRowCount, setTempRowCount] = (0,external_wp_element_namespaceObject.useState)(rowCount); 20629 const [tempMinimumColumnWidth, setTempMinimumColumnWidth] = (0,external_wp_element_namespaceObject.useState)(minimumColumnWidth || '12rem'); 20630 const gridPlacement = isManualPlacement || !!columnCount && !window.__experimentalEnableGridInteractivity ? 'manual' : 'auto'; 20631 const onChangeType = value => { 20632 if (value === 'manual') { 20633 setTempMinimumColumnWidth(minimumColumnWidth || '12rem'); 20634 } else { 20635 setTempColumnCount(columnCount || 3); 20636 setTempRowCount(rowCount); 20637 } 20638 onChange({ 20639 ...layout, 20640 columnCount: value === 'manual' ? tempColumnCount : null, 20641 rowCount: value === 'manual' && window.__experimentalEnableGridInteractivity ? tempRowCount : undefined, 20642 isManualPlacement: value === 'manual' && window.__experimentalEnableGridInteractivity ? true : undefined, 20643 minimumColumnWidth: value === 'auto' ? tempMinimumColumnWidth : null 20644 }); 20645 }; 20646 const helpText = gridPlacement === 'manual' ? (0,external_wp_i18n_namespaceObject.__)('Grid items can be manually placed in any position on the grid.') : (0,external_wp_i18n_namespaceObject.__)('Grid items are placed automatically depending on their order.'); 20647 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 20648 __next40pxDefaultSize: true, 20649 __nextHasNoMarginBottom: true, 20650 label: (0,external_wp_i18n_namespaceObject.__)('Grid item position'), 20651 value: gridPlacement, 20652 onChange: onChangeType, 20653 isBlock: true, 20654 help: window.__experimentalEnableGridInteractivity ? helpText : undefined, 20655 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 20656 value: "auto", 20657 label: (0,external_wp_i18n_namespaceObject.__)('Auto') 20658 }, "auto"), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 20659 value: "manual", 20660 label: (0,external_wp_i18n_namespaceObject.__)('Manual') 20661 }, "manual")] 20662 }); 20663 } 20664 20665 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/layouts/index.js 20666 /** 20667 * Internal dependencies 20668 */ 20669 20670 20671 20672 20673 const layoutTypes = [flow, flex, constrained, grid]; 20674 20675 /** 20676 * Retrieves a layout type by name. 20677 * 20678 * @param {string} name - The name of the layout type. 20679 * @return {Object} Layout type. 20680 */ 20681 function getLayoutType(name = 'default') { 20682 return layoutTypes.find(layoutType => layoutType.name === name); 20683 } 20684 20685 /** 20686 * Retrieves the available layout types. 20687 * 20688 * @return {Array} Layout types. 20689 */ 20690 function getLayoutTypes() { 20691 return layoutTypes; 20692 } 20693 20694 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/layout.js 20695 /** 20696 * WordPress dependencies 20697 */ 20698 20699 20700 /** 20701 * Internal dependencies 20702 */ 20703 20704 20705 20706 const defaultLayout = { 20707 type: 'default' 20708 }; 20709 const Layout = (0,external_wp_element_namespaceObject.createContext)(defaultLayout); 20710 20711 /** 20712 * Allows to define the layout. 20713 */ 20714 const LayoutProvider = Layout.Provider; 20715 20716 /** 20717 * React hook used to retrieve the layout config. 20718 */ 20719 function useLayout() { 20720 return (0,external_wp_element_namespaceObject.useContext)(Layout); 20721 } 20722 function LayoutStyle({ 20723 layout = {}, 20724 css, 20725 ...props 20726 }) { 20727 const layoutType = getLayoutType(layout.type); 20728 const [blockGapSupport] = use_settings_useSettings('spacing.blockGap'); 20729 const hasBlockGapSupport = blockGapSupport !== null; 20730 if (layoutType) { 20731 if (css) { 20732 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("style", { 20733 children: css 20734 }); 20735 } 20736 const layoutStyle = layoutType.getLayoutStyle?.({ 20737 hasBlockGapSupport, 20738 layout, 20739 ...props 20740 }); 20741 if (layoutStyle) { 20742 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("style", { 20743 children: layoutStyle 20744 }); 20745 } 20746 } 20747 return null; 20748 } 20749 20750 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-alignment-control/use-available-alignments.js 20751 /** 20752 * WordPress dependencies 20753 */ 20754 20755 20756 /** 20757 * Internal dependencies 20758 */ 20759 20760 20761 20762 const use_available_alignments_EMPTY_ARRAY = []; 20763 const use_available_alignments_DEFAULT_CONTROLS = ['none', 'left', 'center', 'right', 'wide', 'full']; 20764 const WIDE_CONTROLS = ['wide', 'full']; 20765 function useAvailableAlignments(controls = use_available_alignments_DEFAULT_CONTROLS) { 20766 // Always add the `none` option if not exists. 20767 if (!controls.includes('none')) { 20768 controls = ['none', ...controls]; 20769 } 20770 const isNoneOnly = controls.length === 1 && controls[0] === 'none'; 20771 const [wideControlsEnabled, themeSupportsLayout, isBlockBasedTheme] = (0,external_wp_data_namespaceObject.useSelect)(select => { 20772 var _settings$alignWide; 20773 // If `isNoneOnly` is true, we'll be returning early because there is 20774 // nothing to filter on an empty array. We won't need the info from 20775 // the `useSelect` but we must call it anyway because Rules of Hooks. 20776 // So the callback returns early to avoid block editor subscription. 20777 if (isNoneOnly) { 20778 return [false, false, false]; 20779 } 20780 const settings = select(store).getSettings(); 20781 return [(_settings$alignWide = settings.alignWide) !== null && _settings$alignWide !== void 0 ? _settings$alignWide : false, settings.supportsLayout, settings.__unstableIsBlockBasedTheme]; 20782 }, [isNoneOnly]); 20783 const layout = useLayout(); 20784 if (isNoneOnly) { 20785 return use_available_alignments_EMPTY_ARRAY; 20786 } 20787 const layoutType = getLayoutType(layout?.type); 20788 if (themeSupportsLayout) { 20789 const layoutAlignments = layoutType.getAlignments(layout, isBlockBasedTheme); 20790 const alignments = layoutAlignments.filter(alignment => controls.includes(alignment.name)); 20791 // While we treat `none` as an alignment, we shouldn't return it if no 20792 // other alignments exist. 20793 if (alignments.length === 1 && alignments[0].name === 'none') { 20794 return use_available_alignments_EMPTY_ARRAY; 20795 } 20796 return alignments; 20797 } 20798 20799 // Starting here, it's the fallback for themes not supporting the layout config. 20800 if (layoutType.name !== 'default' && layoutType.name !== 'constrained') { 20801 return use_available_alignments_EMPTY_ARRAY; 20802 } 20803 const alignments = controls.filter(control => { 20804 if (layout.alignments) { 20805 return layout.alignments.includes(control); 20806 } 20807 if (!wideControlsEnabled && WIDE_CONTROLS.includes(control)) { 20808 return false; 20809 } 20810 return use_available_alignments_DEFAULT_CONTROLS.includes(control); 20811 }).map(name => ({ 20812 name 20813 })); 20814 20815 // While we treat `none` as an alignment, we shouldn't return it if no 20816 // other alignments exist. 20817 if (alignments.length === 1 && alignments[0].name === 'none') { 20818 return use_available_alignments_EMPTY_ARRAY; 20819 } 20820 return alignments; 20821 } 20822 20823 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/position-left.js 20824 /** 20825 * WordPress dependencies 20826 */ 20827 20828 20829 const positionLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 20830 xmlns: "http://www.w3.org/2000/svg", 20831 viewBox: "0 0 24 24", 20832 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 20833 d: "M5 5.5h8V4H5v1.5ZM5 20h8v-1.5H5V20ZM19 9H5v6h14V9Z" 20834 }) 20835 }); 20836 /* harmony default export */ const position_left = (positionLeft); 20837 20838 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/position-center.js 20839 /** 20840 * WordPress dependencies 20841 */ 20842 20843 20844 const positionCenter = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 20845 xmlns: "http://www.w3.org/2000/svg", 20846 viewBox: "0 0 24 24", 20847 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 20848 d: "M19 5.5H5V4h14v1.5ZM19 20H5v-1.5h14V20ZM7 9h10v6H7V9Z" 20849 }) 20850 }); 20851 /* harmony default export */ const position_center = (positionCenter); 20852 20853 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/position-right.js 20854 /** 20855 * WordPress dependencies 20856 */ 20857 20858 20859 const positionRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 20860 xmlns: "http://www.w3.org/2000/svg", 20861 viewBox: "0 0 24 24", 20862 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 20863 d: "M19 5.5h-8V4h8v1.5ZM19 20h-8v-1.5h8V20ZM5 9h14v6H5V9Z" 20864 }) 20865 }); 20866 /* harmony default export */ const position_right = (positionRight); 20867 20868 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/stretch-full-width.js 20869 /** 20870 * WordPress dependencies 20871 */ 20872 20873 20874 const stretchFullWidth = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 20875 xmlns: "http://www.w3.org/2000/svg", 20876 viewBox: "0 0 24 24", 20877 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 20878 d: "M5 4h14v11H5V4Zm11 16H8v-1.5h8V20Z" 20879 }) 20880 }); 20881 /* harmony default export */ const stretch_full_width = (stretchFullWidth); 20882 20883 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-alignment-control/constants.js 20884 /** 20885 * WordPress dependencies 20886 */ 20887 20888 20889 const constants_BLOCK_ALIGNMENTS_CONTROLS = { 20890 none: { 20891 icon: align_none, 20892 title: (0,external_wp_i18n_namespaceObject._x)('None', 'Alignment option') 20893 }, 20894 left: { 20895 icon: position_left, 20896 title: (0,external_wp_i18n_namespaceObject.__)('Align left') 20897 }, 20898 center: { 20899 icon: position_center, 20900 title: (0,external_wp_i18n_namespaceObject.__)('Align center') 20901 }, 20902 right: { 20903 icon: position_right, 20904 title: (0,external_wp_i18n_namespaceObject.__)('Align right') 20905 }, 20906 wide: { 20907 icon: stretch_wide, 20908 title: (0,external_wp_i18n_namespaceObject.__)('Wide width') 20909 }, 20910 full: { 20911 icon: stretch_full_width, 20912 title: (0,external_wp_i18n_namespaceObject.__)('Full width') 20913 } 20914 }; 20915 const constants_DEFAULT_CONTROL = 'none'; 20916 20917 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-alignment-control/ui.js 20918 /** 20919 * External dependencies 20920 */ 20921 20922 20923 /** 20924 * WordPress dependencies 20925 */ 20926 20927 20928 20929 /** 20930 * Internal dependencies 20931 */ 20932 20933 20934 20935 20936 function BlockAlignmentUI({ 20937 value, 20938 onChange, 20939 controls, 20940 isToolbar, 20941 isCollapsed = true 20942 }) { 20943 const enabledControls = useAvailableAlignments(controls); 20944 const hasEnabledControls = !!enabledControls.length; 20945 if (!hasEnabledControls) { 20946 return null; 20947 } 20948 function onChangeAlignment(align) { 20949 onChange([value, 'none'].includes(align) ? undefined : align); 20950 } 20951 const activeAlignmentControl = constants_BLOCK_ALIGNMENTS_CONTROLS[value]; 20952 const defaultAlignmentControl = constants_BLOCK_ALIGNMENTS_CONTROLS[constants_DEFAULT_CONTROL]; 20953 const UIComponent = isToolbar ? external_wp_components_namespaceObject.ToolbarGroup : external_wp_components_namespaceObject.ToolbarDropdownMenu; 20954 const commonProps = { 20955 icon: activeAlignmentControl ? activeAlignmentControl.icon : defaultAlignmentControl.icon, 20956 label: (0,external_wp_i18n_namespaceObject.__)('Align') 20957 }; 20958 const extraProps = isToolbar ? { 20959 isCollapsed, 20960 controls: enabledControls.map(({ 20961 name: controlName 20962 }) => { 20963 return { 20964 ...constants_BLOCK_ALIGNMENTS_CONTROLS[controlName], 20965 isActive: value === controlName || !value && controlName === 'none', 20966 role: isCollapsed ? 'menuitemradio' : undefined, 20967 onClick: () => onChangeAlignment(controlName) 20968 }; 20969 }) 20970 } : { 20971 toggleProps: { 20972 description: (0,external_wp_i18n_namespaceObject.__)('Change alignment') 20973 }, 20974 children: ({ 20975 onClose 20976 }) => { 20977 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 20978 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 20979 className: "block-editor-block-alignment-control__menu-group", 20980 children: enabledControls.map(({ 20981 name: controlName, 20982 info 20983 }) => { 20984 const { 20985 icon, 20986 title 20987 } = constants_BLOCK_ALIGNMENTS_CONTROLS[controlName]; 20988 // If no value is provided, mark as selected the `none` option. 20989 const isSelected = controlName === value || !value && controlName === 'none'; 20990 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 20991 icon: icon, 20992 iconPosition: "left", 20993 className: dist_clsx('components-dropdown-menu__menu-item', { 20994 'is-active': isSelected 20995 }), 20996 isSelected: isSelected, 20997 onClick: () => { 20998 onChangeAlignment(controlName); 20999 onClose(); 21000 }, 21001 role: "menuitemradio", 21002 info: info, 21003 children: title 21004 }, controlName); 21005 }) 21006 }) 21007 }); 21008 } 21009 }; 21010 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(UIComponent, { 21011 ...commonProps, 21012 ...extraProps 21013 }); 21014 } 21015 /* harmony default export */ const block_alignment_control_ui = (BlockAlignmentUI); 21016 21017 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-alignment-control/index.js 21018 /** 21019 * Internal dependencies 21020 */ 21021 21022 21023 const BlockAlignmentControl = props => { 21024 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_alignment_control_ui, { 21025 ...props, 21026 isToolbar: false 21027 }); 21028 }; 21029 const BlockAlignmentToolbar = props => { 21030 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_alignment_control_ui, { 21031 ...props, 21032 isToolbar: true 21033 }); 21034 }; 21035 21036 /** 21037 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-alignment-control/README.md 21038 */ 21039 21040 21041 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-editing-mode/index.js 21042 /** 21043 * WordPress dependencies 21044 */ 21045 21046 21047 21048 /** 21049 * Internal dependencies 21050 */ 21051 21052 21053 21054 /** 21055 * @typedef {'disabled'|'contentOnly'|'default'} BlockEditingMode 21056 */ 21057 21058 /** 21059 * Allows a block to restrict the user interface that is displayed for editing 21060 * that block and its inner blocks. 21061 * 21062 * @example 21063 * ```js 21064 * function MyBlock( { attributes, setAttributes } ) { 21065 * useBlockEditingMode( 'disabled' ); 21066 * return <div { ...useBlockProps() }></div>; 21067 * } 21068 * ``` 21069 * 21070 * `mode` can be one of three options: 21071 * 21072 * - `'disabled'`: Prevents editing the block entirely, i.e. it cannot be 21073 * selected. 21074 * - `'contentOnly'`: Hides all non-content UI, e.g. auxiliary controls in the 21075 * toolbar, the block movers, block settings. 21076 * - `'default'`: Allows editing the block as normal. 21077 * 21078 * The mode is inherited by all of the block's inner blocks, unless they have 21079 * their own mode. 21080 * 21081 * If called outside of a block context, the mode is applied to all blocks. 21082 * 21083 * @param {?BlockEditingMode} mode The editing mode to apply. If undefined, the 21084 * current editing mode is not changed. 21085 * 21086 * @return {BlockEditingMode} The current editing mode. 21087 */ 21088 function useBlockEditingMode(mode) { 21089 const context = useBlockEditContext(); 21090 const { 21091 clientId = '' 21092 } = context; 21093 const { 21094 setBlockEditingMode, 21095 unsetBlockEditingMode 21096 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 21097 const globalBlockEditingMode = (0,external_wp_data_namespaceObject.useSelect)(select => 21098 // Avoid adding the subscription if not needed! 21099 clientId ? null : select(store).getBlockEditingMode(), [clientId]); 21100 (0,external_wp_element_namespaceObject.useEffect)(() => { 21101 if (mode) { 21102 setBlockEditingMode(clientId, mode); 21103 } 21104 return () => { 21105 if (mode) { 21106 unsetBlockEditingMode(clientId); 21107 } 21108 }; 21109 }, [clientId, mode, setBlockEditingMode, unsetBlockEditingMode]); 21110 return clientId ? context[blockEditingModeKey] : globalBlockEditingMode; 21111 } 21112 21113 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/align.js 21114 /** 21115 * External dependencies 21116 */ 21117 21118 21119 /** 21120 * WordPress dependencies 21121 */ 21122 21123 21124 21125 /** 21126 * Internal dependencies 21127 */ 21128 21129 21130 21131 21132 /** 21133 * An array which includes all possible valid alignments, 21134 * used to validate if an alignment is valid or not. 21135 * 21136 * @constant 21137 * @type {string[]} 21138 */ 21139 21140 const ALL_ALIGNMENTS = ['left', 'center', 'right', 'wide', 'full']; 21141 21142 /** 21143 * An array which includes all wide alignments. 21144 * In order for this alignments to be valid they need to be supported by the block, 21145 * and by the theme. 21146 * 21147 * @constant 21148 * @type {string[]} 21149 */ 21150 const WIDE_ALIGNMENTS = ['wide', 'full']; 21151 21152 /** 21153 * Returns the valid alignments. 21154 * Takes into consideration the aligns supported by a block, if the block supports wide controls or not and if theme supports wide controls or not. 21155 * Exported just for testing purposes, not exported outside the module. 21156 * 21157 * @param {?boolean|string[]} blockAlign Aligns supported by the block. 21158 * @param {?boolean} hasWideBlockSupport True if block supports wide alignments. And False otherwise. 21159 * @param {?boolean} hasWideEnabled True if theme supports wide alignments. And False otherwise. 21160 * 21161 * @return {string[]} Valid alignments. 21162 */ 21163 function getValidAlignments(blockAlign, hasWideBlockSupport = true, hasWideEnabled = true) { 21164 let validAlignments; 21165 if (Array.isArray(blockAlign)) { 21166 validAlignments = ALL_ALIGNMENTS.filter(value => blockAlign.includes(value)); 21167 } else if (blockAlign === true) { 21168 // `true` includes all alignments... 21169 validAlignments = [...ALL_ALIGNMENTS]; 21170 } else { 21171 validAlignments = []; 21172 } 21173 if (!hasWideEnabled || blockAlign === true && !hasWideBlockSupport) { 21174 return validAlignments.filter(alignment => !WIDE_ALIGNMENTS.includes(alignment)); 21175 } 21176 return validAlignments; 21177 } 21178 21179 /** 21180 * Filters registered block settings, extending attributes to include `align`. 21181 * 21182 * @param {Object} settings Original block settings. 21183 * 21184 * @return {Object} Filtered block settings. 21185 */ 21186 function addAttribute(settings) { 21187 var _settings$attributes$; 21188 // Allow blocks to specify their own attribute definition with default values if needed. 21189 if ('type' in ((_settings$attributes$ = settings.attributes?.align) !== null && _settings$attributes$ !== void 0 ? _settings$attributes$ : {})) { 21190 return settings; 21191 } 21192 if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, 'align')) { 21193 // Gracefully handle if settings.attributes is undefined. 21194 settings.attributes = { 21195 ...settings.attributes, 21196 align: { 21197 type: 'string', 21198 // Allow for '' since it is used by the `updateAlignment` function 21199 // in toolbar controls for special cases with defined default values. 21200 enum: [...ALL_ALIGNMENTS, ''] 21201 } 21202 }; 21203 } 21204 return settings; 21205 } 21206 function BlockEditAlignmentToolbarControlsPure({ 21207 name: blockName, 21208 align, 21209 setAttributes 21210 }) { 21211 // Compute the block valid alignments by taking into account, 21212 // if the theme supports wide alignments or not and the layout's 21213 // available alignments. We do that for conditionally rendering 21214 // Slot. 21215 const blockAllowedAlignments = getValidAlignments((0,external_wp_blocks_namespaceObject.getBlockSupport)(blockName, 'align'), (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockName, 'alignWide', true)); 21216 const validAlignments = useAvailableAlignments(blockAllowedAlignments).map(({ 21217 name 21218 }) => name); 21219 const blockEditingMode = useBlockEditingMode(); 21220 if (!validAlignments.length || blockEditingMode !== 'default') { 21221 return null; 21222 } 21223 const updateAlignment = nextAlign => { 21224 if (!nextAlign) { 21225 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockName); 21226 const blockDefaultAlign = blockType?.attributes?.align?.default; 21227 if (blockDefaultAlign) { 21228 nextAlign = ''; 21229 } 21230 } 21231 setAttributes({ 21232 align: nextAlign 21233 }); 21234 }; 21235 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls, { 21236 group: "block", 21237 __experimentalShareWithChildBlocks: true, 21238 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockAlignmentControl, { 21239 value: align, 21240 onChange: updateAlignment, 21241 controls: validAlignments 21242 }) 21243 }); 21244 } 21245 /* harmony default export */ const align = ({ 21246 shareWithChildBlocks: true, 21247 edit: BlockEditAlignmentToolbarControlsPure, 21248 useBlockProps, 21249 addSaveProps: addAssignedAlign, 21250 attributeKeys: ['align'], 21251 hasSupport(name) { 21252 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, 'align', false); 21253 } 21254 }); 21255 function useBlockProps({ 21256 name, 21257 align 21258 }) { 21259 const blockAllowedAlignments = getValidAlignments((0,external_wp_blocks_namespaceObject.getBlockSupport)(name, 'align'), (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, 'alignWide', true)); 21260 const validAlignments = useAvailableAlignments(blockAllowedAlignments); 21261 if (validAlignments.some(alignment => alignment.name === align)) { 21262 return { 21263 'data-align': align 21264 }; 21265 } 21266 return {}; 21267 } 21268 21269 /** 21270 * Override props assigned to save component to inject alignment class name if 21271 * block supports it. 21272 * 21273 * @param {Object} props Additional props applied to save element. 21274 * @param {Object} blockType Block type. 21275 * @param {Object} attributes Block attributes. 21276 * 21277 * @return {Object} Filtered props applied to save element. 21278 */ 21279 function addAssignedAlign(props, blockType, attributes) { 21280 const { 21281 align 21282 } = attributes; 21283 const blockAlign = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, 'align'); 21284 const hasWideBlockSupport = (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'alignWide', true); 21285 21286 // Compute valid alignments without taking into account if 21287 // the theme supports wide alignments or not. 21288 // This way changing themes does not impact the block save. 21289 const isAlignValid = getValidAlignments(blockAlign, hasWideBlockSupport).includes(align); 21290 if (isAlignValid) { 21291 props.className = dist_clsx(`align$align}`, props.className); 21292 } 21293 return props; 21294 } 21295 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/editor/align/addAttribute', addAttribute); 21296 21297 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls/groups.js 21298 /** 21299 * WordPress dependencies 21300 */ 21301 21302 const InspectorControlsDefault = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControls'); 21303 const InspectorControlsAdvanced = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorAdvancedControls'); 21304 const InspectorControlsBindings = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsBindings'); 21305 const InspectorControlsBackground = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsBackground'); 21306 const InspectorControlsBorder = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsBorder'); 21307 const InspectorControlsColor = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsColor'); 21308 const InspectorControlsFilter = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsFilter'); 21309 const InspectorControlsDimensions = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsDimensions'); 21310 const InspectorControlsPosition = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsPosition'); 21311 const InspectorControlsTypography = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsTypography'); 21312 const InspectorControlsListView = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsListView'); 21313 const InspectorControlsStyles = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsStyles'); 21314 const InspectorControlsEffects = (0,external_wp_components_namespaceObject.createSlotFill)('InspectorControlsEffects'); 21315 const groups_groups = { 21316 default: InspectorControlsDefault, 21317 advanced: InspectorControlsAdvanced, 21318 background: InspectorControlsBackground, 21319 bindings: InspectorControlsBindings, 21320 border: InspectorControlsBorder, 21321 color: InspectorControlsColor, 21322 dimensions: InspectorControlsDimensions, 21323 effects: InspectorControlsEffects, 21324 filter: InspectorControlsFilter, 21325 list: InspectorControlsListView, 21326 position: InspectorControlsPosition, 21327 settings: InspectorControlsDefault, 21328 // Alias for default. 21329 styles: InspectorControlsStyles, 21330 typography: InspectorControlsTypography 21331 }; 21332 /* harmony default export */ const inspector_controls_groups = (groups_groups); 21333 21334 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls/fill.js 21335 /** 21336 * WordPress dependencies 21337 */ 21338 21339 21340 21341 21342 21343 /** 21344 * Internal dependencies 21345 */ 21346 21347 21348 21349 function InspectorControlsFill({ 21350 children, 21351 group = 'default', 21352 __experimentalGroup, 21353 resetAllFilter 21354 }) { 21355 if (__experimentalGroup) { 21356 external_wp_deprecated_default()('`__experimentalGroup` property in `InspectorControlsFill`', { 21357 since: '6.2', 21358 version: '6.4', 21359 alternative: '`group`' 21360 }); 21361 group = __experimentalGroup; 21362 } 21363 const context = useBlockEditContext(); 21364 const Fill = inspector_controls_groups[group]?.Fill; 21365 if (!Fill) { 21366 true ? external_wp_warning_default()(`Unknown InspectorControls group "$group}" provided.`) : 0; 21367 return null; 21368 } 21369 if (!context[mayDisplayControlsKey]) { 21370 return null; 21371 } 21372 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalStyleProvider, { 21373 document: document, 21374 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Fill, { 21375 children: fillProps => { 21376 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ToolsPanelInspectorControl, { 21377 fillProps: fillProps, 21378 children: children, 21379 resetAllFilter: resetAllFilter 21380 }); 21381 } 21382 }) 21383 }); 21384 } 21385 function RegisterResetAll({ 21386 resetAllFilter, 21387 children 21388 }) { 21389 const { 21390 registerResetAllFilter, 21391 deregisterResetAllFilter 21392 } = (0,external_wp_element_namespaceObject.useContext)(external_wp_components_namespaceObject.__experimentalToolsPanelContext); 21393 (0,external_wp_element_namespaceObject.useEffect)(() => { 21394 if (resetAllFilter && registerResetAllFilter && deregisterResetAllFilter) { 21395 registerResetAllFilter(resetAllFilter); 21396 return () => { 21397 deregisterResetAllFilter(resetAllFilter); 21398 }; 21399 } 21400 }, [resetAllFilter, registerResetAllFilter, deregisterResetAllFilter]); 21401 return children; 21402 } 21403 function ToolsPanelInspectorControl({ 21404 children, 21405 resetAllFilter, 21406 fillProps 21407 }) { 21408 // `fillProps.forwardedContext` is an array of context provider entries, provided by slot, 21409 // that should wrap the fill markup. 21410 const { 21411 forwardedContext = [] 21412 } = fillProps; 21413 21414 // Children passed to InspectorControlsFill will not have 21415 // access to any React Context whose Provider is part of 21416 // the InspectorControlsSlot tree. So we re-create the 21417 // Provider in this subtree. 21418 const innerMarkup = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RegisterResetAll, { 21419 resetAllFilter: resetAllFilter, 21420 children: children 21421 }); 21422 return forwardedContext.reduce((inner, [Provider, props]) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Provider, { 21423 ...props, 21424 children: inner 21425 }), innerMarkup); 21426 } 21427 21428 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls/block-support-tools-panel.js 21429 /** 21430 * WordPress dependencies 21431 */ 21432 21433 21434 21435 21436 /** 21437 * Internal dependencies 21438 */ 21439 21440 21441 21442 21443 function BlockSupportToolsPanel({ 21444 children, 21445 group, 21446 label 21447 }) { 21448 const { 21449 updateBlockAttributes 21450 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 21451 const { 21452 getBlockAttributes, 21453 getMultiSelectedBlockClientIds, 21454 getSelectedBlockClientId, 21455 hasMultiSelection 21456 } = (0,external_wp_data_namespaceObject.useSelect)(store); 21457 const dropdownMenuProps = useToolsPanelDropdownMenuProps(); 21458 const panelId = getSelectedBlockClientId(); 21459 const resetAll = (0,external_wp_element_namespaceObject.useCallback)((resetFilters = []) => { 21460 const newAttributes = {}; 21461 const clientIds = hasMultiSelection() ? getMultiSelectedBlockClientIds() : [panelId]; 21462 clientIds.forEach(clientId => { 21463 const { 21464 style 21465 } = getBlockAttributes(clientId); 21466 let newBlockAttributes = { 21467 style 21468 }; 21469 resetFilters.forEach(resetFilter => { 21470 newBlockAttributes = { 21471 ...newBlockAttributes, 21472 ...resetFilter(newBlockAttributes) 21473 }; 21474 }); 21475 21476 // Enforce a cleaned style object. 21477 newBlockAttributes = { 21478 ...newBlockAttributes, 21479 style: utils_cleanEmptyObject(newBlockAttributes.style) 21480 }; 21481 newAttributes[clientId] = newBlockAttributes; 21482 }); 21483 updateBlockAttributes(clientIds, newAttributes, true); 21484 }, [getBlockAttributes, getMultiSelectedBlockClientIds, hasMultiSelection, panelId, updateBlockAttributes]); 21485 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 21486 className: `$group}-block-support-panel`, 21487 label: label, 21488 resetAll: resetAll, 21489 panelId: panelId, 21490 hasInnerWrapper: true, 21491 shouldRenderPlaceholderItems: true // Required to maintain fills ordering. 21492 , 21493 __experimentalFirstVisibleItemClass: "first", 21494 __experimentalLastVisibleItemClass: "last", 21495 dropdownMenuProps: dropdownMenuProps, 21496 children: children 21497 }, panelId); 21498 } 21499 21500 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls/block-support-slot-container.js 21501 /** 21502 * WordPress dependencies 21503 */ 21504 21505 21506 21507 function BlockSupportSlotContainer({ 21508 Slot, 21509 fillProps, 21510 ...props 21511 }) { 21512 // Add the toolspanel context provider and value to existing fill props 21513 const toolsPanelContext = (0,external_wp_element_namespaceObject.useContext)(external_wp_components_namespaceObject.__experimentalToolsPanelContext); 21514 const computedFillProps = (0,external_wp_element_namespaceObject.useMemo)(() => { 21515 var _fillProps$forwardedC; 21516 return { 21517 ...(fillProps !== null && fillProps !== void 0 ? fillProps : {}), 21518 forwardedContext: [...((_fillProps$forwardedC = fillProps?.forwardedContext) !== null && _fillProps$forwardedC !== void 0 ? _fillProps$forwardedC : []), [external_wp_components_namespaceObject.__experimentalToolsPanelContext.Provider, { 21519 value: toolsPanelContext 21520 }]] 21521 }; 21522 }, [toolsPanelContext, fillProps]); 21523 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Slot, { 21524 ...props, 21525 fillProps: computedFillProps, 21526 bubblesVirtually: true 21527 }); 21528 } 21529 21530 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls/slot.js 21531 /** 21532 * WordPress dependencies 21533 */ 21534 21535 21536 21537 21538 21539 /** 21540 * Internal dependencies 21541 */ 21542 21543 21544 21545 21546 function InspectorControlsSlot({ 21547 __experimentalGroup, 21548 group = 'default', 21549 label, 21550 fillProps, 21551 ...props 21552 }) { 21553 if (__experimentalGroup) { 21554 external_wp_deprecated_default()('`__experimentalGroup` property in `InspectorControlsSlot`', { 21555 since: '6.2', 21556 version: '6.4', 21557 alternative: '`group`' 21558 }); 21559 group = __experimentalGroup; 21560 } 21561 const Slot = inspector_controls_groups[group]?.Slot; 21562 const fills = (0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(Slot?.__unstableName); 21563 const motionContextValue = (0,external_wp_element_namespaceObject.useContext)(external_wp_components_namespaceObject.__unstableMotionContext); 21564 const computedFillProps = (0,external_wp_element_namespaceObject.useMemo)(() => { 21565 var _fillProps$forwardedC; 21566 return { 21567 ...(fillProps !== null && fillProps !== void 0 ? fillProps : {}), 21568 forwardedContext: [...((_fillProps$forwardedC = fillProps?.forwardedContext) !== null && _fillProps$forwardedC !== void 0 ? _fillProps$forwardedC : []), [external_wp_components_namespaceObject.__unstableMotionContext.Provider, { 21569 value: motionContextValue 21570 }]] 21571 }; 21572 }, [motionContextValue, fillProps]); 21573 if (!Slot) { 21574 true ? external_wp_warning_default()(`Unknown InspectorControls group "$group}" provided.`) : 0; 21575 return null; 21576 } 21577 if (!fills?.length) { 21578 return null; 21579 } 21580 if (label) { 21581 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockSupportToolsPanel, { 21582 group: group, 21583 label: label, 21584 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockSupportSlotContainer, { 21585 ...props, 21586 fillProps: computedFillProps, 21587 Slot: Slot 21588 }) 21589 }); 21590 } 21591 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Slot, { 21592 ...props, 21593 fillProps: computedFillProps, 21594 bubblesVirtually: true 21595 }); 21596 } 21597 21598 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls/index.js 21599 /** 21600 * Internal dependencies 21601 */ 21602 21603 21604 21605 const InspectorControls = InspectorControlsFill; 21606 InspectorControls.Slot = InspectorControlsSlot; 21607 21608 // This is just here for backward compatibility. 21609 const InspectorAdvancedControls = props => { 21610 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InspectorControlsFill, { 21611 ...props, 21612 group: "advanced" 21613 }); 21614 }; 21615 InspectorAdvancedControls.Slot = props => { 21616 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InspectorControlsSlot, { 21617 ...props, 21618 group: "advanced" 21619 }); 21620 }; 21621 InspectorAdvancedControls.slotName = 'InspectorAdvancedControls'; 21622 21623 /** 21624 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/inspector-controls/README.md 21625 */ 21626 /* harmony default export */ const inspector_controls = (InspectorControls); 21627 21628 ;// CONCATENATED MODULE: external ["wp","url"] 21629 const external_wp_url_namespaceObject = window["wp"]["url"]; 21630 ;// CONCATENATED MODULE: external ["wp","dom"] 21631 const external_wp_dom_namespaceObject = window["wp"]["dom"]; 21632 ;// CONCATENATED MODULE: external ["wp","blob"] 21633 const external_wp_blob_namespaceObject = window["wp"]["blob"]; 21634 ;// CONCATENATED MODULE: external ["wp","keycodes"] 21635 const external_wp_keycodes_namespaceObject = window["wp"]["keycodes"]; 21636 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/media.js 21637 /** 21638 * WordPress dependencies 21639 */ 21640 21641 21642 21643 const media = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { 21644 xmlns: "http://www.w3.org/2000/svg", 21645 viewBox: "0 0 24 24", 21646 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 21647 d: "m7 6.5 4 2.5-4 2.5z" 21648 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 21649 fillRule: "evenodd", 21650 clipRule: "evenodd", 21651 d: "m5 3c-1.10457 0-2 .89543-2 2v14c0 1.1046.89543 2 2 2h14c1.1046 0 2-.8954 2-2v-14c0-1.10457-.8954-2-2-2zm14 1.5h-14c-.27614 0-.5.22386-.5.5v10.7072l3.62953-2.6465c.25108-.1831.58905-.1924.84981-.0234l2.92666 1.8969 3.5712-3.4719c.2911-.2831.7545-.2831 1.0456 0l2.9772 2.8945v-9.3568c0-.27614-.2239-.5-.5-.5zm-14.5 14.5v-1.4364l4.09643-2.987 2.99567 1.9417c.2936.1903.6798.1523.9307-.0917l3.4772-3.3806 3.4772 3.3806.0228-.0234v2.5968c0 .2761-.2239.5-.5.5h-14c-.27614 0-.5-.2239-.5-.5z" 21652 })] 21653 }); 21654 /* harmony default export */ const library_media = (media); 21655 21656 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/upload.js 21657 /** 21658 * WordPress dependencies 21659 */ 21660 21661 21662 const upload = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 21663 xmlns: "http://www.w3.org/2000/svg", 21664 viewBox: "0 0 24 24", 21665 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 21666 d: "M18.5 15v3.5H13V6.7l4.5 4.1 1-1.1-6.2-5.8-5.8 5.8 1 1.1 4-4v11.7h-6V15H4v5h16v-5z" 21667 }) 21668 }); 21669 /* harmony default export */ const library_upload = (upload); 21670 21671 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/post-featured-image.js 21672 /** 21673 * WordPress dependencies 21674 */ 21675 21676 21677 const postFeaturedImage = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 21678 xmlns: "http://www.w3.org/2000/svg", 21679 viewBox: "0 0 24 24", 21680 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 21681 d: "M19 3H5c-.6 0-1 .4-1 1v7c0 .5.4 1 1 1h14c.5 0 1-.4 1-1V4c0-.6-.4-1-1-1zM5.5 10.5v-.4l1.8-1.3 1.3.8c.3.2.7.2.9-.1L11 8.1l2.4 2.4H5.5zm13 0h-2.9l-4-4c-.3-.3-.8-.3-1.1 0L8.9 8l-1.2-.8c-.3-.2-.6-.2-.9 0l-1.3 1V4.5h13v6zM4 20h9v-1.5H4V20zm0-4h16v-1.5H4V16z" 21682 }) 21683 }); 21684 /* harmony default export */ const post_featured_image = (postFeaturedImage); 21685 21686 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/media-upload/index.js 21687 /** 21688 * WordPress dependencies 21689 */ 21690 21691 21692 /** 21693 * This is a placeholder for the media upload component necessary to make it possible to provide 21694 * an integration with the core blocks that handle media files. By default it renders nothing but 21695 * it provides a way to have it overridden with the `editor.MediaUpload` filter. 21696 * 21697 * @return {Component} The component to be rendered. 21698 */ 21699 const MediaUpload = () => null; 21700 21701 /** 21702 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/media-upload/README.md 21703 */ 21704 /* harmony default export */ const media_upload = ((0,external_wp_components_namespaceObject.withFilters)('editor.MediaUpload')(MediaUpload)); 21705 21706 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/media-upload/check.js 21707 /** 21708 * WordPress dependencies 21709 */ 21710 21711 21712 /** 21713 * Internal dependencies 21714 */ 21715 21716 function MediaUploadCheck({ 21717 fallback = null, 21718 children 21719 }) { 21720 const hasUploadPermissions = (0,external_wp_data_namespaceObject.useSelect)(select => { 21721 const { 21722 getSettings 21723 } = select(store); 21724 return !!getSettings().mediaUpload; 21725 }, []); 21726 return hasUploadPermissions ? children : fallback; 21727 } 21728 21729 /** 21730 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/media-upload/README.md 21731 */ 21732 /* harmony default export */ const check = (MediaUploadCheck); 21733 21734 ;// CONCATENATED MODULE: external ["wp","isShallowEqual"] 21735 const external_wp_isShallowEqual_namespaceObject = window["wp"]["isShallowEqual"]; 21736 var external_wp_isShallowEqual_default = /*#__PURE__*/__webpack_require__.n(external_wp_isShallowEqual_namespaceObject); 21737 ;// CONCATENATED MODULE: external ["wp","preferences"] 21738 const external_wp_preferences_namespaceObject = window["wp"]["preferences"]; 21739 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/keyboard-return.js 21740 /** 21741 * WordPress dependencies 21742 */ 21743 21744 21745 const keyboardReturn = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 21746 xmlns: "http://www.w3.org/2000/svg", 21747 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 21748 d: "m6.734 16.106 2.176-2.38-1.093-1.028-3.846 4.158 3.846 4.158 1.093-1.028-2.176-2.38h2.811c1.125 0 2.25.03 3.374 0 1.428-.001 3.362-.25 4.963-1.277 1.66-1.065 2.868-2.906 2.868-5.859 0-2.479-1.327-4.896-3.65-5.93-1.82-.813-3.044-.8-4.806-.788l-.567.002v1.5c.184 0 .368 0 .553-.002 1.82-.007 2.704-.014 4.21.657 1.854.827 2.76 2.657 2.76 4.561 0 2.472-.973 3.824-2.178 4.596-1.258.807-2.864 1.04-4.163 1.04h-.02c-1.115.03-2.229 0-3.344 0H6.734Z" 21749 }) 21750 }); 21751 /* harmony default export */ const keyboard_return = (keyboardReturn); 21752 21753 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-left-small.js 21754 /** 21755 * WordPress dependencies 21756 */ 21757 21758 21759 const chevronLeftSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 21760 xmlns: "http://www.w3.org/2000/svg", 21761 viewBox: "0 0 24 24", 21762 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 21763 d: "m13.1 16-3.4-4 3.4-4 1.1 1-2.6 3 2.6 3-1.1 1z" 21764 }) 21765 }); 21766 /* harmony default export */ const chevron_left_small = (chevronLeftSmall); 21767 21768 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-right-small.js 21769 /** 21770 * WordPress dependencies 21771 */ 21772 21773 21774 const chevronRightSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 21775 xmlns: "http://www.w3.org/2000/svg", 21776 viewBox: "0 0 24 24", 21777 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 21778 d: "M10.8622 8.04053L14.2805 12.0286L10.8622 16.0167L9.72327 15.0405L12.3049 12.0286L9.72327 9.01672L10.8622 8.04053Z" 21779 }) 21780 }); 21781 /* harmony default export */ const chevron_right_small = (chevronRightSmall); 21782 21783 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/settings-drawer.js 21784 /** 21785 * WordPress dependencies 21786 */ 21787 21788 21789 21790 21791 21792 21793 21794 21795 function LinkSettingsDrawer({ 21796 children, 21797 settingsOpen, 21798 setSettingsOpen 21799 }) { 21800 const prefersReducedMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); 21801 const MaybeAnimatePresence = prefersReducedMotion ? external_wp_element_namespaceObject.Fragment : external_wp_components_namespaceObject.__unstableAnimatePresence; 21802 const MaybeMotionDiv = prefersReducedMotion ? 'div' : external_wp_components_namespaceObject.__unstableMotion.div; 21803 const id = (0,external_wp_compose_namespaceObject.useInstanceId)(LinkSettingsDrawer); 21804 const settingsDrawerId = `link-control-settings-drawer-$id}`; 21805 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 21806 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 21807 __next40pxDefaultSize: true, 21808 className: "block-editor-link-control__drawer-toggle", 21809 "aria-expanded": settingsOpen, 21810 onClick: () => setSettingsOpen(!settingsOpen), 21811 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_left_small : chevron_right_small, 21812 "aria-controls": settingsDrawerId, 21813 children: (0,external_wp_i18n_namespaceObject._x)('Advanced', 'Additional link settings') 21814 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MaybeAnimatePresence, { 21815 children: settingsOpen && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MaybeMotionDiv, { 21816 className: "block-editor-link-control__drawer", 21817 hidden: !settingsOpen, 21818 id: settingsDrawerId, 21819 initial: "collapsed", 21820 animate: "open", 21821 exit: "collapsed", 21822 variants: { 21823 open: { 21824 opacity: 1, 21825 height: 'auto' 21826 }, 21827 collapsed: { 21828 opacity: 0, 21829 height: 0 21830 } 21831 }, 21832 transition: { 21833 duration: 0.1 21834 }, 21835 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 21836 className: "block-editor-link-control__drawer-inner", 21837 children: children 21838 }) 21839 }) 21840 })] 21841 }); 21842 } 21843 /* harmony default export */ const settings_drawer = (LinkSettingsDrawer); 21844 21845 // EXTERNAL MODULE: external "React" 21846 var external_React_ = __webpack_require__(1609); 21847 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/url-input/index.js 21848 /** 21849 * External dependencies 21850 */ 21851 21852 21853 /** 21854 * WordPress dependencies 21855 */ 21856 21857 21858 21859 21860 21861 21862 21863 21864 /** 21865 * Internal dependencies 21866 */ 21867 21868 21869 /** 21870 * Whether the argument is a function. 21871 * 21872 * @param {*} maybeFunc The argument to check. 21873 * @return {boolean} True if the argument is a function, false otherwise. 21874 */ 21875 21876 21877 21878 21879 function isFunction(maybeFunc) { 21880 return typeof maybeFunc === 'function'; 21881 } 21882 class URLInput extends external_wp_element_namespaceObject.Component { 21883 constructor(props) { 21884 super(props); 21885 this.onChange = this.onChange.bind(this); 21886 this.onFocus = this.onFocus.bind(this); 21887 this.onKeyDown = this.onKeyDown.bind(this); 21888 this.selectLink = this.selectLink.bind(this); 21889 this.handleOnClick = this.handleOnClick.bind(this); 21890 this.bindSuggestionNode = this.bindSuggestionNode.bind(this); 21891 this.autocompleteRef = props.autocompleteRef || (0,external_wp_element_namespaceObject.createRef)(); 21892 this.inputRef = (0,external_wp_element_namespaceObject.createRef)(); 21893 this.updateSuggestions = (0,external_wp_compose_namespaceObject.debounce)(this.updateSuggestions.bind(this), 200); 21894 this.suggestionNodes = []; 21895 this.suggestionsRequest = null; 21896 this.state = { 21897 suggestions: [], 21898 showSuggestions: false, 21899 suggestionsValue: null, 21900 selectedSuggestion: null, 21901 suggestionsListboxId: '', 21902 suggestionOptionIdPrefix: '' 21903 }; 21904 } 21905 componentDidUpdate(prevProps) { 21906 const { 21907 showSuggestions, 21908 selectedSuggestion 21909 } = this.state; 21910 const { 21911 value, 21912 __experimentalShowInitialSuggestions = false 21913 } = this.props; 21914 21915 // Only have to worry about scrolling selected suggestion into view 21916 // when already expanded. 21917 if (showSuggestions && selectedSuggestion !== null && this.suggestionNodes[selectedSuggestion]) { 21918 this.suggestionNodes[selectedSuggestion].scrollIntoView({ 21919 behavior: 'instant', 21920 block: 'nearest', 21921 inline: 'nearest' 21922 }); 21923 } 21924 21925 // Update suggestions when the value changes. 21926 if (prevProps.value !== value && !this.props.disableSuggestions) { 21927 if (value?.length) { 21928 // If the new value is not empty we need to update with suggestions for it. 21929 this.updateSuggestions(value); 21930 } else if (__experimentalShowInitialSuggestions) { 21931 // If the new value is empty and we can show initial suggestions, then show initial suggestions. 21932 this.updateSuggestions(); 21933 } 21934 } 21935 } 21936 componentDidMount() { 21937 if (this.shouldShowInitialSuggestions()) { 21938 this.updateSuggestions(); 21939 } 21940 } 21941 componentWillUnmount() { 21942 this.suggestionsRequest?.cancel?.(); 21943 this.suggestionsRequest = null; 21944 } 21945 bindSuggestionNode(index) { 21946 return ref => { 21947 this.suggestionNodes[index] = ref; 21948 }; 21949 } 21950 shouldShowInitialSuggestions() { 21951 const { 21952 __experimentalShowInitialSuggestions = false, 21953 value 21954 } = this.props; 21955 return __experimentalShowInitialSuggestions && !(value && value.length); 21956 } 21957 updateSuggestions(value = '') { 21958 const { 21959 __experimentalFetchLinkSuggestions: fetchLinkSuggestions, 21960 __experimentalHandleURLSuggestions: handleURLSuggestions 21961 } = this.props; 21962 if (!fetchLinkSuggestions) { 21963 return; 21964 } 21965 21966 // Initial suggestions may only show if there is no value 21967 // (note: this includes whitespace). 21968 const isInitialSuggestions = !value?.length; 21969 21970 // Trim only now we've determined whether or not it originally had a "length" 21971 // (even if that value was all whitespace). 21972 value = value.trim(); 21973 21974 // Allow a suggestions request if: 21975 // - there are at least 2 characters in the search input (except manual searches where 21976 // search input length is not required to trigger a fetch) 21977 // - this is a direct entry (eg: a URL) 21978 if (!isInitialSuggestions && (value.length < 2 || !handleURLSuggestions && (0,external_wp_url_namespaceObject.isURL)(value))) { 21979 this.suggestionsRequest?.cancel?.(); 21980 this.suggestionsRequest = null; 21981 this.setState({ 21982 suggestions: [], 21983 showSuggestions: false, 21984 suggestionsValue: value, 21985 selectedSuggestion: null, 21986 loading: false 21987 }); 21988 return; 21989 } 21990 this.setState({ 21991 selectedSuggestion: null, 21992 loading: true 21993 }); 21994 const request = fetchLinkSuggestions(value, { 21995 isInitialSuggestions 21996 }); 21997 request.then(suggestions => { 21998 // A fetch Promise doesn't have an abort option. It's mimicked by 21999 // comparing the request reference in on the instance, which is 22000 // reset or deleted on subsequent requests or unmounting. 22001 if (this.suggestionsRequest !== request) { 22002 return; 22003 } 22004 this.setState({ 22005 suggestions, 22006 suggestionsValue: value, 22007 loading: false, 22008 showSuggestions: !!suggestions.length 22009 }); 22010 if (!!suggestions.length) { 22011 this.props.debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */ 22012 (0,external_wp_i18n_namespaceObject._n)('%d result found, use up and down arrow keys to navigate.', '%d results found, use up and down arrow keys to navigate.', suggestions.length), suggestions.length), 'assertive'); 22013 } else { 22014 this.props.debouncedSpeak((0,external_wp_i18n_namespaceObject.__)('No results.'), 'assertive'); 22015 } 22016 }).catch(() => { 22017 if (this.suggestionsRequest !== request) { 22018 return; 22019 } 22020 this.setState({ 22021 loading: false 22022 }); 22023 }).finally(() => { 22024 // If this is the current promise then reset the reference 22025 // to allow for checking if a new request is made. 22026 if (this.suggestionsRequest === request) { 22027 this.suggestionsRequest = null; 22028 } 22029 }); 22030 22031 // Note that this assignment is handled *before* the async search request 22032 // as a Promise always resolves on the next tick of the event loop. 22033 this.suggestionsRequest = request; 22034 } 22035 onChange(newValue) { 22036 this.props.onChange(newValue); 22037 } 22038 onFocus() { 22039 const { 22040 suggestions 22041 } = this.state; 22042 const { 22043 disableSuggestions, 22044 value 22045 } = this.props; 22046 22047 // When opening the link editor, if there's a value present, we want to load the suggestions pane with the results for this input search value 22048 // Don't re-run the suggestions on focus if there are already suggestions present (prevents searching again when tabbing between the input and buttons) 22049 // or there is already a request in progress. 22050 if (value && !disableSuggestions && !(suggestions && suggestions.length) && this.suggestionsRequest === null) { 22051 // Ensure the suggestions are updated with the current input value. 22052 this.updateSuggestions(value); 22053 } 22054 } 22055 onKeyDown(event) { 22056 this.props.onKeyDown?.(event); 22057 const { 22058 showSuggestions, 22059 selectedSuggestion, 22060 suggestions, 22061 loading 22062 } = this.state; 22063 22064 // If the suggestions are not shown or loading, we shouldn't handle the arrow keys 22065 // We shouldn't preventDefault to allow block arrow keys navigation. 22066 if (!showSuggestions || !suggestions.length || loading) { 22067 // In the Windows version of Firefox the up and down arrows don't move the caret 22068 // within an input field like they do for Mac Firefox/Chrome/Safari. This causes 22069 // a form of focus trapping that is disruptive to the user experience. This disruption 22070 // only happens if the caret is not in the first or last position in the text input. 22071 // See: https://github.com/WordPress/gutenberg/issues/5693#issuecomment-436684747 22072 switch (event.keyCode) { 22073 // When UP is pressed, if the caret is at the start of the text, move it to the 0 22074 // position. 22075 case external_wp_keycodes_namespaceObject.UP: 22076 { 22077 if (0 !== event.target.selectionStart) { 22078 event.preventDefault(); 22079 22080 // Set the input caret to position 0. 22081 event.target.setSelectionRange(0, 0); 22082 } 22083 break; 22084 } 22085 // When DOWN is pressed, if the caret is not at the end of the text, move it to the 22086 // last position. 22087 case external_wp_keycodes_namespaceObject.DOWN: 22088 { 22089 if (this.props.value.length !== event.target.selectionStart) { 22090 event.preventDefault(); 22091 22092 // Set the input caret to the last position. 22093 event.target.setSelectionRange(this.props.value.length, this.props.value.length); 22094 } 22095 break; 22096 } 22097 22098 // Submitting while loading should trigger onSubmit. 22099 case external_wp_keycodes_namespaceObject.ENTER: 22100 { 22101 if (this.props.onSubmit) { 22102 event.preventDefault(); 22103 this.props.onSubmit(null, event); 22104 } 22105 break; 22106 } 22107 } 22108 return; 22109 } 22110 const suggestion = this.state.suggestions[this.state.selectedSuggestion]; 22111 switch (event.keyCode) { 22112 case external_wp_keycodes_namespaceObject.UP: 22113 { 22114 event.preventDefault(); 22115 const previousIndex = !selectedSuggestion ? suggestions.length - 1 : selectedSuggestion - 1; 22116 this.setState({ 22117 selectedSuggestion: previousIndex 22118 }); 22119 break; 22120 } 22121 case external_wp_keycodes_namespaceObject.DOWN: 22122 { 22123 event.preventDefault(); 22124 const nextIndex = selectedSuggestion === null || selectedSuggestion === suggestions.length - 1 ? 0 : selectedSuggestion + 1; 22125 this.setState({ 22126 selectedSuggestion: nextIndex 22127 }); 22128 break; 22129 } 22130 case external_wp_keycodes_namespaceObject.TAB: 22131 { 22132 if (this.state.selectedSuggestion !== null) { 22133 this.selectLink(suggestion); 22134 // Announce a link has been selected when tabbing away from the input field. 22135 this.props.speak((0,external_wp_i18n_namespaceObject.__)('Link selected.')); 22136 } 22137 break; 22138 } 22139 case external_wp_keycodes_namespaceObject.ENTER: 22140 { 22141 event.preventDefault(); 22142 if (this.state.selectedSuggestion !== null) { 22143 this.selectLink(suggestion); 22144 if (this.props.onSubmit) { 22145 this.props.onSubmit(suggestion, event); 22146 } 22147 } else if (this.props.onSubmit) { 22148 this.props.onSubmit(null, event); 22149 } 22150 break; 22151 } 22152 } 22153 } 22154 selectLink(suggestion) { 22155 this.props.onChange(suggestion.url, suggestion); 22156 this.setState({ 22157 selectedSuggestion: null, 22158 showSuggestions: false 22159 }); 22160 } 22161 handleOnClick(suggestion) { 22162 this.selectLink(suggestion); 22163 // Move focus to the input field when a link suggestion is clicked. 22164 this.inputRef.current.focus(); 22165 } 22166 static getDerivedStateFromProps({ 22167 value, 22168 instanceId, 22169 disableSuggestions, 22170 __experimentalShowInitialSuggestions = false 22171 }, { 22172 showSuggestions 22173 }) { 22174 let shouldShowSuggestions = showSuggestions; 22175 const hasValue = value && value.length; 22176 if (!__experimentalShowInitialSuggestions && !hasValue) { 22177 shouldShowSuggestions = false; 22178 } 22179 if (disableSuggestions === true) { 22180 shouldShowSuggestions = false; 22181 } 22182 return { 22183 showSuggestions: shouldShowSuggestions, 22184 suggestionsListboxId: `block-editor-url-input-suggestions-$instanceId}`, 22185 suggestionOptionIdPrefix: `block-editor-url-input-suggestion-$instanceId}` 22186 }; 22187 } 22188 render() { 22189 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 22190 children: [this.renderControl(), this.renderSuggestions()] 22191 }); 22192 } 22193 renderControl() { 22194 const { 22195 label = null, 22196 className, 22197 isFullWidth, 22198 instanceId, 22199 placeholder = (0,external_wp_i18n_namespaceObject.__)('Paste URL or type to search'), 22200 __experimentalRenderControl: renderControl, 22201 value = '', 22202 hideLabelFromVision = false 22203 } = this.props; 22204 const { 22205 loading, 22206 showSuggestions, 22207 selectedSuggestion, 22208 suggestionsListboxId, 22209 suggestionOptionIdPrefix 22210 } = this.state; 22211 const inputId = `url-input-control-$instanceId}`; 22212 const controlProps = { 22213 id: inputId, 22214 // Passes attribute to label for the for attribute 22215 label, 22216 className: dist_clsx('block-editor-url-input', className, { 22217 'is-full-width': isFullWidth 22218 }), 22219 hideLabelFromVision 22220 }; 22221 const inputProps = { 22222 id: inputId, 22223 value, 22224 required: true, 22225 type: 'text', 22226 onChange: this.onChange, 22227 onFocus: this.onFocus, 22228 placeholder, 22229 onKeyDown: this.onKeyDown, 22230 role: 'combobox', 22231 'aria-label': label ? undefined : (0,external_wp_i18n_namespaceObject.__)('URL'), 22232 // Ensure input always has an accessible label 22233 'aria-expanded': showSuggestions, 22234 'aria-autocomplete': 'list', 22235 'aria-owns': suggestionsListboxId, 22236 'aria-activedescendant': selectedSuggestion !== null ? `$suggestionOptionIdPrefix}-$selectedSuggestion}` : undefined, 22237 ref: this.inputRef, 22238 suffix: this.props.suffix 22239 }; 22240 if (renderControl) { 22241 return renderControl(controlProps, inputProps, loading); 22242 } 22243 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.BaseControl, { 22244 __nextHasNoMarginBottom: true, 22245 ...controlProps, 22246 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControl, { 22247 ...inputProps, 22248 __next40pxDefaultSize: true 22249 }), loading && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Spinner, {})] 22250 }); 22251 } 22252 renderSuggestions() { 22253 const { 22254 className, 22255 __experimentalRenderSuggestions: renderSuggestions 22256 } = this.props; 22257 const { 22258 showSuggestions, 22259 suggestions, 22260 suggestionsValue, 22261 selectedSuggestion, 22262 suggestionsListboxId, 22263 suggestionOptionIdPrefix, 22264 loading 22265 } = this.state; 22266 if (!showSuggestions || suggestions.length === 0) { 22267 return null; 22268 } 22269 const suggestionsListProps = { 22270 id: suggestionsListboxId, 22271 ref: this.autocompleteRef, 22272 role: 'listbox' 22273 }; 22274 const buildSuggestionItemProps = (suggestion, index) => { 22275 return { 22276 role: 'option', 22277 tabIndex: '-1', 22278 id: `$suggestionOptionIdPrefix}-$index}`, 22279 ref: this.bindSuggestionNode(index), 22280 'aria-selected': index === selectedSuggestion ? true : undefined 22281 }; 22282 }; 22283 if (isFunction(renderSuggestions)) { 22284 return renderSuggestions({ 22285 suggestions, 22286 selectedSuggestion, 22287 suggestionsListProps, 22288 buildSuggestionItemProps, 22289 isLoading: loading, 22290 handleSuggestionClick: this.handleOnClick, 22291 isInitialSuggestions: !suggestionsValue?.length, 22292 currentInputValue: suggestionsValue 22293 }); 22294 } 22295 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, { 22296 placement: "bottom", 22297 focusOnMount: false, 22298 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 22299 ...suggestionsListProps, 22300 className: dist_clsx('block-editor-url-input__suggestions', `$className}__suggestions`), 22301 children: suggestions.map((suggestion, index) => /*#__PURE__*/(0,external_React_.createElement)(external_wp_components_namespaceObject.Button, { 22302 __next40pxDefaultSize: true, 22303 ...buildSuggestionItemProps(suggestion, index), 22304 key: suggestion.id, 22305 className: dist_clsx('block-editor-url-input__suggestion', { 22306 'is-selected': index === selectedSuggestion 22307 }), 22308 onClick: () => this.handleOnClick(suggestion) 22309 }, suggestion.title)) 22310 }) 22311 }); 22312 } 22313 } 22314 22315 /** 22316 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/url-input/README.md 22317 */ 22318 /* harmony default export */ const url_input = ((0,external_wp_compose_namespaceObject.compose)(external_wp_compose_namespaceObject.withSafeTimeout, external_wp_components_namespaceObject.withSpokenMessages, external_wp_compose_namespaceObject.withInstanceId, (0,external_wp_data_namespaceObject.withSelect)((select, props) => { 22319 // If a link suggestions handler is already provided then 22320 // bail. 22321 if (isFunction(props.__experimentalFetchLinkSuggestions)) { 22322 return; 22323 } 22324 const { 22325 getSettings 22326 } = select(store); 22327 return { 22328 __experimentalFetchLinkSuggestions: getSettings().__experimentalFetchLinkSuggestions 22329 }; 22330 }))(URLInput)); 22331 22332 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/plus.js 22333 /** 22334 * WordPress dependencies 22335 */ 22336 22337 22338 const plus = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 22339 xmlns: "http://www.w3.org/2000/svg", 22340 viewBox: "0 0 24 24", 22341 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22342 d: "M11 12.5V17.5H12.5V12.5H17.5V11H12.5V6H11V11H6V12.5H11Z" 22343 }) 22344 }); 22345 /* harmony default export */ const library_plus = (plus); 22346 22347 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/search-create-button.js 22348 /** 22349 * WordPress dependencies 22350 */ 22351 22352 22353 22354 22355 22356 const LinkControlSearchCreate = ({ 22357 searchTerm, 22358 onClick, 22359 itemProps, 22360 buttonText 22361 }) => { 22362 if (!searchTerm) { 22363 return null; 22364 } 22365 let text; 22366 if (buttonText) { 22367 text = typeof buttonText === 'function' ? buttonText(searchTerm) : buttonText; 22368 } else { 22369 text = (0,external_wp_element_namespaceObject.createInterpolateElement)((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: search term. */ 22370 (0,external_wp_i18n_namespaceObject.__)('Create: <mark>%s</mark>'), searchTerm), { 22371 mark: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("mark", {}) 22372 }); 22373 } 22374 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 22375 ...itemProps, 22376 iconPosition: "left", 22377 icon: library_plus, 22378 className: "block-editor-link-control__search-item", 22379 onClick: onClick, 22380 children: text 22381 }); 22382 }; 22383 /* harmony default export */ const search_create_button = (LinkControlSearchCreate); 22384 22385 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/post-list.js 22386 /** 22387 * WordPress dependencies 22388 */ 22389 22390 22391 const postList = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 22392 viewBox: "0 0 24 24", 22393 xmlns: "http://www.w3.org/2000/svg", 22394 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22395 d: "M18 5.5H6a.5.5 0 0 0-.5.5v12a.5.5 0 0 0 .5.5h12a.5.5 0 0 0 .5-.5V6a.5.5 0 0 0-.5-.5ZM6 4h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Zm1 5h1.5v1.5H7V9Zm1.5 4.5H7V15h1.5v-1.5ZM10 9h7v1.5h-7V9Zm7 4.5h-7V15h7v-1.5Z" 22396 }) 22397 }); 22398 /* harmony default export */ const post_list = (postList); 22399 22400 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/page.js 22401 /** 22402 * WordPress dependencies 22403 */ 22404 22405 22406 22407 const page = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { 22408 xmlns: "http://www.w3.org/2000/svg", 22409 viewBox: "0 0 24 24", 22410 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22411 d: "M15.5 7.5h-7V9h7V7.5Zm-7 3.5h7v1.5h-7V11Zm7 3.5h-7V16h7v-1.5Z" 22412 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22413 d: "M17 4H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2ZM7 5.5h10a.5.5 0 0 1 .5.5v12a.5.5 0 0 1-.5.5H7a.5.5 0 0 1-.5-.5V6a.5.5 0 0 1 .5-.5Z" 22414 })] 22415 }); 22416 /* harmony default export */ const library_page = (page); 22417 22418 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/tag.js 22419 /** 22420 * WordPress dependencies 22421 */ 22422 22423 22424 const tag = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 22425 xmlns: "http://www.w3.org/2000/svg", 22426 viewBox: "0 0 24 24", 22427 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22428 d: "M4.75 4a.75.75 0 0 0-.75.75v7.826c0 .2.08.39.22.53l6.72 6.716a2.313 2.313 0 0 0 3.276-.001l5.61-5.611-.531-.53.532.528a2.315 2.315 0 0 0 0-3.264L13.104 4.22a.75.75 0 0 0-.53-.22H4.75ZM19 12.576a.815.815 0 0 1-.236.574l-5.61 5.611a.814.814 0 0 1-1.153 0L5.5 12.264V5.5h6.763l6.5 6.502a.816.816 0 0 1 .237.574ZM8.75 9.75a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z" 22429 }) 22430 }); 22431 /* harmony default export */ const library_tag = (tag); 22432 22433 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/category.js 22434 /** 22435 * WordPress dependencies 22436 */ 22437 22438 22439 const category = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 22440 viewBox: "0 0 24 24", 22441 xmlns: "http://www.w3.org/2000/svg", 22442 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22443 d: "M6 5.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5H6a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5zM4 6a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2H6a2 2 0 01-2-2V6zm11-.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5zM13 6a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2h-3a2 2 0 01-2-2V6zm5 8.5h-3a.5.5 0 00-.5.5v3a.5.5 0 00.5.5h3a.5.5 0 00.5-.5v-3a.5.5 0 00-.5-.5zM15 13a2 2 0 00-2 2v3a2 2 0 002 2h3a2 2 0 002-2v-3a2 2 0 00-2-2h-3zm-9 1.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5H6a.5.5 0 01-.5-.5v-3a.5.5 0 01.5-.5zM4 15a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2H6a2 2 0 01-2-2v-3z", 22444 fillRule: "evenodd", 22445 clipRule: "evenodd" 22446 }) 22447 }); 22448 /* harmony default export */ const library_category = (category); 22449 22450 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/file.js 22451 /** 22452 * WordPress dependencies 22453 */ 22454 22455 22456 const file = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 22457 viewBox: "0 0 24 24", 22458 xmlns: "http://www.w3.org/2000/svg", 22459 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22460 fillRule: "evenodd", 22461 clipRule: "evenodd", 22462 d: "M12.848 8a1 1 0 0 1-.914-.594l-.723-1.63a.5.5 0 0 0-.447-.276H5a.5.5 0 0 0-.5.5v11.5a.5.5 0 0 0 .5.5h14a.5.5 0 0 0 .5-.5v-9A.5.5 0 0 0 19 8h-6.152Zm.612-1.5a.5.5 0 0 1-.462-.31l-.445-1.084A2 2 0 0 0 10.763 4H5a2 2 0 0 0-2 2v11.5a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-9a2 2 0 0 0-2-2h-5.54Z" 22463 }) 22464 }); 22465 /* harmony default export */ const library_file = (file); 22466 22467 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/globe.js 22468 /** 22469 * WordPress dependencies 22470 */ 22471 22472 22473 const globe = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 22474 xmlns: "http://www.w3.org/2000/svg", 22475 viewBox: "0 0 24 24", 22476 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22477 d: "M12 3.3c-4.8 0-8.8 3.9-8.8 8.8 0 4.8 3.9 8.8 8.8 8.8 4.8 0 8.8-3.9 8.8-8.8s-4-8.8-8.8-8.8zm6.5 5.5h-2.6C15.4 7.3 14.8 6 14 5c2 .6 3.6 2 4.5 3.8zm.7 3.2c0 .6-.1 1.2-.2 1.8h-2.9c.1-.6.1-1.2.1-1.8s-.1-1.2-.1-1.8H19c.2.6.2 1.2.2 1.8zM12 18.7c-1-.7-1.8-1.9-2.3-3.5h4.6c-.5 1.6-1.3 2.9-2.3 3.5zm-2.6-4.9c-.1-.6-.1-1.1-.1-1.8 0-.6.1-1.2.1-1.8h5.2c.1.6.1 1.1.1 1.8s-.1 1.2-.1 1.8H9.4zM4.8 12c0-.6.1-1.2.2-1.8h2.9c-.1.6-.1 1.2-.1 1.8 0 .6.1 1.2.1 1.8H5c-.2-.6-.2-1.2-.2-1.8zM12 5.3c1 .7 1.8 1.9 2.3 3.5H9.7c.5-1.6 1.3-2.9 2.3-3.5zM10 5c-.8 1-1.4 2.3-1.8 3.8H5.5C6.4 7 8 5.6 10 5zM5.5 15.3h2.6c.4 1.5 1 2.8 1.8 3.7-1.8-.6-3.5-2-4.4-3.7zM14 19c.8-1 1.4-2.2 1.8-3.7h2.6C17.6 17 16 18.4 14 19z" 22478 }) 22479 }); 22480 /* harmony default export */ const library_globe = (globe); 22481 22482 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/home.js 22483 /** 22484 * WordPress dependencies 22485 */ 22486 22487 22488 const home = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 22489 xmlns: "http://www.w3.org/2000/svg", 22490 viewBox: "0 0 24 24", 22491 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22492 d: "M12 4L4 7.9V20h16V7.9L12 4zm6.5 14.5H14V13h-4v5.5H5.5V8.8L12 5.7l6.5 3.1v9.7z" 22493 }) 22494 }); 22495 /* harmony default export */ const library_home = (home); 22496 22497 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/verse.js 22498 /** 22499 * WordPress dependencies 22500 */ 22501 22502 22503 const verse = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 22504 viewBox: "0 0 24 24", 22505 xmlns: "http://www.w3.org/2000/svg", 22506 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 22507 d: "M17.8 2l-.9.3c-.1 0-3.6 1-5.2 2.1C10 5.5 9.3 6.5 8.9 7.1c-.6.9-1.7 4.7-1.7 6.3l-.9 2.3c-.2.4 0 .8.4 1 .1 0 .2.1.3.1.3 0 .6-.2.7-.5l.6-1.5c.3 0 .7-.1 1.2-.2.7-.1 1.4-.3 2.2-.5.8-.2 1.6-.5 2.4-.8.7-.3 1.4-.7 1.9-1.2s.8-1.2 1-1.9c.2-.7.3-1.6.4-2.4.1-.8.1-1.7.2-2.5 0-.8.1-1.5.2-2.1V2zm-1.9 5.6c-.1.8-.2 1.5-.3 2.1-.2.6-.4 1-.6 1.3-.3.3-.8.6-1.4.9-.7.3-1.4.5-2.2.8-.6.2-1.3.3-1.8.4L15 7.5c.3-.3.6-.7 1-1.1 0 .4 0 .8-.1 1.2zM6 20h8v-1.5H6V20z" 22508 }) 22509 }); 22510 /* harmony default export */ const library_verse = (verse); 22511 22512 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/search-item.js 22513 /** 22514 * WordPress dependencies 22515 */ 22516 22517 22518 22519 22520 22521 22522 22523 const ICONS_MAP = { 22524 post: post_list, 22525 page: library_page, 22526 post_tag: library_tag, 22527 category: library_category, 22528 attachment: library_file 22529 }; 22530 function SearchItemIcon({ 22531 isURL, 22532 suggestion 22533 }) { 22534 let icon = null; 22535 if (isURL) { 22536 icon = library_globe; 22537 } else if (suggestion.type in ICONS_MAP) { 22538 icon = ICONS_MAP[suggestion.type]; 22539 if (suggestion.type === 'page') { 22540 if (suggestion.isFrontPage) { 22541 icon = library_home; 22542 } 22543 if (suggestion.isBlogHome) { 22544 icon = library_verse; 22545 } 22546 } 22547 } 22548 if (icon) { 22549 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 22550 className: "block-editor-link-control__search-item-icon", 22551 icon: icon 22552 }); 22553 } 22554 return null; 22555 } 22556 22557 /** 22558 * Adds a leading slash to a url if it doesn't already have one. 22559 * @param {string} url the url to add a leading slash to. 22560 * @return {string} the url with a leading slash. 22561 */ 22562 function addLeadingSlash(url) { 22563 const trimmedURL = url?.trim(); 22564 if (!trimmedURL?.length) { 22565 return url; 22566 } 22567 return url?.replace(/^\/?/, '/'); 22568 } 22569 function removeTrailingSlash(url) { 22570 const trimmedURL = url?.trim(); 22571 if (!trimmedURL?.length) { 22572 return url; 22573 } 22574 return url?.replace(/\/$/, ''); 22575 } 22576 const partialRight = (fn, ...partialArgs) => (...args) => fn(...args, ...partialArgs); 22577 const defaultTo = d => v => { 22578 return v === null || v === undefined || v !== v ? d : v; 22579 }; 22580 22581 /** 22582 * Prepares a URL for display in the UI. 22583 * - decodes the URL. 22584 * - filters it (removes protocol, www, etc.). 22585 * - truncates it if necessary. 22586 * - adds a leading slash. 22587 * @param {string} url the url. 22588 * @return {string} the processed url to display. 22589 */ 22590 function getURLForDisplay(url) { 22591 if (!url) { 22592 return url; 22593 } 22594 return (0,external_wp_compose_namespaceObject.pipe)(external_wp_url_namespaceObject.safeDecodeURI, external_wp_url_namespaceObject.getPath, defaultTo(''), partialRight(external_wp_url_namespaceObject.filterURLForDisplay, 24), removeTrailingSlash, addLeadingSlash)(url); 22595 } 22596 const LinkControlSearchItem = ({ 22597 itemProps, 22598 suggestion, 22599 searchTerm, 22600 onClick, 22601 isURL = false, 22602 shouldShowType = false 22603 }) => { 22604 const info = isURL ? (0,external_wp_i18n_namespaceObject.__)('Press ENTER to add this link') : getURLForDisplay(suggestion.url); 22605 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 22606 ...itemProps, 22607 info: info, 22608 iconPosition: "left", 22609 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SearchItemIcon, { 22610 suggestion: suggestion, 22611 isURL: isURL 22612 }), 22613 onClick: onClick, 22614 shortcut: shouldShowType && getVisualTypeName(suggestion), 22615 className: "block-editor-link-control__search-item", 22616 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextHighlight 22617 // The component expects a plain text string. 22618 , { 22619 text: (0,external_wp_dom_namespaceObject.__unstableStripHTML)(suggestion.title), 22620 highlight: searchTerm 22621 }) 22622 }); 22623 }; 22624 function getVisualTypeName(suggestion) { 22625 if (suggestion.isFrontPage) { 22626 return 'front page'; 22627 } 22628 if (suggestion.isBlogHome) { 22629 return 'blog home'; 22630 } 22631 22632 // Rename 'post_tag' to 'tag'. Ideally, the API would return the localised CPT or taxonomy label. 22633 return suggestion.type === 'post_tag' ? 'tag' : suggestion.type; 22634 } 22635 /* harmony default export */ const search_item = (LinkControlSearchItem); 22636 22637 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/constants.js 22638 /** 22639 * WordPress dependencies 22640 */ 22641 22642 22643 // Used as a unique identifier for the "Create" option within search results. 22644 // Used to help distinguish the "Create" suggestion within the search results in 22645 // order to handle it as a unique case. 22646 const CREATE_TYPE = '__CREATE__'; 22647 const TEL_TYPE = 'tel'; 22648 const URL_TYPE = 'link'; 22649 const MAILTO_TYPE = 'mailto'; 22650 const INTERNAL_TYPE = 'internal'; 22651 const LINK_ENTRY_TYPES = [URL_TYPE, MAILTO_TYPE, TEL_TYPE, INTERNAL_TYPE]; 22652 const DEFAULT_LINK_SETTINGS = [{ 22653 id: 'opensInNewTab', 22654 title: (0,external_wp_i18n_namespaceObject.__)('Open in new tab') 22655 }]; 22656 22657 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/search-results.js 22658 /** 22659 * WordPress dependencies 22660 */ 22661 22662 22663 22664 /** 22665 * External dependencies 22666 */ 22667 22668 22669 /** 22670 * Internal dependencies 22671 */ 22672 22673 22674 22675 22676 22677 function LinkControlSearchResults({ 22678 instanceId, 22679 withCreateSuggestion, 22680 currentInputValue, 22681 handleSuggestionClick, 22682 suggestionsListProps, 22683 buildSuggestionItemProps, 22684 suggestions, 22685 selectedSuggestion, 22686 isLoading, 22687 isInitialSuggestions, 22688 createSuggestionButtonText, 22689 suggestionsQuery 22690 }) { 22691 const resultsListClasses = dist_clsx('block-editor-link-control__search-results', { 22692 'is-loading': isLoading 22693 }); 22694 const isSingleDirectEntryResult = suggestions.length === 1 && LINK_ENTRY_TYPES.includes(suggestions[0].type); 22695 const shouldShowCreateSuggestion = withCreateSuggestion && !isSingleDirectEntryResult && !isInitialSuggestions; 22696 // If the query has a specified type, then we can skip showing them in the result. See #24839. 22697 const shouldShowSuggestionsTypes = !suggestionsQuery?.type; 22698 22699 // According to guidelines aria-label should be added if the label 22700 // itself is not visible. 22701 // See: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/listbox_role 22702 const searchResultsLabelId = `block-editor-link-control-search-results-label-$instanceId}`; 22703 const labelText = isInitialSuggestions ? (0,external_wp_i18n_namespaceObject.__)('Suggestions') : (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: search term. */ 22704 (0,external_wp_i18n_namespaceObject.__)('Search results for "%s"'), currentInputValue); 22705 const searchResultsLabel = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 22706 id: searchResultsLabelId, 22707 children: labelText 22708 }); 22709 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 22710 className: "block-editor-link-control__search-results-wrapper", 22711 children: [searchResultsLabel, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 22712 ...suggestionsListProps, 22713 className: resultsListClasses, 22714 "aria-labelledby": searchResultsLabelId, 22715 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 22716 children: suggestions.map((suggestion, index) => { 22717 if (shouldShowCreateSuggestion && CREATE_TYPE === suggestion.type) { 22718 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(search_create_button, { 22719 searchTerm: currentInputValue, 22720 buttonText: createSuggestionButtonText, 22721 onClick: () => handleSuggestionClick(suggestion) 22722 // Intentionally only using `type` here as 22723 // the constant is enough to uniquely 22724 // identify the single "CREATE" suggestion. 22725 , 22726 22727 itemProps: buildSuggestionItemProps(suggestion, index), 22728 isSelected: index === selectedSuggestion 22729 }, suggestion.type); 22730 } 22731 22732 // If we're not handling "Create" suggestions above then 22733 // we don't want them in the main results so exit early. 22734 if (CREATE_TYPE === suggestion.type) { 22735 return null; 22736 } 22737 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(search_item, { 22738 itemProps: buildSuggestionItemProps(suggestion, index), 22739 suggestion: suggestion, 22740 index: index, 22741 onClick: () => { 22742 handleSuggestionClick(suggestion); 22743 }, 22744 isSelected: index === selectedSuggestion, 22745 isURL: LINK_ENTRY_TYPES.includes(suggestion.type), 22746 searchTerm: currentInputValue, 22747 shouldShowType: shouldShowSuggestionsTypes, 22748 isFrontPage: suggestion?.isFrontPage, 22749 isBlogHome: suggestion?.isBlogHome 22750 }, `$suggestion.id}-$suggestion.type}`); 22751 }) 22752 }) 22753 })] 22754 }); 22755 } 22756 22757 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/is-url-like.js 22758 /** 22759 * WordPress dependencies 22760 */ 22761 22762 22763 /** 22764 * Determines whether a given value could be a URL. Note this does not 22765 * guarantee the value is a URL only that it looks like it might be one. For 22766 * example, just because a string has `www.` in it doesn't make it a URL, 22767 * but it does make it highly likely that it will be so in the context of 22768 * creating a link it makes sense to treat it like one. 22769 * 22770 * @param {string} val the candidate for being URL-like (or not). 22771 * 22772 * @return {boolean} whether or not the value is potentially a URL. 22773 */ 22774 function isURLLike(val) { 22775 const hasSpaces = val.includes(' '); 22776 if (hasSpaces) { 22777 return false; 22778 } 22779 const protocol = (0,external_wp_url_namespaceObject.getProtocol)(val); 22780 const protocolIsValid = (0,external_wp_url_namespaceObject.isValidProtocol)(protocol); 22781 const mayBeTLD = hasPossibleTLD(val); 22782 const isWWW = val?.startsWith('www.'); 22783 const isInternal = val?.startsWith('#') && (0,external_wp_url_namespaceObject.isValidFragment)(val); 22784 return protocolIsValid || isWWW || isInternal || mayBeTLD; 22785 } 22786 22787 /** 22788 * Checks if a given URL has a valid Top-Level Domain (TLD). 22789 * 22790 * @param {string} url - The URL to check. 22791 * @param {number} maxLength - The maximum length of the TLD. 22792 * @return {boolean} Returns true if the URL has a valid TLD, false otherwise. 22793 */ 22794 function hasPossibleTLD(url, maxLength = 6) { 22795 // Clean the URL by removing anything after the first occurrence of "?" or "#". 22796 const cleanedURL = url.split(/[?#]/)[0]; 22797 22798 // Regular expression explanation: 22799 // - (?<=\S) : Positive lookbehind assertion to ensure there is at least one non-whitespace character before the TLD 22800 // - \. : Matches a literal dot (.) 22801 // - [a-zA-Z_]{2,maxLength} : Matches 2 to maxLength letters or underscores, representing the TLD 22802 // - (?:\/|$) : Non-capturing group that matches either a forward slash (/) or the end of the string 22803 const regex = new RegExp(`(?<=\\S)\\.(?:[a-zA-Z_]{2,$maxLength}})(?:\\/|$)`); 22804 return regex.test(cleanedURL); 22805 } 22806 22807 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/use-search-handler.js 22808 /** 22809 * WordPress dependencies 22810 */ 22811 22812 22813 22814 22815 /** 22816 * Internal dependencies 22817 */ 22818 22819 22820 22821 const handleNoop = () => Promise.resolve([]); 22822 const handleDirectEntry = val => { 22823 let type = URL_TYPE; 22824 const protocol = (0,external_wp_url_namespaceObject.getProtocol)(val) || ''; 22825 if (protocol.includes('mailto')) { 22826 type = MAILTO_TYPE; 22827 } 22828 if (protocol.includes('tel')) { 22829 type = TEL_TYPE; 22830 } 22831 if (val?.startsWith('#')) { 22832 type = INTERNAL_TYPE; 22833 } 22834 return Promise.resolve([{ 22835 id: val, 22836 title: val, 22837 url: type === 'URL' ? (0,external_wp_url_namespaceObject.prependHTTP)(val) : val, 22838 type 22839 }]); 22840 }; 22841 const handleEntitySearch = async (val, suggestionsQuery, fetchSearchSuggestions, withCreateSuggestion, pageOnFront, pageForPosts) => { 22842 const { 22843 isInitialSuggestions 22844 } = suggestionsQuery; 22845 const results = await fetchSearchSuggestions(val, suggestionsQuery); 22846 22847 // Identify front page and update type to match. 22848 results.map(result => { 22849 if (Number(result.id) === pageOnFront) { 22850 result.isFrontPage = true; 22851 return result; 22852 } else if (Number(result.id) === pageForPosts) { 22853 result.isBlogHome = true; 22854 return result; 22855 } 22856 return result; 22857 }); 22858 22859 // If displaying initial suggestions just return plain results. 22860 if (isInitialSuggestions) { 22861 return results; 22862 } 22863 22864 // Here we append a faux suggestion to represent a "CREATE" option. This 22865 // is detected in the rendering of the search results and handled as a 22866 // special case. This is currently necessary because the suggestions 22867 // dropdown will only appear if there are valid suggestions and 22868 // therefore unless the create option is a suggestion it will not 22869 // display in scenarios where there are no results returned from the 22870 // API. In addition promoting CREATE to a first class suggestion affords 22871 // the a11y benefits afforded by `URLInput` to all suggestions (eg: 22872 // keyboard handling, ARIA roles...etc). 22873 // 22874 // Note also that the value of the `title` and `url` properties must correspond 22875 // to the text value of the `<input>`. This is because `title` is used 22876 // when creating the suggestion. Similarly `url` is used when using keyboard to select 22877 // the suggestion (the <form> `onSubmit` handler falls-back to `url`). 22878 return isURLLike(val) || !withCreateSuggestion ? results : results.concat({ 22879 // the `id` prop is intentionally ommitted here because it 22880 // is never exposed as part of the component's public API. 22881 // see: https://github.com/WordPress/gutenberg/pull/19775#discussion_r378931316. 22882 title: val, 22883 // Must match the existing `<input>`s text value. 22884 url: val, 22885 // Must match the existing `<input>`s text value. 22886 type: CREATE_TYPE 22887 }); 22888 }; 22889 function useSearchHandler(suggestionsQuery, allowDirectEntry, withCreateSuggestion) { 22890 const { 22891 fetchSearchSuggestions, 22892 pageOnFront, 22893 pageForPosts 22894 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 22895 const { 22896 getSettings 22897 } = select(store); 22898 return { 22899 pageOnFront: getSettings().pageOnFront, 22900 pageForPosts: getSettings().pageForPosts, 22901 fetchSearchSuggestions: getSettings().__experimentalFetchLinkSuggestions 22902 }; 22903 }, []); 22904 const directEntryHandler = allowDirectEntry ? handleDirectEntry : handleNoop; 22905 return (0,external_wp_element_namespaceObject.useCallback)((val, { 22906 isInitialSuggestions 22907 }) => { 22908 return isURLLike(val) ? directEntryHandler(val, { 22909 isInitialSuggestions 22910 }) : handleEntitySearch(val, { 22911 ...suggestionsQuery, 22912 isInitialSuggestions 22913 }, fetchSearchSuggestions, withCreateSuggestion, pageOnFront, pageForPosts); 22914 }, [directEntryHandler, fetchSearchSuggestions, pageOnFront, pageForPosts, suggestionsQuery, withCreateSuggestion]); 22915 } 22916 22917 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/search-input.js 22918 /** 22919 * WordPress dependencies 22920 */ 22921 22922 22923 22924 22925 /** 22926 * Internal dependencies 22927 */ 22928 22929 22930 22931 22932 22933 // Must be a function as otherwise URLInput will default 22934 // to the fetchLinkSuggestions passed in block editor settings 22935 // which will cause an unintended http request. 22936 22937 22938 const noopSearchHandler = () => Promise.resolve([]); 22939 const noop = () => {}; 22940 const LinkControlSearchInput = (0,external_wp_element_namespaceObject.forwardRef)(({ 22941 value, 22942 children, 22943 currentLink = {}, 22944 className = null, 22945 placeholder = null, 22946 withCreateSuggestion = false, 22947 onCreateSuggestion = noop, 22948 onChange = noop, 22949 onSelect = noop, 22950 showSuggestions = true, 22951 renderSuggestions = props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LinkControlSearchResults, { 22952 ...props 22953 }), 22954 fetchSuggestions = null, 22955 allowDirectEntry = true, 22956 showInitialSuggestions = false, 22957 suggestionsQuery = {}, 22958 withURLSuggestion = true, 22959 createSuggestionButtonText, 22960 hideLabelFromVision = false, 22961 suffix 22962 }, ref) => { 22963 const genericSearchHandler = useSearchHandler(suggestionsQuery, allowDirectEntry, withCreateSuggestion, withURLSuggestion); 22964 const searchHandler = showSuggestions ? fetchSuggestions || genericSearchHandler : noopSearchHandler; 22965 const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(LinkControlSearchInput); 22966 const [focusedSuggestion, setFocusedSuggestion] = (0,external_wp_element_namespaceObject.useState)(); 22967 22968 /** 22969 * Handles the user moving between different suggestions. Does not handle 22970 * choosing an individual item. 22971 * 22972 * @param {string} selection the url of the selected suggestion. 22973 * @param {Object} suggestion the suggestion object. 22974 */ 22975 const onInputChange = (selection, suggestion) => { 22976 onChange(selection); 22977 setFocusedSuggestion(suggestion); 22978 }; 22979 const handleRenderSuggestions = props => renderSuggestions({ 22980 ...props, 22981 instanceId, 22982 withCreateSuggestion, 22983 createSuggestionButtonText, 22984 suggestionsQuery, 22985 handleSuggestionClick: suggestion => { 22986 if (props.handleSuggestionClick) { 22987 props.handleSuggestionClick(suggestion); 22988 } 22989 onSuggestionSelected(suggestion); 22990 } 22991 }); 22992 const onSuggestionSelected = async selectedSuggestion => { 22993 let suggestion = selectedSuggestion; 22994 if (CREATE_TYPE === selectedSuggestion.type) { 22995 // Create a new page and call onSelect with the output from the onCreateSuggestion callback. 22996 try { 22997 suggestion = await onCreateSuggestion(selectedSuggestion.title); 22998 if (suggestion?.url) { 22999 onSelect(suggestion); 23000 } 23001 } catch (e) {} 23002 return; 23003 } 23004 if (allowDirectEntry || suggestion && Object.keys(suggestion).length >= 1) { 23005 const { 23006 id, 23007 url, 23008 ...restLinkProps 23009 } = currentLink !== null && currentLink !== void 0 ? currentLink : {}; 23010 onSelect( 23011 // Some direct entries don't have types or IDs, and we still need to clear the previous ones. 23012 { 23013 ...restLinkProps, 23014 ...suggestion 23015 }, suggestion); 23016 } 23017 }; 23018 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 23019 className: "block-editor-link-control__search-input-container", 23020 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(url_input, { 23021 disableSuggestions: currentLink?.url === value, 23022 label: (0,external_wp_i18n_namespaceObject.__)('Link'), 23023 hideLabelFromVision: hideLabelFromVision, 23024 className: className, 23025 value: value, 23026 onChange: onInputChange, 23027 placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : (0,external_wp_i18n_namespaceObject.__)('Search or type URL'), 23028 __experimentalRenderSuggestions: showSuggestions ? handleRenderSuggestions : null, 23029 __experimentalFetchLinkSuggestions: searchHandler, 23030 __experimentalHandleURLSuggestions: true, 23031 __experimentalShowInitialSuggestions: showInitialSuggestions, 23032 onSubmit: (suggestion, event) => { 23033 const hasSuggestion = suggestion || focusedSuggestion; 23034 23035 // If there is no suggestion and the value (ie: any manually entered URL) is empty 23036 // then don't allow submission otherwise we get empty links. 23037 if (!hasSuggestion && !value?.trim()?.length) { 23038 event.preventDefault(); 23039 } else { 23040 onSuggestionSelected(hasSuggestion || { 23041 url: value 23042 }); 23043 } 23044 }, 23045 ref: ref, 23046 suffix: suffix 23047 }), children] 23048 }); 23049 }); 23050 /* harmony default export */ const search_input = (LinkControlSearchInput); 23051 23052 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/info.js 23053 /** 23054 * WordPress dependencies 23055 */ 23056 23057 23058 const info = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 23059 xmlns: "http://www.w3.org/2000/svg", 23060 viewBox: "0 0 24 24", 23061 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 23062 d: "M12 3.2c-4.8 0-8.8 3.9-8.8 8.8 0 4.8 3.9 8.8 8.8 8.8 4.8 0 8.8-3.9 8.8-8.8 0-4.8-4-8.8-8.8-8.8zm0 16c-4 0-7.2-3.3-7.2-7.2C4.8 8 8 4.8 12 4.8s7.2 3.3 7.2 7.2c0 4-3.2 7.2-7.2 7.2zM11 17h2v-6h-2v6zm0-8h2V7h-2v2z" 23063 }) 23064 }); 23065 /* harmony default export */ const library_info = (info); 23066 23067 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/pencil.js 23068 /** 23069 * WordPress dependencies 23070 */ 23071 23072 23073 const pencil = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 23074 xmlns: "http://www.w3.org/2000/svg", 23075 viewBox: "0 0 24 24", 23076 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 23077 d: "m19 7-3-3-8.5 8.5-1 4 4-1L19 7Zm-7 11.5H5V20h7v-1.5Z" 23078 }) 23079 }); 23080 /* harmony default export */ const library_pencil = (pencil); 23081 23082 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/edit.js 23083 /** 23084 * Internal dependencies 23085 */ 23086 23087 23088 /* harmony default export */ const edit = (library_pencil); 23089 23090 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/link-off.js 23091 /** 23092 * WordPress dependencies 23093 */ 23094 23095 23096 const linkOff = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 23097 xmlns: "http://www.w3.org/2000/svg", 23098 viewBox: "0 0 24 24", 23099 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 23100 d: "M17.031 4.703 15.576 4l-1.56 3H14v.03l-2.324 4.47H9.5V13h1.396l-1.502 2.889h-.95a3.694 3.694 0 0 1 0-7.389H10V7H8.444a5.194 5.194 0 1 0 0 10.389h.17L7.5 19.53l1.416.719L15.049 8.5h.507a3.694 3.694 0 0 1 0 7.39H14v1.5h1.556a5.194 5.194 0 0 0 .273-10.383l1.202-2.304Z" 23101 }) 23102 }); 23103 /* harmony default export */ const link_off = (linkOff); 23104 23105 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/copy-small.js 23106 /** 23107 * WordPress dependencies 23108 */ 23109 23110 23111 const copySmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 23112 xmlns: "http://www.w3.org/2000/svg", 23113 viewBox: "0 0 24 24", 23114 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 23115 fillRule: "evenodd", 23116 clipRule: "evenodd", 23117 d: "M5.625 5.5h9.75c.069 0 .125.056.125.125v9.75a.125.125 0 0 1-.125.125h-9.75a.125.125 0 0 1-.125-.125v-9.75c0-.069.056-.125.125-.125ZM4 5.625C4 4.728 4.728 4 5.625 4h9.75C16.273 4 17 4.728 17 5.625v9.75c0 .898-.727 1.625-1.625 1.625h-9.75A1.625 1.625 0 0 1 4 15.375v-9.75Zm14.5 11.656v-9H20v9C20 18.8 18.77 20 17.251 20H6.25v-1.5h11.001c.69 0 1.249-.528 1.249-1.219Z" 23118 }) 23119 }); 23120 /* harmony default export */ const copy_small = (copySmall); 23121 23122 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/viewer-slot.js 23123 /** 23124 * WordPress dependencies 23125 */ 23126 23127 const { 23128 Slot: ViewerSlot, 23129 Fill: ViewerFill 23130 } = (0,external_wp_components_namespaceObject.createSlotFill)('BlockEditorLinkControlViewer'); 23131 23132 /* harmony default export */ const viewer_slot = ((/* unused pure expression or super */ null && (ViewerSlot))); 23133 23134 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/use-rich-url-data.js 23135 /** 23136 * Internal dependencies 23137 */ 23138 23139 23140 /** 23141 * WordPress dependencies 23142 */ 23143 23144 23145 function use_rich_url_data_reducer(state, action) { 23146 switch (action.type) { 23147 case 'RESOLVED': 23148 return { 23149 ...state, 23150 isFetching: false, 23151 richData: action.richData 23152 }; 23153 case 'ERROR': 23154 return { 23155 ...state, 23156 isFetching: false, 23157 richData: null 23158 }; 23159 case 'LOADING': 23160 return { 23161 ...state, 23162 isFetching: true 23163 }; 23164 default: 23165 throw new Error(`Unexpected action type $action.type}`); 23166 } 23167 } 23168 function useRemoteUrlData(url) { 23169 const [state, dispatch] = (0,external_wp_element_namespaceObject.useReducer)(use_rich_url_data_reducer, { 23170 richData: null, 23171 isFetching: false 23172 }); 23173 const { 23174 fetchRichUrlData 23175 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 23176 const { 23177 getSettings 23178 } = select(store); 23179 return { 23180 fetchRichUrlData: getSettings().__experimentalFetchRichUrlData 23181 }; 23182 }, []); 23183 (0,external_wp_element_namespaceObject.useEffect)(() => { 23184 // Only make the request if we have an actual URL 23185 // and the fetching util is available. In some editors 23186 // there may not be such a util. 23187 if (url?.length && fetchRichUrlData && typeof AbortController !== 'undefined') { 23188 dispatch({ 23189 type: 'LOADING' 23190 }); 23191 const controller = new window.AbortController(); 23192 const signal = controller.signal; 23193 fetchRichUrlData(url, { 23194 signal 23195 }).then(urlData => { 23196 dispatch({ 23197 type: 'RESOLVED', 23198 richData: urlData 23199 }); 23200 }).catch(() => { 23201 // Avoid setting state on unmounted component 23202 if (!signal.aborted) { 23203 dispatch({ 23204 type: 'ERROR' 23205 }); 23206 } 23207 }); 23208 // Cleanup: when the URL changes the abort the current request. 23209 return () => { 23210 controller.abort(); 23211 }; 23212 } 23213 }, [url]); 23214 return state; 23215 } 23216 /* harmony default export */ const use_rich_url_data = (useRemoteUrlData); 23217 23218 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/link-preview.js 23219 /** 23220 * External dependencies 23221 */ 23222 23223 23224 /** 23225 * WordPress dependencies 23226 */ 23227 23228 23229 23230 23231 23232 23233 23234 23235 23236 23237 /** 23238 * Internal dependencies 23239 */ 23240 23241 23242 23243 /** 23244 * Filters the title for display. Removes the protocol and www prefix. 23245 * 23246 * @param {string} title The title to be filtered. 23247 * 23248 * @return {string} The filtered title. 23249 */ 23250 23251 23252 23253 function filterTitleForDisplay(title) { 23254 // Derived from `filterURLForDisplay` in `@wordpress/url`. 23255 return title.replace(/^[a-z\-.\+]+[0-9]*:(\/\/)?/i, '').replace(/^www\./i, ''); 23256 } 23257 function LinkPreview({ 23258 value, 23259 onEditClick, 23260 hasRichPreviews = false, 23261 hasUnlinkControl = false, 23262 onRemove 23263 }) { 23264 const showIconLabels = (0,external_wp_data_namespaceObject.useSelect)(select => select(external_wp_preferences_namespaceObject.store).get('core', 'showIconLabels'), []); 23265 23266 // Avoid fetching if rich previews are not desired. 23267 const showRichPreviews = hasRichPreviews ? value?.url : null; 23268 const { 23269 richData, 23270 isFetching 23271 } = use_rich_url_data(showRichPreviews); 23272 23273 // Rich data may be an empty object so test for that. 23274 const hasRichData = richData && Object.keys(richData).length; 23275 const displayURL = value && (0,external_wp_url_namespaceObject.filterURLForDisplay)((0,external_wp_url_namespaceObject.safeDecodeURI)(value.url), 24) || ''; 23276 23277 // url can be undefined if the href attribute is unset 23278 const isEmptyURL = !value?.url?.length; 23279 const displayTitle = !isEmptyURL && (0,external_wp_dom_namespaceObject.__unstableStripHTML)(richData?.title || value?.title || displayURL); 23280 const isUrlRedundant = !value?.url || filterTitleForDisplay(displayTitle) === displayURL; 23281 let icon; 23282 if (richData?.icon) { 23283 icon = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("img", { 23284 src: richData?.icon, 23285 alt: "" 23286 }); 23287 } else if (isEmptyURL) { 23288 icon = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 23289 icon: library_info, 23290 size: 32 23291 }); 23292 } else { 23293 icon = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 23294 icon: library_globe 23295 }); 23296 } 23297 const { 23298 createNotice 23299 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_notices_namespaceObject.store); 23300 const ref = (0,external_wp_compose_namespaceObject.useCopyToClipboard)(value.url, () => { 23301 createNotice('info', (0,external_wp_i18n_namespaceObject.__)('Link copied to clipboard.'), { 23302 isDismissible: true, 23303 type: 'snackbar' 23304 }); 23305 }); 23306 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 23307 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Currently selected'), 23308 className: dist_clsx('block-editor-link-control__search-item', { 23309 'is-current': true, 23310 'is-rich': hasRichData, 23311 'is-fetching': !!isFetching, 23312 'is-preview': true, 23313 'is-error': isEmptyURL, 23314 'is-url-title': displayTitle === displayURL 23315 }), 23316 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 23317 className: "block-editor-link-control__search-item-top", 23318 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("span", { 23319 className: "block-editor-link-control__search-item-header", 23320 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 23321 className: dist_clsx('block-editor-link-control__search-item-icon', { 23322 'is-image': richData?.icon 23323 }), 23324 children: icon 23325 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 23326 className: "block-editor-link-control__search-item-details", 23327 children: !isEmptyURL ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 23328 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ExternalLink, { 23329 className: "block-editor-link-control__search-item-title", 23330 href: value.url, 23331 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, { 23332 numberOfLines: 1, 23333 children: displayTitle 23334 }) 23335 }), !isUrlRedundant && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 23336 className: "block-editor-link-control__search-item-info", 23337 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, { 23338 numberOfLines: 1, 23339 children: displayURL 23340 }) 23341 })] 23342 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 23343 className: "block-editor-link-control__search-item-error-notice", 23344 children: (0,external_wp_i18n_namespaceObject.__)('Link is empty') 23345 }) 23346 })] 23347 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 23348 icon: edit, 23349 label: (0,external_wp_i18n_namespaceObject.__)('Edit link'), 23350 onClick: onEditClick, 23351 size: "compact" 23352 }), hasUnlinkControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 23353 icon: link_off, 23354 label: (0,external_wp_i18n_namespaceObject.__)('Remove link'), 23355 onClick: onRemove, 23356 size: "compact" 23357 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 23358 icon: copy_small, 23359 label: (0,external_wp_i18n_namespaceObject.sprintf)( 23360 // Translators: %s is a placeholder for the link URL and an optional colon, (if a Link URL is present). 23361 (0,external_wp_i18n_namespaceObject.__)('Copy link%s'), 23362 // Ends up looking like "Copy link: https://example.com". 23363 isEmptyURL || showIconLabels ? '' : ': ' + value.url), 23364 ref: ref, 23365 accessibleWhenDisabled: true, 23366 disabled: isEmptyURL, 23367 size: "compact" 23368 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ViewerSlot, { 23369 fillProps: value 23370 })] 23371 }) 23372 }); 23373 } 23374 23375 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/settings.js 23376 /** 23377 * WordPress dependencies 23378 */ 23379 23380 23381 23382 23383 const settings_noop = () => {}; 23384 const LinkControlSettings = ({ 23385 value, 23386 onChange = settings_noop, 23387 settings 23388 }) => { 23389 if (!settings || !settings.length) { 23390 return null; 23391 } 23392 const handleSettingChange = setting => newValue => { 23393 onChange({ 23394 ...value, 23395 [setting.id]: newValue 23396 }); 23397 }; 23398 const theSettings = settings.map(setting => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CheckboxControl, { 23399 __nextHasNoMarginBottom: true, 23400 className: "block-editor-link-control__setting", 23401 label: setting.title, 23402 onChange: handleSettingChange(setting), 23403 checked: value ? !!value[setting.id] : false, 23404 help: setting?.help 23405 }, setting.id)); 23406 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 23407 className: "block-editor-link-control__settings", 23408 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 23409 as: "legend", 23410 children: (0,external_wp_i18n_namespaceObject.__)('Currently selected link settings') 23411 }), theSettings] 23412 }); 23413 }; 23414 /* harmony default export */ const link_control_settings = (LinkControlSettings); 23415 23416 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/use-create-page.js 23417 /** 23418 * WordPress dependencies 23419 */ 23420 23421 23422 function useCreatePage(handleCreatePage) { 23423 const cancelableCreateSuggestion = (0,external_wp_element_namespaceObject.useRef)(); 23424 const [isCreatingPage, setIsCreatingPage] = (0,external_wp_element_namespaceObject.useState)(false); 23425 const [errorMessage, setErrorMessage] = (0,external_wp_element_namespaceObject.useState)(null); 23426 const createPage = async function (suggestionTitle) { 23427 setIsCreatingPage(true); 23428 setErrorMessage(null); 23429 try { 23430 // Make cancellable in order that we can avoid setting State 23431 // if the component unmounts during the call to `createSuggestion` 23432 cancelableCreateSuggestion.current = makeCancelable( 23433 // Using Promise.resolve to allow createSuggestion to return a 23434 // non-Promise based value. 23435 Promise.resolve(handleCreatePage(suggestionTitle))); 23436 return await cancelableCreateSuggestion.current.promise; 23437 } catch (error) { 23438 if (error && error.isCanceled) { 23439 return; // bail if canceled to avoid setting state 23440 } 23441 setErrorMessage(error.message || (0,external_wp_i18n_namespaceObject.__)('An unknown error occurred during creation. Please try again.')); 23442 throw error; 23443 } finally { 23444 setIsCreatingPage(false); 23445 } 23446 }; 23447 23448 /** 23449 * Handles cancelling any pending Promises that have been made cancelable. 23450 */ 23451 (0,external_wp_element_namespaceObject.useEffect)(() => { 23452 return () => { 23453 // componentDidUnmount 23454 if (cancelableCreateSuggestion.current) { 23455 cancelableCreateSuggestion.current.cancel(); 23456 } 23457 }; 23458 }, []); 23459 return { 23460 createPage, 23461 isCreatingPage, 23462 errorMessage 23463 }; 23464 } 23465 23466 /** 23467 * Creates a wrapper around a promise which allows it to be programmatically 23468 * cancelled. 23469 * See: https://reactjs.org/blog/2015/12/16/ismounted-antipattern.html 23470 * 23471 * @param {Promise} promise the Promise to make cancelable 23472 */ 23473 const makeCancelable = promise => { 23474 let hasCanceled_ = false; 23475 const wrappedPromise = new Promise((resolve, reject) => { 23476 promise.then(val => hasCanceled_ ? reject({ 23477 isCanceled: true 23478 }) : resolve(val), error => hasCanceled_ ? reject({ 23479 isCanceled: true 23480 }) : reject(error)); 23481 }); 23482 return { 23483 promise: wrappedPromise, 23484 cancel() { 23485 hasCanceled_ = true; 23486 } 23487 }; 23488 }; 23489 23490 // EXTERNAL MODULE: ./node_modules/fast-deep-equal/index.js 23491 var fast_deep_equal = __webpack_require__(5215); 23492 var fast_deep_equal_default = /*#__PURE__*/__webpack_require__.n(fast_deep_equal); 23493 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/use-internal-value.js 23494 /** 23495 * WordPress dependencies 23496 */ 23497 23498 23499 /** 23500 * External dependencies 23501 */ 23502 23503 function useInternalValue(value) { 23504 const [internalValue, setInternalValue] = (0,external_wp_element_namespaceObject.useState)(value || {}); 23505 const [previousValue, setPreviousValue] = (0,external_wp_element_namespaceObject.useState)(value); 23506 23507 // If the value prop changes, update the internal state. 23508 // See: 23509 // - https://github.com/WordPress/gutenberg/pull/51387#issuecomment-1722927384. 23510 // - https://react.dev/reference/react/useState#storing-information-from-previous-renders. 23511 if (!fast_deep_equal_default()(value, previousValue)) { 23512 setPreviousValue(value); 23513 setInternalValue(value); 23514 } 23515 const setInternalURLInputValue = nextValue => { 23516 setInternalValue({ 23517 ...internalValue, 23518 url: nextValue 23519 }); 23520 }; 23521 const setInternalTextInputValue = nextValue => { 23522 setInternalValue({ 23523 ...internalValue, 23524 title: nextValue 23525 }); 23526 }; 23527 const createSetInternalSettingValueHandler = settingsKeys => nextValue => { 23528 // Only apply settings values which are defined in the settings prop. 23529 const settingsUpdates = Object.keys(nextValue).reduce((acc, key) => { 23530 if (settingsKeys.includes(key)) { 23531 acc[key] = nextValue[key]; 23532 } 23533 return acc; 23534 }, {}); 23535 setInternalValue({ 23536 ...internalValue, 23537 ...settingsUpdates 23538 }); 23539 }; 23540 return [internalValue, setInternalValue, setInternalURLInputValue, setInternalTextInputValue, createSetInternalSettingValueHandler]; 23541 } 23542 23543 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/link-control/index.js 23544 /** 23545 * External dependencies 23546 */ 23547 23548 23549 /** 23550 * WordPress dependencies 23551 */ 23552 23553 23554 23555 23556 23557 23558 23559 23560 23561 23562 /** 23563 * Internal dependencies 23564 */ 23565 23566 23567 23568 23569 23570 23571 23572 23573 23574 /** 23575 * Default properties associated with a link control value. 23576 * 23577 * @typedef WPLinkControlDefaultValue 23578 * 23579 * @property {string} url Link URL. 23580 * @property {string=} title Link title. 23581 * @property {boolean=} opensInNewTab Whether link should open in a new browser 23582 * tab. This value is only assigned if not 23583 * providing a custom `settings` prop. 23584 */ 23585 23586 /* eslint-disable jsdoc/valid-types */ 23587 /** 23588 * Custom settings values associated with a link. 23589 * 23590 * @typedef {{[setting:string]:any}} WPLinkControlSettingsValue 23591 */ 23592 /* eslint-enable */ 23593 23594 /** 23595 * Custom settings values associated with a link. 23596 * 23597 * @typedef WPLinkControlSetting 23598 * 23599 * @property {string} id Identifier to use as property for setting value. 23600 * @property {string} title Human-readable label to show in user interface. 23601 */ 23602 23603 /** 23604 * Properties associated with a link control value, composed as a union of the 23605 * default properties and any custom settings values. 23606 * 23607 * @typedef {WPLinkControlDefaultValue&WPLinkControlSettingsValue} WPLinkControlValue 23608 */ 23609 23610 /** @typedef {(nextValue:WPLinkControlValue)=>void} WPLinkControlOnChangeProp */ 23611 23612 /** 23613 * Properties associated with a search suggestion used within the LinkControl. 23614 * 23615 * @typedef WPLinkControlSuggestion 23616 * 23617 * @property {string} id Identifier to use to uniquely identify the suggestion. 23618 * @property {string} type Identifies the type of the suggestion (eg: `post`, 23619 * `page`, `url`...etc) 23620 * @property {string} title Human-readable label to show in user interface. 23621 * @property {string} url A URL for the suggestion. 23622 */ 23623 23624 /** @typedef {(title:string)=>WPLinkControlSuggestion} WPLinkControlCreateSuggestionProp */ 23625 23626 /** 23627 * @typedef WPLinkControlProps 23628 * 23629 * @property {(WPLinkControlSetting[])=} settings An array of settings objects. Each object will used to 23630 * render a `ToggleControl` for that setting. 23631 * @property {boolean=} forceIsEditingLink If passed as either `true` or `false`, controls the 23632 * internal editing state of the component to respective 23633 * show or not show the URL input field. 23634 * @property {WPLinkControlValue=} value Current link value. 23635 * @property {WPLinkControlOnChangeProp=} onChange Value change handler, called with the updated value if 23636 * the user selects a new link or updates settings. 23637 * @property {boolean=} noDirectEntry Whether to allow turning a URL-like search query directly into a link. 23638 * @property {boolean=} showSuggestions Whether to present suggestions when typing the URL. 23639 * @property {boolean=} showInitialSuggestions Whether to present initial suggestions immediately. 23640 * @property {boolean=} withCreateSuggestion Whether to allow creation of link value from suggestion. 23641 * @property {Object=} suggestionsQuery Query parameters to pass along to wp.blockEditor.__experimentalFetchLinkSuggestions. 23642 * @property {boolean=} noURLSuggestion Whether to add a fallback suggestion which treats the search query as a URL. 23643 * @property {boolean=} hasTextControl Whether to add a text field to the UI to update the value.title. 23644 * @property {string|Function|undefined} createSuggestionButtonText The text to use in the button that calls createSuggestion. 23645 * @property {Function} renderControlBottom Optional controls to be rendered at the bottom of the component. 23646 */ 23647 23648 23649 23650 const link_control_noop = () => {}; 23651 const PREFERENCE_SCOPE = 'core/block-editor'; 23652 const PREFERENCE_KEY = 'linkControlSettingsDrawer'; 23653 23654 /** 23655 * Renders a link control. A link control is a controlled input which maintains 23656 * a value associated with a link (HTML anchor element) and relevant settings 23657 * for how that link is expected to behave. 23658 * 23659 * @param {WPLinkControlProps} props Component props. 23660 */ 23661 function LinkControl({ 23662 searchInputPlaceholder, 23663 value, 23664 settings = DEFAULT_LINK_SETTINGS, 23665 onChange = link_control_noop, 23666 onRemove, 23667 onCancel, 23668 noDirectEntry = false, 23669 showSuggestions = true, 23670 showInitialSuggestions, 23671 forceIsEditingLink, 23672 createSuggestion, 23673 withCreateSuggestion, 23674 inputValue: propInputValue = '', 23675 suggestionsQuery = {}, 23676 noURLSuggestion = false, 23677 createSuggestionButtonText, 23678 hasRichPreviews = false, 23679 hasTextControl = false, 23680 renderControlBottom = null 23681 }) { 23682 if (withCreateSuggestion === undefined && createSuggestion) { 23683 withCreateSuggestion = true; 23684 } 23685 const [settingsOpen, setSettingsOpen] = (0,external_wp_element_namespaceObject.useState)(false); 23686 const { 23687 advancedSettingsPreference 23688 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 23689 var _prefsStore$get; 23690 const prefsStore = select(external_wp_preferences_namespaceObject.store); 23691 return { 23692 advancedSettingsPreference: (_prefsStore$get = prefsStore.get(PREFERENCE_SCOPE, PREFERENCE_KEY)) !== null && _prefsStore$get !== void 0 ? _prefsStore$get : false 23693 }; 23694 }, []); 23695 const { 23696 set: setPreference 23697 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_preferences_namespaceObject.store); 23698 23699 /** 23700 * Sets the open/closed state of the Advanced Settings Drawer, 23701 * optionlly persisting the state to the user's preferences. 23702 * 23703 * Note that Block Editor components can be consumed by non-WordPress 23704 * environments which may not have preferences setup. 23705 * Therefore a local state is also used as a fallback. 23706 * 23707 * @param {boolean} prefVal the open/closed state of the Advanced Settings Drawer. 23708 */ 23709 const setSettingsOpenWithPreference = prefVal => { 23710 if (setPreference) { 23711 setPreference(PREFERENCE_SCOPE, PREFERENCE_KEY, prefVal); 23712 } 23713 setSettingsOpen(prefVal); 23714 }; 23715 23716 // Block Editor components can be consumed by non-WordPress environments 23717 // which may not have these preferences setup. 23718 // Therefore a local state is used as a fallback. 23719 const isSettingsOpen = advancedSettingsPreference || settingsOpen; 23720 const isMountingRef = (0,external_wp_element_namespaceObject.useRef)(true); 23721 const wrapperNode = (0,external_wp_element_namespaceObject.useRef)(); 23722 const textInputRef = (0,external_wp_element_namespaceObject.useRef)(); 23723 const isEndingEditWithFocusRef = (0,external_wp_element_namespaceObject.useRef)(false); 23724 const settingsKeys = settings.map(({ 23725 id 23726 }) => id); 23727 const [internalControlValue, setInternalControlValue, setInternalURLInputValue, setInternalTextInputValue, createSetInternalSettingValueHandler] = useInternalValue(value); 23728 const valueHasChanges = value && !(0,external_wp_isShallowEqual_namespaceObject.isShallowEqualObjects)(internalControlValue, value); 23729 const [isEditingLink, setIsEditingLink] = (0,external_wp_element_namespaceObject.useState)(forceIsEditingLink !== undefined ? forceIsEditingLink : !value || !value.url); 23730 const { 23731 createPage, 23732 isCreatingPage, 23733 errorMessage 23734 } = useCreatePage(createSuggestion); 23735 (0,external_wp_element_namespaceObject.useEffect)(() => { 23736 if (forceIsEditingLink === undefined) { 23737 return; 23738 } 23739 setIsEditingLink(forceIsEditingLink); 23740 }, [forceIsEditingLink]); 23741 (0,external_wp_element_namespaceObject.useEffect)(() => { 23742 // We don't auto focus into the Link UI on mount 23743 // because otherwise using the keyboard to select text 23744 // *within* the link format is not possible. 23745 if (isMountingRef.current) { 23746 return; 23747 } 23748 23749 // Scenario - when: 23750 // - switching between editable and non editable LinkControl 23751 // - clicking on a link 23752 // ...then move focus to the *first* element to avoid focus loss 23753 // and to ensure focus is *within* the Link UI. 23754 const nextFocusTarget = external_wp_dom_namespaceObject.focus.focusable.find(wrapperNode.current)[0] || wrapperNode.current; 23755 nextFocusTarget.focus(); 23756 isEndingEditWithFocusRef.current = false; 23757 }, [isEditingLink, isCreatingPage]); 23758 23759 // The component mounting reference is maintained separately 23760 // to correctly reset values in `StrictMode`. 23761 (0,external_wp_element_namespaceObject.useEffect)(() => { 23762 isMountingRef.current = false; 23763 return () => { 23764 isMountingRef.current = true; 23765 }; 23766 }, []); 23767 const hasLinkValue = value?.url?.trim()?.length > 0; 23768 23769 /** 23770 * Cancels editing state and marks that focus may need to be restored after 23771 * the next render, if focus was within the wrapper when editing finished. 23772 */ 23773 const stopEditing = () => { 23774 isEndingEditWithFocusRef.current = !!wrapperNode.current?.contains(wrapperNode.current.ownerDocument.activeElement); 23775 setIsEditingLink(false); 23776 }; 23777 const handleSelectSuggestion = updatedValue => { 23778 // Suggestions may contains "settings" values (e.g. `opensInNewTab`) 23779 // which should not overide any existing settings values set by the 23780 // user. This filters out any settings values from the suggestion. 23781 const nonSettingsChanges = Object.keys(updatedValue).reduce((acc, key) => { 23782 if (!settingsKeys.includes(key)) { 23783 acc[key] = updatedValue[key]; 23784 } 23785 return acc; 23786 }, {}); 23787 onChange({ 23788 ...internalControlValue, 23789 ...nonSettingsChanges, 23790 // As title is not a setting, it must be manually applied 23791 // in such a way as to preserve the users changes over 23792 // any "title" value provided by the "suggestion". 23793 title: internalControlValue?.title || updatedValue?.title 23794 }); 23795 stopEditing(); 23796 }; 23797 const handleSubmit = () => { 23798 if (valueHasChanges) { 23799 // Submit the original value with new stored values applied 23800 // on top. URL is a special case as it may also be a prop. 23801 onChange({ 23802 ...value, 23803 ...internalControlValue, 23804 url: currentUrlInputValue 23805 }); 23806 } 23807 stopEditing(); 23808 }; 23809 const handleSubmitWithEnter = event => { 23810 const { 23811 keyCode 23812 } = event; 23813 if (keyCode === external_wp_keycodes_namespaceObject.ENTER && !currentInputIsEmpty // Disallow submitting empty values. 23814 ) { 23815 event.preventDefault(); 23816 handleSubmit(); 23817 } 23818 }; 23819 const resetInternalValues = () => { 23820 setInternalControlValue(value); 23821 }; 23822 const handleCancel = event => { 23823 event.preventDefault(); 23824 event.stopPropagation(); 23825 23826 // Ensure that any unsubmitted input changes are reset. 23827 resetInternalValues(); 23828 if (hasLinkValue) { 23829 // If there is a link then exist editing mode and show preview. 23830 stopEditing(); 23831 } else { 23832 // If there is no link value, then remove the link entirely. 23833 onRemove?.(); 23834 } 23835 onCancel?.(); 23836 }; 23837 const currentUrlInputValue = propInputValue || internalControlValue?.url || ''; 23838 const currentInputIsEmpty = !currentUrlInputValue?.trim()?.length; 23839 const shownUnlinkControl = onRemove && value && !isEditingLink && !isCreatingPage; 23840 const showActions = isEditingLink && hasLinkValue; 23841 23842 // Only show text control once a URL value has been committed 23843 // and it isn't just empty whitespace. 23844 // See https://github.com/WordPress/gutenberg/pull/33849/#issuecomment-932194927. 23845 const showTextControl = hasLinkValue && hasTextControl; 23846 const isEditing = (isEditingLink || !value) && !isCreatingPage; 23847 const isDisabled = !valueHasChanges || currentInputIsEmpty; 23848 const showSettings = !!settings?.length && isEditingLink && hasLinkValue; 23849 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 23850 tabIndex: -1, 23851 ref: wrapperNode, 23852 className: "block-editor-link-control", 23853 children: [isCreatingPage && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 23854 className: "block-editor-link-control__loading", 23855 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Spinner, {}), " ", (0,external_wp_i18n_namespaceObject.__)('Creating'), "\u2026"] 23856 }), isEditing && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 23857 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 23858 className: dist_clsx({ 23859 'block-editor-link-control__search-input-wrapper': true, 23860 'has-text-control': showTextControl, 23861 'has-actions': showActions 23862 }), 23863 children: [showTextControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextControl, { 23864 __nextHasNoMarginBottom: true, 23865 ref: textInputRef, 23866 className: "block-editor-link-control__field block-editor-link-control__text-content", 23867 label: (0,external_wp_i18n_namespaceObject.__)('Text'), 23868 value: internalControlValue?.title, 23869 onChange: setInternalTextInputValue, 23870 onKeyDown: handleSubmitWithEnter, 23871 __next40pxDefaultSize: true 23872 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(search_input, { 23873 currentLink: value, 23874 className: "block-editor-link-control__field block-editor-link-control__search-input", 23875 placeholder: searchInputPlaceholder, 23876 value: currentUrlInputValue, 23877 withCreateSuggestion: withCreateSuggestion, 23878 onCreateSuggestion: createPage, 23879 onChange: setInternalURLInputValue, 23880 onSelect: handleSelectSuggestion, 23881 showInitialSuggestions: showInitialSuggestions, 23882 allowDirectEntry: !noDirectEntry, 23883 showSuggestions: showSuggestions, 23884 suggestionsQuery: suggestionsQuery, 23885 withURLSuggestion: !noURLSuggestion, 23886 createSuggestionButtonText: createSuggestionButtonText, 23887 hideLabelFromVision: !showTextControl, 23888 suffix: showActions ? undefined : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControlSuffixWrapper, { 23889 variant: "control", 23890 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 23891 onClick: isDisabled ? link_control_noop : handleSubmit, 23892 label: (0,external_wp_i18n_namespaceObject.__)('Submit'), 23893 icon: keyboard_return, 23894 className: "block-editor-link-control__search-submit", 23895 "aria-disabled": isDisabled, 23896 size: "small" 23897 }) 23898 }), 23899 props: true 23900 })] 23901 }), errorMessage && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Notice, { 23902 className: "block-editor-link-control__search-error", 23903 status: "error", 23904 isDismissible: false, 23905 children: errorMessage 23906 })] 23907 }), value && !isEditingLink && !isCreatingPage && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LinkPreview, { 23908 // force remount when URL changes to avoid race conditions for rich previews 23909 value: value, 23910 onEditClick: () => setIsEditingLink(true), 23911 hasRichPreviews: hasRichPreviews, 23912 hasUnlinkControl: shownUnlinkControl, 23913 onRemove: () => { 23914 onRemove(); 23915 setIsEditingLink(true); 23916 } 23917 }, value?.url), showSettings && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 23918 className: "block-editor-link-control__tools", 23919 children: !currentInputIsEmpty && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(settings_drawer, { 23920 settingsOpen: isSettingsOpen, 23921 setSettingsOpen: setSettingsOpenWithPreference, 23922 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(link_control_settings, { 23923 value: internalControlValue, 23924 settings: settings, 23925 onChange: createSetInternalSettingValueHandler(settingsKeys) 23926 }) 23927 }) 23928 }), showActions && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 23929 justify: "right", 23930 className: "block-editor-link-control__search-actions", 23931 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 23932 __next40pxDefaultSize: true, 23933 variant: "tertiary", 23934 onClick: handleCancel, 23935 children: (0,external_wp_i18n_namespaceObject.__)('Cancel') 23936 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 23937 __next40pxDefaultSize: true, 23938 variant: "primary", 23939 onClick: isDisabled ? link_control_noop : handleSubmit, 23940 className: "block-editor-link-control__search-submit", 23941 "aria-disabled": isDisabled, 23942 children: (0,external_wp_i18n_namespaceObject.__)('Save') 23943 })] 23944 }), !isCreatingPage && renderControlBottom && renderControlBottom()] 23945 }); 23946 } 23947 LinkControl.ViewerFill = ViewerFill; 23948 LinkControl.DEFAULT_LINK_SETTINGS = DEFAULT_LINK_SETTINGS; 23949 /* harmony default export */ const link_control = (LinkControl); 23950 23951 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/media-replace-flow/index.js 23952 /** 23953 * External dependencies 23954 */ 23955 23956 23957 /** 23958 * WordPress dependencies 23959 */ 23960 23961 23962 23963 23964 23965 23966 23967 23968 23969 23970 23971 /** 23972 * Internal dependencies 23973 */ 23974 23975 23976 23977 23978 23979 23980 23981 const media_replace_flow_noop = () => {}; 23982 let uniqueId = 0; 23983 const MediaReplaceFlow = ({ 23984 mediaURL, 23985 mediaId, 23986 mediaIds, 23987 allowedTypes, 23988 accept, 23989 onError, 23990 onSelect, 23991 onSelectURL, 23992 onReset, 23993 onToggleFeaturedImage, 23994 useFeaturedImage, 23995 onFilesUpload = media_replace_flow_noop, 23996 name = (0,external_wp_i18n_namespaceObject.__)('Replace'), 23997 createNotice, 23998 removeNotice, 23999 children, 24000 multiple = false, 24001 addToGallery, 24002 handleUpload = true, 24003 popoverProps 24004 }) => { 24005 const mediaUpload = (0,external_wp_data_namespaceObject.useSelect)(select => { 24006 return select(store).getSettings().mediaUpload; 24007 }, []); 24008 const canUpload = !!mediaUpload; 24009 const editMediaButtonRef = (0,external_wp_element_namespaceObject.useRef)(); 24010 const errorNoticeID = `block-editor/media-replace-flow/error-notice/${++uniqueId}`; 24011 const onUploadError = message => { 24012 const safeMessage = (0,external_wp_dom_namespaceObject.__unstableStripHTML)(message); 24013 if (onError) { 24014 onError(safeMessage); 24015 return; 24016 } 24017 // We need to set a timeout for showing the notice 24018 // so that VoiceOver and possibly other screen readers 24019 // can announce the error after the toolbar button 24020 // regains focus once the upload dialog closes. 24021 // Otherwise VO simply skips over the notice and announces 24022 // the focused element and the open menu. 24023 setTimeout(() => { 24024 createNotice('error', safeMessage, { 24025 speak: true, 24026 id: errorNoticeID, 24027 isDismissible: true 24028 }); 24029 }, 1000); 24030 }; 24031 const selectMedia = (media, closeMenu) => { 24032 if (useFeaturedImage && onToggleFeaturedImage) { 24033 onToggleFeaturedImage(); 24034 } 24035 closeMenu(); 24036 // Calling `onSelect` after the state update since it might unmount the component. 24037 onSelect(media); 24038 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.__)('The media file has been replaced')); 24039 removeNotice(errorNoticeID); 24040 }; 24041 const uploadFiles = (event, closeMenu) => { 24042 const files = event.target.files; 24043 if (!handleUpload) { 24044 closeMenu(); 24045 return onSelect(files); 24046 } 24047 onFilesUpload(files); 24048 mediaUpload({ 24049 allowedTypes, 24050 filesList: files, 24051 onFileChange: ([media]) => { 24052 selectMedia(media, closeMenu); 24053 }, 24054 onError: onUploadError 24055 }); 24056 }; 24057 const openOnArrowDown = event => { 24058 if (event.keyCode === external_wp_keycodes_namespaceObject.DOWN) { 24059 event.preventDefault(); 24060 event.target.click(); 24061 } 24062 }; 24063 const onlyAllowsImages = () => { 24064 if (!allowedTypes || allowedTypes.length === 0) { 24065 return false; 24066 } 24067 return allowedTypes.every(allowedType => allowedType === 'image' || allowedType.startsWith('image/')); 24068 }; 24069 const gallery = multiple && onlyAllowsImages(); 24070 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 24071 popoverProps: popoverProps, 24072 contentClassName: "block-editor-media-replace-flow__options", 24073 renderToggle: ({ 24074 isOpen, 24075 onToggle 24076 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 24077 ref: editMediaButtonRef, 24078 "aria-expanded": isOpen, 24079 "aria-haspopup": "true", 24080 onClick: onToggle, 24081 onKeyDown: openOnArrowDown, 24082 children: name 24083 }), 24084 renderContent: ({ 24085 onClose 24086 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 24087 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.NavigableMenu, { 24088 className: "block-editor-media-replace-flow__media-upload-menu", 24089 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(check, { 24090 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(media_upload, { 24091 gallery: gallery, 24092 addToGallery: addToGallery, 24093 multiple: multiple, 24094 value: multiple ? mediaIds : mediaId, 24095 onSelect: media => selectMedia(media, onClose), 24096 allowedTypes: allowedTypes, 24097 render: ({ 24098 open 24099 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 24100 icon: library_media, 24101 onClick: open, 24102 children: (0,external_wp_i18n_namespaceObject.__)('Open Media Library') 24103 }) 24104 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FormFileUpload, { 24105 onChange: event => { 24106 uploadFiles(event, onClose); 24107 }, 24108 accept: accept, 24109 multiple: !!multiple, 24110 render: ({ 24111 openFileDialog 24112 }) => { 24113 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 24114 icon: library_upload, 24115 onClick: () => { 24116 openFileDialog(); 24117 }, 24118 children: (0,external_wp_i18n_namespaceObject.__)('Upload') 24119 }); 24120 } 24121 })] 24122 }), onToggleFeaturedImage && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 24123 icon: post_featured_image, 24124 onClick: onToggleFeaturedImage, 24125 isPressed: useFeaturedImage, 24126 children: (0,external_wp_i18n_namespaceObject.__)('Use featured image') 24127 }), mediaURL && onReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 24128 onClick: () => { 24129 onReset(); 24130 onClose(); 24131 }, 24132 children: (0,external_wp_i18n_namespaceObject.__)('Reset') 24133 }), typeof children === 'function' ? children({ 24134 onClose 24135 }) : children] 24136 }), onSelectURL && 24137 /*#__PURE__*/ 24138 // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions 24139 (0,external_ReactJSXRuntime_namespaceObject.jsxs)("form", { 24140 className: dist_clsx('block-editor-media-flow__url-input', { 24141 'has-siblings': canUpload || onToggleFeaturedImage 24142 }), 24143 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 24144 className: "block-editor-media-replace-flow__image-url-label", 24145 children: (0,external_wp_i18n_namespaceObject.__)('Current media URL:') 24146 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(link_control, { 24147 value: { 24148 url: mediaURL 24149 }, 24150 settings: [], 24151 showSuggestions: false, 24152 onChange: ({ 24153 url 24154 }) => { 24155 onSelectURL(url); 24156 editMediaButtonRef.current.focus(); 24157 } 24158 })] 24159 })] 24160 }) 24161 }); 24162 }; 24163 24164 /** 24165 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/media-replace-flow/README.md 24166 */ 24167 /* harmony default export */ const media_replace_flow = ((0,external_wp_compose_namespaceObject.compose)([(0,external_wp_data_namespaceObject.withDispatch)(dispatch => { 24168 const { 24169 createNotice, 24170 removeNotice 24171 } = dispatch(external_wp_notices_namespaceObject.store); 24172 return { 24173 createNotice, 24174 removeNotice 24175 }; 24176 }), (0,external_wp_components_namespaceObject.withFilters)('editor.MediaReplaceFlow')])(MediaReplaceFlow)); 24177 24178 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/background-image-control/index.js 24179 /** 24180 * External dependencies 24181 */ 24182 24183 24184 /** 24185 * WordPress dependencies 24186 */ 24187 24188 24189 24190 24191 24192 24193 24194 24195 24196 /** 24197 * Internal dependencies 24198 */ 24199 24200 24201 24202 24203 24204 24205 24206 24207 const IMAGE_BACKGROUND_TYPE = 'image'; 24208 const BACKGROUND_POPOVER_PROPS = { 24209 placement: 'left-start', 24210 offset: 36, 24211 shift: true, 24212 className: 'block-editor-global-styles-background-panel__popover' 24213 }; 24214 const background_image_control_noop = () => {}; 24215 24216 /** 24217 * Get the help text for the background size control. 24218 * 24219 * @param {string} value backgroundSize value. 24220 * @return {string} Translated help text. 24221 */ 24222 function backgroundSizeHelpText(value) { 24223 if (value === 'cover' || value === undefined) { 24224 return (0,external_wp_i18n_namespaceObject.__)('Image covers the space evenly.'); 24225 } 24226 if (value === 'contain') { 24227 return (0,external_wp_i18n_namespaceObject.__)('Image is contained without distortion.'); 24228 } 24229 return (0,external_wp_i18n_namespaceObject.__)('Image has a fixed width.'); 24230 } 24231 24232 /** 24233 * Converts decimal x and y coords from FocalPointPicker to percentage-based values 24234 * to use as backgroundPosition value. 24235 * 24236 * @param {{x?:number, y?:number}} value FocalPointPicker coords. 24237 * @return {string} backgroundPosition value. 24238 */ 24239 const coordsToBackgroundPosition = value => { 24240 if (!value || isNaN(value.x) && isNaN(value.y)) { 24241 return undefined; 24242 } 24243 const x = isNaN(value.x) ? 0.5 : value.x; 24244 const y = isNaN(value.y) ? 0.5 : value.y; 24245 return `$x * 100}% $y * 100}%`; 24246 }; 24247 24248 /** 24249 * Converts backgroundPosition value to x and y coords for FocalPointPicker. 24250 * 24251 * @param {string} value backgroundPosition value. 24252 * @return {{x?:number, y?:number}} FocalPointPicker coords. 24253 */ 24254 const backgroundPositionToCoords = value => { 24255 if (!value) { 24256 return { 24257 x: undefined, 24258 y: undefined 24259 }; 24260 } 24261 let [x, y] = value.split(' ').map(v => parseFloat(v) / 100); 24262 x = isNaN(x) ? undefined : x; 24263 y = isNaN(y) ? x : y; 24264 return { 24265 x, 24266 y 24267 }; 24268 }; 24269 function InspectorImagePreviewItem({ 24270 as = 'span', 24271 imgUrl, 24272 toggleProps = {}, 24273 filename, 24274 label, 24275 className, 24276 onToggleCallback = background_image_control_noop 24277 }) { 24278 (0,external_wp_element_namespaceObject.useEffect)(() => { 24279 if (typeof toggleProps?.isOpen !== 'undefined') { 24280 onToggleCallback(toggleProps?.isOpen); 24281 } 24282 }, [toggleProps?.isOpen, onToggleCallback]); 24283 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalItemGroup, { 24284 as: as, 24285 className: className, 24286 ...toggleProps, 24287 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 24288 justify: "flex-start", 24289 as: "span", 24290 className: "block-editor-global-styles-background-panel__inspector-preview-inner", 24291 children: [imgUrl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 24292 className: "block-editor-global-styles-background-panel__inspector-image-indicator-wrapper", 24293 "aria-hidden": true, 24294 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 24295 className: "block-editor-global-styles-background-panel__inspector-image-indicator", 24296 style: { 24297 backgroundImage: `url($imgUrl})` 24298 } 24299 }) 24300 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.FlexItem, { 24301 as: "span", 24302 style: imgUrl ? {} : { 24303 flexGrow: 1 24304 }, 24305 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, { 24306 numberOfLines: 1, 24307 className: "block-editor-global-styles-background-panel__inspector-media-replace-title", 24308 children: label 24309 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 24310 as: "span", 24311 children: imgUrl ? (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: file name */ 24312 (0,external_wp_i18n_namespaceObject.__)('Background image: %s'), filename || label) : (0,external_wp_i18n_namespaceObject.__)('No background image selected') 24313 })] 24314 })] 24315 }) 24316 }); 24317 } 24318 function BackgroundControlsPanel({ 24319 label, 24320 filename, 24321 url: imgUrl, 24322 children, 24323 onToggle: onToggleCallback = background_image_control_noop, 24324 hasImageValue 24325 }) { 24326 if (!hasImageValue) { 24327 return; 24328 } 24329 const imgLabel = label || (0,external_wp_url_namespaceObject.getFilename)(imgUrl) || (0,external_wp_i18n_namespaceObject.__)('Add background image'); 24330 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 24331 popoverProps: BACKGROUND_POPOVER_PROPS, 24332 renderToggle: ({ 24333 onToggle, 24334 isOpen 24335 }) => { 24336 const toggleProps = { 24337 onClick: onToggle, 24338 className: 'block-editor-global-styles-background-panel__dropdown-toggle', 24339 'aria-expanded': isOpen, 24340 'aria-label': (0,external_wp_i18n_namespaceObject.__)('Background size, position and repeat options.'), 24341 isOpen 24342 }; 24343 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InspectorImagePreviewItem, { 24344 imgUrl: imgUrl, 24345 filename: filename, 24346 label: imgLabel, 24347 toggleProps: toggleProps, 24348 as: "button", 24349 onToggleCallback: onToggleCallback 24350 }); 24351 }, 24352 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalDropdownContentWrapper, { 24353 className: "block-editor-global-styles-background-panel__dropdown-content-wrapper", 24354 paddingSize: "medium", 24355 children: children 24356 }) 24357 }); 24358 } 24359 function LoadingSpinner() { 24360 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Placeholder, { 24361 className: "block-editor-global-styles-background-panel__loading", 24362 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Spinner, {}) 24363 }); 24364 } 24365 function BackgroundImageControls({ 24366 onChange, 24367 style, 24368 inheritedValue, 24369 onRemoveImage = background_image_control_noop, 24370 onResetImage = background_image_control_noop, 24371 displayInPanel, 24372 defaultValues 24373 }) { 24374 const [isUploading, setIsUploading] = (0,external_wp_element_namespaceObject.useState)(false); 24375 const { 24376 getSettings 24377 } = (0,external_wp_data_namespaceObject.useSelect)(store); 24378 const { 24379 id, 24380 title, 24381 url 24382 } = style?.background?.backgroundImage || { 24383 ...inheritedValue?.background?.backgroundImage 24384 }; 24385 const replaceContainerRef = (0,external_wp_element_namespaceObject.useRef)(); 24386 const { 24387 createErrorNotice 24388 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_notices_namespaceObject.store); 24389 const onUploadError = message => { 24390 createErrorNotice(message, { 24391 type: 'snackbar' 24392 }); 24393 setIsUploading(false); 24394 }; 24395 const resetBackgroundImage = () => onChange(setImmutably(style, ['background', 'backgroundImage'], undefined)); 24396 const onSelectMedia = media => { 24397 if (!media || !media.url) { 24398 resetBackgroundImage(); 24399 setIsUploading(false); 24400 return; 24401 } 24402 if ((0,external_wp_blob_namespaceObject.isBlobURL)(media.url)) { 24403 setIsUploading(true); 24404 return; 24405 } 24406 24407 // For media selections originated from a file upload. 24408 if (media.media_type && media.media_type !== IMAGE_BACKGROUND_TYPE || !media.media_type && media.type && media.type !== IMAGE_BACKGROUND_TYPE) { 24409 onUploadError((0,external_wp_i18n_namespaceObject.__)('Only images can be used as a background image.')); 24410 return; 24411 } 24412 const sizeValue = style?.background?.backgroundSize || defaultValues?.backgroundSize; 24413 const positionValue = style?.background?.backgroundPosition; 24414 onChange(setImmutably(style, ['background'], { 24415 ...style?.background, 24416 backgroundImage: { 24417 url: media.url, 24418 id: media.id, 24419 source: 'file', 24420 title: media.title || undefined 24421 }, 24422 backgroundPosition: 24423 /* 24424 * A background image uploaded and set in the editor receives a default background position of '50% 0', 24425 * when the background image size is the equivalent of "Tile". 24426 * This is to increase the chance that the image's focus point is visible. 24427 * This is in-editor only to assist with the user experience. 24428 */ 24429 !positionValue && ('auto' === sizeValue || !sizeValue) ? '50% 0' : positionValue, 24430 backgroundSize: sizeValue 24431 })); 24432 setIsUploading(false); 24433 }; 24434 24435 // Drag and drop callback, restricting image to one. 24436 const onFilesDrop = filesList => { 24437 if (filesList?.length > 1) { 24438 onUploadError((0,external_wp_i18n_namespaceObject.__)('Only one image can be used as a background image.')); 24439 return; 24440 } 24441 getSettings().mediaUpload({ 24442 allowedTypes: [IMAGE_BACKGROUND_TYPE], 24443 filesList, 24444 onFileChange([image]) { 24445 onSelectMedia(image); 24446 }, 24447 onError: onUploadError 24448 }); 24449 }; 24450 const hasValue = hasBackgroundImageValue(style); 24451 const closeAndFocus = () => { 24452 const [toggleButton] = external_wp_dom_namespaceObject.focus.tabbable.find(replaceContainerRef.current); 24453 // Focus the toggle button and close the dropdown menu. 24454 // This ensures similar behaviour as to selecting an image, where the dropdown is 24455 // closed and focus is redirected to the dropdown toggle button. 24456 toggleButton?.focus(); 24457 toggleButton?.click(); 24458 }; 24459 const onRemove = () => onChange(setImmutably(style, ['background'], { 24460 backgroundImage: 'none' 24461 })); 24462 const canRemove = !hasValue && hasBackgroundImageValue(inheritedValue); 24463 const imgLabel = title || (0,external_wp_url_namespaceObject.getFilename)(url) || (0,external_wp_i18n_namespaceObject.__)('Add background image'); 24464 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 24465 ref: replaceContainerRef, 24466 className: "block-editor-global-styles-background-panel__image-tools-panel-item", 24467 children: [isUploading && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LoadingSpinner, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(media_replace_flow, { 24468 mediaId: id, 24469 mediaURL: url, 24470 allowedTypes: [IMAGE_BACKGROUND_TYPE], 24471 accept: "image/*", 24472 onSelect: onSelectMedia, 24473 popoverProps: { 24474 className: dist_clsx({ 24475 'block-editor-global-styles-background-panel__media-replace-popover': displayInPanel 24476 }) 24477 }, 24478 name: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InspectorImagePreviewItem, { 24479 className: "block-editor-global-styles-background-panel__image-preview", 24480 imgUrl: url, 24481 filename: title, 24482 label: imgLabel 24483 }), 24484 variant: "secondary", 24485 onError: onUploadError, 24486 onReset: () => { 24487 closeAndFocus(); 24488 onResetImage(); 24489 }, 24490 children: canRemove && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 24491 onClick: () => { 24492 closeAndFocus(); 24493 onRemove(); 24494 onRemoveImage(); 24495 }, 24496 children: (0,external_wp_i18n_namespaceObject.__)('Remove') 24497 }) 24498 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropZone, { 24499 onFilesDrop: onFilesDrop, 24500 label: (0,external_wp_i18n_namespaceObject.__)('Drop to upload') 24501 })] 24502 }); 24503 } 24504 function BackgroundSizeControls({ 24505 onChange, 24506 style, 24507 inheritedValue, 24508 defaultValues 24509 }) { 24510 const sizeValue = style?.background?.backgroundSize || inheritedValue?.background?.backgroundSize; 24511 const repeatValue = style?.background?.backgroundRepeat || inheritedValue?.background?.backgroundRepeat; 24512 const imageValue = style?.background?.backgroundImage?.url || inheritedValue?.background?.backgroundImage?.url; 24513 const isUploadedImage = style?.background?.backgroundImage?.id; 24514 const positionValue = style?.background?.backgroundPosition || inheritedValue?.background?.backgroundPosition; 24515 const attachmentValue = style?.background?.backgroundAttachment || inheritedValue?.background?.backgroundAttachment; 24516 24517 /* 24518 * Set default values for uploaded images. 24519 * The default values are passed by the consumer. 24520 * Block-level controls may have different defaults to root-level controls. 24521 * A falsy value is treated by default as `auto` (Tile). 24522 */ 24523 let currentValueForToggle = !sizeValue && isUploadedImage ? defaultValues?.backgroundSize : sizeValue || 'auto'; 24524 /* 24525 * The incoming value could be a value + unit, e.g. '20px'. 24526 * In this case set the value to 'tile'. 24527 */ 24528 currentValueForToggle = !['cover', 'contain', 'auto'].includes(currentValueForToggle) ? 'auto' : currentValueForToggle; 24529 /* 24530 * If the current value is `cover` and the repeat value is `undefined`, then 24531 * the toggle should be unchecked as the default state. Otherwise, the toggle 24532 * should reflect the current repeat value. 24533 */ 24534 const repeatCheckedValue = !(repeatValue === 'no-repeat' || currentValueForToggle === 'cover' && repeatValue === undefined); 24535 const updateBackgroundSize = next => { 24536 // When switching to 'contain' toggle the repeat off. 24537 let nextRepeat = repeatValue; 24538 let nextPosition = positionValue; 24539 if (next === 'contain') { 24540 nextRepeat = 'no-repeat'; 24541 nextPosition = undefined; 24542 } 24543 if (next === 'cover') { 24544 nextRepeat = undefined; 24545 nextPosition = undefined; 24546 } 24547 if ((currentValueForToggle === 'cover' || currentValueForToggle === 'contain') && next === 'auto') { 24548 nextRepeat = undefined; 24549 /* 24550 * A background image uploaded and set in the editor (an image with a record id), 24551 * receives a default background position of '50% 0', 24552 * when the toggle switches to "Tile". This is to increase the chance that 24553 * the image's focus point is visible. 24554 * This is in-editor only to assist with the user experience. 24555 */ 24556 if (!!style?.background?.backgroundImage?.id) { 24557 nextPosition = '50% 0'; 24558 } 24559 } 24560 24561 /* 24562 * Next will be null when the input is cleared, 24563 * in which case the value should be 'auto'. 24564 */ 24565 if (!next && currentValueForToggle === 'auto') { 24566 next = 'auto'; 24567 } 24568 onChange(setImmutably(style, ['background'], { 24569 ...style?.background, 24570 backgroundPosition: nextPosition, 24571 backgroundRepeat: nextRepeat, 24572 backgroundSize: next 24573 })); 24574 }; 24575 const updateBackgroundPosition = next => { 24576 onChange(setImmutably(style, ['background', 'backgroundPosition'], coordsToBackgroundPosition(next))); 24577 }; 24578 const toggleIsRepeated = () => onChange(setImmutably(style, ['background', 'backgroundRepeat'], repeatCheckedValue === true ? 'no-repeat' : 'repeat')); 24579 const toggleScrollWithPage = () => onChange(setImmutably(style, ['background', 'backgroundAttachment'], attachmentValue === 'fixed' ? 'scroll' : 'fixed')); 24580 24581 // Set a default background position for non-site-wide, uploaded images with a size of 'contain'. 24582 const backgroundPositionValue = !positionValue && isUploadedImage && 'contain' === sizeValue ? defaultValues?.backgroundPosition : positionValue; 24583 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 24584 spacing: 3, 24585 className: "single-column", 24586 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FocalPointPicker, { 24587 __nextHasNoMarginBottom: true, 24588 label: (0,external_wp_i18n_namespaceObject.__)('Focal point'), 24589 url: imageValue, 24590 value: backgroundPositionToCoords(backgroundPositionValue), 24591 onChange: updateBackgroundPosition 24592 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 24593 __nextHasNoMarginBottom: true, 24594 label: (0,external_wp_i18n_namespaceObject.__)('Fixed background'), 24595 checked: attachmentValue === 'fixed', 24596 onChange: toggleScrollWithPage 24597 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 24598 __nextHasNoMarginBottom: true, 24599 size: "__unstable-large", 24600 label: (0,external_wp_i18n_namespaceObject.__)('Size'), 24601 value: currentValueForToggle, 24602 onChange: updateBackgroundSize, 24603 isBlock: true, 24604 help: backgroundSizeHelpText(sizeValue || defaultValues?.backgroundSize), 24605 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 24606 value: "cover", 24607 label: (0,external_wp_i18n_namespaceObject._x)('Cover', 'Size option for background image control') 24608 }, "cover"), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 24609 value: "contain", 24610 label: (0,external_wp_i18n_namespaceObject._x)('Contain', 'Size option for background image control') 24611 }, "contain"), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 24612 value: "auto", 24613 label: (0,external_wp_i18n_namespaceObject._x)('Tile', 'Size option for background image control') 24614 }, "tile")] 24615 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 24616 justify: "flex-start", 24617 spacing: 2, 24618 as: "span", 24619 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 24620 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Background image width'), 24621 onChange: updateBackgroundSize, 24622 value: sizeValue, 24623 size: "__unstable-large", 24624 __unstableInputWidth: "100px", 24625 min: 0, 24626 placeholder: (0,external_wp_i18n_namespaceObject.__)('Auto'), 24627 disabled: currentValueForToggle !== 'auto' || currentValueForToggle === undefined 24628 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 24629 __nextHasNoMarginBottom: true, 24630 label: (0,external_wp_i18n_namespaceObject.__)('Repeat'), 24631 checked: repeatCheckedValue, 24632 onChange: toggleIsRepeated, 24633 disabled: currentValueForToggle === 'cover' 24634 })] 24635 })] 24636 }); 24637 } 24638 function BackgroundImagePanel({ 24639 value, 24640 onChange, 24641 inheritedValue = value, 24642 settings, 24643 defaultValues = {} 24644 }) { 24645 /* 24646 * Resolve any inherited "ref" pointers. 24647 * Should the block editor need resolved, inherited values 24648 * across all controls, this could be abstracted into a hook, 24649 * e.g., useResolveGlobalStyle 24650 */ 24651 const { 24652 globalStyles, 24653 _links 24654 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 24655 const { 24656 getSettings 24657 } = select(store); 24658 const _settings = getSettings(); 24659 return { 24660 globalStyles: _settings[globalStylesDataKey], 24661 _links: _settings[globalStylesLinksDataKey] 24662 }; 24663 }, []); 24664 const resolvedInheritedValue = (0,external_wp_element_namespaceObject.useMemo)(() => { 24665 const resolvedValues = { 24666 background: {} 24667 }; 24668 if (!inheritedValue?.background) { 24669 return inheritedValue; 24670 } 24671 Object.entries(inheritedValue?.background).forEach(([key, backgroundValue]) => { 24672 resolvedValues.background[key] = getResolvedValue(backgroundValue, { 24673 styles: globalStyles, 24674 _links 24675 }); 24676 }); 24677 return resolvedValues; 24678 }, [globalStyles, _links, inheritedValue]); 24679 const resetBackground = () => onChange(setImmutably(value, ['background'], {})); 24680 const { 24681 title, 24682 url 24683 } = value?.background?.backgroundImage || { 24684 ...resolvedInheritedValue?.background?.backgroundImage 24685 }; 24686 const hasImageValue = hasBackgroundImageValue(value) || hasBackgroundImageValue(resolvedInheritedValue); 24687 const imageValue = value?.background?.backgroundImage || inheritedValue?.background?.backgroundImage; 24688 const shouldShowBackgroundImageControls = hasImageValue && 'none' !== imageValue && (settings?.background?.backgroundSize || settings?.background?.backgroundPosition || settings?.background?.backgroundRepeat); 24689 const [isDropDownOpen, setIsDropDownOpen] = (0,external_wp_element_namespaceObject.useState)(false); 24690 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 24691 className: dist_clsx('block-editor-global-styles-background-panel__inspector-media-replace-container', { 24692 'is-open': isDropDownOpen 24693 }), 24694 children: shouldShowBackgroundImageControls ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackgroundControlsPanel, { 24695 label: title, 24696 filename: title, 24697 url: url, 24698 onToggle: setIsDropDownOpen, 24699 hasImageValue: hasImageValue, 24700 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 24701 spacing: 3, 24702 className: "single-column", 24703 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackgroundImageControls, { 24704 onChange: onChange, 24705 style: value, 24706 inheritedValue: resolvedInheritedValue, 24707 displayInPanel: true, 24708 onResetImage: () => { 24709 setIsDropDownOpen(false); 24710 resetBackground(); 24711 }, 24712 onRemoveImage: () => setIsDropDownOpen(false), 24713 defaultValues: defaultValues 24714 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackgroundSizeControls, { 24715 onChange: onChange, 24716 style: value, 24717 defaultValues: defaultValues, 24718 inheritedValue: resolvedInheritedValue 24719 })] 24720 }) 24721 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackgroundImageControls, { 24722 onChange: onChange, 24723 style: value, 24724 inheritedValue: resolvedInheritedValue, 24725 defaultValues: defaultValues, 24726 onResetImage: () => { 24727 setIsDropDownOpen(false); 24728 resetBackground(); 24729 }, 24730 onRemoveImage: () => setIsDropDownOpen(false) 24731 }) 24732 }); 24733 } 24734 24735 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/background-panel.js 24736 /** 24737 * WordPress dependencies 24738 */ 24739 24740 24741 /** 24742 * Internal dependencies 24743 */ 24744 24745 24746 24747 24748 24749 const background_panel_DEFAULT_CONTROLS = { 24750 backgroundImage: true 24751 }; 24752 24753 /** 24754 * Checks site settings to see if the background panel may be used. 24755 * `settings.background.backgroundSize` exists also, 24756 * but can only be used if settings?.background?.backgroundImage is `true`. 24757 * 24758 * @param {Object} settings Site settings 24759 * @return {boolean} Whether site settings has activated background panel. 24760 */ 24761 function useHasBackgroundPanel(settings) { 24762 return external_wp_element_namespaceObject.Platform.OS === 'web' && settings?.background?.backgroundImage; 24763 } 24764 24765 /** 24766 * Checks if there is a current value in the background size block support 24767 * attributes. Background size values include background size as well 24768 * as background position. 24769 * 24770 * @param {Object} style Style attribute. 24771 * @return {boolean} Whether the block has a background size value set. 24772 */ 24773 function hasBackgroundSizeValue(style) { 24774 return style?.background?.backgroundPosition !== undefined || style?.background?.backgroundSize !== undefined; 24775 } 24776 24777 /** 24778 * Checks if there is a current value in the background image block support 24779 * attributes. 24780 * 24781 * @param {Object} style Style attribute. 24782 * @return {boolean} Whether the block has a background image value set. 24783 */ 24784 function hasBackgroundImageValue(style) { 24785 return !!style?.background?.backgroundImage?.id || 24786 // Supports url() string values in theme.json. 24787 'string' === typeof style?.background?.backgroundImage || !!style?.background?.backgroundImage?.url; 24788 } 24789 function BackgroundToolsPanel({ 24790 resetAllFilter, 24791 onChange, 24792 value, 24793 panelId, 24794 children, 24795 headerLabel 24796 }) { 24797 const dropdownMenuProps = useToolsPanelDropdownMenuProps(); 24798 const resetAll = () => { 24799 const updatedValue = resetAllFilter(value); 24800 onChange(updatedValue); 24801 }; 24802 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 24803 label: headerLabel, 24804 resetAll: resetAll, 24805 panelId: panelId, 24806 dropdownMenuProps: dropdownMenuProps, 24807 children: children 24808 }); 24809 } 24810 function background_panel_BackgroundImagePanel({ 24811 as: Wrapper = BackgroundToolsPanel, 24812 value, 24813 onChange, 24814 inheritedValue, 24815 settings, 24816 panelId, 24817 defaultControls = background_panel_DEFAULT_CONTROLS, 24818 defaultValues = {}, 24819 headerLabel = (0,external_wp_i18n_namespaceObject.__)('Background image') 24820 }) { 24821 const showBackgroundImageControl = useHasBackgroundPanel(settings); 24822 const resetBackground = () => onChange(setImmutably(value, ['background'], {})); 24823 const resetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(previousValue => { 24824 return { 24825 ...previousValue, 24826 background: {} 24827 }; 24828 }, []); 24829 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Wrapper, { 24830 resetAllFilter: resetAllFilter, 24831 value: value, 24832 onChange: onChange, 24833 panelId: panelId, 24834 headerLabel: headerLabel, 24835 children: showBackgroundImageControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 24836 hasValue: () => !!value?.background, 24837 label: (0,external_wp_i18n_namespaceObject.__)('Image'), 24838 onDeselect: resetBackground, 24839 isShownByDefault: defaultControls.backgroundImage, 24840 panelId: panelId, 24841 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackgroundImagePanel, { 24842 value: value, 24843 onChange: onChange, 24844 settings: settings, 24845 inheritedValue: inheritedValue, 24846 defaultControls: defaultControls, 24847 defaultValues: defaultValues 24848 }) 24849 }) 24850 }); 24851 } 24852 24853 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/background.js 24854 /** 24855 * WordPress dependencies 24856 */ 24857 24858 24859 24860 24861 /** 24862 * Internal dependencies 24863 */ 24864 24865 24866 24867 24868 24869 24870 const BACKGROUND_SUPPORT_KEY = 'background'; 24871 24872 // Initial control values. 24873 const BACKGROUND_BLOCK_DEFAULT_VALUES = { 24874 backgroundSize: 'cover', 24875 backgroundPosition: '50% 50%' // used only when backgroundSize is 'contain'. 24876 }; 24877 24878 /** 24879 * Determine whether there is block support for background. 24880 * 24881 * @param {string} blockName Block name. 24882 * @param {string} feature Background image feature to check for. 24883 * 24884 * @return {boolean} Whether there is support. 24885 */ 24886 function hasBackgroundSupport(blockName, feature = 'any') { 24887 const support = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockName, BACKGROUND_SUPPORT_KEY); 24888 if (support === true) { 24889 return true; 24890 } 24891 if (feature === 'any') { 24892 return !!support?.backgroundImage || !!support?.backgroundSize || !!support?.backgroundRepeat; 24893 } 24894 return !!support?.[feature]; 24895 } 24896 function setBackgroundStyleDefaults(backgroundStyle) { 24897 if (!backgroundStyle || !backgroundStyle?.backgroundImage?.url) { 24898 return; 24899 } 24900 let backgroundStylesWithDefaults; 24901 24902 // Set block background defaults. 24903 if (!backgroundStyle?.backgroundSize) { 24904 backgroundStylesWithDefaults = { 24905 backgroundSize: BACKGROUND_BLOCK_DEFAULT_VALUES.backgroundSize 24906 }; 24907 } 24908 if ('contain' === backgroundStyle?.backgroundSize && !backgroundStyle?.backgroundPosition) { 24909 backgroundStylesWithDefaults = { 24910 backgroundPosition: BACKGROUND_BLOCK_DEFAULT_VALUES.backgroundPosition 24911 }; 24912 } 24913 return backgroundStylesWithDefaults; 24914 } 24915 function background_useBlockProps({ 24916 name, 24917 style 24918 }) { 24919 if (!hasBackgroundSupport(name) || !style?.background?.backgroundImage) { 24920 return; 24921 } 24922 const backgroundStyles = setBackgroundStyleDefaults(style?.background); 24923 if (!backgroundStyles) { 24924 return; 24925 } 24926 return { 24927 style: { 24928 ...backgroundStyles 24929 } 24930 }; 24931 } 24932 24933 /** 24934 * Generates a CSS class name if an background image is set. 24935 * 24936 * @param {Object} style A block's style attribute. 24937 * 24938 * @return {string} CSS class name. 24939 */ 24940 function getBackgroundImageClasses(style) { 24941 return hasBackgroundImageValue(style) ? 'has-background' : ''; 24942 } 24943 function BackgroundInspectorControl({ 24944 children 24945 }) { 24946 const resetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(attributes => { 24947 return { 24948 ...attributes, 24949 style: { 24950 ...attributes.style, 24951 background: undefined 24952 } 24953 }; 24954 }, []); 24955 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 24956 group: "background", 24957 resetAllFilter: resetAllFilter, 24958 children: children 24959 }); 24960 } 24961 function background_BackgroundImagePanel({ 24962 clientId, 24963 name, 24964 setAttributes, 24965 settings 24966 }) { 24967 const { 24968 style, 24969 inheritedValue 24970 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 24971 const { 24972 getBlockAttributes, 24973 getSettings 24974 } = select(store); 24975 const _settings = getSettings(); 24976 return { 24977 style: getBlockAttributes(clientId)?.style, 24978 /* 24979 * To ensure we pass down the right inherited values: 24980 * @TODO 1. Pass inherited value down to all block style controls, 24981 * See: packages/block-editor/src/hooks/style.js 24982 * @TODO 2. Add support for block style variations, 24983 * See implementation: packages/block-editor/src/hooks/block-style-variation.js 24984 */ 24985 inheritedValue: _settings[globalStylesDataKey]?.blocks?.[name] 24986 }; 24987 }, [clientId, name]); 24988 if (!useHasBackgroundPanel(settings) || !hasBackgroundSupport(name, 'backgroundImage')) { 24989 return null; 24990 } 24991 const onChange = newStyle => { 24992 setAttributes({ 24993 style: utils_cleanEmptyObject(newStyle) 24994 }); 24995 }; 24996 const updatedSettings = { 24997 ...settings, 24998 background: { 24999 ...settings.background, 25000 backgroundSize: settings?.background?.backgroundSize && hasBackgroundSupport(name, 'backgroundSize') 25001 } 25002 }; 25003 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(background_panel_BackgroundImagePanel, { 25004 inheritedValue: inheritedValue, 25005 as: BackgroundInspectorControl, 25006 panelId: clientId, 25007 defaultValues: BACKGROUND_BLOCK_DEFAULT_VALUES, 25008 settings: updatedSettings, 25009 onChange: onChange, 25010 value: style 25011 }); 25012 } 25013 /* harmony default export */ const background = ({ 25014 useBlockProps: background_useBlockProps, 25015 attributeKeys: ['style'], 25016 hasSupport: hasBackgroundSupport 25017 }); 25018 25019 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/lock.js 25020 /** 25021 * WordPress dependencies 25022 */ 25023 25024 25025 /** 25026 * Filters registered block settings, extending attributes to include `lock`. 25027 * 25028 * @param {Object} settings Original block settings. 25029 * 25030 * @return {Object} Filtered block settings. 25031 */ 25032 function lock_addAttribute(settings) { 25033 var _settings$attributes$; 25034 // Allow blocks to specify their own attribute definition with default values if needed. 25035 if ('type' in ((_settings$attributes$ = settings.attributes?.lock) !== null && _settings$attributes$ !== void 0 ? _settings$attributes$ : {})) { 25036 return settings; 25037 } 25038 // Gracefully handle if settings.attributes is undefined. 25039 settings.attributes = { 25040 ...settings.attributes, 25041 lock: { 25042 type: 'object' 25043 } 25044 }; 25045 return settings; 25046 } 25047 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/lock/addAttribute', lock_addAttribute); 25048 25049 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/anchor.js 25050 /** 25051 * WordPress dependencies 25052 */ 25053 25054 25055 25056 25057 25058 25059 /** 25060 * Internal dependencies 25061 */ 25062 25063 25064 25065 /** 25066 * Regular expression matching invalid anchor characters for replacement. 25067 * 25068 * @type {RegExp} 25069 */ 25070 25071 25072 25073 const ANCHOR_REGEX = /[\s#]/g; 25074 const ANCHOR_SCHEMA = { 25075 type: 'string', 25076 source: 'attribute', 25077 attribute: 'id', 25078 selector: '*' 25079 }; 25080 25081 /** 25082 * Filters registered block settings, extending attributes with anchor using ID 25083 * of the first node. 25084 * 25085 * @param {Object} settings Original block settings. 25086 * 25087 * @return {Object} Filtered block settings. 25088 */ 25089 function anchor_addAttribute(settings) { 25090 var _settings$attributes$; 25091 // Allow blocks to specify their own attribute definition with default values if needed. 25092 if ('type' in ((_settings$attributes$ = settings.attributes?.anchor) !== null && _settings$attributes$ !== void 0 ? _settings$attributes$ : {})) { 25093 return settings; 25094 } 25095 if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, 'anchor')) { 25096 // Gracefully handle if settings.attributes is undefined. 25097 settings.attributes = { 25098 ...settings.attributes, 25099 anchor: ANCHOR_SCHEMA 25100 }; 25101 } 25102 return settings; 25103 } 25104 function BlockEditAnchorControlPure({ 25105 anchor, 25106 setAttributes 25107 }) { 25108 const blockEditingMode = useBlockEditingMode(); 25109 if (blockEditingMode !== 'default') { 25110 return null; 25111 } 25112 const isWeb = external_wp_element_namespaceObject.Platform.OS === 'web'; 25113 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 25114 group: "advanced", 25115 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextControl, { 25116 __nextHasNoMarginBottom: true, 25117 __next40pxDefaultSize: true, 25118 className: "html-anchor-control", 25119 label: (0,external_wp_i18n_namespaceObject.__)('HTML anchor'), 25120 help: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 25121 children: [(0,external_wp_i18n_namespaceObject.__)('Enter a word or two — without spaces — to make a unique web address just for this block, called an “anchor”. Then, you’ll be able to link directly to this section of your page.'), isWeb && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 25122 children: [' ', /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ExternalLink, { 25123 href: (0,external_wp_i18n_namespaceObject.__)('https://wordpress.org/documentation/article/page-jumps/'), 25124 children: (0,external_wp_i18n_namespaceObject.__)('Learn more about anchors') 25125 })] 25126 })] 25127 }), 25128 value: anchor || '', 25129 placeholder: !isWeb ? (0,external_wp_i18n_namespaceObject.__)('Add an anchor') : null, 25130 onChange: nextValue => { 25131 nextValue = nextValue.replace(ANCHOR_REGEX, '-'); 25132 setAttributes({ 25133 anchor: nextValue 25134 }); 25135 }, 25136 autoCapitalize: "none", 25137 autoComplete: "off" 25138 }) 25139 }); 25140 } 25141 /* harmony default export */ const hooks_anchor = ({ 25142 addSaveProps, 25143 edit: BlockEditAnchorControlPure, 25144 attributeKeys: ['anchor'], 25145 hasSupport(name) { 25146 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, 'anchor'); 25147 } 25148 }); 25149 25150 /** 25151 * Override props assigned to save component to inject anchor ID, if block 25152 * supports anchor. This is only applied if the block's save result is an 25153 * element and not a markup string. 25154 * 25155 * @param {Object} extraProps Additional props applied to save element. 25156 * @param {Object} blockType Block type. 25157 * @param {Object} attributes Current block attributes. 25158 * 25159 * @return {Object} Filtered props applied to save element. 25160 */ 25161 function addSaveProps(extraProps, blockType, attributes) { 25162 if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'anchor')) { 25163 extraProps.id = attributes.anchor === '' ? null : attributes.anchor; 25164 } 25165 return extraProps; 25166 } 25167 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/anchor/attribute', anchor_addAttribute); 25168 25169 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/aria-label.js 25170 /** 25171 * WordPress dependencies 25172 */ 25173 25174 25175 const ARIA_LABEL_SCHEMA = { 25176 type: 'string', 25177 source: 'attribute', 25178 attribute: 'aria-label', 25179 selector: '*' 25180 }; 25181 25182 /** 25183 * Filters registered block settings, extending attributes with ariaLabel using aria-label 25184 * of the first node. 25185 * 25186 * @param {Object} settings Original block settings. 25187 * 25188 * @return {Object} Filtered block settings. 25189 */ 25190 function aria_label_addAttribute(settings) { 25191 // Allow blocks to specify their own attribute definition with default values if needed. 25192 if (settings?.attributes?.ariaLabel?.type) { 25193 return settings; 25194 } 25195 if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, 'ariaLabel')) { 25196 // Gracefully handle if settings.attributes is undefined. 25197 settings.attributes = { 25198 ...settings.attributes, 25199 ariaLabel: ARIA_LABEL_SCHEMA 25200 }; 25201 } 25202 return settings; 25203 } 25204 25205 /** 25206 * Override props assigned to save component to inject aria-label, if block 25207 * supports ariaLabel. This is only applied if the block's save result is an 25208 * element and not a markup string. 25209 * 25210 * @param {Object} extraProps Additional props applied to save element. 25211 * @param {Object} blockType Block type. 25212 * @param {Object} attributes Current block attributes. 25213 * 25214 * @return {Object} Filtered props applied to save element. 25215 */ 25216 function aria_label_addSaveProps(extraProps, blockType, attributes) { 25217 if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'ariaLabel')) { 25218 extraProps['aria-label'] = attributes.ariaLabel === '' ? null : attributes.ariaLabel; 25219 } 25220 return extraProps; 25221 } 25222 /* harmony default export */ const aria_label = ({ 25223 addSaveProps: aria_label_addSaveProps, 25224 attributeKeys: ['ariaLabel'], 25225 hasSupport(name) { 25226 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, 'ariaLabel'); 25227 } 25228 }); 25229 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/ariaLabel/attribute', aria_label_addAttribute); 25230 25231 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/custom-class-name.js 25232 /** 25233 * External dependencies 25234 */ 25235 25236 25237 /** 25238 * WordPress dependencies 25239 */ 25240 25241 25242 25243 25244 25245 /** 25246 * Internal dependencies 25247 */ 25248 25249 25250 25251 /** 25252 * Filters registered block settings, extending attributes to include `className`. 25253 * 25254 * @param {Object} settings Original block settings. 25255 * 25256 * @return {Object} Filtered block settings. 25257 */ 25258 25259 function custom_class_name_addAttribute(settings) { 25260 if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, 'customClassName', true)) { 25261 // Gracefully handle if settings.attributes is undefined. 25262 settings.attributes = { 25263 ...settings.attributes, 25264 className: { 25265 type: 'string' 25266 } 25267 }; 25268 } 25269 return settings; 25270 } 25271 function CustomClassNameControlsPure({ 25272 className, 25273 setAttributes 25274 }) { 25275 const blockEditingMode = useBlockEditingMode(); 25276 if (blockEditingMode !== 'default') { 25277 return null; 25278 } 25279 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 25280 group: "advanced", 25281 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextControl, { 25282 __nextHasNoMarginBottom: true, 25283 __next40pxDefaultSize: true, 25284 autoComplete: "off", 25285 label: (0,external_wp_i18n_namespaceObject.__)('Additional CSS class(es)'), 25286 value: className || '', 25287 onChange: nextValue => { 25288 setAttributes({ 25289 className: nextValue !== '' ? nextValue : undefined 25290 }); 25291 }, 25292 help: (0,external_wp_i18n_namespaceObject.__)('Separate multiple classes with spaces.') 25293 }) 25294 }); 25295 } 25296 /* harmony default export */ const custom_class_name = ({ 25297 edit: CustomClassNameControlsPure, 25298 addSaveProps: custom_class_name_addSaveProps, 25299 attributeKeys: ['className'], 25300 hasSupport(name) { 25301 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, 'customClassName', true); 25302 } 25303 }); 25304 25305 /** 25306 * Override props assigned to save component to inject the className, if block 25307 * supports customClassName. This is only applied if the block's save result is an 25308 * element and not a markup string. 25309 * 25310 * @param {Object} extraProps Additional props applied to save element. 25311 * @param {Object} blockType Block type. 25312 * @param {Object} attributes Current block attributes. 25313 * 25314 * @return {Object} Filtered props applied to save element. 25315 */ 25316 function custom_class_name_addSaveProps(extraProps, blockType, attributes) { 25317 if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'customClassName', true) && attributes.className) { 25318 extraProps.className = dist_clsx(extraProps.className, attributes.className); 25319 } 25320 return extraProps; 25321 } 25322 function addTransforms(result, source, index, results) { 25323 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(result.name, 'customClassName', true)) { 25324 return result; 25325 } 25326 25327 // If the condition verifies we are probably in the presence of a wrapping transform 25328 // e.g: nesting paragraphs in a group or columns and in that case the class should not be kept. 25329 if (results.length === 1 && result.innerBlocks.length === source.length) { 25330 return result; 25331 } 25332 25333 // If we are transforming one block to multiple blocks or multiple blocks to one block, 25334 // we ignore the class during the transform. 25335 if (results.length === 1 && source.length > 1 || results.length > 1 && source.length === 1) { 25336 return result; 25337 } 25338 25339 // If we are in presence of transform between one or more block in the source 25340 // that have one or more blocks in the result 25341 // we apply the class on source N to the result N, 25342 // if source N does not exists we do nothing. 25343 if (source[index]) { 25344 const originClassName = source[index]?.attributes.className; 25345 if (originClassName) { 25346 return { 25347 ...result, 25348 attributes: { 25349 ...result.attributes, 25350 className: originClassName 25351 } 25352 }; 25353 } 25354 } 25355 return result; 25356 } 25357 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/editor/custom-class-name/attribute', custom_class_name_addAttribute); 25358 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.switchToBlockType.transformedBlock', 'core/color/addTransforms', addTransforms); 25359 25360 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/generated-class-name.js 25361 /** 25362 * WordPress dependencies 25363 */ 25364 25365 25366 25367 /** 25368 * Override props assigned to save component to inject generated className if 25369 * block supports it. This is only applied if the block's save result is an 25370 * element and not a markup string. 25371 * 25372 * @param {Object} extraProps Additional props applied to save element. 25373 * @param {Object} blockType Block type. 25374 * 25375 * @return {Object} Filtered props applied to save element. 25376 */ 25377 function addGeneratedClassName(extraProps, blockType) { 25378 // Adding the generated className. 25379 if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'className', true)) { 25380 if (typeof extraProps.className === 'string') { 25381 // We have some extra classes and want to add the default classname 25382 // We use uniq to prevent duplicate classnames. 25383 25384 extraProps.className = [...new Set([(0,external_wp_blocks_namespaceObject.getBlockDefaultClassName)(blockType.name), ...extraProps.className.split(' ')])].join(' ').trim(); 25385 } else { 25386 // There is no string in the className variable, 25387 // so we just dump the default name in there. 25388 extraProps.className = (0,external_wp_blocks_namespaceObject.getBlockDefaultClassName)(blockType.name); 25389 } 25390 } 25391 return extraProps; 25392 } 25393 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.getSaveContent.extraProps', 'core/generated-class-name/save-props', addGeneratedClassName); 25394 25395 ;// CONCATENATED MODULE: ./node_modules/colord/index.mjs 25396 var colord_r={grad:.9,turn:360,rad:360/(2*Math.PI)},t=function(r){return"string"==typeof r?r.length>0:"number"==typeof r},n=function(r,t,n){return void 0===t&&(t=0),void 0===n&&(n=Math.pow(10,t)),Math.round(n*r)/n+0},e=function(r,t,n){return void 0===t&&(t=0),void 0===n&&(n=1),r>n?n:r>t?r:t},u=function(r){return(r=isFinite(r)?r%360:0)>0?r:r+360},a=function(r){return{r:e(r.r,0,255),g:e(r.g,0,255),b:e(r.b,0,255),a:e(r.a)}},o=function(r){return{r:n(r.r),g:n(r.g),b:n(r.b),a:n(r.a,3)}},i=/^#([0-9a-f]{3,8})$/i,s=function(r){var t=r.toString(16);return t.length<2?"0"+t:t},h=function(r){var t=r.r,n=r.g,e=r.b,u=r.a,a=Math.max(t,n,e),o=a-Math.min(t,n,e),i=o?a===t?(n-e)/o:a===n?2+(e-t)/o:4+(t-n)/o:0;return{h:60*(i<0?i+6:i),s:a?o/a*100:0,v:a/255*100,a:u}},b=function(r){var t=r.h,n=r.s,e=r.v,u=r.a;t=t/360*6,n/=100,e/=100;var a=Math.floor(t),o=e*(1-n),i=e*(1-(t-a)*n),s=e*(1-(1-t+a)*n),h=a%6;return{r:255*[e,i,o,o,s,e][h],g:255*[s,e,e,i,o,o][h],b:255*[o,o,s,e,e,i][h],a:u}},g=function(r){return{h:u(r.h),s:e(r.s,0,100),l:e(r.l,0,100),a:e(r.a)}},d=function(r){return{h:n(r.h),s:n(r.s),l:n(r.l),a:n(r.a,3)}},f=function(r){return b((n=(t=r).s,{h:t.h,s:(n*=((e=t.l)<50?e:100-e)/100)>0?2*n/(e+n)*100:0,v:e+n,a:t.a}));var t,n,e},c=function(r){return{h:(t=h(r)).h,s:(u=(200-(n=t.s))*(e=t.v)/100)>0&&u<200?n*e/100/(u<=100?u:200-u)*100:0,l:u/2,a:t.a};var t,n,e,u},l=/^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s*,\s*([+-]?\d*\.?\d+)%\s*,\s*([+-]?\d*\.?\d+)%\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i,p=/^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s+([+-]?\d*\.?\d+)%\s+([+-]?\d*\.?\d+)%\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i,v=/^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i,m=/^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i,y={string:[[function(r){var t=i.exec(r);return t?(r=t[1]).length<=4?{r:parseInt(r[0]+r[0],16),g:parseInt(r[1]+r[1],16),b:parseInt(r[2]+r[2],16),a:4===r.length?n(parseInt(r[3]+r[3],16)/255,2):1}:6===r.length||8===r.length?{r:parseInt(r.substr(0,2),16),g:parseInt(r.substr(2,2),16),b:parseInt(r.substr(4,2),16),a:8===r.length?n(parseInt(r.substr(6,2),16)/255,2):1}:null:null},"hex"],[function(r){var t=v.exec(r)||m.exec(r);return t?t[2]!==t[4]||t[4]!==t[6]?null:a({r:Number(t[1])/(t[2]?100/255:1),g:Number(t[3])/(t[4]?100/255:1),b:Number(t[5])/(t[6]?100/255:1),a:void 0===t[7]?1:Number(t[7])/(t[8]?100:1)}):null},"rgb"],[function(t){var n=l.exec(t)||p.exec(t);if(!n)return null;var e,u,a=g({h:(e=n[1],u=n[2],void 0===u&&(u="deg"),Number(e)*(colord_r[u]||1)),s:Number(n[3]),l:Number(n[4]),a:void 0===n[5]?1:Number(n[5])/(n[6]?100:1)});return f(a)},"hsl"]],object:[[function(r){var n=r.r,e=r.g,u=r.b,o=r.a,i=void 0===o?1:o;return t(n)&&t(e)&&t(u)?a({r:Number(n),g:Number(e),b:Number(u),a:Number(i)}):null},"rgb"],[function(r){var n=r.h,e=r.s,u=r.l,a=r.a,o=void 0===a?1:a;if(!t(n)||!t(e)||!t(u))return null;var i=g({h:Number(n),s:Number(e),l:Number(u),a:Number(o)});return f(i)},"hsl"],[function(r){var n=r.h,a=r.s,o=r.v,i=r.a,s=void 0===i?1:i;if(!t(n)||!t(a)||!t(o))return null;var h=function(r){return{h:u(r.h),s:e(r.s,0,100),v:e(r.v,0,100),a:e(r.a)}}({h:Number(n),s:Number(a),v:Number(o),a:Number(s)});return b(h)},"hsv"]]},N=function(r,t){for(var n=0;n<t.length;n++){var e=t[n][0](r);if(e)return[e,t[n][1]]}return[null,void 0]},x=function(r){return"string"==typeof r?N(r.trim(),y.string):"object"==typeof r&&null!==r?N(r,y.object):[null,void 0]},I=function(r){return x(r)[1]},M=function(r,t){var n=c(r);return{h:n.h,s:e(n.s+100*t,0,100),l:n.l,a:n.a}},H=function(r){return(299*r.r+587*r.g+114*r.b)/1e3/255},$=function(r,t){var n=c(r);return{h:n.h,s:n.s,l:e(n.l+100*t,0,100),a:n.a}},colord_j=function(){function r(r){this.parsed=x(r)[0],this.rgba=this.parsed||{r:0,g:0,b:0,a:1}}return r.prototype.isValid=function(){return null!==this.parsed},r.prototype.brightness=function(){return n(H(this.rgba),2)},r.prototype.isDark=function(){return H(this.rgba)<.5},r.prototype.isLight=function(){return H(this.rgba)>=.5},r.prototype.toHex=function(){return r=o(this.rgba),t=r.r,e=r.g,u=r.b,i=(a=r.a)<1?s(n(255*a)):"","#"+s(t)+s(e)+s(u)+i;var r,t,e,u,a,i},r.prototype.toRgb=function(){return o(this.rgba)},r.prototype.toRgbString=function(){return r=o(this.rgba),t=r.r,n=r.g,e=r.b,(u=r.a)<1?"rgba("+t+", "+n+", "+e+", "+u+")":"rgb("+t+", "+n+", "+e+")";var r,t,n,e,u},r.prototype.toHsl=function(){return d(c(this.rgba))},r.prototype.toHslString=function(){return r=d(c(this.rgba)),t=r.h,n=r.s,e=r.l,(u=r.a)<1?"hsla("+t+", "+n+"%, "+e+"%, "+u+")":"hsl("+t+", "+n+"%, "+e+"%)";var r,t,n,e,u},r.prototype.toHsv=function(){return r=h(this.rgba),{h:n(r.h),s:n(r.s),v:n(r.v),a:n(r.a,3)};var r},r.prototype.invert=function(){return w({r:255-(r=this.rgba).r,g:255-r.g,b:255-r.b,a:r.a});var r},r.prototype.saturate=function(r){return void 0===r&&(r=.1),w(M(this.rgba,r))},r.prototype.desaturate=function(r){return void 0===r&&(r=.1),w(M(this.rgba,-r))},r.prototype.grayscale=function(){return w(M(this.rgba,-1))},r.prototype.lighten=function(r){return void 0===r&&(r=.1),w($(this.rgba,r))},r.prototype.darken=function(r){return void 0===r&&(r=.1),w($(this.rgba,-r))},r.prototype.rotate=function(r){return void 0===r&&(r=15),this.hue(this.hue()+r)},r.prototype.alpha=function(r){return"number"==typeof r?w({r:(t=this.rgba).r,g:t.g,b:t.b,a:r}):n(this.rgba.a,3);var t},r.prototype.hue=function(r){var t=c(this.rgba);return"number"==typeof r?w({h:r,s:t.s,l:t.l,a:t.a}):n(t.h)},r.prototype.isEqual=function(r){return this.toHex()===w(r).toHex()},r}(),w=function(r){return r instanceof colord_j?r:new colord_j(r)},S=[],k=function(r){r.forEach(function(r){S.indexOf(r)<0&&(r(colord_j,y),S.push(r))})},E=function(){return new colord_j({r:255*Math.random(),g:255*Math.random(),b:255*Math.random()})}; 25397 25398 ;// CONCATENATED MODULE: ./node_modules/colord/plugins/names.mjs 25399 /* harmony default export */ function names(e,f){var a={white:"#ffffff",bisque:"#ffe4c4",blue:"#0000ff",cadetblue:"#5f9ea0",chartreuse:"#7fff00",chocolate:"#d2691e",coral:"#ff7f50",antiquewhite:"#faebd7",aqua:"#00ffff",azure:"#f0ffff",whitesmoke:"#f5f5f5",papayawhip:"#ffefd5",plum:"#dda0dd",blanchedalmond:"#ffebcd",black:"#000000",gold:"#ffd700",goldenrod:"#daa520",gainsboro:"#dcdcdc",cornsilk:"#fff8dc",cornflowerblue:"#6495ed",burlywood:"#deb887",aquamarine:"#7fffd4",beige:"#f5f5dc",crimson:"#dc143c",cyan:"#00ffff",darkblue:"#00008b",darkcyan:"#008b8b",darkgoldenrod:"#b8860b",darkkhaki:"#bdb76b",darkgray:"#a9a9a9",darkgreen:"#006400",darkgrey:"#a9a9a9",peachpuff:"#ffdab9",darkmagenta:"#8b008b",darkred:"#8b0000",darkorchid:"#9932cc",darkorange:"#ff8c00",darkslateblue:"#483d8b",gray:"#808080",darkslategray:"#2f4f4f",darkslategrey:"#2f4f4f",deeppink:"#ff1493",deepskyblue:"#00bfff",wheat:"#f5deb3",firebrick:"#b22222",floralwhite:"#fffaf0",ghostwhite:"#f8f8ff",darkviolet:"#9400d3",magenta:"#ff00ff",green:"#008000",dodgerblue:"#1e90ff",grey:"#808080",honeydew:"#f0fff0",hotpink:"#ff69b4",blueviolet:"#8a2be2",forestgreen:"#228b22",lawngreen:"#7cfc00",indianred:"#cd5c5c",indigo:"#4b0082",fuchsia:"#ff00ff",brown:"#a52a2a",maroon:"#800000",mediumblue:"#0000cd",lightcoral:"#f08080",darkturquoise:"#00ced1",lightcyan:"#e0ffff",ivory:"#fffff0",lightyellow:"#ffffe0",lightsalmon:"#ffa07a",lightseagreen:"#20b2aa",linen:"#faf0e6",mediumaquamarine:"#66cdaa",lemonchiffon:"#fffacd",lime:"#00ff00",khaki:"#f0e68c",mediumseagreen:"#3cb371",limegreen:"#32cd32",mediumspringgreen:"#00fa9a",lightskyblue:"#87cefa",lightblue:"#add8e6",midnightblue:"#191970",lightpink:"#ffb6c1",mistyrose:"#ffe4e1",moccasin:"#ffe4b5",mintcream:"#f5fffa",lightslategray:"#778899",lightslategrey:"#778899",navajowhite:"#ffdead",navy:"#000080",mediumvioletred:"#c71585",powderblue:"#b0e0e6",palegoldenrod:"#eee8aa",oldlace:"#fdf5e6",paleturquoise:"#afeeee",mediumturquoise:"#48d1cc",mediumorchid:"#ba55d3",rebeccapurple:"#663399",lightsteelblue:"#b0c4de",mediumslateblue:"#7b68ee",thistle:"#d8bfd8",tan:"#d2b48c",orchid:"#da70d6",mediumpurple:"#9370db",purple:"#800080",pink:"#ffc0cb",skyblue:"#87ceeb",springgreen:"#00ff7f",palegreen:"#98fb98",red:"#ff0000",yellow:"#ffff00",slateblue:"#6a5acd",lavenderblush:"#fff0f5",peru:"#cd853f",palevioletred:"#db7093",violet:"#ee82ee",teal:"#008080",slategray:"#708090",slategrey:"#708090",aliceblue:"#f0f8ff",darkseagreen:"#8fbc8f",darkolivegreen:"#556b2f",greenyellow:"#adff2f",seagreen:"#2e8b57",seashell:"#fff5ee",tomato:"#ff6347",silver:"#c0c0c0",sienna:"#a0522d",lavender:"#e6e6fa",lightgreen:"#90ee90",orange:"#ffa500",orangered:"#ff4500",steelblue:"#4682b4",royalblue:"#4169e1",turquoise:"#40e0d0",yellowgreen:"#9acd32",salmon:"#fa8072",saddlebrown:"#8b4513",sandybrown:"#f4a460",rosybrown:"#bc8f8f",darksalmon:"#e9967a",lightgoldenrodyellow:"#fafad2",snow:"#fffafa",lightgrey:"#d3d3d3",lightgray:"#d3d3d3",dimgray:"#696969",dimgrey:"#696969",olivedrab:"#6b8e23",olive:"#808000"},r={};for(var d in a)r[a[d]]=d;var l={};e.prototype.toName=function(f){if(!(this.rgba.a||this.rgba.r||this.rgba.g||this.rgba.b))return"transparent";var d,i,n=r[this.toHex()];if(n)return n;if(null==f?void 0:f.closest){var o=this.toRgb(),t=1/0,b="black";if(!l.length)for(var c in a)l[c]=new e(a[c]).toRgb();for(var g in a){var u=(d=o,i=l[g],Math.pow(d.r-i.r,2)+Math.pow(d.g-i.g,2)+Math.pow(d.b-i.b,2));u<t&&(t=u,b=g)}return b}};f.string.push([function(f){var r=f.toLowerCase(),d="transparent"===r?"#0000":a[r];return d?new e(d).toRgb():null},"name"])} 25400 25401 ;// CONCATENATED MODULE: ./node_modules/colord/plugins/a11y.mjs 25402 var a11y_o=function(o){var t=o/255;return t<.04045?t/12.92:Math.pow((t+.055)/1.055,2.4)},a11y_t=function(t){return.2126*a11y_o(t.r)+.7152*a11y_o(t.g)+.0722*a11y_o(t.b)};/* harmony default export */ function a11y(o){o.prototype.luminance=function(){return o=a11y_t(this.rgba),void 0===(r=2)&&(r=0),void 0===n&&(n=Math.pow(10,r)),Math.round(n*o)/n+0;var o,r,n},o.prototype.contrast=function(r){void 0===r&&(r="#FFF");var n,a,i,e,v,u,d,c=r instanceof o?r:new o(r);return e=this.rgba,v=c.toRgb(),u=a11y_t(e),d=a11y_t(v),n=u>d?(u+.05)/(d+.05):(d+.05)/(u+.05),void 0===(a=2)&&(a=0),void 0===i&&(i=Math.pow(10,a)),Math.floor(i*n)/i+0},o.prototype.isReadable=function(o,t){return void 0===o&&(o="#FFF"),void 0===t&&(t={}),this.contrast(o)>=(e=void 0===(i=(r=t).size)?"normal":i,"AAA"===(a=void 0===(n=r.level)?"AA":n)&&"normal"===e?7:"AA"===a&&"large"===e?3:4.5);var r,n,a,i,e}} 25403 25404 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/colors/utils.js 25405 /** 25406 * External dependencies 25407 */ 25408 25409 25410 25411 25412 /** 25413 * WordPress dependencies 25414 */ 25415 25416 25417 /** 25418 * Internal dependencies 25419 */ 25420 25421 k([names, a11y]); 25422 const { 25423 kebabCase 25424 } = unlock(external_wp_components_namespaceObject.privateApis); 25425 25426 /** 25427 * Provided an array of color objects as set by the theme or by the editor defaults, 25428 * and the values of the defined color or custom color returns a color object describing the color. 25429 * 25430 * @param {Array} colors Array of color objects as set by the theme or by the editor defaults. 25431 * @param {?string} definedColor A string containing the color slug. 25432 * @param {?string} customColor A string containing the customColor value. 25433 * 25434 * @return {?Object} If definedColor is passed and the name is found in colors, 25435 * the color object exactly as set by the theme or editor defaults is returned. 25436 * Otherwise, an object that just sets the color is defined. 25437 */ 25438 const getColorObjectByAttributeValues = (colors, definedColor, customColor) => { 25439 if (definedColor) { 25440 const colorObj = colors?.find(color => color.slug === definedColor); 25441 if (colorObj) { 25442 return colorObj; 25443 } 25444 } 25445 return { 25446 color: customColor 25447 }; 25448 }; 25449 25450 /** 25451 * Provided an array of color objects as set by the theme or by the editor defaults, and a color value returns the color object matching that value or undefined. 25452 * 25453 * @param {Array} colors Array of color objects as set by the theme or by the editor defaults. 25454 * @param {?string} colorValue A string containing the color value. 25455 * 25456 * @return {?Object} Color object included in the colors array whose color property equals colorValue. 25457 * Returns undefined if no color object matches this requirement. 25458 */ 25459 const getColorObjectByColorValue = (colors, colorValue) => { 25460 return colors?.find(color => color.color === colorValue); 25461 }; 25462 25463 /** 25464 * Returns a class based on the context a color is being used and its slug. 25465 * 25466 * @param {string} colorContextName Context/place where color is being used e.g: background, text etc... 25467 * @param {string} colorSlug Slug of the color. 25468 * 25469 * @return {?string} String with the class corresponding to the color in the provided context. 25470 * Returns undefined if either colorContextName or colorSlug are not provided. 25471 */ 25472 function getColorClassName(colorContextName, colorSlug) { 25473 if (!colorContextName || !colorSlug) { 25474 return undefined; 25475 } 25476 return `has-$kebabCase(colorSlug)}-$colorContextName}`; 25477 } 25478 25479 /** 25480 * Given an array of color objects and a color value returns the color value of the most readable color in the array. 25481 * 25482 * @param {Array} colors Array of color objects as set by the theme or by the editor defaults. 25483 * @param {?string} colorValue A string containing the color value. 25484 * 25485 * @return {string} String with the color value of the most readable color. 25486 */ 25487 function getMostReadableColor(colors, colorValue) { 25488 const colordColor = w(colorValue); 25489 const getColorContrast = ({ 25490 color 25491 }) => colordColor.contrast(color); 25492 const maxContrast = Math.max(...colors.map(getColorContrast)); 25493 return colors.find(color => getColorContrast(color) === maxContrast).color; 25494 } 25495 25496 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/colors-gradients/use-multiple-origin-colors-and-gradients.js 25497 /** 25498 * WordPress dependencies 25499 */ 25500 25501 25502 25503 /** 25504 * Internal dependencies 25505 */ 25506 25507 25508 /** 25509 * Retrieves color and gradient related settings. 25510 * 25511 * The arrays for colors and gradients are made up of color palettes from each 25512 * origin i.e. "Core", "Theme", and "User". 25513 * 25514 * @return {Object} Color and gradient related settings. 25515 */ 25516 function useMultipleOriginColorsAndGradients() { 25517 const [enableCustomColors, customColors, themeColors, defaultColors, shouldDisplayDefaultColors, enableCustomGradients, customGradients, themeGradients, defaultGradients, shouldDisplayDefaultGradients] = use_settings_useSettings('color.custom', 'color.palette.custom', 'color.palette.theme', 'color.palette.default', 'color.defaultPalette', 'color.customGradient', 'color.gradients.custom', 'color.gradients.theme', 'color.gradients.default', 'color.defaultGradients'); 25518 const colorGradientSettings = { 25519 disableCustomColors: !enableCustomColors, 25520 disableCustomGradients: !enableCustomGradients 25521 }; 25522 colorGradientSettings.colors = (0,external_wp_element_namespaceObject.useMemo)(() => { 25523 const result = []; 25524 if (themeColors && themeColors.length) { 25525 result.push({ 25526 name: (0,external_wp_i18n_namespaceObject._x)('Theme', 'Indicates this palette comes from the theme.'), 25527 colors: themeColors 25528 }); 25529 } 25530 if (shouldDisplayDefaultColors && defaultColors && defaultColors.length) { 25531 result.push({ 25532 name: (0,external_wp_i18n_namespaceObject._x)('Default', 'Indicates this palette comes from WordPress.'), 25533 colors: defaultColors 25534 }); 25535 } 25536 if (customColors && customColors.length) { 25537 result.push({ 25538 name: (0,external_wp_i18n_namespaceObject._x)('Custom', 'Indicates this palette comes from the theme.'), 25539 colors: customColors 25540 }); 25541 } 25542 return result; 25543 }, [customColors, themeColors, defaultColors, shouldDisplayDefaultColors]); 25544 colorGradientSettings.gradients = (0,external_wp_element_namespaceObject.useMemo)(() => { 25545 const result = []; 25546 if (themeGradients && themeGradients.length) { 25547 result.push({ 25548 name: (0,external_wp_i18n_namespaceObject._x)('Theme', 'Indicates this palette comes from the theme.'), 25549 gradients: themeGradients 25550 }); 25551 } 25552 if (shouldDisplayDefaultGradients && defaultGradients && defaultGradients.length) { 25553 result.push({ 25554 name: (0,external_wp_i18n_namespaceObject._x)('Default', 'Indicates this palette comes from WordPress.'), 25555 gradients: defaultGradients 25556 }); 25557 } 25558 if (customGradients && customGradients.length) { 25559 result.push({ 25560 name: (0,external_wp_i18n_namespaceObject._x)('Custom', 'Indicates this palette is created by the user.'), 25561 gradients: customGradients 25562 }); 25563 } 25564 return result; 25565 }, [customGradients, themeGradients, defaultGradients, shouldDisplayDefaultGradients]); 25566 colorGradientSettings.hasColorsOrGradients = !!colorGradientSettings.colors.length || !!colorGradientSettings.gradients.length; 25567 return colorGradientSettings; 25568 } 25569 25570 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/border-radius-control/utils.js 25571 /** 25572 * WordPress dependencies 25573 */ 25574 25575 25576 /** 25577 * Gets the (non-undefined) item with the highest occurrence within an array 25578 * Based in part on: https://stackoverflow.com/a/20762713 25579 * 25580 * Undefined values are always sorted to the end by `sort`, so this function 25581 * returns the first element, to always prioritize real values over undefined 25582 * values. 25583 * 25584 * See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#description 25585 * 25586 * @param {Array<any>} inputArray Array of items to check. 25587 * @return {any} The item with the most occurrences. 25588 */ 25589 function utils_mode(inputArray) { 25590 const arr = [...inputArray]; 25591 return arr.sort((a, b) => inputArray.filter(v => v === b).length - inputArray.filter(v => v === a).length).shift(); 25592 } 25593 25594 /** 25595 * Returns the most common CSS unit from the current CSS unit selections. 25596 * 25597 * - If a single flat border radius is set, its unit will be used 25598 * - If individual corner selections, the most common of those will be used 25599 * - Failing any unit selections a default of 'px' is returned. 25600 * 25601 * @param {Object} selectedUnits Unit selections for flat radius & each corner. 25602 * @return {string} Most common CSS unit from current selections. Default: `px`. 25603 */ 25604 function getAllUnit(selectedUnits = {}) { 25605 const { 25606 flat, 25607 ...cornerUnits 25608 } = selectedUnits; 25609 return flat || utils_mode(Object.values(cornerUnits).filter(Boolean)) || 'px'; 25610 } 25611 25612 /** 25613 * Gets the 'all' input value and unit from values data. 25614 * 25615 * @param {Object|string} values Radius values. 25616 * @return {string} A value + unit for the 'all' input. 25617 */ 25618 function getAllValue(values = {}) { 25619 /** 25620 * Border radius support was originally a single pixel value. 25621 * 25622 * To maintain backwards compatibility treat this case as the all value. 25623 */ 25624 if (typeof values === 'string') { 25625 return values; 25626 } 25627 const parsedQuantitiesAndUnits = Object.values(values).map(value => (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(value)); 25628 const allValues = parsedQuantitiesAndUnits.map(value => { 25629 var _value$; 25630 return (_value$ = value[0]) !== null && _value$ !== void 0 ? _value$ : ''; 25631 }); 25632 const allUnits = parsedQuantitiesAndUnits.map(value => value[1]); 25633 const value = allValues.every(v => v === allValues[0]) ? allValues[0] : ''; 25634 const unit = utils_mode(allUnits); 25635 const allValue = value === 0 || value ? `$value}$unit}` : undefined; 25636 return allValue; 25637 } 25638 25639 /** 25640 * Checks to determine if values are mixed. 25641 * 25642 * @param {Object} values Radius values. 25643 * @return {boolean} Whether values are mixed. 25644 */ 25645 function hasMixedValues(values = {}) { 25646 const allValue = getAllValue(values); 25647 const isMixed = typeof values === 'string' ? false : isNaN(parseFloat(allValue)); 25648 return isMixed; 25649 } 25650 25651 /** 25652 * Checks to determine if values are defined. 25653 * 25654 * @param {Object} values Radius values. 25655 * @return {boolean} Whether values are mixed. 25656 */ 25657 function hasDefinedValues(values) { 25658 if (!values) { 25659 return false; 25660 } 25661 25662 // A string value represents a shorthand value. 25663 if (typeof values === 'string') { 25664 return true; 25665 } 25666 25667 // An object represents longhand border radius values, if any are set 25668 // flag values as being defined. 25669 const filteredValues = Object.values(values).filter(value => { 25670 return !!value || value === 0; 25671 }); 25672 return !!filteredValues.length; 25673 } 25674 25675 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/border-radius-control/all-input-control.js 25676 /** 25677 * WordPress dependencies 25678 */ 25679 25680 25681 25682 /** 25683 * Internal dependencies 25684 */ 25685 25686 25687 function AllInputControl({ 25688 onChange, 25689 selectedUnits, 25690 setSelectedUnits, 25691 values, 25692 ...props 25693 }) { 25694 let allValue = getAllValue(values); 25695 if (allValue === undefined) { 25696 // If we don't have any value set the unit to any current selection 25697 // or the most common unit from the individual radii values. 25698 allValue = getAllUnit(selectedUnits); 25699 } 25700 const hasValues = hasDefinedValues(values); 25701 const isMixed = hasValues && hasMixedValues(values); 25702 const allPlaceholder = isMixed ? (0,external_wp_i18n_namespaceObject.__)('Mixed') : null; 25703 25704 // Filter out CSS-unit-only values to prevent invalid styles. 25705 const handleOnChange = next => { 25706 const isNumeric = !isNaN(parseFloat(next)); 25707 const nextValue = isNumeric ? next : undefined; 25708 onChange(nextValue); 25709 }; 25710 25711 // Store current unit selection for use as fallback for individual 25712 // radii controls. 25713 const handleOnUnitChange = unit => { 25714 setSelectedUnits({ 25715 topLeft: unit, 25716 topRight: unit, 25717 bottomLeft: unit, 25718 bottomRight: unit 25719 }); 25720 }; 25721 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 25722 ...props, 25723 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Border radius'), 25724 disableUnits: isMixed, 25725 isOnly: true, 25726 value: allValue, 25727 onChange: handleOnChange, 25728 onUnitChange: handleOnUnitChange, 25729 placeholder: allPlaceholder, 25730 size: "__unstable-large" 25731 }); 25732 } 25733 25734 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/border-radius-control/input-controls.js 25735 /** 25736 * WordPress dependencies 25737 */ 25738 25739 25740 25741 const CORNERS = { 25742 topLeft: (0,external_wp_i18n_namespaceObject.__)('Top left'), 25743 topRight: (0,external_wp_i18n_namespaceObject.__)('Top right'), 25744 bottomLeft: (0,external_wp_i18n_namespaceObject.__)('Bottom left'), 25745 bottomRight: (0,external_wp_i18n_namespaceObject.__)('Bottom right') 25746 }; 25747 function BoxInputControls({ 25748 onChange, 25749 selectedUnits, 25750 setSelectedUnits, 25751 values: valuesProp, 25752 ...props 25753 }) { 25754 const createHandleOnChange = corner => next => { 25755 if (!onChange) { 25756 return; 25757 } 25758 25759 // Filter out CSS-unit-only values to prevent invalid styles. 25760 const isNumeric = !isNaN(parseFloat(next)); 25761 const nextValue = isNumeric ? next : undefined; 25762 onChange({ 25763 ...values, 25764 [corner]: nextValue 25765 }); 25766 }; 25767 const createHandleOnUnitChange = side => next => { 25768 const newUnits = { 25769 ...selectedUnits 25770 }; 25771 newUnits[side] = next; 25772 setSelectedUnits(newUnits); 25773 }; 25774 25775 // For shorthand style & backwards compatibility, handle flat string value. 25776 const values = typeof valuesProp !== 'string' ? valuesProp : { 25777 topLeft: valuesProp, 25778 topRight: valuesProp, 25779 bottomLeft: valuesProp, 25780 bottomRight: valuesProp 25781 }; 25782 25783 // Controls are wrapped in tooltips as visible labels aren't desired here. 25784 // Tooltip rendering also requires the UnitControl to be wrapped. See: 25785 // https://github.com/WordPress/gutenberg/pull/24966#issuecomment-685875026 25786 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 25787 className: "components-border-radius-control__input-controls-wrapper", 25788 children: Object.entries(CORNERS).map(([corner, label]) => { 25789 const [parsedQuantity, parsedUnit] = (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(values[corner]); 25790 const computedUnit = values[corner] ? parsedUnit : selectedUnits[corner] || selectedUnits.flat; 25791 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tooltip, { 25792 text: label, 25793 placement: "top", 25794 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 25795 className: "components-border-radius-control__tooltip-wrapper", 25796 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 25797 ...props, 25798 "aria-label": label, 25799 value: [parsedQuantity, computedUnit].join(''), 25800 onChange: createHandleOnChange(corner), 25801 onUnitChange: createHandleOnUnitChange(corner), 25802 size: "__unstable-large" 25803 }) 25804 }) 25805 }, corner); 25806 }) 25807 }); 25808 } 25809 25810 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/link.js 25811 /** 25812 * WordPress dependencies 25813 */ 25814 25815 25816 const link_link = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 25817 xmlns: "http://www.w3.org/2000/svg", 25818 viewBox: "0 0 24 24", 25819 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 25820 d: "M10 17.389H8.444A5.194 5.194 0 1 1 8.444 7H10v1.5H8.444a3.694 3.694 0 0 0 0 7.389H10v1.5ZM14 7h1.556a5.194 5.194 0 0 1 0 10.39H14v-1.5h1.556a3.694 3.694 0 0 0 0-7.39H14V7Zm-4.5 6h5v-1.5h-5V13Z" 25821 }) 25822 }); 25823 /* harmony default export */ const library_link = (link_link); 25824 25825 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/border-radius-control/linked-button.js 25826 /** 25827 * WordPress dependencies 25828 */ 25829 25830 25831 25832 25833 function LinkedButton({ 25834 isLinked, 25835 ...props 25836 }) { 25837 const label = isLinked ? (0,external_wp_i18n_namespaceObject.__)('Unlink radii') : (0,external_wp_i18n_namespaceObject.__)('Link radii'); 25838 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tooltip, { 25839 text: label, 25840 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 25841 ...props, 25842 className: "component-border-radius-control__linked-button", 25843 size: "small", 25844 icon: isLinked ? library_link : link_off, 25845 iconSize: 24, 25846 "aria-label": label 25847 }) 25848 }); 25849 } 25850 25851 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/border-radius-control/index.js 25852 /** 25853 * WordPress dependencies 25854 */ 25855 25856 25857 25858 25859 /** 25860 * Internal dependencies 25861 */ 25862 25863 25864 25865 25866 25867 25868 25869 25870 const border_radius_control_DEFAULT_VALUES = { 25871 topLeft: undefined, 25872 topRight: undefined, 25873 bottomLeft: undefined, 25874 bottomRight: undefined 25875 }; 25876 const MIN_BORDER_RADIUS_VALUE = 0; 25877 const MAX_BORDER_RADIUS_VALUES = { 25878 px: 100, 25879 em: 20, 25880 rem: 20 25881 }; 25882 25883 /** 25884 * Control to display border radius options. 25885 * 25886 * @param {Object} props Component props. 25887 * @param {Function} props.onChange Callback to handle onChange. 25888 * @param {Object} props.values Border radius values. 25889 * 25890 * @return {Element} Custom border radius control. 25891 */ 25892 function BorderRadiusControl({ 25893 onChange, 25894 values 25895 }) { 25896 const [isLinked, setIsLinked] = (0,external_wp_element_namespaceObject.useState)(!hasDefinedValues(values) || !hasMixedValues(values)); 25897 25898 // Tracking selected units via internal state allows filtering of CSS unit 25899 // only values from being saved while maintaining preexisting unit selection 25900 // behaviour. Filtering CSS unit only values prevents invalid style values. 25901 const [selectedUnits, setSelectedUnits] = (0,external_wp_element_namespaceObject.useState)({ 25902 flat: typeof values === 'string' ? (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(values)[1] : undefined, 25903 topLeft: (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(values?.topLeft)[1], 25904 topRight: (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(values?.topRight)[1], 25905 bottomLeft: (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(values?.bottomLeft)[1], 25906 bottomRight: (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(values?.bottomRight)[1] 25907 }); 25908 const [availableUnits] = use_settings_useSettings('spacing.units'); 25909 const units = (0,external_wp_components_namespaceObject.__experimentalUseCustomUnits)({ 25910 availableUnits: availableUnits || ['px', 'em', 'rem'] 25911 }); 25912 const unit = getAllUnit(selectedUnits); 25913 const unitConfig = units && units.find(item => item.value === unit); 25914 const step = unitConfig?.step || 1; 25915 const [allValue] = (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(getAllValue(values)); 25916 const toggleLinked = () => setIsLinked(!isLinked); 25917 const handleSliderChange = next => { 25918 onChange(next !== undefined ? `$next}$unit}` : undefined); 25919 }; 25920 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 25921 className: "components-border-radius-control", 25922 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, { 25923 as: "legend", 25924 children: (0,external_wp_i18n_namespaceObject.__)('Radius') 25925 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 25926 className: "components-border-radius-control__wrapper", 25927 children: [isLinked ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 25928 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AllInputControl, { 25929 className: "components-border-radius-control__unit-control", 25930 values: values, 25931 min: MIN_BORDER_RADIUS_VALUE, 25932 onChange: onChange, 25933 selectedUnits: selectedUnits, 25934 setSelectedUnits: setSelectedUnits, 25935 units: units 25936 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.RangeControl, { 25937 __next40pxDefaultSize: true, 25938 label: (0,external_wp_i18n_namespaceObject.__)('Border radius'), 25939 hideLabelFromVision: true, 25940 className: "components-border-radius-control__range-control", 25941 value: allValue !== null && allValue !== void 0 ? allValue : '', 25942 min: MIN_BORDER_RADIUS_VALUE, 25943 max: MAX_BORDER_RADIUS_VALUES[unit], 25944 initialPosition: 0, 25945 withInputField: false, 25946 onChange: handleSliderChange, 25947 step: step, 25948 __nextHasNoMarginBottom: true 25949 })] 25950 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BoxInputControls, { 25951 min: MIN_BORDER_RADIUS_VALUE, 25952 onChange: onChange, 25953 selectedUnits: selectedUnits, 25954 setSelectedUnits: setSelectedUnits, 25955 values: values || border_radius_control_DEFAULT_VALUES, 25956 units: units 25957 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LinkedButton, { 25958 onClick: toggleLinked, 25959 isLinked: isLinked 25960 })] 25961 })] 25962 }); 25963 } 25964 25965 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/check.js 25966 /** 25967 * WordPress dependencies 25968 */ 25969 25970 25971 const check_check = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 25972 xmlns: "http://www.w3.org/2000/svg", 25973 viewBox: "0 0 24 24", 25974 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 25975 d: "M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z" 25976 }) 25977 }); 25978 /* harmony default export */ const library_check = (check_check); 25979 25980 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/shadow.js 25981 /** 25982 * WordPress dependencies 25983 */ 25984 25985 25986 const shadow = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 25987 viewBox: "0 0 24 24", 25988 xmlns: "http://www.w3.org/2000/svg", 25989 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 25990 d: "M12 8c-2.2 0-4 1.8-4 4s1.8 4 4 4 4-1.8 4-4-1.8-4-4-4zm0 6.5c-1.4 0-2.5-1.1-2.5-2.5s1.1-2.5 2.5-2.5 2.5 1.1 2.5 2.5-1.1 2.5-2.5 2.5zM12.8 3h-1.5v3h1.5V3zm-1.6 18h1.5v-3h-1.5v3zm6.8-9.8v1.5h3v-1.5h-3zm-12 0H3v1.5h3v-1.5zm9.7 5.6 2.1 2.1 1.1-1.1-2.1-2.1-1.1 1.1zM8.3 7.2 6.2 5.1 5.1 6.2l2.1 2.1 1.1-1.1zM5.1 17.8l1.1 1.1 2.1-2.1-1.1-1.1-2.1 2.1zM18.9 6.2l-1.1-1.1-2.1 2.1 1.1 1.1 2.1-2.1z" 25991 }) 25992 }); 25993 /* harmony default export */ const library_shadow = (shadow); 25994 25995 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/shadow-panel-components.js 25996 /** 25997 * WordPress dependencies 25998 */ 25999 26000 26001 26002 26003 26004 /** 26005 * External dependencies 26006 */ 26007 26008 26009 /** 26010 * Shared reference to an empty array for cases where it is important to avoid 26011 * returning a new array reference on every invocation. 26012 * 26013 * @type {Array} 26014 */ 26015 26016 26017 const shadow_panel_components_EMPTY_ARRAY = []; 26018 function ShadowPopoverContainer({ 26019 shadow, 26020 onShadowChange, 26021 settings 26022 }) { 26023 const shadows = useShadowPresets(settings); 26024 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 26025 className: "block-editor-global-styles__shadow-popover-container", 26026 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 26027 spacing: 4, 26028 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalHeading, { 26029 level: 5, 26030 children: (0,external_wp_i18n_namespaceObject.__)('Drop shadow') 26031 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ShadowPresets, { 26032 presets: shadows, 26033 activeShadow: shadow, 26034 onSelect: onShadowChange 26035 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 26036 className: "block-editor-global-styles__clear-shadow", 26037 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 26038 __next40pxDefaultSize: true, 26039 variant: "tertiary", 26040 onClick: () => onShadowChange(undefined), 26041 children: (0,external_wp_i18n_namespaceObject.__)('Clear') 26042 }) 26043 })] 26044 }) 26045 }); 26046 } 26047 function ShadowPresets({ 26048 presets, 26049 activeShadow, 26050 onSelect 26051 }) { 26052 return !presets ? null : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Composite, { 26053 role: "listbox", 26054 className: "block-editor-global-styles__shadow__list", 26055 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Drop shadows'), 26056 children: presets.map(({ 26057 name, 26058 slug, 26059 shadow 26060 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ShadowIndicator, { 26061 label: name, 26062 isActive: shadow === activeShadow, 26063 type: slug === 'unset' ? 'unset' : 'preset', 26064 onSelect: () => onSelect(shadow === activeShadow ? undefined : shadow), 26065 shadow: shadow 26066 }, slug)) 26067 }); 26068 } 26069 function ShadowIndicator({ 26070 type, 26071 label, 26072 isActive, 26073 onSelect, 26074 shadow 26075 }) { 26076 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tooltip, { 26077 text: label, 26078 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Composite.Item, { 26079 role: "option", 26080 "aria-label": label, 26081 "aria-selected": isActive, 26082 className: dist_clsx('block-editor-global-styles__shadow__item', { 26083 'is-active': isActive 26084 }), 26085 render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("button", { 26086 className: dist_clsx('block-editor-global-styles__shadow-indicator', { 26087 unset: type === 'unset' 26088 }), 26089 onClick: onSelect, 26090 style: { 26091 boxShadow: shadow 26092 }, 26093 "aria-label": label, 26094 children: isActive && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 26095 icon: library_check 26096 }) 26097 }) 26098 }) 26099 }); 26100 } 26101 function ShadowPopover({ 26102 shadow, 26103 onShadowChange, 26104 settings 26105 }) { 26106 const popoverProps = { 26107 placement: 'left-start', 26108 offset: 36, 26109 shift: true 26110 }; 26111 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 26112 popoverProps: popoverProps, 26113 className: "block-editor-global-styles__shadow-dropdown", 26114 renderToggle: renderShadowToggle(), 26115 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalDropdownContentWrapper, { 26116 paddingSize: "medium", 26117 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ShadowPopoverContainer, { 26118 shadow: shadow, 26119 onShadowChange: onShadowChange, 26120 settings: settings 26121 }) 26122 }) 26123 }); 26124 } 26125 function renderShadowToggle() { 26126 return ({ 26127 onToggle, 26128 isOpen 26129 }) => { 26130 const toggleProps = { 26131 onClick: onToggle, 26132 className: dist_clsx({ 26133 'is-open': isOpen 26134 }), 26135 'aria-expanded': isOpen 26136 }; 26137 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 26138 __next40pxDefaultSize: true, 26139 ...toggleProps, 26140 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 26141 justify: "flex-start", 26142 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 26143 className: "block-editor-global-styles__toggle-icon", 26144 icon: library_shadow, 26145 size: 24 26146 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 26147 children: (0,external_wp_i18n_namespaceObject.__)('Drop shadow') 26148 })] 26149 }) 26150 }); 26151 }; 26152 } 26153 function useShadowPresets(settings) { 26154 return (0,external_wp_element_namespaceObject.useMemo)(() => { 26155 var _settings$shadow$pres; 26156 if (!settings?.shadow) { 26157 return shadow_panel_components_EMPTY_ARRAY; 26158 } 26159 const defaultPresetsEnabled = settings?.shadow?.defaultPresets; 26160 const { 26161 default: defaultShadows, 26162 theme: themeShadows, 26163 custom: customShadows 26164 } = (_settings$shadow$pres = settings?.shadow?.presets) !== null && _settings$shadow$pres !== void 0 ? _settings$shadow$pres : {}; 26165 const unsetShadow = { 26166 name: (0,external_wp_i18n_namespaceObject.__)('Unset'), 26167 slug: 'unset', 26168 shadow: 'none' 26169 }; 26170 const shadowPresets = [...(defaultPresetsEnabled && defaultShadows || shadow_panel_components_EMPTY_ARRAY), ...(themeShadows || shadow_panel_components_EMPTY_ARRAY), ...(customShadows || shadow_panel_components_EMPTY_ARRAY)]; 26171 if (shadowPresets.length) { 26172 shadowPresets.unshift(unsetShadow); 26173 } 26174 return shadowPresets; 26175 }, [settings]); 26176 } 26177 26178 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/border-panel.js 26179 /** 26180 * WordPress dependencies 26181 */ 26182 26183 26184 26185 26186 /** 26187 * Internal dependencies 26188 */ 26189 26190 26191 26192 26193 26194 26195 26196 26197 function useHasBorderPanel(settings) { 26198 const controls = Object.values(useHasBorderPanelControls(settings)); 26199 return controls.some(Boolean); 26200 } 26201 function useHasBorderPanelControls(settings) { 26202 const controls = { 26203 hasBorderColor: useHasBorderColorControl(settings), 26204 hasBorderRadius: useHasBorderRadiusControl(settings), 26205 hasBorderStyle: useHasBorderStyleControl(settings), 26206 hasBorderWidth: useHasBorderWidthControl(settings), 26207 hasShadow: useHasShadowControl(settings) 26208 }; 26209 return controls; 26210 } 26211 function useHasBorderColorControl(settings) { 26212 return settings?.border?.color; 26213 } 26214 function useHasBorderRadiusControl(settings) { 26215 return settings?.border?.radius; 26216 } 26217 function useHasBorderStyleControl(settings) { 26218 return settings?.border?.style; 26219 } 26220 function useHasBorderWidthControl(settings) { 26221 return settings?.border?.width; 26222 } 26223 function useHasShadowControl(settings) { 26224 const shadows = useShadowPresets(settings); 26225 return !!settings?.shadow && shadows.length > 0; 26226 } 26227 function BorderToolsPanel({ 26228 resetAllFilter, 26229 onChange, 26230 value, 26231 panelId, 26232 children, 26233 label 26234 }) { 26235 const dropdownMenuProps = useToolsPanelDropdownMenuProps(); 26236 const resetAll = () => { 26237 const updatedValue = resetAllFilter(value); 26238 onChange(updatedValue); 26239 }; 26240 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 26241 label: label, 26242 resetAll: resetAll, 26243 panelId: panelId, 26244 dropdownMenuProps: dropdownMenuProps, 26245 children: children 26246 }); 26247 } 26248 const border_panel_DEFAULT_CONTROLS = { 26249 radius: true, 26250 color: true, 26251 width: true, 26252 shadow: true 26253 }; 26254 function BorderPanel({ 26255 as: Wrapper = BorderToolsPanel, 26256 value, 26257 onChange, 26258 inheritedValue = value, 26259 settings, 26260 panelId, 26261 name, 26262 defaultControls = border_panel_DEFAULT_CONTROLS 26263 }) { 26264 var _settings$shadow$pres, _ref, _ref2, _shadowPresets$custom; 26265 const colors = useColorsPerOrigin(settings); 26266 const decodeValue = (0,external_wp_element_namespaceObject.useCallback)(rawValue => getValueFromVariable({ 26267 settings 26268 }, '', rawValue), [settings]); 26269 const encodeColorValue = colorValue => { 26270 const allColors = colors.flatMap(({ 26271 colors: originColors 26272 }) => originColors); 26273 const colorObject = allColors.find(({ 26274 color 26275 }) => color === colorValue); 26276 return colorObject ? 'var:preset|color|' + colorObject.slug : colorValue; 26277 }; 26278 const border = (0,external_wp_element_namespaceObject.useMemo)(() => { 26279 if ((0,external_wp_components_namespaceObject.__experimentalHasSplitBorders)(inheritedValue?.border)) { 26280 const borderValue = { 26281 ...inheritedValue?.border 26282 }; 26283 ['top', 'right', 'bottom', 'left'].forEach(side => { 26284 borderValue[side] = { 26285 ...borderValue[side], 26286 color: decodeValue(borderValue[side]?.color) 26287 }; 26288 }); 26289 return borderValue; 26290 } 26291 return { 26292 ...inheritedValue?.border, 26293 color: inheritedValue?.border?.color ? decodeValue(inheritedValue?.border?.color) : undefined 26294 }; 26295 }, [inheritedValue?.border, decodeValue]); 26296 const setBorder = newBorder => onChange({ 26297 ...value, 26298 border: newBorder 26299 }); 26300 const showBorderColor = useHasBorderColorControl(settings); 26301 const showBorderStyle = useHasBorderStyleControl(settings); 26302 const showBorderWidth = useHasBorderWidthControl(settings); 26303 26304 // Border radius. 26305 const showBorderRadius = useHasBorderRadiusControl(settings); 26306 const borderRadiusValues = decodeValue(border?.radius); 26307 const setBorderRadius = newBorderRadius => setBorder({ 26308 ...border, 26309 radius: newBorderRadius 26310 }); 26311 const hasBorderRadius = () => { 26312 const borderValues = value?.border?.radius; 26313 if (typeof borderValues === 'object') { 26314 return Object.entries(borderValues).some(Boolean); 26315 } 26316 return !!borderValues; 26317 }; 26318 const hasShadowControl = useHasShadowControl(settings); 26319 26320 // Shadow 26321 const shadow = decodeValue(inheritedValue?.shadow); 26322 const shadowPresets = (_settings$shadow$pres = settings?.shadow?.presets) !== null && _settings$shadow$pres !== void 0 ? _settings$shadow$pres : {}; 26323 const mergedShadowPresets = (_ref = (_ref2 = (_shadowPresets$custom = shadowPresets.custom) !== null && _shadowPresets$custom !== void 0 ? _shadowPresets$custom : shadowPresets.theme) !== null && _ref2 !== void 0 ? _ref2 : shadowPresets.default) !== null && _ref !== void 0 ? _ref : []; 26324 const setShadow = newValue => { 26325 const slug = mergedShadowPresets?.find(({ 26326 shadow: shadowName 26327 }) => shadowName === newValue)?.slug; 26328 onChange(setImmutably(value, ['shadow'], slug ? `var:preset|shadow|$slug}` : newValue || undefined)); 26329 }; 26330 const hasShadow = () => !!value?.shadow; 26331 const resetShadow = () => setShadow(undefined); 26332 const resetBorder = () => { 26333 if (hasBorderRadius()) { 26334 return setBorder({ 26335 radius: value?.border?.radius 26336 }); 26337 } 26338 setBorder(undefined); 26339 }; 26340 const onBorderChange = newBorder => { 26341 // Ensure we have a visible border style when a border width or 26342 // color is being selected. 26343 const updatedBorder = { 26344 ...newBorder 26345 }; 26346 if ((0,external_wp_components_namespaceObject.__experimentalHasSplitBorders)(updatedBorder)) { 26347 ['top', 'right', 'bottom', 'left'].forEach(side => { 26348 if (updatedBorder[side]) { 26349 updatedBorder[side] = { 26350 ...updatedBorder[side], 26351 color: encodeColorValue(updatedBorder[side]?.color) 26352 }; 26353 } 26354 }); 26355 } else if (updatedBorder) { 26356 updatedBorder.color = encodeColorValue(updatedBorder.color); 26357 } 26358 26359 // As radius is maintained separately to color, style, and width 26360 // maintain its value. Undefined values here will be cleaned when 26361 // global styles are saved. 26362 setBorder({ 26363 radius: border?.radius, 26364 ...updatedBorder 26365 }); 26366 }; 26367 const resetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(previousValue => { 26368 return { 26369 ...previousValue, 26370 border: undefined, 26371 shadow: undefined 26372 }; 26373 }, []); 26374 const showBorderByDefault = defaultControls?.color || defaultControls?.width; 26375 const hasBorderControl = showBorderColor || showBorderStyle || showBorderWidth || showBorderRadius; 26376 const label = useBorderPanelLabel({ 26377 blockName: name, 26378 hasShadowControl, 26379 hasBorderControl 26380 }); 26381 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Wrapper, { 26382 resetAllFilter: resetAllFilter, 26383 value: value, 26384 onChange: onChange, 26385 panelId: panelId, 26386 label: label, 26387 children: [(showBorderWidth || showBorderColor) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 26388 hasValue: () => (0,external_wp_components_namespaceObject.__experimentalIsDefinedBorder)(value?.border), 26389 label: (0,external_wp_i18n_namespaceObject.__)('Border'), 26390 onDeselect: () => resetBorder(), 26391 isShownByDefault: showBorderByDefault, 26392 panelId: panelId, 26393 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalBorderBoxControl, { 26394 colors: colors, 26395 enableAlpha: true, 26396 enableStyle: showBorderStyle, 26397 onChange: onBorderChange, 26398 popoverOffset: 40, 26399 popoverPlacement: "left-start", 26400 value: border, 26401 __experimentalIsRenderedInSidebar: true, 26402 size: "__unstable-large", 26403 hideLabelFromVision: !hasShadowControl, 26404 label: (0,external_wp_i18n_namespaceObject.__)('Border') 26405 }) 26406 }), showBorderRadius && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 26407 hasValue: hasBorderRadius, 26408 label: (0,external_wp_i18n_namespaceObject.__)('Radius'), 26409 onDeselect: () => setBorderRadius(undefined), 26410 isShownByDefault: defaultControls.radius, 26411 panelId: panelId, 26412 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BorderRadiusControl, { 26413 values: borderRadiusValues, 26414 onChange: newValue => { 26415 setBorderRadius(newValue || undefined); 26416 } 26417 }) 26418 }), hasShadowControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 26419 label: (0,external_wp_i18n_namespaceObject.__)('Shadow'), 26420 hasValue: hasShadow, 26421 onDeselect: resetShadow, 26422 isShownByDefault: defaultControls.shadow, 26423 panelId: panelId, 26424 children: [hasBorderControl ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, { 26425 as: "legend", 26426 children: (0,external_wp_i18n_namespaceObject.__)('Shadow') 26427 }) : null, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalItemGroup, { 26428 isBordered: true, 26429 isSeparated: true, 26430 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ShadowPopover, { 26431 shadow: shadow, 26432 onShadowChange: setShadow, 26433 settings: settings 26434 }) 26435 })] 26436 })] 26437 }); 26438 } 26439 26440 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/border.js 26441 /** 26442 * External dependencies 26443 */ 26444 26445 26446 /** 26447 * WordPress dependencies 26448 */ 26449 26450 26451 26452 26453 26454 26455 /** 26456 * Internal dependencies 26457 */ 26458 26459 26460 26461 26462 26463 26464 26465 26466 const BORDER_SUPPORT_KEY = '__experimentalBorder'; 26467 const SHADOW_SUPPORT_KEY = 'shadow'; 26468 const getColorByProperty = (colors, property, value) => { 26469 let matchedColor; 26470 colors.some(origin => origin.colors.some(color => { 26471 if (color[property] === value) { 26472 matchedColor = color; 26473 return true; 26474 } 26475 return false; 26476 })); 26477 return matchedColor; 26478 }; 26479 const getMultiOriginColor = ({ 26480 colors, 26481 namedColor, 26482 customColor 26483 }) => { 26484 // Search each origin (default, theme, or user) for matching color by name. 26485 if (namedColor) { 26486 const colorObject = getColorByProperty(colors, 'slug', namedColor); 26487 if (colorObject) { 26488 return colorObject; 26489 } 26490 } 26491 26492 // Skip if no custom color or matching named color. 26493 if (!customColor) { 26494 return { 26495 color: undefined 26496 }; 26497 } 26498 26499 // Attempt to find color via custom color value or build new object. 26500 const colorObject = getColorByProperty(colors, 'color', customColor); 26501 return colorObject ? colorObject : { 26502 color: customColor 26503 }; 26504 }; 26505 function getColorSlugFromVariable(value) { 26506 const namedColor = /var:preset\|color\|(.+)/.exec(value); 26507 if (namedColor && namedColor[1]) { 26508 return namedColor[1]; 26509 } 26510 return null; 26511 } 26512 function styleToAttributes(style) { 26513 if ((0,external_wp_components_namespaceObject.__experimentalHasSplitBorders)(style?.border)) { 26514 return { 26515 style, 26516 borderColor: undefined 26517 }; 26518 } 26519 const borderColorValue = style?.border?.color; 26520 const borderColorSlug = borderColorValue?.startsWith('var:preset|color|') ? borderColorValue.substring('var:preset|color|'.length) : undefined; 26521 const updatedStyle = { 26522 ...style 26523 }; 26524 updatedStyle.border = { 26525 ...updatedStyle.border, 26526 color: borderColorSlug ? undefined : borderColorValue 26527 }; 26528 return { 26529 style: utils_cleanEmptyObject(updatedStyle), 26530 borderColor: borderColorSlug 26531 }; 26532 } 26533 function attributesToStyle(attributes) { 26534 if ((0,external_wp_components_namespaceObject.__experimentalHasSplitBorders)(attributes.style?.border)) { 26535 return attributes.style; 26536 } 26537 return { 26538 ...attributes.style, 26539 border: { 26540 ...attributes.style?.border, 26541 color: attributes.borderColor ? 'var:preset|color|' + attributes.borderColor : attributes.style?.border?.color 26542 } 26543 }; 26544 } 26545 function BordersInspectorControl({ 26546 label, 26547 children, 26548 resetAllFilter 26549 }) { 26550 const attributesResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(attributes => { 26551 const existingStyle = attributesToStyle(attributes); 26552 const updatedStyle = resetAllFilter(existingStyle); 26553 return { 26554 ...attributes, 26555 ...styleToAttributes(updatedStyle) 26556 }; 26557 }, [resetAllFilter]); 26558 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 26559 group: "border", 26560 resetAllFilter: attributesResetAllFilter, 26561 label: label, 26562 children: children 26563 }); 26564 } 26565 function border_BorderPanel({ 26566 clientId, 26567 name, 26568 setAttributes, 26569 settings 26570 }) { 26571 const isEnabled = useHasBorderPanel(settings); 26572 function selector(select) { 26573 const { 26574 style, 26575 borderColor 26576 } = select(store).getBlockAttributes(clientId) || {}; 26577 return { 26578 style, 26579 borderColor 26580 }; 26581 } 26582 const { 26583 style, 26584 borderColor 26585 } = (0,external_wp_data_namespaceObject.useSelect)(selector, [clientId]); 26586 const value = (0,external_wp_element_namespaceObject.useMemo)(() => { 26587 return attributesToStyle({ 26588 style, 26589 borderColor 26590 }); 26591 }, [style, borderColor]); 26592 const onChange = newStyle => { 26593 setAttributes(styleToAttributes(newStyle)); 26594 }; 26595 if (!isEnabled) { 26596 return null; 26597 } 26598 const defaultControls = { 26599 ...(0,external_wp_blocks_namespaceObject.getBlockSupport)(name, [BORDER_SUPPORT_KEY, '__experimentalDefaultControls']), 26600 ...(0,external_wp_blocks_namespaceObject.getBlockSupport)(name, [SHADOW_SUPPORT_KEY, '__experimentalDefaultControls']) 26601 }; 26602 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BorderPanel, { 26603 as: BordersInspectorControl, 26604 panelId: clientId, 26605 settings: settings, 26606 value: value, 26607 onChange: onChange, 26608 defaultControls: defaultControls 26609 }); 26610 } 26611 26612 /** 26613 * Determine whether there is block support for border properties. 26614 * 26615 * @param {string} blockName Block name. 26616 * @param {string} feature Border feature to check support for. 26617 * 26618 * @return {boolean} Whether there is support. 26619 */ 26620 function hasBorderSupport(blockName, feature = 'any') { 26621 if (external_wp_element_namespaceObject.Platform.OS !== 'web') { 26622 return false; 26623 } 26624 const support = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockName, BORDER_SUPPORT_KEY); 26625 if (support === true) { 26626 return true; 26627 } 26628 if (feature === 'any') { 26629 return !!(support?.color || support?.radius || support?.width || support?.style); 26630 } 26631 return !!support?.[feature]; 26632 } 26633 26634 /** 26635 * Determine whether there is block support for shadow properties. 26636 * 26637 * @param {string} blockName Block name. 26638 * 26639 * @return {boolean} Whether there is support. 26640 */ 26641 function hasShadowSupport(blockName) { 26642 return hasBlockSupport(blockName, SHADOW_SUPPORT_KEY); 26643 } 26644 function useBorderPanelLabel({ 26645 blockName, 26646 hasBorderControl, 26647 hasShadowControl 26648 } = {}) { 26649 const settings = useBlockSettings(blockName); 26650 const controls = useHasBorderPanelControls(settings); 26651 if (!hasBorderControl && !hasShadowControl && blockName) { 26652 hasBorderControl = controls?.hasBorderColor || controls?.hasBorderStyle || controls?.hasBorderWidth || controls?.hasBorderRadius; 26653 hasShadowControl = controls?.hasShadow; 26654 } 26655 if (hasBorderControl && hasShadowControl) { 26656 return (0,external_wp_i18n_namespaceObject.__)('Border & Shadow'); 26657 } 26658 if (hasShadowControl) { 26659 return (0,external_wp_i18n_namespaceObject.__)('Shadow'); 26660 } 26661 return (0,external_wp_i18n_namespaceObject.__)('Border'); 26662 } 26663 26664 /** 26665 * Returns a new style object where the specified border attribute has been 26666 * removed. 26667 * 26668 * @param {Object} style Styles from block attributes. 26669 * @param {string} attribute The border style attribute to clear. 26670 * 26671 * @return {Object} Style object with the specified attribute removed. 26672 */ 26673 function removeBorderAttribute(style, attribute) { 26674 return cleanEmptyObject({ 26675 ...style, 26676 border: { 26677 ...style?.border, 26678 [attribute]: undefined 26679 } 26680 }); 26681 } 26682 26683 /** 26684 * Filters registered block settings, extending attributes to include 26685 * `borderColor` if needed. 26686 * 26687 * @param {Object} settings Original block settings. 26688 * 26689 * @return {Object} Updated block settings. 26690 */ 26691 function addAttributes(settings) { 26692 if (!hasBorderSupport(settings, 'color')) { 26693 return settings; 26694 } 26695 26696 // Allow blocks to specify default value if needed. 26697 if (settings.attributes.borderColor) { 26698 return settings; 26699 } 26700 26701 // Add new borderColor attribute to block settings. 26702 return { 26703 ...settings, 26704 attributes: { 26705 ...settings.attributes, 26706 borderColor: { 26707 type: 'string' 26708 } 26709 } 26710 }; 26711 } 26712 26713 /** 26714 * Override props assigned to save component to inject border color. 26715 * 26716 * @param {Object} props Additional props applied to save element. 26717 * @param {Object|string} blockNameOrType Block type definition. 26718 * @param {Object} attributes Block's attributes. 26719 * 26720 * @return {Object} Filtered props to apply to save element. 26721 */ 26722 function border_addSaveProps(props, blockNameOrType, attributes) { 26723 if (!hasBorderSupport(blockNameOrType, 'color') || shouldSkipSerialization(blockNameOrType, BORDER_SUPPORT_KEY, 'color')) { 26724 return props; 26725 } 26726 const borderClasses = getBorderClasses(attributes); 26727 const newClassName = dist_clsx(props.className, borderClasses); 26728 26729 // If we are clearing the last of the previous classes in `className` 26730 // set it to `undefined` to avoid rendering empty DOM attributes. 26731 props.className = newClassName ? newClassName : undefined; 26732 return props; 26733 } 26734 26735 /** 26736 * Generates a CSS class name consisting of all the applicable border color 26737 * classes given the current block attributes. 26738 * 26739 * @param {Object} attributes Block's attributes. 26740 * 26741 * @return {string} CSS class name. 26742 */ 26743 function getBorderClasses(attributes) { 26744 const { 26745 borderColor, 26746 style 26747 } = attributes; 26748 const borderColorClass = getColorClassName('border-color', borderColor); 26749 return dist_clsx({ 26750 'has-border-color': borderColor || style?.border?.color, 26751 [borderColorClass]: !!borderColorClass 26752 }); 26753 } 26754 function border_useBlockProps({ 26755 name, 26756 borderColor, 26757 style 26758 }) { 26759 const { 26760 colors 26761 } = useMultipleOriginColorsAndGradients(); 26762 if (!hasBorderSupport(name, 'color') || shouldSkipSerialization(name, BORDER_SUPPORT_KEY, 'color')) { 26763 return {}; 26764 } 26765 const { 26766 color: borderColorValue 26767 } = getMultiOriginColor({ 26768 colors, 26769 namedColor: borderColor 26770 }); 26771 const { 26772 color: borderTopColor 26773 } = getMultiOriginColor({ 26774 colors, 26775 namedColor: getColorSlugFromVariable(style?.border?.top?.color) 26776 }); 26777 const { 26778 color: borderRightColor 26779 } = getMultiOriginColor({ 26780 colors, 26781 namedColor: getColorSlugFromVariable(style?.border?.right?.color) 26782 }); 26783 const { 26784 color: borderBottomColor 26785 } = getMultiOriginColor({ 26786 colors, 26787 namedColor: getColorSlugFromVariable(style?.border?.bottom?.color) 26788 }); 26789 const { 26790 color: borderLeftColor 26791 } = getMultiOriginColor({ 26792 colors, 26793 namedColor: getColorSlugFromVariable(style?.border?.left?.color) 26794 }); 26795 const extraStyles = { 26796 borderTopColor: borderTopColor || borderColorValue, 26797 borderRightColor: borderRightColor || borderColorValue, 26798 borderBottomColor: borderBottomColor || borderColorValue, 26799 borderLeftColor: borderLeftColor || borderColorValue 26800 }; 26801 return border_addSaveProps({ 26802 style: utils_cleanEmptyObject(extraStyles) || {} 26803 }, name, { 26804 borderColor, 26805 style 26806 }); 26807 } 26808 /* harmony default export */ const border = ({ 26809 useBlockProps: border_useBlockProps, 26810 addSaveProps: border_addSaveProps, 26811 attributeKeys: ['borderColor', 'style'], 26812 hasSupport(name) { 26813 return hasBorderSupport(name, 'color'); 26814 } 26815 }); 26816 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/border/addAttributes', addAttributes); 26817 26818 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/gradients/use-gradient.js 26819 /** 26820 * WordPress dependencies 26821 */ 26822 26823 26824 26825 /** 26826 * Internal dependencies 26827 */ 26828 26829 26830 26831 function __experimentalGetGradientClass(gradientSlug) { 26832 if (!gradientSlug) { 26833 return undefined; 26834 } 26835 return `has-$gradientSlug}-gradient-background`; 26836 } 26837 26838 /** 26839 * Retrieves the gradient value per slug. 26840 * 26841 * @param {Array} gradients Gradient Palette 26842 * @param {string} slug Gradient slug 26843 * 26844 * @return {string} Gradient value. 26845 */ 26846 function getGradientValueBySlug(gradients, slug) { 26847 const gradient = gradients?.find(g => g.slug === slug); 26848 return gradient && gradient.gradient; 26849 } 26850 function __experimentalGetGradientObjectByGradientValue(gradients, value) { 26851 const gradient = gradients?.find(g => g.gradient === value); 26852 return gradient; 26853 } 26854 26855 /** 26856 * Retrieves the gradient slug per slug. 26857 * 26858 * @param {Array} gradients Gradient Palette 26859 * @param {string} value Gradient value 26860 * @return {string} Gradient slug. 26861 */ 26862 function getGradientSlugByValue(gradients, value) { 26863 const gradient = __experimentalGetGradientObjectByGradientValue(gradients, value); 26864 return gradient && gradient.slug; 26865 } 26866 function __experimentalUseGradient({ 26867 gradientAttribute = 'gradient', 26868 customGradientAttribute = 'customGradient' 26869 } = {}) { 26870 const { 26871 clientId 26872 } = useBlockEditContext(); 26873 const [userGradientPalette, themeGradientPalette, defaultGradientPalette] = use_settings_useSettings('color.gradients.custom', 'color.gradients.theme', 'color.gradients.default'); 26874 const allGradients = (0,external_wp_element_namespaceObject.useMemo)(() => [...(userGradientPalette || []), ...(themeGradientPalette || []), ...(defaultGradientPalette || [])], [userGradientPalette, themeGradientPalette, defaultGradientPalette]); 26875 const { 26876 gradient, 26877 customGradient 26878 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 26879 const { 26880 getBlockAttributes 26881 } = select(store); 26882 const attributes = getBlockAttributes(clientId) || {}; 26883 return { 26884 customGradient: attributes[customGradientAttribute], 26885 gradient: attributes[gradientAttribute] 26886 }; 26887 }, [clientId, gradientAttribute, customGradientAttribute]); 26888 const { 26889 updateBlockAttributes 26890 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 26891 const setGradient = (0,external_wp_element_namespaceObject.useCallback)(newGradientValue => { 26892 const slug = getGradientSlugByValue(allGradients, newGradientValue); 26893 if (slug) { 26894 updateBlockAttributes(clientId, { 26895 [gradientAttribute]: slug, 26896 [customGradientAttribute]: undefined 26897 }); 26898 return; 26899 } 26900 updateBlockAttributes(clientId, { 26901 [gradientAttribute]: undefined, 26902 [customGradientAttribute]: newGradientValue 26903 }); 26904 }, [allGradients, clientId, updateBlockAttributes]); 26905 const gradientClass = __experimentalGetGradientClass(gradient); 26906 let gradientValue; 26907 if (gradient) { 26908 gradientValue = getGradientValueBySlug(allGradients, gradient); 26909 } else { 26910 gradientValue = customGradient; 26911 } 26912 return { 26913 gradientClass, 26914 gradientValue, 26915 setGradient 26916 }; 26917 } 26918 26919 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/colors-gradients/control.js 26920 /** 26921 * External dependencies 26922 */ 26923 26924 26925 /** 26926 * WordPress dependencies 26927 */ 26928 26929 26930 26931 /** 26932 * Internal dependencies 26933 */ 26934 26935 26936 26937 26938 const { 26939 Tabs 26940 } = unlock(external_wp_components_namespaceObject.privateApis); 26941 const colorsAndGradientKeys = ['colors', 'disableCustomColors', 'gradients', 'disableCustomGradients']; 26942 const TAB_IDS = { 26943 color: 'color', 26944 gradient: 'gradient' 26945 }; 26946 function ColorGradientControlInner({ 26947 colors, 26948 gradients, 26949 disableCustomColors, 26950 disableCustomGradients, 26951 __experimentalIsRenderedInSidebar, 26952 className, 26953 label, 26954 onColorChange, 26955 onGradientChange, 26956 colorValue, 26957 gradientValue, 26958 clearable, 26959 showTitle = true, 26960 enableAlpha, 26961 headingLevel 26962 }) { 26963 const canChooseAColor = onColorChange && (colors && colors.length > 0 || !disableCustomColors); 26964 const canChooseAGradient = onGradientChange && (gradients && gradients.length > 0 || !disableCustomGradients); 26965 if (!canChooseAColor && !canChooseAGradient) { 26966 return null; 26967 } 26968 const tabPanels = { 26969 [TAB_IDS.color]: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ColorPalette, { 26970 value: colorValue, 26971 onChange: canChooseAGradient ? newColor => { 26972 onColorChange(newColor); 26973 onGradientChange(); 26974 } : onColorChange, 26975 colors, 26976 disableCustomColors, 26977 __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar, 26978 clearable: clearable, 26979 enableAlpha: enableAlpha, 26980 headingLevel: headingLevel 26981 }), 26982 [TAB_IDS.gradient]: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.GradientPicker, { 26983 value: gradientValue, 26984 onChange: canChooseAColor ? newGradient => { 26985 onGradientChange(newGradient); 26986 onColorChange(); 26987 } : onGradientChange, 26988 gradients, 26989 disableCustomGradients, 26990 __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar, 26991 clearable: clearable, 26992 headingLevel: headingLevel 26993 }) 26994 }; 26995 const renderPanelType = type => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 26996 className: "block-editor-color-gradient-control__panel", 26997 children: tabPanels[type] 26998 }); 26999 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl, { 27000 __nextHasNoMarginBottom: true, 27001 className: dist_clsx('block-editor-color-gradient-control', className), 27002 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("fieldset", { 27003 className: "block-editor-color-gradient-control__fieldset", 27004 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 27005 spacing: 1, 27006 children: [showTitle && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("legend", { 27007 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 27008 className: "block-editor-color-gradient-control__color-indicator", 27009 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, { 27010 children: label 27011 }) 27012 }) 27013 }), canChooseAColor && canChooseAGradient && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 27014 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Tabs, { 27015 defaultTabId: gradientValue ? TAB_IDS.gradient : !!canChooseAColor && TAB_IDS.color, 27016 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Tabs.TabList, { 27017 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tabs.Tab, { 27018 tabId: TAB_IDS.color, 27019 children: (0,external_wp_i18n_namespaceObject.__)('Color') 27020 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tabs.Tab, { 27021 tabId: TAB_IDS.gradient, 27022 children: (0,external_wp_i18n_namespaceObject.__)('Gradient') 27023 })] 27024 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tabs.TabPanel, { 27025 tabId: TAB_IDS.color, 27026 className: "block-editor-color-gradient-control__panel", 27027 focusable: false, 27028 children: tabPanels.color 27029 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tabs.TabPanel, { 27030 tabId: TAB_IDS.gradient, 27031 className: "block-editor-color-gradient-control__panel", 27032 focusable: false, 27033 children: tabPanels.gradient 27034 })] 27035 }) 27036 }), !canChooseAGradient && renderPanelType(TAB_IDS.color), !canChooseAColor && renderPanelType(TAB_IDS.gradient)] 27037 }) 27038 }) 27039 }); 27040 } 27041 function ColorGradientControlSelect(props) { 27042 const [colors, gradients, customColors, customGradients] = use_settings_useSettings('color.palette', 'color.gradients', 'color.custom', 'color.customGradient'); 27043 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorGradientControlInner, { 27044 colors: colors, 27045 gradients: gradients, 27046 disableCustomColors: !customColors, 27047 disableCustomGradients: !customGradients, 27048 ...props 27049 }); 27050 } 27051 function ColorGradientControl(props) { 27052 if (colorsAndGradientKeys.every(key => props.hasOwnProperty(key))) { 27053 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorGradientControlInner, { 27054 ...props 27055 }); 27056 } 27057 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorGradientControlSelect, { 27058 ...props 27059 }); 27060 } 27061 /* harmony default export */ const control = (ColorGradientControl); 27062 27063 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/color-panel.js 27064 /** 27065 * External dependencies 27066 */ 27067 27068 27069 /** 27070 * WordPress dependencies 27071 */ 27072 27073 27074 27075 27076 /** 27077 * Internal dependencies 27078 */ 27079 27080 27081 27082 27083 27084 27085 27086 function useHasColorPanel(settings) { 27087 const hasTextPanel = useHasTextPanel(settings); 27088 const hasBackgroundPanel = useHasBackgroundColorPanel(settings); 27089 const hasLinkPanel = useHasLinkPanel(settings); 27090 const hasHeadingPanel = useHasHeadingPanel(settings); 27091 const hasButtonPanel = useHasButtonPanel(settings); 27092 const hasCaptionPanel = useHasCaptionPanel(settings); 27093 return hasTextPanel || hasBackgroundPanel || hasLinkPanel || hasHeadingPanel || hasButtonPanel || hasCaptionPanel; 27094 } 27095 function useHasTextPanel(settings) { 27096 const colors = useColorsPerOrigin(settings); 27097 return settings?.color?.text && (colors?.length > 0 || settings?.color?.custom); 27098 } 27099 function useHasLinkPanel(settings) { 27100 const colors = useColorsPerOrigin(settings); 27101 return settings?.color?.link && (colors?.length > 0 || settings?.color?.custom); 27102 } 27103 function useHasCaptionPanel(settings) { 27104 const colors = useColorsPerOrigin(settings); 27105 return settings?.color?.caption && (colors?.length > 0 || settings?.color?.custom); 27106 } 27107 function useHasHeadingPanel(settings) { 27108 const colors = useColorsPerOrigin(settings); 27109 const gradients = useGradientsPerOrigin(settings); 27110 return settings?.color?.heading && (colors?.length > 0 || settings?.color?.custom || gradients?.length > 0 || settings?.color?.customGradient); 27111 } 27112 function useHasButtonPanel(settings) { 27113 const colors = useColorsPerOrigin(settings); 27114 const gradients = useGradientsPerOrigin(settings); 27115 return settings?.color?.button && (colors?.length > 0 || settings?.color?.custom || gradients?.length > 0 || settings?.color?.customGradient); 27116 } 27117 function useHasBackgroundColorPanel(settings) { 27118 const colors = useColorsPerOrigin(settings); 27119 const gradients = useGradientsPerOrigin(settings); 27120 return settings?.color?.background && (colors?.length > 0 || settings?.color?.custom || gradients?.length > 0 || settings?.color?.customGradient); 27121 } 27122 function ColorToolsPanel({ 27123 resetAllFilter, 27124 onChange, 27125 value, 27126 panelId, 27127 children 27128 }) { 27129 const dropdownMenuProps = useToolsPanelDropdownMenuProps(); 27130 const resetAll = () => { 27131 const updatedValue = resetAllFilter(value); 27132 onChange(updatedValue); 27133 }; 27134 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 27135 label: (0,external_wp_i18n_namespaceObject.__)('Elements'), 27136 resetAll: resetAll, 27137 panelId: panelId, 27138 hasInnerWrapper: true, 27139 headingLevel: 3, 27140 className: "color-block-support-panel", 27141 __experimentalFirstVisibleItemClass: "first", 27142 __experimentalLastVisibleItemClass: "last", 27143 dropdownMenuProps: dropdownMenuProps, 27144 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 27145 className: "color-block-support-panel__inner-wrapper", 27146 children: children 27147 }) 27148 }); 27149 } 27150 const color_panel_DEFAULT_CONTROLS = { 27151 text: true, 27152 background: true, 27153 link: true, 27154 heading: true, 27155 button: true, 27156 caption: true 27157 }; 27158 const popoverProps = { 27159 placement: 'left-start', 27160 offset: 36, 27161 shift: true 27162 }; 27163 const { 27164 Tabs: color_panel_Tabs 27165 } = unlock(external_wp_components_namespaceObject.privateApis); 27166 const LabeledColorIndicators = ({ 27167 indicators, 27168 label 27169 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 27170 justify: "flex-start", 27171 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalZStack, { 27172 isLayered: false, 27173 offset: -8, 27174 children: indicators.map((indicator, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Flex, { 27175 expanded: false, 27176 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ColorIndicator, { 27177 colorValue: indicator 27178 }) 27179 }, index)) 27180 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 27181 className: "block-editor-panel-color-gradient-settings__color-name", 27182 title: label, 27183 children: label 27184 })] 27185 }); 27186 function ColorPanelTab({ 27187 isGradient, 27188 inheritedValue, 27189 userValue, 27190 setValue, 27191 colorGradientControlSettings 27192 }) { 27193 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(control, { 27194 ...colorGradientControlSettings, 27195 showTitle: false, 27196 enableAlpha: true, 27197 __experimentalIsRenderedInSidebar: true, 27198 colorValue: isGradient ? undefined : inheritedValue, 27199 gradientValue: isGradient ? inheritedValue : undefined, 27200 onColorChange: isGradient ? undefined : setValue, 27201 onGradientChange: isGradient ? setValue : undefined, 27202 clearable: inheritedValue === userValue, 27203 headingLevel: 3 27204 }); 27205 } 27206 function ColorPanelDropdown({ 27207 label, 27208 hasValue, 27209 resetValue, 27210 isShownByDefault, 27211 indicators, 27212 tabs, 27213 colorGradientControlSettings, 27214 panelId 27215 }) { 27216 var _tabs$; 27217 const currentTab = tabs.find(tab => tab.userValue !== undefined); 27218 const { 27219 key: firstTabKey, 27220 ...firstTab 27221 } = (_tabs$ = tabs[0]) !== null && _tabs$ !== void 0 ? _tabs$ : {}; 27222 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 27223 className: "block-editor-tools-panel-color-gradient-settings__item", 27224 hasValue: hasValue, 27225 label: label, 27226 onDeselect: resetValue, 27227 isShownByDefault: isShownByDefault, 27228 panelId: panelId, 27229 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 27230 popoverProps: popoverProps, 27231 className: "block-editor-tools-panel-color-gradient-settings__dropdown", 27232 renderToggle: ({ 27233 onToggle, 27234 isOpen 27235 }) => { 27236 const toggleProps = { 27237 onClick: onToggle, 27238 className: dist_clsx('block-editor-panel-color-gradient-settings__dropdown', { 27239 'is-open': isOpen 27240 }), 27241 'aria-expanded': isOpen, 27242 'aria-label': (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s is the type of color property, e.g., "background" */ 27243 (0,external_wp_i18n_namespaceObject.__)('Color %s styles'), label) 27244 }; 27245 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 27246 __next40pxDefaultSize: true, 27247 ...toggleProps, 27248 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LabeledColorIndicators, { 27249 indicators: indicators, 27250 label: label 27251 }) 27252 }); 27253 }, 27254 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalDropdownContentWrapper, { 27255 paddingSize: "none", 27256 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 27257 className: "block-editor-panel-color-gradient-settings__dropdown-content", 27258 children: [tabs.length === 1 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorPanelTab, { 27259 ...firstTab, 27260 colorGradientControlSettings: colorGradientControlSettings 27261 }, firstTabKey), tabs.length > 1 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(color_panel_Tabs, { 27262 defaultTabId: currentTab?.key, 27263 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_panel_Tabs.TabList, { 27264 children: tabs.map(tab => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_panel_Tabs.Tab, { 27265 tabId: tab.key, 27266 children: tab.label 27267 }, tab.key)) 27268 }), tabs.map(tab => { 27269 const { 27270 key: tabKey, 27271 ...restTabProps 27272 } = tab; 27273 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_panel_Tabs.TabPanel, { 27274 tabId: tabKey, 27275 focusable: false, 27276 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorPanelTab, { 27277 ...restTabProps, 27278 colorGradientControlSettings: colorGradientControlSettings 27279 }, tabKey) 27280 }, tabKey); 27281 })] 27282 })] 27283 }) 27284 }) 27285 }) 27286 }); 27287 } 27288 function ColorPanel({ 27289 as: Wrapper = ColorToolsPanel, 27290 value, 27291 onChange, 27292 inheritedValue = value, 27293 settings, 27294 panelId, 27295 defaultControls = color_panel_DEFAULT_CONTROLS, 27296 children 27297 }) { 27298 const colors = useColorsPerOrigin(settings); 27299 const gradients = useGradientsPerOrigin(settings); 27300 const areCustomSolidsEnabled = settings?.color?.custom; 27301 const areCustomGradientsEnabled = settings?.color?.customGradient; 27302 const hasSolidColors = colors.length > 0 || areCustomSolidsEnabled; 27303 const hasGradientColors = gradients.length > 0 || areCustomGradientsEnabled; 27304 const decodeValue = rawValue => getValueFromVariable({ 27305 settings 27306 }, '', rawValue); 27307 const encodeColorValue = colorValue => { 27308 const allColors = colors.flatMap(({ 27309 colors: originColors 27310 }) => originColors); 27311 const colorObject = allColors.find(({ 27312 color 27313 }) => color === colorValue); 27314 return colorObject ? 'var:preset|color|' + colorObject.slug : colorValue; 27315 }; 27316 const encodeGradientValue = gradientValue => { 27317 const allGradients = gradients.flatMap(({ 27318 gradients: originGradients 27319 }) => originGradients); 27320 const gradientObject = allGradients.find(({ 27321 gradient 27322 }) => gradient === gradientValue); 27323 return gradientObject ? 'var:preset|gradient|' + gradientObject.slug : gradientValue; 27324 }; 27325 27326 // BackgroundColor 27327 const showBackgroundPanel = useHasBackgroundColorPanel(settings); 27328 const backgroundColor = decodeValue(inheritedValue?.color?.background); 27329 const userBackgroundColor = decodeValue(value?.color?.background); 27330 const gradient = decodeValue(inheritedValue?.color?.gradient); 27331 const userGradient = decodeValue(value?.color?.gradient); 27332 const hasBackground = () => !!userBackgroundColor || !!userGradient; 27333 const setBackgroundColor = newColor => { 27334 const newValue = setImmutably(value, ['color', 'background'], encodeColorValue(newColor)); 27335 newValue.color.gradient = undefined; 27336 onChange(newValue); 27337 }; 27338 const setGradient = newGradient => { 27339 const newValue = setImmutably(value, ['color', 'gradient'], encodeGradientValue(newGradient)); 27340 newValue.color.background = undefined; 27341 onChange(newValue); 27342 }; 27343 const resetBackground = () => { 27344 const newValue = setImmutably(value, ['color', 'background'], undefined); 27345 newValue.color.gradient = undefined; 27346 onChange(newValue); 27347 }; 27348 27349 // Links 27350 const showLinkPanel = useHasLinkPanel(settings); 27351 const linkColor = decodeValue(inheritedValue?.elements?.link?.color?.text); 27352 const userLinkColor = decodeValue(value?.elements?.link?.color?.text); 27353 const setLinkColor = newColor => { 27354 onChange(setImmutably(value, ['elements', 'link', 'color', 'text'], encodeColorValue(newColor))); 27355 }; 27356 const hoverLinkColor = decodeValue(inheritedValue?.elements?.link?.[':hover']?.color?.text); 27357 const userHoverLinkColor = decodeValue(value?.elements?.link?.[':hover']?.color?.text); 27358 const setHoverLinkColor = newColor => { 27359 onChange(setImmutably(value, ['elements', 'link', ':hover', 'color', 'text'], encodeColorValue(newColor))); 27360 }; 27361 const hasLink = () => !!userLinkColor || !!userHoverLinkColor; 27362 const resetLink = () => { 27363 let newValue = setImmutably(value, ['elements', 'link', ':hover', 'color', 'text'], undefined); 27364 newValue = setImmutably(newValue, ['elements', 'link', 'color', 'text'], undefined); 27365 onChange(newValue); 27366 }; 27367 27368 // Text Color 27369 const showTextPanel = useHasTextPanel(settings); 27370 const textColor = decodeValue(inheritedValue?.color?.text); 27371 const userTextColor = decodeValue(value?.color?.text); 27372 const hasTextColor = () => !!userTextColor; 27373 const setTextColor = newColor => { 27374 let changedObject = setImmutably(value, ['color', 'text'], encodeColorValue(newColor)); 27375 if (textColor === linkColor) { 27376 changedObject = setImmutably(changedObject, ['elements', 'link', 'color', 'text'], encodeColorValue(newColor)); 27377 } 27378 onChange(changedObject); 27379 }; 27380 const resetTextColor = () => setTextColor(undefined); 27381 27382 // Elements 27383 const elements = [{ 27384 name: 'caption', 27385 label: (0,external_wp_i18n_namespaceObject.__)('Captions'), 27386 showPanel: useHasCaptionPanel(settings) 27387 }, { 27388 name: 'button', 27389 label: (0,external_wp_i18n_namespaceObject.__)('Button'), 27390 showPanel: useHasButtonPanel(settings) 27391 }, { 27392 name: 'heading', 27393 label: (0,external_wp_i18n_namespaceObject.__)('Heading'), 27394 showPanel: useHasHeadingPanel(settings) 27395 }, { 27396 name: 'h1', 27397 label: (0,external_wp_i18n_namespaceObject.__)('H1'), 27398 showPanel: useHasHeadingPanel(settings) 27399 }, { 27400 name: 'h2', 27401 label: (0,external_wp_i18n_namespaceObject.__)('H2'), 27402 showPanel: useHasHeadingPanel(settings) 27403 }, { 27404 name: 'h3', 27405 label: (0,external_wp_i18n_namespaceObject.__)('H3'), 27406 showPanel: useHasHeadingPanel(settings) 27407 }, { 27408 name: 'h4', 27409 label: (0,external_wp_i18n_namespaceObject.__)('H4'), 27410 showPanel: useHasHeadingPanel(settings) 27411 }, { 27412 name: 'h5', 27413 label: (0,external_wp_i18n_namespaceObject.__)('H5'), 27414 showPanel: useHasHeadingPanel(settings) 27415 }, { 27416 name: 'h6', 27417 label: (0,external_wp_i18n_namespaceObject.__)('H6'), 27418 showPanel: useHasHeadingPanel(settings) 27419 }]; 27420 const resetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(previousValue => { 27421 return { 27422 ...previousValue, 27423 color: undefined, 27424 elements: { 27425 ...previousValue?.elements, 27426 link: { 27427 ...previousValue?.elements?.link, 27428 color: undefined, 27429 ':hover': { 27430 color: undefined 27431 } 27432 }, 27433 ...elements.reduce((acc, element) => { 27434 return { 27435 ...acc, 27436 [element.name]: { 27437 ...previousValue?.elements?.[element.name], 27438 color: undefined 27439 } 27440 }; 27441 }, {}) 27442 } 27443 }; 27444 }, []); 27445 const items = [showTextPanel && { 27446 key: 'text', 27447 label: (0,external_wp_i18n_namespaceObject.__)('Text'), 27448 hasValue: hasTextColor, 27449 resetValue: resetTextColor, 27450 isShownByDefault: defaultControls.text, 27451 indicators: [textColor], 27452 tabs: [{ 27453 key: 'text', 27454 label: (0,external_wp_i18n_namespaceObject.__)('Text'), 27455 inheritedValue: textColor, 27456 setValue: setTextColor, 27457 userValue: userTextColor 27458 }] 27459 }, showBackgroundPanel && { 27460 key: 'background', 27461 label: (0,external_wp_i18n_namespaceObject.__)('Background'), 27462 hasValue: hasBackground, 27463 resetValue: resetBackground, 27464 isShownByDefault: defaultControls.background, 27465 indicators: [gradient !== null && gradient !== void 0 ? gradient : backgroundColor], 27466 tabs: [hasSolidColors && { 27467 key: 'background', 27468 label: (0,external_wp_i18n_namespaceObject.__)('Color'), 27469 inheritedValue: backgroundColor, 27470 setValue: setBackgroundColor, 27471 userValue: userBackgroundColor 27472 }, hasGradientColors && { 27473 key: 'gradient', 27474 label: (0,external_wp_i18n_namespaceObject.__)('Gradient'), 27475 inheritedValue: gradient, 27476 setValue: setGradient, 27477 userValue: userGradient, 27478 isGradient: true 27479 }].filter(Boolean) 27480 }, showLinkPanel && { 27481 key: 'link', 27482 label: (0,external_wp_i18n_namespaceObject.__)('Link'), 27483 hasValue: hasLink, 27484 resetValue: resetLink, 27485 isShownByDefault: defaultControls.link, 27486 indicators: [linkColor, hoverLinkColor], 27487 tabs: [{ 27488 key: 'link', 27489 label: (0,external_wp_i18n_namespaceObject.__)('Default'), 27490 inheritedValue: linkColor, 27491 setValue: setLinkColor, 27492 userValue: userLinkColor 27493 }, { 27494 key: 'hover', 27495 label: (0,external_wp_i18n_namespaceObject.__)('Hover'), 27496 inheritedValue: hoverLinkColor, 27497 setValue: setHoverLinkColor, 27498 userValue: userHoverLinkColor 27499 }] 27500 }].filter(Boolean); 27501 elements.forEach(({ 27502 name, 27503 label, 27504 showPanel 27505 }) => { 27506 if (!showPanel) { 27507 return; 27508 } 27509 const elementBackgroundColor = decodeValue(inheritedValue?.elements?.[name]?.color?.background); 27510 const elementGradient = decodeValue(inheritedValue?.elements?.[name]?.color?.gradient); 27511 const elementTextColor = decodeValue(inheritedValue?.elements?.[name]?.color?.text); 27512 const elementBackgroundUserColor = decodeValue(value?.elements?.[name]?.color?.background); 27513 const elementGradientUserColor = decodeValue(value?.elements?.[name]?.color?.gradient); 27514 const elementTextUserColor = decodeValue(value?.elements?.[name]?.color?.text); 27515 const hasElement = () => !!(elementTextUserColor || elementBackgroundUserColor || elementGradientUserColor); 27516 const resetElement = () => { 27517 const newValue = setImmutably(value, ['elements', name, 'color', 'background'], undefined); 27518 newValue.elements[name].color.gradient = undefined; 27519 newValue.elements[name].color.text = undefined; 27520 onChange(newValue); 27521 }; 27522 const setElementTextColor = newTextColor => { 27523 onChange(setImmutably(value, ['elements', name, 'color', 'text'], encodeColorValue(newTextColor))); 27524 }; 27525 const setElementBackgroundColor = newBackgroundColor => { 27526 const newValue = setImmutably(value, ['elements', name, 'color', 'background'], encodeColorValue(newBackgroundColor)); 27527 newValue.elements[name].color.gradient = undefined; 27528 onChange(newValue); 27529 }; 27530 const setElementGradient = newGradient => { 27531 const newValue = setImmutably(value, ['elements', name, 'color', 'gradient'], encodeGradientValue(newGradient)); 27532 newValue.elements[name].color.background = undefined; 27533 onChange(newValue); 27534 }; 27535 const supportsTextColor = true; 27536 // Background color is not supported for `caption` 27537 // as there isn't yet a way to set padding for the element. 27538 const supportsBackground = name !== 'caption'; 27539 items.push({ 27540 key: name, 27541 label, 27542 hasValue: hasElement, 27543 resetValue: resetElement, 27544 isShownByDefault: defaultControls[name], 27545 indicators: supportsTextColor && supportsBackground ? [elementTextColor, elementGradient !== null && elementGradient !== void 0 ? elementGradient : elementBackgroundColor] : [supportsTextColor ? elementTextColor : elementGradient !== null && elementGradient !== void 0 ? elementGradient : elementBackgroundColor], 27546 tabs: [hasSolidColors && supportsTextColor && { 27547 key: 'text', 27548 label: (0,external_wp_i18n_namespaceObject.__)('Text'), 27549 inheritedValue: elementTextColor, 27550 setValue: setElementTextColor, 27551 userValue: elementTextUserColor 27552 }, hasSolidColors && supportsBackground && { 27553 key: 'background', 27554 label: (0,external_wp_i18n_namespaceObject.__)('Background'), 27555 inheritedValue: elementBackgroundColor, 27556 setValue: setElementBackgroundColor, 27557 userValue: elementBackgroundUserColor 27558 }, hasGradientColors && supportsBackground && { 27559 key: 'gradient', 27560 label: (0,external_wp_i18n_namespaceObject.__)('Gradient'), 27561 inheritedValue: elementGradient, 27562 setValue: setElementGradient, 27563 userValue: elementGradientUserColor, 27564 isGradient: true 27565 }].filter(Boolean) 27566 }); 27567 }); 27568 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Wrapper, { 27569 resetAllFilter: resetAllFilter, 27570 value: value, 27571 onChange: onChange, 27572 panelId: panelId, 27573 children: [items.map(item => { 27574 const { 27575 key, 27576 ...restItem 27577 } = item; 27578 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorPanelDropdown, { 27579 ...restItem, 27580 colorGradientControlSettings: { 27581 colors, 27582 disableCustomColors: !areCustomSolidsEnabled, 27583 gradients, 27584 disableCustomGradients: !areCustomGradientsEnabled 27585 }, 27586 panelId: panelId 27587 }, key); 27588 }), children] 27589 }); 27590 } 27591 27592 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/contrast-checker/index.js 27593 /** 27594 * External dependencies 27595 */ 27596 27597 27598 27599 27600 /** 27601 * WordPress dependencies 27602 */ 27603 27604 27605 27606 27607 k([names, a11y]); 27608 function ContrastChecker({ 27609 backgroundColor, 27610 fallbackBackgroundColor, 27611 fallbackTextColor, 27612 fallbackLinkColor, 27613 fontSize, 27614 // Font size value in pixels. 27615 isLargeText, 27616 textColor, 27617 linkColor, 27618 enableAlphaChecker = false 27619 }) { 27620 const currentBackgroundColor = backgroundColor || fallbackBackgroundColor; 27621 27622 // Must have a background color. 27623 if (!currentBackgroundColor) { 27624 return null; 27625 } 27626 const currentTextColor = textColor || fallbackTextColor; 27627 const currentLinkColor = linkColor || fallbackLinkColor; 27628 27629 // Must have at least one text color. 27630 if (!currentTextColor && !currentLinkColor) { 27631 return null; 27632 } 27633 const textColors = [{ 27634 color: currentTextColor, 27635 description: (0,external_wp_i18n_namespaceObject.__)('text color') 27636 }, { 27637 color: currentLinkColor, 27638 description: (0,external_wp_i18n_namespaceObject.__)('link color') 27639 }]; 27640 const colordBackgroundColor = w(currentBackgroundColor); 27641 const backgroundColorHasTransparency = colordBackgroundColor.alpha() < 1; 27642 const backgroundColorBrightness = colordBackgroundColor.brightness(); 27643 const isReadableOptions = { 27644 level: 'AA', 27645 size: isLargeText || isLargeText !== false && fontSize >= 24 ? 'large' : 'small' 27646 }; 27647 let message = ''; 27648 let speakMessage = ''; 27649 for (const item of textColors) { 27650 // If there is no color, go no further. 27651 if (!item.color) { 27652 continue; 27653 } 27654 const colordTextColor = w(item.color); 27655 const isColordTextReadable = colordTextColor.isReadable(colordBackgroundColor, isReadableOptions); 27656 const textHasTransparency = colordTextColor.alpha() < 1; 27657 27658 // If the contrast is not readable. 27659 if (!isColordTextReadable) { 27660 // Don't show the message if the background or text is transparent. 27661 if (backgroundColorHasTransparency || textHasTransparency) { 27662 continue; 27663 } 27664 message = backgroundColorBrightness < colordTextColor.brightness() ? (0,external_wp_i18n_namespaceObject.sprintf)( 27665 // translators: %s is a type of text color, e.g., "text color" or "link color". 27666 (0,external_wp_i18n_namespaceObject.__)('This color combination may be hard for people to read. Try using a darker background color and/or a brighter %s.'), item.description) : (0,external_wp_i18n_namespaceObject.sprintf)( 27667 // translators: %s is a type of text color, e.g., "text color" or "link color". 27668 (0,external_wp_i18n_namespaceObject.__)('This color combination may be hard for people to read. Try using a brighter background color and/or a darker %s.'), item.description); 27669 speakMessage = (0,external_wp_i18n_namespaceObject.__)('This color combination may be hard for people to read.'); 27670 // Break from the loop when we have a contrast warning. 27671 // These messages take priority over the transparency warning. 27672 break; 27673 } 27674 27675 // If there is no contrast warning and the text is transparent, 27676 // show the transparent warning if alpha check is enabled. 27677 if (textHasTransparency && enableAlphaChecker) { 27678 message = (0,external_wp_i18n_namespaceObject.__)('Transparent text may be hard for people to read.'); 27679 speakMessage = (0,external_wp_i18n_namespaceObject.__)('Transparent text may be hard for people to read.'); 27680 } 27681 } 27682 if (!message) { 27683 return null; 27684 } 27685 27686 // Note: The `Notice` component can speak messages via its `spokenMessage` 27687 // prop, but the contrast checker requires granular control over when the 27688 // announcements are made. Notably, the message will be re-announced if a 27689 // new color combination is selected and the contrast is still insufficient. 27690 (0,external_wp_a11y_namespaceObject.speak)(speakMessage); 27691 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 27692 className: "block-editor-contrast-checker", 27693 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Notice, { 27694 spokenMessage: null, 27695 status: "warning", 27696 isDismissible: false, 27697 children: message 27698 }) 27699 }); 27700 } 27701 27702 /** 27703 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/contrast-checker/README.md 27704 */ 27705 /* harmony default export */ const contrast_checker = (ContrastChecker); 27706 27707 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/provider/block-refs-provider.js 27708 /** 27709 * WordPress dependencies 27710 */ 27711 27712 27713 27714 const BlockRefs = (0,external_wp_element_namespaceObject.createContext)({ 27715 refsMap: (0,external_wp_compose_namespaceObject.observableMap)() 27716 }); 27717 function BlockRefsProvider({ 27718 children 27719 }) { 27720 const value = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 27721 refsMap: (0,external_wp_compose_namespaceObject.observableMap)() 27722 }), []); 27723 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockRefs.Provider, { 27724 value: value, 27725 children: children 27726 }); 27727 } 27728 27729 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/use-block-refs.js 27730 /** 27731 * WordPress dependencies 27732 */ 27733 27734 27735 27736 /** 27737 * Internal dependencies 27738 */ 27739 27740 27741 /** @typedef {import('@wordpress/element').RefCallback} RefCallback */ 27742 /** @typedef {import('@wordpress/element').Ref} Ref */ 27743 27744 /** 27745 * Provides a ref to the BlockRefs context. 27746 * 27747 * @param {string} clientId The client ID of the element ref. 27748 * 27749 * @return {RefCallback} Ref callback. 27750 */ 27751 function useBlockRefProvider(clientId) { 27752 const { 27753 refsMap 27754 } = (0,external_wp_element_namespaceObject.useContext)(BlockRefs); 27755 return (0,external_wp_compose_namespaceObject.useRefEffect)(element => { 27756 refsMap.set(clientId, element); 27757 return () => refsMap.delete(clientId); 27758 }, [clientId]); 27759 } 27760 function assignRef(ref, value) { 27761 if (typeof ref === 'function') { 27762 ref(value); 27763 } else if (ref) { 27764 ref.current = value; 27765 } 27766 } 27767 27768 /** 27769 * Tracks the DOM element for the block identified by `clientId` and assigns it to the `ref` 27770 * whenever it changes. 27771 * 27772 * @param {string} clientId The client ID to track. 27773 * @param {Ref} ref The ref object/callback to assign to. 27774 */ 27775 function useBlockElementRef(clientId, ref) { 27776 const { 27777 refsMap 27778 } = (0,external_wp_element_namespaceObject.useContext)(BlockRefs); 27779 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 27780 assignRef(ref, refsMap.get(clientId)); 27781 const unsubscribe = refsMap.subscribe(clientId, () => assignRef(ref, refsMap.get(clientId))); 27782 return () => { 27783 unsubscribe(); 27784 assignRef(ref, null); 27785 }; 27786 }, [refsMap, clientId, ref]); 27787 } 27788 27789 /** 27790 * Return the element for a given client ID. Updates whenever the element 27791 * changes, becomes available, or disappears. 27792 * 27793 * @param {string} clientId The client ID to an element for. 27794 * 27795 * @return {Element|null} The block's wrapper element. 27796 */ 27797 function useBlockElement(clientId) { 27798 const [blockElement, setBlockElement] = (0,external_wp_element_namespaceObject.useState)(null); 27799 useBlockElementRef(clientId, setBlockElement); 27800 return blockElement; 27801 } 27802 27803 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/contrast-checker.js 27804 /** 27805 * WordPress dependencies 27806 */ 27807 27808 27809 /** 27810 * Internal dependencies 27811 */ 27812 27813 27814 27815 function getComputedStyle(node) { 27816 return node.ownerDocument.defaultView.getComputedStyle(node); 27817 } 27818 function BlockColorContrastChecker({ 27819 clientId 27820 }) { 27821 const [detectedBackgroundColor, setDetectedBackgroundColor] = (0,external_wp_element_namespaceObject.useState)(); 27822 const [detectedColor, setDetectedColor] = (0,external_wp_element_namespaceObject.useState)(); 27823 const [detectedLinkColor, setDetectedLinkColor] = (0,external_wp_element_namespaceObject.useState)(); 27824 const blockEl = useBlockElement(clientId); 27825 27826 // There are so many things that can change the color of a block 27827 // So we perform this check on every render. 27828 // eslint-disable-next-line react-hooks/exhaustive-deps 27829 (0,external_wp_element_namespaceObject.useEffect)(() => { 27830 if (!blockEl) { 27831 return; 27832 } 27833 setDetectedColor(getComputedStyle(blockEl).color); 27834 const firstLinkElement = blockEl.querySelector('a'); 27835 if (firstLinkElement && !!firstLinkElement.innerText) { 27836 setDetectedLinkColor(getComputedStyle(firstLinkElement).color); 27837 } 27838 let backgroundColorNode = blockEl; 27839 let backgroundColor = getComputedStyle(backgroundColorNode).backgroundColor; 27840 while (backgroundColor === 'rgba(0, 0, 0, 0)' && backgroundColorNode.parentNode && backgroundColorNode.parentNode.nodeType === backgroundColorNode.parentNode.ELEMENT_NODE) { 27841 backgroundColorNode = backgroundColorNode.parentNode; 27842 backgroundColor = getComputedStyle(backgroundColorNode).backgroundColor; 27843 } 27844 setDetectedBackgroundColor(backgroundColor); 27845 }, [blockEl]); 27846 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(contrast_checker, { 27847 backgroundColor: detectedBackgroundColor, 27848 textColor: detectedColor, 27849 enableAlphaChecker: true, 27850 linkColor: detectedLinkColor 27851 }); 27852 } 27853 27854 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/color.js 27855 /** 27856 * External dependencies 27857 */ 27858 27859 27860 /** 27861 * WordPress dependencies 27862 */ 27863 27864 27865 27866 27867 27868 /** 27869 * Internal dependencies 27870 */ 27871 27872 27873 27874 27875 27876 27877 27878 27879 27880 27881 const COLOR_SUPPORT_KEY = 'color'; 27882 const hasColorSupport = blockNameOrType => { 27883 const colorSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockNameOrType, COLOR_SUPPORT_KEY); 27884 return colorSupport && (colorSupport.link === true || colorSupport.gradient === true || colorSupport.background !== false || colorSupport.text !== false); 27885 }; 27886 const hasLinkColorSupport = blockType => { 27887 if (external_wp_element_namespaceObject.Platform.OS !== 'web') { 27888 return false; 27889 } 27890 const colorSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, COLOR_SUPPORT_KEY); 27891 return colorSupport !== null && typeof colorSupport === 'object' && !!colorSupport.link; 27892 }; 27893 const hasGradientSupport = blockNameOrType => { 27894 const colorSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockNameOrType, COLOR_SUPPORT_KEY); 27895 return colorSupport !== null && typeof colorSupport === 'object' && !!colorSupport.gradients; 27896 }; 27897 const hasBackgroundColorSupport = blockType => { 27898 const colorSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, COLOR_SUPPORT_KEY); 27899 return colorSupport && colorSupport.background !== false; 27900 }; 27901 const hasTextColorSupport = blockType => { 27902 const colorSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, COLOR_SUPPORT_KEY); 27903 return colorSupport && colorSupport.text !== false; 27904 }; 27905 27906 /** 27907 * Filters registered block settings, extending attributes to include 27908 * `backgroundColor` and `textColor` attribute. 27909 * 27910 * @param {Object} settings Original block settings. 27911 * 27912 * @return {Object} Filtered block settings. 27913 */ 27914 function color_addAttributes(settings) { 27915 if (!hasColorSupport(settings)) { 27916 return settings; 27917 } 27918 27919 // Allow blocks to specify their own attribute definition with default values if needed. 27920 if (!settings.attributes.backgroundColor) { 27921 Object.assign(settings.attributes, { 27922 backgroundColor: { 27923 type: 'string' 27924 } 27925 }); 27926 } 27927 if (!settings.attributes.textColor) { 27928 Object.assign(settings.attributes, { 27929 textColor: { 27930 type: 'string' 27931 } 27932 }); 27933 } 27934 if (hasGradientSupport(settings) && !settings.attributes.gradient) { 27935 Object.assign(settings.attributes, { 27936 gradient: { 27937 type: 'string' 27938 } 27939 }); 27940 } 27941 return settings; 27942 } 27943 27944 /** 27945 * Override props assigned to save component to inject colors classnames. 27946 * 27947 * @param {Object} props Additional props applied to save element. 27948 * @param {Object|string} blockNameOrType Block type. 27949 * @param {Object} attributes Block attributes. 27950 * 27951 * @return {Object} Filtered props applied to save element. 27952 */ 27953 function color_addSaveProps(props, blockNameOrType, attributes) { 27954 if (!hasColorSupport(blockNameOrType) || shouldSkipSerialization(blockNameOrType, COLOR_SUPPORT_KEY)) { 27955 return props; 27956 } 27957 const hasGradient = hasGradientSupport(blockNameOrType); 27958 27959 // I'd have preferred to avoid the "style" attribute usage here 27960 const { 27961 backgroundColor, 27962 textColor, 27963 gradient, 27964 style 27965 } = attributes; 27966 const shouldSerialize = feature => !shouldSkipSerialization(blockNameOrType, COLOR_SUPPORT_KEY, feature); 27967 27968 // Primary color classes must come before the `has-text-color`, 27969 // `has-background` and `has-link-color` classes to maintain backwards 27970 // compatibility and avoid block invalidations. 27971 const textClass = shouldSerialize('text') ? getColorClassName('color', textColor) : undefined; 27972 const gradientClass = shouldSerialize('gradients') ? __experimentalGetGradientClass(gradient) : undefined; 27973 const backgroundClass = shouldSerialize('background') ? getColorClassName('background-color', backgroundColor) : undefined; 27974 const serializeHasBackground = shouldSerialize('background') || shouldSerialize('gradients'); 27975 const hasBackground = backgroundColor || style?.color?.background || hasGradient && (gradient || style?.color?.gradient); 27976 const newClassName = dist_clsx(props.className, textClass, gradientClass, { 27977 // Don't apply the background class if there's a custom gradient. 27978 [backgroundClass]: (!hasGradient || !style?.color?.gradient) && !!backgroundClass, 27979 'has-text-color': shouldSerialize('text') && (textColor || style?.color?.text), 27980 'has-background': serializeHasBackground && hasBackground, 27981 'has-link-color': shouldSerialize('link') && style?.elements?.link?.color 27982 }); 27983 props.className = newClassName ? newClassName : undefined; 27984 return props; 27985 } 27986 function color_styleToAttributes(style) { 27987 const textColorValue = style?.color?.text; 27988 const textColorSlug = textColorValue?.startsWith('var:preset|color|') ? textColorValue.substring('var:preset|color|'.length) : undefined; 27989 const backgroundColorValue = style?.color?.background; 27990 const backgroundColorSlug = backgroundColorValue?.startsWith('var:preset|color|') ? backgroundColorValue.substring('var:preset|color|'.length) : undefined; 27991 const gradientValue = style?.color?.gradient; 27992 const gradientSlug = gradientValue?.startsWith('var:preset|gradient|') ? gradientValue.substring('var:preset|gradient|'.length) : undefined; 27993 const updatedStyle = { 27994 ...style 27995 }; 27996 updatedStyle.color = { 27997 ...updatedStyle.color, 27998 text: textColorSlug ? undefined : textColorValue, 27999 background: backgroundColorSlug ? undefined : backgroundColorValue, 28000 gradient: gradientSlug ? undefined : gradientValue 28001 }; 28002 return { 28003 style: utils_cleanEmptyObject(updatedStyle), 28004 textColor: textColorSlug, 28005 backgroundColor: backgroundColorSlug, 28006 gradient: gradientSlug 28007 }; 28008 } 28009 function color_attributesToStyle(attributes) { 28010 return { 28011 ...attributes.style, 28012 color: { 28013 ...attributes.style?.color, 28014 text: attributes.textColor ? 'var:preset|color|' + attributes.textColor : attributes.style?.color?.text, 28015 background: attributes.backgroundColor ? 'var:preset|color|' + attributes.backgroundColor : attributes.style?.color?.background, 28016 gradient: attributes.gradient ? 'var:preset|gradient|' + attributes.gradient : attributes.style?.color?.gradient 28017 } 28018 }; 28019 } 28020 function ColorInspectorControl({ 28021 children, 28022 resetAllFilter 28023 }) { 28024 const attributesResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(attributes => { 28025 const existingStyle = color_attributesToStyle(attributes); 28026 const updatedStyle = resetAllFilter(existingStyle); 28027 return { 28028 ...attributes, 28029 ...color_styleToAttributes(updatedStyle) 28030 }; 28031 }, [resetAllFilter]); 28032 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 28033 group: "color", 28034 resetAllFilter: attributesResetAllFilter, 28035 children: children 28036 }); 28037 } 28038 function ColorEdit({ 28039 clientId, 28040 name, 28041 setAttributes, 28042 settings 28043 }) { 28044 const isEnabled = useHasColorPanel(settings); 28045 function selector(select) { 28046 const { 28047 style, 28048 textColor, 28049 backgroundColor, 28050 gradient 28051 } = select(store).getBlockAttributes(clientId) || {}; 28052 return { 28053 style, 28054 textColor, 28055 backgroundColor, 28056 gradient 28057 }; 28058 } 28059 const { 28060 style, 28061 textColor, 28062 backgroundColor, 28063 gradient 28064 } = (0,external_wp_data_namespaceObject.useSelect)(selector, [clientId]); 28065 const value = (0,external_wp_element_namespaceObject.useMemo)(() => { 28066 return color_attributesToStyle({ 28067 style, 28068 textColor, 28069 backgroundColor, 28070 gradient 28071 }); 28072 }, [style, textColor, backgroundColor, gradient]); 28073 const onChange = newStyle => { 28074 setAttributes(color_styleToAttributes(newStyle)); 28075 }; 28076 if (!isEnabled) { 28077 return null; 28078 } 28079 const defaultControls = (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, [COLOR_SUPPORT_KEY, '__experimentalDefaultControls']); 28080 const enableContrastChecking = external_wp_element_namespaceObject.Platform.OS === 'web' && !value?.color?.gradient && (settings?.color?.text || settings?.color?.link) && 28081 // Contrast checking is enabled by default. 28082 // Deactivating it requires `enableContrastChecker` to have 28083 // an explicit value of `false`. 28084 false !== (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, [COLOR_SUPPORT_KEY, 'enableContrastChecker']); 28085 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorPanel, { 28086 as: ColorInspectorControl, 28087 panelId: clientId, 28088 settings: settings, 28089 value: value, 28090 onChange: onChange, 28091 defaultControls: defaultControls, 28092 enableContrastChecker: false !== (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, [COLOR_SUPPORT_KEY, 'enableContrastChecker']), 28093 children: enableContrastChecking && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockColorContrastChecker, { 28094 clientId: clientId 28095 }) 28096 }); 28097 } 28098 function color_useBlockProps({ 28099 name, 28100 backgroundColor, 28101 textColor, 28102 gradient, 28103 style 28104 }) { 28105 const [userPalette, themePalette, defaultPalette] = use_settings_useSettings('color.palette.custom', 'color.palette.theme', 'color.palette.default'); 28106 const colors = (0,external_wp_element_namespaceObject.useMemo)(() => [...(userPalette || []), ...(themePalette || []), ...(defaultPalette || [])], [userPalette, themePalette, defaultPalette]); 28107 if (!hasColorSupport(name) || shouldSkipSerialization(name, COLOR_SUPPORT_KEY)) { 28108 return {}; 28109 } 28110 const extraStyles = {}; 28111 if (textColor && !shouldSkipSerialization(name, COLOR_SUPPORT_KEY, 'text')) { 28112 extraStyles.color = getColorObjectByAttributeValues(colors, textColor)?.color; 28113 } 28114 if (backgroundColor && !shouldSkipSerialization(name, COLOR_SUPPORT_KEY, 'background')) { 28115 extraStyles.backgroundColor = getColorObjectByAttributeValues(colors, backgroundColor)?.color; 28116 } 28117 const saveProps = color_addSaveProps({ 28118 style: extraStyles 28119 }, name, { 28120 textColor, 28121 backgroundColor, 28122 gradient, 28123 style 28124 }); 28125 const hasBackgroundValue = backgroundColor || style?.color?.background || gradient || style?.color?.gradient; 28126 return { 28127 ...saveProps, 28128 className: dist_clsx(saveProps.className, 28129 // Add background image classes in the editor, if not already handled by background color values. 28130 !hasBackgroundValue && getBackgroundImageClasses(style)) 28131 }; 28132 } 28133 /* harmony default export */ const color = ({ 28134 useBlockProps: color_useBlockProps, 28135 addSaveProps: color_addSaveProps, 28136 attributeKeys: ['backgroundColor', 'textColor', 'gradient', 'style'], 28137 hasSupport: hasColorSupport 28138 }); 28139 const MIGRATION_PATHS = { 28140 linkColor: [['style', 'elements', 'link', 'color', 'text']], 28141 textColor: [['textColor'], ['style', 'color', 'text']], 28142 backgroundColor: [['backgroundColor'], ['style', 'color', 'background']], 28143 gradient: [['gradient'], ['style', 'color', 'gradient']] 28144 }; 28145 function color_addTransforms(result, source, index, results) { 28146 const destinationBlockType = result.name; 28147 const activeSupports = { 28148 linkColor: hasLinkColorSupport(destinationBlockType), 28149 textColor: hasTextColorSupport(destinationBlockType), 28150 backgroundColor: hasBackgroundColorSupport(destinationBlockType), 28151 gradient: hasGradientSupport(destinationBlockType) 28152 }; 28153 return transformStyles(activeSupports, MIGRATION_PATHS, result, source, index, results); 28154 } 28155 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/color/addAttribute', color_addAttributes); 28156 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.switchToBlockType.transformedBlock', 'core/color/addTransforms', color_addTransforms); 28157 28158 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/font-family/index.js 28159 /** 28160 * WordPress dependencies 28161 */ 28162 28163 28164 28165 28166 /** 28167 * Internal dependencies 28168 */ 28169 28170 28171 function FontFamilyControl({ 28172 /** Start opting into the larger default height that will become the default size in a future version. */ 28173 __next40pxDefaultSize = false, 28174 /** Start opting into the new margin-free styles that will become the default in a future version. */ 28175 __nextHasNoMarginBottom = false, 28176 value = '', 28177 onChange, 28178 fontFamilies, 28179 ...props 28180 }) { 28181 const [blockLevelFontFamilies] = use_settings_useSettings('typography.fontFamilies'); 28182 if (!fontFamilies) { 28183 fontFamilies = blockLevelFontFamilies; 28184 } 28185 if (!fontFamilies || fontFamilies.length === 0) { 28186 return null; 28187 } 28188 const options = [{ 28189 value: '', 28190 label: (0,external_wp_i18n_namespaceObject.__)('Default') 28191 }, ...fontFamilies.map(({ 28192 fontFamily, 28193 name 28194 }) => { 28195 return { 28196 value: fontFamily, 28197 label: name || fontFamily 28198 }; 28199 })]; 28200 if (!__nextHasNoMarginBottom) { 28201 external_wp_deprecated_default()('Bottom margin styles for wp.blockEditor.FontFamilyControl', { 28202 since: '6.7', 28203 version: '7.0', 28204 hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version' 28205 }); 28206 } 28207 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SelectControl, { 28208 __next40pxDefaultSize: __next40pxDefaultSize, 28209 __nextHasNoMarginBottom: __nextHasNoMarginBottom, 28210 label: (0,external_wp_i18n_namespaceObject.__)('Font'), 28211 options: options, 28212 value: value, 28213 onChange: onChange, 28214 labelPosition: "top", 28215 ...props 28216 }); 28217 } 28218 28219 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/font-appearance-control/index.js 28220 /** 28221 * WordPress dependencies 28222 */ 28223 28224 28225 28226 28227 /** 28228 * Internal dependencies 28229 */ 28230 28231 28232 /** 28233 * Adjusts font appearance field label in case either font styles or weights 28234 * are disabled. 28235 * 28236 * @param {boolean} hasFontStyles Whether font styles are enabled and present. 28237 * @param {boolean} hasFontWeights Whether font weights are enabled and present. 28238 * @return {string} A label representing what font appearance is being edited. 28239 */ 28240 28241 const getFontAppearanceLabel = (hasFontStyles, hasFontWeights) => { 28242 if (!hasFontStyles) { 28243 return (0,external_wp_i18n_namespaceObject.__)('Font weight'); 28244 } 28245 if (!hasFontWeights) { 28246 return (0,external_wp_i18n_namespaceObject.__)('Font style'); 28247 } 28248 return (0,external_wp_i18n_namespaceObject.__)('Appearance'); 28249 }; 28250 28251 /** 28252 * Control to display font style and weight options of the active font. 28253 * 28254 * @param {Object} props Component props. 28255 * 28256 * @return {Element} Font appearance control. 28257 */ 28258 function FontAppearanceControl(props) { 28259 const { 28260 /** Start opting into the larger default height that will become the default size in a future version. */ 28261 __next40pxDefaultSize = false, 28262 onChange, 28263 hasFontStyles = true, 28264 hasFontWeights = true, 28265 fontFamilyFaces, 28266 value: { 28267 fontStyle, 28268 fontWeight 28269 }, 28270 ...otherProps 28271 } = props; 28272 const hasStylesOrWeights = hasFontStyles || hasFontWeights; 28273 const label = getFontAppearanceLabel(hasFontStyles, hasFontWeights); 28274 const defaultOption = { 28275 key: 'default', 28276 name: (0,external_wp_i18n_namespaceObject.__)('Default'), 28277 style: { 28278 fontStyle: undefined, 28279 fontWeight: undefined 28280 } 28281 }; 28282 const { 28283 fontStyles, 28284 fontWeights, 28285 combinedStyleAndWeightOptions 28286 } = getFontStylesAndWeights(fontFamilyFaces); 28287 28288 // Generates select options for combined font styles and weights. 28289 const combineOptions = () => { 28290 const combinedOptions = [defaultOption]; 28291 if (combinedStyleAndWeightOptions) { 28292 combinedOptions.push(...combinedStyleAndWeightOptions); 28293 } 28294 return combinedOptions; 28295 }; 28296 28297 // Generates select options for font styles only. 28298 const styleOptions = () => { 28299 const combinedOptions = [defaultOption]; 28300 fontStyles.forEach(({ 28301 name, 28302 value 28303 }) => { 28304 combinedOptions.push({ 28305 key: value, 28306 name, 28307 style: { 28308 fontStyle: value, 28309 fontWeight: undefined 28310 } 28311 }); 28312 }); 28313 return combinedOptions; 28314 }; 28315 28316 // Generates select options for font weights only. 28317 const weightOptions = () => { 28318 const combinedOptions = [defaultOption]; 28319 fontWeights.forEach(({ 28320 name, 28321 value 28322 }) => { 28323 combinedOptions.push({ 28324 key: value, 28325 name, 28326 style: { 28327 fontStyle: undefined, 28328 fontWeight: value 28329 } 28330 }); 28331 }); 28332 return combinedOptions; 28333 }; 28334 28335 // Map font styles and weights to select options. 28336 const selectOptions = (0,external_wp_element_namespaceObject.useMemo)(() => { 28337 // Display combined available font style and weight options. 28338 if (hasFontStyles && hasFontWeights) { 28339 return combineOptions(); 28340 } 28341 28342 // Display only font style options or font weight options. 28343 return hasFontStyles ? styleOptions() : weightOptions(); 28344 }, [props.options, fontStyles, fontWeights, combinedStyleAndWeightOptions]); 28345 28346 // Find current selection by comparing font style & weight against options, 28347 // and fall back to the Default option if there is no matching option. 28348 const currentSelection = selectOptions.find(option => option.style.fontStyle === fontStyle && option.style.fontWeight === fontWeight) || selectOptions[0]; 28349 28350 // Adjusts screen reader description based on styles or weights. 28351 const getDescribedBy = () => { 28352 if (!currentSelection) { 28353 return (0,external_wp_i18n_namespaceObject.__)('No selected font appearance'); 28354 } 28355 if (!hasFontStyles) { 28356 return (0,external_wp_i18n_namespaceObject.sprintf)( 28357 // translators: %s: Currently selected font weight. 28358 (0,external_wp_i18n_namespaceObject.__)('Currently selected font weight: %s'), currentSelection.name); 28359 } 28360 if (!hasFontWeights) { 28361 return (0,external_wp_i18n_namespaceObject.sprintf)( 28362 // translators: %s: Currently selected font style. 28363 (0,external_wp_i18n_namespaceObject.__)('Currently selected font style: %s'), currentSelection.name); 28364 } 28365 return (0,external_wp_i18n_namespaceObject.sprintf)( 28366 // translators: %s: Currently selected font appearance. 28367 (0,external_wp_i18n_namespaceObject.__)('Currently selected font appearance: %s'), currentSelection.name); 28368 }; 28369 return hasStylesOrWeights && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CustomSelectControl, { 28370 ...otherProps, 28371 className: "components-font-appearance-control", 28372 __next40pxDefaultSize: __next40pxDefaultSize, 28373 label: label, 28374 describedBy: getDescribedBy(), 28375 options: selectOptions, 28376 value: currentSelection, 28377 onChange: ({ 28378 selectedItem 28379 }) => onChange(selectedItem.style) 28380 }); 28381 } 28382 28383 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/line-height-control/utils.js 28384 const BASE_DEFAULT_VALUE = 1.5; 28385 const STEP = 0.01; 28386 /** 28387 * A spin factor of 10 allows the spin controls to increment/decrement by 0.1. 28388 * e.g. A line-height value of 1.55 will increment to 1.65. 28389 */ 28390 const SPIN_FACTOR = 10; 28391 /** 28392 * There are varying value types within LineHeightControl: 28393 * 28394 * {undefined} Initial value. No changes from the user. 28395 * {string} Input value. Value consumed/outputted by the input. Empty would be ''. 28396 * {number} Block attribute type. Input value needs to be converted for attribute setting. 28397 * 28398 * Note: If the value is undefined, the input requires it to be an empty string ('') 28399 * in order to be considered "controlled" by props (rather than internal state). 28400 */ 28401 const RESET_VALUE = ''; 28402 28403 /** 28404 * Determines if the lineHeight attribute has been properly defined. 28405 * 28406 * @param {any} lineHeight The value to check. 28407 * 28408 * @return {boolean} Whether the lineHeight attribute is valid. 28409 */ 28410 function isLineHeightDefined(lineHeight) { 28411 return lineHeight !== undefined && lineHeight !== RESET_VALUE; 28412 } 28413 28414 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/line-height-control/index.js 28415 /** 28416 * WordPress dependencies 28417 */ 28418 28419 28420 28421 /** 28422 * Internal dependencies 28423 */ 28424 28425 28426 const line_height_control_LineHeightControl = ({ 28427 /** Start opting into the larger default height that will become the default size in a future version. */ 28428 __next40pxDefaultSize = false, 28429 value: lineHeight, 28430 onChange, 28431 __unstableInputWidth = '60px', 28432 ...otherProps 28433 }) => { 28434 const isDefined = isLineHeightDefined(lineHeight); 28435 const adjustNextValue = (nextValue, wasTypedOrPasted) => { 28436 // Set the next value without modification if lineHeight has been defined. 28437 if (isDefined) { 28438 return nextValue; 28439 } 28440 28441 /** 28442 * The following logic handles the initial spin up/down action 28443 * (from an undefined value state) so that the next values are better suited for 28444 * line-height rendering. For example, the first spin up should immediately 28445 * go to 1.6, rather than the normally expected 0.1. 28446 * 28447 * Spin up/down actions can be triggered by keydowns of the up/down arrow keys, 28448 * dragging the input or by clicking the spin buttons. 28449 */ 28450 const spin = STEP * SPIN_FACTOR; 28451 switch (`$nextValue}`) { 28452 case `$spin}`: 28453 // Increment by spin value. 28454 return BASE_DEFAULT_VALUE + spin; 28455 case '0': 28456 { 28457 // This means the user explicitly input '0', rather than using the 28458 // spin down action from an undefined value state. 28459 if (wasTypedOrPasted) { 28460 return nextValue; 28461 } 28462 // Decrement by spin value. 28463 return BASE_DEFAULT_VALUE - spin; 28464 } 28465 case '': 28466 return BASE_DEFAULT_VALUE; 28467 default: 28468 return nextValue; 28469 } 28470 }; 28471 const stateReducer = (state, action) => { 28472 // Be careful when changing this — cross-browser behavior of the 28473 // `inputType` field in `input` events are inconsistent. 28474 // For example, Firefox emits an input event with inputType="insertReplacementText" 28475 // on spin button clicks, while other browsers do not even emit an input event. 28476 const wasTypedOrPasted = ['insertText', 'insertFromPaste'].includes(action.payload.event.nativeEvent?.inputType); 28477 const value = adjustNextValue(state.value, wasTypedOrPasted); 28478 return { 28479 ...state, 28480 value 28481 }; 28482 }; 28483 const value = isDefined ? lineHeight : RESET_VALUE; 28484 const handleOnChange = (nextValue, { 28485 event 28486 }) => { 28487 if (nextValue === '') { 28488 onChange(); 28489 return; 28490 } 28491 if (event.type === 'click') { 28492 onChange(adjustNextValue(`$nextValue}`, false)); 28493 return; 28494 } 28495 onChange(`$nextValue}`); 28496 }; 28497 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 28498 className: "block-editor-line-height-control", 28499 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNumberControl, { 28500 ...otherProps, 28501 __next40pxDefaultSize: __next40pxDefaultSize, 28502 __unstableInputWidth: __unstableInputWidth, 28503 __unstableStateReducer: stateReducer, 28504 onChange: handleOnChange, 28505 label: (0,external_wp_i18n_namespaceObject.__)('Line height'), 28506 placeholder: BASE_DEFAULT_VALUE, 28507 step: STEP, 28508 spinFactor: SPIN_FACTOR, 28509 value: value, 28510 min: 0, 28511 spinControls: "custom" 28512 }) 28513 }); 28514 }; 28515 28516 /** 28517 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/line-height-control/README.md 28518 */ 28519 /* harmony default export */ const line_height_control = (line_height_control_LineHeightControl); 28520 28521 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/letter-spacing-control/index.js 28522 /** 28523 * WordPress dependencies 28524 */ 28525 28526 28527 28528 /** 28529 * Internal dependencies 28530 */ 28531 28532 28533 /** 28534 * Control for letter-spacing. 28535 * 28536 * @param {Object} props Component props. 28537 * @param {boolean} props.__next40pxDefaultSize Start opting into the larger default height that will become the default size in a future version. 28538 * @param {string} props.value Currently selected letter-spacing. 28539 * @param {Function} props.onChange Handles change in letter-spacing selection. 28540 * @param {string|number|undefined} props.__unstableInputWidth Input width to pass through to inner UnitControl. Should be a valid CSS value. 28541 * 28542 * @return {Element} Letter-spacing control. 28543 */ 28544 28545 function LetterSpacingControl({ 28546 __next40pxDefaultSize = false, 28547 value, 28548 onChange, 28549 __unstableInputWidth = '60px', 28550 ...otherProps 28551 }) { 28552 const [availableUnits] = use_settings_useSettings('spacing.units'); 28553 const units = (0,external_wp_components_namespaceObject.__experimentalUseCustomUnits)({ 28554 availableUnits: availableUnits || ['px', 'em', 'rem'], 28555 defaultValues: { 28556 px: 2, 28557 em: 0.2, 28558 rem: 0.2 28559 } 28560 }); 28561 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 28562 __next40pxDefaultSize: __next40pxDefaultSize, 28563 ...otherProps, 28564 label: (0,external_wp_i18n_namespaceObject.__)('Letter spacing'), 28565 value: value, 28566 __unstableInputWidth: __unstableInputWidth, 28567 units: units, 28568 onChange: onChange 28569 }); 28570 } 28571 28572 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/align-left.js 28573 /** 28574 * WordPress dependencies 28575 */ 28576 28577 28578 const alignLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28579 xmlns: "http://www.w3.org/2000/svg", 28580 viewBox: "0 0 24 24", 28581 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28582 d: "M13 5.5H4V4h9v1.5Zm7 7H4V11h16v1.5Zm-7 7H4V18h9v1.5Z" 28583 }) 28584 }); 28585 /* harmony default export */ const align_left = (alignLeft); 28586 28587 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/align-center.js 28588 /** 28589 * WordPress dependencies 28590 */ 28591 28592 28593 const align_center_alignCenter = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28594 xmlns: "http://www.w3.org/2000/svg", 28595 viewBox: "0 0 24 24", 28596 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28597 d: "M7.5 5.5h9V4h-9v1.5Zm-3.5 7h16V11H4v1.5Zm3.5 7h9V18h-9v1.5Z" 28598 }) 28599 }); 28600 /* harmony default export */ const align_center = (align_center_alignCenter); 28601 28602 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/align-right.js 28603 /** 28604 * WordPress dependencies 28605 */ 28606 28607 28608 const alignRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28609 xmlns: "http://www.w3.org/2000/svg", 28610 viewBox: "0 0 24 24", 28611 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28612 d: "M11.111 5.5H20V4h-8.889v1.5ZM4 12.5h16V11H4v1.5Zm7.111 7H20V18h-8.889v1.5Z" 28613 }) 28614 }); 28615 /* harmony default export */ const align_right = (alignRight); 28616 28617 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/align-justify.js 28618 /** 28619 * WordPress dependencies 28620 */ 28621 28622 28623 const alignJustify = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28624 xmlns: "http://www.w3.org/2000/svg", 28625 viewBox: "0 0 24 24", 28626 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28627 d: "M4 12.8h16v-1.5H4v1.5zm0 7h12.4v-1.5H4v1.5zM4 4.3v1.5h16V4.3H4z" 28628 }) 28629 }); 28630 /* harmony default export */ const align_justify = (alignJustify); 28631 28632 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/text-alignment-control/index.js 28633 /** 28634 * External dependencies 28635 */ 28636 28637 28638 /** 28639 * WordPress dependencies 28640 */ 28641 28642 28643 28644 28645 28646 const TEXT_ALIGNMENT_OPTIONS = [{ 28647 label: (0,external_wp_i18n_namespaceObject.__)('Align text left'), 28648 value: 'left', 28649 icon: align_left 28650 }, { 28651 label: (0,external_wp_i18n_namespaceObject.__)('Align text center'), 28652 value: 'center', 28653 icon: align_center 28654 }, { 28655 label: (0,external_wp_i18n_namespaceObject.__)('Align text right'), 28656 value: 'right', 28657 icon: align_right 28658 }, { 28659 label: (0,external_wp_i18n_namespaceObject.__)('Justify text'), 28660 value: 'justify', 28661 icon: align_justify 28662 }]; 28663 const DEFAULT_OPTIONS = ['left', 'center', 'right']; 28664 28665 /** 28666 * Control to facilitate text alignment selections. 28667 * 28668 * @param {Object} props Component props. 28669 * @param {string} props.className Class name to add to the control. 28670 * @param {string} props.value Currently selected text alignment. 28671 * @param {Function} props.onChange Handles change in text alignment selection. 28672 * @param {string[]} props.options Array of text alignment options to display. 28673 * 28674 * @return {Element} Text alignment control. 28675 */ 28676 function TextAlignmentControl({ 28677 className, 28678 value, 28679 onChange, 28680 options = DEFAULT_OPTIONS 28681 }) { 28682 const validOptions = (0,external_wp_element_namespaceObject.useMemo)(() => TEXT_ALIGNMENT_OPTIONS.filter(option => options.includes(option.value)), [options]); 28683 if (!validOptions.length) { 28684 return null; 28685 } 28686 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 28687 isDeselectable: true, 28688 __nextHasNoMarginBottom: true, 28689 __next40pxDefaultSize: true, 28690 label: (0,external_wp_i18n_namespaceObject.__)('Text alignment'), 28691 className: dist_clsx('block-editor-text-alignment-control', className), 28692 value: value, 28693 onChange: newValue => { 28694 onChange(newValue === value ? undefined : newValue); 28695 }, 28696 children: validOptions.map(option => { 28697 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOptionIcon, { 28698 value: option.value, 28699 icon: option.icon, 28700 label: option.label 28701 }, option.value); 28702 }) 28703 }); 28704 } 28705 28706 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/reset.js 28707 /** 28708 * WordPress dependencies 28709 */ 28710 28711 28712 const reset_reset = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28713 xmlns: "http://www.w3.org/2000/svg", 28714 viewBox: "0 0 24 24", 28715 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28716 d: "M7 11.5h10V13H7z" 28717 }) 28718 }); 28719 /* harmony default export */ const library_reset = (reset_reset); 28720 28721 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/format-uppercase.js 28722 /** 28723 * WordPress dependencies 28724 */ 28725 28726 28727 const formatUppercase = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28728 xmlns: "http://www.w3.org/2000/svg", 28729 viewBox: "0 0 24 24", 28730 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28731 d: "M6.1 6.8L2.1 18h1.6l1.1-3h4.3l1.1 3h1.6l-4-11.2H6.1zm-.8 6.8L7 8.9l1.7 4.7H5.3zm15.1-.7c-.4-.5-.9-.8-1.6-1 .4-.2.7-.5.8-.9.2-.4.3-.9.3-1.4 0-.9-.3-1.6-.8-2-.6-.5-1.3-.7-2.4-.7h-3.5V18h4.2c1.1 0 2-.3 2.6-.8.6-.6 1-1.4 1-2.4-.1-.8-.3-1.4-.6-1.9zm-5.7-4.7h1.8c.6 0 1.1.1 1.4.4.3.2.5.7.5 1.3 0 .6-.2 1.1-.5 1.3-.3.2-.8.4-1.4.4h-1.8V8.2zm4 8c-.4.3-.9.5-1.5.5h-2.6v-3.8h2.6c1.4 0 2 .6 2 1.9.1.6-.1 1-.5 1.4z" 28732 }) 28733 }); 28734 /* harmony default export */ const format_uppercase = (formatUppercase); 28735 28736 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/format-lowercase.js 28737 /** 28738 * WordPress dependencies 28739 */ 28740 28741 28742 const formatLowercase = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28743 xmlns: "http://www.w3.org/2000/svg", 28744 viewBox: "0 0 24 24", 28745 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28746 d: "M11 16.8c-.1-.1-.2-.3-.3-.5v-2.6c0-.9-.1-1.7-.3-2.2-.2-.5-.5-.9-.9-1.2-.4-.2-.9-.3-1.6-.3-.5 0-1 .1-1.5.2s-.9.3-1.2.6l.2 1.2c.4-.3.7-.4 1.1-.5.3-.1.7-.2 1-.2.6 0 1 .1 1.3.4.3.2.4.7.4 1.4-1.2 0-2.3.2-3.3.7s-1.4 1.1-1.4 2.1c0 .7.2 1.2.7 1.6.4.4 1 .6 1.8.6.9 0 1.7-.4 2.4-1.2.1.3.2.5.4.7.1.2.3.3.6.4.3.1.6.1 1.1.1h.1l.2-1.2h-.1c-.4.1-.6 0-.7-.1zM9.2 16c-.2.3-.5.6-.9.8-.3.1-.7.2-1.1.2-.4 0-.7-.1-.9-.3-.2-.2-.3-.5-.3-.9 0-.6.2-1 .7-1.3.5-.3 1.3-.4 2.5-.5v2zm10.6-3.9c-.3-.6-.7-1.1-1.2-1.5-.6-.4-1.2-.6-1.9-.6-.5 0-.9.1-1.4.3-.4.2-.8.5-1.1.8V6h-1.4v12h1.3l.2-1c.2.4.6.6 1 .8.4.2.9.3 1.4.3.7 0 1.2-.2 1.8-.5.5-.4 1-.9 1.3-1.5.3-.6.5-1.3.5-2.1-.1-.6-.2-1.3-.5-1.9zm-1.7 4c-.4.5-.9.8-1.6.8s-1.2-.2-1.7-.7c-.4-.5-.7-1.2-.7-2.1 0-.9.2-1.6.7-2.1.4-.5 1-.7 1.7-.7s1.2.3 1.6.8c.4.5.6 1.2.6 2s-.2 1.4-.6 2z" 28747 }) 28748 }); 28749 /* harmony default export */ const format_lowercase = (formatLowercase); 28750 28751 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/format-capitalize.js 28752 /** 28753 * WordPress dependencies 28754 */ 28755 28756 28757 const formatCapitalize = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28758 xmlns: "http://www.w3.org/2000/svg", 28759 viewBox: "0 0 24 24", 28760 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28761 d: "M7.1 6.8L3.1 18h1.6l1.1-3h4.3l1.1 3h1.6l-4-11.2H7.1zm-.8 6.8L8 8.9l1.7 4.7H6.3zm14.5-1.5c-.3-.6-.7-1.1-1.2-1.5-.6-.4-1.2-.6-1.9-.6-.5 0-.9.1-1.4.3-.4.2-.8.5-1.1.8V6h-1.4v12h1.3l.2-1c.2.4.6.6 1 .8.4.2.9.3 1.4.3.7 0 1.2-.2 1.8-.5.5-.4 1-.9 1.3-1.5.3-.6.5-1.3.5-2.1-.1-.6-.2-1.3-.5-1.9zm-1.7 4c-.4.5-.9.8-1.6.8s-1.2-.2-1.7-.7c-.4-.5-.7-1.2-.7-2.1 0-.9.2-1.6.7-2.1.4-.5 1-.7 1.7-.7s1.2.3 1.6.8c.4.5.6 1.2.6 2 .1.8-.2 1.4-.6 2z" 28762 }) 28763 }); 28764 /* harmony default export */ const format_capitalize = (formatCapitalize); 28765 28766 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/text-transform-control/index.js 28767 /** 28768 * External dependencies 28769 */ 28770 28771 28772 /** 28773 * WordPress dependencies 28774 */ 28775 28776 28777 28778 28779 const TEXT_TRANSFORMS = [{ 28780 label: (0,external_wp_i18n_namespaceObject.__)('None'), 28781 value: 'none', 28782 icon: library_reset 28783 }, { 28784 label: (0,external_wp_i18n_namespaceObject.__)('Uppercase'), 28785 value: 'uppercase', 28786 icon: format_uppercase 28787 }, { 28788 label: (0,external_wp_i18n_namespaceObject.__)('Lowercase'), 28789 value: 'lowercase', 28790 icon: format_lowercase 28791 }, { 28792 label: (0,external_wp_i18n_namespaceObject.__)('Capitalize'), 28793 value: 'capitalize', 28794 icon: format_capitalize 28795 }]; 28796 28797 /** 28798 * Control to facilitate text transform selections. 28799 * 28800 * @param {Object} props Component props. 28801 * @param {string} props.className Class name to add to the control. 28802 * @param {string} props.value Currently selected text transform. 28803 * @param {Function} props.onChange Handles change in text transform selection. 28804 * 28805 * @return {Element} Text transform control. 28806 */ 28807 function TextTransformControl({ 28808 className, 28809 value, 28810 onChange 28811 }) { 28812 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 28813 isDeselectable: true, 28814 __nextHasNoMarginBottom: true, 28815 __next40pxDefaultSize: true, 28816 label: (0,external_wp_i18n_namespaceObject.__)('Letter case'), 28817 className: dist_clsx('block-editor-text-transform-control', className), 28818 value: value, 28819 onChange: newValue => { 28820 onChange(newValue === value ? undefined : newValue); 28821 }, 28822 children: TEXT_TRANSFORMS.map(option => { 28823 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOptionIcon, { 28824 value: option.value, 28825 icon: option.icon, 28826 label: option.label 28827 }, option.value); 28828 }) 28829 }); 28830 } 28831 28832 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/format-underline.js 28833 /** 28834 * WordPress dependencies 28835 */ 28836 28837 28838 const formatUnderline = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28839 xmlns: "http://www.w3.org/2000/svg", 28840 viewBox: "0 0 24 24", 28841 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28842 d: "M7 18v1h10v-1H7zm5-2c1.5 0 2.6-.4 3.4-1.2.8-.8 1.1-2 1.1-3.5V5H15v5.8c0 1.2-.2 2.1-.6 2.8-.4.7-1.2 1-2.4 1s-2-.3-2.4-1c-.4-.7-.6-1.6-.6-2.8V5H7.5v6.2c0 1.5.4 2.7 1.1 3.5.8.9 1.9 1.3 3.4 1.3z" 28843 }) 28844 }); 28845 /* harmony default export */ const format_underline = (formatUnderline); 28846 28847 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/format-strikethrough.js 28848 /** 28849 * WordPress dependencies 28850 */ 28851 28852 28853 const formatStrikethrough = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28854 xmlns: "http://www.w3.org/2000/svg", 28855 viewBox: "0 0 24 24", 28856 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28857 d: "M9.1 9v-.5c0-.6.2-1.1.7-1.4.5-.3 1.2-.5 2-.5.7 0 1.4.1 2.1.3.7.2 1.4.5 2.1.9l.2-1.9c-.6-.3-1.2-.5-1.9-.7-.8-.1-1.6-.2-2.4-.2-1.5 0-2.7.3-3.6 1-.8.7-1.2 1.5-1.2 2.6V9h2zM20 12H4v1h8.3c.3.1.6.2.8.3.5.2.9.5 1.1.8.3.3.4.7.4 1.2 0 .7-.2 1.1-.8 1.5-.5.3-1.2.5-2.1.5-.8 0-1.6-.1-2.4-.3-.8-.2-1.5-.5-2.2-.8L7 18.1c.5.2 1.2.4 2 .6.8.2 1.6.3 2.4.3 1.7 0 3-.3 3.9-1 .9-.7 1.3-1.6 1.3-2.8 0-.9-.2-1.7-.7-2.2H20v-1z" 28858 }) 28859 }); 28860 /* harmony default export */ const format_strikethrough = (formatStrikethrough); 28861 28862 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/text-decoration-control/index.js 28863 /** 28864 * External dependencies 28865 */ 28866 28867 28868 /** 28869 * WordPress dependencies 28870 */ 28871 28872 28873 28874 28875 const TEXT_DECORATIONS = [{ 28876 label: (0,external_wp_i18n_namespaceObject.__)('None'), 28877 value: 'none', 28878 icon: library_reset 28879 }, { 28880 label: (0,external_wp_i18n_namespaceObject.__)('Underline'), 28881 value: 'underline', 28882 icon: format_underline 28883 }, { 28884 label: (0,external_wp_i18n_namespaceObject.__)('Strikethrough'), 28885 value: 'line-through', 28886 icon: format_strikethrough 28887 }]; 28888 28889 /** 28890 * Control to facilitate text decoration selections. 28891 * 28892 * @param {Object} props Component props. 28893 * @param {string} props.value Currently selected text decoration. 28894 * @param {Function} props.onChange Handles change in text decoration selection. 28895 * @param {string} props.className Additional class name to apply. 28896 * 28897 * @return {Element} Text decoration control. 28898 */ 28899 function TextDecorationControl({ 28900 value, 28901 onChange, 28902 className 28903 }) { 28904 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 28905 isDeselectable: true, 28906 __nextHasNoMarginBottom: true, 28907 __next40pxDefaultSize: true, 28908 label: (0,external_wp_i18n_namespaceObject.__)('Decoration'), 28909 className: dist_clsx('block-editor-text-decoration-control', className), 28910 value: value, 28911 onChange: newValue => { 28912 onChange(newValue === value ? undefined : newValue); 28913 }, 28914 children: TEXT_DECORATIONS.map(option => { 28915 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOptionIcon, { 28916 value: option.value, 28917 icon: option.icon, 28918 label: option.label 28919 }, option.value); 28920 }) 28921 }); 28922 } 28923 28924 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/text-horizontal.js 28925 /** 28926 * WordPress dependencies 28927 */ 28928 28929 28930 const textHorizontal = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28931 xmlns: "http://www.w3.org/2000/svg", 28932 viewBox: "0 0 24 24", 28933 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28934 d: "M8.2 14.4h3.9L13 17h1.7L11 6.5H9.3L5.6 17h1.7l.9-2.6zm2-5.5 1.4 4H8.8l1.4-4zm7.4 7.5-1.3.8.8 1.4H5.5V20h14.3l-2.2-3.6z" 28935 }) 28936 }); 28937 /* harmony default export */ const text_horizontal = (textHorizontal); 28938 28939 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/text-vertical.js 28940 /** 28941 * WordPress dependencies 28942 */ 28943 28944 28945 const textVertical = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 28946 xmlns: "http://www.w3.org/2000/svg", 28947 viewBox: "0 0 24 24", 28948 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 28949 d: "M7 5.6v1.7l2.6.9v3.9L7 13v1.7L17.5 11V9.3L7 5.6zm4.2 6V8.8l4 1.4-4 1.4zm-5.7 5.6V5.5H4v14.3l3.6-2.2-.8-1.3-1.3.9z" 28950 }) 28951 }); 28952 /* harmony default export */ const text_vertical = (textVertical); 28953 28954 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-mode-control/index.js 28955 /** 28956 * External dependencies 28957 */ 28958 28959 28960 /** 28961 * WordPress dependencies 28962 */ 28963 28964 28965 28966 28967 const WRITING_MODES = [{ 28968 label: (0,external_wp_i18n_namespaceObject.__)('Horizontal'), 28969 value: 'horizontal-tb', 28970 icon: text_horizontal 28971 }, { 28972 label: (0,external_wp_i18n_namespaceObject.__)('Vertical'), 28973 value: (0,external_wp_i18n_namespaceObject.isRTL)() ? 'vertical-lr' : 'vertical-rl', 28974 icon: text_vertical 28975 }]; 28976 28977 /** 28978 * Control to facilitate writing mode selections. 28979 * 28980 * @param {Object} props Component props. 28981 * @param {string} props.className Class name to add to the control. 28982 * @param {string} props.value Currently selected writing mode. 28983 * @param {Function} props.onChange Handles change in the writing mode selection. 28984 * 28985 * @return {Element} Writing Mode control. 28986 */ 28987 function WritingModeControl({ 28988 className, 28989 value, 28990 onChange 28991 }) { 28992 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 28993 isDeselectable: true, 28994 __nextHasNoMarginBottom: true, 28995 __next40pxDefaultSize: true, 28996 label: (0,external_wp_i18n_namespaceObject.__)('Orientation'), 28997 className: dist_clsx('block-editor-writing-mode-control', className), 28998 value: value, 28999 onChange: newValue => { 29000 onChange(newValue === value ? undefined : newValue); 29001 }, 29002 children: WRITING_MODES.map(option => { 29003 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOptionIcon, { 29004 value: option.value, 29005 icon: option.icon, 29006 label: option.label 29007 }, option.value); 29008 }) 29009 }); 29010 } 29011 29012 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/typography-panel.js 29013 /** 29014 * WordPress dependencies 29015 */ 29016 29017 29018 29019 29020 /** 29021 * Internal dependencies 29022 */ 29023 29024 29025 29026 29027 29028 29029 29030 29031 29032 29033 29034 29035 29036 const MIN_TEXT_COLUMNS = 1; 29037 const MAX_TEXT_COLUMNS = 6; 29038 function useHasTypographyPanel(settings) { 29039 const hasFontFamily = useHasFontFamilyControl(settings); 29040 const hasLineHeight = useHasLineHeightControl(settings); 29041 const hasFontAppearance = useHasAppearanceControl(settings); 29042 const hasLetterSpacing = useHasLetterSpacingControl(settings); 29043 const hasTextAlign = useHasTextAlignmentControl(settings); 29044 const hasTextTransform = useHasTextTransformControl(settings); 29045 const hasTextDecoration = useHasTextDecorationControl(settings); 29046 const hasWritingMode = useHasWritingModeControl(settings); 29047 const hasTextColumns = useHasTextColumnsControl(settings); 29048 const hasFontSize = useHasFontSizeControl(settings); 29049 return hasFontFamily || hasLineHeight || hasFontAppearance || hasLetterSpacing || hasTextAlign || hasTextTransform || hasFontSize || hasTextDecoration || hasWritingMode || hasTextColumns; 29050 } 29051 function useHasFontSizeControl(settings) { 29052 return settings?.typography?.defaultFontSizes !== false && settings?.typography?.fontSizes?.default?.length || settings?.typography?.fontSizes?.theme?.length || settings?.typography?.fontSizes?.custom?.length || settings?.typography?.customFontSize; 29053 } 29054 function useHasFontFamilyControl(settings) { 29055 return ['default', 'theme', 'custom'].some(key => settings?.typography?.fontFamilies?.[key]?.length); 29056 } 29057 function useHasLineHeightControl(settings) { 29058 return settings?.typography?.lineHeight; 29059 } 29060 function useHasAppearanceControl(settings) { 29061 return settings?.typography?.fontStyle || settings?.typography?.fontWeight; 29062 } 29063 function useAppearanceControlLabel(settings) { 29064 if (!settings?.typography?.fontStyle) { 29065 return (0,external_wp_i18n_namespaceObject.__)('Font weight'); 29066 } 29067 if (!settings?.typography?.fontWeight) { 29068 return (0,external_wp_i18n_namespaceObject.__)('Font style'); 29069 } 29070 return (0,external_wp_i18n_namespaceObject.__)('Appearance'); 29071 } 29072 function useHasLetterSpacingControl(settings) { 29073 return settings?.typography?.letterSpacing; 29074 } 29075 function useHasTextTransformControl(settings) { 29076 return settings?.typography?.textTransform; 29077 } 29078 function useHasTextAlignmentControl(settings) { 29079 return settings?.typography?.textAlign; 29080 } 29081 function useHasTextDecorationControl(settings) { 29082 return settings?.typography?.textDecoration; 29083 } 29084 function useHasWritingModeControl(settings) { 29085 return settings?.typography?.writingMode; 29086 } 29087 function useHasTextColumnsControl(settings) { 29088 return settings?.typography?.textColumns; 29089 } 29090 29091 /** 29092 * Concatenate all the font sizes into a single list for the font size picker. 29093 * 29094 * @param {Object} settings The global styles settings. 29095 * 29096 * @return {Array} The merged font sizes. 29097 */ 29098 function getMergedFontSizes(settings) { 29099 var _fontSizes$custom, _fontSizes$theme, _fontSizes$default; 29100 const fontSizes = settings?.typography?.fontSizes; 29101 const defaultFontSizesEnabled = !!settings?.typography?.defaultFontSizes; 29102 return [...((_fontSizes$custom = fontSizes?.custom) !== null && _fontSizes$custom !== void 0 ? _fontSizes$custom : []), ...((_fontSizes$theme = fontSizes?.theme) !== null && _fontSizes$theme !== void 0 ? _fontSizes$theme : []), ...(defaultFontSizesEnabled ? (_fontSizes$default = fontSizes?.default) !== null && _fontSizes$default !== void 0 ? _fontSizes$default : [] : [])]; 29103 } 29104 function TypographyToolsPanel({ 29105 resetAllFilter, 29106 onChange, 29107 value, 29108 panelId, 29109 children 29110 }) { 29111 const dropdownMenuProps = useToolsPanelDropdownMenuProps(); 29112 const resetAll = () => { 29113 const updatedValue = resetAllFilter(value); 29114 onChange(updatedValue); 29115 }; 29116 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 29117 label: (0,external_wp_i18n_namespaceObject.__)('Typography'), 29118 resetAll: resetAll, 29119 panelId: panelId, 29120 dropdownMenuProps: dropdownMenuProps, 29121 children: children 29122 }); 29123 } 29124 const typography_panel_DEFAULT_CONTROLS = { 29125 fontFamily: true, 29126 fontSize: true, 29127 fontAppearance: true, 29128 lineHeight: true, 29129 letterSpacing: true, 29130 textAlign: true, 29131 textTransform: true, 29132 textDecoration: true, 29133 writingMode: true, 29134 textColumns: true 29135 }; 29136 function TypographyPanel({ 29137 as: Wrapper = TypographyToolsPanel, 29138 value, 29139 onChange, 29140 inheritedValue = value, 29141 settings, 29142 panelId, 29143 defaultControls = typography_panel_DEFAULT_CONTROLS 29144 }) { 29145 const decodeValue = rawValue => getValueFromVariable({ 29146 settings 29147 }, '', rawValue); 29148 29149 // Font Family 29150 const hasFontFamilyEnabled = useHasFontFamilyControl(settings); 29151 const fontFamily = decodeValue(inheritedValue?.typography?.fontFamily); 29152 const { 29153 fontFamilies, 29154 fontFamilyFaces 29155 } = (0,external_wp_element_namespaceObject.useMemo)(() => { 29156 return getMergedFontFamiliesAndFontFamilyFaces(settings, fontFamily); 29157 }, [settings, fontFamily]); 29158 const setFontFamily = newValue => { 29159 const slug = fontFamilies?.find(({ 29160 fontFamily: f 29161 }) => f === newValue)?.slug; 29162 onChange(setImmutably(value, ['typography', 'fontFamily'], slug ? `var:preset|font-family|$slug}` : newValue || undefined)); 29163 }; 29164 const hasFontFamily = () => !!value?.typography?.fontFamily; 29165 const resetFontFamily = () => setFontFamily(undefined); 29166 29167 // Font Size 29168 const hasFontSizeEnabled = useHasFontSizeControl(settings); 29169 const disableCustomFontSizes = !settings?.typography?.customFontSize; 29170 const mergedFontSizes = getMergedFontSizes(settings); 29171 const fontSize = decodeValue(inheritedValue?.typography?.fontSize); 29172 const setFontSize = (newValue, metadata) => { 29173 const actualValue = !!metadata?.slug ? `var:preset|font-size|$metadata?.slug}` : newValue; 29174 onChange(setImmutably(value, ['typography', 'fontSize'], actualValue || undefined)); 29175 }; 29176 const hasFontSize = () => !!value?.typography?.fontSize; 29177 const resetFontSize = () => setFontSize(undefined); 29178 29179 // Appearance 29180 const hasAppearanceControl = useHasAppearanceControl(settings); 29181 const appearanceControlLabel = useAppearanceControlLabel(settings); 29182 const hasFontStyles = settings?.typography?.fontStyle; 29183 const hasFontWeights = settings?.typography?.fontWeight; 29184 const fontStyle = decodeValue(inheritedValue?.typography?.fontStyle); 29185 const fontWeight = decodeValue(inheritedValue?.typography?.fontWeight); 29186 const { 29187 nearestFontStyle, 29188 nearestFontWeight 29189 } = findNearestStyleAndWeight(fontFamilyFaces, fontStyle, fontWeight); 29190 const setFontAppearance = (0,external_wp_element_namespaceObject.useCallback)(({ 29191 fontStyle: newFontStyle, 29192 fontWeight: newFontWeight 29193 }) => { 29194 // Only update the font style and weight if they have changed. 29195 if (newFontStyle !== fontStyle || newFontWeight !== fontWeight) { 29196 onChange({ 29197 ...value, 29198 typography: { 29199 ...value?.typography, 29200 fontStyle: newFontStyle || undefined, 29201 fontWeight: newFontWeight || undefined 29202 } 29203 }); 29204 } 29205 }, [fontStyle, fontWeight, onChange, value]); 29206 const hasFontAppearance = () => !!value?.typography?.fontStyle || !!value?.typography?.fontWeight; 29207 const resetFontAppearance = (0,external_wp_element_namespaceObject.useCallback)(() => { 29208 setFontAppearance({}); 29209 }, [setFontAppearance]); 29210 29211 // Check if previous font style and weight values are available in the new font family. 29212 (0,external_wp_element_namespaceObject.useEffect)(() => { 29213 if (nearestFontStyle && nearestFontWeight) { 29214 setFontAppearance({ 29215 fontStyle: nearestFontStyle, 29216 fontWeight: nearestFontWeight 29217 }); 29218 } else { 29219 // Reset font appearance if there are no available styles or weights. 29220 resetFontAppearance(); 29221 } 29222 }, [nearestFontStyle, nearestFontWeight, resetFontAppearance, setFontAppearance]); 29223 29224 // Line Height 29225 const hasLineHeightEnabled = useHasLineHeightControl(settings); 29226 const lineHeight = decodeValue(inheritedValue?.typography?.lineHeight); 29227 const setLineHeight = newValue => { 29228 onChange(setImmutably(value, ['typography', 'lineHeight'], newValue || undefined)); 29229 }; 29230 const hasLineHeight = () => value?.typography?.lineHeight !== undefined; 29231 const resetLineHeight = () => setLineHeight(undefined); 29232 29233 // Letter Spacing 29234 const hasLetterSpacingControl = useHasLetterSpacingControl(settings); 29235 const letterSpacing = decodeValue(inheritedValue?.typography?.letterSpacing); 29236 const setLetterSpacing = newValue => { 29237 onChange(setImmutably(value, ['typography', 'letterSpacing'], newValue || undefined)); 29238 }; 29239 const hasLetterSpacing = () => !!value?.typography?.letterSpacing; 29240 const resetLetterSpacing = () => setLetterSpacing(undefined); 29241 29242 // Text Columns 29243 const hasTextColumnsControl = useHasTextColumnsControl(settings); 29244 const textColumns = decodeValue(inheritedValue?.typography?.textColumns); 29245 const setTextColumns = newValue => { 29246 onChange(setImmutably(value, ['typography', 'textColumns'], newValue || undefined)); 29247 }; 29248 const hasTextColumns = () => !!value?.typography?.textColumns; 29249 const resetTextColumns = () => setTextColumns(undefined); 29250 29251 // Text Transform 29252 const hasTextTransformControl = useHasTextTransformControl(settings); 29253 const textTransform = decodeValue(inheritedValue?.typography?.textTransform); 29254 const setTextTransform = newValue => { 29255 onChange(setImmutably(value, ['typography', 'textTransform'], newValue || undefined)); 29256 }; 29257 const hasTextTransform = () => !!value?.typography?.textTransform; 29258 const resetTextTransform = () => setTextTransform(undefined); 29259 29260 // Text Decoration 29261 const hasTextDecorationControl = useHasTextDecorationControl(settings); 29262 const textDecoration = decodeValue(inheritedValue?.typography?.textDecoration); 29263 const setTextDecoration = newValue => { 29264 onChange(setImmutably(value, ['typography', 'textDecoration'], newValue || undefined)); 29265 }; 29266 const hasTextDecoration = () => !!value?.typography?.textDecoration; 29267 const resetTextDecoration = () => setTextDecoration(undefined); 29268 29269 // Text Orientation 29270 const hasWritingModeControl = useHasWritingModeControl(settings); 29271 const writingMode = decodeValue(inheritedValue?.typography?.writingMode); 29272 const setWritingMode = newValue => { 29273 onChange(setImmutably(value, ['typography', 'writingMode'], newValue || undefined)); 29274 }; 29275 const hasWritingMode = () => !!value?.typography?.writingMode; 29276 const resetWritingMode = () => setWritingMode(undefined); 29277 29278 // Text Alignment 29279 const hasTextAlignmentControl = useHasTextAlignmentControl(settings); 29280 const textAlign = decodeValue(inheritedValue?.typography?.textAlign); 29281 const setTextAlign = newValue => { 29282 onChange(setImmutably(value, ['typography', 'textAlign'], newValue || undefined)); 29283 }; 29284 const hasTextAlign = () => !!value?.typography?.textAlign; 29285 const resetTextAlign = () => setTextAlign(undefined); 29286 const resetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(previousValue => { 29287 return { 29288 ...previousValue, 29289 typography: {} 29290 }; 29291 }, []); 29292 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Wrapper, { 29293 resetAllFilter: resetAllFilter, 29294 value: value, 29295 onChange: onChange, 29296 panelId: panelId, 29297 children: [hasFontFamilyEnabled && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29298 label: (0,external_wp_i18n_namespaceObject.__)('Font'), 29299 hasValue: hasFontFamily, 29300 onDeselect: resetFontFamily, 29301 isShownByDefault: defaultControls.fontFamily, 29302 panelId: panelId, 29303 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FontFamilyControl, { 29304 fontFamilies: fontFamilies, 29305 value: fontFamily, 29306 onChange: setFontFamily, 29307 size: "__unstable-large", 29308 __nextHasNoMarginBottom: true 29309 }) 29310 }), hasFontSizeEnabled && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29311 label: (0,external_wp_i18n_namespaceObject.__)('Size'), 29312 hasValue: hasFontSize, 29313 onDeselect: resetFontSize, 29314 isShownByDefault: defaultControls.fontSize, 29315 panelId: panelId, 29316 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FontSizePicker, { 29317 value: fontSize, 29318 onChange: setFontSize, 29319 fontSizes: mergedFontSizes, 29320 disableCustomFontSizes: disableCustomFontSizes, 29321 withReset: false, 29322 withSlider: true, 29323 size: "__unstable-large" 29324 }) 29325 }), hasAppearanceControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29326 className: "single-column", 29327 label: appearanceControlLabel, 29328 hasValue: hasFontAppearance, 29329 onDeselect: resetFontAppearance, 29330 isShownByDefault: defaultControls.fontAppearance, 29331 panelId: panelId, 29332 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FontAppearanceControl, { 29333 value: { 29334 fontStyle, 29335 fontWeight 29336 }, 29337 onChange: setFontAppearance, 29338 hasFontStyles: hasFontStyles, 29339 hasFontWeights: hasFontWeights, 29340 fontFamilyFaces: fontFamilyFaces, 29341 size: "__unstable-large" 29342 }) 29343 }), hasLineHeightEnabled && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29344 className: "single-column", 29345 label: (0,external_wp_i18n_namespaceObject.__)('Line height'), 29346 hasValue: hasLineHeight, 29347 onDeselect: resetLineHeight, 29348 isShownByDefault: defaultControls.lineHeight, 29349 panelId: panelId, 29350 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(line_height_control, { 29351 __unstableInputWidth: "auto", 29352 value: lineHeight, 29353 onChange: setLineHeight, 29354 size: "__unstable-large" 29355 }) 29356 }), hasLetterSpacingControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29357 className: "single-column", 29358 label: (0,external_wp_i18n_namespaceObject.__)('Letter spacing'), 29359 hasValue: hasLetterSpacing, 29360 onDeselect: resetLetterSpacing, 29361 isShownByDefault: defaultControls.letterSpacing, 29362 panelId: panelId, 29363 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LetterSpacingControl, { 29364 value: letterSpacing, 29365 onChange: setLetterSpacing, 29366 size: "__unstable-large", 29367 __unstableInputWidth: "auto" 29368 }) 29369 }), hasTextColumnsControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29370 className: "single-column", 29371 label: (0,external_wp_i18n_namespaceObject.__)('Columns'), 29372 hasValue: hasTextColumns, 29373 onDeselect: resetTextColumns, 29374 isShownByDefault: defaultControls.textColumns, 29375 panelId: panelId, 29376 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNumberControl, { 29377 label: (0,external_wp_i18n_namespaceObject.__)('Columns'), 29378 max: MAX_TEXT_COLUMNS, 29379 min: MIN_TEXT_COLUMNS, 29380 onChange: setTextColumns, 29381 size: "__unstable-large", 29382 spinControls: "custom", 29383 value: textColumns, 29384 initialPosition: 1 29385 }) 29386 }), hasTextDecorationControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29387 className: "single-column", 29388 label: (0,external_wp_i18n_namespaceObject.__)('Decoration'), 29389 hasValue: hasTextDecoration, 29390 onDeselect: resetTextDecoration, 29391 isShownByDefault: defaultControls.textDecoration, 29392 panelId: panelId, 29393 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TextDecorationControl, { 29394 value: textDecoration, 29395 onChange: setTextDecoration, 29396 size: "__unstable-large", 29397 __unstableInputWidth: "auto" 29398 }) 29399 }), hasWritingModeControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29400 className: "single-column", 29401 label: (0,external_wp_i18n_namespaceObject.__)('Orientation'), 29402 hasValue: hasWritingMode, 29403 onDeselect: resetWritingMode, 29404 isShownByDefault: defaultControls.writingMode, 29405 panelId: panelId, 29406 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WritingModeControl, { 29407 value: writingMode, 29408 onChange: setWritingMode, 29409 size: "__unstable-large", 29410 __nextHasNoMarginBottom: true 29411 }) 29412 }), hasTextTransformControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29413 label: (0,external_wp_i18n_namespaceObject.__)('Letter case'), 29414 hasValue: hasTextTransform, 29415 onDeselect: resetTextTransform, 29416 isShownByDefault: defaultControls.textTransform, 29417 panelId: panelId, 29418 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TextTransformControl, { 29419 value: textTransform, 29420 onChange: setTextTransform, 29421 showNone: true, 29422 isBlock: true, 29423 size: "__unstable-large", 29424 __nextHasNoMarginBottom: true 29425 }) 29426 }), hasTextAlignmentControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 29427 label: (0,external_wp_i18n_namespaceObject.__)('Text alignment'), 29428 hasValue: hasTextAlign, 29429 onDeselect: resetTextAlign, 29430 isShownByDefault: defaultControls.textAlign, 29431 panelId: panelId, 29432 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TextAlignmentControl, { 29433 value: textAlign, 29434 onChange: setTextAlign, 29435 size: "__unstable-large", 29436 __nextHasNoMarginBottom: true 29437 }) 29438 })] 29439 }); 29440 } 29441 29442 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/line-height.js 29443 /** 29444 * WordPress dependencies 29445 */ 29446 29447 29448 /** 29449 * Internal dependencies 29450 */ 29451 29452 29453 29454 29455 const LINE_HEIGHT_SUPPORT_KEY = 'typography.lineHeight'; 29456 29457 /** 29458 * Inspector control panel containing the line height related configuration 29459 * 29460 * @param {Object} props 29461 * 29462 * @return {Element} Line height edit element. 29463 */ 29464 function LineHeightEdit(props) { 29465 const { 29466 attributes: { 29467 style 29468 }, 29469 setAttributes 29470 } = props; 29471 const onChange = newLineHeightValue => { 29472 const newStyle = { 29473 ...style, 29474 typography: { 29475 ...style?.typography, 29476 lineHeight: newLineHeightValue 29477 } 29478 }; 29479 setAttributes({ 29480 style: cleanEmptyObject(newStyle) 29481 }); 29482 }; 29483 return /*#__PURE__*/_jsx(LineHeightControl, { 29484 __unstableInputWidth: "100%", 29485 value: style?.typography?.lineHeight, 29486 onChange: onChange, 29487 size: "__unstable-large" 29488 }); 29489 } 29490 29491 /** 29492 * Custom hook that checks if line-height settings have been disabled. 29493 * 29494 * @param {string} name The name of the block. 29495 * @return {boolean} Whether setting is disabled. 29496 */ 29497 function useIsLineHeightDisabled({ 29498 name: blockName 29499 } = {}) { 29500 const [isEnabled] = useSettings('typography.lineHeight'); 29501 return !isEnabled || !hasBlockSupport(blockName, LINE_HEIGHT_SUPPORT_KEY); 29502 } 29503 29504 ;// CONCATENATED MODULE: external ["wp","tokenList"] 29505 const external_wp_tokenList_namespaceObject = window["wp"]["tokenList"]; 29506 var external_wp_tokenList_default = /*#__PURE__*/__webpack_require__.n(external_wp_tokenList_namespaceObject); 29507 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/font-family.js 29508 /** 29509 * WordPress dependencies 29510 */ 29511 29512 29513 29514 29515 29516 /** 29517 * Internal dependencies 29518 */ 29519 29520 29521 29522 const FONT_FAMILY_SUPPORT_KEY = 'typography.__experimentalFontFamily'; 29523 const { 29524 kebabCase: font_family_kebabCase 29525 } = unlock(external_wp_components_namespaceObject.privateApis); 29526 29527 /** 29528 * Filters registered block settings, extending attributes to include 29529 * the `fontFamily` attribute. 29530 * 29531 * @param {Object} settings Original block settings 29532 * @return {Object} Filtered block settings 29533 */ 29534 function font_family_addAttributes(settings) { 29535 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, FONT_FAMILY_SUPPORT_KEY)) { 29536 return settings; 29537 } 29538 29539 // Allow blocks to specify a default value if needed. 29540 if (!settings.attributes.fontFamily) { 29541 Object.assign(settings.attributes, { 29542 fontFamily: { 29543 type: 'string' 29544 } 29545 }); 29546 } 29547 return settings; 29548 } 29549 29550 /** 29551 * Override props assigned to save component to inject font family. 29552 * 29553 * @param {Object} props Additional props applied to save element 29554 * @param {Object} blockType Block type 29555 * @param {Object} attributes Block attributes 29556 * @return {Object} Filtered props applied to save element 29557 */ 29558 function font_family_addSaveProps(props, blockType, attributes) { 29559 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, FONT_FAMILY_SUPPORT_KEY)) { 29560 return props; 29561 } 29562 if (shouldSkipSerialization(blockType, TYPOGRAPHY_SUPPORT_KEY, 'fontFamily')) { 29563 return props; 29564 } 29565 if (!attributes?.fontFamily) { 29566 return props; 29567 } 29568 29569 // Use TokenList to dedupe classes. 29570 const classes = new (external_wp_tokenList_default())(props.className); 29571 classes.add(`has-$font_family_kebabCase(attributes?.fontFamily)}-font-family`); 29572 const newClassName = classes.value; 29573 props.className = newClassName ? newClassName : undefined; 29574 return props; 29575 } 29576 function font_family_useBlockProps({ 29577 name, 29578 fontFamily 29579 }) { 29580 return font_family_addSaveProps({}, name, { 29581 fontFamily 29582 }); 29583 } 29584 /* harmony default export */ const font_family = ({ 29585 useBlockProps: font_family_useBlockProps, 29586 addSaveProps: font_family_addSaveProps, 29587 attributeKeys: ['fontFamily'], 29588 hasSupport(name) { 29589 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, FONT_FAMILY_SUPPORT_KEY); 29590 } 29591 }); 29592 29593 /** 29594 * Resets the font family block support attribute. This can be used when 29595 * disabling the font family support controls for a block via a progressive 29596 * discovery panel. 29597 * 29598 * @param {Object} props Block props. 29599 * @param {Object} props.setAttributes Function to set block's attributes. 29600 */ 29601 function resetFontFamily({ 29602 setAttributes 29603 }) { 29604 setAttributes({ 29605 fontFamily: undefined 29606 }); 29607 } 29608 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/fontFamily/addAttribute', font_family_addAttributes); 29609 29610 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/font-sizes/utils.js 29611 /** 29612 * WordPress dependencies 29613 */ 29614 29615 29616 /** 29617 * Internal dependencies 29618 */ 29619 29620 const { 29621 kebabCase: utils_kebabCase 29622 } = unlock(external_wp_components_namespaceObject.privateApis); 29623 29624 /** 29625 * Returns the font size object based on an array of named font sizes and the namedFontSize and customFontSize values. 29626 * If namedFontSize is undefined or not found in fontSizes an object with just the size value based on customFontSize is returned. 29627 * 29628 * @param {Array} fontSizes Array of font size objects containing at least the "name" and "size" values as properties. 29629 * @param {?string} fontSizeAttribute Content of the font size attribute (slug). 29630 * @param {?number} customFontSizeAttribute Contents of the custom font size attribute (value). 29631 * 29632 * @return {?Object} If fontSizeAttribute is set and an equal slug is found in fontSizes it returns the font size object for that slug. 29633 * Otherwise, an object with just the size value based on customFontSize is returned. 29634 */ 29635 const utils_getFontSize = (fontSizes, fontSizeAttribute, customFontSizeAttribute) => { 29636 if (fontSizeAttribute) { 29637 const fontSizeObject = fontSizes?.find(({ 29638 slug 29639 }) => slug === fontSizeAttribute); 29640 if (fontSizeObject) { 29641 return fontSizeObject; 29642 } 29643 } 29644 return { 29645 size: customFontSizeAttribute 29646 }; 29647 }; 29648 29649 /** 29650 * Returns the corresponding font size object for a given value. 29651 * 29652 * @param {Array} fontSizes Array of font size objects. 29653 * @param {number} value Font size value. 29654 * 29655 * @return {Object} Font size object. 29656 */ 29657 function utils_getFontSizeObjectByValue(fontSizes, value) { 29658 const fontSizeObject = fontSizes?.find(({ 29659 size 29660 }) => size === value); 29661 if (fontSizeObject) { 29662 return fontSizeObject; 29663 } 29664 return { 29665 size: value 29666 }; 29667 } 29668 29669 /** 29670 * Returns a class based on fontSizeName. 29671 * 29672 * @param {string} fontSizeSlug Slug of the fontSize. 29673 * 29674 * @return {string | undefined} String with the class corresponding to the fontSize passed. 29675 * The class is generated by appending 'has-' followed by fontSizeSlug in kebabCase and ending with '-font-size'. 29676 */ 29677 function getFontSizeClass(fontSizeSlug) { 29678 if (!fontSizeSlug) { 29679 return; 29680 } 29681 return `has-$utils_kebabCase(fontSizeSlug)}-font-size`; 29682 } 29683 29684 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/font-size.js 29685 /** 29686 * WordPress dependencies 29687 */ 29688 29689 29690 29691 29692 /** 29693 * Internal dependencies 29694 */ 29695 29696 29697 29698 29699 29700 29701 const FONT_SIZE_SUPPORT_KEY = 'typography.fontSize'; 29702 29703 /** 29704 * Filters registered block settings, extending attributes to include 29705 * `fontSize` and `fontWeight` attributes. 29706 * 29707 * @param {Object} settings Original block settings. 29708 * 29709 * @return {Object} Filtered block settings. 29710 */ 29711 function font_size_addAttributes(settings) { 29712 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, FONT_SIZE_SUPPORT_KEY)) { 29713 return settings; 29714 } 29715 29716 // Allow blocks to specify a default value if needed. 29717 if (!settings.attributes.fontSize) { 29718 Object.assign(settings.attributes, { 29719 fontSize: { 29720 type: 'string' 29721 } 29722 }); 29723 } 29724 return settings; 29725 } 29726 29727 /** 29728 * Override props assigned to save component to inject font size. 29729 * 29730 * @param {Object} props Additional props applied to save element. 29731 * @param {Object} blockNameOrType Block type. 29732 * @param {Object} attributes Block attributes. 29733 * 29734 * @return {Object} Filtered props applied to save element. 29735 */ 29736 function font_size_addSaveProps(props, blockNameOrType, attributes) { 29737 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockNameOrType, FONT_SIZE_SUPPORT_KEY)) { 29738 return props; 29739 } 29740 if (shouldSkipSerialization(blockNameOrType, TYPOGRAPHY_SUPPORT_KEY, 'fontSize')) { 29741 return props; 29742 } 29743 29744 // Use TokenList to dedupe classes. 29745 const classes = new (external_wp_tokenList_default())(props.className); 29746 classes.add(getFontSizeClass(attributes.fontSize)); 29747 const newClassName = classes.value; 29748 props.className = newClassName ? newClassName : undefined; 29749 return props; 29750 } 29751 29752 /** 29753 * Inspector control panel containing the font size related configuration 29754 * 29755 * @param {Object} props 29756 * 29757 * @return {Element} Font size edit element. 29758 */ 29759 function FontSizeEdit(props) { 29760 const { 29761 attributes: { 29762 fontSize, 29763 style 29764 }, 29765 setAttributes 29766 } = props; 29767 const [fontSizes] = useSettings('typography.fontSizes'); 29768 const onChange = value => { 29769 const fontSizeSlug = getFontSizeObjectByValue(fontSizes, value).slug; 29770 setAttributes({ 29771 style: cleanEmptyObject({ 29772 ...style, 29773 typography: { 29774 ...style?.typography, 29775 fontSize: fontSizeSlug ? undefined : value 29776 } 29777 }), 29778 fontSize: fontSizeSlug 29779 }); 29780 }; 29781 const fontSizeObject = getFontSize(fontSizes, fontSize, style?.typography?.fontSize); 29782 const fontSizeValue = fontSizeObject?.size || style?.typography?.fontSize || fontSize; 29783 return /*#__PURE__*/_jsx(FontSizePicker, { 29784 onChange: onChange, 29785 value: fontSizeValue, 29786 withReset: false, 29787 withSlider: true, 29788 size: "__unstable-large" 29789 }); 29790 } 29791 29792 /** 29793 * Custom hook that checks if font-size settings have been disabled. 29794 * 29795 * @param {string} name The name of the block. 29796 * @return {boolean} Whether setting is disabled. 29797 */ 29798 function useIsFontSizeDisabled({ 29799 name: blockName 29800 } = {}) { 29801 const [fontSizes] = useSettings('typography.fontSizes'); 29802 const hasFontSizes = !!fontSizes?.length; 29803 return !hasBlockSupport(blockName, FONT_SIZE_SUPPORT_KEY) || !hasFontSizes; 29804 } 29805 function font_size_useBlockProps({ 29806 name, 29807 fontSize, 29808 style 29809 }) { 29810 const [fontSizes, fluidTypographySettings, layoutSettings] = use_settings_useSettings('typography.fontSizes', 'typography.fluid', 'layout'); 29811 29812 /* 29813 * Only add inline styles if the block supports font sizes, 29814 * doesn't skip serialization of font sizes, 29815 * and has either a custom font size or a preset font size. 29816 */ 29817 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, FONT_SIZE_SUPPORT_KEY) || shouldSkipSerialization(name, TYPOGRAPHY_SUPPORT_KEY, 'fontSize') || !fontSize && !style?.typography?.fontSize) { 29818 return; 29819 } 29820 let props; 29821 if (style?.typography?.fontSize) { 29822 props = { 29823 style: { 29824 fontSize: getTypographyFontSizeValue({ 29825 size: style.typography.fontSize 29826 }, { 29827 typography: { 29828 fluid: fluidTypographySettings 29829 }, 29830 layout: layoutSettings 29831 }) 29832 } 29833 }; 29834 } 29835 if (fontSize) { 29836 props = { 29837 style: { 29838 fontSize: utils_getFontSize(fontSizes, fontSize, style?.typography?.fontSize).size 29839 } 29840 }; 29841 } 29842 if (!props) { 29843 return; 29844 } 29845 return font_size_addSaveProps(props, name, { 29846 fontSize 29847 }); 29848 } 29849 /* harmony default export */ const font_size = ({ 29850 useBlockProps: font_size_useBlockProps, 29851 addSaveProps: font_size_addSaveProps, 29852 attributeKeys: ['fontSize', 'style'], 29853 hasSupport(name) { 29854 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, FONT_SIZE_SUPPORT_KEY); 29855 } 29856 }); 29857 const font_size_MIGRATION_PATHS = { 29858 fontSize: [['fontSize'], ['style', 'typography', 'fontSize']] 29859 }; 29860 function font_size_addTransforms(result, source, index, results) { 29861 const destinationBlockType = result.name; 29862 const activeSupports = { 29863 fontSize: (0,external_wp_blocks_namespaceObject.hasBlockSupport)(destinationBlockType, FONT_SIZE_SUPPORT_KEY) 29864 }; 29865 return transformStyles(activeSupports, font_size_MIGRATION_PATHS, result, source, index, results); 29866 } 29867 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/font/addAttribute', font_size_addAttributes); 29868 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.switchToBlockType.transformedBlock', 'core/font-size/addTransforms', font_size_addTransforms); 29869 29870 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/alignment-control/ui.js 29871 /** 29872 * WordPress dependencies 29873 */ 29874 29875 29876 29877 29878 const DEFAULT_ALIGNMENT_CONTROLS = [{ 29879 icon: align_left, 29880 title: (0,external_wp_i18n_namespaceObject.__)('Align text left'), 29881 align: 'left' 29882 }, { 29883 icon: align_center, 29884 title: (0,external_wp_i18n_namespaceObject.__)('Align text center'), 29885 align: 'center' 29886 }, { 29887 icon: align_right, 29888 title: (0,external_wp_i18n_namespaceObject.__)('Align text right'), 29889 align: 'right' 29890 }]; 29891 const ui_POPOVER_PROPS = { 29892 placement: 'bottom-start' 29893 }; 29894 function AlignmentUI({ 29895 value, 29896 onChange, 29897 alignmentControls = DEFAULT_ALIGNMENT_CONTROLS, 29898 label = (0,external_wp_i18n_namespaceObject.__)('Align text'), 29899 description = (0,external_wp_i18n_namespaceObject.__)('Change text alignment'), 29900 isCollapsed = true, 29901 isToolbar 29902 }) { 29903 function applyOrUnset(align) { 29904 return () => onChange(value === align ? undefined : align); 29905 } 29906 const activeAlignment = alignmentControls.find(control => control.align === value); 29907 function setIcon() { 29908 if (activeAlignment) { 29909 return activeAlignment.icon; 29910 } 29911 return (0,external_wp_i18n_namespaceObject.isRTL)() ? align_right : align_left; 29912 } 29913 const UIComponent = isToolbar ? external_wp_components_namespaceObject.ToolbarGroup : external_wp_components_namespaceObject.ToolbarDropdownMenu; 29914 const extraProps = isToolbar ? { 29915 isCollapsed 29916 } : { 29917 toggleProps: { 29918 description 29919 }, 29920 popoverProps: ui_POPOVER_PROPS 29921 }; 29922 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(UIComponent, { 29923 icon: setIcon(), 29924 label: label, 29925 controls: alignmentControls.map(control => { 29926 const { 29927 align 29928 } = control; 29929 const isActive = value === align; 29930 return { 29931 ...control, 29932 isActive, 29933 role: isCollapsed ? 'menuitemradio' : undefined, 29934 onClick: applyOrUnset(align) 29935 }; 29936 }), 29937 ...extraProps 29938 }); 29939 } 29940 /* harmony default export */ const alignment_control_ui = (AlignmentUI); 29941 29942 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/alignment-control/index.js 29943 /** 29944 * Internal dependencies 29945 */ 29946 29947 29948 const AlignmentControl = props => { 29949 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(alignment_control_ui, { 29950 ...props, 29951 isToolbar: false 29952 }); 29953 }; 29954 const AlignmentToolbar = props => { 29955 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(alignment_control_ui, { 29956 ...props, 29957 isToolbar: true 29958 }); 29959 }; 29960 29961 /** 29962 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/alignment-control/README.md 29963 */ 29964 29965 29966 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/text-align.js 29967 /** 29968 * External dependencies 29969 */ 29970 29971 29972 /** 29973 * WordPress dependencies 29974 */ 29975 29976 29977 29978 29979 /** 29980 * Internal dependencies 29981 */ 29982 29983 29984 29985 29986 29987 const TEXT_ALIGN_SUPPORT_KEY = 'typography.textAlign'; 29988 const text_align_TEXT_ALIGNMENT_OPTIONS = [{ 29989 icon: align_left, 29990 title: (0,external_wp_i18n_namespaceObject.__)('Align text left'), 29991 align: 'left' 29992 }, { 29993 icon: align_center, 29994 title: (0,external_wp_i18n_namespaceObject.__)('Align text center'), 29995 align: 'center' 29996 }, { 29997 icon: align_right, 29998 title: (0,external_wp_i18n_namespaceObject.__)('Align text right'), 29999 align: 'right' 30000 }]; 30001 const VALID_TEXT_ALIGNMENTS = ['left', 'center', 'right']; 30002 const NO_TEXT_ALIGNMENTS = []; 30003 30004 /** 30005 * Returns the valid text alignments. 30006 * Takes into consideration the text aligns supported by a block. 30007 * Exported just for testing purposes, not exported outside the module. 30008 * 30009 * @param {?boolean|string[]} blockTextAlign Text aligns supported by the block. 30010 * 30011 * @return {string[]} Valid text alignments. 30012 */ 30013 function getValidTextAlignments(blockTextAlign) { 30014 if (Array.isArray(blockTextAlign)) { 30015 return VALID_TEXT_ALIGNMENTS.filter(textAlign => blockTextAlign.includes(textAlign)); 30016 } 30017 return blockTextAlign === true ? VALID_TEXT_ALIGNMENTS : NO_TEXT_ALIGNMENTS; 30018 } 30019 function BlockEditTextAlignmentToolbarControlsPure({ 30020 style, 30021 name: blockName, 30022 setAttributes 30023 }) { 30024 const settings = useBlockSettings(blockName); 30025 const hasTextAlignControl = settings?.typography?.textAlign; 30026 const blockEditingMode = useBlockEditingMode(); 30027 if (!hasTextAlignControl || blockEditingMode !== 'default') { 30028 return null; 30029 } 30030 const validTextAlignments = getValidTextAlignments((0,external_wp_blocks_namespaceObject.getBlockSupport)(blockName, TEXT_ALIGN_SUPPORT_KEY)); 30031 if (!validTextAlignments.length) { 30032 return null; 30033 } 30034 const textAlignmentControls = text_align_TEXT_ALIGNMENT_OPTIONS.filter(control => validTextAlignments.includes(control.align)); 30035 const onChange = newTextAlignValue => { 30036 const newStyle = { 30037 ...style, 30038 typography: { 30039 ...style?.typography, 30040 textAlign: newTextAlignValue 30041 } 30042 }; 30043 setAttributes({ 30044 style: utils_cleanEmptyObject(newStyle) 30045 }); 30046 }; 30047 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls, { 30048 group: "block", 30049 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AlignmentControl, { 30050 value: style?.typography?.textAlign, 30051 onChange: onChange, 30052 alignmentControls: textAlignmentControls 30053 }) 30054 }); 30055 } 30056 /* harmony default export */ const text_align = ({ 30057 edit: BlockEditTextAlignmentToolbarControlsPure, 30058 useBlockProps: text_align_useBlockProps, 30059 addSaveProps: addAssignedTextAlign, 30060 attributeKeys: ['style'], 30061 hasSupport(name) { 30062 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, TEXT_ALIGN_SUPPORT_KEY, false); 30063 } 30064 }); 30065 function text_align_useBlockProps({ 30066 name, 30067 style 30068 }) { 30069 if (!style?.typography?.textAlign) { 30070 return null; 30071 } 30072 const validTextAlignments = getValidTextAlignments((0,external_wp_blocks_namespaceObject.getBlockSupport)(name, TEXT_ALIGN_SUPPORT_KEY)); 30073 if (!validTextAlignments.length) { 30074 return null; 30075 } 30076 if (shouldSkipSerialization(name, TYPOGRAPHY_SUPPORT_KEY, 'textAlign')) { 30077 return null; 30078 } 30079 const textAlign = style.typography.textAlign; 30080 const className = dist_clsx({ 30081 [`has-text-align-$textAlign}`]: textAlign 30082 }); 30083 return { 30084 className 30085 }; 30086 } 30087 30088 /** 30089 * Override props assigned to save component to inject text alignment class 30090 * name if block supports it. 30091 * 30092 * @param {Object} props Additional props applied to save element. 30093 * @param {Object} blockType Block type. 30094 * @param {Object} attributes Block attributes. 30095 * 30096 * @return {Object} Filtered props applied to save element. 30097 */ 30098 function addAssignedTextAlign(props, blockType, attributes) { 30099 if (!attributes?.style?.typography?.textAlign) { 30100 return props; 30101 } 30102 const { 30103 textAlign 30104 } = attributes.style.typography; 30105 const blockTextAlign = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, TEXT_ALIGN_SUPPORT_KEY); 30106 const isTextAlignValid = getValidTextAlignments(blockTextAlign).includes(textAlign); 30107 if (isTextAlignValid && !shouldSkipSerialization(blockType, TYPOGRAPHY_SUPPORT_KEY, 'textAlign')) { 30108 props.className = dist_clsx(`has-text-align-$textAlign}`, props.className); 30109 } 30110 return props; 30111 } 30112 30113 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/typography.js 30114 /** 30115 * WordPress dependencies 30116 */ 30117 30118 30119 30120 30121 /** 30122 * Internal dependencies 30123 */ 30124 30125 30126 30127 30128 30129 30130 30131 30132 30133 function omit(object, keys) { 30134 return Object.fromEntries(Object.entries(object).filter(([key]) => !keys.includes(key))); 30135 } 30136 const LETTER_SPACING_SUPPORT_KEY = 'typography.__experimentalLetterSpacing'; 30137 const TEXT_TRANSFORM_SUPPORT_KEY = 'typography.__experimentalTextTransform'; 30138 const TEXT_DECORATION_SUPPORT_KEY = 'typography.__experimentalTextDecoration'; 30139 const TEXT_COLUMNS_SUPPORT_KEY = 'typography.textColumns'; 30140 const FONT_STYLE_SUPPORT_KEY = 'typography.__experimentalFontStyle'; 30141 const FONT_WEIGHT_SUPPORT_KEY = 'typography.__experimentalFontWeight'; 30142 const WRITING_MODE_SUPPORT_KEY = 'typography.__experimentalWritingMode'; 30143 const TYPOGRAPHY_SUPPORT_KEY = 'typography'; 30144 const TYPOGRAPHY_SUPPORT_KEYS = [LINE_HEIGHT_SUPPORT_KEY, FONT_SIZE_SUPPORT_KEY, FONT_STYLE_SUPPORT_KEY, FONT_WEIGHT_SUPPORT_KEY, FONT_FAMILY_SUPPORT_KEY, TEXT_ALIGN_SUPPORT_KEY, TEXT_COLUMNS_SUPPORT_KEY, TEXT_DECORATION_SUPPORT_KEY, WRITING_MODE_SUPPORT_KEY, TEXT_TRANSFORM_SUPPORT_KEY, LETTER_SPACING_SUPPORT_KEY]; 30145 function typography_styleToAttributes(style) { 30146 const updatedStyle = { 30147 ...omit(style, ['fontFamily']) 30148 }; 30149 const fontSizeValue = style?.typography?.fontSize; 30150 const fontFamilyValue = style?.typography?.fontFamily; 30151 const fontSizeSlug = fontSizeValue?.startsWith('var:preset|font-size|') ? fontSizeValue.substring('var:preset|font-size|'.length) : undefined; 30152 const fontFamilySlug = fontFamilyValue?.startsWith('var:preset|font-family|') ? fontFamilyValue.substring('var:preset|font-family|'.length) : undefined; 30153 updatedStyle.typography = { 30154 ...omit(updatedStyle.typography, ['fontFamily']), 30155 fontSize: fontSizeSlug ? undefined : fontSizeValue 30156 }; 30157 return { 30158 style: utils_cleanEmptyObject(updatedStyle), 30159 fontFamily: fontFamilySlug, 30160 fontSize: fontSizeSlug 30161 }; 30162 } 30163 function typography_attributesToStyle(attributes) { 30164 return { 30165 ...attributes.style, 30166 typography: { 30167 ...attributes.style?.typography, 30168 fontFamily: attributes.fontFamily ? 'var:preset|font-family|' + attributes.fontFamily : undefined, 30169 fontSize: attributes.fontSize ? 'var:preset|font-size|' + attributes.fontSize : attributes.style?.typography?.fontSize 30170 } 30171 }; 30172 } 30173 function TypographyInspectorControl({ 30174 children, 30175 resetAllFilter 30176 }) { 30177 const attributesResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(attributes => { 30178 const existingStyle = typography_attributesToStyle(attributes); 30179 const updatedStyle = resetAllFilter(existingStyle); 30180 return { 30181 ...attributes, 30182 ...typography_styleToAttributes(updatedStyle) 30183 }; 30184 }, [resetAllFilter]); 30185 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 30186 group: "typography", 30187 resetAllFilter: attributesResetAllFilter, 30188 children: children 30189 }); 30190 } 30191 function typography_TypographyPanel({ 30192 clientId, 30193 name, 30194 setAttributes, 30195 settings 30196 }) { 30197 function selector(select) { 30198 const { 30199 style, 30200 fontFamily, 30201 fontSize 30202 } = select(store).getBlockAttributes(clientId) || {}; 30203 return { 30204 style, 30205 fontFamily, 30206 fontSize 30207 }; 30208 } 30209 const { 30210 style, 30211 fontFamily, 30212 fontSize 30213 } = (0,external_wp_data_namespaceObject.useSelect)(selector, [clientId]); 30214 const isEnabled = useHasTypographyPanel(settings); 30215 const value = (0,external_wp_element_namespaceObject.useMemo)(() => typography_attributesToStyle({ 30216 style, 30217 fontFamily, 30218 fontSize 30219 }), [style, fontSize, fontFamily]); 30220 const onChange = newStyle => { 30221 setAttributes(typography_styleToAttributes(newStyle)); 30222 }; 30223 if (!isEnabled) { 30224 return null; 30225 } 30226 const defaultControls = (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, [TYPOGRAPHY_SUPPORT_KEY, '__experimentalDefaultControls']); 30227 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TypographyPanel, { 30228 as: TypographyInspectorControl, 30229 panelId: clientId, 30230 settings: settings, 30231 value: value, 30232 onChange: onChange, 30233 defaultControls: defaultControls 30234 }); 30235 } 30236 const hasTypographySupport = blockName => { 30237 return TYPOGRAPHY_SUPPORT_KEYS.some(key => hasBlockSupport(blockName, key)); 30238 }; 30239 30240 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/settings.js 30241 /** 30242 * WordPress dependencies 30243 */ 30244 30245 30246 30247 const settings_settings = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { 30248 xmlns: "http://www.w3.org/2000/svg", 30249 viewBox: "0 0 24 24", 30250 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 30251 d: "m19 7.5h-7.628c-.3089-.87389-1.1423-1.5-2.122-1.5-.97966 0-1.81309.62611-2.12197 1.5h-2.12803v1.5h2.12803c.30888.87389 1.14231 1.5 2.12197 1.5.9797 0 1.8131-.62611 2.122-1.5h7.628z" 30252 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 30253 d: "m19 15h-2.128c-.3089-.8739-1.1423-1.5-2.122-1.5s-1.8131.6261-2.122 1.5h-7.628v1.5h7.628c.3089.8739 1.1423 1.5 2.122 1.5s1.8131-.6261 2.122-1.5h2.128z" 30254 })] 30255 }); 30256 /* harmony default export */ const library_settings = (settings_settings); 30257 30258 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/spacing-sizes-control/input-controls/spacing-input-control.js 30259 /** 30260 * WordPress dependencies 30261 */ 30262 30263 30264 30265 30266 30267 30268 30269 /** 30270 * Internal dependencies 30271 */ 30272 30273 30274 30275 30276 30277 30278 const CUSTOM_VALUE_SETTINGS = { 30279 px: { 30280 max: 300, 30281 steps: 1 30282 }, 30283 '%': { 30284 max: 100, 30285 steps: 1 30286 }, 30287 vw: { 30288 max: 100, 30289 steps: 1 30290 }, 30291 vh: { 30292 max: 100, 30293 steps: 1 30294 }, 30295 em: { 30296 max: 10, 30297 steps: 0.1 30298 }, 30299 rm: { 30300 max: 10, 30301 steps: 0.1 30302 }, 30303 svw: { 30304 max: 100, 30305 steps: 1 30306 }, 30307 lvw: { 30308 max: 100, 30309 steps: 1 30310 }, 30311 dvw: { 30312 max: 100, 30313 steps: 1 30314 }, 30315 svh: { 30316 max: 100, 30317 steps: 1 30318 }, 30319 lvh: { 30320 max: 100, 30321 steps: 1 30322 }, 30323 dvh: { 30324 max: 100, 30325 steps: 1 30326 }, 30327 vi: { 30328 max: 100, 30329 steps: 1 30330 }, 30331 svi: { 30332 max: 100, 30333 steps: 1 30334 }, 30335 lvi: { 30336 max: 100, 30337 steps: 1 30338 }, 30339 dvi: { 30340 max: 100, 30341 steps: 1 30342 }, 30343 vb: { 30344 max: 100, 30345 steps: 1 30346 }, 30347 svb: { 30348 max: 100, 30349 steps: 1 30350 }, 30351 lvb: { 30352 max: 100, 30353 steps: 1 30354 }, 30355 dvb: { 30356 max: 100, 30357 steps: 1 30358 }, 30359 vmin: { 30360 max: 100, 30361 steps: 1 30362 }, 30363 svmin: { 30364 max: 100, 30365 steps: 1 30366 }, 30367 lvmin: { 30368 max: 100, 30369 steps: 1 30370 }, 30371 dvmin: { 30372 max: 100, 30373 steps: 1 30374 }, 30375 vmax: { 30376 max: 100, 30377 steps: 1 30378 }, 30379 svmax: { 30380 max: 100, 30381 steps: 1 30382 }, 30383 lvmax: { 30384 max: 100, 30385 steps: 1 30386 }, 30387 dvmax: { 30388 max: 100, 30389 steps: 1 30390 } 30391 }; 30392 function SpacingInputControl({ 30393 icon, 30394 isMixed = false, 30395 minimumCustomValue, 30396 onChange, 30397 onMouseOut, 30398 onMouseOver, 30399 showSideInLabel = true, 30400 side, 30401 spacingSizes, 30402 type, 30403 value 30404 }) { 30405 var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2; 30406 // Treat value as a preset value if the passed in value matches the value of one of the spacingSizes. 30407 value = getPresetValueFromCustomValue(value, spacingSizes); 30408 let selectListSizes = spacingSizes; 30409 const showRangeControl = spacingSizes.length <= RANGE_CONTROL_MAX_SIZE; 30410 const disableCustomSpacingSizes = (0,external_wp_data_namespaceObject.useSelect)(select => { 30411 const editorSettings = select(store).getSettings(); 30412 return editorSettings?.disableCustomSpacingSizes; 30413 }); 30414 const [showCustomValueControl, setShowCustomValueControl] = (0,external_wp_element_namespaceObject.useState)(!disableCustomSpacingSizes && value !== undefined && !isValueSpacingPreset(value)); 30415 const [minValue, setMinValue] = (0,external_wp_element_namespaceObject.useState)(minimumCustomValue); 30416 const previousValue = (0,external_wp_compose_namespaceObject.usePrevious)(value); 30417 if (!!value && previousValue !== value && !isValueSpacingPreset(value) && showCustomValueControl !== true) { 30418 setShowCustomValueControl(true); 30419 } 30420 const [availableUnits] = use_settings_useSettings('spacing.units'); 30421 const units = (0,external_wp_components_namespaceObject.__experimentalUseCustomUnits)({ 30422 availableUnits: availableUnits || ['px', 'em', 'rem'] 30423 }); 30424 let currentValue = null; 30425 const showCustomValueInSelectList = !showRangeControl && !showCustomValueControl && value !== undefined && (!isValueSpacingPreset(value) || isValueSpacingPreset(value) && isMixed); 30426 if (showCustomValueInSelectList) { 30427 selectListSizes = [...spacingSizes, { 30428 name: !isMixed ? 30429 // translators: %s: A custom measurement, e.g. a number followed by a unit like 12px. 30430 (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Custom (%s)'), value) : (0,external_wp_i18n_namespaceObject.__)('Mixed'), 30431 slug: 'custom', 30432 size: value 30433 }]; 30434 currentValue = selectListSizes.length - 1; 30435 } else if (!isMixed) { 30436 currentValue = !showCustomValueControl ? getSliderValueFromPreset(value, spacingSizes) : getCustomValueFromPreset(value, spacingSizes); 30437 } 30438 const selectedUnit = (0,external_wp_element_namespaceObject.useMemo)(() => (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(currentValue), [currentValue])[1] || units[0]?.value; 30439 const setInitialValue = () => { 30440 if (value === undefined) { 30441 onChange('0'); 30442 } 30443 }; 30444 const customTooltipContent = newValue => value === undefined ? undefined : spacingSizes[newValue]?.name; 30445 const customRangeValue = parseFloat(currentValue, 10); 30446 const getNewCustomValue = newSize => { 30447 const isNumeric = !isNaN(parseFloat(newSize)); 30448 const nextValue = isNumeric ? newSize : undefined; 30449 return nextValue; 30450 }; 30451 const getNewPresetValue = (newSize, controlType) => { 30452 const size = parseInt(newSize, 10); 30453 if (controlType === 'selectList') { 30454 if (size === 0) { 30455 return undefined; 30456 } 30457 if (size === 1) { 30458 return '0'; 30459 } 30460 } else if (size === 0) { 30461 return '0'; 30462 } 30463 return `var:preset|spacing|$spacingSizes[newSize]?.slug}`; 30464 }; 30465 const handleCustomValueSliderChange = next => { 30466 onChange([next, selectedUnit].join('')); 30467 }; 30468 const allPlaceholder = isMixed ? (0,external_wp_i18n_namespaceObject.__)('Mixed') : null; 30469 const options = selectListSizes.map((size, index) => ({ 30470 key: index, 30471 name: size.name 30472 })); 30473 const marks = spacingSizes.slice(1, spacingSizes.length - 1).map((_newValue, index) => ({ 30474 value: index + 1, 30475 label: undefined 30476 })); 30477 const sideLabel = ALL_SIDES.includes(side) && showSideInLabel ? LABELS[side] : ''; 30478 const typeLabel = showSideInLabel ? type?.toLowerCase() : type; 30479 const ariaLabel = (0,external_wp_i18n_namespaceObject.sprintf)( 30480 // translators: 1: The side of the block being modified (top, bottom, left etc.). 2. Type of spacing being modified (padding, margin, etc). 30481 (0,external_wp_i18n_namespaceObject._x)('%1$s %2$s', 'spacing'), sideLabel, typeLabel).trim(); 30482 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 30483 className: "spacing-sizes-control__wrapper", 30484 children: [icon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Icon, { 30485 className: "spacing-sizes-control__icon", 30486 icon: icon, 30487 size: 24 30488 }), showCustomValueControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 30489 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 30490 onMouseOver: onMouseOver, 30491 onMouseOut: onMouseOut, 30492 onFocus: onMouseOver, 30493 onBlur: onMouseOut, 30494 onChange: newSize => onChange(getNewCustomValue(newSize)), 30495 value: currentValue, 30496 units: units, 30497 min: minValue, 30498 placeholder: allPlaceholder, 30499 disableUnits: isMixed, 30500 label: ariaLabel, 30501 hideLabelFromVision: true, 30502 className: "spacing-sizes-control__custom-value-input", 30503 size: "__unstable-large", 30504 onDragStart: () => { 30505 if (value?.charAt(0) === '-') { 30506 setMinValue(0); 30507 } 30508 }, 30509 onDrag: () => { 30510 if (value?.charAt(0) === '-') { 30511 setMinValue(0); 30512 } 30513 }, 30514 onDragEnd: () => { 30515 setMinValue(minimumCustomValue); 30516 } 30517 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.RangeControl, { 30518 __next40pxDefaultSize: true, 30519 onMouseOver: onMouseOver, 30520 onMouseOut: onMouseOut, 30521 onFocus: onMouseOver, 30522 onBlur: onMouseOut, 30523 value: customRangeValue, 30524 min: 0, 30525 max: (_CUSTOM_VALUE_SETTING = CUSTOM_VALUE_SETTINGS[selectedUnit]?.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10, 30526 step: (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[selectedUnit]?.steps) !== null && _CUSTOM_VALUE_SETTING2 !== void 0 ? _CUSTOM_VALUE_SETTING2 : 0.1, 30527 withInputField: false, 30528 onChange: handleCustomValueSliderChange, 30529 className: "spacing-sizes-control__custom-value-range", 30530 __nextHasNoMarginBottom: true, 30531 label: ariaLabel, 30532 hideLabelFromVision: true 30533 })] 30534 }), showRangeControl && !showCustomValueControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.RangeControl, { 30535 __next40pxDefaultSize: true, 30536 onMouseOver: onMouseOver, 30537 onMouseOut: onMouseOut, 30538 className: "spacing-sizes-control__range-control", 30539 value: currentValue, 30540 onChange: newSize => onChange(getNewPresetValue(newSize)), 30541 onMouseDown: event => { 30542 // If mouse down is near start of range set initial value to 0, which 30543 // prevents the user have to drag right then left to get 0 setting. 30544 if (event?.nativeEvent?.offsetX < 35) { 30545 setInitialValue(); 30546 } 30547 }, 30548 withInputField: false, 30549 "aria-valuenow": currentValue, 30550 "aria-valuetext": spacingSizes[currentValue]?.name, 30551 renderTooltipContent: customTooltipContent, 30552 min: 0, 30553 max: spacingSizes.length - 1, 30554 marks: marks, 30555 label: ariaLabel, 30556 hideLabelFromVision: true, 30557 __nextHasNoMarginBottom: true, 30558 onFocus: onMouseOver, 30559 onBlur: onMouseOut 30560 }), !showRangeControl && !showCustomValueControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CustomSelectControl, { 30561 className: "spacing-sizes-control__custom-select-control", 30562 value: 30563 // passing empty string as a fallback to continue using the 30564 // component in controlled mode 30565 options.find(option => option.key === currentValue) || '', 30566 onChange: selection => { 30567 onChange(getNewPresetValue(selection.selectedItem.key, 'selectList')); 30568 }, 30569 options: options, 30570 label: ariaLabel, 30571 hideLabelFromVision: true, 30572 size: "__unstable-large", 30573 onMouseOver: onMouseOver, 30574 onMouseOut: onMouseOut, 30575 onFocus: onMouseOver, 30576 onBlur: onMouseOut 30577 }), !disableCustomSpacingSizes && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 30578 label: showCustomValueControl ? (0,external_wp_i18n_namespaceObject.__)('Use size preset') : (0,external_wp_i18n_namespaceObject.__)('Set custom size'), 30579 icon: library_settings, 30580 onClick: () => { 30581 setShowCustomValueControl(!showCustomValueControl); 30582 }, 30583 isPressed: showCustomValueControl, 30584 size: "small", 30585 className: "spacing-sizes-control__custom-toggle", 30586 iconSize: 24 30587 })] 30588 }); 30589 } 30590 30591 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/spacing-sizes-control/input-controls/axial.js 30592 /** 30593 * Internal dependencies 30594 */ 30595 30596 30597 30598 30599 const groupedSides = ['vertical', 'horizontal']; 30600 function AxialInputControls({ 30601 minimumCustomValue, 30602 onChange, 30603 onMouseOut, 30604 onMouseOver, 30605 sides, 30606 spacingSizes, 30607 type, 30608 values 30609 }) { 30610 const createHandleOnChange = side => next => { 30611 if (!onChange) { 30612 return; 30613 } 30614 30615 // Encode the existing value into the preset value if the passed in value matches the value of one of the spacingSizes. 30616 const nextValues = { 30617 ...Object.keys(values).reduce((acc, key) => { 30618 acc[key] = getPresetValueFromCustomValue(values[key], spacingSizes); 30619 return acc; 30620 }, {}) 30621 }; 30622 if (side === 'vertical') { 30623 nextValues.top = next; 30624 nextValues.bottom = next; 30625 } 30626 if (side === 'horizontal') { 30627 nextValues.left = next; 30628 nextValues.right = next; 30629 } 30630 onChange(nextValues); 30631 }; 30632 30633 // Filter sides if custom configuration provided, maintaining default order. 30634 const filteredSides = sides?.length ? groupedSides.filter(side => hasAxisSupport(sides, side)) : groupedSides; 30635 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 30636 children: filteredSides.map(side => { 30637 const axisValue = side === 'vertical' ? values.top : values.left; 30638 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpacingInputControl, { 30639 icon: ICONS[side], 30640 label: LABELS[side], 30641 minimumCustomValue: minimumCustomValue, 30642 onChange: createHandleOnChange(side), 30643 onMouseOut: onMouseOut, 30644 onMouseOver: onMouseOver, 30645 side: side, 30646 spacingSizes: spacingSizes, 30647 type: type, 30648 value: axisValue, 30649 withInputField: false 30650 }, `spacing-sizes-control-$side}`); 30651 }) 30652 }); 30653 } 30654 30655 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/spacing-sizes-control/input-controls/separated.js 30656 /** 30657 * Internal dependencies 30658 */ 30659 30660 30661 30662 30663 function SeparatedInputControls({ 30664 minimumCustomValue, 30665 onChange, 30666 onMouseOut, 30667 onMouseOver, 30668 sides, 30669 spacingSizes, 30670 type, 30671 values 30672 }) { 30673 // Filter sides if custom configuration provided, maintaining default order. 30674 const filteredSides = sides?.length ? ALL_SIDES.filter(side => sides.includes(side)) : ALL_SIDES; 30675 const createHandleOnChange = side => next => { 30676 // Encode the existing value into the preset value if the passed in value matches the value of one of the spacingSizes. 30677 const nextValues = { 30678 ...Object.keys(values).reduce((acc, key) => { 30679 acc[key] = getPresetValueFromCustomValue(values[key], spacingSizes); 30680 return acc; 30681 }, {}) 30682 }; 30683 nextValues[side] = next; 30684 onChange(nextValues); 30685 }; 30686 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 30687 children: filteredSides.map(side => { 30688 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpacingInputControl, { 30689 icon: ICONS[side], 30690 label: LABELS[side], 30691 minimumCustomValue: minimumCustomValue, 30692 onChange: createHandleOnChange(side), 30693 onMouseOut: onMouseOut, 30694 onMouseOver: onMouseOver, 30695 side: side, 30696 spacingSizes: spacingSizes, 30697 type: type, 30698 value: values[side], 30699 withInputField: false 30700 }, `spacing-sizes-control-$side}`); 30701 }) 30702 }); 30703 } 30704 30705 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/spacing-sizes-control/input-controls/single.js 30706 /** 30707 * Internal dependencies 30708 */ 30709 30710 30711 30712 function SingleInputControl({ 30713 minimumCustomValue, 30714 onChange, 30715 onMouseOut, 30716 onMouseOver, 30717 showSideInLabel, 30718 side, 30719 spacingSizes, 30720 type, 30721 values 30722 }) { 30723 const createHandleOnChange = currentSide => next => { 30724 // Encode the existing value into the preset value if the passed in value matches the value of one of the spacingSizes. 30725 const nextValues = { 30726 ...Object.keys(values).reduce((acc, key) => { 30727 acc[key] = getPresetValueFromCustomValue(values[key], spacingSizes); 30728 return acc; 30729 }, {}) 30730 }; 30731 nextValues[currentSide] = next; 30732 onChange(nextValues); 30733 }; 30734 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpacingInputControl, { 30735 label: LABELS[side], 30736 minimumCustomValue: minimumCustomValue, 30737 onChange: createHandleOnChange(side), 30738 onMouseOut: onMouseOut, 30739 onMouseOver: onMouseOver, 30740 showSideInLabel: showSideInLabel, 30741 side: side, 30742 spacingSizes: spacingSizes, 30743 type: type, 30744 value: values[side], 30745 withInputField: false 30746 }); 30747 } 30748 30749 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/spacing-sizes-control/linked-button.js 30750 /** 30751 * WordPress dependencies 30752 */ 30753 30754 30755 30756 30757 function linked_button_LinkedButton({ 30758 isLinked, 30759 ...props 30760 }) { 30761 const label = isLinked ? (0,external_wp_i18n_namespaceObject.__)('Unlink sides') : (0,external_wp_i18n_namespaceObject.__)('Link sides'); 30762 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tooltip, { 30763 text: label, 30764 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 30765 ...props, 30766 size: "small", 30767 icon: isLinked ? library_link : link_off, 30768 iconSize: 24, 30769 "aria-label": label 30770 }) 30771 }); 30772 } 30773 30774 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/spacing-sizes-control/hooks/use-spacing-sizes.js 30775 /** 30776 * WordPress dependencies 30777 */ 30778 30779 30780 30781 /** 30782 * Internal dependencies 30783 */ 30784 30785 30786 const use_spacing_sizes_EMPTY_ARRAY = []; 30787 const compare = new Intl.Collator('und', { 30788 numeric: true 30789 }).compare; 30790 function useSpacingSizes() { 30791 const [customSpacingSizes, themeSpacingSizes, defaultSpacingSizes, defaultSpacingSizesEnabled] = use_settings_useSettings('spacing.spacingSizes.custom', 'spacing.spacingSizes.theme', 'spacing.spacingSizes.default', 'spacing.defaultSpacingSizes'); 30792 const customSizes = customSpacingSizes !== null && customSpacingSizes !== void 0 ? customSpacingSizes : use_spacing_sizes_EMPTY_ARRAY; 30793 const themeSizes = themeSpacingSizes !== null && themeSpacingSizes !== void 0 ? themeSpacingSizes : use_spacing_sizes_EMPTY_ARRAY; 30794 const defaultSizes = defaultSpacingSizes && defaultSpacingSizesEnabled !== false ? defaultSpacingSizes : use_spacing_sizes_EMPTY_ARRAY; 30795 return (0,external_wp_element_namespaceObject.useMemo)(() => { 30796 const sizes = [{ 30797 name: (0,external_wp_i18n_namespaceObject.__)('None'), 30798 slug: '0', 30799 size: 0 30800 }, ...customSizes, ...themeSizes, ...defaultSizes]; 30801 30802 // Using numeric slugs opts-in to sorting by slug. 30803 if (sizes.every(({ 30804 slug 30805 }) => /^[0-9]/.test(slug))) { 30806 sizes.sort((a, b) => compare(a.slug, b.slug)); 30807 } 30808 return sizes.length > RANGE_CONTROL_MAX_SIZE ? [{ 30809 name: (0,external_wp_i18n_namespaceObject.__)('Default'), 30810 slug: 'default', 30811 size: undefined 30812 }, ...sizes] : sizes; 30813 }, [customSizes, themeSizes, defaultSizes]); 30814 } 30815 30816 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/spacing-sizes-control/index.js 30817 /** 30818 * WordPress dependencies 30819 */ 30820 30821 30822 30823 30824 /** 30825 * Internal dependencies 30826 */ 30827 30828 30829 30830 30831 30832 30833 30834 30835 function SpacingSizesControl({ 30836 inputProps, 30837 label: labelProp, 30838 minimumCustomValue = 0, 30839 onChange, 30840 onMouseOut, 30841 onMouseOver, 30842 showSideInLabel = true, 30843 sides = ALL_SIDES, 30844 useSelect, 30845 values 30846 }) { 30847 const spacingSizes = useSpacingSizes(); 30848 const inputValues = values || DEFAULT_VALUES; 30849 const hasOneSide = sides?.length === 1; 30850 const hasOnlyAxialSides = sides?.includes('horizontal') && sides?.includes('vertical') && sides?.length === 2; 30851 const [view, setView] = (0,external_wp_element_namespaceObject.useState)(getInitialView(inputValues, sides)); 30852 const toggleLinked = () => { 30853 setView(view === VIEWS.axial ? VIEWS.custom : VIEWS.axial); 30854 }; 30855 const handleOnChange = nextValue => { 30856 const newValues = { 30857 ...values, 30858 ...nextValue 30859 }; 30860 onChange(newValues); 30861 }; 30862 const inputControlProps = { 30863 ...inputProps, 30864 minimumCustomValue, 30865 onChange: handleOnChange, 30866 onMouseOut, 30867 onMouseOver, 30868 sides, 30869 spacingSizes, 30870 type: labelProp, 30871 useSelect, 30872 values: inputValues 30873 }; 30874 const renderControls = () => { 30875 if (view === VIEWS.axial) { 30876 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AxialInputControls, { 30877 ...inputControlProps 30878 }); 30879 } 30880 if (view === VIEWS.custom) { 30881 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SeparatedInputControls, { 30882 ...inputControlProps 30883 }); 30884 } 30885 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SingleInputControl, { 30886 side: view, 30887 ...inputControlProps, 30888 showSideInLabel: showSideInLabel 30889 }); 30890 }; 30891 const sideLabel = ALL_SIDES.includes(view) && showSideInLabel ? LABELS[view] : ''; 30892 const label = (0,external_wp_i18n_namespaceObject.sprintf)( 30893 // translators: 1: The side of the block being modified (top, bottom, left etc.). 2. Type of spacing being modified (padding, margin, etc). 30894 (0,external_wp_i18n_namespaceObject._x)('%1$s %2$s', 'spacing'), labelProp, sideLabel).trim(); 30895 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 30896 className: "spacing-sizes-control", 30897 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 30898 className: "spacing-sizes-control__header", 30899 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, { 30900 as: "legend", 30901 className: "spacing-sizes-control__label", 30902 children: label 30903 }), !hasOneSide && !hasOnlyAxialSides && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(linked_button_LinkedButton, { 30904 label: labelProp, 30905 onClick: toggleLinked, 30906 isLinked: view === VIEWS.axial 30907 })] 30908 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalVStack, { 30909 spacing: 0.5, 30910 children: renderControls() 30911 })] 30912 }); 30913 } 30914 30915 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/height-control/index.js 30916 /** 30917 * WordPress dependencies 30918 */ 30919 30920 30921 30922 30923 /** 30924 * Internal dependencies 30925 */ 30926 30927 30928 30929 const RANGE_CONTROL_CUSTOM_SETTINGS = { 30930 px: { 30931 max: 1000, 30932 step: 1 30933 }, 30934 '%': { 30935 max: 100, 30936 step: 1 30937 }, 30938 vw: { 30939 max: 100, 30940 step: 1 30941 }, 30942 vh: { 30943 max: 100, 30944 step: 1 30945 }, 30946 em: { 30947 max: 50, 30948 step: 0.1 30949 }, 30950 rem: { 30951 max: 50, 30952 step: 0.1 30953 }, 30954 svw: { 30955 max: 100, 30956 step: 1 30957 }, 30958 lvw: { 30959 max: 100, 30960 step: 1 30961 }, 30962 dvw: { 30963 max: 100, 30964 step: 1 30965 }, 30966 svh: { 30967 max: 100, 30968 step: 1 30969 }, 30970 lvh: { 30971 max: 100, 30972 step: 1 30973 }, 30974 dvh: { 30975 max: 100, 30976 step: 1 30977 }, 30978 vi: { 30979 max: 100, 30980 step: 1 30981 }, 30982 svi: { 30983 max: 100, 30984 step: 1 30985 }, 30986 lvi: { 30987 max: 100, 30988 step: 1 30989 }, 30990 dvi: { 30991 max: 100, 30992 step: 1 30993 }, 30994 vb: { 30995 max: 100, 30996 step: 1 30997 }, 30998 svb: { 30999 max: 100, 31000 step: 1 31001 }, 31002 lvb: { 31003 max: 100, 31004 step: 1 31005 }, 31006 dvb: { 31007 max: 100, 31008 step: 1 31009 }, 31010 vmin: { 31011 max: 100, 31012 step: 1 31013 }, 31014 svmin: { 31015 max: 100, 31016 step: 1 31017 }, 31018 lvmin: { 31019 max: 100, 31020 step: 1 31021 }, 31022 dvmin: { 31023 max: 100, 31024 step: 1 31025 }, 31026 vmax: { 31027 max: 100, 31028 step: 1 31029 }, 31030 svmax: { 31031 max: 100, 31032 step: 1 31033 }, 31034 lvmax: { 31035 max: 100, 31036 step: 1 31037 }, 31038 dvmax: { 31039 max: 100, 31040 step: 1 31041 } 31042 }; 31043 31044 /** 31045 * HeightControl renders a linked unit control and range control for adjusting the height of a block. 31046 * 31047 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/height-control/README.md 31048 * 31049 * @param {Object} props 31050 * @param {?string} props.label A label for the control. 31051 * @param {( value: string ) => void } props.onChange Called when the height changes. 31052 * @param {string} props.value The current height value. 31053 * 31054 * @return {Component} The component to be rendered. 31055 */ 31056 function HeightControl({ 31057 label = (0,external_wp_i18n_namespaceObject.__)('Height'), 31058 onChange, 31059 value 31060 }) { 31061 var _RANGE_CONTROL_CUSTOM, _RANGE_CONTROL_CUSTOM2; 31062 const customRangeValue = parseFloat(value); 31063 const [availableUnits] = use_settings_useSettings('spacing.units'); 31064 const units = (0,external_wp_components_namespaceObject.__experimentalUseCustomUnits)({ 31065 availableUnits: availableUnits || ['%', 'px', 'em', 'rem', 'vh', 'vw'] 31066 }); 31067 const selectedUnit = (0,external_wp_element_namespaceObject.useMemo)(() => (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(value), [value])[1] || units[0]?.value || 'px'; 31068 const handleSliderChange = next => { 31069 onChange([next, selectedUnit].join('')); 31070 }; 31071 const handleUnitChange = newUnit => { 31072 // Attempt to smooth over differences between currentUnit and newUnit. 31073 // This should slightly improve the experience of switching between unit types. 31074 const [currentValue, currentUnit] = (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(value); 31075 if (['em', 'rem'].includes(newUnit) && currentUnit === 'px') { 31076 // Convert pixel value to an approximate of the new unit, assuming a root size of 16px. 31077 onChange((currentValue / 16).toFixed(2) + newUnit); 31078 } else if (['em', 'rem'].includes(currentUnit) && newUnit === 'px') { 31079 // Convert to pixel value assuming a root size of 16px. 31080 onChange(Math.round(currentValue * 16) + newUnit); 31081 } else if (['%', 'vw', 'svw', 'lvw', 'dvw', 'vh', 'svh', 'lvh', 'dvh', 'vi', 'svi', 'lvi', 'dvi', 'vb', 'svb', 'lvb', 'dvb', 'vmin', 'svmin', 'lvmin', 'dvmin', 'vmax', 'svmax', 'lvmax', 'dvmax'].includes(newUnit) && currentValue > 100) { 31082 // When converting to `%` or viewport-relative units, cap the new value at 100. 31083 onChange(100 + newUnit); 31084 } 31085 }; 31086 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 31087 className: "block-editor-height-control", 31088 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, { 31089 as: "legend", 31090 children: label 31091 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 31092 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 31093 isBlock: true, 31094 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 31095 value: value, 31096 units: units, 31097 onChange: onChange, 31098 onUnitChange: handleUnitChange, 31099 min: 0, 31100 size: "__unstable-large", 31101 label: label, 31102 hideLabelFromVision: true 31103 }) 31104 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 31105 isBlock: true, 31106 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalSpacer, { 31107 marginX: 2, 31108 marginBottom: 0, 31109 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.RangeControl, { 31110 __next40pxDefaultSize: true, 31111 value: customRangeValue, 31112 min: 0, 31113 max: (_RANGE_CONTROL_CUSTOM = RANGE_CONTROL_CUSTOM_SETTINGS[selectedUnit]?.max) !== null && _RANGE_CONTROL_CUSTOM !== void 0 ? _RANGE_CONTROL_CUSTOM : 100, 31114 step: (_RANGE_CONTROL_CUSTOM2 = RANGE_CONTROL_CUSTOM_SETTINGS[selectedUnit]?.step) !== null && _RANGE_CONTROL_CUSTOM2 !== void 0 ? _RANGE_CONTROL_CUSTOM2 : 0.1, 31115 withInputField: false, 31116 onChange: handleSliderChange, 31117 __nextHasNoMarginBottom: true, 31118 label: label, 31119 hideLabelFromVision: true 31120 }) 31121 }) 31122 })] 31123 })] 31124 }); 31125 } 31126 31127 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/grid/use-get-number-of-blocks-before-cell.js 31128 /** 31129 * WordPress dependencies 31130 */ 31131 31132 31133 /** 31134 * Internal dependencies 31135 */ 31136 31137 function useGetNumberOfBlocksBeforeCell(gridClientId, numColumns) { 31138 const { 31139 getBlockOrder, 31140 getBlockAttributes 31141 } = (0,external_wp_data_namespaceObject.useSelect)(store); 31142 const getNumberOfBlocksBeforeCell = (column, row) => { 31143 const targetIndex = (row - 1) * numColumns + column - 1; 31144 let count = 0; 31145 for (const clientId of getBlockOrder(gridClientId)) { 31146 var _getBlockAttributes$s; 31147 const { 31148 columnStart, 31149 rowStart 31150 } = (_getBlockAttributes$s = getBlockAttributes(clientId).style?.layout) !== null && _getBlockAttributes$s !== void 0 ? _getBlockAttributes$s : {}; 31151 const cellIndex = (rowStart - 1) * numColumns + columnStart - 1; 31152 if (cellIndex < targetIndex) { 31153 count++; 31154 } 31155 } 31156 return count; 31157 }; 31158 return getNumberOfBlocksBeforeCell; 31159 } 31160 31161 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/child-layout-control/index.js 31162 /** 31163 * WordPress dependencies 31164 */ 31165 31166 31167 31168 31169 31170 /** 31171 * Internal dependencies 31172 */ 31173 31174 31175 31176 31177 31178 function helpText(selfStretch, parentLayout) { 31179 const { 31180 orientation = 'horizontal' 31181 } = parentLayout; 31182 if (selfStretch === 'fill') { 31183 return (0,external_wp_i18n_namespaceObject.__)('Stretch to fill available space.'); 31184 } 31185 if (selfStretch === 'fixed' && orientation === 'horizontal') { 31186 return (0,external_wp_i18n_namespaceObject.__)('Specify a fixed width.'); 31187 } else if (selfStretch === 'fixed') { 31188 return (0,external_wp_i18n_namespaceObject.__)('Specify a fixed height.'); 31189 } 31190 return (0,external_wp_i18n_namespaceObject.__)('Fit contents.'); 31191 } 31192 31193 /** 31194 * Form to edit the child layout value. 31195 * 31196 * @param {Object} props Props. 31197 * @param {Object} props.value The child layout value. 31198 * @param {Function} props.onChange Function to update the child layout value. 31199 * @param {Object} props.parentLayout The parent layout value. 31200 * 31201 * @param {boolean} props.isShownByDefault 31202 * @param {string} props.panelId 31203 * @return {Element} child layout edit element. 31204 */ 31205 function ChildLayoutControl({ 31206 value: childLayout = {}, 31207 onChange, 31208 parentLayout, 31209 isShownByDefault, 31210 panelId 31211 }) { 31212 const { 31213 type: parentType, 31214 default: { 31215 type: defaultParentType = 'default' 31216 } = {} 31217 } = parentLayout !== null && parentLayout !== void 0 ? parentLayout : {}; 31218 const parentLayoutType = parentType || defaultParentType; 31219 if (parentLayoutType === 'flex') { 31220 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexControls, { 31221 childLayout: childLayout, 31222 onChange: onChange, 31223 parentLayout: parentLayout, 31224 isShownByDefault: isShownByDefault, 31225 panelId: panelId 31226 }); 31227 } else if (parentLayoutType === 'grid') { 31228 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridControls, { 31229 childLayout: childLayout, 31230 onChange: onChange, 31231 parentLayout: parentLayout, 31232 isShownByDefault: isShownByDefault, 31233 panelId: panelId 31234 }); 31235 } 31236 return null; 31237 } 31238 function FlexControls({ 31239 childLayout, 31240 onChange, 31241 parentLayout, 31242 isShownByDefault, 31243 panelId 31244 }) { 31245 const { 31246 selfStretch, 31247 flexSize 31248 } = childLayout; 31249 const { 31250 orientation = 'horizontal' 31251 } = parentLayout !== null && parentLayout !== void 0 ? parentLayout : {}; 31252 const hasFlexValue = () => !!selfStretch; 31253 const flexResetLabel = orientation === 'horizontal' ? (0,external_wp_i18n_namespaceObject.__)('Width') : (0,external_wp_i18n_namespaceObject.__)('Height'); 31254 const resetFlex = () => { 31255 onChange({ 31256 selfStretch: undefined, 31257 flexSize: undefined 31258 }); 31259 }; 31260 (0,external_wp_element_namespaceObject.useEffect)(() => { 31261 if (selfStretch === 'fixed' && !flexSize) { 31262 onChange({ 31263 ...childLayout, 31264 selfStretch: 'fit' 31265 }); 31266 } 31267 }, []); 31268 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 31269 as: external_wp_components_namespaceObject.__experimentalToolsPanelItem, 31270 spacing: 2, 31271 hasValue: hasFlexValue, 31272 label: flexResetLabel, 31273 onDeselect: resetFlex, 31274 isShownByDefault: isShownByDefault, 31275 panelId: panelId, 31276 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 31277 __nextHasNoMarginBottom: true, 31278 size: "__unstable-large", 31279 label: childLayoutOrientation(parentLayout), 31280 value: selfStretch || 'fit', 31281 help: helpText(selfStretch, parentLayout), 31282 onChange: value => { 31283 const newFlexSize = value !== 'fixed' ? null : flexSize; 31284 onChange({ 31285 selfStretch: value, 31286 flexSize: newFlexSize 31287 }); 31288 }, 31289 isBlock: true, 31290 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 31291 value: "fit", 31292 label: (0,external_wp_i18n_namespaceObject._x)('Fit', 'Intrinsic block width in flex layout') 31293 }, "fit"), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 31294 value: "fill", 31295 label: (0,external_wp_i18n_namespaceObject._x)('Grow', 'Block with expanding width in flex layout') 31296 }, "fill"), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 31297 value: "fixed", 31298 label: (0,external_wp_i18n_namespaceObject._x)('Fixed', 'Block with fixed width in flex layout') 31299 }, "fixed")] 31300 }), selfStretch === 'fixed' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 31301 size: "__unstable-large", 31302 onChange: value => { 31303 onChange({ 31304 selfStretch, 31305 flexSize: value 31306 }); 31307 }, 31308 value: flexSize, 31309 label: flexResetLabel, 31310 hideLabelFromVision: true 31311 })] 31312 }); 31313 } 31314 function childLayoutOrientation(parentLayout) { 31315 const { 31316 orientation = 'horizontal' 31317 } = parentLayout; 31318 return orientation === 'horizontal' ? (0,external_wp_i18n_namespaceObject.__)('Width') : (0,external_wp_i18n_namespaceObject.__)('Height'); 31319 } 31320 function GridControls({ 31321 childLayout, 31322 onChange, 31323 parentLayout, 31324 isShownByDefault, 31325 panelId 31326 }) { 31327 const { 31328 columnStart, 31329 rowStart, 31330 columnSpan, 31331 rowSpan 31332 } = childLayout; 31333 const { 31334 columnCount = 3, 31335 rowCount 31336 } = parentLayout !== null && parentLayout !== void 0 ? parentLayout : {}; 31337 const rootClientId = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getBlockRootClientId(panelId)); 31338 const { 31339 moveBlocksToPosition, 31340 __unstableMarkNextChangeAsNotPersistent 31341 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 31342 const getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(rootClientId, columnCount); 31343 const hasStartValue = () => !!columnStart || !!rowStart; 31344 const hasSpanValue = () => !!columnSpan || !!rowSpan; 31345 const resetGridStarts = () => { 31346 onChange({ 31347 columnStart: undefined, 31348 rowStart: undefined 31349 }); 31350 }; 31351 const resetGridSpans = () => { 31352 onChange({ 31353 columnSpan: undefined, 31354 rowSpan: undefined 31355 }); 31356 }; 31357 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 31358 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 31359 as: external_wp_components_namespaceObject.__experimentalToolsPanelItem, 31360 hasValue: hasSpanValue, 31361 label: (0,external_wp_i18n_namespaceObject.__)('Grid span'), 31362 onDeselect: resetGridSpans, 31363 isShownByDefault: isShownByDefault, 31364 panelId: panelId, 31365 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControl, { 31366 size: "__unstable-large", 31367 label: (0,external_wp_i18n_namespaceObject.__)('Column span'), 31368 type: "number", 31369 onChange: value => { 31370 // Don't allow unsetting. 31371 const newColumnSpan = value === '' ? 1 : parseInt(value, 10); 31372 onChange({ 31373 columnStart, 31374 rowStart, 31375 rowSpan, 31376 columnSpan: newColumnSpan 31377 }); 31378 }, 31379 value: columnSpan !== null && columnSpan !== void 0 ? columnSpan : 1, 31380 min: 1 31381 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControl, { 31382 size: "__unstable-large", 31383 label: (0,external_wp_i18n_namespaceObject.__)('Row span'), 31384 type: "number", 31385 onChange: value => { 31386 // Don't allow unsetting. 31387 const newRowSpan = value === '' ? 1 : parseInt(value, 10); 31388 onChange({ 31389 columnStart, 31390 rowStart, 31391 columnSpan, 31392 rowSpan: newRowSpan 31393 }); 31394 }, 31395 value: rowSpan !== null && rowSpan !== void 0 ? rowSpan : 1, 31396 min: 1 31397 })] 31398 }), window.__experimentalEnableGridInteractivity && columnCount && 31399 /*#__PURE__*/ 31400 // Use Flex with an explicit width on the FlexItem instead of HStack to 31401 // work around an issue in webkit where inputs with a max attribute are 31402 // sized incorrectly. 31403 (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 31404 as: external_wp_components_namespaceObject.__experimentalToolsPanelItem, 31405 hasValue: hasStartValue, 31406 label: (0,external_wp_i18n_namespaceObject.__)('Grid placement'), 31407 onDeselect: resetGridStarts, 31408 isShownByDefault: false, 31409 panelId: panelId, 31410 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 31411 style: { 31412 width: '50%' 31413 }, 31414 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControl, { 31415 size: "__unstable-large", 31416 label: (0,external_wp_i18n_namespaceObject.__)('Column'), 31417 type: "number", 31418 onChange: value => { 31419 // Don't allow unsetting. 31420 const newColumnStart = value === '' ? 1 : parseInt(value, 10); 31421 onChange({ 31422 columnStart: newColumnStart, 31423 rowStart, 31424 columnSpan, 31425 rowSpan 31426 }); 31427 __unstableMarkNextChangeAsNotPersistent(); 31428 moveBlocksToPosition([panelId], rootClientId, rootClientId, getNumberOfBlocksBeforeCell(newColumnStart, rowStart)); 31429 }, 31430 value: columnStart !== null && columnStart !== void 0 ? columnStart : 1, 31431 min: 1, 31432 max: columnCount ? columnCount - (columnSpan !== null && columnSpan !== void 0 ? columnSpan : 1) + 1 : undefined 31433 }) 31434 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 31435 style: { 31436 width: '50%' 31437 }, 31438 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControl, { 31439 size: "__unstable-large", 31440 label: (0,external_wp_i18n_namespaceObject.__)('Row'), 31441 type: "number", 31442 onChange: value => { 31443 // Don't allow unsetting. 31444 const newRowStart = value === '' ? 1 : parseInt(value, 10); 31445 onChange({ 31446 columnStart, 31447 rowStart: newRowStart, 31448 columnSpan, 31449 rowSpan 31450 }); 31451 __unstableMarkNextChangeAsNotPersistent(); 31452 moveBlocksToPosition([panelId], rootClientId, rootClientId, getNumberOfBlocksBeforeCell(columnStart, newRowStart)); 31453 }, 31454 value: rowStart !== null && rowStart !== void 0 ? rowStart : 1, 31455 min: 1, 31456 max: rowCount ? rowCount - (rowSpan !== null && rowSpan !== void 0 ? rowSpan : 1) + 1 : undefined 31457 }) 31458 })] 31459 })] 31460 }); 31461 } 31462 31463 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/dimensions-tool/aspect-ratio-tool.js 31464 /** 31465 * WordPress dependencies 31466 */ 31467 31468 31469 /** 31470 * Internal dependencies 31471 */ 31472 31473 31474 /** 31475 * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps 31476 */ 31477 31478 /** 31479 * @callback AspectRatioToolPropsOnChange 31480 * @param {string} [value] New aspect ratio value. 31481 * @return {void} No return. 31482 */ 31483 31484 /** 31485 * @typedef {Object} AspectRatioToolProps 31486 * @property {string} [panelId] ID of the panel this tool is associated with. 31487 * @property {string} [value] Current aspect ratio value. 31488 * @property {AspectRatioToolPropsOnChange} [onChange] Callback to update the aspect ratio value. 31489 * @property {SelectControlProps[]} [options] Aspect ratio options. 31490 * @property {string} [defaultValue] Default aspect ratio value. 31491 * @property {boolean} [isShownByDefault] Whether the tool is shown by default. 31492 */ 31493 31494 function AspectRatioTool({ 31495 panelId, 31496 value, 31497 onChange = () => {}, 31498 options, 31499 defaultValue = 'auto', 31500 hasValue, 31501 isShownByDefault = true 31502 }) { 31503 // Match the CSS default so if the value is used directly in CSS it will look correct in the control. 31504 const displayValue = value !== null && value !== void 0 ? value : 'auto'; 31505 const [defaultRatios, themeRatios, showDefaultRatios] = use_settings_useSettings('dimensions.aspectRatios.default', 'dimensions.aspectRatios.theme', 'dimensions.defaultAspectRatios'); 31506 const themeOptions = themeRatios?.map(({ 31507 name, 31508 ratio 31509 }) => ({ 31510 label: name, 31511 value: ratio 31512 })); 31513 const defaultOptions = defaultRatios?.map(({ 31514 name, 31515 ratio 31516 }) => ({ 31517 label: name, 31518 value: ratio 31519 })); 31520 const aspectRatioOptions = [{ 31521 label: (0,external_wp_i18n_namespaceObject._x)('Original', 'Aspect ratio option for dimensions control'), 31522 value: 'auto' 31523 }, ...(showDefaultRatios ? defaultOptions : []), ...(themeOptions ? themeOptions : []), { 31524 label: (0,external_wp_i18n_namespaceObject._x)('Custom', 'Aspect ratio option for dimensions control'), 31525 value: 'custom', 31526 disabled: true, 31527 hidden: true 31528 }]; 31529 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 31530 hasValue: hasValue ? hasValue : () => displayValue !== defaultValue, 31531 label: (0,external_wp_i18n_namespaceObject.__)('Aspect ratio'), 31532 onDeselect: () => onChange(undefined), 31533 isShownByDefault: isShownByDefault, 31534 panelId: panelId, 31535 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SelectControl, { 31536 label: (0,external_wp_i18n_namespaceObject.__)('Aspect ratio'), 31537 value: displayValue, 31538 options: options !== null && options !== void 0 ? options : aspectRatioOptions, 31539 onChange: onChange, 31540 size: "__unstable-large", 31541 __nextHasNoMarginBottom: true 31542 }) 31543 }); 31544 } 31545 31546 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/dimensions-panel.js 31547 /** 31548 * External dependencies 31549 */ 31550 31551 31552 /** 31553 * WordPress dependencies 31554 */ 31555 31556 31557 31558 31559 31560 /** 31561 * Internal dependencies 31562 */ 31563 31564 31565 31566 31567 31568 31569 31570 31571 31572 const AXIAL_SIDES = ['horizontal', 'vertical']; 31573 function useHasDimensionsPanel(settings) { 31574 const hasContentSize = useHasContentSize(settings); 31575 const hasWideSize = useHasWideSize(settings); 31576 const hasPadding = useHasPadding(settings); 31577 const hasMargin = useHasMargin(settings); 31578 const hasGap = useHasGap(settings); 31579 const hasMinHeight = useHasMinHeight(settings); 31580 const hasAspectRatio = useHasAspectRatio(settings); 31581 const hasChildLayout = useHasChildLayout(settings); 31582 return external_wp_element_namespaceObject.Platform.OS === 'web' && (hasContentSize || hasWideSize || hasPadding || hasMargin || hasGap || hasMinHeight || hasAspectRatio || hasChildLayout); 31583 } 31584 function useHasContentSize(settings) { 31585 return settings?.layout?.contentSize; 31586 } 31587 function useHasWideSize(settings) { 31588 return settings?.layout?.wideSize; 31589 } 31590 function useHasPadding(settings) { 31591 return settings?.spacing?.padding; 31592 } 31593 function useHasMargin(settings) { 31594 return settings?.spacing?.margin; 31595 } 31596 function useHasGap(settings) { 31597 return settings?.spacing?.blockGap; 31598 } 31599 function useHasMinHeight(settings) { 31600 return settings?.dimensions?.minHeight; 31601 } 31602 function useHasAspectRatio(settings) { 31603 return settings?.dimensions?.aspectRatio; 31604 } 31605 function useHasChildLayout(settings) { 31606 var _settings$parentLayou; 31607 const { 31608 type: parentLayoutType = 'default', 31609 default: { 31610 type: defaultParentLayoutType = 'default' 31611 } = {}, 31612 allowSizingOnChildren = false 31613 } = (_settings$parentLayou = settings?.parentLayout) !== null && _settings$parentLayou !== void 0 ? _settings$parentLayou : {}; 31614 const support = (defaultParentLayoutType === 'flex' || parentLayoutType === 'flex' || defaultParentLayoutType === 'grid' || parentLayoutType === 'grid') && allowSizingOnChildren; 31615 return !!settings?.layout && support; 31616 } 31617 function useHasSpacingPresets(settings) { 31618 const { 31619 defaultSpacingSizes, 31620 spacingSizes 31621 } = settings?.spacing || {}; 31622 return defaultSpacingSizes !== false && spacingSizes?.default?.length > 0 || spacingSizes?.theme?.length > 0 || spacingSizes?.custom?.length > 0; 31623 } 31624 function filterValuesBySides(values, sides) { 31625 // If no custom side configuration, all sides are opted into by default. 31626 // Without any values, we have nothing to filter either. 31627 if (!sides || !values) { 31628 return values; 31629 } 31630 31631 // Only include sides opted into within filtered values. 31632 const filteredValues = {}; 31633 sides.forEach(side => { 31634 if (side === 'vertical') { 31635 filteredValues.top = values.top; 31636 filteredValues.bottom = values.bottom; 31637 } 31638 if (side === 'horizontal') { 31639 filteredValues.left = values.left; 31640 filteredValues.right = values.right; 31641 } 31642 filteredValues[side] = values?.[side]; 31643 }); 31644 return filteredValues; 31645 } 31646 function splitStyleValue(value) { 31647 // Check for shorthand value (a string value). 31648 if (value && typeof value === 'string') { 31649 // Convert to value for individual sides for BoxControl. 31650 return { 31651 top: value, 31652 right: value, 31653 bottom: value, 31654 left: value 31655 }; 31656 } 31657 return value; 31658 } 31659 function splitGapValue(value) { 31660 // Check for shorthand value (a string value). 31661 if (value && typeof value === 'string') { 31662 // If the value is a string, treat it as a single side (top) for the spacing controls. 31663 return { 31664 top: value 31665 }; 31666 } 31667 if (value) { 31668 return { 31669 ...value, 31670 right: value?.left, 31671 bottom: value?.top 31672 }; 31673 } 31674 return value; 31675 } 31676 function DimensionsToolsPanel({ 31677 resetAllFilter, 31678 onChange, 31679 value, 31680 panelId, 31681 children 31682 }) { 31683 const dropdownMenuProps = useToolsPanelDropdownMenuProps(); 31684 const resetAll = () => { 31685 const updatedValue = resetAllFilter(value); 31686 onChange(updatedValue); 31687 }; 31688 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 31689 label: (0,external_wp_i18n_namespaceObject.__)('Dimensions'), 31690 resetAll: resetAll, 31691 panelId: panelId, 31692 dropdownMenuProps: dropdownMenuProps, 31693 children: children 31694 }); 31695 } 31696 const dimensions_panel_DEFAULT_CONTROLS = { 31697 contentSize: true, 31698 wideSize: true, 31699 padding: true, 31700 margin: true, 31701 blockGap: true, 31702 minHeight: true, 31703 aspectRatio: true, 31704 childLayout: true 31705 }; 31706 function DimensionsPanel({ 31707 as: Wrapper = DimensionsToolsPanel, 31708 value, 31709 onChange, 31710 inheritedValue = value, 31711 settings, 31712 panelId, 31713 defaultControls = dimensions_panel_DEFAULT_CONTROLS, 31714 onVisualize = () => {}, 31715 // Special case because the layout controls are not part of the dimensions panel 31716 // in global styles but not in block inspector. 31717 includeLayoutControls = false 31718 }) { 31719 var _defaultControls$cont, _defaultControls$wide, _defaultControls$padd, _defaultControls$marg, _defaultControls$bloc, _defaultControls$chil, _defaultControls$minH, _defaultControls$aspe; 31720 const { 31721 dimensions, 31722 spacing 31723 } = settings; 31724 const decodeValue = rawValue => { 31725 if (rawValue && typeof rawValue === 'object') { 31726 return Object.keys(rawValue).reduce((acc, key) => { 31727 acc[key] = getValueFromVariable({ 31728 settings: { 31729 dimensions, 31730 spacing 31731 } 31732 }, '', rawValue[key]); 31733 return acc; 31734 }, {}); 31735 } 31736 return getValueFromVariable({ 31737 settings: { 31738 dimensions, 31739 spacing 31740 } 31741 }, '', rawValue); 31742 }; 31743 const showSpacingPresetsControl = useHasSpacingPresets(settings); 31744 const units = (0,external_wp_components_namespaceObject.__experimentalUseCustomUnits)({ 31745 availableUnits: settings?.spacing?.units || ['%', 'px', 'em', 'rem', 'vw'] 31746 }); 31747 31748 //Minimum Margin Value 31749 const minimumMargin = -Infinity; 31750 const [minMarginValue, setMinMarginValue] = (0,external_wp_element_namespaceObject.useState)(minimumMargin); 31751 31752 // Content Width 31753 const showContentSizeControl = useHasContentSize(settings) && includeLayoutControls; 31754 const contentSizeValue = decodeValue(inheritedValue?.layout?.contentSize); 31755 const setContentSizeValue = newValue => { 31756 onChange(setImmutably(value, ['layout', 'contentSize'], newValue || undefined)); 31757 }; 31758 const hasUserSetContentSizeValue = () => !!value?.layout?.contentSize; 31759 const resetContentSizeValue = () => setContentSizeValue(undefined); 31760 31761 // Wide Width 31762 const showWideSizeControl = useHasWideSize(settings) && includeLayoutControls; 31763 const wideSizeValue = decodeValue(inheritedValue?.layout?.wideSize); 31764 const setWideSizeValue = newValue => { 31765 onChange(setImmutably(value, ['layout', 'wideSize'], newValue || undefined)); 31766 }; 31767 const hasUserSetWideSizeValue = () => !!value?.layout?.wideSize; 31768 const resetWideSizeValue = () => setWideSizeValue(undefined); 31769 31770 // Padding 31771 const showPaddingControl = useHasPadding(settings); 31772 const rawPadding = decodeValue(inheritedValue?.spacing?.padding); 31773 const paddingValues = splitStyleValue(rawPadding); 31774 const paddingSides = Array.isArray(settings?.spacing?.padding) ? settings?.spacing?.padding : settings?.spacing?.padding?.sides; 31775 const isAxialPadding = paddingSides && paddingSides.some(side => AXIAL_SIDES.includes(side)); 31776 const setPaddingValues = newPaddingValues => { 31777 const padding = filterValuesBySides(newPaddingValues, paddingSides); 31778 onChange(setImmutably(value, ['spacing', 'padding'], padding)); 31779 }; 31780 const hasPaddingValue = () => !!value?.spacing?.padding && Object.keys(value?.spacing?.padding).length; 31781 const resetPaddingValue = () => setPaddingValues(undefined); 31782 const onMouseOverPadding = () => onVisualize('padding'); 31783 31784 // Margin 31785 const showMarginControl = useHasMargin(settings); 31786 const rawMargin = decodeValue(inheritedValue?.spacing?.margin); 31787 const marginValues = splitStyleValue(rawMargin); 31788 const marginSides = Array.isArray(settings?.spacing?.margin) ? settings?.spacing?.margin : settings?.spacing?.margin?.sides; 31789 const isAxialMargin = marginSides && marginSides.some(side => AXIAL_SIDES.includes(side)); 31790 const setMarginValues = newMarginValues => { 31791 const margin = filterValuesBySides(newMarginValues, marginSides); 31792 onChange(setImmutably(value, ['spacing', 'margin'], margin)); 31793 }; 31794 const hasMarginValue = () => !!value?.spacing?.margin && Object.keys(value?.spacing?.margin).length; 31795 const resetMarginValue = () => setMarginValues(undefined); 31796 const onMouseOverMargin = () => onVisualize('margin'); 31797 31798 // Block Gap 31799 const showGapControl = useHasGap(settings); 31800 const gapValue = decodeValue(inheritedValue?.spacing?.blockGap); 31801 const gapValues = splitGapValue(gapValue); 31802 const gapSides = Array.isArray(settings?.spacing?.blockGap) ? settings?.spacing?.blockGap : settings?.spacing?.blockGap?.sides; 31803 const isAxialGap = gapSides && gapSides.some(side => AXIAL_SIDES.includes(side)); 31804 const setGapValue = newGapValue => { 31805 onChange(setImmutably(value, ['spacing', 'blockGap'], newGapValue)); 31806 }; 31807 const setGapValues = nextBoxGapValue => { 31808 if (!nextBoxGapValue) { 31809 setGapValue(null); 31810 } 31811 // If axial gap is not enabled, treat the 'top' value as the shorthand gap value. 31812 if (!isAxialGap && nextBoxGapValue?.hasOwnProperty('top')) { 31813 setGapValue(nextBoxGapValue.top); 31814 } else { 31815 setGapValue({ 31816 top: nextBoxGapValue?.top, 31817 left: nextBoxGapValue?.left 31818 }); 31819 } 31820 }; 31821 const resetGapValue = () => setGapValue(undefined); 31822 const hasGapValue = () => !!value?.spacing?.blockGap; 31823 31824 // Min Height 31825 const showMinHeightControl = useHasMinHeight(settings); 31826 const minHeightValue = decodeValue(inheritedValue?.dimensions?.minHeight); 31827 const setMinHeightValue = newValue => { 31828 const tempValue = setImmutably(value, ['dimensions', 'minHeight'], newValue); 31829 // Apply min-height, while removing any applied aspect ratio. 31830 onChange(setImmutably(tempValue, ['dimensions', 'aspectRatio'], undefined)); 31831 }; 31832 const resetMinHeightValue = () => { 31833 setMinHeightValue(undefined); 31834 }; 31835 const hasMinHeightValue = () => !!value?.dimensions?.minHeight; 31836 31837 // Aspect Ratio 31838 const showAspectRatioControl = useHasAspectRatio(settings); 31839 const aspectRatioValue = decodeValue(inheritedValue?.dimensions?.aspectRatio); 31840 const setAspectRatioValue = newValue => { 31841 const tempValue = setImmutably(value, ['dimensions', 'aspectRatio'], newValue); 31842 // Apply aspect-ratio, while removing any applied min-height. 31843 onChange(setImmutably(tempValue, ['dimensions', 'minHeight'], undefined)); 31844 }; 31845 const hasAspectRatioValue = () => !!value?.dimensions?.aspectRatio; 31846 31847 // Child Layout 31848 const showChildLayoutControl = useHasChildLayout(settings); 31849 const childLayout = inheritedValue?.layout; 31850 const setChildLayout = newChildLayout => { 31851 onChange({ 31852 ...value, 31853 layout: { 31854 ...newChildLayout 31855 } 31856 }); 31857 }; 31858 const resetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(previousValue => { 31859 return { 31860 ...previousValue, 31861 layout: utils_cleanEmptyObject({ 31862 ...previousValue?.layout, 31863 contentSize: undefined, 31864 wideSize: undefined, 31865 selfStretch: undefined, 31866 flexSize: undefined, 31867 columnStart: undefined, 31868 rowStart: undefined, 31869 columnSpan: undefined, 31870 rowSpan: undefined 31871 }), 31872 spacing: { 31873 ...previousValue?.spacing, 31874 padding: undefined, 31875 margin: undefined, 31876 blockGap: undefined 31877 }, 31878 dimensions: { 31879 ...previousValue?.dimensions, 31880 minHeight: undefined, 31881 aspectRatio: undefined 31882 } 31883 }; 31884 }, []); 31885 const onMouseLeaveControls = () => onVisualize(false); 31886 const inputProps = { 31887 min: minMarginValue, 31888 onDragStart: () => { 31889 //Reset to 0 in case the value was negative. 31890 setMinMarginValue(0); 31891 }, 31892 onDragEnd: () => { 31893 setMinMarginValue(minimumMargin); 31894 } 31895 }; 31896 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Wrapper, { 31897 resetAllFilter: resetAllFilter, 31898 value: value, 31899 onChange: onChange, 31900 panelId: panelId, 31901 children: [(showContentSizeControl || showWideSizeControl) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 31902 className: "span-columns", 31903 children: (0,external_wp_i18n_namespaceObject.__)('Set the width of the main content area.') 31904 }), showContentSizeControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 31905 label: (0,external_wp_i18n_namespaceObject.__)('Content width'), 31906 hasValue: hasUserSetContentSizeValue, 31907 onDeselect: resetContentSizeValue, 31908 isShownByDefault: (_defaultControls$cont = defaultControls.contentSize) !== null && _defaultControls$cont !== void 0 ? _defaultControls$cont : dimensions_panel_DEFAULT_CONTROLS.contentSize, 31909 panelId: panelId, 31910 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 31911 __next40pxDefaultSize: true, 31912 label: (0,external_wp_i18n_namespaceObject.__)('Content width'), 31913 labelPosition: "top", 31914 value: contentSizeValue || '', 31915 onChange: nextContentSize => { 31916 setContentSizeValue(nextContentSize); 31917 }, 31918 units: units, 31919 prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControlPrefixWrapper, { 31920 variant: "icon", 31921 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 31922 icon: align_none 31923 }) 31924 }) 31925 }) 31926 }), showWideSizeControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 31927 label: (0,external_wp_i18n_namespaceObject.__)('Wide width'), 31928 hasValue: hasUserSetWideSizeValue, 31929 onDeselect: resetWideSizeValue, 31930 isShownByDefault: (_defaultControls$wide = defaultControls.wideSize) !== null && _defaultControls$wide !== void 0 ? _defaultControls$wide : dimensions_panel_DEFAULT_CONTROLS.wideSize, 31931 panelId: panelId, 31932 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 31933 __next40pxDefaultSize: true, 31934 label: (0,external_wp_i18n_namespaceObject.__)('Wide width'), 31935 labelPosition: "top", 31936 value: wideSizeValue || '', 31937 onChange: nextWideSize => { 31938 setWideSizeValue(nextWideSize); 31939 }, 31940 units: units, 31941 prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControlPrefixWrapper, { 31942 variant: "icon", 31943 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 31944 icon: stretch_wide 31945 }) 31946 }) 31947 }) 31948 }), showPaddingControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 31949 hasValue: hasPaddingValue, 31950 label: (0,external_wp_i18n_namespaceObject.__)('Padding'), 31951 onDeselect: resetPaddingValue, 31952 isShownByDefault: (_defaultControls$padd = defaultControls.padding) !== null && _defaultControls$padd !== void 0 ? _defaultControls$padd : dimensions_panel_DEFAULT_CONTROLS.padding, 31953 className: dist_clsx({ 31954 'tools-panel-item-spacing': showSpacingPresetsControl 31955 }), 31956 panelId: panelId, 31957 children: [!showSpacingPresetsControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalBoxControl, { 31958 __next40pxDefaultSize: true, 31959 values: paddingValues, 31960 onChange: setPaddingValues, 31961 label: (0,external_wp_i18n_namespaceObject.__)('Padding'), 31962 sides: paddingSides, 31963 units: units, 31964 allowReset: false, 31965 splitOnAxis: isAxialPadding, 31966 onMouseOver: onMouseOverPadding, 31967 onMouseOut: onMouseLeaveControls 31968 }), showSpacingPresetsControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpacingSizesControl, { 31969 values: paddingValues, 31970 onChange: setPaddingValues, 31971 label: (0,external_wp_i18n_namespaceObject.__)('Padding'), 31972 sides: paddingSides, 31973 units: units, 31974 allowReset: false, 31975 onMouseOver: onMouseOverPadding, 31976 onMouseOut: onMouseLeaveControls 31977 })] 31978 }), showMarginControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 31979 hasValue: hasMarginValue, 31980 label: (0,external_wp_i18n_namespaceObject.__)('Margin'), 31981 onDeselect: resetMarginValue, 31982 isShownByDefault: (_defaultControls$marg = defaultControls.margin) !== null && _defaultControls$marg !== void 0 ? _defaultControls$marg : dimensions_panel_DEFAULT_CONTROLS.margin, 31983 className: dist_clsx({ 31984 'tools-panel-item-spacing': showSpacingPresetsControl 31985 }), 31986 panelId: panelId, 31987 children: [!showSpacingPresetsControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalBoxControl, { 31988 __next40pxDefaultSize: true, 31989 values: marginValues, 31990 onChange: setMarginValues, 31991 inputProps: inputProps, 31992 label: (0,external_wp_i18n_namespaceObject.__)('Margin'), 31993 sides: marginSides, 31994 units: units, 31995 allowReset: false, 31996 splitOnAxis: isAxialMargin, 31997 onMouseOver: onMouseOverMargin, 31998 onMouseOut: onMouseLeaveControls 31999 }), showSpacingPresetsControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpacingSizesControl, { 32000 values: marginValues, 32001 onChange: setMarginValues, 32002 minimumCustomValue: -Infinity, 32003 label: (0,external_wp_i18n_namespaceObject.__)('Margin'), 32004 sides: marginSides, 32005 units: units, 32006 allowReset: false, 32007 onMouseOver: onMouseOverMargin, 32008 onMouseOut: onMouseLeaveControls 32009 })] 32010 }), showGapControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 32011 hasValue: hasGapValue, 32012 label: (0,external_wp_i18n_namespaceObject.__)('Block spacing'), 32013 onDeselect: resetGapValue, 32014 isShownByDefault: (_defaultControls$bloc = defaultControls.blockGap) !== null && _defaultControls$bloc !== void 0 ? _defaultControls$bloc : dimensions_panel_DEFAULT_CONTROLS.blockGap, 32015 className: dist_clsx({ 32016 'tools-panel-item-spacing': showSpacingPresetsControl, 32017 'single-column': 32018 // If UnitControl is used, should be single-column. 32019 !showSpacingPresetsControl && !isAxialGap 32020 }), 32021 panelId: panelId, 32022 children: [!showSpacingPresetsControl && (isAxialGap ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalBoxControl, { 32023 __next40pxDefaultSize: true, 32024 label: (0,external_wp_i18n_namespaceObject.__)('Block spacing'), 32025 min: 0, 32026 onChange: setGapValues, 32027 units: units, 32028 sides: gapSides, 32029 values: gapValues, 32030 allowReset: false, 32031 splitOnAxis: isAxialGap 32032 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 32033 __next40pxDefaultSize: true, 32034 label: (0,external_wp_i18n_namespaceObject.__)('Block spacing'), 32035 min: 0, 32036 onChange: setGapValue, 32037 units: units, 32038 value: gapValue 32039 })), showSpacingPresetsControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpacingSizesControl, { 32040 label: (0,external_wp_i18n_namespaceObject.__)('Block spacing'), 32041 min: 0, 32042 onChange: setGapValues, 32043 showSideInLabel: false, 32044 sides: isAxialGap ? gapSides : ['top'] // Use 'top' as the shorthand property in non-axial configurations. 32045 , 32046 values: gapValues, 32047 allowReset: false 32048 })] 32049 }), showChildLayoutControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ChildLayoutControl, { 32050 value: childLayout, 32051 onChange: setChildLayout, 32052 parentLayout: settings?.parentLayout, 32053 panelId: panelId, 32054 isShownByDefault: (_defaultControls$chil = defaultControls.childLayout) !== null && _defaultControls$chil !== void 0 ? _defaultControls$chil : dimensions_panel_DEFAULT_CONTROLS.childLayout 32055 }), showMinHeightControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 32056 hasValue: hasMinHeightValue, 32057 label: (0,external_wp_i18n_namespaceObject.__)('Minimum height'), 32058 onDeselect: resetMinHeightValue, 32059 isShownByDefault: (_defaultControls$minH = defaultControls.minHeight) !== null && _defaultControls$minH !== void 0 ? _defaultControls$minH : dimensions_panel_DEFAULT_CONTROLS.minHeight, 32060 panelId: panelId, 32061 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HeightControl, { 32062 label: (0,external_wp_i18n_namespaceObject.__)('Minimum height'), 32063 value: minHeightValue, 32064 onChange: setMinHeightValue 32065 }) 32066 }), showAspectRatioControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AspectRatioTool, { 32067 hasValue: hasAspectRatioValue, 32068 value: aspectRatioValue, 32069 onChange: setAspectRatioValue, 32070 panelId: panelId, 32071 isShownByDefault: (_defaultControls$aspe = defaultControls.aspectRatio) !== null && _defaultControls$aspe !== void 0 ? _defaultControls$aspe : dimensions_panel_DEFAULT_CONTROLS.aspectRatio 32072 })] 32073 }); 32074 } 32075 32076 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-popover/use-popover-scroll.js 32077 /** 32078 * WordPress dependencies 32079 */ 32080 32081 32082 /** 32083 * Allow scrolling "through" popovers over the canvas. This is only called for 32084 * as long as the pointer is over a popover. Do not use React events because it 32085 * will bubble through portals. 32086 * 32087 * @param {Object} scrollableRef 32088 */ 32089 function usePopoverScroll(scrollableRef) { 32090 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 32091 if (!scrollableRef) { 32092 return; 32093 } 32094 function onWheel(event) { 32095 const { 32096 deltaX, 32097 deltaY 32098 } = event; 32099 scrollableRef.current.scrollBy(deltaX, deltaY); 32100 } 32101 // Tell the browser that we do not call event.preventDefault 32102 // See https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#improving_scrolling_performance_with_passive_listeners 32103 const options = { 32104 passive: true 32105 }; 32106 node.addEventListener('wheel', onWheel, options); 32107 return () => { 32108 node.removeEventListener('wheel', onWheel, options); 32109 }; 32110 }, [scrollableRef]); 32111 } 32112 /* harmony default export */ const use_popover_scroll = (usePopoverScroll); 32113 32114 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/dom.js 32115 const BLOCK_SELECTOR = '.block-editor-block-list__block'; 32116 const APPENDER_SELECTOR = '.block-list-appender'; 32117 const BLOCK_APPENDER_CLASS = '.block-editor-button-block-appender'; 32118 32119 /** 32120 * Returns true if two elements are contained within the same block. 32121 * 32122 * @param {Element} a First element. 32123 * @param {Element} b Second element. 32124 * 32125 * @return {boolean} Whether elements are in the same block. 32126 */ 32127 function isInSameBlock(a, b) { 32128 return a.closest(BLOCK_SELECTOR) === b.closest(BLOCK_SELECTOR); 32129 } 32130 32131 /** 32132 * Returns true if an element is considered part of the block and not its inner 32133 * blocks or appender. 32134 * 32135 * @param {Element} blockElement Block container element. 32136 * @param {Element} element Element. 32137 * 32138 * @return {boolean} Whether an element is considered part of the block and not 32139 * its inner blocks or appender. 32140 */ 32141 function isInsideRootBlock(blockElement, element) { 32142 const parentBlock = element.closest([BLOCK_SELECTOR, APPENDER_SELECTOR, BLOCK_APPENDER_CLASS].join(',')); 32143 return parentBlock === blockElement; 32144 } 32145 32146 /** 32147 * Finds the block client ID given any DOM node inside the block. 32148 * 32149 * @param {Node?} node DOM node. 32150 * 32151 * @return {string|undefined} Client ID or undefined if the node is not part of 32152 * a block. 32153 */ 32154 function getBlockClientId(node) { 32155 while (node && node.nodeType !== node.ELEMENT_NODE) { 32156 node = node.parentNode; 32157 } 32158 if (!node) { 32159 return; 32160 } 32161 const elementNode = /** @type {Element} */node; 32162 const blockNode = elementNode.closest(BLOCK_SELECTOR); 32163 if (!blockNode) { 32164 return; 32165 } 32166 return blockNode.id.slice('block-'.length); 32167 } 32168 32169 /** 32170 * Calculates the union of two rectangles. 32171 * 32172 * @param {DOMRect} rect1 First rectangle. 32173 * @param {DOMRect} rect2 Second rectangle. 32174 * @return {DOMRect} Union of the two rectangles. 32175 */ 32176 function rectUnion(rect1, rect2) { 32177 const left = Math.min(rect1.left, rect2.left); 32178 const right = Math.max(rect1.right, rect2.right); 32179 const bottom = Math.max(rect1.bottom, rect2.bottom); 32180 const top = Math.min(rect1.top, rect2.top); 32181 return new window.DOMRectReadOnly(left, top, right - left, bottom - top); 32182 } 32183 32184 /** 32185 * Returns whether an element is visible. 32186 * 32187 * @param {Element} element Element. 32188 * @return {boolean} Whether the element is visible. 32189 */ 32190 function isElementVisible(element) { 32191 const viewport = element.ownerDocument.defaultView; 32192 if (!viewport) { 32193 return false; 32194 } 32195 32196 // Check for <VisuallyHidden> component. 32197 if (element.classList.contains('components-visually-hidden')) { 32198 return false; 32199 } 32200 const bounds = element.getBoundingClientRect(); 32201 if (bounds.width === 0 || bounds.height === 0) { 32202 return false; 32203 } 32204 32205 // Older browsers, e.g. Safari < 17.4 may not support the `checkVisibility` method. 32206 if (element.checkVisibility) { 32207 return element.checkVisibility?.({ 32208 opacityProperty: true, 32209 contentVisibilityAuto: true, 32210 visibilityProperty: true 32211 }); 32212 } 32213 const style = viewport.getComputedStyle(element); 32214 if (style.display === 'none' || style.visibility === 'hidden' || style.opacity === '0') { 32215 return false; 32216 } 32217 return true; 32218 } 32219 32220 /** 32221 * Checks if the element is scrollable. 32222 * 32223 * @param {Element} element Element. 32224 * @return {boolean} True if the element is scrollable. 32225 */ 32226 function isScrollable(element) { 32227 const style = window.getComputedStyle(element); 32228 return style.overflowX === 'auto' || style.overflowX === 'scroll' || style.overflowY === 'auto' || style.overflowY === 'scroll'; 32229 } 32230 const WITH_OVERFLOW_ELEMENT_BLOCKS = ['core/navigation']; 32231 /** 32232 * Returns the bounding rectangle of an element, with special handling for blocks 32233 * that have visible overflowing children (defined in WITH_OVERFLOW_ELEMENT_BLOCKS). 32234 * 32235 * For blocks like Navigation that can have overflowing elements (e.g. submenus), 32236 * this function calculates the combined bounds of both the parent and its visible 32237 * children. The returned rect may extend beyond the viewport. 32238 * The returned rect represents the full extent of the element and its visible 32239 * children, which may extend beyond the viewport. 32240 * 32241 * @param {Element} element Element. 32242 * @return {DOMRect} Bounding client rect of the element and its visible children. 32243 */ 32244 function getElementBounds(element) { 32245 const viewport = element.ownerDocument.defaultView; 32246 if (!viewport) { 32247 return new window.DOMRectReadOnly(); 32248 } 32249 let bounds = element.getBoundingClientRect(); 32250 const dataType = element.getAttribute('data-type'); 32251 32252 /* 32253 * For blocks with overflowing elements (like Navigation), include the bounds 32254 * of visible children that extend beyond the parent container. 32255 */ 32256 if (dataType && WITH_OVERFLOW_ELEMENT_BLOCKS.includes(dataType)) { 32257 const stack = [element]; 32258 let currentElement; 32259 while (currentElement = stack.pop()) { 32260 // Children won’t affect bounds unless the element is not scrollable. 32261 if (!isScrollable(currentElement)) { 32262 for (const child of currentElement.children) { 32263 if (isElementVisible(child)) { 32264 const childBounds = child.getBoundingClientRect(); 32265 bounds = rectUnion(bounds, childBounds); 32266 stack.push(child); 32267 } 32268 } 32269 } 32270 } 32271 } 32272 32273 /* 32274 * Take into account the outer horizontal limits of the container in which 32275 * an element is supposed to be "visible". For example, if an element is 32276 * positioned -10px to the left of the window x value (0), this function 32277 * discounts the negative overhang because it's not visible and therefore 32278 * not to be counted in the visibility calculations. Top and bottom values 32279 * are not accounted for to accommodate vertical scroll. 32280 */ 32281 const left = Math.max(bounds.left, 0); 32282 const right = Math.min(bounds.right, viewport.innerWidth); 32283 bounds = new window.DOMRectReadOnly(left, bounds.top, right - left, bounds.height); 32284 return bounds; 32285 } 32286 32287 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-popover/index.js 32288 /** 32289 * External dependencies 32290 */ 32291 32292 32293 /** 32294 * WordPress dependencies 32295 */ 32296 32297 32298 32299 32300 /** 32301 * Internal dependencies 32302 */ 32303 32304 32305 32306 32307 const MAX_POPOVER_RECOMPUTE_COUNTER = Number.MAX_SAFE_INTEGER; 32308 function BlockPopover({ 32309 clientId, 32310 bottomClientId, 32311 children, 32312 __unstablePopoverSlot, 32313 __unstableContentRef, 32314 shift = true, 32315 ...props 32316 }, ref) { 32317 const selectedElement = useBlockElement(clientId); 32318 const lastSelectedElement = useBlockElement(bottomClientId !== null && bottomClientId !== void 0 ? bottomClientId : clientId); 32319 const mergedRefs = (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, use_popover_scroll(__unstableContentRef)]); 32320 const [popoverDimensionsRecomputeCounter, forceRecomputePopoverDimensions] = (0,external_wp_element_namespaceObject.useReducer)( 32321 // Module is there to make sure that the counter doesn't overflow. 32322 s => (s + 1) % MAX_POPOVER_RECOMPUTE_COUNTER, 0); 32323 32324 // When blocks are moved up/down, they are animated to their new position by 32325 // updating the `transform` property manually (i.e. without using CSS 32326 // transitions or animations). The animation, which can also scroll the block 32327 // editor, can sometimes cause the position of the Popover to get out of sync. 32328 // A MutationObserver is therefore used to make sure that changes to the 32329 // selectedElement's attribute (i.e. `transform`) can be tracked and used to 32330 // trigger the Popover to rerender. 32331 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 32332 if (!selectedElement) { 32333 return; 32334 } 32335 const observer = new window.MutationObserver(forceRecomputePopoverDimensions); 32336 observer.observe(selectedElement, { 32337 attributes: true 32338 }); 32339 return () => { 32340 observer.disconnect(); 32341 }; 32342 }, [selectedElement]); 32343 const popoverAnchor = (0,external_wp_element_namespaceObject.useMemo)(() => { 32344 if ( 32345 // popoverDimensionsRecomputeCounter is by definition always equal or greater 32346 // than 0. This check is only there to satisfy the correctness of the 32347 // exhaustive-deps rule for the `useMemo` hook. 32348 popoverDimensionsRecomputeCounter < 0 || !selectedElement || bottomClientId && !lastSelectedElement) { 32349 return undefined; 32350 } 32351 return { 32352 getBoundingClientRect() { 32353 return lastSelectedElement ? rectUnion(getElementBounds(selectedElement), getElementBounds(lastSelectedElement)) : getElementBounds(selectedElement); 32354 }, 32355 contextElement: selectedElement 32356 }; 32357 }, [popoverDimensionsRecomputeCounter, selectedElement, bottomClientId, lastSelectedElement]); 32358 if (!selectedElement || bottomClientId && !lastSelectedElement) { 32359 return null; 32360 } 32361 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, { 32362 ref: mergedRefs, 32363 animate: false, 32364 focusOnMount: false, 32365 anchor: popoverAnchor 32366 // Render in the old slot if needed for backward compatibility, 32367 // otherwise render in place (not in the default popover slot). 32368 , 32369 __unstableSlotName: __unstablePopoverSlot, 32370 inline: !__unstablePopoverSlot, 32371 placement: "top-start", 32372 resize: false, 32373 flip: false, 32374 shift: shift, 32375 ...props, 32376 className: dist_clsx('block-editor-block-popover', props.className), 32377 variant: "unstyled", 32378 children: children 32379 }); 32380 } 32381 const PrivateBlockPopover = (0,external_wp_element_namespaceObject.forwardRef)(BlockPopover); 32382 const PublicBlockPopover = ({ 32383 clientId, 32384 bottomClientId, 32385 children, 32386 ...props 32387 }, ref) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockPopover, { 32388 ...props, 32389 bottomClientId: bottomClientId, 32390 clientId: clientId, 32391 __unstableContentRef: undefined, 32392 __unstablePopoverSlot: undefined, 32393 ref: ref, 32394 children: children 32395 }); 32396 32397 /** 32398 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-popover/README.md 32399 */ 32400 /* harmony default export */ const block_popover = ((0,external_wp_element_namespaceObject.forwardRef)(PublicBlockPopover)); 32401 32402 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-popover/cover.js 32403 /** 32404 * WordPress dependencies 32405 */ 32406 32407 32408 /** 32409 * Internal dependencies 32410 */ 32411 32412 32413 32414 function BlockPopoverCover({ 32415 clientId, 32416 bottomClientId, 32417 children, 32418 shift = false, 32419 additionalStyles, 32420 ...props 32421 }, ref) { 32422 var _bottomClientId; 32423 (_bottomClientId = bottomClientId) !== null && _bottomClientId !== void 0 ? _bottomClientId : bottomClientId = clientId; 32424 const selectedElement = useBlockElement(clientId); 32425 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockPopover, { 32426 ref: ref, 32427 clientId: clientId, 32428 bottomClientId: bottomClientId, 32429 shift: shift, 32430 ...props, 32431 children: selectedElement && clientId === bottomClientId ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CoverContainer, { 32432 selectedElement: selectedElement, 32433 additionalStyles: additionalStyles, 32434 children: children 32435 }) : children 32436 }); 32437 } 32438 function CoverContainer({ 32439 selectedElement, 32440 additionalStyles = {}, 32441 children 32442 }) { 32443 const [width, setWidth] = (0,external_wp_element_namespaceObject.useState)(selectedElement.offsetWidth); 32444 const [height, setHeight] = (0,external_wp_element_namespaceObject.useState)(selectedElement.offsetHeight); 32445 (0,external_wp_element_namespaceObject.useEffect)(() => { 32446 const observer = new window.ResizeObserver(() => { 32447 setWidth(selectedElement.offsetWidth); 32448 setHeight(selectedElement.offsetHeight); 32449 }); 32450 observer.observe(selectedElement, { 32451 box: 'border-box' 32452 }); 32453 return () => observer.disconnect(); 32454 }, [selectedElement]); 32455 const style = (0,external_wp_element_namespaceObject.useMemo)(() => { 32456 return { 32457 position: 'absolute', 32458 width, 32459 height, 32460 ...additionalStyles 32461 }; 32462 }, [width, height, additionalStyles]); 32463 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 32464 style: style, 32465 children: children 32466 }); 32467 } 32468 /* harmony default export */ const cover = ((0,external_wp_element_namespaceObject.forwardRef)(BlockPopoverCover)); 32469 32470 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/spacing-visualizer.js 32471 /** 32472 * WordPress dependencies 32473 */ 32474 32475 32476 32477 /** 32478 * Internal dependencies 32479 */ 32480 32481 32482 32483 function SpacingVisualizer({ 32484 clientId, 32485 value, 32486 computeStyle, 32487 forceShow 32488 }) { 32489 const blockElement = useBlockElement(clientId); 32490 const [style, updateStyle] = (0,external_wp_element_namespaceObject.useReducer)(() => computeStyle(blockElement)); 32491 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 32492 if (!blockElement) { 32493 return; 32494 } 32495 // It's not sufficient to read the computed spacing value when value.spacing changes as 32496 // useEffect may run before the browser recomputes CSS. We therefore combine 32497 // useLayoutEffect and two rAF calls to ensure that we read the spacing after the current 32498 // paint but before the next paint. 32499 // See https://github.com/WordPress/gutenberg/pull/59227. 32500 window.requestAnimationFrame(() => window.requestAnimationFrame(updateStyle)); 32501 }, [blockElement, value]); 32502 const previousValueRef = (0,external_wp_element_namespaceObject.useRef)(value); 32503 const [isActive, setIsActive] = (0,external_wp_element_namespaceObject.useState)(false); 32504 (0,external_wp_element_namespaceObject.useEffect)(() => { 32505 if (external_wp_isShallowEqual_default()(value, previousValueRef.current) || forceShow) { 32506 return; 32507 } 32508 setIsActive(true); 32509 previousValueRef.current = value; 32510 const timeout = setTimeout(() => { 32511 setIsActive(false); 32512 }, 400); 32513 return () => { 32514 setIsActive(false); 32515 clearTimeout(timeout); 32516 }; 32517 }, [value, forceShow]); 32518 if (!isActive && !forceShow) { 32519 return null; 32520 } 32521 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cover, { 32522 clientId: clientId, 32523 __unstablePopoverSlot: "block-toolbar", 32524 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 32525 className: "block-editor__spacing-visualizer", 32526 style: style 32527 }) 32528 }); 32529 } 32530 function getComputedCSS(element, property) { 32531 return element.ownerDocument.defaultView.getComputedStyle(element).getPropertyValue(property); 32532 } 32533 function MarginVisualizer({ 32534 clientId, 32535 value, 32536 forceShow 32537 }) { 32538 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpacingVisualizer, { 32539 clientId: clientId, 32540 value: value?.spacing?.margin, 32541 computeStyle: blockElement => { 32542 const top = getComputedCSS(blockElement, 'margin-top'); 32543 const right = getComputedCSS(blockElement, 'margin-right'); 32544 const bottom = getComputedCSS(blockElement, 'margin-bottom'); 32545 const left = getComputedCSS(blockElement, 'margin-left'); 32546 return { 32547 borderTopWidth: top, 32548 borderRightWidth: right, 32549 borderBottomWidth: bottom, 32550 borderLeftWidth: left, 32551 top: top ? `-$top}` : 0, 32552 right: right ? `-$right}` : 0, 32553 bottom: bottom ? `-$bottom}` : 0, 32554 left: left ? `-$left}` : 0 32555 }; 32556 }, 32557 forceShow: forceShow 32558 }); 32559 } 32560 function PaddingVisualizer({ 32561 clientId, 32562 value, 32563 forceShow 32564 }) { 32565 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpacingVisualizer, { 32566 clientId: clientId, 32567 value: value?.spacing?.padding, 32568 computeStyle: blockElement => ({ 32569 borderTopWidth: getComputedCSS(blockElement, 'padding-top'), 32570 borderRightWidth: getComputedCSS(blockElement, 'padding-right'), 32571 borderBottomWidth: getComputedCSS(blockElement, 'padding-bottom'), 32572 borderLeftWidth: getComputedCSS(blockElement, 'padding-left') 32573 }), 32574 forceShow: forceShow 32575 }); 32576 } 32577 32578 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/dimensions.js 32579 /** 32580 * External dependencies 32581 */ 32582 32583 32584 /** 32585 * WordPress dependencies 32586 */ 32587 32588 32589 32590 32591 32592 /** 32593 * Internal dependencies 32594 */ 32595 32596 32597 32598 32599 32600 32601 32602 32603 32604 const DIMENSIONS_SUPPORT_KEY = 'dimensions'; 32605 const SPACING_SUPPORT_KEY = 'spacing'; 32606 const dimensions_ALL_SIDES = (/* unused pure expression or super */ null && (['top', 'right', 'bottom', 'left'])); 32607 const dimensions_AXIAL_SIDES = (/* unused pure expression or super */ null && (['vertical', 'horizontal'])); 32608 function useVisualizer() { 32609 const [property, setProperty] = (0,external_wp_element_namespaceObject.useState)(false); 32610 const { 32611 hideBlockInterface, 32612 showBlockInterface 32613 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 32614 (0,external_wp_element_namespaceObject.useEffect)(() => { 32615 if (!property) { 32616 showBlockInterface(); 32617 } else { 32618 hideBlockInterface(); 32619 } 32620 }, [property, showBlockInterface, hideBlockInterface]); 32621 return [property, setProperty]; 32622 } 32623 function DimensionsInspectorControl({ 32624 children, 32625 resetAllFilter 32626 }) { 32627 const attributesResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(attributes => { 32628 const existingStyle = attributes.style; 32629 const updatedStyle = resetAllFilter(existingStyle); 32630 return { 32631 ...attributes, 32632 style: updatedStyle 32633 }; 32634 }, [resetAllFilter]); 32635 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 32636 group: "dimensions", 32637 resetAllFilter: attributesResetAllFilter, 32638 children: children 32639 }); 32640 } 32641 function dimensions_DimensionsPanel({ 32642 clientId, 32643 name, 32644 setAttributes, 32645 settings 32646 }) { 32647 const isEnabled = useHasDimensionsPanel(settings); 32648 const value = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getBlockAttributes(clientId)?.style, [clientId]); 32649 const [visualizedProperty, setVisualizedProperty] = useVisualizer(); 32650 const onChange = newStyle => { 32651 setAttributes({ 32652 style: utils_cleanEmptyObject(newStyle) 32653 }); 32654 }; 32655 if (!isEnabled) { 32656 return null; 32657 } 32658 const defaultDimensionsControls = (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, [DIMENSIONS_SUPPORT_KEY, '__experimentalDefaultControls']); 32659 const defaultSpacingControls = (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, [SPACING_SUPPORT_KEY, '__experimentalDefaultControls']); 32660 const defaultControls = { 32661 ...defaultDimensionsControls, 32662 ...defaultSpacingControls 32663 }; 32664 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 32665 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DimensionsPanel, { 32666 as: DimensionsInspectorControl, 32667 panelId: clientId, 32668 settings: settings, 32669 value: value, 32670 onChange: onChange, 32671 defaultControls: defaultControls, 32672 onVisualize: setVisualizedProperty 32673 }), !!settings?.spacing?.padding && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PaddingVisualizer, { 32674 forceShow: visualizedProperty === 'padding', 32675 clientId: clientId, 32676 value: value 32677 }), !!settings?.spacing?.margin && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MarginVisualizer, { 32678 forceShow: visualizedProperty === 'margin', 32679 clientId: clientId, 32680 value: value 32681 })] 32682 }); 32683 } 32684 32685 /** 32686 * Determine whether there is block support for dimensions. 32687 * 32688 * @param {string} blockName Block name. 32689 * @param {string} feature Background image feature to check for. 32690 * 32691 * @return {boolean} Whether there is support. 32692 */ 32693 function hasDimensionsSupport(blockName, feature = 'any') { 32694 if (external_wp_element_namespaceObject.Platform.OS !== 'web') { 32695 return false; 32696 } 32697 const support = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockName, DIMENSIONS_SUPPORT_KEY); 32698 if (support === true) { 32699 return true; 32700 } 32701 if (feature === 'any') { 32702 return !!(support?.aspectRatio || !!support?.minHeight); 32703 } 32704 return !!support?.[feature]; 32705 } 32706 /* harmony default export */ const dimensions = ({ 32707 useBlockProps: dimensions_useBlockProps, 32708 attributeKeys: ['minHeight', 'style'], 32709 hasSupport(name) { 32710 return hasDimensionsSupport(name, 'aspectRatio'); 32711 } 32712 }); 32713 function dimensions_useBlockProps({ 32714 name, 32715 minHeight, 32716 style 32717 }) { 32718 if (!hasDimensionsSupport(name, 'aspectRatio') || shouldSkipSerialization(name, DIMENSIONS_SUPPORT_KEY, 'aspectRatio')) { 32719 return {}; 32720 } 32721 const className = dist_clsx({ 32722 'has-aspect-ratio': !!style?.dimensions?.aspectRatio 32723 }); 32724 32725 // Allow dimensions-based inline style overrides to override any global styles rules that 32726 // might be set for the block, and therefore affect the display of the aspect ratio. 32727 const inlineStyleOverrides = {}; 32728 32729 // Apply rules to unset incompatible styles. 32730 // Note that a set `aspectRatio` will win out if both an aspect ratio and a minHeight are set. 32731 // This is because the aspect ratio is a newer block support, so (in theory) any aspect ratio 32732 // that is set should be intentional and should override any existing minHeight. The Cover block 32733 // and dimensions controls have logic that will manually clear the aspect ratio if a minHeight 32734 // is set. 32735 if (style?.dimensions?.aspectRatio) { 32736 // To ensure the aspect ratio does not get overridden by `minHeight` unset any existing rule. 32737 inlineStyleOverrides.minHeight = 'unset'; 32738 } else if (minHeight || style?.dimensions?.minHeight) { 32739 // To ensure the minHeight does not get overridden by `aspectRatio` unset any existing rule. 32740 inlineStyleOverrides.aspectRatio = 'unset'; 32741 } 32742 return { 32743 className, 32744 style: inlineStyleOverrides 32745 }; 32746 } 32747 32748 /** 32749 * @deprecated 32750 */ 32751 function useCustomSides() { 32752 external_wp_deprecated_default()('wp.blockEditor.__experimentalUseCustomSides', { 32753 since: '6.3', 32754 version: '6.4' 32755 }); 32756 } 32757 32758 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/style.js 32759 /** 32760 * WordPress dependencies 32761 */ 32762 32763 32764 32765 32766 32767 32768 /** 32769 * Internal dependencies 32770 */ 32771 32772 32773 32774 32775 32776 32777 32778 32779 32780 32781 32782 const styleSupportKeys = [...TYPOGRAPHY_SUPPORT_KEYS, BORDER_SUPPORT_KEY, COLOR_SUPPORT_KEY, DIMENSIONS_SUPPORT_KEY, BACKGROUND_SUPPORT_KEY, SPACING_SUPPORT_KEY, SHADOW_SUPPORT_KEY]; 32783 const hasStyleSupport = nameOrType => styleSupportKeys.some(key => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(nameOrType, key)); 32784 32785 /** 32786 * Returns the inline styles to add depending on the style object 32787 * 32788 * @param {Object} styles Styles configuration. 32789 * 32790 * @return {Object} Flattened CSS variables declaration. 32791 */ 32792 function getInlineStyles(styles = {}) { 32793 const output = {}; 32794 // The goal is to move everything to server side generated engine styles 32795 // This is temporary as we absorb more and more styles into the engine. 32796 (0,external_wp_styleEngine_namespaceObject.getCSSRules)(styles).forEach(rule => { 32797 output[rule.key] = rule.value; 32798 }); 32799 return output; 32800 } 32801 32802 /** 32803 * Filters registered block settings, extending attributes to include `style` attribute. 32804 * 32805 * @param {Object} settings Original block settings. 32806 * 32807 * @return {Object} Filtered block settings. 32808 */ 32809 function style_addAttribute(settings) { 32810 if (!hasStyleSupport(settings)) { 32811 return settings; 32812 } 32813 32814 // Allow blocks to specify their own attribute definition with default values if needed. 32815 if (!settings.attributes.style) { 32816 Object.assign(settings.attributes, { 32817 style: { 32818 type: 'object' 32819 } 32820 }); 32821 } 32822 return settings; 32823 } 32824 32825 /** 32826 * A dictionary of paths to flag skipping block support serialization as the key, 32827 * with values providing the style paths to be omitted from serialization. 32828 * 32829 * @constant 32830 * @type {Record<string, string[]>} 32831 */ 32832 const skipSerializationPathsEdit = { 32833 [`$BORDER_SUPPORT_KEY}.__experimentalSkipSerialization`]: ['border'], 32834 [`$COLOR_SUPPORT_KEY}.__experimentalSkipSerialization`]: [COLOR_SUPPORT_KEY], 32835 [`$TYPOGRAPHY_SUPPORT_KEY}.__experimentalSkipSerialization`]: [TYPOGRAPHY_SUPPORT_KEY], 32836 [`$DIMENSIONS_SUPPORT_KEY}.__experimentalSkipSerialization`]: [DIMENSIONS_SUPPORT_KEY], 32837 [`$SPACING_SUPPORT_KEY}.__experimentalSkipSerialization`]: [SPACING_SUPPORT_KEY], 32838 [`$SHADOW_SUPPORT_KEY}.__experimentalSkipSerialization`]: [SHADOW_SUPPORT_KEY] 32839 }; 32840 32841 /** 32842 * A dictionary of paths to flag skipping block support serialization as the key, 32843 * with values providing the style paths to be omitted from serialization. 32844 * 32845 * Extends the Edit skip paths to enable skipping additional paths in just 32846 * the Save component. This allows a block support to be serialized within the 32847 * editor, while using an alternate approach, such as server-side rendering, when 32848 * the support is saved. 32849 * 32850 * @constant 32851 * @type {Record<string, string[]>} 32852 */ 32853 const skipSerializationPathsSave = { 32854 ...skipSerializationPathsEdit, 32855 [`$DIMENSIONS_SUPPORT_KEY}.aspectRatio`]: [`$DIMENSIONS_SUPPORT_KEY}.aspectRatio`], 32856 // Skip serialization of aspect ratio in save mode. 32857 [`$BACKGROUND_SUPPORT_KEY}`]: [BACKGROUND_SUPPORT_KEY] // Skip serialization of background support in save mode. 32858 }; 32859 const skipSerializationPathsSaveChecks = { 32860 [`$DIMENSIONS_SUPPORT_KEY}.aspectRatio`]: true, 32861 [`$BACKGROUND_SUPPORT_KEY}`]: true 32862 }; 32863 32864 /** 32865 * A dictionary used to normalize feature names between support flags, style 32866 * object properties and __experimentSkipSerialization configuration arrays. 32867 * 32868 * This allows not having to provide a migration for a support flag and possible 32869 * backwards compatibility bridges, while still achieving consistency between 32870 * the support flag and the skip serialization array. 32871 * 32872 * @constant 32873 * @type {Record<string, string>} 32874 */ 32875 const renamedFeatures = { 32876 gradients: 'gradient' 32877 }; 32878 32879 /** 32880 * A utility function used to remove one or more paths from a style object. 32881 * Works in a way similar to Lodash's `omit()`. See unit tests and examples below. 32882 * 32883 * It supports a single string path: 32884 * 32885 * ``` 32886 * omitStyle( { color: 'red' }, 'color' ); // {} 32887 * ``` 32888 * 32889 * or an array of paths: 32890 * 32891 * ``` 32892 * omitStyle( { color: 'red', background: '#fff' }, [ 'color', 'background' ] ); // {} 32893 * ``` 32894 * 32895 * It also allows you to specify paths at multiple levels in a string. 32896 * 32897 * ``` 32898 * omitStyle( { typography: { textDecoration: 'underline' } }, 'typography.textDecoration' ); // {} 32899 * ``` 32900 * 32901 * You can remove multiple paths at the same time: 32902 * 32903 * ``` 32904 * omitStyle( 32905 * { 32906 * typography: { 32907 * textDecoration: 'underline', 32908 * textTransform: 'uppercase', 32909 * } 32910 * }, 32911 * [ 32912 * 'typography.textDecoration', 32913 * 'typography.textTransform', 32914 * ] 32915 * ); 32916 * // {} 32917 * ``` 32918 * 32919 * You can also specify nested paths as arrays: 32920 * 32921 * ``` 32922 * omitStyle( 32923 * { 32924 * typography: { 32925 * textDecoration: 'underline', 32926 * textTransform: 'uppercase', 32927 * } 32928 * }, 32929 * [ 32930 * [ 'typography', 'textDecoration' ], 32931 * [ 'typography', 'textTransform' ], 32932 * ] 32933 * ); 32934 * // {} 32935 * ``` 32936 * 32937 * With regards to nesting of styles, infinite depth is supported: 32938 * 32939 * ``` 32940 * omitStyle( 32941 * { 32942 * border: { 32943 * radius: { 32944 * topLeft: '10px', 32945 * topRight: '0.5rem', 32946 * } 32947 * } 32948 * }, 32949 * [ 32950 * [ 'border', 'radius', 'topRight' ], 32951 * ] 32952 * ); 32953 * // { border: { radius: { topLeft: '10px' } } } 32954 * ``` 32955 * 32956 * The third argument, `preserveReference`, defines how to treat the input style object. 32957 * It is mostly necessary to properly handle mutation when recursively handling the style object. 32958 * Defaulting to `false`, this will always create a new object, avoiding to mutate `style`. 32959 * However, when recursing, we change that value to `true` in order to work with a single copy 32960 * of the original style object. 32961 * 32962 * @see https://lodash.com/docs/4.17.15#omit 32963 * 32964 * @param {Object} style Styles object. 32965 * @param {Array|string} paths Paths to remove. 32966 * @param {boolean} preserveReference True to mutate the `style` object, false otherwise. 32967 * @return {Object} Styles object with the specified paths removed. 32968 */ 32969 function omitStyle(style, paths, preserveReference = false) { 32970 if (!style) { 32971 return style; 32972 } 32973 let newStyle = style; 32974 if (!preserveReference) { 32975 newStyle = JSON.parse(JSON.stringify(style)); 32976 } 32977 if (!Array.isArray(paths)) { 32978 paths = [paths]; 32979 } 32980 paths.forEach(path => { 32981 if (!Array.isArray(path)) { 32982 path = path.split('.'); 32983 } 32984 if (path.length > 1) { 32985 const [firstSubpath, ...restPath] = path; 32986 omitStyle(newStyle[firstSubpath], [restPath], true); 32987 } else if (path.length === 1) { 32988 delete newStyle[path[0]]; 32989 } 32990 }); 32991 return newStyle; 32992 } 32993 32994 /** 32995 * Override props assigned to save component to inject the CSS variables definition. 32996 * 32997 * @param {Object} props Additional props applied to save element. 32998 * @param {Object|string} blockNameOrType Block type. 32999 * @param {Object} attributes Block attributes. 33000 * @param {?Record<string, string[]>} skipPaths An object of keys and paths to skip serialization. 33001 * 33002 * @return {Object} Filtered props applied to save element. 33003 */ 33004 function style_addSaveProps(props, blockNameOrType, attributes, skipPaths = skipSerializationPathsSave) { 33005 if (!hasStyleSupport(blockNameOrType)) { 33006 return props; 33007 } 33008 let { 33009 style 33010 } = attributes; 33011 Object.entries(skipPaths).forEach(([indicator, path]) => { 33012 const skipSerialization = skipSerializationPathsSaveChecks[indicator] || (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockNameOrType, indicator); 33013 if (skipSerialization === true) { 33014 style = omitStyle(style, path); 33015 } 33016 if (Array.isArray(skipSerialization)) { 33017 skipSerialization.forEach(featureName => { 33018 const feature = renamedFeatures[featureName] || featureName; 33019 style = omitStyle(style, [[...path, feature]]); 33020 }); 33021 } 33022 }); 33023 props.style = { 33024 ...getInlineStyles(style), 33025 ...props.style 33026 }; 33027 return props; 33028 } 33029 function BlockStyleControls({ 33030 clientId, 33031 name, 33032 setAttributes, 33033 __unstableParentLayout 33034 }) { 33035 const settings = useBlockSettings(name, __unstableParentLayout); 33036 const blockEditingMode = useBlockEditingMode(); 33037 const passedProps = { 33038 clientId, 33039 name, 33040 setAttributes, 33041 settings: { 33042 ...settings, 33043 typography: { 33044 ...settings.typography, 33045 // The text alignment UI for individual blocks is rendered in 33046 // the block toolbar, so disable it here. 33047 textAlign: false 33048 } 33049 } 33050 }; 33051 if (blockEditingMode !== 'default') { 33052 return null; 33053 } 33054 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 33055 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorEdit, { 33056 ...passedProps 33057 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(background_BackgroundImagePanel, { 33058 ...passedProps 33059 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(typography_TypographyPanel, { 33060 ...passedProps 33061 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_BorderPanel, { 33062 ...passedProps 33063 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dimensions_DimensionsPanel, { 33064 ...passedProps 33065 })] 33066 }); 33067 } 33068 /* harmony default export */ const style = ({ 33069 edit: BlockStyleControls, 33070 hasSupport: hasStyleSupport, 33071 addSaveProps: style_addSaveProps, 33072 attributeKeys: ['style'], 33073 useBlockProps: style_useBlockProps 33074 }); 33075 33076 // Defines which element types are supported, including their hover styles or 33077 // any other elements that have been included under a single element type 33078 // e.g. heading and h1-h6. 33079 const elementTypes = [{ 33080 elementType: 'button' 33081 }, { 33082 elementType: 'link', 33083 pseudo: [':hover'] 33084 }, { 33085 elementType: 'heading', 33086 elements: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] 33087 }]; 33088 function style_useBlockProps({ 33089 name, 33090 style 33091 }) { 33092 const blockElementsContainerIdentifier = `wp-elements-${(0,external_wp_compose_namespaceObject.useInstanceId)(style_useBlockProps)}`; 33093 const baseElementSelector = `.$blockElementsContainerIdentifier}`; 33094 const blockElementStyles = style?.elements; 33095 const styles = (0,external_wp_element_namespaceObject.useMemo)(() => { 33096 if (!blockElementStyles) { 33097 return; 33098 } 33099 const elementCSSRules = []; 33100 elementTypes.forEach(({ 33101 elementType, 33102 pseudo, 33103 elements 33104 }) => { 33105 const skipSerialization = shouldSkipSerialization(name, COLOR_SUPPORT_KEY, elementType); 33106 if (skipSerialization) { 33107 return; 33108 } 33109 const elementStyles = blockElementStyles?.[elementType]; 33110 33111 // Process primary element type styles. 33112 if (elementStyles) { 33113 const selector = scopeSelector(baseElementSelector, external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS[elementType]); 33114 elementCSSRules.push((0,external_wp_styleEngine_namespaceObject.compileCSS)(elementStyles, { 33115 selector 33116 })); 33117 33118 // Process any interactive states for the element type. 33119 if (pseudo) { 33120 pseudo.forEach(pseudoSelector => { 33121 if (elementStyles[pseudoSelector]) { 33122 elementCSSRules.push((0,external_wp_styleEngine_namespaceObject.compileCSS)(elementStyles[pseudoSelector], { 33123 selector: scopeSelector(baseElementSelector, `$external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS[elementType]}$pseudoSelector}`) 33124 })); 33125 } 33126 }); 33127 } 33128 } 33129 33130 // Process related elements e.g. h1-h6 for headings 33131 if (elements) { 33132 elements.forEach(element => { 33133 if (blockElementStyles[element]) { 33134 elementCSSRules.push((0,external_wp_styleEngine_namespaceObject.compileCSS)(blockElementStyles[element], { 33135 selector: scopeSelector(baseElementSelector, external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS[element]) 33136 })); 33137 } 33138 }); 33139 } 33140 }); 33141 return elementCSSRules.length > 0 ? elementCSSRules.join('') : undefined; 33142 }, [baseElementSelector, blockElementStyles, name]); 33143 useStyleOverride({ 33144 css: styles 33145 }); 33146 return style_addSaveProps({ 33147 className: blockElementsContainerIdentifier 33148 }, name, { 33149 style 33150 }, skipSerializationPathsEdit); 33151 } 33152 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/style/addAttribute', style_addAttribute); 33153 33154 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/settings.js 33155 /** 33156 * WordPress dependencies 33157 */ 33158 33159 33160 const hasSettingsSupport = blockType => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, '__experimentalSettings', false); 33161 function settings_addAttribute(settings) { 33162 if (!hasSettingsSupport(settings)) { 33163 return settings; 33164 } 33165 33166 // Allow blocks to specify their own attribute definition with default values if needed. 33167 if (!settings?.attributes?.settings) { 33168 settings.attributes = { 33169 ...settings.attributes, 33170 settings: { 33171 type: 'object' 33172 } 33173 }; 33174 } 33175 return settings; 33176 } 33177 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/settings/addAttribute', settings_addAttribute); 33178 33179 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/filter.js 33180 /** 33181 * WordPress dependencies 33182 */ 33183 33184 33185 const filter = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 33186 xmlns: "http://www.w3.org/2000/svg", 33187 viewBox: "0 0 24 24", 33188 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 33189 d: "M12 4 4 19h16L12 4zm0 3.2 5.5 10.3H12V7.2z" 33190 }) 33191 }); 33192 /* harmony default export */ const library_filter = (filter); 33193 33194 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/duotone-control/index.js 33195 /** 33196 * WordPress dependencies 33197 */ 33198 33199 33200 33201 33202 33203 33204 33205 function DuotoneControl({ 33206 id: idProp, 33207 colorPalette, 33208 duotonePalette, 33209 disableCustomColors, 33210 disableCustomDuotone, 33211 value, 33212 onChange 33213 }) { 33214 let toolbarIcon; 33215 if (value === 'unset') { 33216 toolbarIcon = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ColorIndicator, { 33217 className: "block-editor-duotone-control__unset-indicator" 33218 }); 33219 } else if (value) { 33220 toolbarIcon = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DuotoneSwatch, { 33221 values: value 33222 }); 33223 } else { 33224 toolbarIcon = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 33225 icon: library_filter 33226 }); 33227 } 33228 const actionLabel = (0,external_wp_i18n_namespaceObject.__)('Apply duotone filter'); 33229 const id = (0,external_wp_compose_namespaceObject.useInstanceId)(DuotoneControl, 'duotone-control', idProp); 33230 const descriptionId = `$id}__description`; 33231 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 33232 popoverProps: { 33233 className: 'block-editor-duotone-control__popover', 33234 headerTitle: (0,external_wp_i18n_namespaceObject.__)('Duotone') 33235 }, 33236 renderToggle: ({ 33237 isOpen, 33238 onToggle 33239 }) => { 33240 const openOnArrowDown = event => { 33241 if (!isOpen && event.keyCode === external_wp_keycodes_namespaceObject.DOWN) { 33242 event.preventDefault(); 33243 onToggle(); 33244 } 33245 }; 33246 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 33247 showTooltip: true, 33248 onClick: onToggle, 33249 "aria-haspopup": "true", 33250 "aria-expanded": isOpen, 33251 onKeyDown: openOnArrowDown, 33252 label: actionLabel, 33253 icon: toolbarIcon 33254 }); 33255 }, 33256 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuGroup, { 33257 label: (0,external_wp_i18n_namespaceObject.__)('Duotone'), 33258 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 33259 children: (0,external_wp_i18n_namespaceObject.__)('Create a two-tone color effect without losing your original image.') 33260 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DuotonePicker, { 33261 "aria-label": actionLabel, 33262 "aria-describedby": descriptionId, 33263 colorPalette: colorPalette, 33264 duotonePalette: duotonePalette, 33265 disableCustomColors: disableCustomColors, 33266 disableCustomDuotone: disableCustomDuotone, 33267 value: value, 33268 onChange: onChange 33269 })] 33270 }) 33271 }); 33272 } 33273 /* harmony default export */ const duotone_control = (DuotoneControl); 33274 33275 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/duotone/utils.js 33276 /** 33277 * External dependencies 33278 */ 33279 33280 33281 /** 33282 * Convert a list of colors to an object of R, G, and B values. 33283 * 33284 * @param {string[]} colors Array of RBG color strings. 33285 * 33286 * @return {Object} R, G, and B values. 33287 */ 33288 function getValuesFromColors(colors = []) { 33289 const values = { 33290 r: [], 33291 g: [], 33292 b: [], 33293 a: [] 33294 }; 33295 colors.forEach(color => { 33296 const rgbColor = w(color).toRgb(); 33297 values.r.push(rgbColor.r / 255); 33298 values.g.push(rgbColor.g / 255); 33299 values.b.push(rgbColor.b / 255); 33300 values.a.push(rgbColor.a); 33301 }); 33302 return values; 33303 } 33304 33305 /** 33306 * Stylesheet for disabling a global styles duotone filter. 33307 * 33308 * @param {string} selector Selector to disable the filter for. 33309 * 33310 * @return {string} Filter none style. 33311 */ 33312 function getDuotoneUnsetStylesheet(selector) { 33313 return `$selector}{filter:none}`; 33314 } 33315 33316 /** 33317 * SVG and stylesheet needed for rendering the duotone filter. 33318 * 33319 * @param {string} selector Selector to apply the filter to. 33320 * @param {string} id Unique id for this duotone filter. 33321 * 33322 * @return {string} Duotone filter style. 33323 */ 33324 function getDuotoneStylesheet(selector, id) { 33325 return `$selector}{filter:url(#$id})}`; 33326 } 33327 33328 /** 33329 * The SVG part of the duotone filter. 33330 * 33331 * @param {string} id Unique id for this duotone filter. 33332 * @param {string[]} colors Color strings from dark to light. 33333 * 33334 * @return {string} Duotone SVG. 33335 */ 33336 function getDuotoneFilter(id, colors) { 33337 const values = getValuesFromColors(colors); 33338 return ` 33339 <svg 33340 xmlns:xlink="http://www.w3.org/1999/xlink" 33341 viewBox="0 0 0 0" 33342 width="0" 33343 height="0" 33344 focusable="false" 33345 role="none" 33346 aria-hidden="true" 33347 style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;" 33348 > 33349 <defs> 33350 <filter id="$id}"> 33351 <!-- 33352 Use sRGB instead of linearRGB so transparency looks correct. 33353 Use perceptual brightness to convert to grayscale. 33354 --> 33355 <feColorMatrix color-interpolation-filters="sRGB" type="matrix" values=" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 "></feColorMatrix> 33356 <!-- Use sRGB instead of linearRGB to be consistent with how CSS gradients work. --> 33357 <feComponentTransfer color-interpolation-filters="sRGB"> 33358 <feFuncR type="table" tableValues="$values.r.join(' ')}"></feFuncR> 33359 <feFuncG type="table" tableValues="$values.g.join(' ')}"></feFuncG> 33360 <feFuncB type="table" tableValues="$values.b.join(' ')}"></feFuncB> 33361 <feFuncA type="table" tableValues="$values.a.join(' ')}"></feFuncA> 33362 </feComponentTransfer> 33363 <!-- Re-mask the image with the original transparency since the feColorMatrix above loses that information. --> 33364 <feComposite in2="SourceGraphic" operator="in"></feComposite> 33365 </filter> 33366 </defs> 33367 </svg>`; 33368 } 33369 33370 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/get-block-css-selector.js 33371 /** 33372 * Internal dependencies 33373 */ 33374 33375 33376 33377 /** 33378 * Determine the CSS selector for the block type and target provided, returning 33379 * it if available. 33380 * 33381 * @param {import('@wordpress/blocks').Block} blockType The block's type. 33382 * @param {string|string[]} target The desired selector's target e.g. `root`, delimited string, or array path. 33383 * @param {Object} options Options object. 33384 * @param {boolean} options.fallback Whether or not to fallback to broader selector. 33385 * 33386 * @return {?string} The CSS selector or `null` if no selector available. 33387 */ 33388 function getBlockCSSSelector(blockType, target = 'root', options = {}) { 33389 if (!target) { 33390 return null; 33391 } 33392 const { 33393 fallback = false 33394 } = options; 33395 const { 33396 name, 33397 selectors, 33398 supports 33399 } = blockType; 33400 const hasSelectors = selectors && Object.keys(selectors).length > 0; 33401 const path = Array.isArray(target) ? target.join('.') : target; 33402 33403 // Root selector. 33404 33405 // Calculated before returning as it can be used as a fallback for feature 33406 // selectors later on. 33407 let rootSelector = null; 33408 if (hasSelectors && selectors.root) { 33409 // Use the selectors API if available. 33410 rootSelector = selectors?.root; 33411 } else if (supports?.__experimentalSelector) { 33412 // Use the old experimental selector supports property if set. 33413 rootSelector = supports.__experimentalSelector; 33414 } else { 33415 // If no root selector found, generate default block class selector. 33416 rootSelector = '.wp-block-' + name.replace('core/', '').replace('/', '-'); 33417 } 33418 33419 // Return selector if it's the root target we are looking for. 33420 if (path === 'root') { 33421 return rootSelector; 33422 } 33423 33424 // If target is not `root` or `duotone` we have a feature or subfeature 33425 // as the target. If the target is a string convert to an array. 33426 const pathArray = Array.isArray(target) ? target : target.split('.'); 33427 33428 // Feature selectors ( may fallback to root selector ); 33429 if (pathArray.length === 1) { 33430 const fallbackSelector = fallback ? rootSelector : null; 33431 33432 // Prefer the selectors API if available. 33433 if (hasSelectors) { 33434 // Get selector from either `feature.root` or shorthand path. 33435 const featureSelector = getValueFromObjectPath(selectors, `$path}.root`, null) || getValueFromObjectPath(selectors, path, null); 33436 33437 // Return feature selector if found or any available fallback. 33438 return featureSelector || fallbackSelector; 33439 } 33440 33441 // Try getting old experimental supports selector value. 33442 const featureSelector = getValueFromObjectPath(supports, `$path}.__experimentalSelector`, null); 33443 33444 // If nothing to work with, provide fallback selector if available. 33445 if (!featureSelector) { 33446 return fallbackSelector; 33447 } 33448 33449 // Scope the feature selector by the block's root selector. 33450 return scopeSelector(rootSelector, featureSelector); 33451 } 33452 33453 // Subfeature selector. 33454 // This may fallback either to parent feature or root selector. 33455 let subfeatureSelector; 33456 33457 // Use selectors API if available. 33458 if (hasSelectors) { 33459 subfeatureSelector = getValueFromObjectPath(selectors, path, null); 33460 } 33461 33462 // Only return if we have a subfeature selector. 33463 if (subfeatureSelector) { 33464 return subfeatureSelector; 33465 } 33466 33467 // To this point we don't have a subfeature selector. If a fallback has been 33468 // requested, remove subfeature from target path and return results of a 33469 // call for the parent feature's selector. 33470 if (fallback) { 33471 return getBlockCSSSelector(blockType, pathArray[0], options); 33472 } 33473 33474 // We tried. 33475 return null; 33476 } 33477 33478 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/filters-panel.js 33479 /** 33480 * External dependencies 33481 */ 33482 33483 33484 /** 33485 * WordPress dependencies 33486 */ 33487 33488 33489 33490 33491 /** 33492 * Internal dependencies 33493 */ 33494 33495 33496 33497 33498 const filters_panel_EMPTY_ARRAY = []; 33499 function useMultiOriginColorPresets(settings, { 33500 presetSetting, 33501 defaultSetting 33502 }) { 33503 const disableDefault = !settings?.color?.[defaultSetting]; 33504 const userPresets = settings?.color?.[presetSetting]?.custom || filters_panel_EMPTY_ARRAY; 33505 const themePresets = settings?.color?.[presetSetting]?.theme || filters_panel_EMPTY_ARRAY; 33506 const defaultPresets = settings?.color?.[presetSetting]?.default || filters_panel_EMPTY_ARRAY; 33507 return (0,external_wp_element_namespaceObject.useMemo)(() => [...userPresets, ...themePresets, ...(disableDefault ? filters_panel_EMPTY_ARRAY : defaultPresets)], [disableDefault, userPresets, themePresets, defaultPresets]); 33508 } 33509 function useHasFiltersPanel(settings) { 33510 return useHasDuotoneControl(settings); 33511 } 33512 function useHasDuotoneControl(settings) { 33513 return settings.color.customDuotone || settings.color.defaultDuotone || settings.color.duotone.length > 0; 33514 } 33515 function FiltersToolsPanel({ 33516 resetAllFilter, 33517 onChange, 33518 value, 33519 panelId, 33520 children 33521 }) { 33522 const dropdownMenuProps = useToolsPanelDropdownMenuProps(); 33523 const resetAll = () => { 33524 const updatedValue = resetAllFilter(value); 33525 onChange(updatedValue); 33526 }; 33527 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 33528 label: (0,external_wp_i18n_namespaceObject._x)('Filters', 'Name for applying graphical effects'), 33529 resetAll: resetAll, 33530 panelId: panelId, 33531 dropdownMenuProps: dropdownMenuProps, 33532 children: children 33533 }); 33534 } 33535 const filters_panel_DEFAULT_CONTROLS = { 33536 duotone: true 33537 }; 33538 const filters_panel_popoverProps = { 33539 placement: 'left-start', 33540 offset: 36, 33541 shift: true, 33542 className: 'block-editor-duotone-control__popover', 33543 headerTitle: (0,external_wp_i18n_namespaceObject.__)('Duotone') 33544 }; 33545 const LabeledColorIndicator = ({ 33546 indicator, 33547 label 33548 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 33549 justify: "flex-start", 33550 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalZStack, { 33551 isLayered: false, 33552 offset: -8, 33553 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Flex, { 33554 expanded: false, 33555 children: indicator === 'unset' || !indicator ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ColorIndicator, { 33556 className: "block-editor-duotone-control__unset-indicator" 33557 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DuotoneSwatch, { 33558 values: indicator 33559 }) 33560 }) 33561 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 33562 title: label, 33563 children: label 33564 })] 33565 }); 33566 function FiltersPanel({ 33567 as: Wrapper = FiltersToolsPanel, 33568 value, 33569 onChange, 33570 inheritedValue = value, 33571 settings, 33572 panelId, 33573 defaultControls = filters_panel_DEFAULT_CONTROLS 33574 }) { 33575 const decodeValue = rawValue => getValueFromVariable({ 33576 settings 33577 }, '', rawValue); 33578 33579 // Duotone 33580 const hasDuotoneEnabled = useHasDuotoneControl(settings); 33581 const duotonePalette = useMultiOriginColorPresets(settings, { 33582 presetSetting: 'duotone', 33583 defaultSetting: 'defaultDuotone' 33584 }); 33585 const colorPalette = useMultiOriginColorPresets(settings, { 33586 presetSetting: 'palette', 33587 defaultSetting: 'defaultPalette' 33588 }); 33589 const duotone = decodeValue(inheritedValue?.filter?.duotone); 33590 const setDuotone = newValue => { 33591 const duotonePreset = duotonePalette.find(({ 33592 colors 33593 }) => { 33594 return colors === newValue; 33595 }); 33596 const settedValue = duotonePreset ? `var:preset|duotone|$duotonePreset.slug}` : newValue; 33597 onChange(setImmutably(value, ['filter', 'duotone'], settedValue)); 33598 }; 33599 const hasDuotone = () => !!value?.filter?.duotone; 33600 const resetDuotone = () => setDuotone(undefined); 33601 const resetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(previousValue => { 33602 return { 33603 ...previousValue, 33604 filter: { 33605 ...previousValue.filter, 33606 duotone: undefined 33607 } 33608 }; 33609 }, []); 33610 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Wrapper, { 33611 resetAllFilter: resetAllFilter, 33612 value: value, 33613 onChange: onChange, 33614 panelId: panelId, 33615 children: hasDuotoneEnabled && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 33616 label: (0,external_wp_i18n_namespaceObject.__)('Duotone'), 33617 hasValue: hasDuotone, 33618 onDeselect: resetDuotone, 33619 isShownByDefault: defaultControls.duotone, 33620 panelId: panelId, 33621 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 33622 popoverProps: filters_panel_popoverProps, 33623 className: "block-editor-global-styles-filters-panel__dropdown", 33624 renderToggle: ({ 33625 onToggle, 33626 isOpen 33627 }) => { 33628 const toggleProps = { 33629 onClick: onToggle, 33630 className: dist_clsx({ 33631 'is-open': isOpen 33632 }), 33633 'aria-expanded': isOpen 33634 }; 33635 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalItemGroup, { 33636 isBordered: true, 33637 isSeparated: true, 33638 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 33639 __next40pxDefaultSize: true, 33640 ...toggleProps, 33641 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LabeledColorIndicator, { 33642 indicator: duotone, 33643 label: (0,external_wp_i18n_namespaceObject.__)('Duotone') 33644 }) 33645 }) 33646 }); 33647 }, 33648 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalDropdownContentWrapper, { 33649 paddingSize: "small", 33650 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuGroup, { 33651 label: (0,external_wp_i18n_namespaceObject.__)('Duotone'), 33652 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 33653 children: (0,external_wp_i18n_namespaceObject.__)('Create a two-tone color effect without losing your original image.') 33654 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DuotonePicker, { 33655 colorPalette: colorPalette, 33656 duotonePalette: duotonePalette 33657 // TODO: Re-enable both when custom colors are supported for block-level styles. 33658 , 33659 disableCustomColors: true, 33660 disableCustomDuotone: true, 33661 value: duotone, 33662 onChange: setDuotone 33663 })] 33664 }) 33665 }) 33666 }) 33667 }) 33668 }); 33669 } 33670 33671 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/duotone.js 33672 /** 33673 * External dependencies 33674 */ 33675 33676 33677 33678 /** 33679 * WordPress dependencies 33680 */ 33681 33682 33683 33684 33685 33686 /** 33687 * Internal dependencies 33688 */ 33689 33690 33691 33692 33693 33694 33695 33696 33697 33698 33699 33700 const duotone_EMPTY_ARRAY = []; 33701 33702 // Safari does not always update the duotone filter when the duotone colors 33703 // are changed. This browser check is later used to force a re-render of the block 33704 // element to ensure the duotone filter is updated. The check is included at the 33705 // root of this file as it only needs to be run once per page load. 33706 const isSafari = window?.navigator.userAgent && window.navigator.userAgent.includes('Safari') && !window.navigator.userAgent.includes('Chrome') && !window.navigator.userAgent.includes('Chromium'); 33707 k([names]); 33708 function useMultiOriginPresets({ 33709 presetSetting, 33710 defaultSetting 33711 }) { 33712 const [enableDefault, userPresets, themePresets, defaultPresets] = use_settings_useSettings(defaultSetting, `$presetSetting}.custom`, `$presetSetting}.theme`, `$presetSetting}.default`); 33713 return (0,external_wp_element_namespaceObject.useMemo)(() => [...(userPresets || duotone_EMPTY_ARRAY), ...(themePresets || duotone_EMPTY_ARRAY), ...(enableDefault && defaultPresets || duotone_EMPTY_ARRAY)], [enableDefault, userPresets, themePresets, defaultPresets]); 33714 } 33715 function getColorsFromDuotonePreset(duotone, duotonePalette) { 33716 if (!duotone) { 33717 return; 33718 } 33719 const preset = duotonePalette?.find(({ 33720 slug 33721 }) => { 33722 return duotone === `var:preset|duotone|$slug}`; 33723 }); 33724 return preset ? preset.colors : undefined; 33725 } 33726 function getDuotonePresetFromColors(colors, duotonePalette) { 33727 if (!colors || !Array.isArray(colors)) { 33728 return; 33729 } 33730 const preset = duotonePalette?.find(duotonePreset => { 33731 return duotonePreset?.colors?.every((val, index) => val === colors[index]); 33732 }); 33733 return preset ? `var:preset|duotone|$preset.slug}` : undefined; 33734 } 33735 function DuotonePanelPure({ 33736 style, 33737 setAttributes, 33738 name 33739 }) { 33740 const duotoneStyle = style?.color?.duotone; 33741 const settings = useBlockSettings(name); 33742 const blockEditingMode = useBlockEditingMode(); 33743 const duotonePalette = useMultiOriginPresets({ 33744 presetSetting: 'color.duotone', 33745 defaultSetting: 'color.defaultDuotone' 33746 }); 33747 const colorPalette = useMultiOriginPresets({ 33748 presetSetting: 'color.palette', 33749 defaultSetting: 'color.defaultPalette' 33750 }); 33751 const [enableCustomColors, enableCustomDuotone] = use_settings_useSettings('color.custom', 'color.customDuotone'); 33752 const disableCustomColors = !enableCustomColors; 33753 const disableCustomDuotone = !enableCustomDuotone || colorPalette?.length === 0 && disableCustomColors; 33754 if (duotonePalette?.length === 0 && disableCustomDuotone) { 33755 return null; 33756 } 33757 if (blockEditingMode !== 'default') { 33758 return null; 33759 } 33760 const duotonePresetOrColors = !Array.isArray(duotoneStyle) ? getColorsFromDuotonePreset(duotoneStyle, duotonePalette) : duotoneStyle; 33761 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 33762 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 33763 group: "filter", 33764 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FiltersPanel, { 33765 value: { 33766 filter: { 33767 duotone: duotonePresetOrColors 33768 } 33769 }, 33770 onChange: newDuotone => { 33771 const newStyle = { 33772 ...style, 33773 color: { 33774 ...newDuotone?.filter 33775 } 33776 }; 33777 setAttributes({ 33778 style: newStyle 33779 }); 33780 }, 33781 settings: settings 33782 }) 33783 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls, { 33784 group: "block", 33785 __experimentalShareWithChildBlocks: true, 33786 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(duotone_control, { 33787 duotonePalette: duotonePalette, 33788 colorPalette: colorPalette, 33789 disableCustomDuotone: disableCustomDuotone, 33790 disableCustomColors: disableCustomColors, 33791 value: duotonePresetOrColors, 33792 onChange: newDuotone => { 33793 const maybePreset = getDuotonePresetFromColors(newDuotone, duotonePalette); 33794 const newStyle = { 33795 ...style, 33796 color: { 33797 ...style?.color, 33798 duotone: maybePreset !== null && maybePreset !== void 0 ? maybePreset : newDuotone // use preset or fallback to custom colors. 33799 } 33800 }; 33801 setAttributes({ 33802 style: newStyle 33803 }); 33804 }, 33805 settings: settings 33806 }) 33807 })] 33808 }); 33809 } 33810 /* harmony default export */ const duotone = ({ 33811 shareWithChildBlocks: true, 33812 edit: DuotonePanelPure, 33813 useBlockProps: duotone_useBlockProps, 33814 attributeKeys: ['style'], 33815 hasSupport(name) { 33816 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, 'filter.duotone'); 33817 } 33818 }); 33819 33820 /** 33821 * Filters registered block settings, extending attributes to include 33822 * the `duotone` attribute. 33823 * 33824 * @param {Object} settings Original block settings. 33825 * 33826 * @return {Object} Filtered block settings. 33827 */ 33828 function addDuotoneAttributes(settings) { 33829 // Previous `color.__experimentalDuotone` support flag is migrated via 33830 // block_type_metadata_settings filter in `lib/block-supports/duotone.php`. 33831 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, 'filter.duotone')) { 33832 return settings; 33833 } 33834 33835 // Allow blocks to specify their own attribute definition with default 33836 // values if needed. 33837 if (!settings.attributes.style) { 33838 Object.assign(settings.attributes, { 33839 style: { 33840 type: 'object' 33841 } 33842 }); 33843 } 33844 return settings; 33845 } 33846 function useDuotoneStyles({ 33847 clientId, 33848 id: filterId, 33849 selector: duotoneSelector, 33850 attribute: duotoneAttr 33851 }) { 33852 const duotonePalette = useMultiOriginPresets({ 33853 presetSetting: 'color.duotone', 33854 defaultSetting: 'color.defaultDuotone' 33855 }); 33856 33857 // Possible values for duotone attribute: 33858 // 1. Array of colors - e.g. ['#000000', '#ffffff']. 33859 // 2. Variable for an existing Duotone preset - e.g. 'var:preset|duotone|green-blue' or 'var(--wp--preset--duotone--green-blue)'' 33860 // 3. A CSS string - e.g. 'unset' to remove globally applied duotone. 33861 const isCustom = Array.isArray(duotoneAttr); 33862 const duotonePreset = isCustom ? undefined : getColorsFromDuotonePreset(duotoneAttr, duotonePalette); 33863 const isPreset = typeof duotoneAttr === 'string' && duotonePreset; 33864 const isCSS = typeof duotoneAttr === 'string' && !isPreset; 33865 33866 // Match the structure of WP_Duotone_Gutenberg::render_duotone_support() in PHP. 33867 let colors = null; 33868 if (isPreset) { 33869 // Array of colors. 33870 colors = duotonePreset; 33871 } else if (isCSS) { 33872 // CSS filter property string (e.g. 'unset'). 33873 colors = duotoneAttr; 33874 } else if (isCustom) { 33875 // Array of colors. 33876 colors = duotoneAttr; 33877 } 33878 33879 // Build the CSS selectors to which the filter will be applied. 33880 const selectors = duotoneSelector.split(','); 33881 const selectorsScoped = selectors.map(selectorPart => { 33882 // Assuming the selector part is a subclass selector (not a tag name) 33883 // so we can prepend the filter id class. If we want to support elements 33884 // such as `img` or namespaces, we'll need to add a case for that here. 33885 return `.$filterId}$selectorPart.trim()}`; 33886 }); 33887 const selector = selectorsScoped.join(', '); 33888 const isValidFilter = Array.isArray(colors) || colors === 'unset'; 33889 usePrivateStyleOverride(isValidFilter ? { 33890 css: colors !== 'unset' ? getDuotoneStylesheet(selector, filterId) : getDuotoneUnsetStylesheet(selector), 33891 __unstableType: 'presets' 33892 } : undefined); 33893 usePrivateStyleOverride(isValidFilter ? { 33894 assets: colors !== 'unset' ? getDuotoneFilter(filterId, colors) : '', 33895 __unstableType: 'svgs' 33896 } : undefined); 33897 const blockElement = useBlockElement(clientId); 33898 (0,external_wp_element_namespaceObject.useEffect)(() => { 33899 if (!isValidFilter) { 33900 return; 33901 } 33902 33903 // Safari does not always update the duotone filter when the duotone 33904 // colors are changed. When using Safari, force the block element to be 33905 // repainted by the browser to ensure any changes are reflected 33906 // visually. This logic matches that used on the site frontend in 33907 // `block-supports/duotone.php`. 33908 if (blockElement && isSafari) { 33909 const display = blockElement.style.display; 33910 // Switch to `inline-block` to force a repaint. In the editor, 33911 // `inline-block` is used instead of `none` to ensure that scroll 33912 // position is not affected, as `none` results in the editor 33913 // scrolling to the top of the block. 33914 blockElement.style.display = 'inline-block'; 33915 // Simply accessing el.offsetHeight flushes layout and style changes 33916 // in WebKit without having to wait for setTimeout. 33917 // eslint-disable-next-line no-unused-expressions 33918 blockElement.offsetHeight; 33919 blockElement.style.display = display; 33920 } 33921 // `colors` must be a dependency so this effect runs when the colors 33922 // change in Safari. 33923 }, [isValidFilter, blockElement, colors]); 33924 } 33925 function duotone_useBlockProps({ 33926 clientId, 33927 name, 33928 style 33929 }) { 33930 const id = (0,external_wp_compose_namespaceObject.useInstanceId)(duotone_useBlockProps); 33931 const selector = (0,external_wp_element_namespaceObject.useMemo)(() => { 33932 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(name); 33933 if (blockType) { 33934 // Backwards compatibility for `supports.color.__experimentalDuotone` 33935 // is provided via the `block_type_metadata_settings` filter. If 33936 // `supports.filter.duotone` has not been set and the 33937 // experimental property has been, the experimental property 33938 // value is copied into `supports.filter.duotone`. 33939 const duotoneSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, 'filter.duotone', false); 33940 if (!duotoneSupport) { 33941 return null; 33942 } 33943 33944 // If the experimental duotone support was set, that value is 33945 // to be treated as a selector and requires scoping. 33946 const experimentalDuotone = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, 'color.__experimentalDuotone', false); 33947 if (experimentalDuotone) { 33948 const rootSelector = getBlockCSSSelector(blockType); 33949 return typeof experimentalDuotone === 'string' ? scopeSelector(rootSelector, experimentalDuotone) : rootSelector; 33950 } 33951 33952 // Regular filter.duotone support uses filter.duotone selectors with fallbacks. 33953 return getBlockCSSSelector(blockType, 'filter.duotone', { 33954 fallback: true 33955 }); 33956 } 33957 }, [name]); 33958 const attribute = style?.color?.duotone; 33959 const filterClass = `wp-duotone-$id}`; 33960 const shouldRender = selector && attribute; 33961 useDuotoneStyles({ 33962 clientId, 33963 id: filterClass, 33964 selector, 33965 attribute 33966 }); 33967 return { 33968 className: shouldRender ? filterClass : '' 33969 }; 33970 } 33971 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/editor/duotone/add-attributes', addDuotoneAttributes); 33972 33973 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-block-display-information/index.js 33974 /** 33975 * WordPress dependencies 33976 */ 33977 33978 33979 33980 33981 /** 33982 * Internal dependencies 33983 */ 33984 33985 33986 /** @typedef {import('@wordpress/blocks').WPIcon} WPIcon */ 33987 33988 /** 33989 * Contains basic block's information for display reasons. 33990 * 33991 * @typedef {Object} WPBlockDisplayInformation 33992 * 33993 * @property {boolean} isSynced True if is a reusable block or template part 33994 * @property {string} title Human-readable block type label. 33995 * @property {WPIcon} icon Block type icon. 33996 * @property {string} description A detailed block type description. 33997 * @property {string} anchor HTML anchor. 33998 * @property {name} name A custom, human readable name for the block. 33999 */ 34000 34001 /** 34002 * Get the display label for a block's position type. 34003 * 34004 * @param {Object} attributes Block attributes. 34005 * @return {string} The position type label. 34006 */ 34007 function getPositionTypeLabel(attributes) { 34008 const positionType = attributes?.style?.position?.type; 34009 if (positionType === 'sticky') { 34010 return (0,external_wp_i18n_namespaceObject.__)('Sticky'); 34011 } 34012 if (positionType === 'fixed') { 34013 return (0,external_wp_i18n_namespaceObject.__)('Fixed'); 34014 } 34015 return null; 34016 } 34017 34018 /** 34019 * Hook used to try to find a matching block variation and return 34020 * the appropriate information for display reasons. In order to 34021 * to try to find a match we need to things: 34022 * 1. Block's client id to extract it's current attributes. 34023 * 2. A block variation should have set `isActive` prop to a proper function. 34024 * 34025 * If for any reason a block variation match cannot be found, 34026 * the returned information come from the Block Type. 34027 * If no blockType is found with the provided clientId, returns null. 34028 * 34029 * @param {string} clientId Block's client id. 34030 * @return {?WPBlockDisplayInformation} Block's display information, or `null` when the block or its type not found. 34031 */ 34032 34033 function useBlockDisplayInformation(clientId) { 34034 return (0,external_wp_data_namespaceObject.useSelect)(select => { 34035 if (!clientId) { 34036 return null; 34037 } 34038 const { 34039 getBlockName, 34040 getBlockAttributes 34041 } = select(store); 34042 const { 34043 getBlockType, 34044 getActiveBlockVariation 34045 } = select(external_wp_blocks_namespaceObject.store); 34046 const blockName = getBlockName(clientId); 34047 const blockType = getBlockType(blockName); 34048 if (!blockType) { 34049 return null; 34050 } 34051 const attributes = getBlockAttributes(clientId); 34052 const match = getActiveBlockVariation(blockName, attributes); 34053 const isSynced = (0,external_wp_blocks_namespaceObject.isReusableBlock)(blockType) || (0,external_wp_blocks_namespaceObject.isTemplatePart)(blockType); 34054 const syncedTitle = isSynced ? (0,external_wp_blocks_namespaceObject.__experimentalGetBlockLabel)(blockType, attributes) : undefined; 34055 const title = syncedTitle || blockType.title; 34056 const positionLabel = getPositionTypeLabel(attributes); 34057 const blockTypeInfo = { 34058 isSynced, 34059 title, 34060 icon: blockType.icon, 34061 description: blockType.description, 34062 anchor: attributes?.anchor, 34063 positionLabel, 34064 positionType: attributes?.style?.position?.type, 34065 name: attributes?.metadata?.name 34066 }; 34067 if (!match) { 34068 return blockTypeInfo; 34069 } 34070 return { 34071 isSynced, 34072 title: match.title || blockType.title, 34073 icon: match.icon || blockType.icon, 34074 description: match.description || blockType.description, 34075 anchor: attributes?.anchor, 34076 positionLabel, 34077 positionType: attributes?.style?.position?.type, 34078 name: attributes?.metadata?.name 34079 }; 34080 }, [clientId]); 34081 } 34082 34083 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/position.js 34084 /** 34085 * External dependencies 34086 */ 34087 34088 34089 /** 34090 * WordPress dependencies 34091 */ 34092 34093 34094 34095 34096 34097 34098 34099 /** 34100 * Internal dependencies 34101 */ 34102 34103 34104 34105 34106 34107 34108 const POSITION_SUPPORT_KEY = 'position'; 34109 const DEFAULT_OPTION = { 34110 key: 'default', 34111 value: '', 34112 name: (0,external_wp_i18n_namespaceObject.__)('Default') 34113 }; 34114 const STICKY_OPTION = { 34115 key: 'sticky', 34116 value: 'sticky', 34117 name: (0,external_wp_i18n_namespaceObject._x)('Sticky', 'Name for the value of the CSS position property'), 34118 hint: (0,external_wp_i18n_namespaceObject.__)('The block will stick to the top of the window instead of scrolling.') 34119 }; 34120 const FIXED_OPTION = { 34121 key: 'fixed', 34122 value: 'fixed', 34123 name: (0,external_wp_i18n_namespaceObject._x)('Fixed', 'Name for the value of the CSS position property'), 34124 hint: (0,external_wp_i18n_namespaceObject.__)('The block will not move when the page is scrolled.') 34125 }; 34126 const POSITION_SIDES = ['top', 'right', 'bottom', 'left']; 34127 const VALID_POSITION_TYPES = ['sticky', 'fixed']; 34128 34129 /** 34130 * Get calculated position CSS. 34131 * 34132 * @param {Object} props Component props. 34133 * @param {string} props.selector Selector to use. 34134 * @param {Object} props.style Style object. 34135 * @return {string} The generated CSS rules. 34136 */ 34137 function getPositionCSS({ 34138 selector, 34139 style 34140 }) { 34141 let output = ''; 34142 const { 34143 type: positionType 34144 } = style?.position || {}; 34145 if (!VALID_POSITION_TYPES.includes(positionType)) { 34146 return output; 34147 } 34148 output += `$selector} {`; 34149 output += `position: $positionType};`; 34150 POSITION_SIDES.forEach(side => { 34151 if (style?.position?.[side] !== undefined) { 34152 output += `$side}: $style.position[side]};`; 34153 } 34154 }); 34155 if (positionType === 'sticky' || positionType === 'fixed') { 34156 // TODO: Replace hard-coded z-index value with a z-index preset approach in theme.json. 34157 output += `z-index: 10`; 34158 } 34159 output += `}`; 34160 return output; 34161 } 34162 34163 /** 34164 * Determines if there is sticky position support. 34165 * 34166 * @param {string|Object} blockType Block name or Block Type object. 34167 * 34168 * @return {boolean} Whether there is support. 34169 */ 34170 function hasStickyPositionSupport(blockType) { 34171 const support = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, POSITION_SUPPORT_KEY); 34172 return !!(true === support || support?.sticky); 34173 } 34174 34175 /** 34176 * Determines if there is fixed position support. 34177 * 34178 * @param {string|Object} blockType Block name or Block Type object. 34179 * 34180 * @return {boolean} Whether there is support. 34181 */ 34182 function hasFixedPositionSupport(blockType) { 34183 const support = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, POSITION_SUPPORT_KEY); 34184 return !!(true === support || support?.fixed); 34185 } 34186 34187 /** 34188 * Determines if there is position support. 34189 * 34190 * @param {string|Object} blockType Block name or Block Type object. 34191 * 34192 * @return {boolean} Whether there is support. 34193 */ 34194 function hasPositionSupport(blockType) { 34195 const support = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, POSITION_SUPPORT_KEY); 34196 return !!support; 34197 } 34198 34199 /** 34200 * Checks if there is a current value in the position block support attributes. 34201 * 34202 * @param {Object} props Block props. 34203 * @return {boolean} Whether or not the block has a position value set. 34204 */ 34205 function hasPositionValue(props) { 34206 return props.attributes.style?.position?.type !== undefined; 34207 } 34208 34209 /** 34210 * Checks if the block is currently set to a sticky or fixed position. 34211 * This check is helpful for determining how to position block toolbars or other elements. 34212 * 34213 * @param {Object} attributes Block attributes. 34214 * @return {boolean} Whether or not the block is set to a sticky or fixed position. 34215 */ 34216 function hasStickyOrFixedPositionValue(attributes) { 34217 const positionType = attributes?.style?.position?.type; 34218 return positionType === 'sticky' || positionType === 'fixed'; 34219 } 34220 34221 /** 34222 * Resets the position block support attributes. This can be used when disabling 34223 * the position support controls for a block via a `ToolsPanel`. 34224 * 34225 * @param {Object} props Block props. 34226 * @param {Object} props.attributes Block's attributes. 34227 * @param {Object} props.setAttributes Function to set block's attributes. 34228 */ 34229 function resetPosition({ 34230 attributes = {}, 34231 setAttributes 34232 }) { 34233 const { 34234 style = {} 34235 } = attributes; 34236 setAttributes({ 34237 style: cleanEmptyObject({ 34238 ...style, 34239 position: { 34240 ...style?.position, 34241 type: undefined, 34242 top: undefined, 34243 right: undefined, 34244 bottom: undefined, 34245 left: undefined 34246 } 34247 }) 34248 }); 34249 } 34250 34251 /** 34252 * Custom hook that checks if position settings have been disabled. 34253 * 34254 * @param {string} name The name of the block. 34255 * 34256 * @return {boolean} Whether padding setting is disabled. 34257 */ 34258 function useIsPositionDisabled({ 34259 name: blockName 34260 } = {}) { 34261 const [allowFixed, allowSticky] = use_settings_useSettings('position.fixed', 'position.sticky'); 34262 const isDisabled = !allowFixed && !allowSticky; 34263 return !hasPositionSupport(blockName) || isDisabled; 34264 } 34265 34266 /* 34267 * Position controls rendered in an inspector control panel. 34268 * 34269 * @param {Object} props 34270 * 34271 * @return {Element} Position panel. 34272 */ 34273 function PositionPanelPure({ 34274 style = {}, 34275 clientId, 34276 name: blockName, 34277 setAttributes 34278 }) { 34279 const allowFixed = hasFixedPositionSupport(blockName); 34280 const allowSticky = hasStickyPositionSupport(blockName); 34281 const value = style?.position?.type; 34282 const { 34283 firstParentClientId 34284 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 34285 const { 34286 getBlockParents 34287 } = select(store); 34288 const parents = getBlockParents(clientId); 34289 return { 34290 firstParentClientId: parents[parents.length - 1] 34291 }; 34292 }, [clientId]); 34293 const blockInformation = useBlockDisplayInformation(firstParentClientId); 34294 const stickyHelpText = allowSticky && value === STICKY_OPTION.value && blockInformation ? (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: the name of the parent block. */ 34295 (0,external_wp_i18n_namespaceObject.__)('The block will stick to the scrollable area of the parent %s block.'), blockInformation.title) : null; 34296 const options = (0,external_wp_element_namespaceObject.useMemo)(() => { 34297 const availableOptions = [DEFAULT_OPTION]; 34298 // Display options if they are allowed, or if a block already has a valid value set. 34299 // This allows for a block to be switched off from a position type that is not allowed. 34300 if (allowSticky || value === STICKY_OPTION.value) { 34301 availableOptions.push(STICKY_OPTION); 34302 } 34303 if (allowFixed || value === FIXED_OPTION.value) { 34304 availableOptions.push(FIXED_OPTION); 34305 } 34306 return availableOptions; 34307 }, [allowFixed, allowSticky, value]); 34308 const onChangeType = next => { 34309 // For now, use a hard-coded `0px` value for the position. 34310 // `0px` is preferred over `0` as it can be used in `calc()` functions. 34311 // In the future, it could be useful to allow for an offset value. 34312 const placementValue = '0px'; 34313 const newStyle = { 34314 ...style, 34315 position: { 34316 ...style?.position, 34317 type: next, 34318 top: next === 'sticky' || next === 'fixed' ? placementValue : undefined 34319 } 34320 }; 34321 setAttributes({ 34322 style: utils_cleanEmptyObject(newStyle) 34323 }); 34324 }; 34325 const selectedOption = value ? options.find(option => option.value === value) || DEFAULT_OPTION : DEFAULT_OPTION; 34326 34327 // Only display position controls if there is at least one option to choose from. 34328 return external_wp_element_namespaceObject.Platform.select({ 34329 web: options.length > 1 ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 34330 group: "position", 34331 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl, { 34332 __nextHasNoMarginBottom: true, 34333 help: stickyHelpText, 34334 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CustomSelectControl, { 34335 __next40pxDefaultSize: true, 34336 label: (0,external_wp_i18n_namespaceObject.__)('Position'), 34337 hideLabelFromVision: true, 34338 describedBy: (0,external_wp_i18n_namespaceObject.sprintf)( 34339 // translators: %s: Currently selected position. 34340 (0,external_wp_i18n_namespaceObject.__)('Currently selected position: %s'), selectedOption.name), 34341 options: options, 34342 value: selectedOption, 34343 onChange: ({ 34344 selectedItem 34345 }) => { 34346 onChangeType(selectedItem.value); 34347 }, 34348 size: "__unstable-large" 34349 }) 34350 }) 34351 }) : null, 34352 native: null 34353 }); 34354 } 34355 /* harmony default export */ const position = ({ 34356 edit: function Edit(props) { 34357 const isPositionDisabled = useIsPositionDisabled(props); 34358 if (isPositionDisabled) { 34359 return null; 34360 } 34361 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PositionPanelPure, { 34362 ...props 34363 }); 34364 }, 34365 useBlockProps: position_useBlockProps, 34366 attributeKeys: ['style'], 34367 hasSupport(name) { 34368 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, POSITION_SUPPORT_KEY); 34369 } 34370 }); 34371 function position_useBlockProps({ 34372 name, 34373 style 34374 }) { 34375 const hasPositionBlockSupport = (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, POSITION_SUPPORT_KEY); 34376 const isPositionDisabled = useIsPositionDisabled({ 34377 name 34378 }); 34379 const allowPositionStyles = hasPositionBlockSupport && !isPositionDisabled; 34380 const id = (0,external_wp_compose_namespaceObject.useInstanceId)(position_useBlockProps); 34381 34382 // Higher specificity to override defaults in editor UI. 34383 const positionSelector = `.wp-container-$id}.wp-container-$id}`; 34384 34385 // Get CSS string for the current position values. 34386 let css; 34387 if (allowPositionStyles) { 34388 css = getPositionCSS({ 34389 selector: positionSelector, 34390 style 34391 }) || ''; 34392 } 34393 34394 // Attach a `wp-container-` id-based class name. 34395 const className = dist_clsx({ 34396 [`wp-container-$id}`]: allowPositionStyles && !!css, 34397 // Only attach a container class if there is generated CSS to be attached. 34398 [`is-position-$style?.position?.type}`]: allowPositionStyles && !!css && !!style?.position?.type 34399 }); 34400 useStyleOverride({ 34401 css 34402 }); 34403 return { 34404 className 34405 }; 34406 } 34407 34408 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/use-global-styles-output.js 34409 /** 34410 * WordPress dependencies 34411 */ 34412 34413 34414 34415 34416 34417 34418 /** 34419 * Internal dependencies 34420 */ 34421 34422 34423 34424 34425 34426 34427 34428 34429 34430 34431 34432 34433 34434 // Elements that rely on class names in their selectors. 34435 const ELEMENT_CLASS_NAMES = { 34436 button: 'wp-element-button', 34437 caption: 'wp-element-caption' 34438 }; 34439 34440 // List of block support features that can have their related styles 34441 // generated under their own feature level selector rather than the block's. 34442 const BLOCK_SUPPORT_FEATURE_LEVEL_SELECTORS = { 34443 __experimentalBorder: 'border', 34444 color: 'color', 34445 spacing: 'spacing', 34446 typography: 'typography' 34447 }; 34448 const { 34449 kebabCase: use_global_styles_output_kebabCase 34450 } = unlock(external_wp_components_namespaceObject.privateApis); 34451 34452 /** 34453 * Transform given preset tree into a set of style declarations. 34454 * 34455 * @param {Object} blockPresets 34456 * @param {Object} mergedSettings Merged theme.json settings. 34457 * 34458 * @return {Array<Object>} An array of style declarations. 34459 */ 34460 function getPresetsDeclarations(blockPresets = {}, mergedSettings) { 34461 return PRESET_METADATA.reduce((declarations, { 34462 path, 34463 valueKey, 34464 valueFunc, 34465 cssVarInfix 34466 }) => { 34467 const presetByOrigin = getValueFromObjectPath(blockPresets, path, []); 34468 ['default', 'theme', 'custom'].forEach(origin => { 34469 if (presetByOrigin[origin]) { 34470 presetByOrigin[origin].forEach(value => { 34471 if (valueKey && !valueFunc) { 34472 declarations.push(`--wp--preset--$cssVarInfix}--$use_global_styles_output_kebabCase(value.slug)}: $value[valueKey]}`); 34473 } else if (valueFunc && typeof valueFunc === 'function') { 34474 declarations.push(`--wp--preset--$cssVarInfix}--$use_global_styles_output_kebabCase(value.slug)}: $valueFunc(value, mergedSettings)}`); 34475 } 34476 }); 34477 } 34478 }); 34479 return declarations; 34480 }, []); 34481 } 34482 34483 /** 34484 * Transform given preset tree into a set of preset class declarations. 34485 * 34486 * @param {?string} blockSelector 34487 * @param {Object} blockPresets 34488 * @return {string} CSS declarations for the preset classes. 34489 */ 34490 function getPresetsClasses(blockSelector = '*', blockPresets = {}) { 34491 return PRESET_METADATA.reduce((declarations, { 34492 path, 34493 cssVarInfix, 34494 classes 34495 }) => { 34496 if (!classes) { 34497 return declarations; 34498 } 34499 const presetByOrigin = getValueFromObjectPath(blockPresets, path, []); 34500 ['default', 'theme', 'custom'].forEach(origin => { 34501 if (presetByOrigin[origin]) { 34502 presetByOrigin[origin].forEach(({ 34503 slug 34504 }) => { 34505 classes.forEach(({ 34506 classSuffix, 34507 propertyName 34508 }) => { 34509 const classSelectorToUse = `.has-$use_global_styles_output_kebabCase(slug)}-$classSuffix}`; 34510 const selectorToUse = blockSelector.split(',') // Selector can be "h1, h2, h3" 34511 .map(selector => `$selector}$classSelectorToUse}`).join(','); 34512 const value = `var(--wp--preset--$cssVarInfix}--$use_global_styles_output_kebabCase(slug)})`; 34513 declarations += `$selectorToUse}{$propertyName}: $value} !important;}`; 34514 }); 34515 }); 34516 } 34517 }); 34518 return declarations; 34519 }, ''); 34520 } 34521 function getPresetsSvgFilters(blockPresets = {}) { 34522 return PRESET_METADATA.filter( 34523 // Duotone are the only type of filters for now. 34524 metadata => metadata.path.at(-1) === 'duotone').flatMap(metadata => { 34525 const presetByOrigin = getValueFromObjectPath(blockPresets, metadata.path, {}); 34526 return ['default', 'theme'].filter(origin => presetByOrigin[origin]).flatMap(origin => presetByOrigin[origin].map(preset => getDuotoneFilter(`wp-duotone-$preset.slug}`, preset.colors))).join(''); 34527 }); 34528 } 34529 function flattenTree(input = {}, prefix, token) { 34530 let result = []; 34531 Object.keys(input).forEach(key => { 34532 const newKey = prefix + use_global_styles_output_kebabCase(key.replace('/', '-')); 34533 const newLeaf = input[key]; 34534 if (newLeaf instanceof Object) { 34535 const newPrefix = newKey + token; 34536 result = [...result, ...flattenTree(newLeaf, newPrefix, token)]; 34537 } else { 34538 result.push(`$newKey}: $newLeaf}`); 34539 } 34540 }); 34541 return result; 34542 } 34543 34544 /** 34545 * Gets variation selector string from feature selector. 34546 * 34547 * @param {string} featureSelector The feature selector. 34548 * 34549 * @param {string} styleVariationSelector The style variation selector. 34550 * @return {string} Combined selector string. 34551 */ 34552 function concatFeatureVariationSelectorString(featureSelector, styleVariationSelector) { 34553 const featureSelectors = featureSelector.split(','); 34554 const combinedSelectors = []; 34555 featureSelectors.forEach(selector => { 34556 combinedSelectors.push(`$styleVariationSelector.trim()}$selector.trim()}`); 34557 }); 34558 return combinedSelectors.join(', '); 34559 } 34560 34561 /** 34562 * Generate style declarations for a block's custom feature and subfeature 34563 * selectors. 34564 * 34565 * NOTE: The passed `styles` object will be mutated by this function. 34566 * 34567 * @param {Object} selectors Custom selectors object for a block. 34568 * @param {Object} styles A block's styles object. 34569 * 34570 * @return {Object} Style declarations. 34571 */ 34572 const getFeatureDeclarations = (selectors, styles) => { 34573 const declarations = {}; 34574 Object.entries(selectors).forEach(([feature, selector]) => { 34575 // We're only processing features/subfeatures that have styles. 34576 if (feature === 'root' || !styles?.[feature]) { 34577 return; 34578 } 34579 const isShorthand = typeof selector === 'string'; 34580 34581 // If we have a selector object instead of shorthand process it. 34582 if (!isShorthand) { 34583 Object.entries(selector).forEach(([subfeature, subfeatureSelector]) => { 34584 // Don't process root feature selector yet or any 34585 // subfeature that doesn't have a style. 34586 if (subfeature === 'root' || !styles?.[feature][subfeature]) { 34587 return; 34588 } 34589 34590 // Create a temporary styles object and build 34591 // declarations for subfeature. 34592 const subfeatureStyles = { 34593 [feature]: { 34594 [subfeature]: styles[feature][subfeature] 34595 } 34596 }; 34597 const newDeclarations = getStylesDeclarations(subfeatureStyles); 34598 34599 // Merge new declarations in with any others that 34600 // share the same selector. 34601 declarations[subfeatureSelector] = [...(declarations[subfeatureSelector] || []), ...newDeclarations]; 34602 34603 // Remove the subfeature's style now it will be 34604 // included under its own selector not the block's. 34605 delete styles[feature][subfeature]; 34606 }); 34607 } 34608 34609 // Now subfeatures have been processed and removed, we can 34610 // process root, or shorthand, feature selectors. 34611 if (isShorthand || selector.root) { 34612 const featureSelector = isShorthand ? selector : selector.root; 34613 34614 // Create temporary style object and build declarations for feature. 34615 const featureStyles = { 34616 [feature]: styles[feature] 34617 }; 34618 const newDeclarations = getStylesDeclarations(featureStyles); 34619 34620 // Merge new declarations with any others that share the selector. 34621 declarations[featureSelector] = [...(declarations[featureSelector] || []), ...newDeclarations]; 34622 34623 // Remove the feature from the block's styles now as it will be 34624 // included under its own selector not the block's. 34625 delete styles[feature]; 34626 } 34627 }); 34628 return declarations; 34629 }; 34630 34631 /** 34632 * Transform given style tree into a set of style declarations. 34633 * 34634 * @param {Object} blockStyles Block styles. 34635 * 34636 * @param {string} selector The selector these declarations should attach to. 34637 * 34638 * @param {boolean} useRootPaddingAlign Whether to use CSS custom properties in root selector. 34639 * 34640 * @param {Object} tree A theme.json tree containing layout definitions. 34641 * 34642 * @param {boolean} disableRootPadding Whether to force disable the root padding styles. 34643 * @return {Array} An array of style declarations. 34644 */ 34645 function getStylesDeclarations(blockStyles = {}, selector = '', useRootPaddingAlign, tree = {}, disableRootPadding = false) { 34646 const isRoot = ROOT_BLOCK_SELECTOR === selector; 34647 const output = Object.entries(external_wp_blocks_namespaceObject.__EXPERIMENTAL_STYLE_PROPERTY).reduce((declarations, [key, { 34648 value, 34649 properties, 34650 useEngine, 34651 rootOnly 34652 }]) => { 34653 if (rootOnly && !isRoot) { 34654 return declarations; 34655 } 34656 const pathToValue = value; 34657 if (pathToValue[0] === 'elements' || useEngine) { 34658 return declarations; 34659 } 34660 const styleValue = getValueFromObjectPath(blockStyles, pathToValue); 34661 34662 // Root-level padding styles don't currently support strings with CSS shorthand values. 34663 // This may change: https://github.com/WordPress/gutenberg/issues/40132. 34664 if (key === '--wp--style--root--padding' && (typeof styleValue === 'string' || !useRootPaddingAlign)) { 34665 return declarations; 34666 } 34667 if (properties && typeof styleValue !== 'string') { 34668 Object.entries(properties).forEach(entry => { 34669 const [name, prop] = entry; 34670 if (!getValueFromObjectPath(styleValue, [prop], false)) { 34671 // Do not create a declaration 34672 // for sub-properties that don't have any value. 34673 return; 34674 } 34675 const cssProperty = name.startsWith('--') ? name : use_global_styles_output_kebabCase(name); 34676 declarations.push(`$cssProperty}: ${(0,external_wp_styleEngine_namespaceObject.getCSSValueFromRawStyle)(getValueFromObjectPath(styleValue, [prop]))}`); 34677 }); 34678 } else if (getValueFromObjectPath(blockStyles, pathToValue, false)) { 34679 const cssProperty = key.startsWith('--') ? key : use_global_styles_output_kebabCase(key); 34680 declarations.push(`$cssProperty}: ${(0,external_wp_styleEngine_namespaceObject.getCSSValueFromRawStyle)(getValueFromObjectPath(blockStyles, pathToValue))}`); 34681 } 34682 return declarations; 34683 }, []); 34684 34685 /* 34686 * Preprocess background image values. 34687 * 34688 * Note: As we absorb more and more styles into the engine, we could simplify this function. 34689 * A refactor is for the style engine to handle ref resolution (and possibly defaults) 34690 * via a public util used internally and externally. Theme.json tree and defaults could be passed 34691 * as options. 34692 */ 34693 if (!!blockStyles.background) { 34694 /* 34695 * Resolve dynamic values before they are compiled by the style engine, 34696 * which doesn't (yet) resolve dynamic values. 34697 */ 34698 if (blockStyles.background?.backgroundImage) { 34699 blockStyles.background.backgroundImage = getResolvedValue(blockStyles.background.backgroundImage, tree); 34700 } 34701 34702 /* 34703 * Set default values for block background styles. 34704 * Top-level styles are an exception as they are applied to the body. 34705 */ 34706 if (!isRoot && !!blockStyles.background?.backgroundImage?.id) { 34707 blockStyles = { 34708 ...blockStyles, 34709 background: { 34710 ...blockStyles.background, 34711 ...setBackgroundStyleDefaults(blockStyles.background) 34712 } 34713 }; 34714 } 34715 } 34716 const extraRules = (0,external_wp_styleEngine_namespaceObject.getCSSRules)(blockStyles); 34717 extraRules.forEach(rule => { 34718 // Don't output padding properties if padding variables are set or if we're not editing a full template. 34719 if (isRoot && (useRootPaddingAlign || disableRootPadding) && rule.key.startsWith('padding')) { 34720 return; 34721 } 34722 const cssProperty = rule.key.startsWith('--') ? rule.key : use_global_styles_output_kebabCase(rule.key); 34723 let ruleValue = getResolvedValue(rule.value, tree, null); 34724 34725 // Calculate fluid typography rules where available. 34726 if (cssProperty === 'font-size') { 34727 /* 34728 * getTypographyFontSizeValue() will check 34729 * if fluid typography has been activated and also 34730 * whether the incoming value can be converted to a fluid value. 34731 * Values that already have a "clamp()" function will not pass the test, 34732 * and therefore the original $value will be returned. 34733 */ 34734 ruleValue = getTypographyFontSizeValue({ 34735 size: ruleValue 34736 }, tree?.settings); 34737 } 34738 34739 // For aspect ratio to work, other dimensions rules (and Cover block defaults) must be unset. 34740 // This ensures that a fixed height does not override the aspect ratio. 34741 if (cssProperty === 'aspect-ratio') { 34742 output.push('min-height: unset'); 34743 } 34744 output.push(`$cssProperty}: $ruleValue}`); 34745 }); 34746 return output; 34747 } 34748 34749 /** 34750 * Get generated CSS for layout styles by looking up layout definitions provided 34751 * in theme.json, and outputting common layout styles, and specific blockGap values. 34752 * 34753 * @param {Object} props 34754 * @param {Object} props.layoutDefinitions Layout definitions, keyed by layout type. 34755 * @param {Object} props.style A style object containing spacing values. 34756 * @param {string} props.selector Selector used to group together layout styling rules. 34757 * @param {boolean} props.hasBlockGapSupport Whether or not the theme opts-in to blockGap support. 34758 * @param {boolean} props.hasFallbackGapSupport Whether or not the theme allows fallback gap styles. 34759 * @param {?string} props.fallbackGapValue An optional fallback gap value if no real gap value is available. 34760 * @return {string} Generated CSS rules for the layout styles. 34761 */ 34762 function getLayoutStyles({ 34763 layoutDefinitions = LAYOUT_DEFINITIONS, 34764 style, 34765 selector, 34766 hasBlockGapSupport, 34767 hasFallbackGapSupport, 34768 fallbackGapValue 34769 }) { 34770 let ruleset = ''; 34771 let gapValue = hasBlockGapSupport ? getGapCSSValue(style?.spacing?.blockGap) : ''; 34772 34773 // Ensure a fallback gap value for the root layout definitions, 34774 // and use a fallback value if one is provided for the current block. 34775 if (hasFallbackGapSupport) { 34776 if (selector === ROOT_BLOCK_SELECTOR) { 34777 gapValue = !gapValue ? '0.5em' : gapValue; 34778 } else if (!hasBlockGapSupport && fallbackGapValue) { 34779 gapValue = fallbackGapValue; 34780 } 34781 } 34782 if (gapValue && layoutDefinitions) { 34783 Object.values(layoutDefinitions).forEach(({ 34784 className, 34785 name, 34786 spacingStyles 34787 }) => { 34788 // Allow outputting fallback gap styles for flex layout type when block gap support isn't available. 34789 if (!hasBlockGapSupport && 'flex' !== name && 'grid' !== name) { 34790 return; 34791 } 34792 if (spacingStyles?.length) { 34793 spacingStyles.forEach(spacingStyle => { 34794 const declarations = []; 34795 if (spacingStyle.rules) { 34796 Object.entries(spacingStyle.rules).forEach(([cssProperty, cssValue]) => { 34797 declarations.push(`$cssProperty}: $cssValue ? cssValue : gapValue}`); 34798 }); 34799 } 34800 if (declarations.length) { 34801 let combinedSelector = ''; 34802 if (!hasBlockGapSupport) { 34803 // For fallback gap styles, use lower specificity, to ensure styles do not unintentionally override theme styles. 34804 combinedSelector = selector === ROOT_BLOCK_SELECTOR ? `:where(.$className}$spacingStyle?.selector || ''})` : `:where($selector}.$className}$spacingStyle?.selector || ''})`; 34805 } else { 34806 combinedSelector = selector === ROOT_BLOCK_SELECTOR ? `:root :where(.$className})$spacingStyle?.selector || ''}` : `:root :where($selector}-$className})$spacingStyle?.selector || ''}`; 34807 } 34808 ruleset += `$combinedSelector} { $declarations.join('; ')}; }`; 34809 } 34810 }); 34811 } 34812 }); 34813 // For backwards compatibility, ensure the legacy block gap CSS variable is still available. 34814 if (selector === ROOT_BLOCK_SELECTOR && hasBlockGapSupport) { 34815 ruleset += `$ROOT_CSS_PROPERTIES_SELECTOR} { --wp--style--block-gap: $gapValue}; }`; 34816 } 34817 } 34818 34819 // Output base styles 34820 if (selector === ROOT_BLOCK_SELECTOR && layoutDefinitions) { 34821 const validDisplayModes = ['block', 'flex', 'grid']; 34822 Object.values(layoutDefinitions).forEach(({ 34823 className, 34824 displayMode, 34825 baseStyles 34826 }) => { 34827 if (displayMode && validDisplayModes.includes(displayMode)) { 34828 ruleset += `$selector} .$className} { display:$displayMode}; }`; 34829 } 34830 if (baseStyles?.length) { 34831 baseStyles.forEach(baseStyle => { 34832 const declarations = []; 34833 if (baseStyle.rules) { 34834 Object.entries(baseStyle.rules).forEach(([cssProperty, cssValue]) => { 34835 declarations.push(`$cssProperty}: $cssValue}`); 34836 }); 34837 } 34838 if (declarations.length) { 34839 const combinedSelector = `.$className}$baseStyle?.selector || ''}`; 34840 ruleset += `$combinedSelector} { $declarations.join('; ')}; }`; 34841 } 34842 }); 34843 } 34844 }); 34845 } 34846 return ruleset; 34847 } 34848 const STYLE_KEYS = ['border', 'color', 'dimensions', 'spacing', 'typography', 'filter', 'outline', 'shadow', 'background']; 34849 function pickStyleKeys(treeToPickFrom) { 34850 if (!treeToPickFrom) { 34851 return {}; 34852 } 34853 const entries = Object.entries(treeToPickFrom); 34854 const pickedEntries = entries.filter(([key]) => STYLE_KEYS.includes(key)); 34855 // clone the style objects so that `getFeatureDeclarations` can remove consumed keys from it 34856 const clonedEntries = pickedEntries.map(([key, style]) => [key, JSON.parse(JSON.stringify(style))]); 34857 return Object.fromEntries(clonedEntries); 34858 } 34859 const getNodesWithStyles = (tree, blockSelectors) => { 34860 var _tree$styles$blocks; 34861 const nodes = []; 34862 if (!tree?.styles) { 34863 return nodes; 34864 } 34865 34866 // Top-level. 34867 const styles = pickStyleKeys(tree.styles); 34868 if (styles) { 34869 nodes.push({ 34870 styles, 34871 selector: ROOT_BLOCK_SELECTOR, 34872 // Root selector (body) styles should not be wrapped in `:root where()` to keep 34873 // specificity at (0,0,1) and maintain backwards compatibility. 34874 skipSelectorWrapper: true 34875 }); 34876 } 34877 Object.entries(external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS).forEach(([name, selector]) => { 34878 if (tree.styles?.elements?.[name]) { 34879 nodes.push({ 34880 styles: tree.styles?.elements?.[name], 34881 selector, 34882 // Top level elements that don't use a class name should not receive the 34883 // `:root :where()` wrapper to maintain backwards compatibility. 34884 skipSelectorWrapper: !ELEMENT_CLASS_NAMES[name] 34885 }); 34886 } 34887 }); 34888 34889 // Iterate over blocks: they can have styles & elements. 34890 Object.entries((_tree$styles$blocks = tree.styles?.blocks) !== null && _tree$styles$blocks !== void 0 ? _tree$styles$blocks : {}).forEach(([blockName, node]) => { 34891 var _node$elements; 34892 const blockStyles = pickStyleKeys(node); 34893 if (node?.variations) { 34894 const variations = {}; 34895 Object.entries(node.variations).forEach(([variationName, variation]) => { 34896 var _variation$elements, _variation$blocks; 34897 variations[variationName] = pickStyleKeys(variation); 34898 if (variation?.css) { 34899 variations[variationName].css = variation.css; 34900 } 34901 const variationSelector = blockSelectors[blockName]?.styleVariationSelectors?.[variationName]; 34902 34903 // Process the variation's inner element styles. 34904 // This comes before the inner block styles so the 34905 // element styles within the block type styles take 34906 // precedence over these. 34907 Object.entries((_variation$elements = variation?.elements) !== null && _variation$elements !== void 0 ? _variation$elements : {}).forEach(([element, elementStyles]) => { 34908 if (elementStyles && external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS[element]) { 34909 nodes.push({ 34910 styles: elementStyles, 34911 selector: scopeSelector(variationSelector, external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS[element]) 34912 }); 34913 } 34914 }); 34915 34916 // Process the variations inner block type styles. 34917 Object.entries((_variation$blocks = variation?.blocks) !== null && _variation$blocks !== void 0 ? _variation$blocks : {}).forEach(([variationBlockName, variationBlockStyles]) => { 34918 var _variationBlockStyles; 34919 const variationBlockSelector = scopeSelector(variationSelector, blockSelectors[variationBlockName]?.selector); 34920 const variationDuotoneSelector = scopeSelector(variationSelector, blockSelectors[variationBlockName]?.duotoneSelector); 34921 const variationFeatureSelectors = scopeFeatureSelectors(variationSelector, blockSelectors[variationBlockName]?.featureSelectors); 34922 const variationBlockStyleNodes = pickStyleKeys(variationBlockStyles); 34923 if (variationBlockStyles?.css) { 34924 variationBlockStyleNodes.css = variationBlockStyles.css; 34925 } 34926 nodes.push({ 34927 selector: variationBlockSelector, 34928 duotoneSelector: variationDuotoneSelector, 34929 featureSelectors: variationFeatureSelectors, 34930 fallbackGapValue: blockSelectors[variationBlockName]?.fallbackGapValue, 34931 hasLayoutSupport: blockSelectors[variationBlockName]?.hasLayoutSupport, 34932 styles: variationBlockStyleNodes 34933 }); 34934 34935 // Process element styles for the inner blocks 34936 // of the variation. 34937 Object.entries((_variationBlockStyles = variationBlockStyles.elements) !== null && _variationBlockStyles !== void 0 ? _variationBlockStyles : {}).forEach(([variationBlockElement, variationBlockElementStyles]) => { 34938 if (variationBlockElementStyles && external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS[variationBlockElement]) { 34939 nodes.push({ 34940 styles: variationBlockElementStyles, 34941 selector: scopeSelector(variationBlockSelector, external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS[variationBlockElement]) 34942 }); 34943 } 34944 }); 34945 }); 34946 }); 34947 blockStyles.variations = variations; 34948 } 34949 if (blockSelectors?.[blockName]?.selector) { 34950 nodes.push({ 34951 duotoneSelector: blockSelectors[blockName].duotoneSelector, 34952 fallbackGapValue: blockSelectors[blockName].fallbackGapValue, 34953 hasLayoutSupport: blockSelectors[blockName].hasLayoutSupport, 34954 selector: blockSelectors[blockName].selector, 34955 styles: blockStyles, 34956 featureSelectors: blockSelectors[blockName].featureSelectors, 34957 styleVariationSelectors: blockSelectors[blockName].styleVariationSelectors 34958 }); 34959 } 34960 Object.entries((_node$elements = node?.elements) !== null && _node$elements !== void 0 ? _node$elements : {}).forEach(([elementName, value]) => { 34961 if (value && blockSelectors?.[blockName] && external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS[elementName]) { 34962 nodes.push({ 34963 styles: value, 34964 selector: blockSelectors[blockName]?.selector.split(',').map(sel => { 34965 const elementSelectors = external_wp_blocks_namespaceObject.__EXPERIMENTAL_ELEMENTS[elementName].split(','); 34966 return elementSelectors.map(elementSelector => sel + ' ' + elementSelector); 34967 }).join(',') 34968 }); 34969 } 34970 }); 34971 }); 34972 return nodes; 34973 }; 34974 const getNodesWithSettings = (tree, blockSelectors) => { 34975 var _tree$settings$blocks; 34976 const nodes = []; 34977 if (!tree?.settings) { 34978 return nodes; 34979 } 34980 const pickPresets = treeToPickFrom => { 34981 let presets = {}; 34982 PRESET_METADATA.forEach(({ 34983 path 34984 }) => { 34985 const value = getValueFromObjectPath(treeToPickFrom, path, false); 34986 if (value !== false) { 34987 presets = setImmutably(presets, path, value); 34988 } 34989 }); 34990 return presets; 34991 }; 34992 34993 // Top-level. 34994 const presets = pickPresets(tree.settings); 34995 const custom = tree.settings?.custom; 34996 if (Object.keys(presets).length > 0 || custom) { 34997 nodes.push({ 34998 presets, 34999 custom, 35000 selector: ROOT_CSS_PROPERTIES_SELECTOR 35001 }); 35002 } 35003 35004 // Blocks. 35005 Object.entries((_tree$settings$blocks = tree.settings?.blocks) !== null && _tree$settings$blocks !== void 0 ? _tree$settings$blocks : {}).forEach(([blockName, node]) => { 35006 const blockPresets = pickPresets(node); 35007 const blockCustom = node.custom; 35008 if (Object.keys(blockPresets).length > 0 || blockCustom) { 35009 nodes.push({ 35010 presets: blockPresets, 35011 custom: blockCustom, 35012 selector: blockSelectors[blockName]?.selector 35013 }); 35014 } 35015 }); 35016 return nodes; 35017 }; 35018 const toCustomProperties = (tree, blockSelectors) => { 35019 const settings = getNodesWithSettings(tree, blockSelectors); 35020 let ruleset = ''; 35021 settings.forEach(({ 35022 presets, 35023 custom, 35024 selector 35025 }) => { 35026 const declarations = getPresetsDeclarations(presets, tree?.settings); 35027 const customProps = flattenTree(custom, '--wp--custom--', '--'); 35028 if (customProps.length > 0) { 35029 declarations.push(...customProps); 35030 } 35031 if (declarations.length > 0) { 35032 ruleset += `$selector}{$declarations.join(';')};}`; 35033 } 35034 }); 35035 return ruleset; 35036 }; 35037 const toStyles = (tree, blockSelectors, hasBlockGapSupport, hasFallbackGapSupport, disableLayoutStyles = false, disableRootPadding = false, styleOptions = undefined) => { 35038 // These allow opting out of certain sets of styles. 35039 const options = { 35040 blockGap: true, 35041 blockStyles: true, 35042 layoutStyles: true, 35043 marginReset: true, 35044 presets: true, 35045 rootPadding: true, 35046 variationStyles: false, 35047 ...styleOptions 35048 }; 35049 const nodesWithStyles = getNodesWithStyles(tree, blockSelectors); 35050 const nodesWithSettings = getNodesWithSettings(tree, blockSelectors); 35051 const useRootPaddingAlign = tree?.settings?.useRootPaddingAwareAlignments; 35052 const { 35053 contentSize, 35054 wideSize 35055 } = tree?.settings?.layout || {}; 35056 const hasBodyStyles = options.marginReset || options.rootPadding || options.layoutStyles; 35057 let ruleset = ''; 35058 if (options.presets && (contentSize || wideSize)) { 35059 ruleset += `$ROOT_CSS_PROPERTIES_SELECTOR} {`; 35060 ruleset = contentSize ? ruleset + ` --wp--style--global--content-size: $contentSize};` : ruleset; 35061 ruleset = wideSize ? ruleset + ` --wp--style--global--wide-size: $wideSize};` : ruleset; 35062 ruleset += '}'; 35063 } 35064 if (hasBodyStyles) { 35065 /* 35066 * Reset default browser margin on the body element. 35067 * This is set on the body selector **before** generating the ruleset 35068 * from the `theme.json`. This is to ensure that if the `theme.json` declares 35069 * `margin` in its `spacing` declaration for the `body` element then these 35070 * user-generated values take precedence in the CSS cascade. 35071 * @link https://github.com/WordPress/gutenberg/issues/36147. 35072 */ 35073 ruleset += ':where(body) {margin: 0;'; 35074 35075 // Root padding styles should be output for full templates, patterns and template parts. 35076 if (options.rootPadding && useRootPaddingAlign) { 35077 /* 35078 * These rules reproduce the ones from https://github.com/WordPress/gutenberg/blob/79103f124925d1f457f627e154f52a56228ed5ad/lib/class-wp-theme-json-gutenberg.php#L2508 35079 * almost exactly, but for the selectors that target block wrappers in the front end. This code only runs in the editor, so it doesn't need those selectors. 35080 */ 35081 ruleset += `padding-right: 0; padding-left: 0; padding-top: var(--wp--style--root--padding-top); padding-bottom: var(--wp--style--root--padding-bottom) } 35082 .has-global-padding { padding-right: var(--wp--style--root--padding-right); padding-left: var(--wp--style--root--padding-left); } 35083 .has-global-padding > .alignfull { margin-right: calc(var(--wp--style--root--padding-right) * -1); margin-left: calc(var(--wp--style--root--padding-left) * -1); } 35084 .has-global-padding :where(:not(.alignfull.is-layout-flow) > .has-global-padding:not(.wp-block-block, .alignfull)) { padding-right: 0; padding-left: 0; } 35085 .has-global-padding :where(:not(.alignfull.is-layout-flow) > .has-global-padding:not(.wp-block-block, .alignfull)) > .alignfull { margin-left: 0; margin-right: 0; 35086 `; 35087 } 35088 ruleset += '}'; 35089 } 35090 if (options.blockStyles) { 35091 nodesWithStyles.forEach(({ 35092 selector, 35093 duotoneSelector, 35094 styles, 35095 fallbackGapValue, 35096 hasLayoutSupport, 35097 featureSelectors, 35098 styleVariationSelectors, 35099 skipSelectorWrapper 35100 }) => { 35101 // Process styles for block support features with custom feature level 35102 // CSS selectors set. 35103 if (featureSelectors) { 35104 const featureDeclarations = getFeatureDeclarations(featureSelectors, styles); 35105 Object.entries(featureDeclarations).forEach(([cssSelector, declarations]) => { 35106 if (declarations.length) { 35107 const rules = declarations.join(';'); 35108 ruleset += `:root :where($cssSelector}){$rules};}`; 35109 } 35110 }); 35111 } 35112 35113 // Process duotone styles. 35114 if (duotoneSelector) { 35115 const duotoneStyles = {}; 35116 if (styles?.filter) { 35117 duotoneStyles.filter = styles.filter; 35118 delete styles.filter; 35119 } 35120 const duotoneDeclarations = getStylesDeclarations(duotoneStyles); 35121 if (duotoneDeclarations.length) { 35122 ruleset += `$duotoneSelector}{$duotoneDeclarations.join(';')};}`; 35123 } 35124 } 35125 35126 // Process blockGap and layout styles. 35127 if (!disableLayoutStyles && (ROOT_BLOCK_SELECTOR === selector || hasLayoutSupport)) { 35128 ruleset += getLayoutStyles({ 35129 style: styles, 35130 selector, 35131 hasBlockGapSupport, 35132 hasFallbackGapSupport, 35133 fallbackGapValue 35134 }); 35135 } 35136 35137 // Process the remaining block styles (they use either normal block class or __experimentalSelector). 35138 const styleDeclarations = getStylesDeclarations(styles, selector, useRootPaddingAlign, tree, disableRootPadding); 35139 if (styleDeclarations?.length) { 35140 const generalSelector = skipSelectorWrapper ? selector : `:root :where($selector})`; 35141 ruleset += `$generalSelector}{$styleDeclarations.join(';')};}`; 35142 } 35143 if (styles?.css) { 35144 ruleset += processCSSNesting(styles.css, `:root :where($selector})`); 35145 } 35146 if (options.variationStyles && styleVariationSelectors) { 35147 Object.entries(styleVariationSelectors).forEach(([styleVariationName, styleVariationSelector]) => { 35148 const styleVariations = styles?.variations?.[styleVariationName]; 35149 if (styleVariations) { 35150 // If the block uses any custom selectors for block support, add those first. 35151 if (featureSelectors) { 35152 const featureDeclarations = getFeatureDeclarations(featureSelectors, styleVariations); 35153 Object.entries(featureDeclarations).forEach(([baseSelector, declarations]) => { 35154 if (declarations.length) { 35155 const cssSelector = concatFeatureVariationSelectorString(baseSelector, styleVariationSelector); 35156 const rules = declarations.join(';'); 35157 ruleset += `:root :where($cssSelector}){$rules};}`; 35158 } 35159 }); 35160 } 35161 35162 // Otherwise add regular selectors. 35163 const styleVariationDeclarations = getStylesDeclarations(styleVariations, styleVariationSelector, useRootPaddingAlign, tree); 35164 if (styleVariationDeclarations.length) { 35165 ruleset += `:root :where($styleVariationSelector}){$styleVariationDeclarations.join(';')};}`; 35166 } 35167 if (styleVariations?.css) { 35168 ruleset += processCSSNesting(styleVariations.css, `:root :where($styleVariationSelector})`); 35169 } 35170 } 35171 }); 35172 } 35173 35174 // Check for pseudo selector in `styles` and handle separately. 35175 const pseudoSelectorStyles = Object.entries(styles).filter(([key]) => key.startsWith(':')); 35176 if (pseudoSelectorStyles?.length) { 35177 pseudoSelectorStyles.forEach(([pseudoKey, pseudoStyle]) => { 35178 const pseudoDeclarations = getStylesDeclarations(pseudoStyle); 35179 if (!pseudoDeclarations?.length) { 35180 return; 35181 } 35182 35183 // `selector` may be provided in a form 35184 // where block level selectors have sub element 35185 // selectors appended to them as a comma separated 35186 // string. 35187 // e.g. `h1 a,h2 a,h3 a,h4 a,h5 a,h6 a`; 35188 // Split and append pseudo selector to create 35189 // the proper rules to target the elements. 35190 const _selector = selector.split(',').map(sel => sel + pseudoKey).join(','); 35191 35192 // As pseudo classes such as :hover, :focus etc. have class-level 35193 // specificity, they must use the `:root :where()` wrapper. This. 35194 // caps the specificity at `0-1-0` to allow proper nesting of variations 35195 // and block type element styles. 35196 const pseudoRule = `:root :where($_selector}){$pseudoDeclarations.join(';')};}`; 35197 ruleset += pseudoRule; 35198 }); 35199 } 35200 }); 35201 } 35202 if (options.layoutStyles) { 35203 /* Add alignment / layout styles */ 35204 ruleset = ruleset + '.wp-site-blocks > .alignleft { float: left; margin-right: 2em; }'; 35205 ruleset = ruleset + '.wp-site-blocks > .alignright { float: right; margin-left: 2em; }'; 35206 ruleset = ruleset + '.wp-site-blocks > .aligncenter { justify-content: center; margin-left: auto; margin-right: auto; }'; 35207 } 35208 if (options.blockGap && hasBlockGapSupport) { 35209 // Use fallback of `0.5em` just in case, however if there is blockGap support, there should nearly always be a real value. 35210 const gapValue = getGapCSSValue(tree?.styles?.spacing?.blockGap) || '0.5em'; 35211 ruleset = ruleset + `:root :where(.wp-site-blocks) > * { margin-block-start: $gapValue}; margin-block-end: 0; }`; 35212 ruleset = ruleset + ':root :where(.wp-site-blocks) > :first-child { margin-block-start: 0; }'; 35213 ruleset = ruleset + ':root :where(.wp-site-blocks) > :last-child { margin-block-end: 0; }'; 35214 } 35215 if (options.presets) { 35216 nodesWithSettings.forEach(({ 35217 selector, 35218 presets 35219 }) => { 35220 if (ROOT_BLOCK_SELECTOR === selector || ROOT_CSS_PROPERTIES_SELECTOR === selector) { 35221 // Do not add extra specificity for top-level classes. 35222 selector = ''; 35223 } 35224 const classes = getPresetsClasses(selector, presets); 35225 if (classes.length > 0) { 35226 ruleset += classes; 35227 } 35228 }); 35229 } 35230 return ruleset; 35231 }; 35232 function toSvgFilters(tree, blockSelectors) { 35233 const nodesWithSettings = getNodesWithSettings(tree, blockSelectors); 35234 return nodesWithSettings.flatMap(({ 35235 presets 35236 }) => { 35237 return getPresetsSvgFilters(presets); 35238 }); 35239 } 35240 const getSelectorsConfig = (blockType, rootSelector) => { 35241 if (blockType?.selectors && Object.keys(blockType.selectors).length > 0) { 35242 return blockType.selectors; 35243 } 35244 const config = { 35245 root: rootSelector 35246 }; 35247 Object.entries(BLOCK_SUPPORT_FEATURE_LEVEL_SELECTORS).forEach(([featureKey, featureName]) => { 35248 const featureSelector = getBlockCSSSelector(blockType, featureKey); 35249 if (featureSelector) { 35250 config[featureName] = featureSelector; 35251 } 35252 }); 35253 return config; 35254 }; 35255 const getBlockSelectors = (blockTypes, getBlockStyles, variationInstanceId) => { 35256 const result = {}; 35257 blockTypes.forEach(blockType => { 35258 const name = blockType.name; 35259 const selector = getBlockCSSSelector(blockType); 35260 let duotoneSelector = getBlockCSSSelector(blockType, 'filter.duotone'); 35261 35262 // Keep backwards compatibility for support.color.__experimentalDuotone. 35263 if (!duotoneSelector) { 35264 const rootSelector = getBlockCSSSelector(blockType); 35265 const duotoneSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockType, 'color.__experimentalDuotone', false); 35266 duotoneSelector = duotoneSupport && scopeSelector(rootSelector, duotoneSupport); 35267 } 35268 const hasLayoutSupport = !!blockType?.supports?.layout || !!blockType?.supports?.__experimentalLayout; 35269 const fallbackGapValue = blockType?.supports?.spacing?.blockGap?.__experimentalDefault; 35270 const blockStyleVariations = getBlockStyles(name); 35271 const styleVariationSelectors = {}; 35272 blockStyleVariations?.forEach(variation => { 35273 const variationSuffix = variationInstanceId ? `-$variationInstanceId}` : ''; 35274 const variationName = `$variation.name}$variationSuffix}`; 35275 const styleVariationSelector = getBlockStyleVariationSelector(variationName, selector); 35276 styleVariationSelectors[variationName] = styleVariationSelector; 35277 }); 35278 35279 // For each block support feature add any custom selectors. 35280 const featureSelectors = getSelectorsConfig(blockType, selector); 35281 result[name] = { 35282 duotoneSelector, 35283 fallbackGapValue, 35284 featureSelectors: Object.keys(featureSelectors).length ? featureSelectors : undefined, 35285 hasLayoutSupport, 35286 name, 35287 selector, 35288 styleVariationSelectors: blockStyleVariations?.length ? styleVariationSelectors : undefined 35289 }; 35290 }); 35291 return result; 35292 }; 35293 35294 /** 35295 * If there is a separator block whose color is defined in theme.json via background, 35296 * update the separator color to the same value by using border color. 35297 * 35298 * @param {Object} config Theme.json configuration file object. 35299 * @return {Object} configTheme.json configuration file object updated. 35300 */ 35301 function updateConfigWithSeparator(config) { 35302 const needsSeparatorStyleUpdate = config.styles?.blocks?.['core/separator'] && config.styles?.blocks?.['core/separator'].color?.background && !config.styles?.blocks?.['core/separator'].color?.text && !config.styles?.blocks?.['core/separator'].border?.color; 35303 if (needsSeparatorStyleUpdate) { 35304 return { 35305 ...config, 35306 styles: { 35307 ...config.styles, 35308 blocks: { 35309 ...config.styles.blocks, 35310 'core/separator': { 35311 ...config.styles.blocks['core/separator'], 35312 color: { 35313 ...config.styles.blocks['core/separator'].color, 35314 text: config.styles?.blocks['core/separator'].color.background 35315 } 35316 } 35317 } 35318 } 35319 }; 35320 } 35321 return config; 35322 } 35323 function processCSSNesting(css, blockSelector) { 35324 let processedCSS = ''; 35325 if (!css || css.trim() === '') { 35326 return processedCSS; 35327 } 35328 35329 // Split CSS nested rules. 35330 const parts = css.split('&'); 35331 parts.forEach(part => { 35332 if (!part || part.trim() === '') { 35333 return; 35334 } 35335 const isRootCss = !part.includes('{'); 35336 if (isRootCss) { 35337 // If the part doesn't contain braces, it applies to the root level. 35338 processedCSS += `:root :where($blockSelector}){$part.trim()}}`; 35339 } else { 35340 // If the part contains braces, it's a nested CSS rule. 35341 const splittedPart = part.replace('}', '').split('{'); 35342 if (splittedPart.length !== 2) { 35343 return; 35344 } 35345 const [nestedSelector, cssValue] = splittedPart; 35346 35347 // Handle pseudo elements such as ::before, ::after, etc. Regex will also 35348 // capture any leading combinator such as >, +, or ~, as well as spaces. 35349 // This allows pseudo elements as descendants e.g. `.parent ::before`. 35350 const matches = nestedSelector.match(/([>+~\s]*::[a-zA-Z-]+)/); 35351 const pseudoPart = matches ? matches[1] : ''; 35352 const withoutPseudoElement = matches ? nestedSelector.replace(pseudoPart, '').trim() : nestedSelector.trim(); 35353 let combinedSelector; 35354 if (withoutPseudoElement === '') { 35355 // Only contained a pseudo element to use the block selector to form 35356 // the final `:root :where()` selector. 35357 combinedSelector = blockSelector; 35358 } else { 35359 // If the nested selector is a descendant of the block scope it with the 35360 // block selector. Otherwise append it to the block selector. 35361 combinedSelector = nestedSelector.startsWith(' ') ? scopeSelector(blockSelector, withoutPseudoElement) : appendToSelector(blockSelector, withoutPseudoElement); 35362 } 35363 35364 // Build final rule, re-adding any pseudo element outside the `:where()` 35365 // to maintain valid CSS selector. 35366 processedCSS += `:root :where($combinedSelector})$pseudoPart}{$cssValue.trim()}}`; 35367 } 35368 }); 35369 return processedCSS; 35370 } 35371 35372 /** 35373 * Returns the global styles output using a global styles configuration. 35374 * If wishing to generate global styles and settings based on the 35375 * global styles config loaded in the editor context, use `useGlobalStylesOutput()`. 35376 * The use case for a custom config is to generate bespoke styles 35377 * and settings for previews, or other out-of-editor experiences. 35378 * 35379 * @param {Object} mergedConfig Global styles configuration. 35380 * @param {boolean} disableRootPadding Disable root padding styles. 35381 * 35382 * @return {Array} Array of stylesheets and settings. 35383 */ 35384 function useGlobalStylesOutputWithConfig(mergedConfig = {}, disableRootPadding) { 35385 const [blockGap] = useGlobalSetting('spacing.blockGap'); 35386 const hasBlockGapSupport = blockGap !== null; 35387 const hasFallbackGapSupport = !hasBlockGapSupport; // This setting isn't useful yet: it exists as a placeholder for a future explicit fallback styles support. 35388 const disableLayoutStyles = (0,external_wp_data_namespaceObject.useSelect)(select => { 35389 const { 35390 getSettings 35391 } = select(store); 35392 return !!getSettings().disableLayoutStyles; 35393 }); 35394 const { 35395 getBlockStyles 35396 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 35397 return (0,external_wp_element_namespaceObject.useMemo)(() => { 35398 var _updatedConfig$styles; 35399 if (!mergedConfig?.styles || !mergedConfig?.settings) { 35400 return []; 35401 } 35402 const updatedConfig = updateConfigWithSeparator(mergedConfig); 35403 const blockSelectors = getBlockSelectors((0,external_wp_blocks_namespaceObject.getBlockTypes)(), getBlockStyles); 35404 const customProperties = toCustomProperties(updatedConfig, blockSelectors); 35405 const globalStyles = toStyles(updatedConfig, blockSelectors, hasBlockGapSupport, hasFallbackGapSupport, disableLayoutStyles, disableRootPadding); 35406 const svgs = toSvgFilters(updatedConfig, blockSelectors); 35407 const styles = [{ 35408 css: customProperties, 35409 isGlobalStyles: true 35410 }, { 35411 css: globalStyles, 35412 isGlobalStyles: true 35413 }, 35414 // Load custom CSS in own stylesheet so that any invalid CSS entered in the input won't break all the global styles in the editor. 35415 { 35416 css: (_updatedConfig$styles = updatedConfig.styles.css) !== null && _updatedConfig$styles !== void 0 ? _updatedConfig$styles : '', 35417 isGlobalStyles: true 35418 }, { 35419 assets: svgs, 35420 __unstableType: 'svg', 35421 isGlobalStyles: true 35422 }]; 35423 35424 // Loop through the blocks to check if there are custom CSS values. 35425 // If there are, get the block selector and push the selector together with 35426 // the CSS value to the 'stylesheets' array. 35427 (0,external_wp_blocks_namespaceObject.getBlockTypes)().forEach(blockType => { 35428 if (updatedConfig.styles.blocks[blockType.name]?.css) { 35429 const selector = blockSelectors[blockType.name].selector; 35430 styles.push({ 35431 css: processCSSNesting(updatedConfig.styles.blocks[blockType.name]?.css, selector), 35432 isGlobalStyles: true 35433 }); 35434 } 35435 }); 35436 return [styles, updatedConfig.settings]; 35437 }, [hasBlockGapSupport, hasFallbackGapSupport, mergedConfig, disableLayoutStyles, disableRootPadding, getBlockStyles]); 35438 } 35439 35440 /** 35441 * Returns the global styles output based on the current state of global styles config loaded in the editor context. 35442 * 35443 * @param {boolean} disableRootPadding Disable root padding styles. 35444 * 35445 * @return {Array} Array of stylesheets and settings. 35446 */ 35447 function useGlobalStylesOutput(disableRootPadding = false) { 35448 const { 35449 merged: mergedConfig 35450 } = (0,external_wp_element_namespaceObject.useContext)(GlobalStylesContext); 35451 return useGlobalStylesOutputWithConfig(mergedConfig, disableRootPadding); 35452 } 35453 35454 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/block-style-variation.js 35455 /** 35456 * WordPress dependencies 35457 */ 35458 35459 35460 35461 35462 /** 35463 * Internal dependencies 35464 */ 35465 35466 35467 35468 35469 35470 35471 35472 35473 const VARIATION_PREFIX = 'is-style-'; 35474 function getVariationMatches(className) { 35475 if (!className) { 35476 return []; 35477 } 35478 return className.split(/\s+/).reduce((matches, name) => { 35479 if (name.startsWith(VARIATION_PREFIX)) { 35480 const match = name.slice(VARIATION_PREFIX.length); 35481 if (match !== 'default') { 35482 matches.push(match); 35483 } 35484 } 35485 return matches; 35486 }, []); 35487 } 35488 35489 /** 35490 * Get the first block style variation that has been registered from the class string. 35491 * 35492 * @param {string} className CSS class string for a block. 35493 * @param {Array} registeredStyles Currently registered block styles. 35494 * 35495 * @return {string|null} The name of the first registered variation. 35496 */ 35497 function getVariationNameFromClass(className, registeredStyles = []) { 35498 // The global flag affects how capturing groups work in JS. So the regex 35499 // below will only return full CSS classes not just the variation name. 35500 const matches = getVariationMatches(className); 35501 if (!matches) { 35502 return null; 35503 } 35504 for (const variation of matches) { 35505 if (registeredStyles.some(style => style.name === variation)) { 35506 return variation; 35507 } 35508 } 35509 return null; 35510 } 35511 35512 // A helper component to apply a style override using the useStyleOverride hook. 35513 function OverrideStyles({ 35514 override 35515 }) { 35516 usePrivateStyleOverride(override); 35517 } 35518 35519 /** 35520 * This component is used to generate new block style variation overrides 35521 * based on an incoming theme config. If a matching style is found in the config, 35522 * a new override is created and returned. The overrides can be used in conjunction with 35523 * useStyleOverride to apply the new styles to the editor. Its use is 35524 * subject to change. 35525 * 35526 * @param {Object} props Props. 35527 * @param {Object} props.config A global styles object, containing settings and styles. 35528 * @return {JSX.Element|undefined} An array of new block variation overrides. 35529 */ 35530 function __unstableBlockStyleVariationOverridesWithConfig({ 35531 config 35532 }) { 35533 const { 35534 getBlockStyles, 35535 overrides 35536 } = (0,external_wp_data_namespaceObject.useSelect)(select => ({ 35537 getBlockStyles: select(external_wp_blocks_namespaceObject.store).getBlockStyles, 35538 overrides: unlock(select(store)).getStyleOverrides() 35539 }), []); 35540 const { 35541 getBlockName 35542 } = (0,external_wp_data_namespaceObject.useSelect)(store); 35543 const overridesWithConfig = (0,external_wp_element_namespaceObject.useMemo)(() => { 35544 if (!overrides?.length) { 35545 return; 35546 } 35547 const newOverrides = []; 35548 const overriddenClientIds = []; 35549 for (const [, override] of overrides) { 35550 if (override?.variation && override?.clientId && 35551 /* 35552 * Because this component overwrites existing style overrides, 35553 * filter out any overrides that are already present in the store. 35554 */ 35555 !overriddenClientIds.includes(override.clientId)) { 35556 const blockName = getBlockName(override.clientId); 35557 const configStyles = config?.styles?.blocks?.[blockName]?.variations?.[override.variation]; 35558 if (configStyles) { 35559 const variationConfig = { 35560 settings: config?.settings, 35561 // The variation style data is all that is needed to generate 35562 // the styles for the current application to a block. The variation 35563 // name is updated to match the instance specific class name. 35564 styles: { 35565 blocks: { 35566 [blockName]: { 35567 variations: { 35568 [`$override.variation}-$override.clientId}`]: configStyles 35569 } 35570 } 35571 } 35572 } 35573 }; 35574 const blockSelectors = getBlockSelectors((0,external_wp_blocks_namespaceObject.getBlockTypes)(), getBlockStyles, override.clientId); 35575 const hasBlockGapSupport = false; 35576 const hasFallbackGapSupport = true; 35577 const disableLayoutStyles = true; 35578 const disableRootPadding = true; 35579 const variationStyles = toStyles(variationConfig, blockSelectors, hasBlockGapSupport, hasFallbackGapSupport, disableLayoutStyles, disableRootPadding, { 35580 blockGap: false, 35581 blockStyles: true, 35582 layoutStyles: false, 35583 marginReset: false, 35584 presets: false, 35585 rootPadding: false, 35586 variationStyles: true 35587 }); 35588 newOverrides.push({ 35589 id: `$override.variation}-$override.clientId}`, 35590 css: variationStyles, 35591 __unstableType: 'variation', 35592 variation: override.variation, 35593 // The clientId will be stored with the override and used to ensure 35594 // the order of overrides matches the order of blocks so that the 35595 // correct CSS cascade is maintained. 35596 clientId: override.clientId 35597 }); 35598 overriddenClientIds.push(override.clientId); 35599 } 35600 } 35601 } 35602 return newOverrides; 35603 }, [config, overrides, getBlockStyles, getBlockName]); 35604 if (!overridesWithConfig || !overridesWithConfig.length) { 35605 return; 35606 } 35607 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 35608 children: overridesWithConfig.map(override => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OverrideStyles, { 35609 override: override 35610 }, override.id)) 35611 }); 35612 } 35613 35614 /** 35615 * Retrieves any variation styles data and resolves any referenced values. 35616 * 35617 * @param {Object} globalStyles A complete global styles object, containing settings and styles. 35618 * @param {string} name The name of the desired block type. 35619 * @param {variation} variation The of the block style variation to retrieve data for. 35620 * 35621 * @return {Object|undefined} The global styles data for the specified variation. 35622 */ 35623 function getVariationStylesWithRefValues(globalStyles, name, variation) { 35624 if (!globalStyles?.styles?.blocks?.[name]?.variations?.[variation]) { 35625 return; 35626 } 35627 35628 // Helper to recursively look for `ref` values to resolve. 35629 const replaceRefs = variationStyles => { 35630 Object.keys(variationStyles).forEach(key => { 35631 const value = variationStyles[key]; 35632 35633 // Only process objects. 35634 if (typeof value === 'object' && value !== null) { 35635 // Process `ref` value if present. 35636 if (value.ref !== undefined) { 35637 if (typeof value.ref !== 'string' || value.ref.trim() === '') { 35638 // Remove invalid ref. 35639 delete variationStyles[key]; 35640 } else { 35641 // Resolve `ref` value. 35642 const refValue = getValueFromObjectPath(globalStyles, value.ref); 35643 if (refValue) { 35644 variationStyles[key] = refValue; 35645 } else { 35646 delete variationStyles[key]; 35647 } 35648 } 35649 } else { 35650 // Recursively resolve `ref` values in nested objects. 35651 replaceRefs(value); 35652 35653 // After recursion, if value is empty due to explicitly 35654 // `undefined` ref value, remove it. 35655 if (Object.keys(value).length === 0) { 35656 delete variationStyles[key]; 35657 } 35658 } 35659 } 35660 }); 35661 }; 35662 35663 // Deep clone variation node to avoid mutating it within global styles and losing refs. 35664 const styles = JSON.parse(JSON.stringify(globalStyles.styles.blocks[name].variations[variation])); 35665 replaceRefs(styles); 35666 return styles; 35667 } 35668 function useBlockStyleVariation(name, variation, clientId) { 35669 // Prefer global styles data in GlobalStylesContext, which are available 35670 // if in the site editor. Otherwise fall back to whatever is in the 35671 // editor settings and available in the post editor. 35672 const { 35673 merged: mergedConfig 35674 } = (0,external_wp_element_namespaceObject.useContext)(GlobalStylesContext); 35675 const { 35676 globalSettings, 35677 globalStyles 35678 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 35679 const settings = select(store).getSettings(); 35680 return { 35681 globalSettings: settings.__experimentalFeatures, 35682 globalStyles: settings[globalStylesDataKey] 35683 }; 35684 }, []); 35685 return (0,external_wp_element_namespaceObject.useMemo)(() => { 35686 var _mergedConfig$setting, _mergedConfig$styles, _mergedConfig$setting2; 35687 const variationStyles = getVariationStylesWithRefValues({ 35688 settings: (_mergedConfig$setting = mergedConfig?.settings) !== null && _mergedConfig$setting !== void 0 ? _mergedConfig$setting : globalSettings, 35689 styles: (_mergedConfig$styles = mergedConfig?.styles) !== null && _mergedConfig$styles !== void 0 ? _mergedConfig$styles : globalStyles 35690 }, name, variation); 35691 return { 35692 settings: (_mergedConfig$setting2 = mergedConfig?.settings) !== null && _mergedConfig$setting2 !== void 0 ? _mergedConfig$setting2 : globalSettings, 35693 // The variation style data is all that is needed to generate 35694 // the styles for the current application to a block. The variation 35695 // name is updated to match the instance specific class name. 35696 styles: { 35697 blocks: { 35698 [name]: { 35699 variations: { 35700 [`$variation}-$clientId}`]: variationStyles 35701 } 35702 } 35703 } 35704 } 35705 }; 35706 }, [mergedConfig, globalSettings, globalStyles, variation, clientId, name]); 35707 } 35708 35709 // Rather than leveraging `useInstanceId` here, the `clientId` is used. 35710 // This is so that the variation style override's ID is predictable 35711 // when the order of applied style variations changes. 35712 function block_style_variation_useBlockProps({ 35713 name, 35714 className, 35715 clientId 35716 }) { 35717 const { 35718 getBlockStyles 35719 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 35720 const registeredStyles = getBlockStyles(name); 35721 const variation = getVariationNameFromClass(className, registeredStyles); 35722 const variationClass = `$VARIATION_PREFIX}$variation}-$clientId}`; 35723 const { 35724 settings, 35725 styles 35726 } = useBlockStyleVariation(name, variation, clientId); 35727 const variationStyles = (0,external_wp_element_namespaceObject.useMemo)(() => { 35728 if (!variation) { 35729 return; 35730 } 35731 const variationConfig = { 35732 settings, 35733 styles 35734 }; 35735 const blockSelectors = getBlockSelectors((0,external_wp_blocks_namespaceObject.getBlockTypes)(), getBlockStyles, clientId); 35736 const hasBlockGapSupport = false; 35737 const hasFallbackGapSupport = true; 35738 const disableLayoutStyles = true; 35739 const disableRootPadding = true; 35740 return toStyles(variationConfig, blockSelectors, hasBlockGapSupport, hasFallbackGapSupport, disableLayoutStyles, disableRootPadding, { 35741 blockGap: false, 35742 blockStyles: true, 35743 layoutStyles: false, 35744 marginReset: false, 35745 presets: false, 35746 rootPadding: false, 35747 variationStyles: true 35748 }); 35749 }, [variation, settings, styles, getBlockStyles, clientId]); 35750 usePrivateStyleOverride({ 35751 id: `variation-$clientId}`, 35752 css: variationStyles, 35753 __unstableType: 'variation', 35754 variation, 35755 // The clientId will be stored with the override and used to ensure 35756 // the order of overrides matches the order of blocks so that the 35757 // correct CSS cascade is maintained. 35758 clientId 35759 }); 35760 return variation ? { 35761 className: variationClass 35762 } : {}; 35763 } 35764 /* harmony default export */ const block_style_variation = ({ 35765 hasSupport: () => true, 35766 attributeKeys: ['className'], 35767 isMatch: ({ 35768 className 35769 }) => getVariationMatches(className).length > 0, 35770 useBlockProps: block_style_variation_useBlockProps 35771 }); 35772 35773 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/layout.js 35774 /** 35775 * External dependencies 35776 */ 35777 35778 35779 /** 35780 * WordPress dependencies 35781 */ 35782 35783 35784 35785 35786 35787 35788 35789 /** 35790 * Internal dependencies 35791 */ 35792 35793 35794 35795 35796 35797 35798 35799 35800 35801 35802 35803 const layoutBlockSupportKey = 'layout'; 35804 const { 35805 kebabCase: layout_kebabCase 35806 } = unlock(external_wp_components_namespaceObject.privateApis); 35807 function hasLayoutBlockSupport(blockName) { 35808 return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockName, 'layout') || (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockName, '__experimentalLayout'); 35809 } 35810 35811 /** 35812 * Generates the utility classnames for the given block's layout attributes. 35813 * 35814 * @param { Object } blockAttributes Block attributes. 35815 * @param { string } blockName Block name. 35816 * 35817 * @return { Array } Array of CSS classname strings. 35818 */ 35819 function useLayoutClasses(blockAttributes = {}, blockName = '') { 35820 const { 35821 layout 35822 } = blockAttributes; 35823 const { 35824 default: defaultBlockLayout 35825 } = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockName, layoutBlockSupportKey) || {}; 35826 const usedLayout = layout?.inherit || layout?.contentSize || layout?.wideSize ? { 35827 ...layout, 35828 type: 'constrained' 35829 } : layout || defaultBlockLayout || {}; 35830 const layoutClassnames = []; 35831 if (LAYOUT_DEFINITIONS[usedLayout?.type || 'default']?.className) { 35832 const baseClassName = LAYOUT_DEFINITIONS[usedLayout?.type || 'default']?.className; 35833 const splitBlockName = blockName.split('/'); 35834 const fullBlockName = splitBlockName[0] === 'core' ? splitBlockName.pop() : splitBlockName.join('-'); 35835 const compoundClassName = `wp-block-$fullBlockName}-$baseClassName}`; 35836 layoutClassnames.push(baseClassName, compoundClassName); 35837 } 35838 const hasGlobalPadding = (0,external_wp_data_namespaceObject.useSelect)(select => { 35839 return (usedLayout?.inherit || usedLayout?.contentSize || usedLayout?.type === 'constrained') && select(store).getSettings().__experimentalFeatures?.useRootPaddingAwareAlignments; 35840 }, [usedLayout?.contentSize, usedLayout?.inherit, usedLayout?.type]); 35841 if (hasGlobalPadding) { 35842 layoutClassnames.push('has-global-padding'); 35843 } 35844 if (usedLayout?.orientation) { 35845 layoutClassnames.push(`is-$layout_kebabCase(usedLayout.orientation)}`); 35846 } 35847 if (usedLayout?.justifyContent) { 35848 layoutClassnames.push(`is-content-justification-$layout_kebabCase(usedLayout.justifyContent)}`); 35849 } 35850 if (usedLayout?.flexWrap && usedLayout.flexWrap === 'nowrap') { 35851 layoutClassnames.push('is-nowrap'); 35852 } 35853 return layoutClassnames; 35854 } 35855 35856 /** 35857 * Generates a CSS rule with the given block's layout styles. 35858 * 35859 * @param { Object } blockAttributes Block attributes. 35860 * @param { string } blockName Block name. 35861 * @param { string } selector A selector to use in generating the CSS rule. 35862 * 35863 * @return { string } CSS rule. 35864 */ 35865 function useLayoutStyles(blockAttributes = {}, blockName, selector) { 35866 const { 35867 layout = {}, 35868 style = {} 35869 } = blockAttributes; 35870 // Update type for blocks using legacy layouts. 35871 const usedLayout = layout?.inherit || layout?.contentSize || layout?.wideSize ? { 35872 ...layout, 35873 type: 'constrained' 35874 } : layout || {}; 35875 const fullLayoutType = getLayoutType(usedLayout?.type || 'default'); 35876 const [blockGapSupport] = use_settings_useSettings('spacing.blockGap'); 35877 const hasBlockGapSupport = blockGapSupport !== null; 35878 return fullLayoutType?.getLayoutStyle?.({ 35879 blockName, 35880 selector, 35881 layout, 35882 style, 35883 hasBlockGapSupport 35884 }); 35885 } 35886 function LayoutPanelPure({ 35887 layout, 35888 setAttributes, 35889 name: blockName, 35890 clientId 35891 }) { 35892 const settings = useBlockSettings(blockName); 35893 // Block settings come from theme.json under settings.[blockName]. 35894 const { 35895 layout: layoutSettings 35896 } = settings; 35897 const { 35898 themeSupportsLayout 35899 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 35900 const { 35901 getSettings 35902 } = select(store); 35903 return { 35904 themeSupportsLayout: getSettings().supportsLayout 35905 }; 35906 }, []); 35907 const blockEditingMode = useBlockEditingMode(); 35908 if (blockEditingMode !== 'default') { 35909 return null; 35910 } 35911 35912 // Layout block support comes from the block's block.json. 35913 const layoutBlockSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockName, layoutBlockSupportKey, {}); 35914 const blockSupportAndThemeSettings = { 35915 ...layoutSettings, 35916 ...layoutBlockSupport 35917 }; 35918 const { 35919 allowSwitching, 35920 allowEditing = true, 35921 allowInheriting = true, 35922 default: defaultBlockLayout 35923 } = blockSupportAndThemeSettings; 35924 if (!allowEditing) { 35925 return null; 35926 } 35927 35928 /* 35929 * Try to find the layout type from either the 35930 * block's layout settings or any saved layout config. 35931 */ 35932 const blockSupportAndLayout = { 35933 ...layoutBlockSupport, 35934 ...layout 35935 }; 35936 const { 35937 type, 35938 default: { 35939 type: defaultType = 'default' 35940 } = {} 35941 } = blockSupportAndLayout; 35942 const blockLayoutType = type || defaultType; 35943 35944 // Only show the inherit toggle if it's supported, 35945 // and either the default / flow or the constrained layout type is in use, as the toggle switches from one to the other. 35946 const showInheritToggle = !!(allowInheriting && (!blockLayoutType || blockLayoutType === 'default' || blockLayoutType === 'constrained' || blockSupportAndLayout.inherit)); 35947 const usedLayout = layout || defaultBlockLayout || {}; 35948 const { 35949 inherit = false, 35950 contentSize = null 35951 } = usedLayout; 35952 /** 35953 * `themeSupportsLayout` is only relevant to the `default/flow` or 35954 * `constrained` layouts and it should not be taken into account when other 35955 * `layout` types are used. 35956 */ 35957 if ((blockLayoutType === 'default' || blockLayoutType === 'constrained') && !themeSupportsLayout) { 35958 return null; 35959 } 35960 const layoutType = getLayoutType(blockLayoutType); 35961 const constrainedType = getLayoutType('constrained'); 35962 const displayControlsForLegacyLayouts = !usedLayout.type && (contentSize || inherit); 35963 const hasContentSizeOrLegacySettings = !!inherit || !!contentSize; 35964 const onChangeType = newType => setAttributes({ 35965 layout: { 35966 type: newType 35967 } 35968 }); 35969 const onChangeLayout = newLayout => setAttributes({ 35970 layout: newLayout 35971 }); 35972 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 35973 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 35974 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.PanelBody, { 35975 title: (0,external_wp_i18n_namespaceObject.__)('Layout'), 35976 children: [showInheritToggle && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 35977 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 35978 __nextHasNoMarginBottom: true, 35979 label: (0,external_wp_i18n_namespaceObject.__)('Inner blocks use content width'), 35980 checked: layoutType?.name === 'constrained' || hasContentSizeOrLegacySettings, 35981 onChange: () => setAttributes({ 35982 layout: { 35983 type: layoutType?.name === 'constrained' || hasContentSizeOrLegacySettings ? 'default' : 'constrained' 35984 } 35985 }), 35986 help: layoutType?.name === 'constrained' || hasContentSizeOrLegacySettings ? (0,external_wp_i18n_namespaceObject.__)('Nested blocks use content width with options for full and wide widths.') : (0,external_wp_i18n_namespaceObject.__)('Nested blocks will fill the width of this container. Toggle to constrain.') 35987 }) 35988 }), !inherit && allowSwitching && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LayoutTypeSwitcher, { 35989 type: blockLayoutType, 35990 onChange: onChangeType 35991 }), layoutType && layoutType.name !== 'default' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(layoutType.inspectorControls, { 35992 layout: usedLayout, 35993 onChange: onChangeLayout, 35994 layoutBlockSupport: blockSupportAndThemeSettings, 35995 name: blockName, 35996 clientId: clientId 35997 }), constrainedType && displayControlsForLegacyLayouts && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(constrainedType.inspectorControls, { 35998 layout: usedLayout, 35999 onChange: onChangeLayout, 36000 layoutBlockSupport: blockSupportAndThemeSettings, 36001 name: blockName, 36002 clientId: clientId 36003 })] 36004 }) 36005 }), !inherit && layoutType && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(layoutType.toolBarControls, { 36006 layout: usedLayout, 36007 onChange: onChangeLayout, 36008 layoutBlockSupport: layoutBlockSupport, 36009 name: blockName, 36010 clientId: clientId 36011 })] 36012 }); 36013 } 36014 /* harmony default export */ const layout = ({ 36015 shareWithChildBlocks: true, 36016 edit: LayoutPanelPure, 36017 attributeKeys: ['layout'], 36018 hasSupport(name) { 36019 return hasLayoutBlockSupport(name); 36020 } 36021 }); 36022 function LayoutTypeSwitcher({ 36023 type, 36024 onChange 36025 }) { 36026 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 36027 __next40pxDefaultSize: true, 36028 isBlock: true, 36029 label: (0,external_wp_i18n_namespaceObject.__)('Layout type'), 36030 __nextHasNoMarginBottom: true, 36031 hideLabelFromVision: true, 36032 isAdaptiveWidth: true, 36033 value: type, 36034 onChange: onChange, 36035 children: getLayoutTypes().map(({ 36036 name, 36037 label 36038 }) => { 36039 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 36040 value: name, 36041 label: label 36042 }, name); 36043 }) 36044 }); 36045 } 36046 36047 /** 36048 * Filters registered block settings, extending attributes to include `layout`. 36049 * 36050 * @param {Object} settings Original block settings. 36051 * 36052 * @return {Object} Filtered block settings. 36053 */ 36054 function layout_addAttribute(settings) { 36055 var _settings$attributes$; 36056 if ('type' in ((_settings$attributes$ = settings.attributes?.layout) !== null && _settings$attributes$ !== void 0 ? _settings$attributes$ : {})) { 36057 return settings; 36058 } 36059 if (hasLayoutBlockSupport(settings)) { 36060 settings.attributes = { 36061 ...settings.attributes, 36062 layout: { 36063 type: 'object' 36064 } 36065 }; 36066 } 36067 return settings; 36068 } 36069 function BlockWithLayoutStyles({ 36070 block: BlockListBlock, 36071 props, 36072 blockGapSupport, 36073 layoutClasses 36074 }) { 36075 const { 36076 name, 36077 attributes 36078 } = props; 36079 const id = (0,external_wp_compose_namespaceObject.useInstanceId)(BlockListBlock); 36080 const { 36081 layout 36082 } = attributes; 36083 const { 36084 default: defaultBlockLayout 36085 } = (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, layoutBlockSupportKey) || {}; 36086 const usedLayout = layout?.inherit || layout?.contentSize || layout?.wideSize ? { 36087 ...layout, 36088 type: 'constrained' 36089 } : layout || defaultBlockLayout || {}; 36090 const selectorPrefix = `wp-container-$layout_kebabCase(name)}-is-layout-`; 36091 // Higher specificity to override defaults from theme.json. 36092 const selector = `.$selectorPrefix}$id}`; 36093 const hasBlockGapSupport = blockGapSupport !== null; 36094 36095 // Get CSS string for the current layout type. 36096 // The CSS and `style` element is only output if it is not empty. 36097 const fullLayoutType = getLayoutType(usedLayout?.type || 'default'); 36098 const css = fullLayoutType?.getLayoutStyle?.({ 36099 blockName: name, 36100 selector, 36101 layout: usedLayout, 36102 style: attributes?.style, 36103 hasBlockGapSupport 36104 }); 36105 36106 // Attach a `wp-container-` id-based class name as well as a layout class name such as `is-layout-flex`. 36107 const layoutClassNames = dist_clsx({ 36108 [`$selectorPrefix}$id}`]: !!css // Only attach a container class if there is generated CSS to be attached. 36109 }, layoutClasses); 36110 useStyleOverride({ 36111 css 36112 }); 36113 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockListBlock, { 36114 ...props, 36115 __unstableLayoutClassNames: layoutClassNames 36116 }); 36117 } 36118 36119 /** 36120 * Override the default block element to add the layout styles. 36121 * 36122 * @param {Function} BlockListBlock Original component. 36123 * 36124 * @return {Function} Wrapped component. 36125 */ 36126 const withLayoutStyles = (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(BlockListBlock => props => { 36127 const { 36128 clientId, 36129 name, 36130 attributes 36131 } = props; 36132 const blockSupportsLayout = hasLayoutBlockSupport(name); 36133 const layoutClasses = useLayoutClasses(attributes, name); 36134 const extraProps = (0,external_wp_data_namespaceObject.useSelect)(select => { 36135 // The callback returns early to avoid block editor subscription. 36136 if (!blockSupportsLayout) { 36137 return; 36138 } 36139 const { 36140 getSettings, 36141 getBlockSettings 36142 } = unlock(select(store)); 36143 const { 36144 disableLayoutStyles 36145 } = getSettings(); 36146 if (disableLayoutStyles) { 36147 return; 36148 } 36149 const [blockGapSupport] = getBlockSettings(clientId, 'spacing.blockGap'); 36150 return { 36151 blockGapSupport 36152 }; 36153 }, [blockSupportsLayout, clientId]); 36154 if (!extraProps) { 36155 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockListBlock, { 36156 ...props, 36157 __unstableLayoutClassNames: blockSupportsLayout ? layoutClasses : undefined 36158 }); 36159 } 36160 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockWithLayoutStyles, { 36161 block: BlockListBlock, 36162 props: props, 36163 layoutClasses: layoutClasses, 36164 ...extraProps 36165 }); 36166 }, 'withLayoutStyles'); 36167 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/layout/addAttribute', layout_addAttribute); 36168 (0,external_wp_hooks_namespaceObject.addFilter)('editor.BlockListBlock', 'core/editor/layout/with-layout-styles', withLayoutStyles); 36169 36170 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/grid/utils.js 36171 function range(start, length) { 36172 return Array.from({ 36173 length 36174 }, (_, i) => start + i); 36175 } 36176 class GridRect { 36177 constructor({ 36178 columnStart, 36179 rowStart, 36180 columnEnd, 36181 rowEnd, 36182 columnSpan, 36183 rowSpan 36184 } = {}) { 36185 this.columnStart = columnStart !== null && columnStart !== void 0 ? columnStart : 1; 36186 this.rowStart = rowStart !== null && rowStart !== void 0 ? rowStart : 1; 36187 if (columnSpan !== undefined) { 36188 this.columnEnd = this.columnStart + columnSpan - 1; 36189 } else { 36190 this.columnEnd = columnEnd !== null && columnEnd !== void 0 ? columnEnd : this.columnStart; 36191 } 36192 if (rowSpan !== undefined) { 36193 this.rowEnd = this.rowStart + rowSpan - 1; 36194 } else { 36195 this.rowEnd = rowEnd !== null && rowEnd !== void 0 ? rowEnd : this.rowStart; 36196 } 36197 } 36198 get columnSpan() { 36199 return this.columnEnd - this.columnStart + 1; 36200 } 36201 get rowSpan() { 36202 return this.rowEnd - this.rowStart + 1; 36203 } 36204 contains(column, row) { 36205 return column >= this.columnStart && column <= this.columnEnd && row >= this.rowStart && row <= this.rowEnd; 36206 } 36207 containsRect(rect) { 36208 return this.contains(rect.columnStart, rect.rowStart) && this.contains(rect.columnEnd, rect.rowEnd); 36209 } 36210 intersectsRect(rect) { 36211 return this.columnStart <= rect.columnEnd && this.columnEnd >= rect.columnStart && this.rowStart <= rect.rowEnd && this.rowEnd >= rect.rowStart; 36212 } 36213 } 36214 function utils_getComputedCSS(element, property) { 36215 return element.ownerDocument.defaultView.getComputedStyle(element).getPropertyValue(property); 36216 } 36217 36218 /** 36219 * Given a grid-template-columns or grid-template-rows CSS property value, gets the start and end 36220 * position in pixels of each grid track. 36221 * 36222 * https://css-tricks.com/snippets/css/complete-guide-grid/#aa-grid-track 36223 * 36224 * @param {string} template The grid-template-columns or grid-template-rows CSS property value. 36225 * Only supports fixed sizes in pixels. 36226 * @param {number} gap The gap between grid tracks in pixels. 36227 * 36228 * @return {Array<{start: number, end: number}>} An array of objects with the start and end 36229 * position in pixels of each grid track. 36230 */ 36231 function getGridTracks(template, gap) { 36232 const tracks = []; 36233 for (const size of template.split(' ')) { 36234 const previousTrack = tracks[tracks.length - 1]; 36235 const start = previousTrack ? previousTrack.end + gap : 0; 36236 const end = start + parseFloat(size); 36237 tracks.push({ 36238 start, 36239 end 36240 }); 36241 } 36242 return tracks; 36243 } 36244 36245 /** 36246 * Given an array of grid tracks and a position in pixels, gets the index of the closest track to 36247 * that position. 36248 * 36249 * https://css-tricks.com/snippets/css/complete-guide-grid/#aa-grid-track 36250 * 36251 * @param {Array<{start: number, end: number}>} tracks An array of objects with the start and end 36252 * position in pixels of each grid track. 36253 * @param {number} position The position in pixels. 36254 * @param {string} edge The edge of the track to compare the 36255 * position to. Either 'start' or 'end'. 36256 * 36257 * @return {number} The index of the closest track to the position. 0-based, unlike CSS grid which 36258 * is 1-based. 36259 */ 36260 function getClosestTrack(tracks, position, edge = 'start') { 36261 return tracks.reduce((closest, track, index) => Math.abs(track[edge] - position) < Math.abs(tracks[closest][edge] - position) ? index : closest, 0); 36262 } 36263 function getGridRect(gridElement, rect) { 36264 const columnGap = parseFloat(utils_getComputedCSS(gridElement, 'column-gap')); 36265 const rowGap = parseFloat(utils_getComputedCSS(gridElement, 'row-gap')); 36266 const gridColumnTracks = getGridTracks(utils_getComputedCSS(gridElement, 'grid-template-columns'), columnGap); 36267 const gridRowTracks = getGridTracks(utils_getComputedCSS(gridElement, 'grid-template-rows'), rowGap); 36268 const columnStart = getClosestTrack(gridColumnTracks, rect.left) + 1; 36269 const rowStart = getClosestTrack(gridRowTracks, rect.top) + 1; 36270 const columnEnd = getClosestTrack(gridColumnTracks, rect.right, 'end') + 1; 36271 const rowEnd = getClosestTrack(gridRowTracks, rect.bottom, 'end') + 1; 36272 return new GridRect({ 36273 columnStart, 36274 columnEnd, 36275 rowStart, 36276 rowEnd 36277 }); 36278 } 36279 function getGridItemRect(gridItemElement) { 36280 return getGridRect(gridItemElement.parentElement, new window.DOMRect(gridItemElement.offsetLeft, gridItemElement.offsetTop, gridItemElement.offsetWidth, gridItemElement.offsetHeight)); 36281 } 36282 function getGridInfo(gridElement) { 36283 const gridTemplateColumns = utils_getComputedCSS(gridElement, 'grid-template-columns'); 36284 const gridTemplateRows = utils_getComputedCSS(gridElement, 'grid-template-rows'); 36285 const numColumns = gridTemplateColumns.split(' ').length; 36286 const numRows = gridTemplateRows.split(' ').length; 36287 const numItems = numColumns * numRows; 36288 return { 36289 numColumns, 36290 numRows, 36291 numItems, 36292 currentColor: utils_getComputedCSS(gridElement, 'color'), 36293 style: { 36294 gridTemplateColumns, 36295 gridTemplateRows, 36296 gap: utils_getComputedCSS(gridElement, 'gap'), 36297 padding: utils_getComputedCSS(gridElement, 'padding') 36298 } 36299 }; 36300 } 36301 36302 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/tips.js 36303 /** 36304 * WordPress dependencies 36305 */ 36306 36307 36308 36309 36310 const globalTips = [(0,external_wp_element_namespaceObject.createInterpolateElement)((0,external_wp_i18n_namespaceObject.__)('While writing, you can press <kbd>/</kbd> to quickly insert new blocks.'), { 36311 kbd: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("kbd", {}) 36312 }), (0,external_wp_element_namespaceObject.createInterpolateElement)((0,external_wp_i18n_namespaceObject.__)('Indent a list by pressing <kbd>space</kbd> at the beginning of a line.'), { 36313 kbd: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("kbd", {}) 36314 }), (0,external_wp_element_namespaceObject.createInterpolateElement)((0,external_wp_i18n_namespaceObject.__)('Outdent a list by pressing <kbd>backspace</kbd> at the beginning of a line.'), { 36315 kbd: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("kbd", {}) 36316 }), (0,external_wp_i18n_namespaceObject.__)('Drag files into the editor to automatically insert media blocks.'), (0,external_wp_i18n_namespaceObject.__)("Change a block's type by pressing the block icon on the toolbar.")]; 36317 function Tips() { 36318 const [randomIndex] = (0,external_wp_element_namespaceObject.useState)( 36319 // Disable Reason: I'm not generating an HTML id. 36320 // eslint-disable-next-line no-restricted-syntax 36321 Math.floor(Math.random() * globalTips.length)); 36322 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tip, { 36323 children: globalTips[randomIndex] 36324 }); 36325 } 36326 /* harmony default export */ const tips = (Tips); 36327 36328 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-right.js 36329 /** 36330 * WordPress dependencies 36331 */ 36332 36333 36334 const chevronRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 36335 xmlns: "http://www.w3.org/2000/svg", 36336 viewBox: "0 0 24 24", 36337 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 36338 d: "M10.6 6L9.4 7l4.6 5-4.6 5 1.2 1 5.4-6z" 36339 }) 36340 }); 36341 /* harmony default export */ const chevron_right = (chevronRight); 36342 36343 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-left.js 36344 /** 36345 * WordPress dependencies 36346 */ 36347 36348 36349 const chevronLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 36350 xmlns: "http://www.w3.org/2000/svg", 36351 viewBox: "0 0 24 24", 36352 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 36353 d: "M14.6 7l-1.2-1L8 12l5.4 6 1.2-1-4.6-5z" 36354 }) 36355 }); 36356 /* harmony default export */ const chevron_left = (chevronLeft); 36357 36358 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/block-default.js 36359 /** 36360 * WordPress dependencies 36361 */ 36362 36363 36364 const blockDefault = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 36365 xmlns: "http://www.w3.org/2000/svg", 36366 viewBox: "0 0 24 24", 36367 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 36368 d: "M19 8h-1V6h-5v2h-2V6H6v2H5c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-8c0-1.1-.9-2-2-2zm.5 10c0 .3-.2.5-.5.5H5c-.3 0-.5-.2-.5-.5v-8c0-.3.2-.5.5-.5h14c.3 0 .5.2.5.5v8z" 36369 }) 36370 }); 36371 /* harmony default export */ const block_default = (blockDefault); 36372 36373 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-icon/index.js 36374 /** 36375 * External dependencies 36376 */ 36377 36378 36379 /** 36380 * WordPress dependencies 36381 */ 36382 36383 36384 36385 36386 function BlockIcon({ 36387 icon, 36388 showColors = false, 36389 className, 36390 context 36391 }) { 36392 if (icon?.src === 'block-default') { 36393 icon = { 36394 src: block_default 36395 }; 36396 } 36397 const renderedIcon = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Icon, { 36398 icon: icon && icon.src ? icon.src : icon, 36399 context: context 36400 }); 36401 const style = showColors ? { 36402 backgroundColor: icon && icon.background, 36403 color: icon && icon.foreground 36404 } : {}; 36405 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 36406 style: style, 36407 className: dist_clsx('block-editor-block-icon', className, { 36408 'has-colors': showColors 36409 }), 36410 children: renderedIcon 36411 }); 36412 } 36413 36414 /** 36415 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-icon/README.md 36416 */ 36417 /* harmony default export */ const block_icon = ((0,external_wp_element_namespaceObject.memo)(BlockIcon)); 36418 36419 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-card/index.js 36420 /** 36421 * External dependencies 36422 */ 36423 36424 36425 /** 36426 * WordPress dependencies 36427 */ 36428 36429 36430 36431 36432 36433 36434 /** 36435 * Internal dependencies 36436 */ 36437 36438 36439 36440 36441 function BlockCard({ 36442 title, 36443 icon, 36444 description, 36445 blockType, 36446 className, 36447 name 36448 }) { 36449 if (blockType) { 36450 external_wp_deprecated_default()('`blockType` property in `BlockCard component`', { 36451 since: '5.7', 36452 alternative: '`title, icon and description` properties' 36453 }); 36454 ({ 36455 title, 36456 icon, 36457 description 36458 } = blockType); 36459 } 36460 const { 36461 parentNavBlockClientId 36462 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 36463 const { 36464 getSelectedBlockClientId, 36465 getBlockParentsByBlockName 36466 } = select(store); 36467 const _selectedBlockClientId = getSelectedBlockClientId(); 36468 return { 36469 parentNavBlockClientId: getBlockParentsByBlockName(_selectedBlockClientId, 'core/navigation', true)[0] 36470 }; 36471 }, []); 36472 const { 36473 selectBlock 36474 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 36475 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 36476 className: dist_clsx('block-editor-block-card', className), 36477 children: [parentNavBlockClientId && 36478 /*#__PURE__*/ 36479 // This is only used by the Navigation block for now. It's not ideal having Navigation block specific code here. 36480 (0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 36481 onClick: () => selectBlock(parentNavBlockClientId), 36482 label: (0,external_wp_i18n_namespaceObject.__)('Go to parent Navigation block'), 36483 style: 36484 // TODO: This style override is also used in ToolsPanelHeader. 36485 // It should be supported out-of-the-box by Button. 36486 { 36487 minWidth: 24, 36488 padding: 0 36489 }, 36490 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_right : chevron_left, 36491 size: "small" 36492 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 36493 icon: icon, 36494 showColors: true 36495 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 36496 spacing: 1, 36497 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("h2", { 36498 className: "block-editor-block-card__title", 36499 children: name?.length ? (0,external_wp_i18n_namespaceObject.sprintf)( 36500 // translators: 1: Custom block name. 2: Block title. 36501 (0,external_wp_i18n_namespaceObject._x)('%1$s (%2$s)', 'block label'), name, title) : title 36502 }), description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 36503 className: "block-editor-block-card__description", 36504 children: description 36505 })] 36506 })] 36507 }); 36508 } 36509 /* harmony default export */ const block_card = (BlockCard); 36510 36511 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/provider/with-registry-provider.js 36512 /** 36513 * WordPress dependencies 36514 */ 36515 36516 36517 36518 36519 /** 36520 * Internal dependencies 36521 */ 36522 36523 36524 36525 function getSubRegistry(subRegistries, registry, useSubRegistry) { 36526 if (!useSubRegistry) { 36527 return registry; 36528 } 36529 let subRegistry = subRegistries.get(registry); 36530 if (!subRegistry) { 36531 subRegistry = (0,external_wp_data_namespaceObject.createRegistry)({}, registry); 36532 subRegistry.registerStore(STORE_NAME, storeConfig); 36533 subRegistries.set(registry, subRegistry); 36534 } 36535 return subRegistry; 36536 } 36537 const withRegistryProvider = (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(WrappedComponent => ({ 36538 useSubRegistry = true, 36539 ...props 36540 }) => { 36541 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 36542 const [subRegistries] = (0,external_wp_element_namespaceObject.useState)(() => new WeakMap()); 36543 const subRegistry = getSubRegistry(subRegistries, registry, useSubRegistry); 36544 if (subRegistry === registry) { 36545 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, { 36546 registry: registry, 36547 ...props 36548 }); 36549 } 36550 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_data_namespaceObject.RegistryProvider, { 36551 value: subRegistry, 36552 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, { 36553 registry: subRegistry, 36554 ...props 36555 }) 36556 }); 36557 }, 'withRegistryProvider'); 36558 /* harmony default export */ const with_registry_provider = (withRegistryProvider); 36559 36560 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/provider/use-block-sync.js 36561 /** 36562 * WordPress dependencies 36563 */ 36564 36565 36566 36567 36568 /** 36569 * Internal dependencies 36570 */ 36571 36572 const use_block_sync_noop = () => {}; 36573 36574 /** 36575 * A function to call when the block value has been updated in the block-editor 36576 * store. 36577 * 36578 * @callback onBlockUpdate 36579 * @param {Object[]} blocks The updated blocks. 36580 * @param {Object} options The updated block options, such as selectionStart 36581 * and selectionEnd. 36582 */ 36583 36584 /** 36585 * useBlockSync is a side effect which handles bidirectional sync between the 36586 * block-editor store and a controlling data source which provides blocks. This 36587 * is most commonly used by the BlockEditorProvider to synchronize the contents 36588 * of the block-editor store with the root entity, like a post. 36589 * 36590 * Another example would be the template part block, which provides blocks from 36591 * a separate entity data source than a root entity. This hook syncs edits to 36592 * the template part in the block editor back to the entity and vice-versa. 36593 * 36594 * Here are some of its basic functions: 36595 * - Initalizes the block-editor store for the given clientID to the blocks 36596 * given via props. 36597 * - Adds incoming changes (like undo) to the block-editor store. 36598 * - Adds outgoing changes (like editing content) to the controlling entity, 36599 * determining if a change should be considered persistent or not. 36600 * - Handles edge cases and race conditions which occur in those operations. 36601 * - Ignores changes which happen to other entities (like nested inner block 36602 * controllers. 36603 * - Passes selection state from the block-editor store to the controlling entity. 36604 * 36605 * @param {Object} props Props for the block sync hook 36606 * @param {string} props.clientId The client ID of the inner block controller. 36607 * If none is passed, then it is assumed to be a 36608 * root controller rather than an inner block 36609 * controller. 36610 * @param {Object[]} props.value The control value for the blocks. This value 36611 * is used to initalize the block-editor store 36612 * and for resetting the blocks to incoming 36613 * changes like undo. 36614 * @param {Object} props.selection The selection state responsible to restore the selection on undo/redo. 36615 * @param {onBlockUpdate} props.onChange Function to call when a persistent 36616 * change has been made in the block-editor blocks 36617 * for the given clientId. For example, after 36618 * this function is called, an entity is marked 36619 * dirty because it has changes to save. 36620 * @param {onBlockUpdate} props.onInput Function to call when a non-persistent 36621 * change has been made in the block-editor blocks 36622 * for the given clientId. When this is called, 36623 * controlling sources do not become dirty. 36624 */ 36625 function useBlockSync({ 36626 clientId = null, 36627 value: controlledBlocks, 36628 selection: controlledSelection, 36629 onChange = use_block_sync_noop, 36630 onInput = use_block_sync_noop 36631 }) { 36632 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 36633 const { 36634 resetBlocks, 36635 resetSelection, 36636 replaceInnerBlocks, 36637 setHasControlledInnerBlocks, 36638 __unstableMarkNextChangeAsNotPersistent 36639 } = registry.dispatch(store); 36640 const { 36641 getBlockName, 36642 getBlocks, 36643 getSelectionStart, 36644 getSelectionEnd 36645 } = registry.select(store); 36646 const isControlled = (0,external_wp_data_namespaceObject.useSelect)(select => { 36647 return !clientId || select(store).areInnerBlocksControlled(clientId); 36648 }, [clientId]); 36649 const pendingChangesRef = (0,external_wp_element_namespaceObject.useRef)({ 36650 incoming: null, 36651 outgoing: [] 36652 }); 36653 const subscribedRef = (0,external_wp_element_namespaceObject.useRef)(false); 36654 const setControlledBlocks = () => { 36655 if (!controlledBlocks) { 36656 return; 36657 } 36658 36659 // We don't need to persist this change because we only replace 36660 // controlled inner blocks when the change was caused by an entity, 36661 // and so it would already be persisted. 36662 __unstableMarkNextChangeAsNotPersistent(); 36663 if (clientId) { 36664 // It is important to batch here because otherwise, 36665 // as soon as `setHasControlledInnerBlocks` is called 36666 // the effect to restore might be triggered 36667 // before the actual blocks get set properly in state. 36668 registry.batch(() => { 36669 setHasControlledInnerBlocks(clientId, true); 36670 const storeBlocks = controlledBlocks.map(block => (0,external_wp_blocks_namespaceObject.cloneBlock)(block)); 36671 if (subscribedRef.current) { 36672 pendingChangesRef.current.incoming = storeBlocks; 36673 } 36674 __unstableMarkNextChangeAsNotPersistent(); 36675 replaceInnerBlocks(clientId, storeBlocks); 36676 }); 36677 } else { 36678 if (subscribedRef.current) { 36679 pendingChangesRef.current.incoming = controlledBlocks; 36680 } 36681 resetBlocks(controlledBlocks); 36682 } 36683 }; 36684 36685 // Clean up the changes made by setControlledBlocks() when the component 36686 // containing useBlockSync() unmounts. 36687 const unsetControlledBlocks = () => { 36688 __unstableMarkNextChangeAsNotPersistent(); 36689 if (clientId) { 36690 setHasControlledInnerBlocks(clientId, false); 36691 __unstableMarkNextChangeAsNotPersistent(); 36692 replaceInnerBlocks(clientId, []); 36693 } else { 36694 resetBlocks([]); 36695 } 36696 }; 36697 36698 // Add a subscription to the block-editor registry to detect when changes 36699 // have been made. This lets us inform the data source of changes. This 36700 // is an effect so that the subscriber can run synchronously without 36701 // waiting for React renders for changes. 36702 const onInputRef = (0,external_wp_element_namespaceObject.useRef)(onInput); 36703 const onChangeRef = (0,external_wp_element_namespaceObject.useRef)(onChange); 36704 (0,external_wp_element_namespaceObject.useEffect)(() => { 36705 onInputRef.current = onInput; 36706 onChangeRef.current = onChange; 36707 }, [onInput, onChange]); 36708 36709 // Determine if blocks need to be reset when they change. 36710 (0,external_wp_element_namespaceObject.useEffect)(() => { 36711 if (pendingChangesRef.current.outgoing.includes(controlledBlocks)) { 36712 // Skip block reset if the value matches expected outbound sync 36713 // triggered by this component by a preceding change detection. 36714 // Only skip if the value matches expectation, since a reset should 36715 // still occur if the value is modified (not equal by reference), 36716 // to allow that the consumer may apply modifications to reflect 36717 // back on the editor. 36718 if (pendingChangesRef.current.outgoing[pendingChangesRef.current.outgoing.length - 1] === controlledBlocks) { 36719 pendingChangesRef.current.outgoing = []; 36720 } 36721 } else if (getBlocks(clientId) !== controlledBlocks) { 36722 // Reset changing value in all other cases than the sync described 36723 // above. Since this can be reached in an update following an out- 36724 // bound sync, unset the outbound value to avoid considering it in 36725 // subsequent renders. 36726 pendingChangesRef.current.outgoing = []; 36727 setControlledBlocks(); 36728 if (controlledSelection) { 36729 resetSelection(controlledSelection.selectionStart, controlledSelection.selectionEnd, controlledSelection.initialPosition); 36730 } 36731 } 36732 }, [controlledBlocks, clientId]); 36733 const isMountedRef = (0,external_wp_element_namespaceObject.useRef)(false); 36734 (0,external_wp_element_namespaceObject.useEffect)(() => { 36735 // On mount, controlled blocks are already set in the effect above. 36736 if (!isMountedRef.current) { 36737 isMountedRef.current = true; 36738 return; 36739 } 36740 36741 // When the block becomes uncontrolled, it means its inner state has been reset 36742 // we need to take the blocks again from the external value property. 36743 if (!isControlled) { 36744 pendingChangesRef.current.outgoing = []; 36745 setControlledBlocks(); 36746 } 36747 }, [isControlled]); 36748 (0,external_wp_element_namespaceObject.useEffect)(() => { 36749 const { 36750 getSelectedBlocksInitialCaretPosition, 36751 isLastBlockChangePersistent, 36752 __unstableIsLastBlockChangeIgnored, 36753 areInnerBlocksControlled 36754 } = registry.select(store); 36755 let blocks = getBlocks(clientId); 36756 let isPersistent = isLastBlockChangePersistent(); 36757 let previousAreBlocksDifferent = false; 36758 subscribedRef.current = true; 36759 const unsubscribe = registry.subscribe(() => { 36760 // Sometimes, when changing block lists, lingering subscriptions 36761 // might trigger before they are cleaned up. If the block for which 36762 // the subscription runs is no longer in the store, this would clear 36763 // its parent entity's block list. To avoid this, we bail out if 36764 // the subscription is triggering for a block (`clientId !== null`) 36765 // and its block name can't be found because it's not on the list. 36766 // (`getBlockName( clientId ) === null`). 36767 if (clientId !== null && getBlockName(clientId) === null) { 36768 return; 36769 } 36770 36771 // When RESET_BLOCKS on parent blocks get called, the controlled blocks 36772 // can reset to uncontrolled, in these situations, it means we need to populate 36773 // the blocks again from the external blocks (the value property here) 36774 // and we should stop triggering onChange 36775 const isStillControlled = !clientId || areInnerBlocksControlled(clientId); 36776 if (!isStillControlled) { 36777 return; 36778 } 36779 const newIsPersistent = isLastBlockChangePersistent(); 36780 const newBlocks = getBlocks(clientId); 36781 const areBlocksDifferent = newBlocks !== blocks; 36782 blocks = newBlocks; 36783 if (areBlocksDifferent && (pendingChangesRef.current.incoming || __unstableIsLastBlockChangeIgnored())) { 36784 pendingChangesRef.current.incoming = null; 36785 isPersistent = newIsPersistent; 36786 return; 36787 } 36788 36789 // Since we often dispatch an action to mark the previous action as 36790 // persistent, we need to make sure that the blocks changed on the 36791 // previous action before committing the change. 36792 const didPersistenceChange = previousAreBlocksDifferent && !areBlocksDifferent && newIsPersistent && !isPersistent; 36793 if (areBlocksDifferent || didPersistenceChange) { 36794 isPersistent = newIsPersistent; 36795 // We know that onChange/onInput will update controlledBlocks. 36796 // We need to be aware that it was caused by an outgoing change 36797 // so that we do not treat it as an incoming change later on, 36798 // which would cause a block reset. 36799 pendingChangesRef.current.outgoing.push(blocks); 36800 36801 // Inform the controlling entity that changes have been made to 36802 // the block-editor store they should be aware about. 36803 const updateParent = isPersistent ? onChangeRef.current : onInputRef.current; 36804 updateParent(blocks, { 36805 selection: { 36806 selectionStart: getSelectionStart(), 36807 selectionEnd: getSelectionEnd(), 36808 initialPosition: getSelectedBlocksInitialCaretPosition() 36809 } 36810 }); 36811 } 36812 previousAreBlocksDifferent = areBlocksDifferent; 36813 }, store); 36814 return () => { 36815 subscribedRef.current = false; 36816 unsubscribe(); 36817 }; 36818 }, [registry, clientId]); 36819 (0,external_wp_element_namespaceObject.useEffect)(() => { 36820 return () => { 36821 unsetControlledBlocks(); 36822 }; 36823 }, []); 36824 } 36825 36826 ;// CONCATENATED MODULE: external ["wp","keyboardShortcuts"] 36827 const external_wp_keyboardShortcuts_namespaceObject = window["wp"]["keyboardShortcuts"]; 36828 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/keyboard-shortcuts/index.js 36829 /** 36830 * WordPress dependencies 36831 */ 36832 36833 36834 36835 36836 function KeyboardShortcuts() { 36837 return null; 36838 } 36839 function KeyboardShortcutsRegister() { 36840 // Registering the shortcuts. 36841 const { 36842 registerShortcut 36843 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_keyboardShortcuts_namespaceObject.store); 36844 (0,external_wp_element_namespaceObject.useEffect)(() => { 36845 registerShortcut({ 36846 name: 'core/block-editor/duplicate', 36847 category: 'block', 36848 description: (0,external_wp_i18n_namespaceObject.__)('Duplicate the selected block(s).'), 36849 keyCombination: { 36850 modifier: 'primaryShift', 36851 character: 'd' 36852 } 36853 }); 36854 registerShortcut({ 36855 name: 'core/block-editor/remove', 36856 category: 'block', 36857 description: (0,external_wp_i18n_namespaceObject.__)('Remove the selected block(s).'), 36858 keyCombination: { 36859 modifier: 'access', 36860 character: 'z' 36861 } 36862 }); 36863 registerShortcut({ 36864 name: 'core/block-editor/insert-before', 36865 category: 'block', 36866 description: (0,external_wp_i18n_namespaceObject.__)('Insert a new block before the selected block(s).'), 36867 keyCombination: { 36868 modifier: 'primaryAlt', 36869 character: 't' 36870 } 36871 }); 36872 registerShortcut({ 36873 name: 'core/block-editor/insert-after', 36874 category: 'block', 36875 description: (0,external_wp_i18n_namespaceObject.__)('Insert a new block after the selected block(s).'), 36876 keyCombination: { 36877 modifier: 'primaryAlt', 36878 character: 'y' 36879 } 36880 }); 36881 registerShortcut({ 36882 name: 'core/block-editor/delete-multi-selection', 36883 category: 'block', 36884 description: (0,external_wp_i18n_namespaceObject.__)('Delete selection.'), 36885 keyCombination: { 36886 character: 'del' 36887 }, 36888 aliases: [{ 36889 character: 'backspace' 36890 }] 36891 }); 36892 registerShortcut({ 36893 name: 'core/block-editor/select-all', 36894 category: 'selection', 36895 description: (0,external_wp_i18n_namespaceObject.__)('Select all text when typing. Press again to select all blocks.'), 36896 keyCombination: { 36897 modifier: 'primary', 36898 character: 'a' 36899 } 36900 }); 36901 registerShortcut({ 36902 name: 'core/block-editor/unselect', 36903 category: 'selection', 36904 description: (0,external_wp_i18n_namespaceObject.__)('Clear selection.'), 36905 keyCombination: { 36906 character: 'escape' 36907 } 36908 }); 36909 registerShortcut({ 36910 name: 'core/block-editor/multi-text-selection', 36911 category: 'selection', 36912 description: (0,external_wp_i18n_namespaceObject.__)('Select text across multiple blocks.'), 36913 keyCombination: { 36914 modifier: 'shift', 36915 character: 'arrow' 36916 } 36917 }); 36918 registerShortcut({ 36919 name: 'core/block-editor/focus-toolbar', 36920 category: 'global', 36921 description: (0,external_wp_i18n_namespaceObject.__)('Navigate to the nearest toolbar.'), 36922 keyCombination: { 36923 modifier: 'alt', 36924 character: 'F10' 36925 } 36926 }); 36927 registerShortcut({ 36928 name: 'core/block-editor/move-up', 36929 category: 'block', 36930 description: (0,external_wp_i18n_namespaceObject.__)('Move the selected block(s) up.'), 36931 keyCombination: { 36932 modifier: 'secondary', 36933 character: 't' 36934 } 36935 }); 36936 registerShortcut({ 36937 name: 'core/block-editor/move-down', 36938 category: 'block', 36939 description: (0,external_wp_i18n_namespaceObject.__)('Move the selected block(s) down.'), 36940 keyCombination: { 36941 modifier: 'secondary', 36942 character: 'y' 36943 } 36944 }); 36945 36946 // List view shortcuts. 36947 registerShortcut({ 36948 name: 'core/block-editor/collapse-list-view', 36949 category: 'list-view', 36950 description: (0,external_wp_i18n_namespaceObject.__)('Collapse all other items.'), 36951 keyCombination: { 36952 modifier: 'alt', 36953 character: 'l' 36954 } 36955 }); 36956 registerShortcut({ 36957 name: 'core/block-editor/group', 36958 category: 'block', 36959 description: (0,external_wp_i18n_namespaceObject.__)('Create a group block from the selected multiple blocks.'), 36960 keyCombination: { 36961 modifier: 'primary', 36962 character: 'g' 36963 } 36964 }); 36965 }, [registerShortcut]); 36966 return null; 36967 } 36968 KeyboardShortcuts.Register = KeyboardShortcutsRegister; 36969 /* harmony default export */ const keyboard_shortcuts = (KeyboardShortcuts); 36970 36971 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/provider/index.js 36972 /** 36973 * WordPress dependencies 36974 */ 36975 36976 36977 36978 36979 /** 36980 * Internal dependencies 36981 */ 36982 36983 36984 36985 36986 36987 36988 36989 /** @typedef {import('@wordpress/data').WPDataRegistry} WPDataRegistry */ 36990 36991 36992 const ExperimentalBlockEditorProvider = with_registry_provider(props => { 36993 const { 36994 children, 36995 settings, 36996 stripExperimentalSettings = false 36997 } = props; 36998 const { 36999 __experimentalUpdateSettings 37000 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 37001 (0,external_wp_element_namespaceObject.useEffect)(() => { 37002 __experimentalUpdateSettings({ 37003 ...settings, 37004 __internalIsInitialized: true 37005 }, { 37006 stripExperimentalSettings, 37007 reset: true 37008 }); 37009 }, [settings, stripExperimentalSettings, __experimentalUpdateSettings]); 37010 37011 // Syncs the entity provider with changes in the block-editor store. 37012 useBlockSync(props); 37013 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.SlotFillProvider, { 37014 passthrough: true, 37015 children: [!settings?.__unstableIsPreviewMode && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(keyboard_shortcuts.Register, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockRefsProvider, { 37016 children: children 37017 })] 37018 }); 37019 }); 37020 const BlockEditorProvider = props => { 37021 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ExperimentalBlockEditorProvider, { 37022 ...props, 37023 stripExperimentalSettings: true, 37024 children: props.children 37025 }); 37026 }; 37027 /* harmony default export */ const provider = (BlockEditorProvider); 37028 37029 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-context/index.js 37030 /** 37031 * WordPress dependencies 37032 */ 37033 37034 37035 /** @typedef {import('react').ReactNode} ReactNode */ 37036 37037 /** 37038 * @typedef BlockContextProviderProps 37039 * 37040 * @property {Record<string,*>} value Context value to merge with current 37041 * value. 37042 * @property {ReactNode} children Component children. 37043 */ 37044 37045 /** @type {import('react').Context<Record<string,*>>} */ 37046 37047 const block_context_Context = (0,external_wp_element_namespaceObject.createContext)({}); 37048 37049 /** 37050 * Component which merges passed value with current consumed block context. 37051 * 37052 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-context/README.md 37053 * 37054 * @param {BlockContextProviderProps} props 37055 */ 37056 function BlockContextProvider({ 37057 value, 37058 children 37059 }) { 37060 const context = (0,external_wp_element_namespaceObject.useContext)(block_context_Context); 37061 const nextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 37062 ...context, 37063 ...value 37064 }), [context, value]); 37065 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_context_Context.Provider, { 37066 value: nextValue, 37067 children: children 37068 }); 37069 } 37070 /* harmony default export */ const block_context = (block_context_Context); 37071 37072 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-edit/edit.js 37073 /** 37074 * External dependencies 37075 */ 37076 37077 37078 /** 37079 * WordPress dependencies 37080 */ 37081 37082 37083 37084 37085 /** 37086 * Internal dependencies 37087 */ 37088 37089 37090 /** 37091 * Default value used for blocks which do not define their own context needs, 37092 * used to guarantee that a block's `context` prop will always be an object. It 37093 * is assigned as a constant since it is always expected to be an empty object, 37094 * and in order to avoid unnecessary React reconciliations of a changing object. 37095 * 37096 * @type {{}} 37097 */ 37098 37099 const DEFAULT_BLOCK_CONTEXT = {}; 37100 const Edit = props => { 37101 const { 37102 name 37103 } = props; 37104 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(name); 37105 if (!blockType) { 37106 return null; 37107 } 37108 37109 // `edit` and `save` are functions or components describing the markup 37110 // with which a block is displayed. If `blockType` is valid, assign 37111 // them preferentially as the render value for the block. 37112 const Component = blockType.edit || blockType.save; 37113 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, { 37114 ...props 37115 }); 37116 }; 37117 const EditWithFilters = (0,external_wp_components_namespaceObject.withFilters)('editor.BlockEdit')(Edit); 37118 const EditWithGeneratedProps = props => { 37119 const { 37120 attributes = {}, 37121 name 37122 } = props; 37123 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(name); 37124 const blockContext = (0,external_wp_element_namespaceObject.useContext)(block_context); 37125 37126 // Assign context values using the block type's declared context needs. 37127 const context = (0,external_wp_element_namespaceObject.useMemo)(() => { 37128 return blockType && blockType.usesContext ? Object.fromEntries(Object.entries(blockContext).filter(([key]) => blockType.usesContext.includes(key))) : DEFAULT_BLOCK_CONTEXT; 37129 }, [blockType, blockContext]); 37130 if (!blockType) { 37131 return null; 37132 } 37133 if (blockType.apiVersion > 1) { 37134 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(EditWithFilters, { 37135 ...props, 37136 context: context 37137 }); 37138 } 37139 37140 // Generate a class name for the block's editable form. 37141 const generatedClassName = (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'className', true) ? (0,external_wp_blocks_namespaceObject.getBlockDefaultClassName)(name) : null; 37142 const className = dist_clsx(generatedClassName, attributes.className, props.className); 37143 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(EditWithFilters, { 37144 ...props, 37145 context: context, 37146 className: className 37147 }); 37148 }; 37149 /* harmony default export */ const block_edit_edit = (EditWithGeneratedProps); 37150 37151 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/more-vertical.js 37152 /** 37153 * WordPress dependencies 37154 */ 37155 37156 37157 const moreVertical = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 37158 xmlns: "http://www.w3.org/2000/svg", 37159 viewBox: "0 0 24 24", 37160 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 37161 d: "M13 19h-2v-2h2v2zm0-6h-2v-2h2v2zm0-6h-2V5h2v2z" 37162 }) 37163 }); 37164 /* harmony default export */ const more_vertical = (moreVertical); 37165 37166 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/warning/index.js 37167 /** 37168 * External dependencies 37169 */ 37170 37171 37172 /** 37173 * WordPress dependencies 37174 */ 37175 37176 37177 37178 37179 37180 37181 function Warning({ 37182 className, 37183 actions, 37184 children, 37185 secondaryActions 37186 }) { 37187 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 37188 style: { 37189 display: 'contents', 37190 all: 'initial' 37191 }, 37192 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 37193 className: dist_clsx(className, 'block-editor-warning'), 37194 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 37195 className: "block-editor-warning__contents", 37196 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 37197 className: "block-editor-warning__message", 37198 children: children 37199 }), (external_wp_element_namespaceObject.Children.count(actions) > 0 || secondaryActions) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 37200 className: "block-editor-warning__actions", 37201 children: [external_wp_element_namespaceObject.Children.count(actions) > 0 && external_wp_element_namespaceObject.Children.map(actions, (action, i) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 37202 className: "block-editor-warning__action", 37203 children: action 37204 }, i)), secondaryActions && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropdownMenu, { 37205 className: "block-editor-warning__secondary", 37206 icon: more_vertical, 37207 label: (0,external_wp_i18n_namespaceObject.__)('More options'), 37208 popoverProps: { 37209 position: 'bottom left', 37210 className: 'block-editor-warning__dropdown' 37211 }, 37212 noIcons: true, 37213 children: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 37214 children: secondaryActions.map((item, pos) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 37215 onClick: item.onClick, 37216 children: item.title 37217 }, pos)) 37218 }) 37219 })] 37220 })] 37221 }) 37222 }) 37223 }); 37224 } 37225 37226 /** 37227 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/warning/README.md 37228 */ 37229 /* harmony default export */ const warning = (Warning); 37230 37231 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-edit/multiple-usage-warning.js 37232 /** 37233 * WordPress dependencies 37234 */ 37235 37236 37237 37238 37239 37240 /** 37241 * Internal dependencies 37242 */ 37243 37244 37245 37246 37247 function MultipleUsageWarning({ 37248 originalBlockClientId, 37249 name, 37250 onReplace 37251 }) { 37252 const { 37253 selectBlock 37254 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 37255 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(name); 37256 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(warning, { 37257 actions: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 37258 __next40pxDefaultSize: true, 37259 variant: "secondary", 37260 onClick: () => selectBlock(originalBlockClientId), 37261 children: (0,external_wp_i18n_namespaceObject.__)('Find original') 37262 }, "find-original"), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 37263 __next40pxDefaultSize: true, 37264 variant: "secondary", 37265 onClick: () => onReplace([]), 37266 children: (0,external_wp_i18n_namespaceObject.__)('Remove') 37267 }, "remove")], 37268 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("strong", { 37269 children: [blockType?.title, ": "] 37270 }), (0,external_wp_i18n_namespaceObject.__)('This block can only be used once.')] 37271 }); 37272 } 37273 37274 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/private-block-context.js 37275 /** 37276 * WordPress dependencies 37277 */ 37278 37279 const PrivateBlockContext = (0,external_wp_element_namespaceObject.createContext)({}); 37280 37281 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-edit/index.js 37282 /** 37283 * WordPress dependencies 37284 */ 37285 37286 37287 37288 /** 37289 * Internal dependencies 37290 */ 37291 37292 37293 37294 37295 37296 /** 37297 * The `useBlockEditContext` hook provides information about the block this hook is being used in. 37298 * It returns an object with the `name`, `isSelected` state, and the `clientId` of the block. 37299 * It is useful if you want to create custom hooks that need access to the current blocks clientId 37300 * but don't want to rely on the data getting passed in as a parameter. 37301 * 37302 * @return {Object} Block edit context 37303 */ 37304 37305 37306 37307 function BlockEdit({ 37308 mayDisplayControls, 37309 mayDisplayParentControls, 37310 blockEditingMode, 37311 isPreviewMode, 37312 // The remaining props are passed through the BlockEdit filters and are thus 37313 // public API! 37314 ...props 37315 }) { 37316 const { 37317 name, 37318 isSelected, 37319 clientId, 37320 attributes = {}, 37321 __unstableLayoutClassNames 37322 } = props; 37323 const { 37324 layout = null, 37325 metadata = {} 37326 } = attributes; 37327 const { 37328 bindings 37329 } = metadata; 37330 const layoutSupport = (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, 'layout', false) || (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, '__experimentalLayout', false); 37331 const { 37332 originalBlockClientId 37333 } = (0,external_wp_element_namespaceObject.useContext)(PrivateBlockContext); 37334 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Provider 37335 // It is important to return the same object if props haven't 37336 // changed to avoid unnecessary rerenders. 37337 // See https://reactjs.org/docs/context.html#caveats. 37338 , { 37339 value: (0,external_wp_element_namespaceObject.useMemo)(() => ({ 37340 name, 37341 isSelected, 37342 clientId, 37343 layout: layoutSupport ? layout : null, 37344 __unstableLayoutClassNames, 37345 // We use symbols in favour of an __unstable prefix to avoid 37346 // usage outside of the package (this context is exposed). 37347 [mayDisplayControlsKey]: mayDisplayControls, 37348 [mayDisplayParentControlsKey]: mayDisplayParentControls, 37349 [blockEditingModeKey]: blockEditingMode, 37350 [blockBindingsKey]: bindings, 37351 [isPreviewModeKey]: isPreviewMode 37352 }), [name, isSelected, clientId, layoutSupport, layout, __unstableLayoutClassNames, mayDisplayControls, mayDisplayParentControls, blockEditingMode, bindings, isPreviewMode]), 37353 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_edit_edit, { 37354 ...props 37355 }), originalBlockClientId && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MultipleUsageWarning, { 37356 originalBlockClientId: originalBlockClientId, 37357 name: name, 37358 onReplace: props.onReplace 37359 })] 37360 }); 37361 } 37362 37363 // EXTERNAL MODULE: ./node_modules/diff/lib/diff/character.js 37364 var character = __webpack_require__(8021); 37365 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-compare/block-view.js 37366 /** 37367 * WordPress dependencies 37368 */ 37369 37370 37371 37372 37373 37374 function BlockView({ 37375 title, 37376 rawContent, 37377 renderedContent, 37378 action, 37379 actionText, 37380 className 37381 }) { 37382 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 37383 className: className, 37384 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 37385 className: "block-editor-block-compare__content", 37386 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("h2", { 37387 className: "block-editor-block-compare__heading", 37388 children: title 37389 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 37390 className: "block-editor-block-compare__html", 37391 children: rawContent 37392 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 37393 className: "block-editor-block-compare__preview edit-post-visual-editor", 37394 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_element_namespaceObject.RawHTML, { 37395 children: (0,external_wp_dom_namespaceObject.safeHTML)(renderedContent) 37396 }) 37397 })] 37398 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 37399 className: "block-editor-block-compare__action", 37400 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 37401 __next40pxDefaultSize: true, 37402 variant: "secondary", 37403 tabIndex: "0", 37404 onClick: action, 37405 children: actionText 37406 }) 37407 })] 37408 }); 37409 } 37410 37411 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-compare/index.js 37412 /** 37413 * External dependencies 37414 */ 37415 37416 // diff doesn't tree-shake correctly, so we import from the individual 37417 // module here, to avoid including too much of the library 37418 37419 37420 /** 37421 * WordPress dependencies 37422 */ 37423 37424 37425 37426 /** 37427 * Internal dependencies 37428 */ 37429 37430 37431 37432 function BlockCompare({ 37433 block, 37434 onKeep, 37435 onConvert, 37436 convertor, 37437 convertButtonText 37438 }) { 37439 function getDifference(originalContent, newContent) { 37440 const difference = (0,character/* diffChars */.JJ)(originalContent, newContent); 37441 return difference.map((item, pos) => { 37442 const classes = dist_clsx({ 37443 'block-editor-block-compare__added': item.added, 37444 'block-editor-block-compare__removed': item.removed 37445 }); 37446 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 37447 className: classes, 37448 children: item.value 37449 }, pos); 37450 }); 37451 } 37452 function getConvertedContent(convertedBlock) { 37453 // The convertor may return an array of items or a single item. 37454 const newBlocks = Array.isArray(convertedBlock) ? convertedBlock : [convertedBlock]; 37455 37456 // Get converted block details. 37457 const newContent = newBlocks.map(item => (0,external_wp_blocks_namespaceObject.getSaveContent)(item.name, item.attributes, item.innerBlocks)); 37458 return newContent.join(''); 37459 } 37460 const converted = getConvertedContent(convertor(block)); 37461 const difference = getDifference(block.originalContent, converted); 37462 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 37463 className: "block-editor-block-compare__wrapper", 37464 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockView, { 37465 title: (0,external_wp_i18n_namespaceObject.__)('Current'), 37466 className: "block-editor-block-compare__current", 37467 action: onKeep, 37468 actionText: (0,external_wp_i18n_namespaceObject.__)('Convert to HTML'), 37469 rawContent: block.originalContent, 37470 renderedContent: block.originalContent 37471 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockView, { 37472 title: (0,external_wp_i18n_namespaceObject.__)('After Conversion'), 37473 className: "block-editor-block-compare__converted", 37474 action: onConvert, 37475 actionText: convertButtonText, 37476 rawContent: difference, 37477 renderedContent: converted 37478 })] 37479 }); 37480 } 37481 /* harmony default export */ const block_compare = (BlockCompare); 37482 37483 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/block-invalid-warning.js 37484 /** 37485 * WordPress dependencies 37486 */ 37487 37488 37489 37490 37491 37492 37493 /** 37494 * Internal dependencies 37495 */ 37496 37497 37498 37499 37500 37501 37502 const blockToBlocks = block => (0,external_wp_blocks_namespaceObject.rawHandler)({ 37503 HTML: block.originalContent 37504 }); 37505 function BlockInvalidWarning({ 37506 clientId 37507 }) { 37508 const { 37509 block, 37510 canInsertHTMLBlock, 37511 canInsertClassicBlock 37512 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 37513 const { 37514 canInsertBlockType, 37515 getBlock, 37516 getBlockRootClientId 37517 } = select(store); 37518 const rootClientId = getBlockRootClientId(clientId); 37519 return { 37520 block: getBlock(clientId), 37521 canInsertHTMLBlock: canInsertBlockType('core/html', rootClientId), 37522 canInsertClassicBlock: canInsertBlockType('core/freeform', rootClientId) 37523 }; 37524 }, [clientId]); 37525 const { 37526 replaceBlock 37527 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 37528 const [compare, setCompare] = (0,external_wp_element_namespaceObject.useState)(false); 37529 const onCompareClose = (0,external_wp_element_namespaceObject.useCallback)(() => setCompare(false), []); 37530 const convert = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 37531 toClassic() { 37532 const classicBlock = (0,external_wp_blocks_namespaceObject.createBlock)('core/freeform', { 37533 content: block.originalContent 37534 }); 37535 return replaceBlock(block.clientId, classicBlock); 37536 }, 37537 toHTML() { 37538 const htmlBlock = (0,external_wp_blocks_namespaceObject.createBlock)('core/html', { 37539 content: block.originalContent 37540 }); 37541 return replaceBlock(block.clientId, htmlBlock); 37542 }, 37543 toBlocks() { 37544 const newBlocks = blockToBlocks(block); 37545 return replaceBlock(block.clientId, newBlocks); 37546 }, 37547 toRecoveredBlock() { 37548 const recoveredBlock = (0,external_wp_blocks_namespaceObject.createBlock)(block.name, block.attributes, block.innerBlocks); 37549 return replaceBlock(block.clientId, recoveredBlock); 37550 } 37551 }), [block, replaceBlock]); 37552 const secondaryActions = (0,external_wp_element_namespaceObject.useMemo)(() => [{ 37553 // translators: Button to fix block content 37554 title: (0,external_wp_i18n_namespaceObject._x)('Resolve', 'imperative verb'), 37555 onClick: () => setCompare(true) 37556 }, canInsertHTMLBlock && { 37557 title: (0,external_wp_i18n_namespaceObject.__)('Convert to HTML'), 37558 onClick: convert.toHTML 37559 }, canInsertClassicBlock && { 37560 title: (0,external_wp_i18n_namespaceObject.__)('Convert to Classic Block'), 37561 onClick: convert.toClassic 37562 }].filter(Boolean), [canInsertHTMLBlock, canInsertClassicBlock, convert]); 37563 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 37564 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(warning, { 37565 actions: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 37566 __next40pxDefaultSize: true, 37567 onClick: convert.toRecoveredBlock, 37568 variant: "primary", 37569 children: (0,external_wp_i18n_namespaceObject.__)('Attempt recovery') 37570 }, "recover")], 37571 secondaryActions: secondaryActions, 37572 children: (0,external_wp_i18n_namespaceObject.__)('Block contains unexpected or invalid content.') 37573 }), compare && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Modal, { 37574 title: 37575 // translators: Dialog title to fix block content 37576 (0,external_wp_i18n_namespaceObject.__)('Resolve Block'), 37577 onRequestClose: onCompareClose, 37578 className: "block-editor-block-compare", 37579 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_compare, { 37580 block: block, 37581 onKeep: convert.toHTML, 37582 onConvert: convert.toBlocks, 37583 convertor: blockToBlocks, 37584 convertButtonText: (0,external_wp_i18n_namespaceObject.__)('Convert to Blocks') 37585 }) 37586 })] 37587 }); 37588 } 37589 37590 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/block-crash-warning.js 37591 /** 37592 * WordPress dependencies 37593 */ 37594 37595 37596 /** 37597 * Internal dependencies 37598 */ 37599 37600 37601 const block_crash_warning_warning = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(warning, { 37602 className: "block-editor-block-list__block-crash-warning", 37603 children: (0,external_wp_i18n_namespaceObject.__)('This block has encountered an error and cannot be previewed.') 37604 }); 37605 /* harmony default export */ const block_crash_warning = (() => block_crash_warning_warning); 37606 37607 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/block-crash-boundary.js 37608 /** 37609 * WordPress dependencies 37610 */ 37611 37612 class BlockCrashBoundary extends external_wp_element_namespaceObject.Component { 37613 constructor() { 37614 super(...arguments); 37615 this.state = { 37616 hasError: false 37617 }; 37618 } 37619 componentDidCatch() { 37620 this.setState({ 37621 hasError: true 37622 }); 37623 } 37624 render() { 37625 if (this.state.hasError) { 37626 return this.props.fallback; 37627 } 37628 return this.props.children; 37629 } 37630 } 37631 /* harmony default export */ const block_crash_boundary = (BlockCrashBoundary); 37632 37633 // EXTERNAL MODULE: ./node_modules/react-autosize-textarea/lib/index.js 37634 var lib = __webpack_require__(4132); 37635 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/block-html.js 37636 /** 37637 * External dependencies 37638 */ 37639 37640 37641 /** 37642 * WordPress dependencies 37643 */ 37644 37645 37646 37647 37648 /** 37649 * Internal dependencies 37650 */ 37651 37652 37653 function BlockHTML({ 37654 clientId 37655 }) { 37656 const [html, setHtml] = (0,external_wp_element_namespaceObject.useState)(''); 37657 const block = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getBlock(clientId), [clientId]); 37658 const { 37659 updateBlock 37660 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 37661 const onChange = () => { 37662 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(block.name); 37663 if (!blockType) { 37664 return; 37665 } 37666 const attributes = (0,external_wp_blocks_namespaceObject.getBlockAttributes)(blockType, html, block.attributes); 37667 37668 // If html is empty we reset the block to the default HTML and mark it as valid to avoid triggering an error 37669 const content = html ? html : (0,external_wp_blocks_namespaceObject.getSaveContent)(blockType, attributes); 37670 const [isValid] = html ? (0,external_wp_blocks_namespaceObject.validateBlock)({ 37671 ...block, 37672 attributes, 37673 originalContent: content 37674 }) : [true]; 37675 updateBlock(clientId, { 37676 attributes, 37677 originalContent: content, 37678 isValid 37679 }); 37680 37681 // Ensure the state is updated if we reset so it displays the default content. 37682 if (!html) { 37683 setHtml(content); 37684 } 37685 }; 37686 (0,external_wp_element_namespaceObject.useEffect)(() => { 37687 setHtml((0,external_wp_blocks_namespaceObject.getBlockContent)(block)); 37688 }, [block]); 37689 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(lib/* default */.A, { 37690 className: "block-editor-block-list__block-html-textarea", 37691 value: html, 37692 onBlur: onChange, 37693 onChange: event => setHtml(event.target.value) 37694 }); 37695 } 37696 /* harmony default export */ const block_html = (BlockHTML); 37697 37698 ;// CONCATENATED MODULE: ./node_modules/@react-spring/rafz/dist/esm/index.js 37699 var esm_f=esm_l(),esm_n=e=>esm_c(e,esm_f),esm_m=esm_l();esm_n.write=e=>esm_c(e,esm_m);var esm_d=esm_l();esm_n.onStart=e=>esm_c(e,esm_d);var esm_h=esm_l();esm_n.onFrame=e=>esm_c(e,esm_h);var esm_p=esm_l();esm_n.onFinish=e=>esm_c(e,esm_p);var esm_i=[];esm_n.setTimeout=(e,t)=>{let a=esm_n.now()+t,o=()=>{let F=esm_i.findIndex(z=>z.cancel==o);~F&&esm_i.splice(F,1),esm_u-=~F?1:0},s={time:a,handler:e,cancel:o};return esm_i.splice(esm_w(a),0,s),esm_u+=1,esm_v(),s};var esm_w=e=>~(~esm_i.findIndex(t=>t.time>e)||~esm_i.length);esm_n.cancel=e=>{esm_d.delete(e),esm_h.delete(e),esm_p.delete(e),esm_f.delete(e),esm_m.delete(e)};esm_n.sync=e=>{T=!0,esm_n.batchedUpdates(e),T=!1};esm_n.throttle=e=>{let t;function a(){try{e(...t)}finally{t=null}}function o(...s){t=s,esm_n.onStart(a)}return o.handler=e,o.cancel=()=>{esm_d.delete(a),t=null},o};var esm_y=typeof window<"u"?window.requestAnimationFrame:()=>{};esm_n.use=e=>esm_y=e;esm_n.now=typeof performance<"u"?()=>performance.now():Date.now;esm_n.batchedUpdates=e=>e();esm_n.catch=console.error;esm_n.frameLoop="always";esm_n.advance=()=>{esm_n.frameLoop!=="demand"?console.warn("Cannot call the manual advancement of rafz whilst frameLoop is not set as demand"):esm_x()};var esm_r=-1,esm_u=0,T=!1;function esm_c(e,t){T?(t.delete(e),e(0)):(t.add(e),esm_v())}function esm_v(){esm_r<0&&(esm_r=0,esm_n.frameLoop!=="demand"&&esm_y(esm_b))}function esm_R(){esm_r=-1}function esm_b(){~esm_r&&(esm_y(esm_b),esm_n.batchedUpdates(esm_x))}function esm_x(){let e=esm_r;esm_r=esm_n.now();let t=esm_w(esm_r);if(t&&(Q(esm_i.splice(0,t),a=>a.handler()),esm_u-=t),!esm_u){esm_R();return}esm_d.flush(),esm_f.flush(e?Math.min(64,esm_r-e):16.667),esm_h.flush(),esm_m.flush(),esm_p.flush()}function esm_l(){let e=new Set,t=e;return{add(a){esm_u+=t==e&&!e.has(a)?1:0,e.add(a)},delete(a){return esm_u-=t==e&&e.has(a)?1:0,e.delete(a)},flush(a){t.size&&(e=new Set,esm_u-=t.size,Q(t,o=>o(a)&&e.add(o)),esm_u+=e.size,t=e)}}}function Q(e,t){e.forEach(a=>{try{t(a)}catch(o){esm_n.catch(o)}})}var esm_S={count(){return esm_u},isRunning(){return esm_r>=0},clear(){esm_r=-1,esm_i=[],esm_d=esm_l(),esm_f=esm_l(),esm_h=esm_l(),esm_m=esm_l(),esm_p=esm_l(),esm_u=0}}; 37700 37701 ;// CONCATENATED MODULE: ./node_modules/@react-spring/shared/dist/esm/index.js 37702 var ze=Object.defineProperty;var Le=(e,t)=>{for(var r in t)ze(e,r,{get:t[r],enumerable:!0})};var dist_esm_p={};Le(dist_esm_p,{assign:()=>U,colors:()=>dist_esm_c,createStringInterpolator:()=>esm_k,skipAnimation:()=>ee,to:()=>J,willAdvance:()=>dist_esm_S});function Y(){}var mt=(e,t,r)=>Object.defineProperty(e,t,{value:r,writable:!0,configurable:!0}),dist_esm_l={arr:Array.isArray,obj:e=>!!e&&e.constructor.name==="Object",fun:e=>typeof e=="function",str:e=>typeof e=="string",num:e=>typeof e=="number",und:e=>e===void 0};function bt(e,t){if(dist_esm_l.arr(e)){if(!dist_esm_l.arr(t)||e.length!==t.length)return!1;for(let r=0;r<e.length;r++)if(e[r]!==t[r])return!1;return!0}return e===t}var esm_Ve=(e,t)=>e.forEach(t);function xt(e,t,r){if(dist_esm_l.arr(e)){for(let n=0;n<e.length;n++)t.call(r,e[n],`$n}`);return}for(let n in e)e.hasOwnProperty(n)&&t.call(r,e[n],n)}var ht=e=>dist_esm_l.und(e)?[]:dist_esm_l.arr(e)?e:[e];function Pe(e,t){if(e.size){let r=Array.from(e);e.clear(),esm_Ve(r,t)}}var yt=(e,...t)=>Pe(e,r=>r(...t)),dist_esm_h=()=>typeof window>"u"||!window.navigator||/ServerSideRendering|^Deno\//.test(window.navigator.userAgent);var esm_k,J,dist_esm_c=null,ee=!1,dist_esm_S=Y,U=e=>{e.to&&(J=e.to),e.now&&(esm_n.now=e.now),e.colors!==void 0&&(dist_esm_c=e.colors),e.skipAnimation!=null&&(ee=e.skipAnimation),e.createStringInterpolator&&(esm_k=e.createStringInterpolator),e.requestAnimationFrame&&esm_n.use(e.requestAnimationFrame),e.batchedUpdates&&(esm_n.batchedUpdates=e.batchedUpdates),e.willAdvance&&(dist_esm_S=e.willAdvance),e.frameLoop&&(esm_n.frameLoop=e.frameLoop)};var esm_E=new Set,dist_esm_u=[],esm_H=[],A=0,qe={get idle(){return!esm_E.size&&!dist_esm_u.length},start(e){A>e.priority?(esm_E.add(e),esm_n.onStart($e)):(te(e),esm_n(B))},advance:B,sort(e){if(A)esm_n.onFrame(()=>qe.sort(e));else{let t=dist_esm_u.indexOf(e);~t&&(dist_esm_u.splice(t,1),re(e))}},clear(){dist_esm_u=[],esm_E.clear()}};function $e(){esm_E.forEach(te),esm_E.clear(),esm_n(B)}function te(e){dist_esm_u.includes(e)||re(e)}function re(e){dist_esm_u.splice(Ge(dist_esm_u,t=>t.priority>e.priority),0,e)}function B(e){let t=esm_H;for(let r=0;r<dist_esm_u.length;r++){let n=dist_esm_u[r];A=n.priority,n.idle||(dist_esm_S(n),n.advance(e),n.idle||t.push(n))}return A=0,esm_H=dist_esm_u,esm_H.length=0,dist_esm_u=t,dist_esm_u.length>0}function Ge(e,t){let r=e.findIndex(t);return r<0?e.length:r}var ne=(e,t,r)=>Math.min(Math.max(r,e),t);var It={transparent:0,aliceblue:4042850303,antiquewhite:4209760255,aqua:16777215,aquamarine:2147472639,azure:4043309055,beige:4126530815,bisque:4293182719,black:255,blanchedalmond:4293643775,blue:65535,blueviolet:2318131967,brown:2771004159,burlywood:3736635391,burntsienna:3934150143,cadetblue:1604231423,chartreuse:2147418367,chocolate:3530104575,coral:4286533887,cornflowerblue:1687547391,cornsilk:4294499583,crimson:3692313855,cyan:16777215,darkblue:35839,darkcyan:9145343,darkgoldenrod:3095792639,darkgray:2846468607,darkgreen:6553855,darkgrey:2846468607,darkkhaki:3182914559,darkmagenta:2332068863,darkolivegreen:1433087999,darkorange:4287365375,darkorchid:2570243327,darkred:2332033279,darksalmon:3918953215,darkseagreen:2411499519,darkslateblue:1211993087,darkslategray:793726975,darkslategrey:793726975,darkturquoise:13554175,darkviolet:2483082239,deeppink:4279538687,deepskyblue:12582911,dimgray:1768516095,dimgrey:1768516095,dodgerblue:512819199,firebrick:2988581631,floralwhite:4294635775,forestgreen:579543807,fuchsia:4278255615,gainsboro:3705462015,ghostwhite:4177068031,gold:4292280575,goldenrod:3668254975,gray:2155905279,green:8388863,greenyellow:2919182335,grey:2155905279,honeydew:4043305215,hotpink:4285117695,indianred:3445382399,indigo:1258324735,ivory:4294963455,khaki:4041641215,lavender:3873897215,lavenderblush:4293981695,lawngreen:2096890111,lemonchiffon:4294626815,lightblue:2916673279,lightcoral:4034953471,lightcyan:3774873599,lightgoldenrodyellow:4210742015,lightgray:3553874943,lightgreen:2431553791,lightgrey:3553874943,lightpink:4290167295,lightsalmon:4288707327,lightseagreen:548580095,lightskyblue:2278488831,lightslategray:2005441023,lightslategrey:2005441023,lightsteelblue:2965692159,lightyellow:4294959359,lime:16711935,limegreen:852308735,linen:4210091775,magenta:4278255615,maroon:2147483903,mediumaquamarine:1724754687,mediumblue:52735,mediumorchid:3126187007,mediumpurple:2473647103,mediumseagreen:1018393087,mediumslateblue:2070474495,mediumspringgreen:16423679,mediumturquoise:1221709055,mediumvioletred:3340076543,midnightblue:421097727,mintcream:4127193855,mistyrose:4293190143,moccasin:4293178879,navajowhite:4292783615,navy:33023,oldlace:4260751103,olive:2155872511,olivedrab:1804477439,orange:4289003775,orangered:4282712319,orchid:3664828159,palegoldenrod:4008225535,palegreen:2566625535,paleturquoise:2951671551,palevioletred:3681588223,papayawhip:4293907967,peachpuff:4292524543,peru:3448061951,pink:4290825215,plum:3718307327,powderblue:2967529215,purple:2147516671,rebeccapurple:1714657791,red:4278190335,rosybrown:3163525119,royalblue:1097458175,saddlebrown:2336560127,salmon:4202722047,sandybrown:4104413439,seagreen:780883967,seashell:4294307583,sienna:2689740287,silver:3233857791,skyblue:2278484991,slateblue:1784335871,slategray:1887473919,slategrey:1887473919,snow:4294638335,springgreen:16744447,steelblue:1182971135,tan:3535047935,teal:8421631,thistle:3636451583,tomato:4284696575,turquoise:1088475391,violet:4001558271,wheat:4125012991,white:4294967295,whitesmoke:4126537215,yellow:4294902015,yellowgreen:2597139199};var dist_esm_d="[-+]?\\d*\\.?\\d+",esm_M=dist_esm_d+"%";function C(...e){return"\\(\\s*("+e.join(")\\s*,\\s*(")+")\\s*\\)"}var oe=new RegExp("rgb"+C(dist_esm_d,dist_esm_d,dist_esm_d)),fe=new RegExp("rgba"+C(dist_esm_d,dist_esm_d,dist_esm_d,dist_esm_d)),ae=new RegExp("hsl"+C(dist_esm_d,esm_M,esm_M)),ie=new RegExp("hsla"+C(dist_esm_d,esm_M,esm_M,dist_esm_d)),se=/^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,ue=/^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,le=/^#([0-9a-fA-F]{6})$/,esm_ce=/^#([0-9a-fA-F]{8})$/;function be(e){let t;return typeof e=="number"?e>>>0===e&&e>=0&&e<=4294967295?e:null:(t=le.exec(e))?parseInt(t[1]+"ff",16)>>>0:dist_esm_c&&dist_esm_c[e]!==void 0?dist_esm_c[e]:(t=oe.exec(e))?(dist_esm_y(t[1])<<24|dist_esm_y(t[2])<<16|dist_esm_y(t[3])<<8|255)>>>0:(t=fe.exec(e))?(dist_esm_y(t[1])<<24|dist_esm_y(t[2])<<16|dist_esm_y(t[3])<<8|me(t[4]))>>>0:(t=se.exec(e))?parseInt(t[1]+t[1]+t[2]+t[2]+t[3]+t[3]+"ff",16)>>>0:(t=esm_ce.exec(e))?parseInt(t[1],16)>>>0:(t=ue.exec(e))?parseInt(t[1]+t[1]+t[2]+t[2]+t[3]+t[3]+t[4]+t[4],16)>>>0:(t=ae.exec(e))?(de(esm_pe(t[1]),esm_z(t[2]),esm_z(t[3]))|255)>>>0:(t=ie.exec(e))?(de(esm_pe(t[1]),esm_z(t[2]),esm_z(t[3]))|me(t[4]))>>>0:null}function esm_j(e,t,r){return r<0&&(r+=1),r>1&&(r-=1),r<1/6?e+(t-e)*6*r:r<1/2?t:r<2/3?e+(t-e)*(2/3-r)*6:e}function de(e,t,r){let n=r<.5?r*(1+t):r+t-r*t,f=2*r-n,o=esm_j(f,n,e+1/3),i=esm_j(f,n,e),s=esm_j(f,n,e-1/3);return Math.round(o*255)<<24|Math.round(i*255)<<16|Math.round(s*255)<<8}function dist_esm_y(e){let t=parseInt(e,10);return t<0?0:t>255?255:t}function esm_pe(e){return(parseFloat(e)%360+360)%360/360}function me(e){let t=parseFloat(e);return t<0?0:t>1?255:Math.round(t*255)}function esm_z(e){let t=parseFloat(e);return t<0?0:t>100?1:t/100}function D(e){let t=be(e);if(t===null)return e;t=t||0;let r=(t&4278190080)>>>24,n=(t&16711680)>>>16,f=(t&65280)>>>8,o=(t&255)/255;return`rgba($r}, $n}, $f}, $o})`}var W=(e,t,r)=>{if(dist_esm_l.fun(e))return e;if(dist_esm_l.arr(e))return W({range:e,output:t,extrapolate:r});if(dist_esm_l.str(e.output[0]))return esm_k(e);let n=e,f=n.output,o=n.range||[0,1],i=n.extrapolateLeft||n.extrapolate||"extend",s=n.extrapolateRight||n.extrapolate||"extend",x=n.easing||(a=>a);return a=>{let F=He(a,o);return Ue(a,o[F],o[F+1],f[F],f[F+1],x,i,s,n.map)}};function Ue(e,t,r,n,f,o,i,s,x){let a=x?x(e):e;if(a<t){if(i==="identity")return a;i==="clamp"&&(a=t)}if(a>r){if(s==="identity")return a;s==="clamp"&&(a=r)}return n===f?n:t===r?e<=t?n:f:(t===-1/0?a=-a:r===1/0?a=a-t:a=(a-t)/(r-t),a=o(a),n===-1/0?a=-a:f===1/0?a=a+n:a=a*(f-n)+n,a)}function He(e,t){for(var r=1;r<t.length-1&&!(t[r]>=e);++r);return r-1}var Be=(e,t="end")=>r=>{r=t==="end"?Math.min(r,.999):Math.max(r,.001);let n=r*e,f=t==="end"?Math.floor(n):Math.ceil(n);return ne(0,1,f/e)},P=1.70158,L=P*1.525,xe=P+1,he=2*Math.PI/3,ye=2*Math.PI/4.5,V=e=>e<1/2.75?7.5625*e*e:e<2/2.75?7.5625*(e-=1.5/2.75)*e+.75:e<2.5/2.75?7.5625*(e-=2.25/2.75)*e+.9375:7.5625*(e-=2.625/2.75)*e+.984375,Lt={linear:e=>e,easeInQuad:e=>e*e,easeOutQuad:e=>1-(1-e)*(1-e),easeInOutQuad:e=>e<.5?2*e*e:1-Math.pow(-2*e+2,2)/2,easeInCubic:e=>e*e*e,easeOutCubic:e=>1-Math.pow(1-e,3),easeInOutCubic:e=>e<.5?4*e*e*e:1-Math.pow(-2*e+2,3)/2,easeInQuart:e=>e*e*e*e,easeOutQuart:e=>1-Math.pow(1-e,4),easeInOutQuart:e=>e<.5?8*e*e*e*e:1-Math.pow(-2*e+2,4)/2,easeInQuint:e=>e*e*e*e*e,easeOutQuint:e=>1-Math.pow(1-e,5),easeInOutQuint:e=>e<.5?16*e*e*e*e*e:1-Math.pow(-2*e+2,5)/2,easeInSine:e=>1-Math.cos(e*Math.PI/2),easeOutSine:e=>Math.sin(e*Math.PI/2),easeInOutSine:e=>-(Math.cos(Math.PI*e)-1)/2,easeInExpo:e=>e===0?0:Math.pow(2,10*e-10),easeOutExpo:e=>e===1?1:1-Math.pow(2,-10*e),easeInOutExpo:e=>e===0?0:e===1?1:e<.5?Math.pow(2,20*e-10)/2:(2-Math.pow(2,-20*e+10))/2,easeInCirc:e=>1-Math.sqrt(1-Math.pow(e,2)),easeOutCirc:e=>Math.sqrt(1-Math.pow(e-1,2)),easeInOutCirc:e=>e<.5?(1-Math.sqrt(1-Math.pow(2*e,2)))/2:(Math.sqrt(1-Math.pow(-2*e+2,2))+1)/2,easeInBack:e=>xe*e*e*e-P*e*e,easeOutBack:e=>1+xe*Math.pow(e-1,3)+P*Math.pow(e-1,2),easeInOutBack:e=>e<.5?Math.pow(2*e,2)*((L+1)*2*e-L)/2:(Math.pow(2*e-2,2)*((L+1)*(e*2-2)+L)+2)/2,easeInElastic:e=>e===0?0:e===1?1:-Math.pow(2,10*e-10)*Math.sin((e*10-10.75)*he),easeOutElastic:e=>e===0?0:e===1?1:Math.pow(2,-10*e)*Math.sin((e*10-.75)*he)+1,easeInOutElastic:e=>e===0?0:e===1?1:e<.5?-(Math.pow(2,20*e-10)*Math.sin((20*e-11.125)*ye))/2:Math.pow(2,-20*e+10)*Math.sin((20*e-11.125)*ye)/2+1,easeInBounce:e=>1-V(1-e),easeOutBounce:V,easeInOutBounce:e=>e<.5?(1-V(1-2*e))/2:(1+V(2*e-1))/2,steps:Be};var esm_g=Symbol.for("FluidValue.get"),dist_esm_m=Symbol.for("FluidValue.observers");var Pt=e=>Boolean(e&&e[esm_g]),ve=e=>e&&e[esm_g]?e[esm_g]():e,esm_qt=e=>e[dist_esm_m]||null;function je(e,t){e.eventObserved?e.eventObserved(t):e(t)}function $t(e,t){let r=e[dist_esm_m];r&&r.forEach(n=>{je(n,t)})}var esm_ge=class{[esm_g];[dist_esm_m];constructor(t){if(!t&&!(t=this.get))throw Error("Unknown getter");De(this,t)}},De=(e,t)=>Ee(e,esm_g,t);function Gt(e,t){if(e[esm_g]){let r=e[dist_esm_m];r||Ee(e,dist_esm_m,r=new Set),r.has(t)||(r.add(t),e.observerAdded&&e.observerAdded(r.size,t))}return t}function Qt(e,t){let r=e[dist_esm_m];if(r&&r.has(t)){let n=r.size-1;n?r.delete(t):e[dist_esm_m]=null,e.observerRemoved&&e.observerRemoved(n,t)}}var Ee=(e,t,r)=>Object.defineProperty(e,t,{value:r,writable:!0,configurable:!0});var O=/[+\-]?(?:0|[1-9]\d*)(?:\.\d*)?(?:[eE][+\-]?\d+)?/g,esm_Oe=/(#(?:[0-9a-f]{2}){2,4}|(#[0-9a-f]{3})|(rgb|hsl)a?\((-?\d+%?[,\s]+){2,3}\s*[\d\.]+%?\))/gi,K=new RegExp(`($O.source})(%|[a-z]+)`,"i"),we=/rgba\(([0-9\.-]+), ([0-9\.-]+), ([0-9\.-]+), ([0-9\.-]+)\)/gi,dist_esm_b=/var\((--[a-zA-Z0-9-_]+),? ?([a-zA-Z0-9 ()%#.,-]+)?\)/;var esm_N=e=>{let[t,r]=We(e);if(!t||dist_esm_h())return e;let n=window.getComputedStyle(document.documentElement).getPropertyValue(t);if(n)return n.trim();if(r&&r.startsWith("--")){let f=window.getComputedStyle(document.documentElement).getPropertyValue(r);return f||e}else{if(r&&dist_esm_b.test(r))return esm_N(r);if(r)return r}return e},We=e=>{let t=dist_esm_b.exec(e);if(!t)return[,];let[,r,n]=t;return[r,n]};var _,esm_Ke=(e,t,r,n,f)=>`rgba($Math.round(t)}, $Math.round(r)}, $Math.round(n)}, $f})`,Xt=e=>{_||(_=dist_esm_c?new RegExp(`($Object.keys(dist_esm_c).join("|")})(?!\\w)`,"g"):/^\b$/);let t=e.output.map(o=>ve(o).replace(dist_esm_b,esm_N).replace(esm_Oe,D).replace(_,D)),r=t.map(o=>o.match(O).map(Number)),f=r[0].map((o,i)=>r.map(s=>{if(!(i in s))throw Error('The arity of each "output" value must be equal');return s[i]})).map(o=>W({...e,output:o}));return o=>{let i=!K.test(t[0])&&t.find(x=>K.test(x))?.replace(O,""),s=0;return t[0].replace(O,()=>`$f[s++](o)}$i||""}`).replace(we,esm_Ke)}};var Z="react-spring: ",Te=e=>{let t=e,r=!1;if(typeof t!="function")throw new TypeError(`$Z}once requires a function parameter`);return(...n)=>{r||(t(...n),r=!0)}},Ne=Te(console.warn);function Jt(){Ne(`$Z}The "interpolate" function is deprecated in v9 (use "to" instead)`)}var _e=Te(console.warn);function er(){_e(`$Z}Directly calling start instead of using the api object is deprecated in v9 (use ".start" instead), this will be removed in later 0.X.0 versions`)}function esm_or(e){return dist_esm_l.str(e)&&(e[0]=="#"||/\d/.test(e)||!dist_esm_h()&&dist_esm_b.test(e)||e in(dist_esm_c||{}))}var dist_esm_v,q=new WeakMap,Ze=e=>e.forEach(({target:t,contentRect:r})=>q.get(t)?.forEach(n=>n(r)));function Fe(e,t){dist_esm_v||typeof ResizeObserver<"u"&&(dist_esm_v=new ResizeObserver(Ze));let r=q.get(t);return r||(r=new Set,q.set(t,r)),r.add(e),dist_esm_v&&dist_esm_v.observe(t),()=>{let n=q.get(t);!n||(n.delete(e),!n.size&&dist_esm_v&&dist_esm_v.unobserve(t))}}var esm_$=new Set,dist_esm_w,esm_Xe=()=>{let e=()=>{esm_$.forEach(t=>t({width:window.innerWidth,height:window.innerHeight}))};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},Ie=e=>(esm_$.add(e),dist_esm_w||(dist_esm_w=esm_Xe()),()=>{esm_$.delete(e),!esm_$.size&&dist_esm_w&&(dist_esm_w(),dist_esm_w=void 0)});var ke=(e,{container:t=document.documentElement}={})=>t===document.documentElement?Ie(e):Fe(e,t);var Se=(e,t,r)=>t-e===0?1:(r-e)/(t-e);var esm_Ye={x:{length:"Width",position:"Left"},y:{length:"Height",position:"Top"}},esm_G=class{callback;container;info;constructor(t,r){this.callback=t,this.container=r,this.info={time:0,x:this.createAxis(),y:this.createAxis()}}createAxis=()=>({current:0,progress:0,scrollLength:0});updateAxis=t=>{let r=this.info[t],{length:n,position:f}=esm_Ye[t];r.current=this.container[`scroll$f}`],r.scrollLength=this.container["scroll"+n]-this.container["client"+n],r.progress=Se(0,r.scrollLength,r.current)};update=()=>{this.updateAxis("x"),this.updateAxis("y")};sendEvent=()=>{this.callback(this.info)};advance=()=>{this.update(),this.sendEvent()}};var esm_T=new WeakMap,Ae=new WeakMap,X=new WeakMap,Me=e=>e===document.documentElement?window:e,yr=(e,{container:t=document.documentElement}={})=>{let r=X.get(t);r||(r=new Set,X.set(t,r));let n=new esm_G(e,t);if(r.add(n),!esm_T.has(t)){let o=()=>(r?.forEach(s=>s.advance()),!0);esm_T.set(t,o);let i=Me(t);window.addEventListener("resize",o,{passive:!0}),t!==document.documentElement&&Ae.set(t,ke(o,{container:t})),i.addEventListener("scroll",o,{passive:!0})}let f=esm_T.get(t);return Re(f),()=>{Re.cancel(f);let o=X.get(t);if(!o||(o.delete(n),o.size))return;let i=esm_T.get(t);esm_T.delete(t),i&&(Me(t).removeEventListener("scroll",i),window.removeEventListener("resize",i),Ae.get(t)?.())}};function Er(e){let t=Je(null);return t.current===null&&(t.current=e()),t.current}var esm_Q=dist_esm_h()?external_React_.useEffect:external_React_.useLayoutEffect;var Ce=()=>{let e=(0,external_React_.useRef)(!1);return esm_Q(()=>(e.current=!0,()=>{e.current=!1}),[]),e};function Mr(){let e=(0,external_React_.useState)()[1],t=Ce();return()=>{t.current&&e(Math.random())}}function Lr(e,t){let[r]=(0,external_React_.useState)(()=>({inputs:t,result:e()})),n=(0,external_React_.useRef)(),f=n.current,o=f;return o?Boolean(t&&o.inputs&&it(t,o.inputs))||(o={inputs:t,result:e()}):o=r,(0,external_React_.useEffect)(()=>{n.current=o,f==r&&(r.inputs=r.result=void 0)},[o]),o.result}function it(e,t){if(e.length!==t.length)return!1;for(let r=0;r<e.length;r++)if(e[r]!==t[r])return!1;return!0}var $r=e=>(0,external_React_.useEffect)(e,ut),ut=[];function Ur(e){let t=ct();return lt(()=>{t.current=e}),t.current}var Wr=()=>{let[e,t]=dt(null);return esm_Q(()=>{let r=window.matchMedia("(prefers-reduced-motion)"),n=f=>{t(f.matches),U({skipAnimation:f.matches})};return n(r),r.addEventListener("change",n),()=>{r.removeEventListener("change",n)}},[]),e}; 37703 37704 ;// CONCATENATED MODULE: ./node_modules/@react-spring/animated/dist/esm/index.js 37705 var animated_dist_esm_h=Symbol.for("Animated:node"),animated_dist_esm_v=e=>!!e&&e[animated_dist_esm_h]===e,dist_esm_k=e=>e&&e[animated_dist_esm_h],esm_D=(e,t)=>mt(e,animated_dist_esm_h,t),F=e=>e&&e[animated_dist_esm_h]&&e[animated_dist_esm_h].getPayload(),animated_dist_esm_c=class{payload;constructor(){esm_D(this,this)}getPayload(){return this.payload||[]}};var animated_dist_esm_l=class extends animated_dist_esm_c{constructor(r){super();this._value=r;dist_esm_l.num(this._value)&&(this.lastPosition=this._value)}done=!0;elapsedTime;lastPosition;lastVelocity;v0;durationProgress=0;static create(r){return new animated_dist_esm_l(r)}getPayload(){return[this]}getValue(){return this._value}setValue(r,n){return dist_esm_l.num(r)&&(this.lastPosition=r,n&&(r=Math.round(r/n)*n,this.done&&(this.lastPosition=r))),this._value===r?!1:(this._value=r,!0)}reset(){let{done:r}=this;this.done=!1,dist_esm_l.num(this._value)&&(this.elapsedTime=0,this.durationProgress=0,this.lastPosition=this._value,r&&(this.lastVelocity=null),this.v0=null)}};var animated_dist_esm_d=class extends animated_dist_esm_l{_string=null;_toString;constructor(t){super(0),this._toString=W({output:[t,t]})}static create(t){return new animated_dist_esm_d(t)}getValue(){let t=this._string;return t??(this._string=this._toString(this._value))}setValue(t){if(dist_esm_l.str(t)){if(t==this._string)return!1;this._string=t,this._value=1}else if(super.setValue(t))this._string=null;else return!1;return!0}reset(t){t&&(this._toString=W({output:[this.getValue(),t]})),this._value=0,super.reset()}};var dist_esm_f={dependencies:null};var animated_dist_esm_u=class extends animated_dist_esm_c{constructor(r){super();this.source=r;this.setValue(r)}getValue(r){let n={};return xt(this.source,(a,i)=>{animated_dist_esm_v(a)?n[i]=a.getValue(r):Pt(a)?n[i]=ve(a):r||(n[i]=a)}),n}setValue(r){this.source=r,this.payload=this._makePayload(r)}reset(){this.payload&&esm_Ve(this.payload,r=>r.reset())}_makePayload(r){if(r){let n=new Set;return xt(r,this._addToPayload,n),Array.from(n)}}_addToPayload(r){dist_esm_f.dependencies&&Pt(r)&&dist_esm_f.dependencies.add(r);let n=F(r);n&&esm_Ve(n,a=>this.add(a))}};var animated_dist_esm_y=class extends animated_dist_esm_u{constructor(t){super(t)}static create(t){return new animated_dist_esm_y(t)}getValue(){return this.source.map(t=>t.getValue())}setValue(t){let r=this.getPayload();return t.length==r.length?r.map((n,a)=>n.setValue(t[a])).some(Boolean):(super.setValue(t.map(dist_esm_z)),!0)}};function dist_esm_z(e){return(esm_or(e)?animated_dist_esm_d:animated_dist_esm_l).create(e)}function esm_Le(e){let t=dist_esm_k(e);return t?t.constructor:dist_esm_l.arr(e)?animated_dist_esm_y:esm_or(e)?animated_dist_esm_d:animated_dist_esm_l}var dist_esm_x=(e,t)=>{let r=!dist_esm_l.fun(e)||e.prototype&&e.prototype.isReactComponent;return (0,external_React_.forwardRef)((n,a)=>{let i=(0,external_React_.useRef)(null),o=r&&(0,external_React_.useCallback)(s=>{i.current=esm_ae(a,s)},[a]),[m,T]=esm_ne(n,t),W=Mr(),P=()=>{let s=i.current;if(r&&!s)return;(s?t.applyAnimatedValues(s,m.getValue(!0)):!1)===!1&&W()},_=new animated_dist_esm_b(P,T),p=(0,external_React_.useRef)();esm_Q(()=>(p.current=_,esm_Ve(T,s=>Gt(s,_)),()=>{p.current&&(esm_Ve(p.current.deps,s=>Qt(s,p.current)),esm_n.cancel(p.current.update))})),(0,external_React_.useEffect)(P,[]),$r(()=>()=>{let s=p.current;esm_Ve(s.deps,S=>Qt(S,s))});let $=t.getComponentProps(m.getValue());return external_React_.createElement(e,{...$,ref:o})})},animated_dist_esm_b=class{constructor(t,r){this.update=t;this.deps=r}eventObserved(t){t.type=="change"&&esm_n.write(this.update)}};function esm_ne(e,t){let r=new Set;return dist_esm_f.dependencies=r,e.style&&(e={...e,style:t.createAnimatedStyle(e.style)}),e=new animated_dist_esm_u(e),dist_esm_f.dependencies=null,[e,r]}function esm_ae(e,t){return e&&(dist_esm_l.fun(e)?e(t):e.current=t),t}var dist_esm_j=Symbol.for("AnimatedComponent"),dist_esm_Ke=(e,{applyAnimatedValues:t=()=>!1,createAnimatedStyle:r=a=>new animated_dist_esm_u(a),getComponentProps:n=a=>a}={})=>{let a={applyAnimatedValues:t,createAnimatedStyle:r,getComponentProps:n},i=o=>{let m=esm_I(o)||"Anonymous";return dist_esm_l.str(o)?o=i[o]||(i[o]=dist_esm_x(o,a)):o=o[dist_esm_j]||(o[dist_esm_j]=dist_esm_x(o,a)),o.displayName=`Animated($m})`,o};return xt(e,(o,m)=>{dist_esm_l.arr(e)&&(m=esm_I(o)),i[m]=i(o)}),{animated:i}},esm_I=e=>dist_esm_l.str(e)?e:e&&dist_esm_l.str(e.displayName)?e.displayName:dist_esm_l.fun(e)&&e.name||null; 37706 37707 ;// CONCATENATED MODULE: ./node_modules/@react-spring/core/dist/esm/index.js 37708 function dist_esm_I(t,...e){return dist_esm_l.fun(t)?t(...e):t}var esm_te=(t,e)=>t===!0||!!(e&&t&&(dist_esm_l.fun(t)?t(e):ht(t).includes(e))),et=(t,e)=>dist_esm_l.obj(t)?e&&t[e]:t;var esm_ke=(t,e)=>t.default===!0?t[e]:t.default?t.default[e]:void 0,nn=t=>t,dist_esm_ne=(t,e=nn)=>{let n=rn;t.default&&t.default!==!0&&(t=t.default,n=Object.keys(t));let r={};for(let o of n){let s=e(t[o],o);dist_esm_l.und(s)||(r[o]=s)}return r},rn=["config","onProps","onStart","onChange","onPause","onResume","onRest"],on={config:1,from:1,to:1,ref:1,loop:1,reset:1,pause:1,cancel:1,reverse:1,immediate:1,default:1,delay:1,onProps:1,onStart:1,onChange:1,onPause:1,onResume:1,onRest:1,onResolve:1,items:1,trail:1,sort:1,expires:1,initial:1,enter:1,update:1,leave:1,children:1,onDestroyed:1,keys:1,callId:1,parentId:1};function sn(t){let e={},n=0;if(xt(t,(r,o)=>{on[o]||(e[o]=r,n++)}),n)return e}function esm_de(t){let e=sn(t);if(e){let n={to:e};return xt(t,(r,o)=>o in e||(n[o]=r)),n}return{...t}}function esm_me(t){return t=ve(t),dist_esm_l.arr(t)?t.map(esm_me):esm_or(t)?dist_esm_p.createStringInterpolator({range:[0,1],output:[t,t]})(1):t}function esm_Ue(t){for(let e in t)return!0;return!1}function esm_Ee(t){return dist_esm_l.fun(t)||dist_esm_l.arr(t)&&dist_esm_l.obj(t[0])}function esm_xe(t,e){t.ref?.delete(t),e?.delete(t)}function esm_he(t,e){e&&t.ref!==e&&(t.ref?.delete(t),e.add(t),t.ref=e)}function wr(t,e,n=1e3){an(()=>{if(e){let r=0;ge(t,(o,s)=>{let a=o.current;if(a.length){let i=n*e[s];isNaN(i)?i=r:r=i,ge(a,u=>{ge(u.queue,p=>{let f=p.delay;p.delay=d=>i+dist_esm_I(f||0,d)})}),o.start()}})}else{let r=Promise.resolve();ge(t,o=>{let s=o.current;if(s.length){let a=s.map(i=>{let u=i.queue;return i.queue=[],u});r=r.then(()=>(ge(s,(i,u)=>ge(a[u]||[],p=>i.queue.push(p))),Promise.all(o.start())))}})}})}var esm_mt={default:{tension:170,friction:26},gentle:{tension:120,friction:14},wobbly:{tension:180,friction:12},stiff:{tension:210,friction:20},slow:{tension:280,friction:60},molasses:{tension:280,friction:120}};var tt={...esm_mt.default,mass:1,damping:1,easing:Lt.linear,clamp:!1},esm_we=class{tension;friction;frequency;damping;mass;velocity=0;restVelocity;precision;progress;duration;easing;clamp;bounce;decay;round;constructor(){Object.assign(this,tt)}};function gt(t,e,n){n&&(n={...n},esm_ht(n,e),e={...n,...e}),esm_ht(t,e),Object.assign(t,e);for(let a in tt)t[a]==null&&(t[a]=tt[a]);let{mass:r,frequency:o,damping:s}=t;return dist_esm_l.und(o)||(o<.01&&(o=.01),s<0&&(s=0),t.tension=Math.pow(2*Math.PI/o,2)*r,t.friction=4*Math.PI*s*r/o),t}function esm_ht(t,e){if(!dist_esm_l.und(e.decay))t.duration=void 0;else{let n=!dist_esm_l.und(e.tension)||!dist_esm_l.und(e.friction);(n||!dist_esm_l.und(e.frequency)||!dist_esm_l.und(e.damping)||!dist_esm_l.und(e.mass))&&(t.duration=void 0,t.decay=void 0),n&&(t.frequency=void 0)}}var esm_yt=[],dist_esm_Le=class{changed=!1;values=esm_yt;toValues=null;fromValues=esm_yt;to;from;config=new esm_we;immediate=!1};function esm_Me(t,{key:e,props:n,defaultProps:r,state:o,actions:s}){return new Promise((a,i)=>{let u,p,f=esm_te(n.cancel??r?.cancel,e);if(f)b();else{dist_esm_l.und(n.pause)||(o.paused=esm_te(n.pause,e));let c=r?.pause;c!==!0&&(c=o.paused||esm_te(c,e)),u=dist_esm_I(n.delay||0,e),c?(o.resumeQueue.add(m),s.pause()):(s.resume(),m())}function d(){o.resumeQueue.add(m),o.timeouts.delete(p),p.cancel(),u=p.time-esm_n.now()}function m(){u>0&&!dist_esm_p.skipAnimation?(o.delayed=!0,p=esm_n.setTimeout(b,u),o.pauseQueue.add(d),o.timeouts.add(p)):b()}function b(){o.delayed&&(o.delayed=!1),o.pauseQueue.delete(d),o.timeouts.delete(p),t<=(o.cancelId||0)&&(f=!0);try{s.start({...n,callId:t,cancel:f},a)}catch(c){i(c)}}})}var esm_be=(t,e)=>e.length==1?e[0]:e.some(n=>n.cancelled)?esm_q(t.get()):e.every(n=>n.noop)?nt(t.get()):dist_esm_E(t.get(),e.every(n=>n.finished)),nt=t=>({value:t,noop:!0,finished:!0,cancelled:!1}),dist_esm_E=(t,e,n=!1)=>({value:t,finished:e,cancelled:n}),esm_q=t=>({value:t,cancelled:!0,finished:!1});function esm_De(t,e,n,r){let{callId:o,parentId:s,onRest:a}=e,{asyncTo:i,promise:u}=n;return!s&&t===i&&!e.reset?u:n.promise=(async()=>{n.asyncId=o,n.asyncTo=t;let p=dist_esm_ne(e,(l,h)=>h==="onRest"?void 0:l),f,d,m=new Promise((l,h)=>(f=l,d=h)),b=l=>{let h=o<=(n.cancelId||0)&&esm_q(r)||o!==n.asyncId&&dist_esm_E(r,!1);if(h)throw l.result=h,d(l),l},c=(l,h)=>{let g=new esm_Ae,x=new esm_Ne;return(async()=>{if(dist_esm_p.skipAnimation)throw esm_oe(n),x.result=dist_esm_E(r,!1),d(x),x;b(g);let S=dist_esm_l.obj(l)?{...l}:{...h,to:l};S.parentId=o,xt(p,(V,_)=>{dist_esm_l.und(S[_])&&(S[_]=V)});let A=await r.start(S);return b(g),n.paused&&await new Promise(V=>{n.resumeQueue.add(V)}),A})()},P;if(dist_esm_p.skipAnimation)return esm_oe(n),dist_esm_E(r,!1);try{let l;dist_esm_l.arr(t)?l=(async h=>{for(let g of h)await c(g)})(t):l=Promise.resolve(t(c,r.stop.bind(r))),await Promise.all([l.then(f),m]),P=dist_esm_E(r.get(),!0,!1)}catch(l){if(l instanceof esm_Ae)P=l.result;else if(l instanceof esm_Ne)P=l.result;else throw l}finally{o==n.asyncId&&(n.asyncId=s,n.asyncTo=s?i:void 0,n.promise=s?u:void 0)}return dist_esm_l.fun(a)&&esm_n.batchedUpdates(()=>{a(P,r,r.item)}),P})()}function esm_oe(t,e){Pe(t.timeouts,n=>n.cancel()),t.pauseQueue.clear(),t.resumeQueue.clear(),t.asyncId=t.asyncTo=t.promise=void 0,e&&(t.cancelId=e)}var esm_Ae=class extends Error{result;constructor(){super("An async animation has been interrupted. You see this error because you forgot to use `await` or `.catch(...)` on its returned promise.")}},esm_Ne=class extends Error{result;constructor(){super("SkipAnimationSignal")}};var esm_Re=t=>t instanceof esm_X,Sn=1,esm_X=class extends esm_ge{id=Sn++;_priority=0;get priority(){return this._priority}set priority(e){this._priority!=e&&(this._priority=e,this._onPriorityChange(e))}get(){let e=dist_esm_k(this);return e&&e.getValue()}to(...e){return dist_esm_p.to(this,e)}interpolate(...e){return Jt(),dist_esm_p.to(this,e)}toJSON(){return this.get()}observerAdded(e){e==1&&this._attach()}observerRemoved(e){e==0&&this._detach()}_attach(){}_detach(){}_onChange(e,n=!1){$t(this,{type:"change",parent:this,value:e,idle:n})}_onPriorityChange(e){this.idle||qe.sort(this),$t(this,{type:"priority",parent:this,priority:e})}};var esm_se=Symbol.for("SpringPhase"),esm_bt=1,rt=2,ot=4,esm_qe=t=>(t[esm_se]&esm_bt)>0,dist_esm_Q=t=>(t[esm_se]&rt)>0,esm_ye=t=>(t[esm_se]&ot)>0,st=(t,e)=>e?t[esm_se]|=rt|esm_bt:t[esm_se]&=~rt,esm_it=(t,e)=>e?t[esm_se]|=ot:t[esm_se]&=~ot;var esm_ue=class extends esm_X{key;animation=new dist_esm_Le;queue;defaultProps={};_state={paused:!1,delayed:!1,pauseQueue:new Set,resumeQueue:new Set,timeouts:new Set};_pendingCalls=new Set;_lastCallId=0;_lastToId=0;_memoizedDuration=0;constructor(e,n){if(super(),!dist_esm_l.und(e)||!dist_esm_l.und(n)){let r=dist_esm_l.obj(e)?{...e}:{...n,from:e};dist_esm_l.und(r.default)&&(r.default=!0),this.start(r)}}get idle(){return!(dist_esm_Q(this)||this._state.asyncTo)||esm_ye(this)}get goal(){return ve(this.animation.to)}get velocity(){let e=dist_esm_k(this);return e instanceof animated_dist_esm_l?e.lastVelocity||0:e.getPayload().map(n=>n.lastVelocity||0)}get hasAnimated(){return esm_qe(this)}get isAnimating(){return dist_esm_Q(this)}get isPaused(){return esm_ye(this)}get isDelayed(){return this._state.delayed}advance(e){let n=!0,r=!1,o=this.animation,{config:s,toValues:a}=o,i=F(o.to);!i&&Pt(o.to)&&(a=ht(ve(o.to))),o.values.forEach((f,d)=>{if(f.done)return;let m=f.constructor==animated_dist_esm_d?1:i?i[d].lastPosition:a[d],b=o.immediate,c=m;if(!b){if(c=f.lastPosition,s.tension<=0){f.done=!0;return}let P=f.elapsedTime+=e,l=o.fromValues[d],h=f.v0!=null?f.v0:f.v0=dist_esm_l.arr(s.velocity)?s.velocity[d]:s.velocity,g,x=s.precision||(l==m?.005:Math.min(1,Math.abs(m-l)*.001));if(dist_esm_l.und(s.duration))if(s.decay){let S=s.decay===!0?.998:s.decay,A=Math.exp(-(1-S)*P);c=l+h/(1-S)*(1-A),b=Math.abs(f.lastPosition-c)<=x,g=h*A}else{g=f.lastVelocity==null?h:f.lastVelocity;let S=s.restVelocity||x/10,A=s.clamp?0:s.bounce,V=!dist_esm_l.und(A),_=l==m?f.v0>0:l<m,v,w=!1,C=1,$=Math.ceil(e/C);for(let L=0;L<$&&(v=Math.abs(g)>S,!(!v&&(b=Math.abs(m-c)<=x,b)));++L){V&&(w=c==m||c>m==_,w&&(g=-g*A,c=m));let N=-s.tension*1e-6*(c-m),y=-s.friction*.001*g,T=(N+y)/s.mass;g=g+T*C,c=c+g*C}}else{let S=1;s.duration>0&&(this._memoizedDuration!==s.duration&&(this._memoizedDuration=s.duration,f.durationProgress>0&&(f.elapsedTime=s.duration*f.durationProgress,P=f.elapsedTime+=e)),S=(s.progress||0)+P/this._memoizedDuration,S=S>1?1:S<0?0:S,f.durationProgress=S),c=l+s.easing(S)*(m-l),g=(c-f.lastPosition)/e,b=S==1}f.lastVelocity=g,Number.isNaN(c)&&(console.warn("Got NaN while animating:",this),b=!0)}i&&!i[d].done&&(b=!1),b?f.done=!0:n=!1,f.setValue(c,s.round)&&(r=!0)});let u=dist_esm_k(this),p=u.getValue();if(n){let f=ve(o.to);(p!==f||r)&&!s.decay?(u.setValue(f),this._onChange(f)):r&&s.decay&&this._onChange(p),this._stop()}else r&&this._onChange(p)}set(e){return esm_n.batchedUpdates(()=>{this._stop(),this._focus(e),this._set(e)}),this}pause(){this._update({pause:!0})}resume(){this._update({pause:!1})}finish(){if(dist_esm_Q(this)){let{to:e,config:n}=this.animation;esm_n.batchedUpdates(()=>{this._onStart(),n.decay||this._set(e,!1),this._stop()})}return this}update(e){return(this.queue||(this.queue=[])).push(e),this}start(e,n){let r;return dist_esm_l.und(e)?(r=this.queue||[],this.queue=[]):r=[dist_esm_l.obj(e)?e:{...n,to:e}],Promise.all(r.map(o=>this._update(o))).then(o=>esm_be(this,o))}stop(e){let{to:n}=this.animation;return this._focus(this.get()),esm_oe(this._state,e&&this._lastCallId),esm_n.batchedUpdates(()=>this._stop(n,e)),this}reset(){this._update({reset:!0})}eventObserved(e){e.type=="change"?this._start():e.type=="priority"&&(this.priority=e.priority+1)}_prepareNode(e){let n=this.key||"",{to:r,from:o}=e;r=dist_esm_l.obj(r)?r[n]:r,(r==null||esm_Ee(r))&&(r=void 0),o=dist_esm_l.obj(o)?o[n]:o,o==null&&(o=void 0);let s={to:r,from:o};return esm_qe(this)||(e.reverse&&([r,o]=[o,r]),o=ve(o),dist_esm_l.und(o)?dist_esm_k(this)||this._set(r):this._set(o)),s}_update({...e},n){let{key:r,defaultProps:o}=this;e.default&&Object.assign(o,dist_esm_ne(e,(i,u)=>/^on/.test(u)?et(i,r):i)),_t(this,e,"onProps"),esm_Ie(this,"onProps",e,this);let s=this._prepareNode(e);if(Object.isFrozen(this))throw Error("Cannot animate a `SpringValue` object that is frozen. Did you forget to pass your component to `animated(...)` before animating its props?");let a=this._state;return esm_Me(++this._lastCallId,{key:r,props:e,defaultProps:o,state:a,actions:{pause:()=>{esm_ye(this)||(esm_it(this,!0),yt(a.pauseQueue),esm_Ie(this,"onPause",dist_esm_E(this,esm_Ce(this,this.animation.to)),this))},resume:()=>{esm_ye(this)&&(esm_it(this,!1),dist_esm_Q(this)&&this._resume(),yt(a.resumeQueue),esm_Ie(this,"onResume",dist_esm_E(this,esm_Ce(this,this.animation.to)),this))},start:this._merge.bind(this,s)}}).then(i=>{if(e.loop&&i.finished&&!(n&&i.noop)){let u=at(e);if(u)return this._update(u,!0)}return i})}_merge(e,n,r){if(n.cancel)return this.stop(!0),r(esm_q(this));let o=!dist_esm_l.und(e.to),s=!dist_esm_l.und(e.from);if(o||s)if(n.callId>this._lastToId)this._lastToId=n.callId;else return r(esm_q(this));let{key:a,defaultProps:i,animation:u}=this,{to:p,from:f}=u,{to:d=p,from:m=f}=e;s&&!o&&(!n.default||dist_esm_l.und(d))&&(d=m),n.reverse&&([d,m]=[m,d]);let b=!bt(m,f);b&&(u.from=m),m=ve(m);let c=!bt(d,p);c&&this._focus(d);let P=esm_Ee(n.to),{config:l}=u,{decay:h,velocity:g}=l;(o||s)&&(l.velocity=0),n.config&&!P&>(l,dist_esm_I(n.config,a),n.config!==i.config?dist_esm_I(i.config,a):void 0);let x=dist_esm_k(this);if(!x||dist_esm_l.und(d))return r(dist_esm_E(this,!0));let S=dist_esm_l.und(n.reset)?s&&!n.default:!dist_esm_l.und(m)&&esm_te(n.reset,a),A=S?m:this.get(),V=esm_me(d),_=dist_esm_l.num(V)||dist_esm_l.arr(V)||esm_or(V),v=!P&&(!_||esm_te(i.immediate||n.immediate,a));if(c){let L=esm_Le(d);if(L!==x.constructor)if(v)x=this._set(V);else throw Error(`Cannot animate between $x.constructor.name} and $L.name}, as the "to" prop suggests`)}let w=x.constructor,C=Pt(d),$=!1;if(!C){let L=S||!esm_qe(this)&&b;(c||L)&&($=bt(esm_me(A),V),C=!$),(!bt(u.immediate,v)&&!v||!bt(l.decay,h)||!bt(l.velocity,g))&&(C=!0)}if($&&dist_esm_Q(this)&&(u.changed&&!S?C=!0:C||this._stop(p)),!P&&((C||Pt(p))&&(u.values=x.getPayload(),u.toValues=Pt(d)?null:w==animated_dist_esm_d?[1]:ht(V)),u.immediate!=v&&(u.immediate=v,!v&&!S&&this._set(p)),C)){let{onRest:L}=u;esm_Ve(_n,y=>_t(this,n,y));let N=dist_esm_E(this,esm_Ce(this,p));yt(this._pendingCalls,N),this._pendingCalls.add(r),u.changed&&esm_n.batchedUpdates(()=>{u.changed=!S,L?.(N,this),S?dist_esm_I(i.onRest,N):u.onStart?.(N,this)})}S&&this._set(A),P?r(esm_De(n.to,n,this._state,this)):C?this._start():dist_esm_Q(this)&&!c?this._pendingCalls.add(r):r(nt(A))}_focus(e){let n=this.animation;e!==n.to&&(esm_qt(this)&&this._detach(),n.to=e,esm_qt(this)&&this._attach())}_attach(){let e=0,{to:n}=this.animation;Pt(n)&&(Gt(n,this),esm_Re(n)&&(e=n.priority+1)),this.priority=e}_detach(){let{to:e}=this.animation;Pt(e)&&Qt(e,this)}_set(e,n=!0){let r=ve(e);if(!dist_esm_l.und(r)){let o=dist_esm_k(this);if(!o||!bt(r,o.getValue())){let s=esm_Le(r);!o||o.constructor!=s?esm_D(this,s.create(r)):o.setValue(r),o&&esm_n.batchedUpdates(()=>{this._onChange(r,n)})}}return dist_esm_k(this)}_onStart(){let e=this.animation;e.changed||(e.changed=!0,esm_Ie(this,"onStart",dist_esm_E(this,esm_Ce(this,e.to)),this))}_onChange(e,n){n||(this._onStart(),dist_esm_I(this.animation.onChange,e,this)),dist_esm_I(this.defaultProps.onChange,e,this),super._onChange(e,n)}_start(){let e=this.animation;dist_esm_k(this).reset(ve(e.to)),e.immediate||(e.fromValues=e.values.map(n=>n.lastPosition)),dist_esm_Q(this)||(st(this,!0),esm_ye(this)||this._resume())}_resume(){dist_esm_p.skipAnimation?this.finish():qe.start(this)}_stop(e,n){if(dist_esm_Q(this)){st(this,!1);let r=this.animation;esm_Ve(r.values,s=>{s.done=!0}),r.toValues&&(r.onChange=r.onPause=r.onResume=void 0),$t(this,{type:"idle",parent:this});let o=n?esm_q(this.get()):dist_esm_E(this.get(),esm_Ce(this,e??r.to));yt(this._pendingCalls,o),r.changed&&(r.changed=!1,esm_Ie(this,"onRest",o,this))}}};function esm_Ce(t,e){let n=esm_me(e),r=esm_me(t.get());return bt(r,n)}function at(t,e=t.loop,n=t.to){let r=dist_esm_I(e);if(r){let o=r!==!0&&esm_de(r),s=(o||t).reverse,a=!o||o.reset;return esm_Pe({...t,loop:e,default:!1,pause:void 0,to:!s||esm_Ee(n)?n:void 0,from:a?t.from:void 0,reset:a,...o})}}function esm_Pe(t){let{to:e,from:n}=t=esm_de(t),r=new Set;return dist_esm_l.obj(e)&&Vt(e,r),dist_esm_l.obj(n)&&Vt(n,r),t.keys=r.size?Array.from(r):null,t}function Ot(t){let e=esm_Pe(t);return R.und(e.default)&&(e.default=dist_esm_ne(e)),e}function Vt(t,e){xt(t,(n,r)=>n!=null&&e.add(r))}var _n=["onStart","onRest","onChange","onPause","onResume"];function _t(t,e,n){t.animation[n]=e[n]!==esm_ke(e,n)?et(e[n],t.key):void 0}function esm_Ie(t,e,...n){t.animation[e]?.(...n),t.defaultProps[e]?.(...n)}var Fn=["onStart","onChange","onRest"],kn=1,esm_le=class{id=kn++;springs={};queue=[];ref;_flush;_initialProps;_lastAsyncId=0;_active=new Set;_changed=new Set;_started=!1;_item;_state={paused:!1,pauseQueue:new Set,resumeQueue:new Set,timeouts:new Set};_events={onStart:new Map,onChange:new Map,onRest:new Map};constructor(e,n){this._onFrame=this._onFrame.bind(this),n&&(this._flush=n),e&&this.start({default:!0,...e})}get idle(){return!this._state.asyncTo&&Object.values(this.springs).every(e=>e.idle&&!e.isDelayed&&!e.isPaused)}get item(){return this._item}set item(e){this._item=e}get(){let e={};return this.each((n,r)=>e[r]=n.get()),e}set(e){for(let n in e){let r=e[n];dist_esm_l.und(r)||this.springs[n].set(r)}}update(e){return e&&this.queue.push(esm_Pe(e)),this}start(e){let{queue:n}=this;return e?n=ht(e).map(esm_Pe):this.queue=[],this._flush?this._flush(this,n):(jt(this,n),esm_ze(this,n))}stop(e,n){if(e!==!!e&&(n=e),n){let r=this.springs;esm_Ve(ht(n),o=>r[o].stop(!!e))}else esm_oe(this._state,this._lastAsyncId),this.each(r=>r.stop(!!e));return this}pause(e){if(dist_esm_l.und(e))this.start({pause:!0});else{let n=this.springs;esm_Ve(ht(e),r=>n[r].pause())}return this}resume(e){if(dist_esm_l.und(e))this.start({pause:!1});else{let n=this.springs;esm_Ve(ht(e),r=>n[r].resume())}return this}each(e){xt(this.springs,e)}_onFrame(){let{onStart:e,onChange:n,onRest:r}=this._events,o=this._active.size>0,s=this._changed.size>0;(o&&!this._started||s&&!this._started)&&(this._started=!0,Pe(e,([u,p])=>{p.value=this.get(),u(p,this,this._item)}));let a=!o&&this._started,i=s||a&&r.size?this.get():null;s&&n.size&&Pe(n,([u,p])=>{p.value=i,u(p,this,this._item)}),a&&(this._started=!1,Pe(r,([u,p])=>{p.value=i,u(p,this,this._item)}))}eventObserved(e){if(e.type=="change")this._changed.add(e.parent),e.idle||this._active.add(e.parent);else if(e.type=="idle")this._active.delete(e.parent);else return;esm_n.onFrame(this._onFrame)}};function esm_ze(t,e){return Promise.all(e.map(n=>wt(t,n))).then(n=>esm_be(t,n))}async function wt(t,e,n){let{keys:r,to:o,from:s,loop:a,onRest:i,onResolve:u}=e,p=dist_esm_l.obj(e.default)&&e.default;a&&(e.loop=!1),o===!1&&(e.to=null),s===!1&&(e.from=null);let f=dist_esm_l.arr(o)||dist_esm_l.fun(o)?o:void 0;f?(e.to=void 0,e.onRest=void 0,p&&(p.onRest=void 0)):esm_Ve(Fn,P=>{let l=e[P];if(dist_esm_l.fun(l)){let h=t._events[P];e[P]=({finished:g,cancelled:x})=>{let S=h.get(l);S?(g||(S.finished=!1),x&&(S.cancelled=!0)):h.set(l,{value:null,finished:g||!1,cancelled:x||!1})},p&&(p[P]=e[P])}});let d=t._state;e.pause===!d.paused?(d.paused=e.pause,yt(e.pause?d.pauseQueue:d.resumeQueue)):d.paused&&(e.pause=!0);let m=(r||Object.keys(t.springs)).map(P=>t.springs[P].start(e)),b=e.cancel===!0||esm_ke(e,"cancel")===!0;(f||b&&d.asyncId)&&m.push(esm_Me(++t._lastAsyncId,{props:e,state:d,actions:{pause:Y,resume:Y,start(P,l){b?(esm_oe(d,t._lastAsyncId),l(esm_q(t))):(P.onRest=i,l(esm_De(f,P,d,t)))}}})),d.paused&&await new Promise(P=>{d.resumeQueue.add(P)});let c=esm_be(t,await Promise.all(m));if(a&&c.finished&&!(n&&c.noop)){let P=at(e,a,o);if(P)return jt(t,[P]),wt(t,P,!0)}return u&&esm_n.batchedUpdates(()=>u(c,t,t.item)),c}function esm_e(t,e){let n={...t.springs};return e&&pe(Ve(e),r=>{z.und(r.keys)&&(r=esm_Pe(r)),z.obj(r.to)||(r={...r,to:void 0}),Mt(n,r,o=>esm_Lt(o))}),pt(t,n),n}function pt(t,e){Ut(e,(n,r)=>{t.springs[r]||(t.springs[r]=n,Et(n,t))})}function esm_Lt(t,e){let n=new esm_ue;return n.key=t,e&&Gt(n,e),n}function Mt(t,e,n){e.keys&&esm_Ve(e.keys,r=>{(t[r]||(t[r]=n(r)))._prepareNode(e)})}function jt(t,e){esm_Ve(e,n=>{Mt(t.springs,n,r=>esm_Lt(r,t))})}var dist_esm_H=({children:t,...e})=>{let n=(0,external_React_.useContext)(esm_Ge),r=e.pause||!!n.pause,o=e.immediate||!!n.immediate;e=Lr(()=>({pause:r,immediate:o}),[r,o]);let{Provider:s}=esm_Ge;return external_React_.createElement(s,{value:e},t)},esm_Ge=wn(dist_esm_H,{});dist_esm_H.Provider=esm_Ge.Provider;dist_esm_H.Consumer=esm_Ge.Consumer;function wn(t,e){return Object.assign(t,external_React_.createContext(e)),t.Provider._context=t,t.Consumer._context=t,t}var esm_fe=()=>{let t=[],e=function(r){Ln();let o=[];return ce(t,(s,a)=>{if(Ke.und(r))o.push(s.start());else{let i=n(r,s,a);i&&o.push(s.start(i))}}),o};e.current=t,e.add=function(r){t.includes(r)||t.push(r)},e.delete=function(r){let o=t.indexOf(r);~o&&t.splice(o,1)},e.pause=function(){return ce(t,r=>r.pause(...arguments)),this},e.resume=function(){return ce(t,r=>r.resume(...arguments)),this},e.set=function(r){ce(t,(o,s)=>{let a=Ke.fun(r)?r(s,o):r;a&&o.set(a)})},e.start=function(r){let o=[];return ce(t,(s,a)=>{if(Ke.und(r))o.push(s.start());else{let i=this._getProps(r,s,a);i&&o.push(s.start(i))}}),o},e.stop=function(){return ce(t,r=>r.stop(...arguments)),this},e.update=function(r){return ce(t,(o,s)=>o.update(this._getProps(r,o,s))),this};let n=function(r,o,s){return Ke.fun(r)?r(s,o):r};return e._getProps=n,e};function esm_He(t,e,n){let r=jn.fun(e)&&e;r&&!n&&(n=[]);let o=Xe(()=>r||arguments.length==3?esm_fe():void 0,[]),s=Nt(0),a=Dn(),i=Xe(()=>({ctrls:[],queue:[],flush(h,g){let x=esm_e(h,g);return s.current>0&&!i.queue.length&&!Object.keys(x).some(A=>!h.springs[A])?esm_ze(h,g):new Promise(A=>{pt(h,x),i.queue.push(()=>{A(esm_ze(h,g))}),a()})}}),[]),u=Nt([...i.ctrls]),p=[],f=Dt(t)||0;Xe(()=>{Ye(u.current.slice(t,f),h=>{esm_xe(h,o),h.stop(!0)}),u.current.length=t,d(f,t)},[t]),Xe(()=>{d(0,Math.min(f,t))},n);function d(h,g){for(let x=h;x<g;x++){let S=u.current[x]||(u.current[x]=new esm_le(null,i.flush)),A=r?r(x,S):e[x];A&&(p[x]=Ot(A))}}let m=u.current.map((h,g)=>esm_e(h,p[g])),b=Mn(dist_esm_H),c=Dt(b),P=b!==c&&esm_Ue(b);qn(()=>{s.current++,i.ctrls=u.current;let{queue:h}=i;h.length&&(i.queue=[],Ye(h,g=>g())),Ye(u.current,(g,x)=>{o?.add(g),P&&g.start({default:b});let S=p[x];S&&(esm_he(g,S.ref),g.ref?g.queue.push(S):g.start(S))})}),Nn(()=>()=>{Ye(i.ctrls,h=>h.stop(!0))});let l=m.map(h=>({...h}));return o?[l,o]:l}function esm_J(t,e){let n=Qn.fun(t),[[r],o]=esm_He(1,n?t:[t],n?e||[]:e);return n||arguments.length==2?[r,o]:r}var Gn=()=>esm_fe(),Xo=()=>zn(Gn)[0];var Wo=(t,e)=>{let n=Bn(()=>new esm_ue(t,e));return Kn(()=>()=>{n.stop()}),n};function esm_Qt(t,e,n){let r=qt.fun(e)&&e;r&&!n&&(n=[]);let o=!0,s,a=esm_He(t,(i,u)=>{let p=r?r(i,u):e;return s=p.ref,o=o&&p.reverse,p},n||[{}]);if(Yn(()=>{Xn(a[1].current,(i,u)=>{let p=a[1].current[u+(o?1:-1)];if(esm_he(i,s),i.ref){p&&i.update({to:p.springs});return}p?i.start({to:p.springs}):i.start()})},n),r||arguments.length==3){let i=s??a[1];return i._getProps=(u,p,f)=>{let d=qt.fun(u)?u(f,p):u;if(d){let m=i.current[f+(d.reverse?1:-1)];return m&&(d.to=m.springs),d}},a}return a[0]}function esm_Gt(t,e,n){let r=G.fun(e)&&e,{reset:o,sort:s,trail:a=0,expires:i=!0,exitBeforeEnter:u=!1,onDestroyed:p,ref:f,config:d}=r?r():e,m=Jn(()=>r||arguments.length==3?esm_fe():void 0,[]),b=zt(t),c=[],P=lt(null),l=o?null:P.current;Je(()=>{P.current=c}),$n(()=>(j(c,y=>{m?.add(y.ctrl),y.ctrl.ref=m}),()=>{j(P.current,y=>{y.expired&&clearTimeout(y.expirationId),esm_xe(y.ctrl,m),y.ctrl.stop(!0)})}));let h=tr(b,r?r():e,l),g=o&&P.current||[];Je(()=>j(g,({ctrl:y,item:T,key:F})=>{esm_xe(y,m),dist_esm_I(p,T,F)}));let x=[];if(l&&j(l,(y,T)=>{y.expired?(clearTimeout(y.expirationId),g.push(y)):(T=x[T]=h.indexOf(y.key),~T&&(c[T]=y))}),j(b,(y,T)=>{c[T]||(c[T]={key:h[T],item:y,phase:"mount",ctrl:new esm_le},c[T].ctrl.item=y)}),x.length){let y=-1,{leave:T}=r?r():e;j(x,(F,k)=>{let O=l[k];~F?(y=c.indexOf(O),c[y]={...O,item:b[F]}):T&&c.splice(++y,0,O)})}G.fun(s)&&c.sort((y,T)=>s(y.item,T.item));let S=-a,A=Wn(),V=dist_esm_ne(e),_=new Map,v=lt(new Map),w=lt(!1);j(c,(y,T)=>{let F=y.key,k=y.phase,O=r?r():e,U,D,Jt=dist_esm_I(O.delay||0,F);if(k=="mount")U=O.enter,D="enter";else{let M=h.indexOf(F)<0;if(k!="leave")if(M)U=O.leave,D="leave";else if(U=O.update)D="update";else return;else if(!M)U=O.enter,D="enter";else return}if(U=dist_esm_I(U,y.item,T),U=G.obj(U)?esm_de(U):{to:U},!U.config){let M=d||V.config;U.config=dist_esm_I(M,y.item,T,D)}S+=a;let Z={...V,delay:Jt+S,ref:f,immediate:O.immediate,reset:!1,...U};if(D=="enter"&&G.und(Z.from)){let M=r?r():e,Te=G.und(M.initial)||l?M.from:M.initial;Z.from=dist_esm_I(Te,y.item,T)}let{onResolve:Wt}=Z;Z.onResolve=M=>{dist_esm_I(Wt,M);let Te=P.current,B=Te.find(Fe=>Fe.key===F);if(!!B&&!(M.cancelled&&B.phase!="update")&&B.ctrl.idle){let Fe=Te.every(ee=>ee.ctrl.idle);if(B.phase=="leave"){let ee=dist_esm_I(i,B.item);if(ee!==!1){let Ze=ee===!0?0:ee;if(B.expired=!0,!Fe&&Ze>0){Ze<=2147483647&&(B.expirationId=setTimeout(A,Ze));return}}}Fe&&Te.some(ee=>ee.expired)&&(v.current.delete(B),u&&(w.current=!0),A())}};let ft=esm_e(y.ctrl,Z);D==="leave"&&u?v.current.set(y,{phase:D,springs:ft,payload:Z}):_.set(y,{phase:D,springs:ft,payload:Z})});let C=Hn(dist_esm_H),$=Zn(C),L=C!==$&&esm_Ue(C);Je(()=>{L&&j(c,y=>{y.ctrl.start({default:C})})},[C]),j(_,(y,T)=>{if(v.current.size){let F=c.findIndex(k=>k.key===T.key);c.splice(F,1)}}),Je(()=>{j(v.current.size?v.current:_,({phase:y,payload:T},F)=>{let{ctrl:k}=F;F.phase=y,m?.add(k),L&&y=="enter"&&k.start({default:C}),T&&(esm_he(k,T.ref),(k.ref||m)&&!w.current?k.update(T):(k.start(T),w.current&&(w.current=!1)))})},o?void 0:n);let N=y=>Oe.createElement(Oe.Fragment,null,c.map((T,F)=>{let{springs:k}=_.get(T)||T.ctrl,O=y({...k},T.item,T,F);return O&&O.type?Oe.createElement(O.type,{...O.props,key:G.str(T.key)||G.num(T.key)?T.key:T.ctrl.id,ref:O.ref}):O}));return m?[N,m]:N}var esm_er=1;function tr(t,{key:e,keys:n=e},r){if(n===null){let o=new Set;return t.map(s=>{let a=r&&r.find(i=>i.item===s&&i.phase!=="leave"&&!o.has(i));return a?(o.add(a),a.key):esm_er++})}return G.und(n)?t:G.fun(n)?t.map(n):zt(n)}var hs=({container:t,...e}={})=>{let[n,r]=esm_J(()=>({scrollX:0,scrollY:0,scrollXProgress:0,scrollYProgress:0,...e}),[]);return or(()=>{let o=rr(({x:s,y:a})=>{r.start({scrollX:s.current,scrollXProgress:s.progress,scrollY:a.current,scrollYProgress:a.progress})},{container:t?.current||void 0});return()=>{nr(Object.values(n),s=>s.stop()),o()}},[]),n};var Ps=({container:t,...e})=>{let[n,r]=esm_J(()=>({width:0,height:0,...e}),[]);return ar(()=>{let o=sr(({width:s,height:a})=>{r.start({width:s,height:a,immediate:n.width.get()===0||n.height.get()===0})},{container:t?.current||void 0});return()=>{ir(Object.values(n),s=>s.stop()),o()}},[]),n};var cr={any:0,all:1};function Cs(t,e){let[n,r]=pr(!1),o=ur(),s=Bt.fun(t)&&t,a=s?s():{},{to:i={},from:u={},...p}=a,f=s?e:t,[d,m]=esm_J(()=>({from:u,...p}),[]);return lr(()=>{let b=o.current,{root:c,once:P,amount:l="any",...h}=f??{};if(!b||P&&n||typeof IntersectionObserver>"u")return;let g=new WeakMap,x=()=>(i&&m.start(i),r(!0),P?void 0:()=>{u&&m.start(u),r(!1)}),S=V=>{V.forEach(_=>{let v=g.get(_.target);if(_.isIntersecting!==Boolean(v))if(_.isIntersecting){let w=x();Bt.fun(w)?g.set(_.target,w):A.unobserve(_.target)}else v&&(v(),g.delete(_.target))})},A=new IntersectionObserver(S,{root:c&&c.current||void 0,threshold:typeof l=="number"||Array.isArray(l)?l:cr[l],...h});return A.observe(b),()=>A.unobserve(b)},[f]),s?[o,d]:[o,n]}function qs({children:t,...e}){return t(esm_J(e))}function Bs({items:t,children:e,...n}){let r=esm_Qt(t.length,n);return t.map((o,s)=>{let a=e(o,s);return fr.fun(a)?a(r[s]):a})}function Ys({items:t,children:e,...n}){return esm_Gt(t,n)(e)}var esm_W=class extends esm_X{constructor(n,r){super();this.source=n;this.calc=W(...r);let o=this._get(),s=esm_Le(o);esm_D(this,s.create(o))}key;idle=!0;calc;_active=new Set;advance(n){let r=this._get(),o=this.get();bt(r,o)||(dist_esm_k(this).setValue(r),this._onChange(r,this.idle)),!this.idle&&Yt(this._active)&&esm_ct(this)}_get(){let n=dist_esm_l.arr(this.source)?this.source.map(ve):ht(ve(this.source));return this.calc(...n)}_start(){this.idle&&!Yt(this._active)&&(this.idle=!1,esm_Ve(F(this),n=>{n.done=!1}),dist_esm_p.skipAnimation?(esm_n.batchedUpdates(()=>this.advance()),esm_ct(this)):qe.start(this))}_attach(){let n=1;esm_Ve(ht(this.source),r=>{Pt(r)&&Gt(r,this),esm_Re(r)&&(r.idle||this._active.add(r),n=Math.max(n,r.priority+1))}),this.priority=n,this._start()}_detach(){esm_Ve(ht(this.source),n=>{Pt(n)&&Qt(n,this)}),this._active.clear(),esm_ct(this)}eventObserved(n){n.type=="change"?n.idle?this.advance():(this._active.add(n.parent),this._start()):n.type=="idle"?this._active.delete(n.parent):n.type=="priority"&&(this.priority=ht(this.source).reduce((r,o)=>Math.max(r,(esm_Re(o)?o.priority:0)+1),0))}};function vr(t){return t.idle!==!1}function Yt(t){return!t.size||Array.from(t).every(vr)}function esm_ct(t){t.idle||(t.idle=!0,esm_Ve(F(t),e=>{e.done=!0}),$t(t,{type:"idle",parent:t}))}var esm_ui=(t,...e)=>new esm_W(t,e),pi=(t,...e)=>(Cr(),new esm_W(t,e));dist_esm_p.assign({createStringInterpolator:Xt,to:(t,e)=>new esm_W(t,e)});var di=qe.advance; 37709 37710 ;// CONCATENATED MODULE: external "ReactDOM" 37711 const external_ReactDOM_namespaceObject = window["ReactDOM"]; 37712 ;// CONCATENATED MODULE: ./node_modules/@react-spring/web/dist/esm/index.js 37713 var web_dist_esm_k=/^--/;function web_dist_esm_I(t,e){return e==null||typeof e=="boolean"||e===""?"":typeof e=="number"&&e!==0&&!web_dist_esm_k.test(t)&&!(web_dist_esm_c.hasOwnProperty(t)&&web_dist_esm_c[t])?e+"px":(""+e).trim()}var web_dist_esm_v={};function esm_V(t,e){if(!t.nodeType||!t.setAttribute)return!1;let r=t.nodeName==="filter"||t.parentNode&&t.parentNode.nodeName==="filter",{style:i,children:s,scrollTop:u,scrollLeft:l,viewBox:a,...n}=e,d=Object.values(n),m=Object.keys(n).map(o=>r||t.hasAttribute(o)?o:web_dist_esm_v[o]||(web_dist_esm_v[o]=o.replace(/([A-Z])/g,p=>"-"+p.toLowerCase())));s!==void 0&&(t.textContent=s);for(let o in i)if(i.hasOwnProperty(o)){let p=web_dist_esm_I(o,i[o]);web_dist_esm_k.test(o)?t.style.setProperty(o,p):t.style[o]=p}m.forEach((o,p)=>{t.setAttribute(o,d[p])}),u!==void 0&&(t.scrollTop=u),l!==void 0&&(t.scrollLeft=l),a!==void 0&&t.setAttribute("viewBox",a)}var web_dist_esm_c={animationIterationCount:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},esm_F=(t,e)=>t+e.charAt(0).toUpperCase()+e.substring(1),esm_L=["Webkit","Ms","Moz","O"];web_dist_esm_c=Object.keys(web_dist_esm_c).reduce((t,e)=>(esm_L.forEach(r=>t[esm_F(r,e)]=t[e]),t),web_dist_esm_c);var esm_=/^(matrix|translate|scale|rotate|skew)/,dist_esm_$=/^(translate)/,dist_esm_G=/^(rotate|skew)/,web_dist_esm_y=(t,e)=>dist_esm_l.num(t)&&t!==0?t+e:t,web_dist_esm_h=(t,e)=>dist_esm_l.arr(t)?t.every(r=>web_dist_esm_h(r,e)):dist_esm_l.num(t)?t===e:parseFloat(t)===e,dist_esm_g=class extends animated_dist_esm_u{constructor({x:e,y:r,z:i,...s}){let u=[],l=[];(e||r||i)&&(u.push([e||0,r||0,i||0]),l.push(a=>[`translate3d($a.map(n=>web_dist_esm_y(n,"px")).join(",")})`,web_dist_esm_h(a,0)])),xt(s,(a,n)=>{if(n==="transform")u.push([a||""]),l.push(d=>[d,d===""]);else if(esm_.test(n)){if(delete s[n],dist_esm_l.und(a))return;let d=dist_esm_$.test(n)?"px":dist_esm_G.test(n)?"deg":"";u.push(ht(a)),l.push(n==="rotate3d"?([m,o,p,O])=>[`rotate3d($m},$o},$p},$web_dist_esm_y(O,d)})`,web_dist_esm_h(O,0)]:m=>[`$n}($m.map(o=>web_dist_esm_y(o,d)).join(",")})`,web_dist_esm_h(m,n.startsWith("scale")?1:0)])}}),u.length&&(s.transform=new web_dist_esm_x(u,l)),super(s)}},web_dist_esm_x=class extends esm_ge{constructor(r,i){super();this.inputs=r;this.transforms=i}_value=null;get(){return this._value||(this._value=this._get())}_get(){let r="",i=!0;return esm_Ve(this.inputs,(s,u)=>{let l=ve(s[0]),[a,n]=this.transforms[u](dist_esm_l.arr(l)?l:s.map(ve));r+=" "+a,i=i&&n}),i?"none":r}observerAdded(r){r==1&&esm_Ve(this.inputs,i=>esm_Ve(i,s=>Pt(s)&&Gt(s,this)))}observerRemoved(r){r==0&&esm_Ve(this.inputs,i=>esm_Ve(i,s=>Pt(s)&&Qt(s,this)))}eventObserved(r){r.type=="change"&&(this._value=null),$t(this,r)}};var esm_C=["a","abbr","address","area","article","aside","audio","b","base","bdi","bdo","big","blockquote","body","br","button","canvas","caption","cite","code","col","colgroup","data","datalist","dd","del","details","dfn","dialog","div","dl","dt","em","embed","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","iframe","img","input","ins","kbd","keygen","label","legend","li","link","main","map","mark","menu","menuitem","meta","meter","nav","noscript","object","ol","optgroup","option","output","p","param","picture","pre","progress","q","rp","rt","ruby","s","samp","script","section","select","small","source","span","strong","style","sub","summary","sup","table","tbody","td","textarea","tfoot","th","thead","time","title","tr","track","u","ul","var","video","wbr","circle","clipPath","defs","ellipse","foreignObject","g","image","line","linearGradient","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","svg","text","tspan"];dist_esm_p.assign({batchedUpdates:external_ReactDOM_namespaceObject.unstable_batchedUpdates,createStringInterpolator:Xt,colors:It});var dist_esm_q=dist_esm_Ke(esm_C,{applyAnimatedValues:esm_V,createAnimatedStyle:t=>new dist_esm_g(t),getComponentProps:({scrollTop:t,scrollLeft:e,...r})=>r}),dist_esm_it=dist_esm_q.animated; 37714 37715 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-moving-animation/index.js 37716 /** 37717 * External dependencies 37718 */ 37719 37720 37721 /** 37722 * WordPress dependencies 37723 */ 37724 37725 37726 37727 37728 /** 37729 * Internal dependencies 37730 */ 37731 37732 37733 /** 37734 * If the block count exceeds the threshold, we disable the reordering animation 37735 * to avoid laginess. 37736 */ 37737 const BLOCK_ANIMATION_THRESHOLD = 200; 37738 function getAbsolutePosition(element) { 37739 return { 37740 top: element.offsetTop, 37741 left: element.offsetLeft 37742 }; 37743 } 37744 37745 /** 37746 * Hook used to compute the styles required to move a div into a new position. 37747 * 37748 * The way this animation works is the following: 37749 * - It first renders the element as if there was no animation. 37750 * - It takes a snapshot of the position of the block to use it 37751 * as a destination point for the animation. 37752 * - It restores the element to the previous position using a CSS transform 37753 * - It uses the "resetAnimation" flag to reset the animation 37754 * from the beginning in order to animate to the new destination point. 37755 * 37756 * @param {Object} $1 Options 37757 * @param {*} $1.triggerAnimationOnChange Variable used to trigger the animation if it changes. 37758 * @param {string} $1.clientId 37759 */ 37760 function useMovingAnimation({ 37761 triggerAnimationOnChange, 37762 clientId 37763 }) { 37764 const ref = (0,external_wp_element_namespaceObject.useRef)(); 37765 const { 37766 isTyping, 37767 getGlobalBlockCount, 37768 isBlockSelected, 37769 isFirstMultiSelectedBlock, 37770 isBlockMultiSelected, 37771 isAncestorMultiSelected 37772 } = (0,external_wp_data_namespaceObject.useSelect)(store); 37773 37774 // Whenever the trigger changes, we need to take a snapshot of the current 37775 // position of the block to use it as a destination point for the animation. 37776 const { 37777 previous, 37778 prevRect 37779 } = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 37780 previous: ref.current && getAbsolutePosition(ref.current), 37781 prevRect: ref.current && ref.current.getBoundingClientRect() 37782 }), 37783 // eslint-disable-next-line react-hooks/exhaustive-deps 37784 [triggerAnimationOnChange]); 37785 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 37786 if (!previous || !ref.current) { 37787 return; 37788 } 37789 const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(ref.current); 37790 const isSelected = isBlockSelected(clientId); 37791 const adjustScrolling = isSelected || isFirstMultiSelectedBlock(clientId); 37792 function preserveScrollPosition() { 37793 if (adjustScrolling && prevRect) { 37794 const blockRect = ref.current.getBoundingClientRect(); 37795 const diff = blockRect.top - prevRect.top; 37796 if (diff) { 37797 scrollContainer.scrollTop += diff; 37798 } 37799 } 37800 } 37801 37802 // We disable the animation if the user has a preference for reduced 37803 // motion, if the user is typing (insertion by Enter), or if the block 37804 // count exceeds the threshold (insertion caused all the blocks that 37805 // follow to animate). 37806 // To do: consider enableing the _moving_ animation even for large 37807 // posts, while only disabling the _insertion_ animation? 37808 const disableAnimation = window.matchMedia('(prefers-reduced-motion: reduce)').matches || isTyping() || getGlobalBlockCount() > BLOCK_ANIMATION_THRESHOLD; 37809 if (disableAnimation) { 37810 // If the animation is disabled and the scroll needs to be adjusted, 37811 // just move directly to the final scroll position. 37812 preserveScrollPosition(); 37813 return; 37814 } 37815 const isPartOfSelection = isSelected || isBlockMultiSelected(clientId) || isAncestorMultiSelected(clientId); 37816 // Make sure the other blocks move under the selected block(s). 37817 const zIndex = isPartOfSelection ? '1' : ''; 37818 const controller = new esm_le({ 37819 x: 0, 37820 y: 0, 37821 config: { 37822 mass: 5, 37823 tension: 2000, 37824 friction: 200 37825 }, 37826 onChange({ 37827 value 37828 }) { 37829 if (!ref.current) { 37830 return; 37831 } 37832 let { 37833 x, 37834 y 37835 } = value; 37836 x = Math.round(x); 37837 y = Math.round(y); 37838 const finishedMoving = x === 0 && y === 0; 37839 ref.current.style.transformOrigin = 'center center'; 37840 ref.current.style.transform = finishedMoving ? null // Set to `null` to explicitly remove the transform. 37841 : `translate3d($x}px,$y}px,0)`; 37842 ref.current.style.zIndex = zIndex; 37843 preserveScrollPosition(); 37844 } 37845 }); 37846 ref.current.style.transform = undefined; 37847 const destination = getAbsolutePosition(ref.current); 37848 const x = Math.round(previous.left - destination.left); 37849 const y = Math.round(previous.top - destination.top); 37850 controller.start({ 37851 x: 0, 37852 y: 0, 37853 from: { 37854 x, 37855 y 37856 } 37857 }); 37858 return () => { 37859 controller.stop(); 37860 controller.set({ 37861 x: 0, 37862 y: 0 37863 }); 37864 }; 37865 }, [previous, prevRect, clientId, isTyping, getGlobalBlockCount, isBlockSelected, isFirstMultiSelectedBlock, isBlockMultiSelected, isAncestorMultiSelected]); 37866 return ref; 37867 } 37868 /* harmony default export */ const use_moving_animation = (useMovingAnimation); 37869 37870 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/use-focus-first-element.js 37871 /** 37872 * WordPress dependencies 37873 */ 37874 37875 37876 37877 37878 /** 37879 * Internal dependencies 37880 */ 37881 37882 37883 37884 /** @typedef {import('@wordpress/element').RefObject} RefObject */ 37885 37886 /** 37887 * Transitions focus to the block or inner tabbable when the block becomes 37888 * selected and an initial position is set. 37889 * 37890 * @param {string} clientId Block client ID. 37891 * 37892 * @return {RefObject} React ref with the block element. 37893 */ 37894 function useFocusFirstElement({ 37895 clientId, 37896 initialPosition 37897 }) { 37898 const ref = (0,external_wp_element_namespaceObject.useRef)(); 37899 const { 37900 isBlockSelected, 37901 isMultiSelecting, 37902 __unstableGetEditorMode 37903 } = (0,external_wp_data_namespaceObject.useSelect)(store); 37904 (0,external_wp_element_namespaceObject.useEffect)(() => { 37905 // Check if the block is still selected at the time this effect runs. 37906 if (!isBlockSelected(clientId) || isMultiSelecting() || __unstableGetEditorMode() === 'zoom-out') { 37907 return; 37908 } 37909 if (initialPosition === undefined || initialPosition === null) { 37910 return; 37911 } 37912 if (!ref.current) { 37913 return; 37914 } 37915 const { 37916 ownerDocument 37917 } = ref.current; 37918 37919 // Do not focus the block if it already contains the active element. 37920 if (isInsideRootBlock(ref.current, ownerDocument.activeElement)) { 37921 return; 37922 } 37923 37924 // Find all tabbables within node. 37925 const textInputs = external_wp_dom_namespaceObject.focus.tabbable.find(ref.current).filter(node => (0,external_wp_dom_namespaceObject.isTextField)(node)); 37926 37927 // If reversed (e.g. merge via backspace), use the last in the set of 37928 // tabbables. 37929 const isReverse = -1 === initialPosition; 37930 const target = textInputs[isReverse ? textInputs.length - 1 : 0] || ref.current; 37931 if (!isInsideRootBlock(ref.current, target)) { 37932 ref.current.focus(); 37933 return; 37934 } 37935 37936 // Check to see if element is focussable before a generic caret insert. 37937 if (!ref.current.getAttribute('contenteditable')) { 37938 const focusElement = external_wp_dom_namespaceObject.focus.tabbable.findNext(ref.current); 37939 // Make sure focusElement is valid, contained in the same block, and a form field. 37940 if (focusElement && isInsideRootBlock(ref.current, focusElement) && (0,external_wp_dom_namespaceObject.isFormElement)(focusElement)) { 37941 focusElement.focus(); 37942 return; 37943 } 37944 } 37945 (0,external_wp_dom_namespaceObject.placeCaretAtHorizontalEdge)(target, isReverse); 37946 }, [initialPosition, clientId]); 37947 return ref; 37948 } 37949 37950 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/use-is-hovered.js 37951 /** 37952 * WordPress dependencies 37953 */ 37954 37955 37956 37957 /** 37958 * Internal dependencies 37959 */ 37960 37961 37962 /* 37963 * Adds `is-hovered` class when the block is hovered and in navigation or 37964 * outline mode. 37965 */ 37966 function useIsHovered({ 37967 clientId 37968 }) { 37969 const { 37970 hoverBlock 37971 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 37972 function listener(event) { 37973 if (event.defaultPrevented) { 37974 return; 37975 } 37976 const action = event.type === 'mouseover' ? 'add' : 'remove'; 37977 event.preventDefault(); 37978 event.currentTarget.classList[action]('is-hovered'); 37979 if (action === 'add') { 37980 hoverBlock(clientId); 37981 } else { 37982 hoverBlock(null); 37983 } 37984 } 37985 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 37986 node.addEventListener('mouseout', listener); 37987 node.addEventListener('mouseover', listener); 37988 return () => { 37989 node.removeEventListener('mouseout', listener); 37990 node.removeEventListener('mouseover', listener); 37991 37992 // Remove class in case it lingers. 37993 node.classList.remove('is-hovered'); 37994 hoverBlock(null); 37995 }; 37996 }, []); 37997 } 37998 37999 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/use-focus-handler.js 38000 /** 38001 * WordPress dependencies 38002 */ 38003 38004 38005 38006 /** 38007 * Internal dependencies 38008 */ 38009 38010 38011 38012 /** 38013 * Selects the block if it receives focus. 38014 * 38015 * @param {string} clientId Block client ID. 38016 */ 38017 function useFocusHandler(clientId) { 38018 const { 38019 isBlockSelected 38020 } = (0,external_wp_data_namespaceObject.useSelect)(store); 38021 const { 38022 selectBlock, 38023 selectionChange 38024 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 38025 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 38026 /** 38027 * Marks the block as selected when focused and not already 38028 * selected. This specifically handles the case where block does not 38029 * set focus on its own (via `setFocus`), typically if there is no 38030 * focusable input in the block. 38031 * 38032 * @param {FocusEvent} event Focus event. 38033 */ 38034 function onFocus(event) { 38035 // When the whole editor is editable, let writing flow handle 38036 // selection. 38037 if (node.parentElement.closest('[contenteditable="true"]')) { 38038 return; 38039 } 38040 38041 // Check synchronously because a non-selected block might be 38042 // getting data through `useSelect` asynchronously. 38043 if (isBlockSelected(clientId)) { 38044 // Potentially change selection away from rich text. 38045 if (!event.target.isContentEditable) { 38046 selectionChange(clientId); 38047 } 38048 return; 38049 } 38050 38051 // If an inner block is focussed, that block is resposible for 38052 // setting the selected block. 38053 if (!isInsideRootBlock(node, event.target)) { 38054 return; 38055 } 38056 selectBlock(clientId); 38057 } 38058 node.addEventListener('focusin', onFocus); 38059 return () => { 38060 node.removeEventListener('focusin', onFocus); 38061 }; 38062 }, [isBlockSelected, selectBlock]); 38063 } 38064 38065 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/use-selected-block-event-handlers.js 38066 /** 38067 * WordPress dependencies 38068 */ 38069 38070 38071 38072 38073 38074 /** 38075 * Internal dependencies 38076 */ 38077 38078 38079 38080 /** 38081 * Adds block behaviour: 38082 * - Removes the block on BACKSPACE. 38083 * - Inserts a default block on ENTER. 38084 * - Disables dragging of block contents. 38085 * 38086 * @param {string} clientId Block client ID. 38087 */ 38088 function useEventHandlers({ 38089 clientId, 38090 isSelected 38091 }) { 38092 const { 38093 getBlockRootClientId, 38094 getBlockIndex, 38095 isZoomOut, 38096 __unstableGetEditorMode 38097 } = unlock((0,external_wp_data_namespaceObject.useSelect)(store)); 38098 const { 38099 insertAfterBlock, 38100 removeBlock, 38101 __unstableSetEditorMode, 38102 resetZoomLevel 38103 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 38104 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 38105 if (!isSelected) { 38106 return; 38107 } 38108 38109 /** 38110 * Interprets keydown event intent to remove or insert after block if 38111 * key event occurs on wrapper node. This can occur when the block has 38112 * no text fields of its own, particularly after initial insertion, to 38113 * allow for easy deletion and continuous writing flow to add additional 38114 * content. 38115 * 38116 * @param {KeyboardEvent} event Keydown event. 38117 */ 38118 function onKeyDown(event) { 38119 const { 38120 keyCode, 38121 target 38122 } = event; 38123 if (keyCode !== external_wp_keycodes_namespaceObject.ENTER && keyCode !== external_wp_keycodes_namespaceObject.BACKSPACE && keyCode !== external_wp_keycodes_namespaceObject.DELETE) { 38124 return; 38125 } 38126 if (target !== node || (0,external_wp_dom_namespaceObject.isTextField)(target)) { 38127 return; 38128 } 38129 event.preventDefault(); 38130 if (keyCode === external_wp_keycodes_namespaceObject.ENTER && __unstableGetEditorMode() === 'zoom-out' && isZoomOut()) { 38131 __unstableSetEditorMode('edit'); 38132 resetZoomLevel(); 38133 } else if (keyCode === external_wp_keycodes_namespaceObject.ENTER) { 38134 insertAfterBlock(clientId); 38135 } else { 38136 removeBlock(clientId); 38137 } 38138 } 38139 38140 /** 38141 * Prevents default dragging behavior within a block. To do: we must 38142 * handle this in the future and clean up the drag target. 38143 * 38144 * @param {DragEvent} event Drag event. 38145 */ 38146 function onDragStart(event) { 38147 event.preventDefault(); 38148 } 38149 node.addEventListener('keydown', onKeyDown); 38150 node.addEventListener('dragstart', onDragStart); 38151 return () => { 38152 node.removeEventListener('keydown', onKeyDown); 38153 node.removeEventListener('dragstart', onDragStart); 38154 }; 38155 }, [clientId, isSelected, getBlockRootClientId, getBlockIndex, insertAfterBlock, removeBlock, __unstableGetEditorMode, __unstableSetEditorMode, isZoomOut, resetZoomLevel]); 38156 } 38157 38158 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/use-nav-mode-exit.js 38159 /** 38160 * WordPress dependencies 38161 */ 38162 38163 38164 38165 /** 38166 * Internal dependencies 38167 */ 38168 38169 38170 /** 38171 * Allows navigation mode to be exited by clicking in the selected block. 38172 * 38173 * @param {string} clientId Block client ID. 38174 */ 38175 function useNavModeExit(clientId) { 38176 const { 38177 isNavigationMode, 38178 isBlockSelected 38179 } = (0,external_wp_data_namespaceObject.useSelect)(store); 38180 const { 38181 setNavigationMode, 38182 selectBlock 38183 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 38184 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 38185 function onMouseDown(event) { 38186 // Don't select a block if it's already handled by a child 38187 // block. 38188 if (isNavigationMode() && !event.defaultPrevented) { 38189 // Prevent focus from moving to the block. 38190 event.preventDefault(); 38191 38192 // When clicking on a selected block, exit navigation mode. 38193 if (isBlockSelected(clientId)) { 38194 setNavigationMode(false); 38195 } else { 38196 selectBlock(clientId); 38197 } 38198 } 38199 } 38200 node.addEventListener('mousedown', onMouseDown); 38201 return () => { 38202 node.removeEventListener('mousedown', onMouseDown); 38203 }; 38204 }, [clientId, isNavigationMode, isBlockSelected, setNavigationMode]); 38205 } 38206 38207 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/use-zoom-out-mode-exit.js 38208 /** 38209 * WordPress dependencies 38210 */ 38211 38212 38213 38214 /** 38215 * Internal dependencies 38216 */ 38217 38218 38219 38220 /** 38221 * Allows Zoom Out mode to be exited by double clicking in the selected block. 38222 */ 38223 function useZoomOutModeExit() { 38224 const { 38225 getSettings, 38226 isZoomOut, 38227 __unstableGetEditorMode 38228 } = unlock((0,external_wp_data_namespaceObject.useSelect)(store)); 38229 const { 38230 __unstableSetEditorMode, 38231 resetZoomLevel 38232 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 38233 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 38234 function onDoubleClick(event) { 38235 // In "compose" mode. 38236 const composeMode = __unstableGetEditorMode() === 'zoom-out' && isZoomOut(); 38237 if (!composeMode) { 38238 return; 38239 } 38240 if (!event.defaultPrevented) { 38241 event.preventDefault(); 38242 const { 38243 __experimentalSetIsInserterOpened 38244 } = getSettings(); 38245 if (typeof __experimentalSetIsInserterOpened === 'function') { 38246 __experimentalSetIsInserterOpened(false); 38247 } 38248 __unstableSetEditorMode('edit'); 38249 resetZoomLevel(); 38250 } 38251 } 38252 node.addEventListener('dblclick', onDoubleClick); 38253 return () => { 38254 node.removeEventListener('dblclick', onDoubleClick); 38255 }; 38256 }, [getSettings, __unstableSetEditorMode, __unstableGetEditorMode, isZoomOut, resetZoomLevel]); 38257 } 38258 38259 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/use-intersection-observer.js 38260 /** 38261 * WordPress dependencies 38262 */ 38263 38264 38265 38266 /** 38267 * Internal dependencies 38268 */ 38269 38270 function useIntersectionObserver() { 38271 const observer = (0,external_wp_element_namespaceObject.useContext)(block_list_IntersectionObserver); 38272 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 38273 if (observer) { 38274 observer.observe(node); 38275 return () => { 38276 observer.unobserve(node); 38277 }; 38278 } 38279 }, [observer]); 38280 } 38281 38282 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/use-scroll-into-view.js 38283 /** 38284 * WordPress dependencies 38285 */ 38286 38287 function useScrollIntoView({ 38288 isSelected 38289 }) { 38290 const prefersReducedMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); 38291 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 38292 if (isSelected) { 38293 const { 38294 ownerDocument 38295 } = node; 38296 const { 38297 defaultView 38298 } = ownerDocument; 38299 if (!defaultView.IntersectionObserver) { 38300 return; 38301 } 38302 const observer = new defaultView.IntersectionObserver(entries => { 38303 // Once observing starts, we always get an initial 38304 // entry with the intersecting state. 38305 if (!entries[0].isIntersecting) { 38306 node.scrollIntoView({ 38307 behavior: prefersReducedMotion ? 'instant' : 'smooth' 38308 }); 38309 } 38310 observer.disconnect(); 38311 }); 38312 observer.observe(node); 38313 return () => { 38314 observer.disconnect(); 38315 }; 38316 } 38317 }, [isSelected]); 38318 } 38319 38320 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-flash-editable-blocks/index.js 38321 /** 38322 * WordPress dependencies 38323 */ 38324 38325 38326 38327 /** 38328 * Internal dependencies 38329 */ 38330 38331 38332 function useFlashEditableBlocks({ 38333 clientId = '', 38334 isEnabled = true 38335 } = {}) { 38336 const { 38337 getEnabledClientIdsTree 38338 } = unlock((0,external_wp_data_namespaceObject.useSelect)(store)); 38339 return (0,external_wp_compose_namespaceObject.useRefEffect)(element => { 38340 if (!isEnabled) { 38341 return; 38342 } 38343 const flashEditableBlocks = () => { 38344 getEnabledClientIdsTree(clientId).forEach(({ 38345 clientId: id 38346 }) => { 38347 const block = element.querySelector(`[data-block="$id}"]`); 38348 if (!block) { 38349 return; 38350 } 38351 block.classList.remove('has-editable-outline'); 38352 // Force reflow to trigger the animation. 38353 // eslint-disable-next-line no-unused-expressions 38354 block.offsetWidth; 38355 block.classList.add('has-editable-outline'); 38356 }); 38357 }; 38358 const handleClick = event => { 38359 const shouldFlash = event.target === element || event.target.classList.contains('is-root-container'); 38360 if (!shouldFlash) { 38361 return; 38362 } 38363 if (event.defaultPrevented) { 38364 return; 38365 } 38366 event.preventDefault(); 38367 flashEditableBlocks(); 38368 }; 38369 element.addEventListener('click', handleClick); 38370 return () => element.removeEventListener('click', handleClick); 38371 }, [isEnabled]); 38372 } 38373 38374 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/use-bindings-attributes.js 38375 /** 38376 * WordPress dependencies 38377 */ 38378 38379 38380 38381 38382 38383 38384 /** 38385 * Internal dependencies 38386 */ 38387 38388 38389 38390 38391 /** @typedef {import('@wordpress/compose').WPHigherOrderComponent} WPHigherOrderComponent */ 38392 /** @typedef {import('@wordpress/blocks').WPBlockSettings} WPBlockSettings */ 38393 38394 /** 38395 * Given a binding of block attributes, returns a higher order component that 38396 * overrides its `attributes` and `setAttributes` props to sync any changes needed. 38397 * 38398 * @return {WPHigherOrderComponent} Higher-order component. 38399 */ 38400 38401 38402 const BLOCK_BINDINGS_ALLOWED_BLOCKS = { 38403 'core/paragraph': ['content'], 38404 'core/heading': ['content'], 38405 'core/image': ['id', 'url', 'title', 'alt'], 38406 'core/button': ['url', 'text', 'linkTarget', 'rel'] 38407 }; 38408 const DEFAULT_ATTRIBUTE = '__default'; 38409 38410 /** 38411 * Returns the bindings with the `__default` binding for pattern overrides 38412 * replaced with the full-set of supported attributes. e.g.: 38413 * 38414 * bindings passed in: `{ __default: { source: 'core/pattern-overrides' } }` 38415 * bindings returned: `{ content: { source: 'core/pattern-overrides' } }` 38416 * 38417 * @param {string} blockName The block name (e.g. 'core/paragraph'). 38418 * @param {Object} bindings A block's bindings from the metadata attribute. 38419 * 38420 * @return {Object} The bindings with default replaced for pattern overrides. 38421 */ 38422 function replacePatternOverrideDefaultBindings(blockName, bindings) { 38423 // The `__default` binding currently only works for pattern overrides. 38424 if (bindings?.[DEFAULT_ATTRIBUTE]?.source === 'core/pattern-overrides') { 38425 const supportedAttributes = BLOCK_BINDINGS_ALLOWED_BLOCKS[blockName]; 38426 const bindingsWithDefaults = {}; 38427 for (const attributeName of supportedAttributes) { 38428 // If the block has mixed binding sources, retain any non pattern override bindings. 38429 const bindingSource = bindings[attributeName] ? bindings[attributeName] : { 38430 source: 'core/pattern-overrides' 38431 }; 38432 bindingsWithDefaults[attributeName] = bindingSource; 38433 } 38434 return bindingsWithDefaults; 38435 } 38436 return bindings; 38437 } 38438 38439 /** 38440 * Based on the given block name, 38441 * check if it is possible to bind the block. 38442 * 38443 * @param {string} blockName - The block name. 38444 * @return {boolean} Whether it is possible to bind the block to sources. 38445 */ 38446 function canBindBlock(blockName) { 38447 return blockName in BLOCK_BINDINGS_ALLOWED_BLOCKS; 38448 } 38449 38450 /** 38451 * Based on the given block name and attribute name, 38452 * check if it is possible to bind the block attribute. 38453 * 38454 * @param {string} blockName - The block name. 38455 * @param {string} attributeName - The attribute name. 38456 * @return {boolean} Whether it is possible to bind the block attribute. 38457 */ 38458 function canBindAttribute(blockName, attributeName) { 38459 return canBindBlock(blockName) && BLOCK_BINDINGS_ALLOWED_BLOCKS[blockName].includes(attributeName); 38460 } 38461 function getBindableAttributes(blockName) { 38462 return BLOCK_BINDINGS_ALLOWED_BLOCKS[blockName]; 38463 } 38464 const withBlockBindingSupport = (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(BlockEdit => props => { 38465 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 38466 const blockContext = (0,external_wp_element_namespaceObject.useContext)(block_context); 38467 const sources = (0,external_wp_data_namespaceObject.useSelect)(select => unlock(select(external_wp_blocks_namespaceObject.store)).getAllBlockBindingsSources()); 38468 const { 38469 name, 38470 clientId, 38471 context, 38472 setAttributes 38473 } = props; 38474 const blockBindings = (0,external_wp_element_namespaceObject.useMemo)(() => replacePatternOverrideDefaultBindings(name, props.attributes.metadata?.bindings), [props.attributes.metadata?.bindings, name]); 38475 38476 // While this hook doesn't directly call any selectors, `useSelect` is 38477 // used purposely here to ensure `boundAttributes` is updated whenever 38478 // there are attribute updates. 38479 // `source.getValues` may also call a selector via `registry.select`. 38480 const updatedContext = {}; 38481 const boundAttributes = (0,external_wp_data_namespaceObject.useSelect)(select => { 38482 if (!blockBindings) { 38483 return; 38484 } 38485 const attributes = {}; 38486 const blockBindingsBySource = new Map(); 38487 for (const [attributeName, binding] of Object.entries(blockBindings)) { 38488 const { 38489 source: sourceName, 38490 args: sourceArgs 38491 } = binding; 38492 const source = sources[sourceName]; 38493 if (!source || !canBindAttribute(name, attributeName)) { 38494 continue; 38495 } 38496 38497 // Populate context. 38498 for (const key of source.usesContext || []) { 38499 updatedContext[key] = blockContext[key]; 38500 } 38501 blockBindingsBySource.set(source, { 38502 ...blockBindingsBySource.get(source), 38503 [attributeName]: { 38504 args: sourceArgs 38505 } 38506 }); 38507 } 38508 if (blockBindingsBySource.size) { 38509 for (const [source, bindings] of blockBindingsBySource) { 38510 // Get values in batch if the source supports it. 38511 let values = {}; 38512 if (!source.getValues) { 38513 Object.keys(bindings).forEach(attr => { 38514 // Default to the the source label when `getValues` doesn't exist. 38515 values[attr] = source.label; 38516 }); 38517 } else { 38518 values = source.getValues({ 38519 select, 38520 context: updatedContext, 38521 clientId, 38522 bindings 38523 }); 38524 } 38525 for (const [attributeName, value] of Object.entries(values)) { 38526 if (attributeName === 'url' && (!value || !isURLLike(value))) { 38527 // Return null if value is not a valid URL. 38528 attributes[attributeName] = null; 38529 } else { 38530 attributes[attributeName] = value; 38531 } 38532 } 38533 } 38534 } 38535 return attributes; 38536 }, [blockBindings, name, clientId, updatedContext, sources]); 38537 const hasParentPattern = !!updatedContext['pattern/overrides']; 38538 const hasPatternOverridesDefaultBinding = props.attributes.metadata?.bindings?.[DEFAULT_ATTRIBUTE]?.source === 'core/pattern-overrides'; 38539 const _setAttributes = (0,external_wp_element_namespaceObject.useCallback)(nextAttributes => { 38540 registry.batch(() => { 38541 if (!blockBindings) { 38542 setAttributes(nextAttributes); 38543 return; 38544 } 38545 const keptAttributes = { 38546 ...nextAttributes 38547 }; 38548 const blockBindingsBySource = new Map(); 38549 38550 // Loop only over the updated attributes to avoid modifying the bound ones that haven't changed. 38551 for (const [attributeName, newValue] of Object.entries(keptAttributes)) { 38552 if (!blockBindings[attributeName] || !canBindAttribute(name, attributeName)) { 38553 continue; 38554 } 38555 const binding = blockBindings[attributeName]; 38556 const source = sources[binding?.source]; 38557 if (!source?.setValues) { 38558 continue; 38559 } 38560 blockBindingsBySource.set(source, { 38561 ...blockBindingsBySource.get(source), 38562 [attributeName]: { 38563 args: binding.args, 38564 newValue 38565 } 38566 }); 38567 delete keptAttributes[attributeName]; 38568 } 38569 if (blockBindingsBySource.size) { 38570 for (const [source, bindings] of blockBindingsBySource) { 38571 source.setValues({ 38572 select: registry.select, 38573 dispatch: registry.dispatch, 38574 context: updatedContext, 38575 clientId, 38576 bindings 38577 }); 38578 } 38579 } 38580 if ( 38581 // Don't update non-connected attributes if the block is using pattern overrides 38582 // and the editing is happening while overriding the pattern (not editing the original). 38583 !(hasPatternOverridesDefaultBinding && hasParentPattern) && Object.keys(keptAttributes).length) { 38584 // Don't update caption and href until they are supported. 38585 if (hasPatternOverridesDefaultBinding) { 38586 delete keptAttributes?.caption; 38587 delete keptAttributes?.href; 38588 } 38589 setAttributes(keptAttributes); 38590 } 38591 }); 38592 }, [registry, blockBindings, name, clientId, updatedContext, setAttributes, sources, hasPatternOverridesDefaultBinding, hasParentPattern]); 38593 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 38594 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockEdit, { 38595 ...props, 38596 attributes: { 38597 ...props.attributes, 38598 ...boundAttributes 38599 }, 38600 setAttributes: _setAttributes, 38601 context: { 38602 ...context, 38603 ...updatedContext 38604 } 38605 }) 38606 }); 38607 }, 'withBlockBindingSupport'); 38608 38609 /** 38610 * Filters a registered block's settings to enhance a block's `edit` component 38611 * to upgrade bound attributes. 38612 * 38613 * @param {WPBlockSettings} settings - Registered block settings. 38614 * @param {string} name - Block name. 38615 * @return {WPBlockSettings} Filtered block settings. 38616 */ 38617 function shimAttributeSource(settings, name) { 38618 if (!canBindBlock(name)) { 38619 return settings; 38620 } 38621 return { 38622 ...settings, 38623 edit: withBlockBindingSupport(settings.edit) 38624 }; 38625 } 38626 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/editor/custom-sources-backwards-compatibility/shim-attribute-source', shimAttributeSource); 38627 38628 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-block-props/index.js 38629 /** 38630 * External dependencies 38631 */ 38632 38633 38634 /** 38635 * WordPress dependencies 38636 */ 38637 38638 38639 38640 38641 38642 38643 /** 38644 * Internal dependencies 38645 */ 38646 38647 38648 38649 38650 38651 38652 38653 38654 38655 38656 38657 38658 38659 38660 38661 /** 38662 * This hook is used to lightly mark an element as a block element. The element 38663 * should be the outermost element of a block. Call this hook and pass the 38664 * returned props to the element to mark as a block. If you define a ref for the 38665 * element, it is important to pass the ref to this hook, which the hook in turn 38666 * will pass to the component through the props it returns. Optionally, you can 38667 * also pass any other props through this hook, and they will be merged and 38668 * returned. 38669 * 38670 * Use of this hook on the outermost element of a block is required if using API >= v2. 38671 * 38672 * @example 38673 * ```js 38674 * import { useBlockProps } from '@wordpress/block-editor'; 38675 * 38676 * export default function Edit() { 38677 * 38678 * const blockProps = useBlockProps( { 38679 * className: 'my-custom-class', 38680 * style: { 38681 * color: '#222222', 38682 * backgroundColor: '#eeeeee' 38683 * } 38684 * } ) 38685 * 38686 * return ( 38687 * <div { ...blockProps }> 38688 * 38689 * </div> 38690 * ) 38691 * } 38692 * 38693 * ``` 38694 * 38695 * 38696 * @param {Object} props Optional. Props to pass to the element. Must contain 38697 * the ref if one is defined. 38698 * @param {Object} options Options for internal use only. 38699 * @param {boolean} options.__unstableIsHtml 38700 * 38701 * @return {Object} Props to pass to the element to mark as a block. 38702 */ 38703 function use_block_props_useBlockProps(props = {}, { 38704 __unstableIsHtml 38705 } = {}) { 38706 const { 38707 clientId, 38708 className, 38709 wrapperProps = {}, 38710 isAligned, 38711 index, 38712 mode, 38713 name, 38714 blockApiVersion, 38715 blockTitle, 38716 isSelected, 38717 isSubtreeDisabled, 38718 hasOverlay, 38719 initialPosition, 38720 blockEditingMode, 38721 isHighlighted, 38722 isMultiSelected, 38723 isPartiallySelected, 38724 isReusable, 38725 isDragging, 38726 hasChildSelected, 38727 isBlockMovingMode, 38728 canInsertMovingBlock, 38729 isEditingDisabled, 38730 hasEditableOutline, 38731 isTemporarilyEditingAsBlocks, 38732 defaultClassName, 38733 templateLock 38734 } = (0,external_wp_element_namespaceObject.useContext)(PrivateBlockContext); 38735 38736 // translators: %s: Type of block (i.e. Text, Image etc) 38737 const blockLabel = (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Block: %s'), blockTitle); 38738 const htmlSuffix = mode === 'html' && !__unstableIsHtml ? '-visual' : ''; 38739 const mergedRefs = (0,external_wp_compose_namespaceObject.useMergeRefs)([props.ref, useFocusFirstElement({ 38740 clientId, 38741 initialPosition 38742 }), useBlockRefProvider(clientId), useFocusHandler(clientId), useEventHandlers({ 38743 clientId, 38744 isSelected 38745 }), useNavModeExit(clientId), useZoomOutModeExit(), useIsHovered({ 38746 clientId 38747 }), useIntersectionObserver(), use_moving_animation({ 38748 triggerAnimationOnChange: index, 38749 clientId 38750 }), (0,external_wp_compose_namespaceObject.useDisabled)({ 38751 isDisabled: !hasOverlay 38752 }), useFlashEditableBlocks({ 38753 clientId, 38754 isEnabled: name === 'core/block' || templateLock === 'contentOnly' 38755 }), useScrollIntoView({ 38756 isSelected 38757 })]); 38758 const blockEditContext = useBlockEditContext(); 38759 const hasBlockBindings = !!blockEditContext[blockBindingsKey]; 38760 const bindingsStyle = hasBlockBindings && canBindBlock(name) ? { 38761 '--wp-admin-theme-color': 'var(--wp-block-synced-color)', 38762 '--wp-admin-theme-color--rgb': 'var(--wp-block-synced-color--rgb)' 38763 } : {}; 38764 38765 // Ensures it warns only inside the `edit` implementation for the block. 38766 if (blockApiVersion < 2 && clientId === blockEditContext.clientId) { 38767 true ? external_wp_warning_default()(`Block type "$name}" must support API version 2 or higher to work correctly with "useBlockProps" method.`) : 0; 38768 } 38769 let hasNegativeMargin = false; 38770 if (wrapperProps?.style?.marginTop?.charAt(0) === '-' || wrapperProps?.style?.marginBottom?.charAt(0) === '-' || wrapperProps?.style?.marginLeft?.charAt(0) === '-' || wrapperProps?.style?.marginRight?.charAt(0) === '-') { 38771 hasNegativeMargin = true; 38772 } 38773 return { 38774 tabIndex: blockEditingMode === 'disabled' ? -1 : 0, 38775 ...wrapperProps, 38776 ...props, 38777 ref: mergedRefs, 38778 id: `block-$clientId}$htmlSuffix}`, 38779 role: 'document', 38780 'aria-label': blockLabel, 38781 'data-block': clientId, 38782 'data-type': name, 38783 'data-title': blockTitle, 38784 inert: isSubtreeDisabled ? 'true' : undefined, 38785 className: dist_clsx('block-editor-block-list__block', { 38786 // The wp-block className is important for editor styles. 38787 'wp-block': !isAligned, 38788 'has-block-overlay': hasOverlay, 38789 'is-selected': isSelected, 38790 'is-highlighted': isHighlighted, 38791 'is-multi-selected': isMultiSelected, 38792 'is-partially-selected': isPartiallySelected, 38793 'is-reusable': isReusable, 38794 'is-dragging': isDragging, 38795 'has-child-selected': hasChildSelected, 38796 'is-block-moving-mode': isBlockMovingMode, 38797 'can-insert-moving-block': canInsertMovingBlock, 38798 'is-editing-disabled': isEditingDisabled, 38799 'has-editable-outline': hasEditableOutline, 38800 'has-negative-margin': hasNegativeMargin, 38801 'is-content-locked-temporarily-editing-as-blocks': isTemporarilyEditingAsBlocks 38802 }, className, props.className, wrapperProps.className, defaultClassName), 38803 style: { 38804 ...wrapperProps.style, 38805 ...props.style, 38806 ...bindingsStyle 38807 } 38808 }; 38809 } 38810 38811 /** 38812 * Call within a save function to get the props for the block wrapper. 38813 * 38814 * @param {Object} props Optional. Props to pass to the element. 38815 */ 38816 use_block_props_useBlockProps.save = external_wp_blocks_namespaceObject.__unstableGetBlockProps; 38817 38818 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/block.js 38819 /** 38820 * External dependencies 38821 */ 38822 38823 38824 /** 38825 * WordPress dependencies 38826 */ 38827 38828 38829 38830 38831 38832 38833 38834 /** 38835 * Internal dependencies 38836 */ 38837 38838 38839 38840 38841 38842 38843 38844 38845 38846 38847 38848 38849 38850 const { 38851 isUnmodifiedBlockContent 38852 } = unlock(external_wp_blocks_namespaceObject.privateApis); 38853 38854 /** 38855 * Merges wrapper props with special handling for classNames and styles. 38856 * 38857 * @param {Object} propsA 38858 * @param {Object} propsB 38859 * 38860 * @return {Object} Merged props. 38861 */ 38862 function mergeWrapperProps(propsA, propsB) { 38863 const newProps = { 38864 ...propsA, 38865 ...propsB 38866 }; 38867 38868 // May be set to undefined, so check if the property is set! 38869 if (propsA?.hasOwnProperty('className') && propsB?.hasOwnProperty('className')) { 38870 newProps.className = dist_clsx(propsA.className, propsB.className); 38871 } 38872 if (propsA?.hasOwnProperty('style') && propsB?.hasOwnProperty('style')) { 38873 newProps.style = { 38874 ...propsA.style, 38875 ...propsB.style 38876 }; 38877 } 38878 return newProps; 38879 } 38880 function Block({ 38881 children, 38882 isHtml, 38883 ...props 38884 }) { 38885 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 38886 ...use_block_props_useBlockProps(props, { 38887 __unstableIsHtml: isHtml 38888 }), 38889 children: children 38890 }); 38891 } 38892 function BlockListBlock({ 38893 block: { 38894 __unstableBlockSource 38895 }, 38896 mode, 38897 isLocked, 38898 canRemove, 38899 clientId, 38900 isSelected, 38901 isSelectionEnabled, 38902 className, 38903 __unstableLayoutClassNames: layoutClassNames, 38904 name, 38905 isValid, 38906 attributes, 38907 wrapperProps, 38908 setAttributes, 38909 onReplace, 38910 onInsertBlocksAfter, 38911 onMerge, 38912 toggleSelection 38913 }) { 38914 var _wrapperProps; 38915 const { 38916 mayDisplayControls, 38917 mayDisplayParentControls, 38918 themeSupportsLayout, 38919 ...context 38920 } = (0,external_wp_element_namespaceObject.useContext)(PrivateBlockContext); 38921 const { 38922 removeBlock 38923 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 38924 const onRemove = (0,external_wp_element_namespaceObject.useCallback)(() => removeBlock(clientId), [clientId, removeBlock]); 38925 const parentLayout = useLayout() || {}; 38926 38927 // We wrap the BlockEdit component in a div that hides it when editing in 38928 // HTML mode. This allows us to render all of the ancillary pieces 38929 // (InspectorControls, etc.) which are inside `BlockEdit` but not 38930 // `BlockHTML`, even in HTML mode. 38931 let blockEdit = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockEdit, { 38932 name: name, 38933 isSelected: isSelected, 38934 attributes: attributes, 38935 setAttributes: setAttributes, 38936 insertBlocksAfter: isLocked ? undefined : onInsertBlocksAfter, 38937 onReplace: canRemove ? onReplace : undefined, 38938 onRemove: canRemove ? onRemove : undefined, 38939 mergeBlocks: canRemove ? onMerge : undefined, 38940 clientId: clientId, 38941 isSelectionEnabled: isSelectionEnabled, 38942 toggleSelection: toggleSelection, 38943 __unstableLayoutClassNames: layoutClassNames, 38944 __unstableParentLayout: Object.keys(parentLayout).length ? parentLayout : undefined, 38945 mayDisplayControls: mayDisplayControls, 38946 mayDisplayParentControls: mayDisplayParentControls, 38947 blockEditingMode: context.blockEditingMode, 38948 isPreviewMode: context.isPreviewMode 38949 }); 38950 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(name); 38951 38952 // Determine whether the block has props to apply to the wrapper. 38953 if (blockType?.getEditWrapperProps) { 38954 wrapperProps = mergeWrapperProps(wrapperProps, blockType.getEditWrapperProps(attributes)); 38955 } 38956 const isAligned = wrapperProps && !!wrapperProps['data-align'] && !themeSupportsLayout; 38957 38958 // Support for sticky position in classic themes with alignment wrappers. 38959 38960 const isSticky = className?.includes('is-position-sticky'); 38961 38962 // For aligned blocks, provide a wrapper element so the block can be 38963 // positioned relative to the block column. 38964 // This is only kept for classic themes that don't support layout 38965 // Historically we used to rely on extra divs and data-align to 38966 // provide the alignments styles in the editor. 38967 // Due to the differences between frontend and backend, we migrated 38968 // to the layout feature, and we're now aligning the markup of frontend 38969 // and backend. 38970 if (isAligned) { 38971 blockEdit = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 38972 className: dist_clsx('wp-block', isSticky && className), 38973 "data-align": wrapperProps['data-align'], 38974 children: blockEdit 38975 }); 38976 } 38977 let block; 38978 if (!isValid) { 38979 const saveContent = __unstableBlockSource ? (0,external_wp_blocks_namespaceObject.serializeRawBlock)(__unstableBlockSource) : (0,external_wp_blocks_namespaceObject.getSaveContent)(blockType, attributes); 38980 block = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Block, { 38981 className: "has-warning", 38982 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockInvalidWarning, { 38983 clientId: clientId 38984 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_element_namespaceObject.RawHTML, { 38985 children: (0,external_wp_dom_namespaceObject.safeHTML)(saveContent) 38986 })] 38987 }); 38988 } else if (mode === 'html') { 38989 // Render blockEdit so the inspector controls don't disappear. 38990 // See #8969. 38991 block = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 38992 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 38993 style: { 38994 display: 'none' 38995 }, 38996 children: blockEdit 38997 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Block, { 38998 isHtml: true, 38999 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_html, { 39000 clientId: clientId 39001 }) 39002 })] 39003 }); 39004 } else if (blockType?.apiVersion > 1) { 39005 block = blockEdit; 39006 } else { 39007 block = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Block, { 39008 children: blockEdit 39009 }); 39010 } 39011 const { 39012 'data-align': dataAlign, 39013 ...restWrapperProps 39014 } = (_wrapperProps = wrapperProps) !== null && _wrapperProps !== void 0 ? _wrapperProps : {}; 39015 const updatedWrapperProps = { 39016 ...restWrapperProps, 39017 className: dist_clsx(restWrapperProps.className, dataAlign && themeSupportsLayout && `align$dataAlign}`, !(dataAlign && isSticky) && className) 39018 }; 39019 39020 // We set a new context with the adjusted and filtered wrapperProps (through 39021 // `editor.BlockListBlock`), which the `BlockListBlockProvider` did not have 39022 // access to. 39023 // Note that the context value doesn't have to be memoized in this case 39024 // because when it changes, this component will be re-rendered anyway, and 39025 // none of the consumers (BlockListBlock and useBlockProps) are memoized or 39026 // "pure". This is different from the public BlockEditContext, where 39027 // consumers might be memoized or "pure". 39028 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockContext.Provider, { 39029 value: { 39030 wrapperProps: updatedWrapperProps, 39031 isAligned, 39032 ...context 39033 }, 39034 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_crash_boundary, { 39035 fallback: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Block, { 39036 className: "has-warning", 39037 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_crash_warning, {}) 39038 }), 39039 children: block 39040 }) 39041 }); 39042 } 39043 const applyWithDispatch = (0,external_wp_data_namespaceObject.withDispatch)((dispatch, ownProps, registry) => { 39044 const { 39045 updateBlockAttributes, 39046 insertBlocks, 39047 mergeBlocks, 39048 replaceBlocks, 39049 toggleSelection, 39050 __unstableMarkLastChangeAsPersistent, 39051 moveBlocksToPosition, 39052 removeBlock, 39053 selectBlock 39054 } = dispatch(store); 39055 39056 // Do not add new properties here, use `useDispatch` instead to avoid 39057 // leaking new props to the public API (editor.BlockListBlock filter). 39058 return { 39059 setAttributes(newAttributes) { 39060 const { 39061 getMultiSelectedBlockClientIds 39062 } = registry.select(store); 39063 const multiSelectedBlockClientIds = getMultiSelectedBlockClientIds(); 39064 const { 39065 clientId 39066 } = ownProps; 39067 const clientIds = multiSelectedBlockClientIds.length ? multiSelectedBlockClientIds : [clientId]; 39068 updateBlockAttributes(clientIds, newAttributes); 39069 }, 39070 onInsertBlocks(blocks, index) { 39071 const { 39072 rootClientId 39073 } = ownProps; 39074 insertBlocks(blocks, index, rootClientId); 39075 }, 39076 onInsertBlocksAfter(blocks) { 39077 const { 39078 clientId, 39079 rootClientId 39080 } = ownProps; 39081 const { 39082 getBlockIndex 39083 } = registry.select(store); 39084 const index = getBlockIndex(clientId); 39085 insertBlocks(blocks, index + 1, rootClientId); 39086 }, 39087 onMerge(forward) { 39088 const { 39089 clientId, 39090 rootClientId 39091 } = ownProps; 39092 const { 39093 getPreviousBlockClientId, 39094 getNextBlockClientId, 39095 getBlock, 39096 getBlockAttributes, 39097 getBlockName, 39098 getBlockOrder, 39099 getBlockIndex, 39100 getBlockRootClientId, 39101 canInsertBlockType 39102 } = registry.select(store); 39103 function switchToDefaultOrRemove() { 39104 const block = getBlock(clientId); 39105 const defaultBlockName = (0,external_wp_blocks_namespaceObject.getDefaultBlockName)(); 39106 if (getBlockName(clientId) !== defaultBlockName) { 39107 const replacement = (0,external_wp_blocks_namespaceObject.switchToBlockType)(block, defaultBlockName); 39108 if (replacement && replacement.length) { 39109 replaceBlocks(clientId, replacement); 39110 } 39111 } else if ((0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(block)) { 39112 const nextBlockClientId = getNextBlockClientId(clientId); 39113 if (nextBlockClientId) { 39114 registry.batch(() => { 39115 removeBlock(clientId); 39116 selectBlock(nextBlockClientId); 39117 }); 39118 } 39119 } 39120 } 39121 39122 /** 39123 * Moves the block with clientId up one level. If the block type 39124 * cannot be inserted at the new location, it will be attempted to 39125 * convert to the default block type. 39126 * 39127 * @param {string} _clientId The block to move. 39128 * @param {boolean} changeSelection Whether to change the selection 39129 * to the moved block. 39130 */ 39131 function moveFirstItemUp(_clientId, changeSelection = true) { 39132 const targetRootClientId = getBlockRootClientId(_clientId); 39133 const blockOrder = getBlockOrder(_clientId); 39134 const [firstClientId] = blockOrder; 39135 if (blockOrder.length === 1 && (0,external_wp_blocks_namespaceObject.isUnmodifiedBlock)(getBlock(firstClientId))) { 39136 removeBlock(_clientId); 39137 } else { 39138 registry.batch(() => { 39139 const firstBlock = getBlock(firstClientId); 39140 const isFirstBlockContentUnmodified = isUnmodifiedBlockContent(firstBlock); 39141 const defaultBlockName = (0,external_wp_blocks_namespaceObject.getDefaultBlockName)(); 39142 const replacement = (0,external_wp_blocks_namespaceObject.switchToBlockType)(firstBlock, defaultBlockName); 39143 const canTransformToDefaultBlock = !!replacement?.length && replacement.every(block => canInsertBlockType(block.name, _clientId)); 39144 if (isFirstBlockContentUnmodified && canTransformToDefaultBlock) { 39145 // Step 1: If the block is empty and can be transformed to the default block type. 39146 replaceBlocks(firstClientId, replacement, changeSelection); 39147 } else if (isFirstBlockContentUnmodified && firstBlock.name === defaultBlockName) { 39148 // Step 2: If the block is empty and is already the default block type. 39149 removeBlock(firstClientId); 39150 const nextBlockClientId = getNextBlockClientId(clientId); 39151 if (nextBlockClientId) { 39152 selectBlock(nextBlockClientId); 39153 } 39154 } else if (canInsertBlockType(firstBlock.name, targetRootClientId)) { 39155 // Step 3: If the block can be moved up. 39156 moveBlocksToPosition([firstClientId], _clientId, targetRootClientId, getBlockIndex(_clientId)); 39157 } else { 39158 const canLiftAndTransformToDefaultBlock = !!replacement?.length && replacement.every(block => canInsertBlockType(block.name, targetRootClientId)); 39159 if (canLiftAndTransformToDefaultBlock) { 39160 // Step 4: If the block can be transformed to the default block type and moved up. 39161 insertBlocks(replacement, getBlockIndex(_clientId), targetRootClientId, changeSelection); 39162 removeBlock(firstClientId, false); 39163 } else { 39164 // Step 5: Continue the default behavior. 39165 switchToDefaultOrRemove(); 39166 } 39167 } 39168 if (!getBlockOrder(_clientId).length && (0,external_wp_blocks_namespaceObject.isUnmodifiedBlock)(getBlock(_clientId))) { 39169 removeBlock(_clientId, false); 39170 } 39171 }); 39172 } 39173 } 39174 39175 // For `Delete` or forward merge, we should do the exact same thing 39176 // as `Backspace`, but from the other block. 39177 if (forward) { 39178 if (rootClientId) { 39179 const nextRootClientId = getNextBlockClientId(rootClientId); 39180 if (nextRootClientId) { 39181 // If there is a block that follows with the same parent 39182 // block name and the same attributes, merge the inner 39183 // blocks. 39184 if (getBlockName(rootClientId) === getBlockName(nextRootClientId)) { 39185 const rootAttributes = getBlockAttributes(rootClientId); 39186 const previousRootAttributes = getBlockAttributes(nextRootClientId); 39187 if (Object.keys(rootAttributes).every(key => rootAttributes[key] === previousRootAttributes[key])) { 39188 registry.batch(() => { 39189 moveBlocksToPosition(getBlockOrder(nextRootClientId), nextRootClientId, rootClientId); 39190 removeBlock(nextRootClientId, false); 39191 }); 39192 return; 39193 } 39194 } else { 39195 mergeBlocks(rootClientId, nextRootClientId); 39196 return; 39197 } 39198 } 39199 } 39200 const nextBlockClientId = getNextBlockClientId(clientId); 39201 if (!nextBlockClientId) { 39202 return; 39203 } 39204 if (getBlockOrder(nextBlockClientId).length) { 39205 moveFirstItemUp(nextBlockClientId, false); 39206 } else { 39207 mergeBlocks(clientId, nextBlockClientId); 39208 } 39209 } else { 39210 const previousBlockClientId = getPreviousBlockClientId(clientId); 39211 if (previousBlockClientId) { 39212 mergeBlocks(previousBlockClientId, clientId); 39213 } else if (rootClientId) { 39214 const previousRootClientId = getPreviousBlockClientId(rootClientId); 39215 39216 // If there is a preceding block with the same parent block 39217 // name and the same attributes, merge the inner blocks. 39218 if (previousRootClientId && getBlockName(rootClientId) === getBlockName(previousRootClientId)) { 39219 const rootAttributes = getBlockAttributes(rootClientId); 39220 const previousRootAttributes = getBlockAttributes(previousRootClientId); 39221 if (Object.keys(rootAttributes).every(key => rootAttributes[key] === previousRootAttributes[key])) { 39222 registry.batch(() => { 39223 moveBlocksToPosition(getBlockOrder(rootClientId), rootClientId, previousRootClientId); 39224 removeBlock(rootClientId, false); 39225 }); 39226 return; 39227 } 39228 } 39229 moveFirstItemUp(rootClientId); 39230 } else { 39231 switchToDefaultOrRemove(); 39232 } 39233 } 39234 }, 39235 onReplace(blocks, indexToSelect, initialPosition) { 39236 if (blocks.length && !(0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(blocks[blocks.length - 1])) { 39237 __unstableMarkLastChangeAsPersistent(); 39238 } 39239 //Unsynced patterns are nested in an array so we need to flatten them. 39240 const replacementBlocks = blocks?.length === 1 && Array.isArray(blocks[0]) ? blocks[0] : blocks; 39241 replaceBlocks([ownProps.clientId], replacementBlocks, indexToSelect, initialPosition); 39242 }, 39243 toggleSelection(selectionEnabled) { 39244 toggleSelection(selectionEnabled); 39245 } 39246 }; 39247 }); 39248 39249 // This component is used by the BlockListBlockProvider component below. It will 39250 // add the props necessary for the `editor.BlockListBlock` filters. 39251 BlockListBlock = (0,external_wp_compose_namespaceObject.compose)(applyWithDispatch, (0,external_wp_components_namespaceObject.withFilters)('editor.BlockListBlock'))(BlockListBlock); 39252 39253 // This component provides all the information we need through a single store 39254 // subscription (useSelect mapping). Only the necessary props are passed down 39255 // to the BlockListBlock component, which is a filtered component, so these 39256 // props are public API. To avoid adding to the public API, we use a private 39257 // context to pass the rest of the information to the filtered BlockListBlock 39258 // component, and useBlockProps. 39259 function BlockListBlockProvider(props) { 39260 const { 39261 clientId, 39262 rootClientId 39263 } = props; 39264 const selectedProps = (0,external_wp_data_namespaceObject.useSelect)(select => { 39265 const { 39266 isBlockSelected, 39267 getBlockMode, 39268 isSelectionEnabled, 39269 getTemplateLock, 39270 getBlockWithoutAttributes, 39271 getBlockAttributes, 39272 canRemoveBlock, 39273 canMoveBlock, 39274 getSettings, 39275 getTemporarilyEditingAsBlocks, 39276 getBlockEditingMode, 39277 getBlockName, 39278 isFirstMultiSelectedBlock, 39279 getMultiSelectedBlockClientIds, 39280 hasSelectedInnerBlock, 39281 getBlocksByName, 39282 getBlockIndex, 39283 isBlockMultiSelected, 39284 isBlockSubtreeDisabled, 39285 isBlockHighlighted, 39286 __unstableIsFullySelected, 39287 __unstableSelectionHasUnmergeableBlock, 39288 isBlockBeingDragged, 39289 isDragging, 39290 hasBlockMovingClientId, 39291 canInsertBlockType, 39292 __unstableHasActiveBlockOverlayActive, 39293 __unstableGetEditorMode, 39294 getSelectedBlocksInitialCaretPosition 39295 } = unlock(select(store)); 39296 const blockWithoutAttributes = getBlockWithoutAttributes(clientId); 39297 39298 // This is a temporary fix. 39299 // This function should never be called when a block is not 39300 // present in the state. It happens now because the order in 39301 // withSelect rendering is not correct. 39302 if (!blockWithoutAttributes) { 39303 return; 39304 } 39305 const { 39306 hasBlockSupport: _hasBlockSupport, 39307 getActiveBlockVariation 39308 } = select(external_wp_blocks_namespaceObject.store); 39309 const attributes = getBlockAttributes(clientId); 39310 const { 39311 name: blockName, 39312 isValid 39313 } = blockWithoutAttributes; 39314 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockName); 39315 const { 39316 supportsLayout, 39317 __unstableIsPreviewMode: isPreviewMode 39318 } = getSettings(); 39319 const hasLightBlockWrapper = blockType?.apiVersion > 1; 39320 const previewContext = { 39321 isPreviewMode, 39322 blockWithoutAttributes, 39323 name: blockName, 39324 attributes, 39325 isValid, 39326 themeSupportsLayout: supportsLayout, 39327 index: getBlockIndex(clientId), 39328 isReusable: (0,external_wp_blocks_namespaceObject.isReusableBlock)(blockType), 39329 className: hasLightBlockWrapper ? attributes.className : undefined, 39330 defaultClassName: hasLightBlockWrapper ? (0,external_wp_blocks_namespaceObject.getBlockDefaultClassName)(blockName) : undefined, 39331 blockTitle: blockType?.title 39332 }; 39333 39334 // When in preview mode, we can avoid a lot of selection and 39335 // editing related selectors. 39336 if (isPreviewMode) { 39337 return previewContext; 39338 } 39339 const _isSelected = isBlockSelected(clientId); 39340 const canRemove = canRemoveBlock(clientId); 39341 const canMove = canMoveBlock(clientId); 39342 const match = getActiveBlockVariation(blockName, attributes); 39343 const isMultiSelected = isBlockMultiSelected(clientId); 39344 const checkDeep = true; 39345 const isAncestorOfSelectedBlock = hasSelectedInnerBlock(clientId, checkDeep); 39346 const movingClientId = hasBlockMovingClientId(); 39347 const blockEditingMode = getBlockEditingMode(clientId); 39348 const multiple = (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockName, 'multiple', true); 39349 39350 // For block types with `multiple` support, there is no "original 39351 // block" to be found in the content, as the block itself is valid. 39352 const blocksWithSameName = multiple ? [] : getBlocksByName(blockName); 39353 const isInvalid = blocksWithSameName.length && blocksWithSameName[0] !== clientId; 39354 const editorMode = __unstableGetEditorMode(); 39355 return { 39356 ...previewContext, 39357 mode: getBlockMode(clientId), 39358 isSelectionEnabled: isSelectionEnabled(), 39359 isLocked: !!getTemplateLock(rootClientId), 39360 templateLock: getTemplateLock(clientId), 39361 canRemove, 39362 canMove, 39363 isSelected: _isSelected, 39364 isTemporarilyEditingAsBlocks: getTemporarilyEditingAsBlocks() === clientId, 39365 blockEditingMode, 39366 mayDisplayControls: _isSelected || isFirstMultiSelectedBlock(clientId) && getMultiSelectedBlockClientIds().every(id => getBlockName(id) === blockName), 39367 mayDisplayParentControls: _hasBlockSupport(getBlockName(clientId), '__experimentalExposeControlsToChildren', false) && hasSelectedInnerBlock(clientId), 39368 blockApiVersion: blockType?.apiVersion || 1, 39369 blockTitle: match?.title || blockType?.title, 39370 isSubtreeDisabled: blockEditingMode === 'disabled' && isBlockSubtreeDisabled(clientId), 39371 hasOverlay: __unstableHasActiveBlockOverlayActive(clientId) && !isDragging(), 39372 initialPosition: _isSelected && (editorMode === 'edit' || editorMode === 'zoom-out') // Don't recalculate the initialPosition when toggling in/out of zoom-out mode 39373 ? getSelectedBlocksInitialCaretPosition() : undefined, 39374 isHighlighted: isBlockHighlighted(clientId), 39375 isMultiSelected, 39376 isPartiallySelected: isMultiSelected && !__unstableIsFullySelected() && !__unstableSelectionHasUnmergeableBlock(), 39377 isDragging: isBlockBeingDragged(clientId), 39378 hasChildSelected: isAncestorOfSelectedBlock, 39379 isBlockMovingMode: !!movingClientId, 39380 canInsertMovingBlock: movingClientId && canInsertBlockType(getBlockName(movingClientId), rootClientId), 39381 isEditingDisabled: blockEditingMode === 'disabled', 39382 hasEditableOutline: blockEditingMode !== 'disabled' && getBlockEditingMode(rootClientId) === 'disabled', 39383 originalBlockClientId: isInvalid ? blocksWithSameName[0] : false 39384 }; 39385 }, [clientId, rootClientId]); 39386 const { 39387 isPreviewMode, 39388 // Fill values that end up as a public API and may not be defined in 39389 // preview mode. 39390 mode = 'visual', 39391 isSelectionEnabled = false, 39392 isLocked = false, 39393 canRemove = false, 39394 canMove = false, 39395 blockWithoutAttributes, 39396 name, 39397 attributes, 39398 isValid, 39399 isSelected = false, 39400 themeSupportsLayout, 39401 isTemporarilyEditingAsBlocks, 39402 blockEditingMode, 39403 mayDisplayControls, 39404 mayDisplayParentControls, 39405 index, 39406 blockApiVersion, 39407 blockTitle, 39408 isSubtreeDisabled, 39409 hasOverlay, 39410 initialPosition, 39411 isHighlighted, 39412 isMultiSelected, 39413 isPartiallySelected, 39414 isReusable, 39415 isDragging, 39416 hasChildSelected, 39417 isBlockMovingMode, 39418 canInsertMovingBlock, 39419 templateLock, 39420 isEditingDisabled, 39421 hasEditableOutline, 39422 className, 39423 defaultClassName, 39424 originalBlockClientId 39425 } = selectedProps; 39426 39427 // Users of the editor.BlockListBlock filter used to be able to 39428 // access the block prop. 39429 // Ideally these blocks would rely on the clientId prop only. 39430 // This is kept for backward compatibility reasons. 39431 const block = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 39432 ...blockWithoutAttributes, 39433 attributes 39434 }), [blockWithoutAttributes, attributes]); 39435 39436 // Block is sometimes not mounted at the right time, causing it be 39437 // undefined see issue for more info 39438 // https://github.com/WordPress/gutenberg/issues/17013 39439 if (!selectedProps) { 39440 return null; 39441 } 39442 const privateContext = { 39443 isPreviewMode, 39444 clientId, 39445 className, 39446 index, 39447 mode, 39448 name, 39449 blockApiVersion, 39450 blockTitle, 39451 isSelected, 39452 isSubtreeDisabled, 39453 hasOverlay, 39454 initialPosition, 39455 blockEditingMode, 39456 isHighlighted, 39457 isMultiSelected, 39458 isPartiallySelected, 39459 isReusable, 39460 isDragging, 39461 hasChildSelected, 39462 isBlockMovingMode, 39463 canInsertMovingBlock, 39464 templateLock, 39465 isEditingDisabled, 39466 hasEditableOutline, 39467 isTemporarilyEditingAsBlocks, 39468 defaultClassName, 39469 mayDisplayControls, 39470 mayDisplayParentControls, 39471 originalBlockClientId, 39472 themeSupportsLayout 39473 }; 39474 39475 // Here we separate between the props passed to BlockListBlock and any other 39476 // information we selected for internal use. BlockListBlock is a filtered 39477 // component and thus ALL the props are PUBLIC API. 39478 39479 // Note that the context value doesn't have to be memoized in this case 39480 // because when it changes, this component will be re-rendered anyway, and 39481 // none of the consumers (BlockListBlock and useBlockProps) are memoized or 39482 // "pure". This is different from the public BlockEditContext, where 39483 // consumers might be memoized or "pure". 39484 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockContext.Provider, { 39485 value: privateContext, 39486 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockListBlock, { 39487 ...props, 39488 mode, 39489 isSelectionEnabled, 39490 isLocked, 39491 canRemove, 39492 canMove, 39493 // Users of the editor.BlockListBlock filter used to be able 39494 // to access the block prop. Ideally these blocks would rely 39495 // on the clientId prop only. This is kept for backward 39496 // compatibility reasons. 39497 block, 39498 name, 39499 attributes, 39500 isValid, 39501 isSelected 39502 }) 39503 }); 39504 } 39505 /* harmony default export */ const block = ((0,external_wp_element_namespaceObject.memo)(BlockListBlockProvider)); 39506 39507 ;// CONCATENATED MODULE: external ["wp","htmlEntities"] 39508 const external_wp_htmlEntities_namespaceObject = window["wp"]["htmlEntities"]; 39509 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/default-block-appender/index.js 39510 /** 39511 * External dependencies 39512 */ 39513 39514 39515 /** 39516 * WordPress dependencies 39517 */ 39518 39519 39520 39521 39522 39523 /** 39524 * Internal dependencies 39525 */ 39526 39527 39528 39529 /** 39530 * Zero width non-breaking space, used as padding for the paragraph when it is 39531 * empty. 39532 */ 39533 39534 39535 const ZWNBSP = '\ufeff'; 39536 function DefaultBlockAppender({ 39537 rootClientId 39538 }) { 39539 const { 39540 showPrompt, 39541 isLocked, 39542 placeholder, 39543 isManualGrid 39544 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 39545 const { 39546 getBlockCount, 39547 getSettings, 39548 getTemplateLock, 39549 getBlockAttributes 39550 } = select(store); 39551 const isEmpty = !getBlockCount(rootClientId); 39552 const { 39553 bodyPlaceholder 39554 } = getSettings(); 39555 return { 39556 showPrompt: isEmpty, 39557 isLocked: !!getTemplateLock(rootClientId), 39558 placeholder: bodyPlaceholder, 39559 isManualGrid: getBlockAttributes(rootClientId)?.layout?.isManualPlacement 39560 }; 39561 }, [rootClientId]); 39562 const { 39563 insertDefaultBlock, 39564 startTyping 39565 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 39566 if (isLocked || isManualGrid) { 39567 return null; 39568 } 39569 const value = (0,external_wp_htmlEntities_namespaceObject.decodeEntities)(placeholder) || (0,external_wp_i18n_namespaceObject.__)('Type / to choose a block'); 39570 const onAppend = () => { 39571 insertDefaultBlock(undefined, rootClientId); 39572 startTyping(); 39573 }; 39574 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 39575 "data-root-client-id": rootClientId || '', 39576 className: dist_clsx('block-editor-default-block-appender', { 39577 'has-visible-prompt': showPrompt 39578 }), 39579 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 39580 tabIndex: "0" 39581 // We want this element to be styled as a paragraph by themes. 39582 // eslint-disable-next-line jsx-a11y/no-noninteractive-element-to-interactive-role 39583 , 39584 role: "button", 39585 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Add default block') 39586 // A wrapping container for this one already has the wp-block className. 39587 , 39588 className: "block-editor-default-block-appender__content", 39589 onKeyDown: event => { 39590 if (external_wp_keycodes_namespaceObject.ENTER === event.keyCode || external_wp_keycodes_namespaceObject.SPACE === event.keyCode) { 39591 onAppend(); 39592 } 39593 }, 39594 onClick: () => onAppend(), 39595 onFocus: () => { 39596 if (showPrompt) { 39597 onAppend(); 39598 } 39599 }, 39600 children: showPrompt ? value : ZWNBSP 39601 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter, { 39602 rootClientId: rootClientId, 39603 position: "bottom right", 39604 isAppender: true, 39605 __experimentalIsQuick: true 39606 })] 39607 }); 39608 } 39609 39610 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list-appender/index.js 39611 /** 39612 * External dependencies 39613 */ 39614 39615 39616 /** 39617 * WordPress dependencies 39618 */ 39619 39620 39621 39622 /** 39623 * Internal dependencies 39624 */ 39625 39626 39627 39628 39629 function DefaultAppender({ 39630 rootClientId 39631 }) { 39632 const canInsertDefaultBlock = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).canInsertBlockType((0,external_wp_blocks_namespaceObject.getDefaultBlockName)(), rootClientId)); 39633 if (canInsertDefaultBlock) { 39634 // Render the default block appender if the context supports use 39635 // of the default appender. 39636 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DefaultBlockAppender, { 39637 rootClientId: rootClientId 39638 }); 39639 } 39640 39641 // Fallback in case the default block can't be inserted. 39642 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(button_block_appender, { 39643 rootClientId: rootClientId, 39644 className: "block-list-appender__toggle" 39645 }); 39646 } 39647 function BlockListAppender({ 39648 rootClientId, 39649 CustomAppender, 39650 className, 39651 tagName: TagName = 'div' 39652 }) { 39653 const isDragOver = (0,external_wp_data_namespaceObject.useSelect)(select => { 39654 const { 39655 getBlockInsertionPoint, 39656 isBlockInsertionPointVisible, 39657 getBlockCount 39658 } = select(store); 39659 const insertionPoint = getBlockInsertionPoint(); 39660 // Ideally we should also check for `isDragging` but currently it 39661 // requires a lot more setup. We can revisit this once we refactor 39662 // the DnD utility hooks. 39663 return isBlockInsertionPointVisible() && rootClientId === insertionPoint?.rootClientId && getBlockCount(rootClientId) === 0; 39664 }, [rootClientId]); 39665 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TagName 39666 // A `tabIndex` is used on the wrapping `div` element in order to 39667 // force a focus event to occur when an appender `button` element 39668 // is clicked. In some browsers (Firefox, Safari), button clicks do 39669 // not emit a focus event, which could cause this event to propagate 39670 // unexpectedly. The `tabIndex` ensures that the interaction is 39671 // captured as a focus, without also adding an extra tab stop. 39672 // 39673 // See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus 39674 , { 39675 tabIndex: -1, 39676 className: dist_clsx('block-list-appender wp-block', className, { 39677 'is-drag-over': isDragOver 39678 }) 39679 // Needed in case the whole editor is content editable (for multi 39680 // selection). It fixes an edge case where ArrowDown and ArrowRight 39681 // should collapse the selection to the end of that selection and 39682 // not into the appender. 39683 , 39684 contentEditable: false 39685 // The appender exists to let you add the first Paragraph before 39686 // any is inserted. To that end, this appender should visually be 39687 // presented as a block. That means theme CSS should style it as if 39688 // it were an empty paragraph block. That means a `wp-block` class to 39689 // ensure the width is correct, and a [data-block] attribute to ensure 39690 // the correct margin is applied, especially for classic themes which 39691 // have commonly targeted that attribute for margins. 39692 , 39693 "data-block": true, 39694 children: CustomAppender ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomAppender, {}) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DefaultAppender, { 39695 rootClientId: rootClientId 39696 }) 39697 }); 39698 } 39699 39700 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-popover/inbetween.js 39701 /** 39702 * External dependencies 39703 */ 39704 39705 39706 /** 39707 * WordPress dependencies 39708 */ 39709 39710 39711 39712 39713 39714 /** 39715 * Internal dependencies 39716 */ 39717 39718 39719 39720 39721 const inbetween_MAX_POPOVER_RECOMPUTE_COUNTER = Number.MAX_SAFE_INTEGER; 39722 const InsertionPointOpenRef = (0,external_wp_element_namespaceObject.createContext)(); 39723 function BlockPopoverInbetween({ 39724 previousClientId, 39725 nextClientId, 39726 children, 39727 __unstablePopoverSlot, 39728 __unstableContentRef, 39729 operation = 'insert', 39730 nearestSide = 'right', 39731 ...props 39732 }) { 39733 // This is a temporary hack to get the inbetween inserter to recompute properly. 39734 const [popoverRecomputeCounter, forcePopoverRecompute] = (0,external_wp_element_namespaceObject.useReducer)( 39735 // Module is there to make sure that the counter doesn't overflow. 39736 s => (s + 1) % inbetween_MAX_POPOVER_RECOMPUTE_COUNTER, 0); 39737 const { 39738 orientation, 39739 rootClientId, 39740 isVisible 39741 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 39742 const { 39743 getBlockListSettings, 39744 getBlockRootClientId, 39745 isBlockVisible 39746 } = select(store); 39747 const _rootClientId = getBlockRootClientId(previousClientId !== null && previousClientId !== void 0 ? previousClientId : nextClientId); 39748 return { 39749 orientation: getBlockListSettings(_rootClientId)?.orientation || 'vertical', 39750 rootClientId: _rootClientId, 39751 isVisible: isBlockVisible(previousClientId) && isBlockVisible(nextClientId) 39752 }; 39753 }, [previousClientId, nextClientId]); 39754 const previousElement = useBlockElement(previousClientId); 39755 const nextElement = useBlockElement(nextClientId); 39756 const isVertical = orientation === 'vertical'; 39757 const popoverAnchor = (0,external_wp_element_namespaceObject.useMemo)(() => { 39758 if ( 39759 // popoverRecomputeCounter is by definition always equal or greater than 0. 39760 // This check is only there to satisfy the correctness of the 39761 // exhaustive-deps rule for the `useMemo` hook. 39762 popoverRecomputeCounter < 0 || !previousElement && !nextElement || !isVisible) { 39763 return undefined; 39764 } 39765 const contextElement = operation === 'group' ? nextElement || previousElement : previousElement || nextElement; 39766 return { 39767 contextElement, 39768 getBoundingClientRect() { 39769 const previousRect = previousElement ? previousElement.getBoundingClientRect() : null; 39770 const nextRect = nextElement ? nextElement.getBoundingClientRect() : null; 39771 let left = 0; 39772 let top = 0; 39773 let width = 0; 39774 let height = 0; 39775 if (operation === 'group') { 39776 const targetRect = nextRect || previousRect; 39777 top = targetRect.top; 39778 // No spacing is likely around blocks in this operation. 39779 // So width of the inserter containing rect is set to 0. 39780 width = 0; 39781 height = targetRect.bottom - targetRect.top; 39782 // Popover calculates its distance from mid-block so some 39783 // adjustments are needed to make it appear in the right place. 39784 left = nearestSide === 'left' ? targetRect.left - 2 : targetRect.right - 2; 39785 } else if (isVertical) { 39786 // vertical 39787 top = previousRect ? previousRect.bottom : nextRect.top; 39788 width = previousRect ? previousRect.width : nextRect.width; 39789 height = nextRect && previousRect ? nextRect.top - previousRect.bottom : 0; 39790 left = previousRect ? previousRect.left : nextRect.left; 39791 } else { 39792 top = previousRect ? previousRect.top : nextRect.top; 39793 height = previousRect ? previousRect.height : nextRect.height; 39794 if ((0,external_wp_i18n_namespaceObject.isRTL)()) { 39795 // non vertical, rtl 39796 left = nextRect ? nextRect.right : previousRect.left; 39797 width = previousRect && nextRect ? previousRect.left - nextRect.right : 0; 39798 } else { 39799 // non vertical, ltr 39800 left = previousRect ? previousRect.right : nextRect.left; 39801 width = previousRect && nextRect ? nextRect.left - previousRect.right : 0; 39802 } 39803 } 39804 return new window.DOMRect(left, top, width, height); 39805 } 39806 }; 39807 }, [previousElement, nextElement, popoverRecomputeCounter, isVertical, isVisible, operation, nearestSide]); 39808 const popoverScrollRef = use_popover_scroll(__unstableContentRef); 39809 39810 // This is only needed for a smooth transition when moving blocks. 39811 // When blocks are moved up/down, their position can be set by 39812 // updating the `transform` property manually (i.e. without using CSS 39813 // transitions or animations). The animation, which can also scroll the block 39814 // editor, can sometimes cause the position of the Popover to get out of sync. 39815 // A MutationObserver is therefore used to make sure that changes to the 39816 // selectedElement's attribute (i.e. `transform`) can be tracked and used to 39817 // trigger the Popover to rerender. 39818 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 39819 if (!previousElement) { 39820 return; 39821 } 39822 const observer = new window.MutationObserver(forcePopoverRecompute); 39823 observer.observe(previousElement, { 39824 attributes: true 39825 }); 39826 return () => { 39827 observer.disconnect(); 39828 }; 39829 }, [previousElement]); 39830 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 39831 if (!nextElement) { 39832 return; 39833 } 39834 const observer = new window.MutationObserver(forcePopoverRecompute); 39835 observer.observe(nextElement, { 39836 attributes: true 39837 }); 39838 return () => { 39839 observer.disconnect(); 39840 }; 39841 }, [nextElement]); 39842 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 39843 if (!previousElement) { 39844 return; 39845 } 39846 previousElement.ownerDocument.defaultView.addEventListener('resize', forcePopoverRecompute); 39847 return () => { 39848 previousElement.ownerDocument.defaultView?.removeEventListener('resize', forcePopoverRecompute); 39849 }; 39850 }, [previousElement]); 39851 39852 // If there's either a previous or a next element, show the inbetween popover. 39853 // Note that drag and drop uses the inbetween popover to show the drop indicator 39854 // before the first block and after the last block. 39855 if (!previousElement && !nextElement || !isVisible) { 39856 return null; 39857 } 39858 39859 /* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */ 39860 // While ideally it would be enough to capture the 39861 // bubbling focus event from the Inserter, due to the 39862 // characteristics of click focusing of `button`s in 39863 // Firefox and Safari, it is not reliable. 39864 // 39865 // See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus 39866 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, { 39867 ref: popoverScrollRef, 39868 animate: false, 39869 anchor: popoverAnchor, 39870 focusOnMount: false 39871 // Render in the old slot if needed for backward compatibility, 39872 // otherwise render in place (not in the default popover slot). 39873 , 39874 __unstableSlotName: __unstablePopoverSlot, 39875 inline: !__unstablePopoverSlot 39876 // Forces a remount of the popover when its position changes 39877 // This makes sure the popover doesn't animate from its previous position. 39878 , 39879 ...props, 39880 className: dist_clsx('block-editor-block-popover', 'block-editor-block-popover__inbetween', props.className), 39881 resize: false, 39882 flip: false, 39883 placement: "overlay", 39884 variant: "unstyled", 39885 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 39886 className: "block-editor-block-popover__inbetween-container", 39887 children: children 39888 }) 39889 }, nextClientId + '--' + rootClientId); 39890 /* eslint-enable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */ 39891 } 39892 /* harmony default export */ const inbetween = (BlockPopoverInbetween); 39893 39894 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-popover/drop-zone.js 39895 /** 39896 * WordPress dependencies 39897 */ 39898 39899 39900 39901 39902 /** 39903 * Internal dependencies 39904 */ 39905 39906 39907 39908 const animateVariants = { 39909 hide: { 39910 opacity: 0, 39911 scaleY: 0.75 39912 }, 39913 show: { 39914 opacity: 1, 39915 scaleY: 1 39916 }, 39917 exit: { 39918 opacity: 0, 39919 scaleY: 0.9 39920 } 39921 }; 39922 function BlockDropZonePopover({ 39923 __unstablePopoverSlot, 39924 __unstableContentRef 39925 }) { 39926 const { 39927 clientId 39928 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 39929 const { 39930 getBlockOrder, 39931 getBlockInsertionPoint 39932 } = select(store); 39933 const insertionPoint = getBlockInsertionPoint(); 39934 const order = getBlockOrder(insertionPoint.rootClientId); 39935 if (!order.length) { 39936 return {}; 39937 } 39938 return { 39939 clientId: order[insertionPoint.index] 39940 }; 39941 }, []); 39942 const reducedMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); 39943 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cover, { 39944 clientId: clientId, 39945 __unstablePopoverSlot: __unstablePopoverSlot, 39946 __unstableContentRef: __unstableContentRef, 39947 className: "block-editor-block-popover__drop-zone", 39948 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__unstableMotion.div, { 39949 "data-testid": "block-popover-drop-zone", 39950 initial: reducedMotion ? animateVariants.show : animateVariants.hide, 39951 animate: animateVariants.show, 39952 exit: reducedMotion ? animateVariants.show : animateVariants.exit, 39953 className: "block-editor-block-popover__drop-zone-foreground" 39954 }) 39955 }); 39956 } 39957 /* harmony default export */ const drop_zone = (BlockDropZonePopover); 39958 39959 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/insertion-point.js 39960 /** 39961 * External dependencies 39962 */ 39963 39964 39965 /** 39966 * WordPress dependencies 39967 */ 39968 39969 39970 39971 39972 39973 /** 39974 * Internal dependencies 39975 */ 39976 39977 39978 39979 39980 39981 39982 const insertion_point_InsertionPointOpenRef = (0,external_wp_element_namespaceObject.createContext)(); 39983 function InbetweenInsertionPointPopover({ 39984 __unstablePopoverSlot, 39985 __unstableContentRef, 39986 operation = 'insert', 39987 nearestSide = 'right' 39988 }) { 39989 const { 39990 selectBlock, 39991 hideInsertionPoint 39992 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 39993 const openRef = (0,external_wp_element_namespaceObject.useContext)(insertion_point_InsertionPointOpenRef); 39994 const ref = (0,external_wp_element_namespaceObject.useRef)(); 39995 const { 39996 orientation, 39997 previousClientId, 39998 nextClientId, 39999 rootClientId, 40000 isInserterShown, 40001 isDistractionFree, 40002 isNavigationMode, 40003 isZoomOutMode 40004 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 40005 const { 40006 getBlockOrder, 40007 getBlockListSettings, 40008 getBlockInsertionPoint, 40009 isBlockBeingDragged, 40010 getPreviousBlockClientId, 40011 getNextBlockClientId, 40012 getSettings, 40013 isNavigationMode: _isNavigationMode, 40014 __unstableGetEditorMode 40015 } = select(store); 40016 const insertionPoint = getBlockInsertionPoint(); 40017 const order = getBlockOrder(insertionPoint.rootClientId); 40018 if (!order.length) { 40019 return {}; 40020 } 40021 let _previousClientId = order[insertionPoint.index - 1]; 40022 let _nextClientId = order[insertionPoint.index]; 40023 while (isBlockBeingDragged(_previousClientId)) { 40024 _previousClientId = getPreviousBlockClientId(_previousClientId); 40025 } 40026 while (isBlockBeingDragged(_nextClientId)) { 40027 _nextClientId = getNextBlockClientId(_nextClientId); 40028 } 40029 const settings = getSettings(); 40030 return { 40031 previousClientId: _previousClientId, 40032 nextClientId: _nextClientId, 40033 orientation: getBlockListSettings(insertionPoint.rootClientId)?.orientation || 'vertical', 40034 rootClientId: insertionPoint.rootClientId, 40035 isNavigationMode: _isNavigationMode(), 40036 isDistractionFree: settings.isDistractionFree, 40037 isInserterShown: insertionPoint?.__unstableWithInserter, 40038 isZoomOutMode: __unstableGetEditorMode() === 'zoom-out' 40039 }; 40040 }, []); 40041 const { 40042 getBlockEditingMode 40043 } = (0,external_wp_data_namespaceObject.useSelect)(store); 40044 const disableMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); 40045 function onClick(event) { 40046 if (event.target === ref.current && nextClientId && getBlockEditingMode(nextClientId) !== 'disabled') { 40047 selectBlock(nextClientId, -1); 40048 } 40049 } 40050 function maybeHideInserterPoint(event) { 40051 // Only hide the inserter if it's triggered on the wrapper, 40052 // and the inserter is not open. 40053 if (event.target === ref.current && !openRef.current) { 40054 hideInsertionPoint(); 40055 } 40056 } 40057 function onFocus(event) { 40058 // Only handle click on the wrapper specifically, and not an event 40059 // bubbled from the inserter itself. 40060 if (event.target !== ref.current) { 40061 openRef.current = true; 40062 } 40063 } 40064 const lineVariants = { 40065 // Initial position starts from the center and invisible. 40066 start: { 40067 opacity: 0, 40068 scale: 0 40069 }, 40070 // The line expands to fill the container. If the inserter is visible it 40071 // is delayed so it appears orchestrated. 40072 rest: { 40073 opacity: 1, 40074 scale: 1, 40075 transition: { 40076 delay: isInserterShown ? 0.5 : 0, 40077 type: 'tween' 40078 } 40079 }, 40080 hover: { 40081 opacity: 1, 40082 scale: 1, 40083 transition: { 40084 delay: 0.5, 40085 type: 'tween' 40086 } 40087 } 40088 }; 40089 const inserterVariants = { 40090 start: { 40091 scale: disableMotion ? 1 : 0 40092 }, 40093 rest: { 40094 scale: 1, 40095 transition: { 40096 delay: 0.4, 40097 type: 'tween' 40098 } 40099 } 40100 }; 40101 if (isDistractionFree && !isNavigationMode) { 40102 return null; 40103 } 40104 40105 // Zoom out mode should only show the insertion point for the insert operation. 40106 // Other operations such as "group" are when the editor tries to create a row 40107 // block by grouping the block being dragged with the block it's being dropped 40108 // onto. 40109 if (isZoomOutMode && operation !== 'insert') { 40110 return null; 40111 } 40112 const orientationClassname = orientation === 'horizontal' || operation === 'group' ? 'is-horizontal' : 'is-vertical'; 40113 const className = dist_clsx('block-editor-block-list__insertion-point', orientationClassname); 40114 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inbetween, { 40115 previousClientId: previousClientId, 40116 nextClientId: nextClientId, 40117 __unstablePopoverSlot: __unstablePopoverSlot, 40118 __unstableContentRef: __unstableContentRef, 40119 operation: operation, 40120 nearestSide: nearestSide, 40121 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__unstableMotion.div, { 40122 layout: !disableMotion, 40123 initial: disableMotion ? 'rest' : 'start', 40124 animate: "rest", 40125 whileHover: "hover", 40126 whileTap: "pressed", 40127 exit: "start", 40128 ref: ref, 40129 tabIndex: -1, 40130 onClick: onClick, 40131 onFocus: onFocus, 40132 className: dist_clsx(className, { 40133 'is-with-inserter': isInserterShown 40134 }), 40135 onHoverEnd: maybeHideInserterPoint, 40136 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__unstableMotion.div, { 40137 variants: lineVariants, 40138 className: "block-editor-block-list__insertion-point-indicator", 40139 "data-testid": "block-list-insertion-point-indicator" 40140 }), isInserterShown && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__unstableMotion.div, { 40141 variants: inserterVariants, 40142 className: dist_clsx('block-editor-block-list__insertion-point-inserter'), 40143 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter, { 40144 position: "bottom center", 40145 clientId: nextClientId, 40146 rootClientId: rootClientId, 40147 __experimentalIsQuick: true, 40148 onToggle: isOpen => { 40149 openRef.current = isOpen; 40150 }, 40151 onSelectOrClose: () => { 40152 openRef.current = false; 40153 } 40154 }) 40155 })] 40156 }) 40157 }); 40158 } 40159 function InsertionPoint(props) { 40160 const { 40161 insertionPoint, 40162 isVisible, 40163 isBlockListEmpty 40164 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 40165 const { 40166 getBlockInsertionPoint, 40167 isBlockInsertionPointVisible, 40168 getBlockCount 40169 } = select(store); 40170 const blockInsertionPoint = getBlockInsertionPoint(); 40171 return { 40172 insertionPoint: blockInsertionPoint, 40173 isVisible: isBlockInsertionPointVisible(), 40174 isBlockListEmpty: getBlockCount(blockInsertionPoint?.rootClientId) === 0 40175 }; 40176 }, []); 40177 if (!isVisible || 40178 // Don't render the insertion point if the block list is empty. 40179 // The insertion point will be represented by the appender instead. 40180 isBlockListEmpty) { 40181 return null; 40182 } 40183 40184 /** 40185 * Render a popover that overlays the block when the desired operation is to replace it. 40186 * Otherwise, render a popover in between blocks for the indication of inserting between them. 40187 */ 40188 return insertionPoint.operation === 'replace' ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(drop_zone 40189 // Force remount to trigger the animation. 40190 , { 40191 ...props 40192 }, `$insertionPoint.rootClientId}-$insertionPoint.index}`) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InbetweenInsertionPointPopover, { 40193 operation: insertionPoint.operation, 40194 nearestSide: insertionPoint.nearestSide, 40195 ...props 40196 }); 40197 } 40198 40199 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/use-in-between-inserter.js 40200 /** 40201 * WordPress dependencies 40202 */ 40203 40204 40205 40206 40207 40208 /** 40209 * Internal dependencies 40210 */ 40211 40212 40213 function useInBetweenInserter() { 40214 const openRef = (0,external_wp_element_namespaceObject.useContext)(insertion_point_InsertionPointOpenRef); 40215 const isInBetweenInserterDisabled = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getSettings().isDistractionFree || select(store).__unstableGetEditorMode() === 'zoom-out', []); 40216 const { 40217 getBlockListSettings, 40218 getBlockIndex, 40219 isMultiSelecting, 40220 getSelectedBlockClientIds, 40221 getSettings, 40222 getTemplateLock, 40223 __unstableIsWithinBlockOverlay, 40224 getBlockEditingMode, 40225 getBlockName, 40226 getBlockAttributes 40227 } = (0,external_wp_data_namespaceObject.useSelect)(store); 40228 const { 40229 showInsertionPoint, 40230 hideInsertionPoint 40231 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 40232 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 40233 if (isInBetweenInserterDisabled) { 40234 return; 40235 } 40236 function onMouseMove(event) { 40237 // openRef is the reference to the insertion point between blocks. 40238 // If the reference is not set or the insertion point is already open, return. 40239 if (openRef === undefined || openRef.current) { 40240 return; 40241 } 40242 40243 // Ignore text nodes sometimes detected in FireFox. 40244 if (event.target.nodeType === event.target.TEXT_NODE) { 40245 return; 40246 } 40247 if (isMultiSelecting()) { 40248 return; 40249 } 40250 if (!event.target.classList.contains('block-editor-block-list__layout')) { 40251 hideInsertionPoint(); 40252 return; 40253 } 40254 let rootClientId; 40255 if (!event.target.classList.contains('is-root-container')) { 40256 const blockElement = !!event.target.getAttribute('data-block') ? event.target : event.target.closest('[data-block]'); 40257 rootClientId = blockElement.getAttribute('data-block'); 40258 } 40259 if (getTemplateLock(rootClientId) || getBlockEditingMode(rootClientId) === 'disabled' || getBlockName(rootClientId) === 'core/block' || rootClientId && getBlockAttributes(rootClientId).layout?.isManualPlacement) { 40260 return; 40261 } 40262 const blockListSettings = getBlockListSettings(rootClientId); 40263 const orientation = blockListSettings?.orientation || 'vertical'; 40264 const captureToolbars = !!blockListSettings?.__experimentalCaptureToolbars; 40265 const offsetTop = event.clientY; 40266 const offsetLeft = event.clientX; 40267 const children = Array.from(event.target.children); 40268 let element = children.find(blockEl => { 40269 const blockElRect = blockEl.getBoundingClientRect(); 40270 return blockEl.classList.contains('wp-block') && orientation === 'vertical' && blockElRect.top > offsetTop || blockEl.classList.contains('wp-block') && orientation === 'horizontal' && ((0,external_wp_i18n_namespaceObject.isRTL)() ? blockElRect.right < offsetLeft : blockElRect.left > offsetLeft); 40271 }); 40272 if (!element) { 40273 hideInsertionPoint(); 40274 return; 40275 } 40276 40277 // The block may be in an alignment wrapper, so check the first direct 40278 // child if the element has no ID. 40279 if (!element.id) { 40280 element = element.firstElementChild; 40281 if (!element) { 40282 hideInsertionPoint(); 40283 return; 40284 } 40285 } 40286 40287 // Don't show the insertion point if a parent block has an "overlay" 40288 // See https://github.com/WordPress/gutenberg/pull/34012#pullrequestreview-727762337 40289 const clientId = element.id.slice('block-'.length); 40290 if (!clientId || __unstableIsWithinBlockOverlay(clientId)) { 40291 return; 40292 } 40293 40294 // Don't show the inserter if the following conditions are met, 40295 // as it conflicts with the block toolbar: 40296 // 1. when hovering above or inside selected block(s) 40297 // 2. when the orientation is vertical 40298 // 3. when the __experimentalCaptureToolbars is not enabled 40299 // 4. when the Top Toolbar is not disabled 40300 if (getSelectedBlockClientIds().includes(clientId) && orientation === 'vertical' && !captureToolbars && !getSettings().hasFixedToolbar) { 40301 return; 40302 } 40303 const elementRect = element.getBoundingClientRect(); 40304 if (orientation === 'horizontal' && (event.clientY > elementRect.bottom || event.clientY < elementRect.top) || orientation === 'vertical' && (event.clientX > elementRect.right || event.clientX < elementRect.left)) { 40305 hideInsertionPoint(); 40306 return; 40307 } 40308 const index = getBlockIndex(clientId); 40309 40310 // Don't show the in-between inserter before the first block in 40311 // the list (preserves the original behaviour). 40312 if (index === 0) { 40313 hideInsertionPoint(); 40314 return; 40315 } 40316 showInsertionPoint(rootClientId, index, { 40317 __unstableWithInserter: true 40318 }); 40319 } 40320 node.addEventListener('mousemove', onMouseMove); 40321 return () => { 40322 node.removeEventListener('mousemove', onMouseMove); 40323 }; 40324 }, [openRef, getBlockListSettings, getBlockIndex, isMultiSelecting, showInsertionPoint, hideInsertionPoint, getSelectedBlockClientIds, isInBetweenInserterDisabled]); 40325 } 40326 40327 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-selection-clearer/index.js 40328 /** 40329 * WordPress dependencies 40330 */ 40331 40332 40333 40334 /** 40335 * Internal dependencies 40336 */ 40337 40338 40339 /** 40340 * Pass the returned ref callback to an element that should clear block 40341 * selection. Selection will only be cleared if the element is clicked directly, 40342 * not if a child element is clicked. 40343 * 40344 * @return {import('react').RefCallback} Ref callback. 40345 */ 40346 40347 function useBlockSelectionClearer() { 40348 const { 40349 getSettings, 40350 hasSelectedBlock, 40351 hasMultiSelection 40352 } = (0,external_wp_data_namespaceObject.useSelect)(store); 40353 const { 40354 clearSelectedBlock 40355 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 40356 const { 40357 clearBlockSelection: isEnabled 40358 } = getSettings(); 40359 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 40360 if (!isEnabled) { 40361 return; 40362 } 40363 function onMouseDown(event) { 40364 if (!hasSelectedBlock() && !hasMultiSelection()) { 40365 return; 40366 } 40367 40368 // Only handle clicks on the element, not the children. 40369 if (event.target !== node) { 40370 return; 40371 } 40372 clearSelectedBlock(); 40373 } 40374 node.addEventListener('mousedown', onMouseDown); 40375 return () => { 40376 node.removeEventListener('mousedown', onMouseDown); 40377 }; 40378 }, [hasSelectedBlock, hasMultiSelection, clearSelectedBlock, isEnabled]); 40379 } 40380 function BlockSelectionClearer(props) { 40381 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 40382 ref: useBlockSelectionClearer(), 40383 ...props 40384 }); 40385 } 40386 40387 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inner-blocks/button-block-appender.js 40388 /** 40389 * External dependencies 40390 */ 40391 40392 40393 /** 40394 * Internal dependencies 40395 */ 40396 40397 40398 40399 function ButtonBlockAppender({ 40400 showSeparator, 40401 isFloating, 40402 onAddBlock, 40403 isToggle 40404 }) { 40405 const { 40406 clientId 40407 } = useBlockEditContext(); 40408 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(button_block_appender, { 40409 className: dist_clsx({ 40410 'block-list-appender__toggle': isToggle 40411 }), 40412 rootClientId: clientId, 40413 showSeparator: showSeparator, 40414 isFloating: isFloating, 40415 onAddBlock: onAddBlock 40416 }); 40417 } 40418 40419 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inner-blocks/default-block-appender.js 40420 /** 40421 * Internal dependencies 40422 */ 40423 40424 40425 40426 function default_block_appender_DefaultBlockAppender() { 40427 const { 40428 clientId 40429 } = useBlockEditContext(); 40430 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DefaultBlockAppender, { 40431 rootClientId: clientId 40432 }); 40433 } 40434 40435 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inner-blocks/use-nested-settings-update.js 40436 /** 40437 * WordPress dependencies 40438 */ 40439 40440 40441 40442 40443 40444 /** 40445 * Internal dependencies 40446 */ 40447 40448 40449 40450 /** @typedef {import('../../selectors').WPDirectInsertBlock } WPDirectInsertBlock */ 40451 40452 const pendingSettingsUpdates = new WeakMap(); 40453 function useShallowMemo(value) { 40454 const [prevValue, setPrevValue] = (0,external_wp_element_namespaceObject.useState)(value); 40455 if (!external_wp_isShallowEqual_default()(prevValue, value)) { 40456 setPrevValue(value); 40457 } 40458 return prevValue; 40459 } 40460 40461 /** 40462 * This hook is a side effect which updates the block-editor store when changes 40463 * happen to inner block settings. The given props are transformed into a 40464 * settings object, and if that is different from the current settings object in 40465 * the block-editor store, then the store is updated with the new settings which 40466 * came from props. 40467 * 40468 * @param {string} clientId The client ID of the block to update. 40469 * @param {string} parentLock 40470 * @param {string[]} allowedBlocks An array of block names which are permitted 40471 * in inner blocks. 40472 * @param {string[]} prioritizedInserterBlocks Block names and/or block variations to be prioritized in the inserter, in the format {blockName}/{variationName}. 40473 * @param {?WPDirectInsertBlock} defaultBlock The default block to insert: [ blockName, { blockAttributes } ]. 40474 * @param {?boolean} directInsert If a default block should be inserted directly by the appender. 40475 * 40476 * @param {?WPDirectInsertBlock} __experimentalDefaultBlock A deprecated prop for the default block to insert: [ blockName, { blockAttributes } ]. Use `defaultBlock` instead. 40477 * 40478 * @param {?boolean} __experimentalDirectInsert A deprecated prop for whether a default block should be inserted directly by the appender. Use `directInsert` instead. 40479 * 40480 * @param {string} [templateLock] The template lock specified for the inner 40481 * blocks component. (e.g. "all") 40482 * @param {boolean} captureToolbars Whether or children toolbars should be shown 40483 * in the inner blocks component rather than on 40484 * the child block. 40485 * @param {string} orientation The direction in which the block 40486 * should face. 40487 * @param {Object} layout The layout object for the block container. 40488 */ 40489 function useNestedSettingsUpdate(clientId, parentLock, allowedBlocks, prioritizedInserterBlocks, defaultBlock, directInsert, __experimentalDefaultBlock, __experimentalDirectInsert, templateLock, captureToolbars, orientation, layout) { 40490 // Instead of adding a useSelect mapping here, please add to the useSelect 40491 // mapping in InnerBlocks! Every subscription impacts performance. 40492 40493 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 40494 40495 // Implementors often pass a new array on every render, 40496 // and the contents of the arrays are just strings, so the entire array 40497 // can be passed as dependencies but We need to include the length of the array, 40498 // otherwise if the arrays change length but the first elements are equal the comparison, 40499 // does not works as expected. 40500 const _allowedBlocks = useShallowMemo(allowedBlocks); 40501 const _prioritizedInserterBlocks = (0,external_wp_element_namespaceObject.useMemo)(() => prioritizedInserterBlocks, 40502 // eslint-disable-next-line react-hooks/exhaustive-deps 40503 prioritizedInserterBlocks); 40504 const _templateLock = templateLock === undefined || parentLock === 'contentOnly' ? parentLock : templateLock; 40505 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 40506 const newSettings = { 40507 allowedBlocks: _allowedBlocks, 40508 prioritizedInserterBlocks: _prioritizedInserterBlocks, 40509 templateLock: _templateLock 40510 }; 40511 40512 // These values are not defined for RN, so only include them if they 40513 // are defined. 40514 if (captureToolbars !== undefined) { 40515 newSettings.__experimentalCaptureToolbars = captureToolbars; 40516 } 40517 40518 // Orientation depends on layout, 40519 // ideally the separate orientation prop should be deprecated. 40520 if (orientation !== undefined) { 40521 newSettings.orientation = orientation; 40522 } else { 40523 const layoutType = getLayoutType(layout?.type); 40524 newSettings.orientation = layoutType.getOrientation(layout); 40525 } 40526 if (__experimentalDefaultBlock !== undefined) { 40527 external_wp_deprecated_default()('__experimentalDefaultBlock', { 40528 alternative: 'defaultBlock', 40529 since: '6.3', 40530 version: '6.4' 40531 }); 40532 newSettings.defaultBlock = __experimentalDefaultBlock; 40533 } 40534 if (defaultBlock !== undefined) { 40535 newSettings.defaultBlock = defaultBlock; 40536 } 40537 if (__experimentalDirectInsert !== undefined) { 40538 external_wp_deprecated_default()('__experimentalDirectInsert', { 40539 alternative: 'directInsert', 40540 since: '6.3', 40541 version: '6.4' 40542 }); 40543 newSettings.directInsert = __experimentalDirectInsert; 40544 } 40545 if (directInsert !== undefined) { 40546 newSettings.directInsert = directInsert; 40547 } 40548 if (newSettings.directInsert !== undefined && typeof newSettings.directInsert !== 'boolean') { 40549 external_wp_deprecated_default()('Using `Function` as a `directInsert` argument', { 40550 alternative: '`boolean` values', 40551 since: '6.5' 40552 }); 40553 } 40554 40555 // Batch updates to block list settings to avoid triggering cascading renders 40556 // for each container block included in a tree and optimize initial render. 40557 // To avoid triggering updateBlockListSettings for each container block 40558 // causing X re-renderings for X container blocks, 40559 // we batch all the updatedBlockListSettings in a single "data" batch 40560 // which results in a single re-render. 40561 if (!pendingSettingsUpdates.get(registry)) { 40562 pendingSettingsUpdates.set(registry, {}); 40563 } 40564 pendingSettingsUpdates.get(registry)[clientId] = newSettings; 40565 window.queueMicrotask(() => { 40566 const settings = pendingSettingsUpdates.get(registry); 40567 if (Object.keys(settings).length) { 40568 const { 40569 updateBlockListSettings 40570 } = registry.dispatch(store); 40571 updateBlockListSettings(settings); 40572 pendingSettingsUpdates.set(registry, {}); 40573 } 40574 }); 40575 }, [clientId, _allowedBlocks, _prioritizedInserterBlocks, _templateLock, defaultBlock, directInsert, __experimentalDefaultBlock, __experimentalDirectInsert, captureToolbars, orientation, layout, registry]); 40576 } 40577 40578 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inner-blocks/use-inner-block-template-sync.js 40579 /** 40580 * External dependencies 40581 */ 40582 40583 40584 /** 40585 * WordPress dependencies 40586 */ 40587 40588 40589 40590 40591 /** 40592 * Internal dependencies 40593 */ 40594 40595 40596 /** 40597 * This hook makes sure that a block's inner blocks stay in sync with the given 40598 * block "template". The template is a block hierarchy to which inner blocks must 40599 * conform. If the blocks get "out of sync" with the template and the template 40600 * is meant to be locked (e.g. templateLock = "all" or templateLock = "contentOnly"), 40601 * then we replace the inner blocks with the correct value after synchronizing it with the template. 40602 * 40603 * @param {string} clientId The block client ID. 40604 * @param {Object} template The template to match. 40605 * @param {string} templateLock The template lock state for the inner blocks. For 40606 * example, if the template lock is set to "all", 40607 * then the inner blocks will stay in sync with the 40608 * template. If not defined or set to false, then 40609 * the inner blocks will not be synchronized with 40610 * the given template. 40611 * @param {boolean} templateInsertUpdatesSelection Whether or not to update the 40612 * block-editor selection state when inner blocks 40613 * are replaced after template synchronization. 40614 */ 40615 function useInnerBlockTemplateSync(clientId, template, templateLock, templateInsertUpdatesSelection) { 40616 // Instead of adding a useSelect mapping here, please add to the useSelect 40617 // mapping in InnerBlocks! Every subscription impacts performance. 40618 40619 const { 40620 getBlocks, 40621 getSelectedBlocksInitialCaretPosition, 40622 isBlockSelected 40623 } = (0,external_wp_data_namespaceObject.useSelect)(store); 40624 const { 40625 replaceInnerBlocks, 40626 __unstableMarkNextChangeAsNotPersistent 40627 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 40628 40629 // Maintain a reference to the previous value so we can do a deep equality check. 40630 const existingTemplateRef = (0,external_wp_element_namespaceObject.useRef)(null); 40631 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 40632 let isCancelled = false; 40633 40634 // There's an implicit dependency between useInnerBlockTemplateSync and useNestedSettingsUpdate 40635 // The former needs to happen after the latter and since the latter is using microtasks to batch updates (performance optimization), 40636 // we need to schedule this one in a microtask as well. 40637 // Example: If you remove queueMicrotask here, ctrl + click to insert quote block won't close the inserter. 40638 window.queueMicrotask(() => { 40639 if (isCancelled) { 40640 return; 40641 } 40642 40643 // Only synchronize innerBlocks with template if innerBlocks are empty 40644 // or a locking "all" or "contentOnly" exists directly on the block. 40645 const currentInnerBlocks = getBlocks(clientId); 40646 const shouldApplyTemplate = currentInnerBlocks.length === 0 || templateLock === 'all' || templateLock === 'contentOnly'; 40647 const hasTemplateChanged = !es6_default()(template, existingTemplateRef.current); 40648 if (!shouldApplyTemplate || !hasTemplateChanged) { 40649 return; 40650 } 40651 existingTemplateRef.current = template; 40652 const nextBlocks = (0,external_wp_blocks_namespaceObject.synchronizeBlocksWithTemplate)(currentInnerBlocks, template); 40653 if (!es6_default()(nextBlocks, currentInnerBlocks)) { 40654 __unstableMarkNextChangeAsNotPersistent(); 40655 replaceInnerBlocks(clientId, nextBlocks, currentInnerBlocks.length === 0 && templateInsertUpdatesSelection && nextBlocks.length !== 0 && isBlockSelected(clientId), 40656 // This ensures the "initialPosition" doesn't change when applying the template 40657 // If we're supposed to focus the block, we'll focus the first inner block 40658 // otherwise, we won't apply any auto-focus. 40659 // This ensures for instance that the focus stays in the inserter when inserting the "buttons" block. 40660 getSelectedBlocksInitialCaretPosition()); 40661 } 40662 }); 40663 return () => { 40664 isCancelled = true; 40665 }; 40666 }, [template, templateLock, clientId]); 40667 } 40668 40669 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inner-blocks/use-block-context.js 40670 /** 40671 * WordPress dependencies 40672 */ 40673 40674 40675 40676 /** 40677 * Internal dependencies 40678 */ 40679 40680 40681 /** 40682 * Returns a context object for a given block. 40683 * 40684 * @param {string} clientId The block client ID. 40685 * 40686 * @return {Record<string,*>} Context value. 40687 */ 40688 function useBlockContext(clientId) { 40689 return (0,external_wp_data_namespaceObject.useSelect)(select => { 40690 const block = select(store).getBlock(clientId); 40691 if (!block) { 40692 return undefined; 40693 } 40694 const blockType = select(external_wp_blocks_namespaceObject.store).getBlockType(block.name); 40695 if (!blockType) { 40696 return undefined; 40697 } 40698 if (Object.keys(blockType.providesContext).length === 0) { 40699 return undefined; 40700 } 40701 return Object.fromEntries(Object.entries(blockType.providesContext).map(([contextName, attributeName]) => [contextName, block.attributes[attributeName]])); 40702 }, [clientId]); 40703 } 40704 40705 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-on-block-drop/index.js 40706 /** 40707 * WordPress dependencies 40708 */ 40709 40710 40711 40712 40713 40714 /** 40715 * Internal dependencies 40716 */ 40717 40718 40719 /** @typedef {import('react').SyntheticEvent} SyntheticEvent */ 40720 /** @typedef {import('./types').WPDropOperation} WPDropOperation */ 40721 40722 /** 40723 * Retrieve the data for a block drop event. 40724 * 40725 * @param {SyntheticEvent} event The drop event. 40726 * 40727 * @return {Object} An object with block drag and drop data. 40728 */ 40729 function parseDropEvent(event) { 40730 let result = { 40731 srcRootClientId: null, 40732 srcClientIds: null, 40733 srcIndex: null, 40734 type: null, 40735 blocks: null 40736 }; 40737 if (!event.dataTransfer) { 40738 return result; 40739 } 40740 try { 40741 result = Object.assign(result, JSON.parse(event.dataTransfer.getData('wp-blocks'))); 40742 } catch (err) { 40743 return result; 40744 } 40745 return result; 40746 } 40747 40748 /** 40749 * A function that returns an event handler function for block drop events. 40750 * 40751 * @param {string} targetRootClientId The root client id where the block(s) will be inserted. 40752 * @param {number} targetBlockIndex The index where the block(s) will be inserted. 40753 * @param {Function} getBlockIndex A function that gets the index of a block. 40754 * @param {Function} getClientIdsOfDescendants A function that gets the client ids of descendant blocks. 40755 * @param {Function} moveBlocks A function that moves blocks. 40756 * @param {Function} insertOrReplaceBlocks A function that inserts or replaces blocks. 40757 * @param {Function} clearSelectedBlock A function that clears block selection. 40758 * @param {string} operation The type of operation to perform on drop. Could be `insert` or `replace` or `group`. 40759 * @param {Function} getBlock A function that returns a block given its client id. 40760 * @return {Function} The event handler for a block drop event. 40761 */ 40762 function onBlockDrop(targetRootClientId, targetBlockIndex, getBlockIndex, getClientIdsOfDescendants, moveBlocks, insertOrReplaceBlocks, clearSelectedBlock, operation, getBlock) { 40763 return event => { 40764 const { 40765 srcRootClientId: sourceRootClientId, 40766 srcClientIds: sourceClientIds, 40767 type: dropType, 40768 blocks 40769 } = parseDropEvent(event); 40770 40771 // If the user is inserting a block. 40772 if (dropType === 'inserter') { 40773 clearSelectedBlock(); 40774 const blocksToInsert = blocks.map(block => (0,external_wp_blocks_namespaceObject.cloneBlock)(block)); 40775 insertOrReplaceBlocks(blocksToInsert, true, null); 40776 } 40777 40778 // If the user is moving a block. 40779 if (dropType === 'block') { 40780 const sourceBlockIndex = getBlockIndex(sourceClientIds[0]); 40781 40782 // If the user is dropping to the same position, return early. 40783 if (sourceRootClientId === targetRootClientId && sourceBlockIndex === targetBlockIndex) { 40784 return; 40785 } 40786 40787 // If the user is attempting to drop a block within its own 40788 // nested blocks, return early as this would create infinite 40789 // recursion. 40790 if (sourceClientIds.includes(targetRootClientId) || getClientIdsOfDescendants(sourceClientIds).some(id => id === targetRootClientId)) { 40791 return; 40792 } 40793 40794 // If the user is dropping a block over another block, replace both blocks 40795 // with a group block containing them 40796 if (operation === 'group') { 40797 const blocksToInsert = sourceClientIds.map(clientId => getBlock(clientId)); 40798 insertOrReplaceBlocks(blocksToInsert, true, null, sourceClientIds); 40799 return; 40800 } 40801 const isAtSameLevel = sourceRootClientId === targetRootClientId; 40802 const draggedBlockCount = sourceClientIds.length; 40803 40804 // If the block is kept at the same level and moved downwards, 40805 // subtract to take into account that the blocks being dragged 40806 // were removed from the block list above the insertion point. 40807 const insertIndex = isAtSameLevel && sourceBlockIndex < targetBlockIndex ? targetBlockIndex - draggedBlockCount : targetBlockIndex; 40808 moveBlocks(sourceClientIds, sourceRootClientId, insertIndex); 40809 } 40810 }; 40811 } 40812 40813 /** 40814 * A function that returns an event handler function for block-related file drop events. 40815 * 40816 * @param {string} targetRootClientId The root client id where the block(s) will be inserted. 40817 * @param {Function} getSettings A function that gets the block editor settings. 40818 * @param {Function} updateBlockAttributes A function that updates a block's attributes. 40819 * @param {Function} canInsertBlockType A function that returns checks whether a block type can be inserted. 40820 * @param {Function} insertOrReplaceBlocks A function that inserts or replaces blocks. 40821 * 40822 * @return {Function} The event handler for a block-related file drop event. 40823 */ 40824 function onFilesDrop(targetRootClientId, getSettings, updateBlockAttributes, canInsertBlockType, insertOrReplaceBlocks) { 40825 return files => { 40826 if (!getSettings().mediaUpload) { 40827 return; 40828 } 40829 const transformation = (0,external_wp_blocks_namespaceObject.findTransform)((0,external_wp_blocks_namespaceObject.getBlockTransforms)('from'), transform => transform.type === 'files' && canInsertBlockType(transform.blockName, targetRootClientId) && transform.isMatch(files)); 40830 if (transformation) { 40831 const blocks = transformation.transform(files, updateBlockAttributes); 40832 insertOrReplaceBlocks(blocks); 40833 } 40834 }; 40835 } 40836 40837 /** 40838 * A function that returns an event handler function for block-related HTML drop events. 40839 * 40840 * @param {Function} insertOrReplaceBlocks A function that inserts or replaces blocks. 40841 * 40842 * @return {Function} The event handler for a block-related HTML drop event. 40843 */ 40844 function onHTMLDrop(insertOrReplaceBlocks) { 40845 return HTML => { 40846 const blocks = (0,external_wp_blocks_namespaceObject.pasteHandler)({ 40847 HTML, 40848 mode: 'BLOCKS' 40849 }); 40850 if (blocks.length) { 40851 insertOrReplaceBlocks(blocks); 40852 } 40853 }; 40854 } 40855 40856 /** 40857 * A React hook for handling block drop events. 40858 * 40859 * @param {string} targetRootClientId The root client id where the block(s) will be inserted. 40860 * @param {number} targetBlockIndex The index where the block(s) will be inserted. 40861 * @param {Object} options The optional options. 40862 * @param {WPDropOperation} [options.operation] The type of operation to perform on drop. Could be `insert` or `replace` for now. 40863 * 40864 * @return {Function} A function to be passed to the onDrop handler. 40865 */ 40866 function useOnBlockDrop(targetRootClientId, targetBlockIndex, options = {}) { 40867 const { 40868 operation = 'insert', 40869 nearestSide = 'right' 40870 } = options; 40871 const { 40872 canInsertBlockType, 40873 getBlockIndex, 40874 getClientIdsOfDescendants, 40875 getBlockOrder, 40876 getBlocksByClientId, 40877 getSettings, 40878 getBlock 40879 } = (0,external_wp_data_namespaceObject.useSelect)(store); 40880 const { 40881 getGroupingBlockName 40882 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 40883 const { 40884 insertBlocks, 40885 moveBlocksToPosition, 40886 updateBlockAttributes, 40887 clearSelectedBlock, 40888 replaceBlocks, 40889 removeBlocks 40890 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 40891 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 40892 const insertOrReplaceBlocks = (0,external_wp_element_namespaceObject.useCallback)((blocks, updateSelection = true, initialPosition = 0, clientIdsToReplace = []) => { 40893 if (!Array.isArray(blocks)) { 40894 blocks = [blocks]; 40895 } 40896 const clientIds = getBlockOrder(targetRootClientId); 40897 const clientId = clientIds[targetBlockIndex]; 40898 if (operation === 'replace') { 40899 replaceBlocks(clientId, blocks, undefined, initialPosition); 40900 } else if (operation === 'group') { 40901 const targetBlock = getBlock(clientId); 40902 if (nearestSide === 'left') { 40903 blocks.push(targetBlock); 40904 } else { 40905 blocks.unshift(targetBlock); 40906 } 40907 const groupInnerBlocks = blocks.map(block => { 40908 return (0,external_wp_blocks_namespaceObject.createBlock)(block.name, block.attributes, block.innerBlocks); 40909 }); 40910 const areAllImages = blocks.every(block => { 40911 return block.name === 'core/image'; 40912 }); 40913 const galleryBlock = canInsertBlockType('core/gallery', targetRootClientId); 40914 const wrappedBlocks = (0,external_wp_blocks_namespaceObject.createBlock)(areAllImages && galleryBlock ? 'core/gallery' : getGroupingBlockName(), { 40915 layout: { 40916 type: 'flex', 40917 flexWrap: areAllImages && galleryBlock ? null : 'nowrap' 40918 } 40919 }, groupInnerBlocks); 40920 // Need to make sure both the target block and the block being dragged are replaced 40921 // otherwise the dragged block will be duplicated. 40922 replaceBlocks([clientId, ...clientIdsToReplace], wrappedBlocks, undefined, initialPosition); 40923 } else { 40924 insertBlocks(blocks, targetBlockIndex, targetRootClientId, updateSelection, initialPosition); 40925 } 40926 }, [getBlockOrder, targetRootClientId, targetBlockIndex, operation, replaceBlocks, getBlock, nearestSide, canInsertBlockType, getGroupingBlockName, insertBlocks]); 40927 const moveBlocks = (0,external_wp_element_namespaceObject.useCallback)((sourceClientIds, sourceRootClientId, insertIndex) => { 40928 if (operation === 'replace') { 40929 const sourceBlocks = getBlocksByClientId(sourceClientIds); 40930 const targetBlockClientIds = getBlockOrder(targetRootClientId); 40931 const targetBlockClientId = targetBlockClientIds[targetBlockIndex]; 40932 registry.batch(() => { 40933 // Remove the source blocks. 40934 removeBlocks(sourceClientIds, false); 40935 // Replace the target block with the source blocks. 40936 replaceBlocks(targetBlockClientId, sourceBlocks, undefined, 0); 40937 }); 40938 } else { 40939 moveBlocksToPosition(sourceClientIds, sourceRootClientId, targetRootClientId, insertIndex); 40940 } 40941 }, [operation, getBlockOrder, getBlocksByClientId, moveBlocksToPosition, registry, removeBlocks, replaceBlocks, targetBlockIndex, targetRootClientId]); 40942 const _onDrop = onBlockDrop(targetRootClientId, targetBlockIndex, getBlockIndex, getClientIdsOfDescendants, moveBlocks, insertOrReplaceBlocks, clearSelectedBlock, operation, getBlock); 40943 const _onFilesDrop = onFilesDrop(targetRootClientId, getSettings, updateBlockAttributes, canInsertBlockType, insertOrReplaceBlocks); 40944 const _onHTMLDrop = onHTMLDrop(insertOrReplaceBlocks); 40945 return event => { 40946 const files = (0,external_wp_dom_namespaceObject.getFilesFromDataTransfer)(event.dataTransfer); 40947 const html = event.dataTransfer.getData('text/html'); 40948 40949 /** 40950 * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML. 40951 * The order of the checks is important to recognise the HTML drop. 40952 */ 40953 if (html) { 40954 _onHTMLDrop(html); 40955 } else if (files.length) { 40956 _onFilesDrop(files); 40957 } else { 40958 _onDrop(event); 40959 } 40960 }; 40961 } 40962 40963 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/math.js 40964 /** 40965 * A string representing the name of an edge. 40966 * 40967 * @typedef {'top'|'right'|'bottom'|'left'} WPEdgeName 40968 */ 40969 40970 /** 40971 * @typedef {Object} WPPoint 40972 * @property {number} x The horizontal position. 40973 * @property {number} y The vertical position. 40974 */ 40975 40976 /** 40977 * Given a point, a DOMRect and the name of an edge, returns the distance to 40978 * that edge of the rect. 40979 * 40980 * This function works for edges that are horizontal or vertical (e.g. not 40981 * rotated), the following terms are used so that the function works in both 40982 * orientations: 40983 * 40984 * - Forward, meaning the axis running horizontally when an edge is vertical 40985 * and vertically when an edge is horizontal. 40986 * - Lateral, meaning the axis running vertically when an edge is vertical 40987 * and horizontally when an edge is horizontal. 40988 * 40989 * @param {WPPoint} point The point to measure distance from. 40990 * @param {DOMRect} rect A DOM Rect containing edge positions. 40991 * @param {WPEdgeName} edge The edge to measure to. 40992 */ 40993 function getDistanceFromPointToEdge(point, rect, edge) { 40994 const isHorizontal = edge === 'top' || edge === 'bottom'; 40995 const { 40996 x, 40997 y 40998 } = point; 40999 const pointLateralPosition = isHorizontal ? x : y; 41000 const pointForwardPosition = isHorizontal ? y : x; 41001 const edgeStart = isHorizontal ? rect.left : rect.top; 41002 const edgeEnd = isHorizontal ? rect.right : rect.bottom; 41003 const edgeForwardPosition = rect[edge]; 41004 41005 // Measure the straight line distance to the edge of the rect, when the 41006 // point is adjacent to the edge. 41007 // Else, if the point is positioned diagonally to the edge of the rect, 41008 // measure diagonally to the nearest corner that the edge meets. 41009 let edgeLateralPosition; 41010 if (pointLateralPosition >= edgeStart && pointLateralPosition <= edgeEnd) { 41011 edgeLateralPosition = pointLateralPosition; 41012 } else if (pointLateralPosition < edgeEnd) { 41013 edgeLateralPosition = edgeStart; 41014 } else { 41015 edgeLateralPosition = edgeEnd; 41016 } 41017 return Math.sqrt((pointLateralPosition - edgeLateralPosition) ** 2 + (pointForwardPosition - edgeForwardPosition) ** 2); 41018 } 41019 41020 /** 41021 * Given a point, a DOMRect and a list of allowed edges returns the name of and 41022 * distance to the nearest edge. 41023 * 41024 * @param {WPPoint} point The point to measure distance from. 41025 * @param {DOMRect} rect A DOM Rect containing edge positions. 41026 * @param {WPEdgeName[]} allowedEdges A list of the edges included in the 41027 * calculation. Defaults to all edges. 41028 * 41029 * @return {[number, string]} An array where the first value is the distance 41030 * and a second is the edge name. 41031 */ 41032 function getDistanceToNearestEdge(point, rect, allowedEdges = ['top', 'bottom', 'left', 'right']) { 41033 let candidateDistance; 41034 let candidateEdge; 41035 allowedEdges.forEach(edge => { 41036 const distance = getDistanceFromPointToEdge(point, rect, edge); 41037 if (candidateDistance === undefined || distance < candidateDistance) { 41038 candidateDistance = distance; 41039 candidateEdge = edge; 41040 } 41041 }); 41042 return [candidateDistance, candidateEdge]; 41043 } 41044 41045 /** 41046 * Is the point contained by the rectangle. 41047 * 41048 * @param {WPPoint} point The point. 41049 * @param {DOMRect} rect The rectangle. 41050 * 41051 * @return {boolean} True if the point is contained by the rectangle, false otherwise. 41052 */ 41053 function isPointContainedByRect(point, rect) { 41054 return rect.left <= point.x && rect.right >= point.x && rect.top <= point.y && rect.bottom >= point.y; 41055 } 41056 41057 /** 41058 * Is the point within the top and bottom boundaries of the rectangle. 41059 * 41060 * @param {WPPoint} point The point. 41061 * @param {DOMRect} rect The rectangle. 41062 * 41063 * @return {boolean} True if the point is within top and bottom of rectangle, false otherwise. 41064 */ 41065 function isPointWithinTopAndBottomBoundariesOfRect(point, rect) { 41066 return rect.top <= point.y && rect.bottom >= point.y; 41067 } 41068 41069 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-block-drop-zone/index.js 41070 /** 41071 * WordPress dependencies 41072 */ 41073 41074 41075 41076 41077 41078 41079 /** 41080 * Internal dependencies 41081 */ 41082 41083 41084 41085 41086 const THRESHOLD_DISTANCE = 30; 41087 const MINIMUM_HEIGHT_FOR_THRESHOLD = 120; 41088 const MINIMUM_WIDTH_FOR_THRESHOLD = 120; 41089 41090 /** @typedef {import('../../utils/math').WPPoint} WPPoint */ 41091 /** @typedef {import('../use-on-block-drop/types').WPDropOperation} WPDropOperation */ 41092 41093 /** 41094 * The orientation of a block list. 41095 * 41096 * @typedef {'horizontal'|'vertical'|undefined} WPBlockListOrientation 41097 */ 41098 41099 /** 41100 * The insert position when dropping a block. 41101 * 41102 * @typedef {'before'|'after'} WPInsertPosition 41103 */ 41104 41105 /** 41106 * @typedef {Object} WPBlockData 41107 * @property {boolean} isUnmodifiedDefaultBlock Is the block unmodified default block. 41108 * @property {() => DOMRect} getBoundingClientRect Get the bounding client rect of the block. 41109 * @property {number} blockIndex The index of the block. 41110 */ 41111 41112 /** 41113 * Get the drop target position from a given drop point and the orientation. 41114 * 41115 * @param {WPBlockData[]} blocksData The block data list. 41116 * @param {WPPoint} position The position of the item being dragged. 41117 * @param {WPBlockListOrientation} orientation The orientation of the block list. 41118 * @param {Object} options Additional options. 41119 * @return {[number, WPDropOperation]} The drop target position. 41120 */ 41121 function getDropTargetPosition(blocksData, position, orientation = 'vertical', options = {}) { 41122 const allowedEdges = orientation === 'horizontal' ? ['left', 'right'] : ['top', 'bottom']; 41123 let nearestIndex = 0; 41124 let insertPosition = 'before'; 41125 let minDistance = Infinity; 41126 let targetBlockIndex = null; 41127 let nearestSide = 'right'; 41128 const { 41129 dropZoneElement, 41130 parentBlockOrientation, 41131 rootBlockIndex = 0 41132 } = options; 41133 41134 // Allow before/after when dragging over the top/bottom edges of the drop zone. 41135 if (dropZoneElement && parentBlockOrientation !== 'horizontal') { 41136 const rect = dropZoneElement.getBoundingClientRect(); 41137 const [distance, edge] = getDistanceToNearestEdge(position, rect, ['top', 'bottom']); 41138 41139 // If dragging over the top or bottom of the drop zone, insert the block 41140 // before or after the parent block. This only applies to blocks that use 41141 // a drop zone element, typically container blocks such as Group or Cover. 41142 if (rect.height > MINIMUM_HEIGHT_FOR_THRESHOLD && distance < THRESHOLD_DISTANCE) { 41143 if (edge === 'top') { 41144 return [rootBlockIndex, 'before']; 41145 } 41146 if (edge === 'bottom') { 41147 return [rootBlockIndex + 1, 'after']; 41148 } 41149 } 41150 } 41151 const isRightToLeft = (0,external_wp_i18n_namespaceObject.isRTL)(); 41152 41153 // Allow before/after when dragging over the left/right edges of the drop zone. 41154 if (dropZoneElement && parentBlockOrientation === 'horizontal') { 41155 const rect = dropZoneElement.getBoundingClientRect(); 41156 const [distance, edge] = getDistanceToNearestEdge(position, rect, ['left', 'right']); 41157 41158 // If dragging over the left or right of the drop zone, insert the block 41159 // before or after the parent block. This only applies to blocks that use 41160 // a drop zone element, typically container blocks such as Group. 41161 if (rect.width > MINIMUM_WIDTH_FOR_THRESHOLD && distance < THRESHOLD_DISTANCE) { 41162 if (isRightToLeft && edge === 'right' || !isRightToLeft && edge === 'left') { 41163 return [rootBlockIndex, 'before']; 41164 } 41165 if (isRightToLeft && edge === 'left' || !isRightToLeft && edge === 'right') { 41166 return [rootBlockIndex + 1, 'after']; 41167 } 41168 } 41169 } 41170 blocksData.forEach(({ 41171 isUnmodifiedDefaultBlock, 41172 getBoundingClientRect, 41173 blockIndex, 41174 blockOrientation 41175 }) => { 41176 const rect = getBoundingClientRect(); 41177 let [distance, edge] = getDistanceToNearestEdge(position, rect, allowedEdges); 41178 // If the the point is close to a side, prioritize that side. 41179 const [sideDistance, sideEdge] = getDistanceToNearestEdge(position, rect, ['left', 'right']); 41180 const isPointInsideRect = isPointContainedByRect(position, rect); 41181 41182 // Prioritize the element if the point is inside of an unmodified default block. 41183 if (isUnmodifiedDefaultBlock && isPointInsideRect) { 41184 distance = 0; 41185 } else if (orientation === 'vertical' && blockOrientation !== 'horizontal' && (isPointInsideRect && sideDistance < THRESHOLD_DISTANCE || !isPointInsideRect && isPointWithinTopAndBottomBoundariesOfRect(position, rect))) { 41186 /** 41187 * This condition should only apply when the layout is vertical (otherwise there's 41188 * no need to create a Row) and dropzones should only activate when the block is 41189 * either within and close to the sides of the target block or on its outer sides. 41190 */ 41191 targetBlockIndex = blockIndex; 41192 nearestSide = sideEdge; 41193 } 41194 if (distance < minDistance) { 41195 // Where the dropped block will be inserted on the nearest block. 41196 insertPosition = edge === 'bottom' || !isRightToLeft && edge === 'right' || isRightToLeft && edge === 'left' ? 'after' : 'before'; 41197 41198 // Update the currently known best candidate. 41199 minDistance = distance; 41200 nearestIndex = blockIndex; 41201 } 41202 }); 41203 const adjacentIndex = nearestIndex + (insertPosition === 'after' ? 1 : -1); 41204 const isNearestBlockUnmodifiedDefaultBlock = !!blocksData[nearestIndex]?.isUnmodifiedDefaultBlock; 41205 const isAdjacentBlockUnmodifiedDefaultBlock = !!blocksData[adjacentIndex]?.isUnmodifiedDefaultBlock; 41206 41207 // If the target index is set then group with the block at that index. 41208 if (targetBlockIndex !== null) { 41209 return [targetBlockIndex, 'group', nearestSide]; 41210 } 41211 // If both blocks are not unmodified default blocks then just insert between them. 41212 if (!isNearestBlockUnmodifiedDefaultBlock && !isAdjacentBlockUnmodifiedDefaultBlock) { 41213 // If the user is dropping to the trailing edge of the block 41214 // add 1 to the index to represent dragging after. 41215 const insertionIndex = insertPosition === 'after' ? nearestIndex + 1 : nearestIndex; 41216 return [insertionIndex, 'insert']; 41217 } 41218 41219 // Otherwise, replace the nearest unmodified default block. 41220 return [isNearestBlockUnmodifiedDefaultBlock ? nearestIndex : adjacentIndex, 'replace']; 41221 } 41222 41223 /** 41224 * Check if the dragged blocks can be dropped on the target. 41225 * @param {Function} getBlockType 41226 * @param {Object[]} allowedBlocks 41227 * @param {string[]} draggedBlockNames 41228 * @param {string} targetBlockName 41229 * @return {boolean} Whether the dragged blocks can be dropped on the target. 41230 */ 41231 function isDropTargetValid(getBlockType, allowedBlocks, draggedBlockNames, targetBlockName) { 41232 // At root level allowedBlocks is undefined and all blocks are allowed. 41233 // Otherwise, check if all dragged blocks are allowed. 41234 let areBlocksAllowed = true; 41235 if (allowedBlocks) { 41236 const allowedBlockNames = allowedBlocks?.map(({ 41237 name 41238 }) => name); 41239 areBlocksAllowed = draggedBlockNames.every(name => allowedBlockNames?.includes(name)); 41240 } 41241 41242 // Work out if dragged blocks have an allowed parent and if so 41243 // check target block matches the allowed parent. 41244 const draggedBlockTypes = draggedBlockNames.map(name => getBlockType(name)); 41245 const targetMatchesDraggedBlockParents = draggedBlockTypes.every(block => { 41246 const [allowedParentName] = block?.parent || []; 41247 if (!allowedParentName) { 41248 return true; 41249 } 41250 return allowedParentName === targetBlockName; 41251 }); 41252 return areBlocksAllowed && targetMatchesDraggedBlockParents; 41253 } 41254 41255 /** 41256 * Checks if the given element is an insertion point. 41257 * 41258 * @param {EventTarget|null} targetToCheck - The element to check. 41259 * @param {Document} ownerDocument - The owner document of the element. 41260 * @return {boolean} True if the element is a insertion point, false otherwise. 41261 */ 41262 function isInsertionPoint(targetToCheck, ownerDocument) { 41263 const { 41264 defaultView 41265 } = ownerDocument; 41266 return !!(defaultView && targetToCheck instanceof defaultView.HTMLElement && targetToCheck.closest('[data-is-insertion-point]')); 41267 } 41268 41269 /** 41270 * @typedef {Object} WPBlockDropZoneConfig 41271 * @property {?HTMLElement} dropZoneElement Optional element to be used as the drop zone. 41272 * @property {string} rootClientId The root client id for the block list. 41273 */ 41274 41275 /** 41276 * A React hook that can be used to make a block list handle drag and drop. 41277 * 41278 * @param {WPBlockDropZoneConfig} dropZoneConfig configuration data for the drop zone. 41279 */ 41280 function useBlockDropZone({ 41281 dropZoneElement, 41282 // An undefined value represents a top-level block. Default to an empty 41283 // string for this so that `targetRootClientId` can be easily compared to 41284 // values returned by the `getRootBlockClientId` selector, which also uses 41285 // an empty string to represent top-level blocks. 41286 rootClientId: targetRootClientId = '', 41287 parentClientId: parentBlockClientId = '', 41288 isDisabled = false 41289 } = {}) { 41290 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 41291 const [dropTarget, setDropTarget] = (0,external_wp_element_namespaceObject.useState)({ 41292 index: null, 41293 operation: 'insert' 41294 }); 41295 const { 41296 getBlockType, 41297 getBlockVariations, 41298 getGroupingBlockName 41299 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 41300 const { 41301 canInsertBlockType, 41302 getBlockListSettings, 41303 getBlocks, 41304 getBlockIndex, 41305 getDraggedBlockClientIds, 41306 getBlockNamesByClientId, 41307 getAllowedBlocks, 41308 isDragging, 41309 isGroupable, 41310 isZoomOutMode, 41311 getSectionRootClientId 41312 } = unlock((0,external_wp_data_namespaceObject.useSelect)(store)); 41313 const { 41314 showInsertionPoint, 41315 hideInsertionPoint, 41316 startDragging, 41317 stopDragging 41318 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 41319 const onBlockDrop = useOnBlockDrop(dropTarget.operation === 'before' || dropTarget.operation === 'after' ? parentBlockClientId : targetRootClientId, dropTarget.index, { 41320 operation: dropTarget.operation, 41321 nearestSide: dropTarget.nearestSide 41322 }); 41323 const throttled = (0,external_wp_compose_namespaceObject.useThrottle)((0,external_wp_element_namespaceObject.useCallback)((event, ownerDocument) => { 41324 if (!isDragging()) { 41325 // When dragging from the desktop, no drag start event is fired. 41326 // So, ensure that the drag state is set when the user drags over a drop zone. 41327 startDragging(); 41328 } 41329 const allowedBlocks = getAllowedBlocks(targetRootClientId); 41330 const targetBlockName = getBlockNamesByClientId([targetRootClientId])[0]; 41331 const draggedBlockNames = getBlockNamesByClientId(getDraggedBlockClientIds()); 41332 const isBlockDroppingAllowed = isDropTargetValid(getBlockType, allowedBlocks, draggedBlockNames, targetBlockName); 41333 if (!isBlockDroppingAllowed) { 41334 return; 41335 } 41336 const sectionRootClientId = getSectionRootClientId(); 41337 41338 // In Zoom Out mode, if the target is not the section root provided by settings then 41339 // do not allow dropping as the drop target is not within the root (that which is 41340 // treated as "the content" by Zoom Out Mode). 41341 if (isZoomOutMode() && sectionRootClientId !== targetRootClientId) { 41342 return; 41343 } 41344 const blocks = getBlocks(targetRootClientId); 41345 41346 // The block list is empty, don't show the insertion point but still allow dropping. 41347 if (blocks.length === 0) { 41348 registry.batch(() => { 41349 setDropTarget({ 41350 index: 0, 41351 operation: 'insert' 41352 }); 41353 showInsertionPoint(targetRootClientId, 0, { 41354 operation: 'insert' 41355 }); 41356 }); 41357 return; 41358 } 41359 const blocksData = blocks.map(block => { 41360 const clientId = block.clientId; 41361 return { 41362 isUnmodifiedDefaultBlock: (0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(block), 41363 getBoundingClientRect: () => ownerDocument.getElementById(`block-$clientId}`).getBoundingClientRect(), 41364 blockIndex: getBlockIndex(clientId), 41365 blockOrientation: getBlockListSettings(clientId)?.orientation 41366 }; 41367 }); 41368 const dropTargetPosition = getDropTargetPosition(blocksData, { 41369 x: event.clientX, 41370 y: event.clientY 41371 }, getBlockListSettings(targetRootClientId)?.orientation, { 41372 dropZoneElement, 41373 parentBlockClientId, 41374 parentBlockOrientation: parentBlockClientId ? getBlockListSettings(parentBlockClientId)?.orientation : undefined, 41375 rootBlockIndex: getBlockIndex(targetRootClientId) 41376 }); 41377 const [targetIndex, operation, nearestSide] = dropTargetPosition; 41378 if (isZoomOutMode() && operation !== 'insert') { 41379 return; 41380 } 41381 if (operation === 'group') { 41382 const targetBlock = blocks[targetIndex]; 41383 const areAllImages = [targetBlock.name, ...draggedBlockNames].every(name => name === 'core/image'); 41384 const canInsertGalleryBlock = canInsertBlockType('core/gallery', targetRootClientId); 41385 const areGroupableBlocks = isGroupable([targetBlock.clientId, getDraggedBlockClientIds()]); 41386 const groupBlockVariations = getBlockVariations(getGroupingBlockName(), 'block'); 41387 const canInsertRow = groupBlockVariations && groupBlockVariations.find(({ 41388 name 41389 }) => name === 'group-row'); 41390 41391 // If the dragged blocks and the target block are all images, 41392 // check if it is creatable either a Row variation or a Gallery block. 41393 if (areAllImages && !canInsertGalleryBlock && (!areGroupableBlocks || !canInsertRow)) { 41394 return; 41395 } 41396 // If the dragged blocks and the target block are not all images, 41397 // check if it is creatable a Row variation. 41398 if (!areAllImages && (!areGroupableBlocks || !canInsertRow)) { 41399 return; 41400 } 41401 } 41402 registry.batch(() => { 41403 setDropTarget({ 41404 index: targetIndex, 41405 operation, 41406 nearestSide 41407 }); 41408 const insertionPointClientId = ['before', 'after'].includes(operation) ? parentBlockClientId : targetRootClientId; 41409 showInsertionPoint(insertionPointClientId, targetIndex, { 41410 operation, 41411 nearestSide 41412 }); 41413 }); 41414 }, [isDragging, getAllowedBlocks, targetRootClientId, getBlockNamesByClientId, getDraggedBlockClientIds, getBlockType, getSectionRootClientId, isZoomOutMode, getBlocks, getBlockListSettings, dropZoneElement, parentBlockClientId, getBlockIndex, registry, startDragging, showInsertionPoint, canInsertBlockType, isGroupable, getBlockVariations, getGroupingBlockName]), 200); 41415 return (0,external_wp_compose_namespaceObject.__experimentalUseDropZone)({ 41416 dropZoneElement, 41417 isDisabled, 41418 onDrop: onBlockDrop, 41419 onDragOver(event) { 41420 // `currentTarget` is only available while the event is being 41421 // handled, so get it now and pass it to the thottled function. 41422 // https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget 41423 throttled(event, event.currentTarget.ownerDocument); 41424 }, 41425 onDragLeave(event) { 41426 const { 41427 ownerDocument 41428 } = event.currentTarget; 41429 41430 // If the drag event is leaving the drop zone and entering an insertion point, 41431 // do not hide the insertion point as it is conceptually within the dropzone. 41432 if (isInsertionPoint(event.relatedTarget, ownerDocument) || isInsertionPoint(event.target, ownerDocument)) { 41433 return; 41434 } 41435 throttled.cancel(); 41436 hideInsertionPoint(); 41437 }, 41438 onDragEnd() { 41439 throttled.cancel(); 41440 stopDragging(); 41441 hideInsertionPoint(); 41442 } 41443 }); 41444 } 41445 41446 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inner-blocks/index.js 41447 /** 41448 * External dependencies 41449 */ 41450 41451 41452 /** 41453 * WordPress dependencies 41454 */ 41455 41456 41457 41458 41459 41460 /** 41461 * Internal dependencies 41462 */ 41463 41464 41465 41466 41467 41468 41469 41470 41471 41472 41473 41474 41475 41476 const inner_blocks_EMPTY_OBJECT = {}; 41477 function BlockContext({ 41478 children, 41479 clientId 41480 }) { 41481 const context = useBlockContext(clientId); 41482 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockContextProvider, { 41483 value: context, 41484 children: children 41485 }); 41486 } 41487 const BlockListItemsMemo = (0,external_wp_element_namespaceObject.memo)(BlockListItems); 41488 41489 /** 41490 * InnerBlocks is a component which allows a single block to have multiple blocks 41491 * as children. The UncontrolledInnerBlocks component is used whenever the inner 41492 * blocks are not controlled by another entity. In other words, it is normally 41493 * used for inner blocks in the post editor 41494 * 41495 * @param {Object} props The component props. 41496 */ 41497 function UncontrolledInnerBlocks(props) { 41498 const { 41499 clientId, 41500 allowedBlocks, 41501 prioritizedInserterBlocks, 41502 defaultBlock, 41503 directInsert, 41504 __experimentalDefaultBlock, 41505 __experimentalDirectInsert, 41506 template, 41507 templateLock, 41508 wrapperRef, 41509 templateInsertUpdatesSelection, 41510 __experimentalCaptureToolbars: captureToolbars, 41511 __experimentalAppenderTagName, 41512 renderAppender, 41513 orientation, 41514 placeholder, 41515 layout, 41516 name, 41517 blockType, 41518 parentLock, 41519 defaultLayout 41520 } = props; 41521 useNestedSettingsUpdate(clientId, parentLock, allowedBlocks, prioritizedInserterBlocks, defaultBlock, directInsert, __experimentalDefaultBlock, __experimentalDirectInsert, templateLock, captureToolbars, orientation, layout); 41522 useInnerBlockTemplateSync(clientId, template, templateLock, templateInsertUpdatesSelection); 41523 const defaultLayoutBlockSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, 'layout') || (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, '__experimentalLayout') || inner_blocks_EMPTY_OBJECT; 41524 const { 41525 allowSizingOnChildren = false 41526 } = defaultLayoutBlockSupport; 41527 const usedLayout = layout || defaultLayoutBlockSupport; 41528 const memoedLayout = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 41529 // Default layout will know about any content/wide size defined by the theme. 41530 ...defaultLayout, 41531 ...usedLayout, 41532 ...(allowSizingOnChildren && { 41533 allowSizingOnChildren: true 41534 }) 41535 }), [defaultLayout, usedLayout, allowSizingOnChildren]); 41536 41537 // For controlled inner blocks, we don't want a change in blocks to 41538 // re-render the blocks list. 41539 const items = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockListItemsMemo, { 41540 rootClientId: clientId, 41541 renderAppender: renderAppender, 41542 __experimentalAppenderTagName: __experimentalAppenderTagName, 41543 layout: memoedLayout, 41544 wrapperRef: wrapperRef, 41545 placeholder: placeholder 41546 }); 41547 if (!blockType?.providesContext || Object.keys(blockType.providesContext).length === 0) { 41548 return items; 41549 } 41550 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockContext, { 41551 clientId: clientId, 41552 children: items 41553 }); 41554 } 41555 41556 /** 41557 * The controlled inner blocks component wraps the uncontrolled inner blocks 41558 * component with the blockSync hook. This keeps the innerBlocks of the block in 41559 * the block-editor store in sync with the blocks of the controlling entity. An 41560 * example of an inner block controller is a template part block, which provides 41561 * its own blocks from the template part entity data source. 41562 * 41563 * @param {Object} props The component props. 41564 */ 41565 function ControlledInnerBlocks(props) { 41566 useBlockSync(props); 41567 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(UncontrolledInnerBlocks, { 41568 ...props 41569 }); 41570 } 41571 const ForwardedInnerBlocks = (0,external_wp_element_namespaceObject.forwardRef)((props, ref) => { 41572 const innerBlocksProps = useInnerBlocksProps({ 41573 ref 41574 }, props); 41575 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 41576 className: "block-editor-inner-blocks", 41577 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 41578 ...innerBlocksProps 41579 }) 41580 }); 41581 }); 41582 41583 /** 41584 * This hook is used to lightly mark an element as an inner blocks wrapper 41585 * element. Call this hook and pass the returned props to the element to mark as 41586 * an inner blocks wrapper, automatically rendering inner blocks as children. If 41587 * you define a ref for the element, it is important to pass the ref to this 41588 * hook, which the hook in turn will pass to the component through the props it 41589 * returns. Optionally, you can also pass any other props through this hook, and 41590 * they will be merged and returned. 41591 * 41592 * @param {Object} props Optional. Props to pass to the element. Must contain 41593 * the ref if one is defined. 41594 * @param {Object} options Optional. Inner blocks options. 41595 * 41596 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/inner-blocks/README.md 41597 */ 41598 function useInnerBlocksProps(props = {}, options = {}) { 41599 const { 41600 __unstableDisableLayoutClassNames, 41601 __unstableDisableDropZone, 41602 dropZoneElement 41603 } = options; 41604 const { 41605 clientId, 41606 layout = null, 41607 __unstableLayoutClassNames: layoutClassNames = '' 41608 } = useBlockEditContext(); 41609 const selected = (0,external_wp_data_namespaceObject.useSelect)(select => { 41610 const { 41611 getBlockName, 41612 isBlockSelected, 41613 hasSelectedInnerBlock, 41614 __unstableGetEditorMode, 41615 getTemplateLock, 41616 getBlockRootClientId, 41617 getBlockEditingMode, 41618 getBlockSettings, 41619 isDragging, 41620 getSectionRootClientId, 41621 isZoomOutMode: isZoomOut 41622 } = unlock(select(store)); 41623 if (!clientId) { 41624 const sectionRootClientId = getSectionRootClientId(); 41625 // Disable the root drop zone when zoomed out and the section root client id 41626 // is not the root block list (represented by an empty string). 41627 // This avoids drag handling bugs caused by having two block lists acting as 41628 // drop zones - the actual 'root' block list and the section root. 41629 return { 41630 isDropZoneDisabled: isZoomOut() && sectionRootClientId !== '' 41631 }; 41632 } 41633 const { 41634 hasBlockSupport, 41635 getBlockType 41636 } = select(external_wp_blocks_namespaceObject.store); 41637 const blockName = getBlockName(clientId); 41638 const enableClickThrough = __unstableGetEditorMode() === 'navigation'; 41639 const blockEditingMode = getBlockEditingMode(clientId); 41640 const parentClientId = getBlockRootClientId(clientId); 41641 const [defaultLayout] = getBlockSettings(clientId, 'layout'); 41642 let _isDropZoneDisabled = blockEditingMode === 'disabled'; 41643 if (__unstableGetEditorMode() === 'zoom-out') { 41644 // In zoom out mode, we want to disable the drop zone for the sections. 41645 // The inner blocks belonging to the section drop zone is 41646 // already disabled by the blocks themselves being disabled. 41647 const sectionRootClientId = getSectionRootClientId(); 41648 _isDropZoneDisabled = clientId !== sectionRootClientId; 41649 } 41650 return { 41651 __experimentalCaptureToolbars: hasBlockSupport(blockName, '__experimentalExposeControlsToChildren', false), 41652 hasOverlay: blockName !== 'core/template' && !isBlockSelected(clientId) && !hasSelectedInnerBlock(clientId, true) && enableClickThrough && !isDragging(), 41653 name: blockName, 41654 blockType: getBlockType(blockName), 41655 parentLock: getTemplateLock(parentClientId), 41656 parentClientId, 41657 isDropZoneDisabled: _isDropZoneDisabled, 41658 defaultLayout 41659 }; 41660 }, [clientId]); 41661 const { 41662 __experimentalCaptureToolbars, 41663 hasOverlay, 41664 name, 41665 blockType, 41666 parentLock, 41667 parentClientId, 41668 isDropZoneDisabled, 41669 defaultLayout 41670 } = selected; 41671 const blockDropZoneRef = useBlockDropZone({ 41672 dropZoneElement, 41673 rootClientId: clientId, 41674 parentClientId 41675 }); 41676 const ref = (0,external_wp_compose_namespaceObject.useMergeRefs)([props.ref, __unstableDisableDropZone || isDropZoneDisabled || layout?.isManualPlacement && window.__experimentalEnableGridInteractivity ? null : blockDropZoneRef]); 41677 const innerBlocksProps = { 41678 __experimentalCaptureToolbars, 41679 layout, 41680 name, 41681 blockType, 41682 parentLock, 41683 defaultLayout, 41684 ...options 41685 }; 41686 const InnerBlocks = innerBlocksProps.value && innerBlocksProps.onChange ? ControlledInnerBlocks : UncontrolledInnerBlocks; 41687 return { 41688 ...props, 41689 ref, 41690 className: dist_clsx(props.className, 'block-editor-block-list__layout', __unstableDisableLayoutClassNames ? '' : layoutClassNames, { 41691 'has-overlay': hasOverlay 41692 }), 41693 children: clientId ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InnerBlocks, { 41694 ...innerBlocksProps, 41695 clientId: clientId 41696 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockListItems, { 41697 ...options 41698 }) 41699 }; 41700 } 41701 useInnerBlocksProps.save = external_wp_blocks_namespaceObject.__unstableGetInnerBlocksProps; 41702 41703 // Expose default appender placeholders as components. 41704 ForwardedInnerBlocks.DefaultBlockAppender = default_block_appender_DefaultBlockAppender; 41705 ForwardedInnerBlocks.ButtonBlockAppender = ButtonBlockAppender; 41706 ForwardedInnerBlocks.Content = () => useInnerBlocksProps.save().children; 41707 41708 /** 41709 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/inner-blocks/README.md 41710 */ 41711 /* harmony default export */ const inner_blocks = (ForwardedInnerBlocks); 41712 41713 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/observe-typing/index.js 41714 /** 41715 * WordPress dependencies 41716 */ 41717 41718 41719 41720 41721 41722 /** 41723 * Internal dependencies 41724 */ 41725 41726 41727 /** 41728 * Set of key codes upon which typing is to be initiated on a keydown event. 41729 * 41730 * @type {Set<number>} 41731 */ 41732 41733 const KEY_DOWN_ELIGIBLE_KEY_CODES = new Set([external_wp_keycodes_namespaceObject.UP, external_wp_keycodes_namespaceObject.RIGHT, external_wp_keycodes_namespaceObject.DOWN, external_wp_keycodes_namespaceObject.LEFT, external_wp_keycodes_namespaceObject.ENTER, external_wp_keycodes_namespaceObject.BACKSPACE]); 41734 41735 /** 41736 * Returns true if a given keydown event can be inferred as intent to start 41737 * typing, or false otherwise. A keydown is considered eligible if it is a 41738 * text navigation without shift active. 41739 * 41740 * @param {KeyboardEvent} event Keydown event to test. 41741 * 41742 * @return {boolean} Whether event is eligible to start typing. 41743 */ 41744 function isKeyDownEligibleForStartTyping(event) { 41745 const { 41746 keyCode, 41747 shiftKey 41748 } = event; 41749 return !shiftKey && KEY_DOWN_ELIGIBLE_KEY_CODES.has(keyCode); 41750 } 41751 41752 /** 41753 * Removes the `isTyping` flag when the mouse moves in the document of the given 41754 * element. 41755 */ 41756 function useMouseMoveTypingReset() { 41757 const isTyping = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).isTyping(), []); 41758 const { 41759 stopTyping 41760 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 41761 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 41762 if (!isTyping) { 41763 return; 41764 } 41765 const { 41766 ownerDocument 41767 } = node; 41768 let lastClientX; 41769 let lastClientY; 41770 41771 /** 41772 * On mouse move, unset typing flag if user has moved cursor. 41773 * 41774 * @param {MouseEvent} event Mousemove event. 41775 */ 41776 function stopTypingOnMouseMove(event) { 41777 const { 41778 clientX, 41779 clientY 41780 } = event; 41781 41782 // We need to check that the mouse really moved because Safari 41783 // triggers mousemove events when shift or ctrl are pressed. 41784 if (lastClientX && lastClientY && (lastClientX !== clientX || lastClientY !== clientY)) { 41785 stopTyping(); 41786 } 41787 lastClientX = clientX; 41788 lastClientY = clientY; 41789 } 41790 ownerDocument.addEventListener('mousemove', stopTypingOnMouseMove); 41791 return () => { 41792 ownerDocument.removeEventListener('mousemove', stopTypingOnMouseMove); 41793 }; 41794 }, [isTyping, stopTyping]); 41795 } 41796 41797 /** 41798 * Sets and removes the `isTyping` flag based on user actions: 41799 * 41800 * - Sets the flag if the user types within the given element. 41801 * - Removes the flag when the user selects some text, focusses a non-text 41802 * field, presses ESC or TAB, or moves the mouse in the document. 41803 */ 41804 function useTypingObserver() { 41805 const { 41806 isTyping 41807 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 41808 const { 41809 isTyping: _isTyping 41810 } = select(store); 41811 return { 41812 isTyping: _isTyping() 41813 }; 41814 }, []); 41815 const { 41816 startTyping, 41817 stopTyping 41818 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 41819 const ref1 = useMouseMoveTypingReset(); 41820 const ref2 = (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 41821 const { 41822 ownerDocument 41823 } = node; 41824 const { 41825 defaultView 41826 } = ownerDocument; 41827 const selection = defaultView.getSelection(); 41828 41829 // Listeners to stop typing should only be added when typing. 41830 // Listeners to start typing should only be added when not typing. 41831 if (isTyping) { 41832 let timerId; 41833 41834 /** 41835 * Stops typing when focus transitions to a non-text field element. 41836 * 41837 * @param {FocusEvent} event Focus event. 41838 */ 41839 function stopTypingOnNonTextField(event) { 41840 const { 41841 target 41842 } = event; 41843 41844 // Since focus to a non-text field via arrow key will trigger 41845 // before the keydown event, wait until after current stack 41846 // before evaluating whether typing is to be stopped. Otherwise, 41847 // typing will re-start. 41848 timerId = defaultView.setTimeout(() => { 41849 if (!(0,external_wp_dom_namespaceObject.isTextField)(target)) { 41850 stopTyping(); 41851 } 41852 }); 41853 } 41854 41855 /** 41856 * Unsets typing flag if user presses Escape while typing flag is 41857 * active. 41858 * 41859 * @param {KeyboardEvent} event Keypress or keydown event to 41860 * interpret. 41861 */ 41862 function stopTypingOnEscapeKey(event) { 41863 const { 41864 keyCode 41865 } = event; 41866 if (keyCode === external_wp_keycodes_namespaceObject.ESCAPE || keyCode === external_wp_keycodes_namespaceObject.TAB) { 41867 stopTyping(); 41868 } 41869 } 41870 41871 /** 41872 * On selection change, unset typing flag if user has made an 41873 * uncollapsed (shift) selection. 41874 */ 41875 function stopTypingOnSelectionUncollapse() { 41876 if (!selection.isCollapsed) { 41877 stopTyping(); 41878 } 41879 } 41880 node.addEventListener('focus', stopTypingOnNonTextField); 41881 node.addEventListener('keydown', stopTypingOnEscapeKey); 41882 ownerDocument.addEventListener('selectionchange', stopTypingOnSelectionUncollapse); 41883 return () => { 41884 defaultView.clearTimeout(timerId); 41885 node.removeEventListener('focus', stopTypingOnNonTextField); 41886 node.removeEventListener('keydown', stopTypingOnEscapeKey); 41887 ownerDocument.removeEventListener('selectionchange', stopTypingOnSelectionUncollapse); 41888 }; 41889 } 41890 41891 /** 41892 * Handles a keypress or keydown event to infer intention to start 41893 * typing. 41894 * 41895 * @param {KeyboardEvent} event Keypress or keydown event to interpret. 41896 */ 41897 function startTypingInTextField(event) { 41898 const { 41899 type, 41900 target 41901 } = event; 41902 41903 // Abort early if already typing, or key press is incurred outside a 41904 // text field (e.g. arrow-ing through toolbar buttons). 41905 // Ignore typing if outside the current DOM container 41906 if (!(0,external_wp_dom_namespaceObject.isTextField)(target) || !node.contains(target)) { 41907 return; 41908 } 41909 41910 // Special-case keydown because certain keys do not emit a keypress 41911 // event. Conversely avoid keydown as the canonical event since 41912 // there are many keydown which are explicitly not targeted for 41913 // typing. 41914 if (type === 'keydown' && !isKeyDownEligibleForStartTyping(event)) { 41915 return; 41916 } 41917 startTyping(); 41918 } 41919 node.addEventListener('keypress', startTypingInTextField); 41920 node.addEventListener('keydown', startTypingInTextField); 41921 return () => { 41922 node.removeEventListener('keypress', startTypingInTextField); 41923 node.removeEventListener('keydown', startTypingInTextField); 41924 }; 41925 }, [isTyping, startTyping, stopTyping]); 41926 return (0,external_wp_compose_namespaceObject.useMergeRefs)([ref1, ref2]); 41927 } 41928 function ObserveTyping({ 41929 children 41930 }) { 41931 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 41932 ref: useTypingObserver(), 41933 children: children 41934 }); 41935 } 41936 41937 /** 41938 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/observe-typing/README.md 41939 */ 41940 /* harmony default export */ const observe_typing = (ObserveTyping); 41941 41942 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/zoom-out-separator.js 41943 /** 41944 * External dependencies 41945 */ 41946 41947 41948 /** 41949 * WordPress dependencies 41950 */ 41951 41952 41953 41954 41955 41956 41957 /** 41958 * Internal dependencies 41959 */ 41960 41961 41962 41963 function ZoomOutSeparator({ 41964 clientId, 41965 rootClientId = '', 41966 position = 'top' 41967 }) { 41968 const [isDraggedOver, setIsDraggedOver] = (0,external_wp_element_namespaceObject.useState)(false); 41969 const { 41970 sectionRootClientId, 41971 sectionClientIds, 41972 blockInsertionPoint, 41973 blockInsertionPointVisible 41974 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 41975 const { 41976 getBlockInsertionPoint, 41977 getBlockOrder, 41978 isBlockInsertionPointVisible, 41979 getSectionRootClientId 41980 } = unlock(select(store)); 41981 const root = getSectionRootClientId(); 41982 const sectionRootClientIds = getBlockOrder(root); 41983 return { 41984 sectionRootClientId: root, 41985 sectionClientIds: sectionRootClientIds, 41986 blockOrder: getBlockOrder(root), 41987 blockInsertionPoint: getBlockInsertionPoint(), 41988 blockInsertionPointVisible: isBlockInsertionPointVisible() 41989 }; 41990 }, []); 41991 const isReducedMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); 41992 if (!clientId) { 41993 return; 41994 } 41995 let isVisible = false; 41996 const isSectionBlock = rootClientId === sectionRootClientId && sectionClientIds && sectionClientIds.includes(clientId); 41997 if (!isSectionBlock) { 41998 return null; 41999 } 42000 if (position === 'top') { 42001 isVisible = blockInsertionPointVisible && blockInsertionPoint.index === 0 && clientId === sectionClientIds[blockInsertionPoint.index]; 42002 } 42003 if (position === 'bottom') { 42004 isVisible = blockInsertionPointVisible && clientId === sectionClientIds[blockInsertionPoint.index - 1]; 42005 } 42006 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__unstableAnimatePresence, { 42007 children: isVisible && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__unstableMotion.div, { 42008 initial: { 42009 height: 0 42010 }, 42011 animate: { 42012 // Use a height equal to that of the zoom out frame size. 42013 height: 'calc(1.5 * var(--wp-block-editor-iframe-zoom-out-frame-size) / var(--wp-block-editor-iframe-zoom-out-scale)' 42014 }, 42015 exit: { 42016 height: 0 42017 }, 42018 transition: { 42019 type: 'tween', 42020 duration: isReducedMotion ? 0 : 0.2, 42021 ease: [0.6, 0, 0.4, 1] 42022 }, 42023 className: dist_clsx('block-editor-block-list__zoom-out-separator', { 42024 'is-dragged-over': isDraggedOver 42025 }), 42026 "data-is-insertion-point": "true", 42027 onDragOver: () => setIsDraggedOver(true), 42028 onDragLeave: () => setIsDraggedOver(false), 42029 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__unstableMotion.div, { 42030 initial: { 42031 opacity: 0 42032 }, 42033 animate: { 42034 opacity: 1 42035 }, 42036 exit: { 42037 opacity: 0, 42038 transition: { 42039 delay: -0.125 42040 } 42041 }, 42042 transition: { 42043 ease: 'linear', 42044 duration: 0.1, 42045 delay: 0.125 42046 }, 42047 children: (0,external_wp_i18n_namespaceObject.__)('Drop pattern.') 42048 }) 42049 }) 42050 }); 42051 } 42052 42053 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/index.js 42054 /** 42055 * External dependencies 42056 */ 42057 42058 42059 /** 42060 * WordPress dependencies 42061 */ 42062 42063 42064 42065 42066 /** 42067 * Internal dependencies 42068 */ 42069 42070 42071 42072 42073 42074 42075 42076 42077 42078 42079 42080 42081 42082 const block_list_IntersectionObserver = (0,external_wp_element_namespaceObject.createContext)(); 42083 const pendingBlockVisibilityUpdatesPerRegistry = new WeakMap(); 42084 function Root({ 42085 className, 42086 ...settings 42087 }) { 42088 const isLargeViewport = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium'); 42089 const { 42090 isOutlineMode, 42091 isFocusMode, 42092 editorMode, 42093 temporarilyEditingAsBlocks 42094 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 42095 const { 42096 getSettings, 42097 __unstableGetEditorMode, 42098 getTemporarilyEditingAsBlocks, 42099 isTyping 42100 } = unlock(select(store)); 42101 const { 42102 outlineMode, 42103 focusMode 42104 } = getSettings(); 42105 return { 42106 isOutlineMode: outlineMode && !isTyping(), 42107 isFocusMode: focusMode, 42108 editorMode: __unstableGetEditorMode(), 42109 temporarilyEditingAsBlocks: getTemporarilyEditingAsBlocks() 42110 }; 42111 }, []); 42112 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 42113 const { 42114 setBlockVisibility 42115 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 42116 const delayedBlockVisibilityUpdates = (0,external_wp_compose_namespaceObject.useDebounce)((0,external_wp_element_namespaceObject.useCallback)(() => { 42117 const updates = {}; 42118 pendingBlockVisibilityUpdatesPerRegistry.get(registry).forEach(([id, isIntersecting]) => { 42119 updates[id] = isIntersecting; 42120 }); 42121 setBlockVisibility(updates); 42122 }, [registry]), 300, { 42123 trailing: true 42124 }); 42125 const intersectionObserver = (0,external_wp_element_namespaceObject.useMemo)(() => { 42126 const { 42127 IntersectionObserver: Observer 42128 } = window; 42129 if (!Observer) { 42130 return; 42131 } 42132 return new Observer(entries => { 42133 if (!pendingBlockVisibilityUpdatesPerRegistry.get(registry)) { 42134 pendingBlockVisibilityUpdatesPerRegistry.set(registry, []); 42135 } 42136 for (const entry of entries) { 42137 const clientId = entry.target.getAttribute('data-block'); 42138 pendingBlockVisibilityUpdatesPerRegistry.get(registry).push([clientId, entry.isIntersecting]); 42139 } 42140 delayedBlockVisibilityUpdates(); 42141 }); 42142 }, []); 42143 const innerBlocksProps = useInnerBlocksProps({ 42144 ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([useBlockSelectionClearer(), useInBetweenInserter(), useTypingObserver()]), 42145 className: dist_clsx('is-root-container', className, { 42146 'is-outline-mode': isOutlineMode, 42147 'is-focus-mode': isFocusMode && isLargeViewport, 42148 'is-navigate-mode': editorMode === 'navigation' 42149 }) 42150 }, settings); 42151 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(block_list_IntersectionObserver.Provider, { 42152 value: intersectionObserver, 42153 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 42154 ...innerBlocksProps 42155 }), !!temporarilyEditingAsBlocks && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StopEditingAsBlocksOnOutsideSelect, { 42156 clientId: temporarilyEditingAsBlocks 42157 })] 42158 }); 42159 } 42160 function StopEditingAsBlocksOnOutsideSelect({ 42161 clientId 42162 }) { 42163 const { 42164 stopEditingAsBlocks 42165 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 42166 const isBlockOrDescendantSelected = (0,external_wp_data_namespaceObject.useSelect)(select => { 42167 const { 42168 isBlockSelected, 42169 hasSelectedInnerBlock 42170 } = select(store); 42171 return isBlockSelected(clientId) || hasSelectedInnerBlock(clientId, true); 42172 }, [clientId]); 42173 (0,external_wp_element_namespaceObject.useEffect)(() => { 42174 if (!isBlockOrDescendantSelected) { 42175 stopEditingAsBlocks(clientId); 42176 } 42177 }, [isBlockOrDescendantSelected, clientId, stopEditingAsBlocks]); 42178 return null; 42179 } 42180 function BlockList(settings) { 42181 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Provider, { 42182 value: DEFAULT_BLOCK_EDIT_CONTEXT, 42183 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Root, { 42184 ...settings 42185 }) 42186 }); 42187 } 42188 const block_list_EMPTY_ARRAY = []; 42189 const block_list_EMPTY_SET = new Set(); 42190 function Items({ 42191 placeholder, 42192 rootClientId, 42193 renderAppender: CustomAppender, 42194 __experimentalAppenderTagName, 42195 layout = defaultLayout 42196 }) { 42197 // Avoid passing CustomAppender to useSelect because it could be a new 42198 // function on every render. 42199 const hasAppender = CustomAppender !== false; 42200 const hasCustomAppender = !!CustomAppender; 42201 const { 42202 order, 42203 isZoomOut, 42204 selectedBlocks, 42205 visibleBlocks, 42206 shouldRenderAppender 42207 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 42208 const { 42209 getSettings, 42210 getBlockOrder, 42211 getSelectedBlockClientId, 42212 getSelectedBlockClientIds, 42213 __unstableGetVisibleBlocks, 42214 getTemplateLock, 42215 getBlockEditingMode, 42216 __unstableGetEditorMode 42217 } = select(store); 42218 const _order = getBlockOrder(rootClientId); 42219 if (getSettings().__unstableIsPreviewMode) { 42220 return { 42221 order: _order, 42222 selectedBlocks: block_list_EMPTY_ARRAY, 42223 visibleBlocks: block_list_EMPTY_SET 42224 }; 42225 } 42226 const selectedBlockClientId = getSelectedBlockClientId(); 42227 return { 42228 order: _order, 42229 selectedBlocks: getSelectedBlockClientIds(), 42230 visibleBlocks: __unstableGetVisibleBlocks(), 42231 isZoomOut: __unstableGetEditorMode() === 'zoom-out', 42232 shouldRenderAppender: hasAppender && __unstableGetEditorMode() !== 'zoom-out' && (hasCustomAppender ? !getTemplateLock(rootClientId) && getBlockEditingMode(rootClientId) !== 'disabled' : rootClientId === selectedBlockClientId || !rootClientId && !selectedBlockClientId && !_order.length) 42233 }; 42234 }, [rootClientId, hasAppender, hasCustomAppender]); 42235 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(LayoutProvider, { 42236 value: layout, 42237 children: [order.map(clientId => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_data_namespaceObject.AsyncModeProvider, { 42238 value: 42239 // Only provide data asynchronously if the block is 42240 // not visible and not selected. 42241 !visibleBlocks.has(clientId) && !selectedBlocks.includes(clientId), 42242 children: [isZoomOut && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ZoomOutSeparator, { 42243 clientId: clientId, 42244 rootClientId: rootClientId, 42245 position: "top" 42246 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block, { 42247 rootClientId: rootClientId, 42248 clientId: clientId 42249 }), isZoomOut && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ZoomOutSeparator, { 42250 clientId: clientId, 42251 rootClientId: rootClientId, 42252 position: "bottom" 42253 })] 42254 }, clientId)), order.length < 1 && placeholder, shouldRenderAppender && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockListAppender, { 42255 tagName: __experimentalAppenderTagName, 42256 rootClientId: rootClientId, 42257 CustomAppender: CustomAppender 42258 })] 42259 }); 42260 } 42261 function BlockListItems(props) { 42262 // This component needs to always be synchronous as it's the one changing 42263 // the async mode depending on the block selection. 42264 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_data_namespaceObject.AsyncModeProvider, { 42265 value: false, 42266 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Items, { 42267 ...props 42268 }) 42269 }); 42270 } 42271 42272 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/use-multi-selection.js 42273 /** 42274 * WordPress dependencies 42275 */ 42276 42277 42278 42279 /** 42280 * Internal dependencies 42281 */ 42282 42283 function selector(select) { 42284 const { 42285 isMultiSelecting, 42286 getMultiSelectedBlockClientIds, 42287 hasMultiSelection, 42288 getSelectedBlockClientId, 42289 getSelectedBlocksInitialCaretPosition, 42290 __unstableIsFullySelected 42291 } = select(store); 42292 return { 42293 isMultiSelecting: isMultiSelecting(), 42294 multiSelectedBlockClientIds: getMultiSelectedBlockClientIds(), 42295 hasMultiSelection: hasMultiSelection(), 42296 selectedBlockClientId: getSelectedBlockClientId(), 42297 initialPosition: getSelectedBlocksInitialCaretPosition(), 42298 isFullSelection: __unstableIsFullySelected() 42299 }; 42300 } 42301 function useMultiSelection() { 42302 const { 42303 initialPosition, 42304 isMultiSelecting, 42305 multiSelectedBlockClientIds, 42306 hasMultiSelection, 42307 selectedBlockClientId, 42308 isFullSelection 42309 } = (0,external_wp_data_namespaceObject.useSelect)(selector, []); 42310 42311 /** 42312 * When the component updates, and there is multi selection, we need to 42313 * select the entire block contents. 42314 */ 42315 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 42316 const { 42317 ownerDocument 42318 } = node; 42319 const { 42320 defaultView 42321 } = ownerDocument; 42322 42323 // Allow initialPosition to bypass focus behavior. This is useful 42324 // for the list view or other areas where we don't want to transfer 42325 // focus to the editor canvas. 42326 if (initialPosition === undefined || initialPosition === null) { 42327 return; 42328 } 42329 if (!hasMultiSelection || isMultiSelecting) { 42330 return; 42331 } 42332 const { 42333 length 42334 } = multiSelectedBlockClientIds; 42335 if (length < 2) { 42336 return; 42337 } 42338 if (!isFullSelection) { 42339 return; 42340 } 42341 42342 // Allow cross contentEditable selection by temporarily making 42343 // all content editable. We can't rely on using the store and 42344 // React because re-rending happens too slowly. We need to be 42345 // able to select across instances immediately. 42346 node.contentEditable = true; 42347 42348 // For some browsers, like Safari, it is important that focus 42349 // happens BEFORE selection removal. 42350 node.focus(); 42351 defaultView.getSelection().removeAllRanges(); 42352 }, [hasMultiSelection, isMultiSelecting, multiSelectedBlockClientIds, selectedBlockClientId, initialPosition, isFullSelection]); 42353 } 42354 42355 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/use-tab-nav.js 42356 /** 42357 * WordPress dependencies 42358 */ 42359 42360 42361 42362 42363 42364 42365 /** 42366 * Internal dependencies 42367 */ 42368 42369 42370 42371 42372 function useTabNav() { 42373 const container = (0,external_wp_element_namespaceObject.useRef)(); 42374 const focusCaptureBeforeRef = (0,external_wp_element_namespaceObject.useRef)(); 42375 const focusCaptureAfterRef = (0,external_wp_element_namespaceObject.useRef)(); 42376 const { 42377 hasMultiSelection, 42378 getSelectedBlockClientId, 42379 getBlockCount 42380 } = (0,external_wp_data_namespaceObject.useSelect)(store); 42381 const { 42382 setNavigationMode, 42383 setLastFocus 42384 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 42385 const isNavigationMode = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).isNavigationMode(), []); 42386 const { 42387 getLastFocus 42388 } = unlock((0,external_wp_data_namespaceObject.useSelect)(store)); 42389 42390 // Don't allow tabbing to this element in Navigation mode. 42391 const focusCaptureTabIndex = !isNavigationMode ? '0' : undefined; 42392 42393 // Reference that holds the a flag for enabling or disabling 42394 // capturing on the focus capture elements. 42395 const noCaptureRef = (0,external_wp_element_namespaceObject.useRef)(); 42396 function onFocusCapture(event) { 42397 // Do not capture incoming focus if set by us in WritingFlow. 42398 if (noCaptureRef.current) { 42399 noCaptureRef.current = null; 42400 } else if (hasMultiSelection()) { 42401 container.current.focus(); 42402 } else if (getSelectedBlockClientId()) { 42403 if (getLastFocus()?.current) { 42404 getLastFocus().current.focus(); 42405 } else { 42406 // Handles when the last focus has not been set yet, or has been cleared by new blocks being added via the inserter. 42407 container.current.querySelector(`[data-block="$getSelectedBlockClientId()}"]`).focus(); 42408 } 42409 } else { 42410 setNavigationMode(true); 42411 const canvasElement = container.current.ownerDocument === event.target.ownerDocument ? container.current : container.current.ownerDocument.defaultView.frameElement; 42412 const isBefore = 42413 // eslint-disable-next-line no-bitwise 42414 event.target.compareDocumentPosition(canvasElement) & event.target.DOCUMENT_POSITION_FOLLOWING; 42415 const tabbables = external_wp_dom_namespaceObject.focus.tabbable.find(container.current); 42416 if (tabbables.length) { 42417 const next = isBefore ? tabbables[0] : tabbables[tabbables.length - 1]; 42418 next.focus(); 42419 } 42420 } 42421 } 42422 const before = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 42423 ref: focusCaptureBeforeRef, 42424 tabIndex: focusCaptureTabIndex, 42425 onFocus: onFocusCapture 42426 }); 42427 const after = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 42428 ref: focusCaptureAfterRef, 42429 tabIndex: focusCaptureTabIndex, 42430 onFocus: onFocusCapture 42431 }); 42432 const ref = (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 42433 function onKeyDown(event) { 42434 if (event.defaultPrevented) { 42435 return; 42436 } 42437 if (event.keyCode === external_wp_keycodes_namespaceObject.ESCAPE && !hasMultiSelection()) { 42438 event.preventDefault(); 42439 setNavigationMode(true); 42440 return; 42441 } 42442 42443 // In Edit mode, Tab should focus the first tabbable element after 42444 // the content, which is normally the sidebar (with block controls) 42445 // and Shift+Tab should focus the first tabbable element before the 42446 // content, which is normally the block toolbar. 42447 // Arrow keys can be used, and Tab and arrow keys can be used in 42448 // Navigation mode (press Esc), to navigate through blocks. 42449 if (event.keyCode !== external_wp_keycodes_namespaceObject.TAB) { 42450 return; 42451 } 42452 const isShift = event.shiftKey; 42453 const direction = isShift ? 'findPrevious' : 'findNext'; 42454 if (!hasMultiSelection() && !getSelectedBlockClientId()) { 42455 // Preserve the behaviour of entering navigation mode when 42456 // tabbing into the content without a block selection. 42457 // `onFocusCapture` already did this previously, but we need to 42458 // do it again here because after clearing block selection, 42459 // focus land on the writing flow container and pressing Tab 42460 // will no longer send focus through the focus capture element. 42461 if (event.target === node) { 42462 setNavigationMode(true); 42463 } 42464 return; 42465 } 42466 const nextTabbable = external_wp_dom_namespaceObject.focus.tabbable[direction](event.target); 42467 42468 // We want to constrain the tabbing to the block and its child blocks. 42469 // If the preceding form element is within a different block, 42470 // such as two sibling image blocks in the placeholder state, 42471 // we want shift + tab from the first form element to move to the image 42472 // block toolbar and not the previous image block's form element. 42473 const currentBlock = event.target.closest('[data-block]'); 42474 const isElementPartOfSelectedBlock = currentBlock && nextTabbable && (isInSameBlock(currentBlock, nextTabbable) || isInsideRootBlock(currentBlock, nextTabbable)); 42475 42476 // Allow tabbing from the block wrapper to a form element, 42477 // and between form elements rendered in a block and its child blocks, 42478 // such as inside a placeholder. Form elements are generally 42479 // meant to be UI rather than part of the content. Ideally 42480 // these are not rendered in the content and perhaps in the 42481 // future they can be rendered in an iframe or shadow DOM. 42482 if ((0,external_wp_dom_namespaceObject.isFormElement)(nextTabbable) && isElementPartOfSelectedBlock) { 42483 return; 42484 } 42485 const next = isShift ? focusCaptureBeforeRef : focusCaptureAfterRef; 42486 42487 // Disable focus capturing on the focus capture element, so it 42488 // doesn't refocus this block and so it allows default behaviour 42489 // (moving focus to the next tabbable element). 42490 noCaptureRef.current = true; 42491 42492 // Focusing the focus capture element, which is located above and 42493 // below the editor, should not scroll the page all the way up or 42494 // down. 42495 next.current.focus({ 42496 preventScroll: true 42497 }); 42498 } 42499 function onFocusOut(event) { 42500 setLastFocus({ 42501 ...getLastFocus(), 42502 current: event.target 42503 }); 42504 const { 42505 ownerDocument 42506 } = node; 42507 42508 // If focus disappears due to there being no blocks, move focus to 42509 // the writing flow wrapper. 42510 if (!event.relatedTarget && ownerDocument.activeElement === ownerDocument.body && getBlockCount() === 0) { 42511 node.focus(); 42512 } 42513 } 42514 42515 // When tabbing back to an element in block list, this event handler prevents scrolling if the 42516 // focus capture divs (before/after) are outside of the viewport. (For example shift+tab back to a paragraph 42517 // when focus is on a sidebar element. This prevents the scrollable writing area from jumping either to the 42518 // top or bottom of the document. 42519 // 42520 // Note that it isn't possible to disable scrolling in the onFocus event. We need to intercept this 42521 // earlier in the keypress handler, and call focus( { preventScroll: true } ) instead. 42522 // https://developer.mozilla.org/en-US/docs/Web/API/HTMLOrForeignElement/focus#parameters 42523 function preventScrollOnTab(event) { 42524 if (event.keyCode !== external_wp_keycodes_namespaceObject.TAB) { 42525 return; 42526 } 42527 if (event.target?.getAttribute('role') === 'region') { 42528 return; 42529 } 42530 if (container.current === event.target) { 42531 return; 42532 } 42533 const isShift = event.shiftKey; 42534 const direction = isShift ? 'findPrevious' : 'findNext'; 42535 const target = external_wp_dom_namespaceObject.focus.tabbable[direction](event.target); 42536 // Only do something when the next tabbable is a focus capture div (before/after) 42537 if (target === focusCaptureBeforeRef.current || target === focusCaptureAfterRef.current) { 42538 event.preventDefault(); 42539 target.focus({ 42540 preventScroll: true 42541 }); 42542 } 42543 } 42544 const { 42545 ownerDocument 42546 } = node; 42547 const { 42548 defaultView 42549 } = ownerDocument; 42550 defaultView.addEventListener('keydown', preventScrollOnTab); 42551 node.addEventListener('keydown', onKeyDown); 42552 node.addEventListener('focusout', onFocusOut); 42553 return () => { 42554 defaultView.removeEventListener('keydown', preventScrollOnTab); 42555 node.removeEventListener('keydown', onKeyDown); 42556 node.removeEventListener('focusout', onFocusOut); 42557 }; 42558 }, []); 42559 const mergedRefs = (0,external_wp_compose_namespaceObject.useMergeRefs)([container, ref]); 42560 return [before, mergedRefs, after]; 42561 } 42562 42563 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/use-arrow-nav.js 42564 /** 42565 * WordPress dependencies 42566 */ 42567 42568 42569 42570 42571 42572 /** 42573 * Internal dependencies 42574 */ 42575 42576 42577 42578 /** 42579 * Returns true if the element should consider edge navigation upon a keyboard 42580 * event of the given directional key code, or false otherwise. 42581 * 42582 * @param {Element} element HTML element to test. 42583 * @param {number} keyCode KeyboardEvent keyCode to test. 42584 * @param {boolean} hasModifier Whether a modifier is pressed. 42585 * 42586 * @return {boolean} Whether element should consider edge navigation. 42587 */ 42588 function isNavigationCandidate(element, keyCode, hasModifier) { 42589 const isVertical = keyCode === external_wp_keycodes_namespaceObject.UP || keyCode === external_wp_keycodes_namespaceObject.DOWN; 42590 const { 42591 tagName 42592 } = element; 42593 const elementType = element.getAttribute('type'); 42594 42595 // Native inputs should not navigate vertically, unless they are simple types that don't need up/down arrow keys. 42596 if (isVertical && !hasModifier) { 42597 if (tagName === 'INPUT') { 42598 const verticalInputTypes = ['date', 'datetime-local', 'month', 'number', 'range', 'time', 'week']; 42599 return !verticalInputTypes.includes(elementType); 42600 } 42601 return true; 42602 } 42603 42604 // Native inputs should not navigate horizontally, unless they are simple types that don't need left/right arrow keys. 42605 if (tagName === 'INPUT') { 42606 const simpleInputTypes = ['button', 'checkbox', 'number', 'color', 'file', 'image', 'radio', 'reset', 'submit']; 42607 return simpleInputTypes.includes(elementType); 42608 } 42609 42610 // Native textareas should not navigate horizontally. 42611 return tagName !== 'TEXTAREA'; 42612 } 42613 42614 /** 42615 * Returns the optimal tab target from the given focused element in the desired 42616 * direction. A preference is made toward text fields, falling back to the block 42617 * focus stop if no other candidates exist for the block. 42618 * 42619 * @param {Element} target Currently focused text field. 42620 * @param {boolean} isReverse True if considering as the first field. 42621 * @param {Element} containerElement Element containing all blocks. 42622 * @param {boolean} onlyVertical Whether to only consider tabbable elements 42623 * that are visually above or under the 42624 * target. 42625 * 42626 * @return {?Element} Optimal tab target, if one exists. 42627 */ 42628 function getClosestTabbable(target, isReverse, containerElement, onlyVertical) { 42629 // Since the current focus target is not guaranteed to be a text field, find 42630 // all focusables. Tabbability is considered later. 42631 let focusableNodes = external_wp_dom_namespaceObject.focus.focusable.find(containerElement); 42632 if (isReverse) { 42633 focusableNodes.reverse(); 42634 } 42635 42636 // Consider as candidates those focusables after the current target. It's 42637 // assumed this can only be reached if the target is focusable (on its 42638 // keydown event), so no need to verify it exists in the set. 42639 focusableNodes = focusableNodes.slice(focusableNodes.indexOf(target) + 1); 42640 let targetRect; 42641 if (onlyVertical) { 42642 targetRect = target.getBoundingClientRect(); 42643 } 42644 function isTabCandidate(node) { 42645 if (node.closest('[inert]')) { 42646 return; 42647 } 42648 42649 // Skip if there's only one child that is content editable (and thus a 42650 // better candidate). 42651 if (node.children.length === 1 && isInSameBlock(node, node.firstElementChild) && node.firstElementChild.getAttribute('contenteditable') === 'true') { 42652 return; 42653 } 42654 42655 // Not a candidate if the node is not tabbable. 42656 if (!external_wp_dom_namespaceObject.focus.tabbable.isTabbableIndex(node)) { 42657 return false; 42658 } 42659 42660 // Skip focusable elements such as links within content editable nodes. 42661 if (node.isContentEditable && node.contentEditable !== 'true') { 42662 return false; 42663 } 42664 if (onlyVertical) { 42665 const nodeRect = node.getBoundingClientRect(); 42666 if (nodeRect.left >= targetRect.right || nodeRect.right <= targetRect.left) { 42667 return false; 42668 } 42669 } 42670 return true; 42671 } 42672 return focusableNodes.find(isTabCandidate); 42673 } 42674 function useArrowNav() { 42675 const { 42676 getMultiSelectedBlocksStartClientId, 42677 getMultiSelectedBlocksEndClientId, 42678 getSettings, 42679 hasMultiSelection, 42680 __unstableIsFullySelected 42681 } = (0,external_wp_data_namespaceObject.useSelect)(store); 42682 const { 42683 selectBlock 42684 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 42685 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 42686 // Here a DOMRect is stored while moving the caret vertically so 42687 // vertical position of the start position can be restored. This is to 42688 // recreate browser behaviour across blocks. 42689 let verticalRect; 42690 function onMouseDown() { 42691 verticalRect = null; 42692 } 42693 function isClosestTabbableABlock(target, isReverse) { 42694 const closestTabbable = getClosestTabbable(target, isReverse, node); 42695 return closestTabbable && getBlockClientId(closestTabbable); 42696 } 42697 function onKeyDown(event) { 42698 // Abort if navigation has already been handled (e.g. RichText 42699 // inline boundaries). 42700 if (event.defaultPrevented) { 42701 return; 42702 } 42703 const { 42704 keyCode, 42705 target, 42706 shiftKey, 42707 ctrlKey, 42708 altKey, 42709 metaKey 42710 } = event; 42711 const isUp = keyCode === external_wp_keycodes_namespaceObject.UP; 42712 const isDown = keyCode === external_wp_keycodes_namespaceObject.DOWN; 42713 const isLeft = keyCode === external_wp_keycodes_namespaceObject.LEFT; 42714 const isRight = keyCode === external_wp_keycodes_namespaceObject.RIGHT; 42715 const isReverse = isUp || isLeft; 42716 const isHorizontal = isLeft || isRight; 42717 const isVertical = isUp || isDown; 42718 const isNav = isHorizontal || isVertical; 42719 const hasModifier = shiftKey || ctrlKey || altKey || metaKey; 42720 const isNavEdge = isVertical ? external_wp_dom_namespaceObject.isVerticalEdge : external_wp_dom_namespaceObject.isHorizontalEdge; 42721 const { 42722 ownerDocument 42723 } = node; 42724 const { 42725 defaultView 42726 } = ownerDocument; 42727 if (!isNav) { 42728 return; 42729 } 42730 42731 // If there is a multi-selection, the arrow keys should collapse the 42732 // selection to the start or end of the selection. 42733 if (hasMultiSelection()) { 42734 if (shiftKey) { 42735 return; 42736 } 42737 42738 // Only handle if we have a full selection (not a native partial 42739 // selection). 42740 if (!__unstableIsFullySelected()) { 42741 return; 42742 } 42743 event.preventDefault(); 42744 if (isReverse) { 42745 selectBlock(getMultiSelectedBlocksStartClientId()); 42746 } else { 42747 selectBlock(getMultiSelectedBlocksEndClientId(), -1); 42748 } 42749 return; 42750 } 42751 42752 // Abort if our current target is not a candidate for navigation 42753 // (e.g. preserve native input behaviors). 42754 if (!isNavigationCandidate(target, keyCode, hasModifier)) { 42755 return; 42756 } 42757 42758 // When presing any key other than up or down, the initial vertical 42759 // position must ALWAYS be reset. The vertical position is saved so 42760 // it can be restored as well as possible on sebsequent vertical 42761 // arrow key presses. It may not always be possible to restore the 42762 // exact same position (such as at an empty line), so it wouldn't be 42763 // good to compute the position right before any vertical arrow key 42764 // press. 42765 if (!isVertical) { 42766 verticalRect = null; 42767 } else if (!verticalRect) { 42768 verticalRect = (0,external_wp_dom_namespaceObject.computeCaretRect)(defaultView); 42769 } 42770 42771 // In the case of RTL scripts, right means previous and left means 42772 // next, which is the exact reverse of LTR. 42773 const isReverseDir = (0,external_wp_dom_namespaceObject.isRTL)(target) ? !isReverse : isReverse; 42774 const { 42775 keepCaretInsideBlock 42776 } = getSettings(); 42777 if (shiftKey) { 42778 if (isClosestTabbableABlock(target, isReverse) && isNavEdge(target, isReverse)) { 42779 node.contentEditable = true; 42780 // Firefox doesn't automatically move focus. 42781 node.focus(); 42782 } 42783 } else if (isVertical && (0,external_wp_dom_namespaceObject.isVerticalEdge)(target, isReverse) && ( 42784 // When Alt is pressed, only intercept if the caret is also at 42785 // the horizontal edge. 42786 altKey ? (0,external_wp_dom_namespaceObject.isHorizontalEdge)(target, isReverseDir) : true) && !keepCaretInsideBlock) { 42787 const closestTabbable = getClosestTabbable(target, isReverse, node, true); 42788 if (closestTabbable) { 42789 (0,external_wp_dom_namespaceObject.placeCaretAtVerticalEdge)(closestTabbable, 42790 // When Alt is pressed, place the caret at the furthest 42791 // horizontal edge and the furthest vertical edge. 42792 altKey ? !isReverse : isReverse, altKey ? undefined : verticalRect); 42793 event.preventDefault(); 42794 } 42795 } else if (isHorizontal && defaultView.getSelection().isCollapsed && (0,external_wp_dom_namespaceObject.isHorizontalEdge)(target, isReverseDir) && !keepCaretInsideBlock) { 42796 const closestTabbable = getClosestTabbable(target, isReverseDir, node); 42797 (0,external_wp_dom_namespaceObject.placeCaretAtHorizontalEdge)(closestTabbable, isReverse); 42798 event.preventDefault(); 42799 } 42800 } 42801 node.addEventListener('mousedown', onMouseDown); 42802 node.addEventListener('keydown', onKeyDown); 42803 return () => { 42804 node.removeEventListener('mousedown', onMouseDown); 42805 node.removeEventListener('keydown', onKeyDown); 42806 }; 42807 }, []); 42808 } 42809 42810 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/use-select-all.js 42811 /** 42812 * WordPress dependencies 42813 */ 42814 42815 42816 42817 42818 42819 /** 42820 * Internal dependencies 42821 */ 42822 42823 function useSelectAll() { 42824 const { 42825 getBlockOrder, 42826 getSelectedBlockClientIds, 42827 getBlockRootClientId 42828 } = (0,external_wp_data_namespaceObject.useSelect)(store); 42829 const { 42830 multiSelect, 42831 selectBlock 42832 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 42833 const isMatch = (0,external_wp_keyboardShortcuts_namespaceObject.__unstableUseShortcutEventMatch)(); 42834 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 42835 function onKeyDown(event) { 42836 if (!isMatch('core/block-editor/select-all', event)) { 42837 return; 42838 } 42839 const selectedClientIds = getSelectedBlockClientIds(); 42840 if (selectedClientIds.length < 2 && !(0,external_wp_dom_namespaceObject.isEntirelySelected)(event.target)) { 42841 return; 42842 } 42843 event.preventDefault(); 42844 const [firstSelectedClientId] = selectedClientIds; 42845 const rootClientId = getBlockRootClientId(firstSelectedClientId); 42846 const blockClientIds = getBlockOrder(rootClientId); 42847 42848 // If we have selected all sibling nested blocks, try selecting up a 42849 // level. See: https://github.com/WordPress/gutenberg/pull/31859/ 42850 if (selectedClientIds.length === blockClientIds.length) { 42851 if (rootClientId) { 42852 node.ownerDocument.defaultView.getSelection().removeAllRanges(); 42853 selectBlock(rootClientId); 42854 } 42855 return; 42856 } 42857 multiSelect(blockClientIds[0], blockClientIds[blockClientIds.length - 1]); 42858 } 42859 node.addEventListener('keydown', onKeyDown); 42860 return () => { 42861 node.removeEventListener('keydown', onKeyDown); 42862 }; 42863 }, []); 42864 } 42865 42866 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/use-drag-selection.js 42867 /** 42868 * WordPress dependencies 42869 */ 42870 42871 42872 42873 /** 42874 * Internal dependencies 42875 */ 42876 42877 42878 /** 42879 * Sets the `contenteditable` wrapper element to `value`. 42880 * 42881 * @param {HTMLElement} node Block element. 42882 * @param {boolean} value `contentEditable` value (true or false) 42883 */ 42884 function setContentEditableWrapper(node, value) { 42885 node.contentEditable = value; 42886 // Firefox doesn't automatically move focus. 42887 if (value) { 42888 node.focus(); 42889 } 42890 } 42891 42892 /** 42893 * Sets a multi-selection based on the native selection across blocks. 42894 */ 42895 function useDragSelection() { 42896 const { 42897 startMultiSelect, 42898 stopMultiSelect 42899 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 42900 const { 42901 isSelectionEnabled, 42902 hasSelectedBlock, 42903 isDraggingBlocks, 42904 isMultiSelecting 42905 } = (0,external_wp_data_namespaceObject.useSelect)(store); 42906 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 42907 const { 42908 ownerDocument 42909 } = node; 42910 const { 42911 defaultView 42912 } = ownerDocument; 42913 let anchorElement; 42914 let rafId; 42915 function onMouseUp() { 42916 stopMultiSelect(); 42917 // Equivalent to attaching the listener once. 42918 defaultView.removeEventListener('mouseup', onMouseUp); 42919 // The browser selection won't have updated yet at this point, 42920 // so wait until the next animation frame to get the browser 42921 // selection. 42922 rafId = defaultView.requestAnimationFrame(() => { 42923 if (!hasSelectedBlock()) { 42924 return; 42925 } 42926 42927 // If the selection is complete (on mouse up), and no 42928 // multiple blocks have been selected, set focus back to the 42929 // anchor element. if the anchor element contains the 42930 // selection. Additionally, the contentEditable wrapper can 42931 // now be disabled again. 42932 setContentEditableWrapper(node, false); 42933 const selection = defaultView.getSelection(); 42934 if (selection.rangeCount) { 42935 const range = selection.getRangeAt(0); 42936 const { 42937 commonAncestorContainer 42938 } = range; 42939 const clonedRange = range.cloneRange(); 42940 if (anchorElement.contains(commonAncestorContainer)) { 42941 anchorElement.focus(); 42942 selection.removeAllRanges(); 42943 selection.addRange(clonedRange); 42944 } 42945 } 42946 }); 42947 } 42948 function onMouseLeave({ 42949 buttons, 42950 target, 42951 relatedTarget 42952 }) { 42953 // If we're moving into a child element, ignore. We're tracking 42954 // the mouse leaving the element to a parent, no a child. 42955 if (target.contains(relatedTarget)) { 42956 return; 42957 } 42958 42959 // Avoid triggering a multi-selection if the user is already 42960 // dragging blocks. 42961 if (isDraggingBlocks()) { 42962 return; 42963 } 42964 42965 // The primary button must be pressed to initiate selection. 42966 // See https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons 42967 if (buttons !== 1) { 42968 return; 42969 } 42970 42971 // Abort if we are already multi-selecting. 42972 if (isMultiSelecting()) { 42973 return; 42974 } 42975 42976 // Abort if selection is leaving writing flow. 42977 if (node === target) { 42978 return; 42979 } 42980 42981 // Check the attribute, not the contentEditable attribute. All 42982 // child elements of the content editable wrapper are editable 42983 // and return true for this property. We only want to start 42984 // multi selecting when the mouse leaves the wrapper. 42985 if (target.getAttribute('contenteditable') !== 'true') { 42986 return; 42987 } 42988 if (!isSelectionEnabled()) { 42989 return; 42990 } 42991 42992 // Do not rely on the active element because it may change after 42993 // the mouse leaves for the first time. See 42994 // https://github.com/WordPress/gutenberg/issues/48747. 42995 anchorElement = target; 42996 startMultiSelect(); 42997 42998 // `onSelectionStart` is called after `mousedown` and 42999 // `mouseleave` (from a block). The selection ends when 43000 // `mouseup` happens anywhere in the window. 43001 defaultView.addEventListener('mouseup', onMouseUp); 43002 43003 // Allow cross contentEditable selection by temporarily making 43004 // all content editable. We can't rely on using the store and 43005 // React because re-rending happens too slowly. We need to be 43006 // able to select across instances immediately. 43007 setContentEditableWrapper(node, true); 43008 } 43009 node.addEventListener('mouseout', onMouseLeave); 43010 return () => { 43011 node.removeEventListener('mouseout', onMouseLeave); 43012 defaultView.removeEventListener('mouseup', onMouseUp); 43013 defaultView.cancelAnimationFrame(rafId); 43014 }; 43015 }, [startMultiSelect, stopMultiSelect, isSelectionEnabled, hasSelectedBlock]); 43016 } 43017 43018 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/use-selection-observer.js 43019 /** 43020 * WordPress dependencies 43021 */ 43022 43023 43024 43025 43026 43027 /** 43028 * Internal dependencies 43029 */ 43030 43031 43032 43033 /** 43034 * Extract the selection start node from the selection. When the anchor node is 43035 * not a text node, the selection offset is the index of a child node. 43036 * 43037 * @param {Selection} selection The selection. 43038 * 43039 * @return {Element} The selection start node. 43040 */ 43041 function extractSelectionStartNode(selection) { 43042 const { 43043 anchorNode, 43044 anchorOffset 43045 } = selection; 43046 if (anchorNode.nodeType === anchorNode.TEXT_NODE) { 43047 return anchorNode; 43048 } 43049 if (anchorOffset === 0) { 43050 return anchorNode; 43051 } 43052 return anchorNode.childNodes[anchorOffset - 1]; 43053 } 43054 43055 /** 43056 * Extract the selection end node from the selection. When the focus node is not 43057 * a text node, the selection offset is the index of a child node. The selection 43058 * reaches up to but excluding that child node. 43059 * 43060 * @param {Selection} selection The selection. 43061 * 43062 * @return {Element} The selection start node. 43063 */ 43064 function extractSelectionEndNode(selection) { 43065 const { 43066 focusNode, 43067 focusOffset 43068 } = selection; 43069 if (focusNode.nodeType === focusNode.TEXT_NODE) { 43070 return focusNode; 43071 } 43072 if (focusOffset === focusNode.childNodes.length) { 43073 return focusNode; 43074 } 43075 43076 // When the selection is forward (the selection ends with the focus node), 43077 // the selection may extend into the next element with an offset of 0. This 43078 // may trigger multi selection even though the selection does not visually 43079 // end in the next block. 43080 if (focusOffset === 0 && (0,external_wp_dom_namespaceObject.isSelectionForward)(selection)) { 43081 var _focusNode$previousSi; 43082 return (_focusNode$previousSi = focusNode.previousSibling) !== null && _focusNode$previousSi !== void 0 ? _focusNode$previousSi : focusNode.parentElement; 43083 } 43084 return focusNode.childNodes[focusOffset]; 43085 } 43086 function findDepth(a, b) { 43087 let depth = 0; 43088 while (a[depth] === b[depth]) { 43089 depth++; 43090 } 43091 return depth; 43092 } 43093 43094 /** 43095 * Sets the `contenteditable` wrapper element to `value`. 43096 * 43097 * @param {HTMLElement} node Block element. 43098 * @param {boolean} value `contentEditable` value (true or false) 43099 */ 43100 function use_selection_observer_setContentEditableWrapper(node, value) { 43101 // Since we are calling this on every selection change, check if the value 43102 // needs to be updated first because it trigger the browser to recalculate 43103 // style. 43104 if (node.contentEditable !== String(value)) { 43105 node.contentEditable = value; 43106 43107 // Firefox doesn't automatically move focus. 43108 if (value) { 43109 node.focus(); 43110 } 43111 } 43112 } 43113 function getRichTextElement(node) { 43114 const element = node.nodeType === node.ELEMENT_NODE ? node : node.parentElement; 43115 return element?.closest('[data-wp-block-attribute-key]'); 43116 } 43117 43118 /** 43119 * Sets a multi-selection based on the native selection across blocks. 43120 */ 43121 function useSelectionObserver() { 43122 const { 43123 multiSelect, 43124 selectBlock, 43125 selectionChange 43126 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 43127 const { 43128 getBlockParents, 43129 getBlockSelectionStart, 43130 isMultiSelecting 43131 } = (0,external_wp_data_namespaceObject.useSelect)(store); 43132 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 43133 const { 43134 ownerDocument 43135 } = node; 43136 const { 43137 defaultView 43138 } = ownerDocument; 43139 function onSelectionChange(event) { 43140 const selection = defaultView.getSelection(); 43141 if (!selection.rangeCount) { 43142 return; 43143 } 43144 const startNode = extractSelectionStartNode(selection); 43145 const endNode = extractSelectionEndNode(selection); 43146 if (!node.contains(startNode) || !node.contains(endNode)) { 43147 return; 43148 } 43149 43150 // If selection is collapsed and we haven't used `shift+click`, 43151 // end multi selection and disable the contentEditable wrapper. 43152 // We have to check about `shift+click` case because elements 43153 // that don't support text selection might be involved, and we might 43154 // update the clientIds to multi-select blocks. 43155 // For now we check if the event is a `mouse` event. 43156 const isClickShift = event.shiftKey && event.type === 'mouseup'; 43157 if (selection.isCollapsed && !isClickShift) { 43158 if (node.contentEditable === 'true' && !isMultiSelecting()) { 43159 use_selection_observer_setContentEditableWrapper(node, false); 43160 let element = startNode.nodeType === startNode.ELEMENT_NODE ? startNode : startNode.parentElement; 43161 element = element?.closest('[contenteditable]'); 43162 element?.focus(); 43163 } 43164 return; 43165 } 43166 let startClientId = getBlockClientId(startNode); 43167 let endClientId = getBlockClientId(endNode); 43168 43169 // If the selection has changed and we had pressed `shift+click`, 43170 // we need to check if in an element that doesn't support 43171 // text selection has been clicked. 43172 if (isClickShift) { 43173 const selectedClientId = getBlockSelectionStart(); 43174 const clickedClientId = getBlockClientId(event.target); 43175 // `endClientId` is not defined if we end the selection by clicking a non-selectable block. 43176 // We need to check if there was already a selection with a non-selectable focusNode. 43177 const focusNodeIsNonSelectable = clickedClientId !== endClientId; 43178 if (startClientId === endClientId && selection.isCollapsed || !endClientId || focusNodeIsNonSelectable) { 43179 endClientId = clickedClientId; 43180 } 43181 // Handle the case when we have a non-selectable block 43182 // selected and click another one. 43183 if (startClientId !== selectedClientId) { 43184 startClientId = selectedClientId; 43185 } 43186 } 43187 43188 // If the selection did not involve a block, return. 43189 if (startClientId === undefined && endClientId === undefined) { 43190 use_selection_observer_setContentEditableWrapper(node, false); 43191 return; 43192 } 43193 const isSingularSelection = startClientId === endClientId; 43194 if (isSingularSelection) { 43195 if (!isMultiSelecting()) { 43196 selectBlock(startClientId); 43197 } else { 43198 multiSelect(startClientId, startClientId); 43199 } 43200 } else { 43201 const startPath = [...getBlockParents(startClientId), startClientId]; 43202 const endPath = [...getBlockParents(endClientId), endClientId]; 43203 const depth = findDepth(startPath, endPath); 43204 if (startPath[depth] !== startClientId || endPath[depth] !== endClientId) { 43205 multiSelect(startPath[depth], endPath[depth]); 43206 return; 43207 } 43208 const richTextElementStart = getRichTextElement(startNode); 43209 const richTextElementEnd = getRichTextElement(endNode); 43210 if (richTextElementStart && richTextElementEnd) { 43211 var _richTextDataStart$st, _richTextDataEnd$star; 43212 const range = selection.getRangeAt(0); 43213 const richTextDataStart = (0,external_wp_richText_namespaceObject.create)({ 43214 element: richTextElementStart, 43215 range, 43216 __unstableIsEditableTree: true 43217 }); 43218 const richTextDataEnd = (0,external_wp_richText_namespaceObject.create)({ 43219 element: richTextElementEnd, 43220 range, 43221 __unstableIsEditableTree: true 43222 }); 43223 const startOffset = (_richTextDataStart$st = richTextDataStart.start) !== null && _richTextDataStart$st !== void 0 ? _richTextDataStart$st : richTextDataStart.end; 43224 const endOffset = (_richTextDataEnd$star = richTextDataEnd.start) !== null && _richTextDataEnd$star !== void 0 ? _richTextDataEnd$star : richTextDataEnd.end; 43225 selectionChange({ 43226 start: { 43227 clientId: startClientId, 43228 attributeKey: richTextElementStart.dataset.wpBlockAttributeKey, 43229 offset: startOffset 43230 }, 43231 end: { 43232 clientId: endClientId, 43233 attributeKey: richTextElementEnd.dataset.wpBlockAttributeKey, 43234 offset: endOffset 43235 } 43236 }); 43237 } else { 43238 multiSelect(startClientId, endClientId); 43239 } 43240 } 43241 } 43242 ownerDocument.addEventListener('selectionchange', onSelectionChange); 43243 defaultView.addEventListener('mouseup', onSelectionChange); 43244 return () => { 43245 ownerDocument.removeEventListener('selectionchange', onSelectionChange); 43246 defaultView.removeEventListener('mouseup', onSelectionChange); 43247 }; 43248 }, [multiSelect, selectBlock, selectionChange, getBlockParents]); 43249 } 43250 43251 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/use-click-selection.js 43252 /** 43253 * WordPress dependencies 43254 */ 43255 43256 43257 43258 /** 43259 * Internal dependencies 43260 */ 43261 43262 43263 function useClickSelection() { 43264 const { 43265 selectBlock 43266 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 43267 const { 43268 isSelectionEnabled, 43269 getBlockSelectionStart, 43270 hasMultiSelection 43271 } = (0,external_wp_data_namespaceObject.useSelect)(store); 43272 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 43273 function onMouseDown(event) { 43274 // The main button. 43275 // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button 43276 if (!isSelectionEnabled() || event.button !== 0) { 43277 return; 43278 } 43279 const startClientId = getBlockSelectionStart(); 43280 const clickedClientId = getBlockClientId(event.target); 43281 if (event.shiftKey) { 43282 if (startClientId !== clickedClientId) { 43283 node.contentEditable = true; 43284 // Firefox doesn't automatically move focus. 43285 node.focus(); 43286 } 43287 } else if (hasMultiSelection()) { 43288 // Allow user to escape out of a multi-selection to a 43289 // singular selection of a block via click. This is handled 43290 // here since focus handling excludes blocks when there is 43291 // multiselection, as focus can be incurred by starting a 43292 // multiselection (focus moved to first block's multi- 43293 // controls). 43294 selectBlock(clickedClientId); 43295 } 43296 } 43297 node.addEventListener('mousedown', onMouseDown); 43298 return () => { 43299 node.removeEventListener('mousedown', onMouseDown); 43300 }; 43301 }, [selectBlock, isSelectionEnabled, getBlockSelectionStart, hasMultiSelection]); 43302 } 43303 43304 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/use-input.js 43305 /** 43306 * WordPress dependencies 43307 */ 43308 43309 43310 43311 43312 43313 /** 43314 * Internal dependencies 43315 */ 43316 43317 43318 /** 43319 * Handles input for selections across blocks. 43320 */ 43321 function useInput() { 43322 const { 43323 __unstableIsFullySelected, 43324 getSelectedBlockClientIds, 43325 getSelectedBlockClientId, 43326 __unstableIsSelectionMergeable, 43327 hasMultiSelection, 43328 getBlockName, 43329 canInsertBlockType, 43330 getBlockRootClientId, 43331 getSelectionStart, 43332 getSelectionEnd, 43333 getBlockAttributes 43334 } = (0,external_wp_data_namespaceObject.useSelect)(store); 43335 const { 43336 replaceBlocks, 43337 __unstableSplitSelection, 43338 removeBlocks, 43339 __unstableDeleteSelection, 43340 __unstableExpandSelection, 43341 __unstableMarkAutomaticChange 43342 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 43343 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 43344 function onBeforeInput(event) { 43345 // If writing flow is editable, NEVER allow the browser to alter the 43346 // DOM. This will cause React errors (and the DOM should only be 43347 // altered in a controlled fashion). 43348 if (node.contentEditable === 'true') { 43349 event.preventDefault(); 43350 } 43351 } 43352 function onKeyDown(event) { 43353 if (event.defaultPrevented) { 43354 return; 43355 } 43356 if (!hasMultiSelection()) { 43357 if (event.keyCode === external_wp_keycodes_namespaceObject.ENTER) { 43358 if (event.shiftKey || __unstableIsFullySelected()) { 43359 return; 43360 } 43361 const clientId = getSelectedBlockClientId(); 43362 const blockName = getBlockName(clientId); 43363 const selectionStart = getSelectionStart(); 43364 const selectionEnd = getSelectionEnd(); 43365 if (selectionStart.attributeKey === selectionEnd.attributeKey) { 43366 const selectedAttributeValue = getBlockAttributes(clientId)[selectionStart.attributeKey]; 43367 const transforms = (0,external_wp_blocks_namespaceObject.getBlockTransforms)('from').filter(({ 43368 type 43369 }) => type === 'enter'); 43370 const transformation = (0,external_wp_blocks_namespaceObject.findTransform)(transforms, item => { 43371 return item.regExp.test(selectedAttributeValue); 43372 }); 43373 if (transformation) { 43374 replaceBlocks(clientId, transformation.transform({ 43375 content: selectedAttributeValue 43376 })); 43377 __unstableMarkAutomaticChange(); 43378 return; 43379 } 43380 } 43381 if (!(0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockName, 'splitting', false) && !event.__deprecatedOnSplit) { 43382 return; 43383 } 43384 43385 // Ensure template is not locked. 43386 if (canInsertBlockType(blockName, getBlockRootClientId(clientId))) { 43387 __unstableSplitSelection(); 43388 event.preventDefault(); 43389 } 43390 } 43391 return; 43392 } 43393 if (event.keyCode === external_wp_keycodes_namespaceObject.ENTER) { 43394 node.contentEditable = false; 43395 event.preventDefault(); 43396 if (__unstableIsFullySelected()) { 43397 replaceBlocks(getSelectedBlockClientIds(), (0,external_wp_blocks_namespaceObject.createBlock)((0,external_wp_blocks_namespaceObject.getDefaultBlockName)())); 43398 } else { 43399 __unstableSplitSelection(); 43400 } 43401 } else if (event.keyCode === external_wp_keycodes_namespaceObject.BACKSPACE || event.keyCode === external_wp_keycodes_namespaceObject.DELETE) { 43402 node.contentEditable = false; 43403 event.preventDefault(); 43404 if (__unstableIsFullySelected()) { 43405 removeBlocks(getSelectedBlockClientIds()); 43406 } else if (__unstableIsSelectionMergeable()) { 43407 __unstableDeleteSelection(event.keyCode === external_wp_keycodes_namespaceObject.DELETE); 43408 } else { 43409 __unstableExpandSelection(); 43410 } 43411 } else if ( 43412 // If key.length is longer than 1, it's a control key that doesn't 43413 // input anything. 43414 event.key.length === 1 && !(event.metaKey || event.ctrlKey)) { 43415 node.contentEditable = false; 43416 if (__unstableIsSelectionMergeable()) { 43417 __unstableDeleteSelection(event.keyCode === external_wp_keycodes_namespaceObject.DELETE); 43418 } else { 43419 event.preventDefault(); 43420 // Safari does not stop default behaviour with either 43421 // event.preventDefault() or node.contentEditable = false, so 43422 // remove the selection to stop browser manipulation. 43423 node.ownerDocument.defaultView.getSelection().removeAllRanges(); 43424 } 43425 } 43426 } 43427 function onCompositionStart(event) { 43428 if (!hasMultiSelection()) { 43429 return; 43430 } 43431 node.contentEditable = false; 43432 if (__unstableIsSelectionMergeable()) { 43433 __unstableDeleteSelection(); 43434 } else { 43435 event.preventDefault(); 43436 // Safari does not stop default behaviour with either 43437 // event.preventDefault() or node.contentEditable = false, so 43438 // remove the selection to stop browser manipulation. 43439 node.ownerDocument.defaultView.getSelection().removeAllRanges(); 43440 } 43441 } 43442 node.addEventListener('beforeinput', onBeforeInput); 43443 node.addEventListener('keydown', onKeyDown); 43444 node.addEventListener('compositionstart', onCompositionStart); 43445 return () => { 43446 node.removeEventListener('beforeinput', onBeforeInput); 43447 node.removeEventListener('keydown', onKeyDown); 43448 node.removeEventListener('compositionstart', onCompositionStart); 43449 }; 43450 }, []); 43451 } 43452 43453 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/use-notify-copy.js 43454 /** 43455 * WordPress dependencies 43456 */ 43457 43458 43459 43460 43461 43462 43463 /** 43464 * Internal dependencies 43465 */ 43466 43467 function useNotifyCopy() { 43468 const { 43469 getBlockName 43470 } = (0,external_wp_data_namespaceObject.useSelect)(store); 43471 const { 43472 getBlockType 43473 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 43474 const { 43475 createSuccessNotice 43476 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_notices_namespaceObject.store); 43477 return (0,external_wp_element_namespaceObject.useCallback)((eventType, selectedBlockClientIds) => { 43478 let notice = ''; 43479 if (selectedBlockClientIds.length === 1) { 43480 const clientId = selectedBlockClientIds[0]; 43481 const title = getBlockType(getBlockName(clientId))?.title; 43482 notice = eventType === 'copy' ? (0,external_wp_i18n_namespaceObject.sprintf)( 43483 // Translators: Name of the block being copied, e.g. "Paragraph". 43484 (0,external_wp_i18n_namespaceObject.__)('Copied "%s" to clipboard.'), title) : (0,external_wp_i18n_namespaceObject.sprintf)( 43485 // Translators: Name of the block being cut, e.g. "Paragraph". 43486 (0,external_wp_i18n_namespaceObject.__)('Moved "%s" to clipboard.'), title); 43487 } else { 43488 notice = eventType === 'copy' ? (0,external_wp_i18n_namespaceObject.sprintf)( 43489 // Translators: %d: Number of blocks being copied. 43490 (0,external_wp_i18n_namespaceObject._n)('Copied %d block to clipboard.', 'Copied %d blocks to clipboard.', selectedBlockClientIds.length), selectedBlockClientIds.length) : (0,external_wp_i18n_namespaceObject.sprintf)( 43491 // Translators: %d: Number of blocks being cut. 43492 (0,external_wp_i18n_namespaceObject._n)('Moved %d block to clipboard.', 'Moved %d blocks to clipboard.', selectedBlockClientIds.length), selectedBlockClientIds.length); 43493 } 43494 createSuccessNotice(notice, { 43495 type: 'snackbar' 43496 }); 43497 }, []); 43498 } 43499 43500 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/pasting.js 43501 /** 43502 * WordPress dependencies 43503 */ 43504 43505 43506 /** 43507 * Normalizes a given string of HTML to remove the Windows-specific "Fragment" 43508 * comments and any preceding and trailing content. 43509 * 43510 * @param {string} html the html to be normalized 43511 * @return {string} the normalized html 43512 */ 43513 function removeWindowsFragments(html) { 43514 const startStr = '<!--StartFragment-->'; 43515 const startIdx = html.indexOf(startStr); 43516 if (startIdx > -1) { 43517 html = html.substring(startIdx + startStr.length); 43518 } else { 43519 // No point looking for EndFragment 43520 return html; 43521 } 43522 const endStr = '<!--EndFragment-->'; 43523 const endIdx = html.indexOf(endStr); 43524 if (endIdx > -1) { 43525 html = html.substring(0, endIdx); 43526 } 43527 return html; 43528 } 43529 43530 /** 43531 * Removes the charset meta tag inserted by Chromium. 43532 * See: 43533 * - https://github.com/WordPress/gutenberg/issues/33585 43534 * - https://bugs.chromium.org/p/chromium/issues/detail?id=1264616#c4 43535 * 43536 * @param {string} html the html to be stripped of the meta tag. 43537 * @return {string} the cleaned html 43538 */ 43539 function removeCharsetMetaTag(html) { 43540 const metaTag = `<meta charset='utf-8'>`; 43541 if (html.startsWith(metaTag)) { 43542 return html.slice(metaTag.length); 43543 } 43544 return html; 43545 } 43546 function getPasteEventData({ 43547 clipboardData 43548 }) { 43549 let plainText = ''; 43550 let html = ''; 43551 try { 43552 plainText = clipboardData.getData('text/plain'); 43553 html = clipboardData.getData('text/html'); 43554 } catch (error) { 43555 // Some browsers like UC Browser paste plain text by default and 43556 // don't support clipboardData at all, so allow default 43557 // behaviour. 43558 return; 43559 } 43560 43561 // Remove Windows-specific metadata appended within copied HTML text. 43562 html = removeWindowsFragments(html); 43563 43564 // Strip meta tag. 43565 html = removeCharsetMetaTag(html); 43566 const files = (0,external_wp_dom_namespaceObject.getFilesFromDataTransfer)(clipboardData); 43567 if (files.length && !shouldDismissPastedFiles(files, html)) { 43568 return { 43569 files 43570 }; 43571 } 43572 return { 43573 html, 43574 plainText, 43575 files: [] 43576 }; 43577 } 43578 43579 /** 43580 * Given a collection of DataTransfer files and HTML and plain text strings, 43581 * determine whether the files are to be dismissed in favor of the HTML. 43582 * 43583 * Certain office-type programs, like Microsoft Word or Apple Numbers, 43584 * will, upon copy, generate a screenshot of the content being copied and 43585 * attach it to the clipboard alongside the actual rich text that the user 43586 * sought to copy. In those cases, we should let Gutenberg handle the rich text 43587 * content and not the screenshot, since this allows Gutenberg to insert 43588 * meaningful blocks, like paragraphs, lists or even tables. 43589 * 43590 * @param {File[]} files File objects obtained from a paste event 43591 * @param {string} html HTML content obtained from a paste event 43592 * @return {boolean} True if the files should be dismissed 43593 */ 43594 function shouldDismissPastedFiles(files, html /*, plainText */) { 43595 // The question is only relevant when there is actual HTML content and when 43596 // there is exactly one image file. 43597 if (html && files?.length === 1 && files[0].type.indexOf('image/') === 0) { 43598 // A single <img> tag found in the HTML source suggests that the 43599 // content being pasted revolves around an image. Sometimes there are 43600 // other elements found, like <figure>, but we assume that the user's 43601 // intention is to paste the actual image file. 43602 const IMAGE_TAG = /<\s*img\b/gi; 43603 if (html.match(IMAGE_TAG)?.length !== 1) { 43604 return true; 43605 } 43606 43607 // Even when there is exactly one <img> tag in the HTML payload, we 43608 // choose to weed out local images, i.e. those whose source starts with 43609 // "file://". These payloads occur in specific configurations, such as 43610 // when copying an entire document from Microsoft Word, that contains 43611 // text and exactly one image, and pasting that content using Google 43612 // Chrome. 43613 const IMG_WITH_LOCAL_SRC = /<\s*img\b[^>]*\bsrc="file:\/\//i; 43614 if (html.match(IMG_WITH_LOCAL_SRC)) { 43615 return true; 43616 } 43617 } 43618 return false; 43619 } 43620 43621 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/utils.js 43622 /** 43623 * WordPress dependencies 43624 */ 43625 43626 43627 43628 /** 43629 * Internal dependencies 43630 */ 43631 43632 43633 const requiresWrapperOnCopy = Symbol('requiresWrapperOnCopy'); 43634 43635 /** 43636 * Sets the clipboard data for the provided blocks, with both HTML and plain 43637 * text representations. 43638 * 43639 * @param {ClipboardEvent} event Clipboard event. 43640 * @param {WPBlock[]} blocks Blocks to set as clipboard data. 43641 * @param {Object} registry The registry to select from. 43642 */ 43643 function setClipboardBlocks(event, blocks, registry) { 43644 let _blocks = blocks; 43645 const [firstBlock] = blocks; 43646 if (firstBlock) { 43647 const firstBlockType = registry.select(external_wp_blocks_namespaceObject.store).getBlockType(firstBlock.name); 43648 if (firstBlockType[requiresWrapperOnCopy]) { 43649 const { 43650 getBlockRootClientId, 43651 getBlockName, 43652 getBlockAttributes 43653 } = registry.select(store); 43654 const wrapperBlockClientId = getBlockRootClientId(firstBlock.clientId); 43655 const wrapperBlockName = getBlockName(wrapperBlockClientId); 43656 if (wrapperBlockName) { 43657 _blocks = (0,external_wp_blocks_namespaceObject.createBlock)(wrapperBlockName, getBlockAttributes(wrapperBlockClientId), _blocks); 43658 } 43659 } 43660 } 43661 const serialized = (0,external_wp_blocks_namespaceObject.serialize)(_blocks); 43662 event.clipboardData.setData('text/plain', toPlainText(serialized)); 43663 event.clipboardData.setData('text/html', serialized); 43664 } 43665 43666 /** 43667 * Returns the blocks to be pasted from the clipboard event. 43668 * 43669 * @param {ClipboardEvent} event The clipboard event. 43670 * @param {boolean} canUserUseUnfilteredHTML Whether the user can or can't post unfiltered HTML. 43671 * @return {Array|string} A list of blocks or a string, depending on `handlerMode`. 43672 */ 43673 function getPasteBlocks(event, canUserUseUnfilteredHTML) { 43674 const { 43675 plainText, 43676 html, 43677 files 43678 } = getPasteEventData(event); 43679 let blocks = []; 43680 if (files.length) { 43681 const fromTransforms = (0,external_wp_blocks_namespaceObject.getBlockTransforms)('from'); 43682 blocks = files.reduce((accumulator, file) => { 43683 const transformation = (0,external_wp_blocks_namespaceObject.findTransform)(fromTransforms, transform => transform.type === 'files' && transform.isMatch([file])); 43684 if (transformation) { 43685 accumulator.push(transformation.transform([file])); 43686 } 43687 return accumulator; 43688 }, []).flat(); 43689 } else { 43690 blocks = (0,external_wp_blocks_namespaceObject.pasteHandler)({ 43691 HTML: html, 43692 plainText, 43693 mode: 'BLOCKS', 43694 canUserUseUnfilteredHTML 43695 }); 43696 } 43697 return blocks; 43698 } 43699 43700 /** 43701 * Given a string of HTML representing serialized blocks, returns the plain 43702 * text extracted after stripping the HTML of any tags and fixing line breaks. 43703 * 43704 * @param {string} html Serialized blocks. 43705 * @return {string} The plain-text content with any html removed. 43706 */ 43707 function toPlainText(html) { 43708 // Manually handle BR tags as line breaks prior to `stripHTML` call 43709 html = html.replace(/<br>/g, '\n'); 43710 const plainText = (0,external_wp_dom_namespaceObject.__unstableStripHTML)(html).trim(); 43711 43712 // Merge any consecutive line breaks 43713 return plainText.replace(/\n\n+/g, '\n\n'); 43714 } 43715 43716 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/use-clipboard-handler.js 43717 /** 43718 * WordPress dependencies 43719 */ 43720 43721 43722 43723 43724 43725 /** 43726 * Internal dependencies 43727 */ 43728 43729 43730 43731 43732 function useClipboardHandler() { 43733 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 43734 const { 43735 getBlocksByClientId, 43736 getSelectedBlockClientIds, 43737 hasMultiSelection, 43738 getSettings, 43739 getBlockName, 43740 __unstableIsFullySelected, 43741 __unstableIsSelectionCollapsed, 43742 __unstableIsSelectionMergeable, 43743 __unstableGetSelectedBlocksWithPartialSelection, 43744 canInsertBlockType, 43745 getBlockRootClientId 43746 } = (0,external_wp_data_namespaceObject.useSelect)(store); 43747 const { 43748 flashBlock, 43749 removeBlocks, 43750 replaceBlocks, 43751 __unstableDeleteSelection, 43752 __unstableExpandSelection, 43753 __unstableSplitSelection 43754 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 43755 const notifyCopy = useNotifyCopy(); 43756 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 43757 function handler(event) { 43758 if (event.defaultPrevented) { 43759 // This was likely already handled in rich-text/use-paste-handler.js. 43760 return; 43761 } 43762 const selectedBlockClientIds = getSelectedBlockClientIds(); 43763 if (selectedBlockClientIds.length === 0) { 43764 return; 43765 } 43766 43767 // Let native copy/paste behaviour take over in input fields. 43768 // But always handle multiple selected blocks. 43769 if (!hasMultiSelection()) { 43770 const { 43771 target 43772 } = event; 43773 const { 43774 ownerDocument 43775 } = target; 43776 // If copying, only consider actual text selection as selection. 43777 // Otherwise, any focus on an input field is considered. 43778 const hasSelection = event.type === 'copy' || event.type === 'cut' ? (0,external_wp_dom_namespaceObject.documentHasUncollapsedSelection)(ownerDocument) : (0,external_wp_dom_namespaceObject.documentHasSelection)(ownerDocument) && !ownerDocument.activeElement.isContentEditable; 43779 43780 // Let native copy behaviour take over in input fields. 43781 if (hasSelection) { 43782 return; 43783 } 43784 } 43785 const { 43786 activeElement 43787 } = event.target.ownerDocument; 43788 if (!node.contains(activeElement)) { 43789 return; 43790 } 43791 const isSelectionMergeable = __unstableIsSelectionMergeable(); 43792 const shouldHandleWholeBlocks = __unstableIsSelectionCollapsed() || __unstableIsFullySelected(); 43793 const expandSelectionIsNeeded = !shouldHandleWholeBlocks && !isSelectionMergeable; 43794 if (event.type === 'copy' || event.type === 'cut') { 43795 event.preventDefault(); 43796 if (selectedBlockClientIds.length === 1) { 43797 flashBlock(selectedBlockClientIds[0]); 43798 } 43799 // If we have a partial selection that is not mergeable, just 43800 // expand the selection to the whole blocks. 43801 if (expandSelectionIsNeeded) { 43802 __unstableExpandSelection(); 43803 } else { 43804 notifyCopy(event.type, selectedBlockClientIds); 43805 let blocks; 43806 // Check if we have partial selection. 43807 if (shouldHandleWholeBlocks) { 43808 blocks = getBlocksByClientId(selectedBlockClientIds); 43809 } else { 43810 const [head, tail] = __unstableGetSelectedBlocksWithPartialSelection(); 43811 const inBetweenBlocks = getBlocksByClientId(selectedBlockClientIds.slice(1, selectedBlockClientIds.length - 1)); 43812 blocks = [head, ...inBetweenBlocks, tail]; 43813 } 43814 setClipboardBlocks(event, blocks, registry); 43815 } 43816 } 43817 if (event.type === 'cut') { 43818 // We need to also check if at the start we needed to 43819 // expand the selection, as in this point we might have 43820 // programmatically fully selected the blocks above. 43821 if (shouldHandleWholeBlocks && !expandSelectionIsNeeded) { 43822 removeBlocks(selectedBlockClientIds); 43823 } else { 43824 event.target.ownerDocument.activeElement.contentEditable = false; 43825 __unstableDeleteSelection(); 43826 } 43827 } else if (event.type === 'paste') { 43828 const { 43829 __experimentalCanUserUseUnfilteredHTML: canUserUseUnfilteredHTML 43830 } = getSettings(); 43831 const isInternal = event.clipboardData.getData('rich-text') === 'true'; 43832 if (isInternal) { 43833 return; 43834 } 43835 const { 43836 plainText, 43837 html, 43838 files 43839 } = getPasteEventData(event); 43840 const isFullySelected = __unstableIsFullySelected(); 43841 let blocks = []; 43842 if (files.length) { 43843 const fromTransforms = (0,external_wp_blocks_namespaceObject.getBlockTransforms)('from'); 43844 blocks = files.reduce((accumulator, file) => { 43845 const transformation = (0,external_wp_blocks_namespaceObject.findTransform)(fromTransforms, transform => transform.type === 'files' && transform.isMatch([file])); 43846 if (transformation) { 43847 accumulator.push(transformation.transform([file])); 43848 } 43849 return accumulator; 43850 }, []).flat(); 43851 } else { 43852 blocks = (0,external_wp_blocks_namespaceObject.pasteHandler)({ 43853 HTML: html, 43854 plainText, 43855 mode: isFullySelected ? 'BLOCKS' : 'AUTO', 43856 canUserUseUnfilteredHTML 43857 }); 43858 } 43859 43860 // Inline paste: let rich text handle it. 43861 if (typeof blocks === 'string') { 43862 return; 43863 } 43864 if (isFullySelected) { 43865 replaceBlocks(selectedBlockClientIds, blocks, blocks.length - 1, -1); 43866 event.preventDefault(); 43867 return; 43868 } 43869 43870 // If a block doesn't support splitting, let rich text paste 43871 // inline. 43872 if (!hasMultiSelection() && !(0,external_wp_blocks_namespaceObject.hasBlockSupport)(getBlockName(selectedBlockClientIds[0]), 'splitting', false) && !event.__deprecatedOnSplit) { 43873 return; 43874 } 43875 const [firstSelectedClientId] = selectedBlockClientIds; 43876 const rootClientId = getBlockRootClientId(firstSelectedClientId); 43877 const newBlocks = []; 43878 for (const block of blocks) { 43879 if (canInsertBlockType(block.name, rootClientId)) { 43880 newBlocks.push(block); 43881 } else { 43882 // If a block cannot be inserted in a root block, try 43883 // converting it to that root block type and insert the 43884 // inner blocks. 43885 // Example: paragraphs cannot be inserted into a list, 43886 // so convert the paragraphs to a list for list items. 43887 const rootBlockName = getBlockName(rootClientId); 43888 const switchedBlocks = block.name !== rootBlockName ? (0,external_wp_blocks_namespaceObject.switchToBlockType)(block, rootBlockName) : [block]; 43889 if (!switchedBlocks) { 43890 return; 43891 } 43892 for (const switchedBlock of switchedBlocks) { 43893 for (const innerBlock of switchedBlock.innerBlocks) { 43894 newBlocks.push(innerBlock); 43895 } 43896 } 43897 } 43898 } 43899 __unstableSplitSelection(newBlocks); 43900 event.preventDefault(); 43901 } 43902 } 43903 node.ownerDocument.addEventListener('copy', handler); 43904 node.ownerDocument.addEventListener('cut', handler); 43905 node.ownerDocument.addEventListener('paste', handler); 43906 return () => { 43907 node.ownerDocument.removeEventListener('copy', handler); 43908 node.ownerDocument.removeEventListener('cut', handler); 43909 node.ownerDocument.removeEventListener('paste', handler); 43910 }; 43911 }, []); 43912 } 43913 43914 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/writing-flow/index.js 43915 /** 43916 * External dependencies 43917 */ 43918 43919 43920 /** 43921 * WordPress dependencies 43922 */ 43923 43924 43925 43926 43927 43928 /** 43929 * Internal dependencies 43930 */ 43931 43932 43933 43934 43935 43936 43937 43938 43939 43940 43941 43942 43943 43944 function useWritingFlow() { 43945 const [before, ref, after] = useTabNav(); 43946 const hasMultiSelection = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).hasMultiSelection(), []); 43947 return [before, (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, useClipboardHandler(), useInput(), useDragSelection(), useSelectionObserver(), useClickSelection(), useMultiSelection(), useSelectAll(), useArrowNav(), (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 43948 node.tabIndex = 0; 43949 if (!hasMultiSelection) { 43950 return; 43951 } 43952 node.classList.add('has-multi-selection'); 43953 node.setAttribute('aria-label', (0,external_wp_i18n_namespaceObject.__)('Multiple selected blocks')); 43954 return () => { 43955 node.classList.remove('has-multi-selection'); 43956 node.removeAttribute('aria-label'); 43957 }; 43958 }, [hasMultiSelection])]), after]; 43959 } 43960 function WritingFlow({ 43961 children, 43962 ...props 43963 }, forwardedRef) { 43964 const [before, ref, after] = useWritingFlow(); 43965 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 43966 children: [before, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 43967 ...props, 43968 ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, forwardedRef]), 43969 className: dist_clsx(props.className, 'block-editor-writing-flow'), 43970 children: children 43971 }), after] 43972 }); 43973 } 43974 43975 /** 43976 * Handles selection and navigation across blocks. This component should be 43977 * wrapped around BlockList. 43978 * 43979 * @param {Object} props Component properties. 43980 * @param {Element} props.children Children to be rendered. 43981 */ 43982 /* harmony default export */ const writing_flow = ((0,external_wp_element_namespaceObject.forwardRef)(WritingFlow)); 43983 43984 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/iframe/get-compatibility-styles.js 43985 let compatibilityStyles = null; 43986 43987 /** 43988 * Returns a list of stylesheets that target the editor canvas. A stylesheet is 43989 * considered targetting the editor a canvas if it contains the 43990 * `editor-styles-wrapper`, `wp-block`, or `wp-block-*` class selectors. 43991 * 43992 * Ideally, this hook should be removed in the future and styles should be added 43993 * explicitly as editor styles. 43994 */ 43995 function getCompatibilityStyles() { 43996 if (compatibilityStyles) { 43997 return compatibilityStyles; 43998 } 43999 44000 // Only memoize the result once on load, since these stylesheets should not 44001 // change. 44002 compatibilityStyles = Array.from(document.styleSheets).reduce((accumulator, styleSheet) => { 44003 try { 44004 // May fail for external styles. 44005 // eslint-disable-next-line no-unused-expressions 44006 styleSheet.cssRules; 44007 } catch (e) { 44008 return accumulator; 44009 } 44010 const { 44011 ownerNode, 44012 cssRules 44013 } = styleSheet; 44014 44015 // Stylesheet is added by another stylesheet. See 44016 // https://developer.mozilla.org/en-US/docs/Web/API/StyleSheet/ownerNode#notes. 44017 if (ownerNode === null) { 44018 return accumulator; 44019 } 44020 if (!cssRules) { 44021 return accumulator; 44022 } 44023 44024 // Don't try to add the reset styles, which were removed as a dependency 44025 // from `edit-blocks` for the iframe since we don't need to reset admin 44026 // styles. 44027 if (['wp-reset-editor-styles-css', 'wp-reset-editor-styles-rtl-css'].includes(ownerNode.id)) { 44028 return accumulator; 44029 } 44030 44031 // Don't try to add styles without ID. Styles enqueued via the WP dependency system will always have IDs. 44032 if (!ownerNode.id) { 44033 return accumulator; 44034 } 44035 function matchFromRules(_cssRules) { 44036 return Array.from(_cssRules).find(({ 44037 selectorText, 44038 conditionText, 44039 cssRules: __cssRules 44040 }) => { 44041 // If the rule is conditional then it will not have selector text. 44042 // Recurse into child CSS ruleset to determine selector eligibility. 44043 if (conditionText) { 44044 return matchFromRules(__cssRules); 44045 } 44046 return selectorText && (selectorText.includes('.editor-styles-wrapper') || selectorText.includes('.wp-block')); 44047 }); 44048 } 44049 if (matchFromRules(cssRules)) { 44050 const isInline = ownerNode.tagName === 'STYLE'; 44051 if (isInline) { 44052 // If the current target is inline, 44053 // it could be a dependency of an existing stylesheet. 44054 // Look for that dependency and add it BEFORE the current target. 44055 const mainStylesCssId = ownerNode.id.replace('-inline-css', '-css'); 44056 const mainStylesElement = document.getElementById(mainStylesCssId); 44057 if (mainStylesElement) { 44058 accumulator.push(mainStylesElement.cloneNode(true)); 44059 } 44060 } 44061 accumulator.push(ownerNode.cloneNode(true)); 44062 if (!isInline) { 44063 // If the current target is not inline, 44064 // we still look for inline styles that could be relevant for the current target. 44065 // If they exist, add them AFTER the current target. 44066 const inlineStylesCssId = ownerNode.id.replace('-css', '-inline-css'); 44067 const inlineStylesElement = document.getElementById(inlineStylesCssId); 44068 if (inlineStylesElement) { 44069 accumulator.push(inlineStylesElement.cloneNode(true)); 44070 } 44071 } 44072 } 44073 return accumulator; 44074 }, []); 44075 return compatibilityStyles; 44076 } 44077 44078 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/iframe/index.js 44079 /* wp:polyfill */ 44080 /** 44081 * External dependencies 44082 */ 44083 44084 44085 /** 44086 * WordPress dependencies 44087 */ 44088 44089 44090 44091 44092 44093 44094 /** 44095 * Internal dependencies 44096 */ 44097 44098 44099 44100 44101 44102 44103 44104 function bubbleEvent(event, Constructor, frame) { 44105 const init = {}; 44106 for (const key in event) { 44107 init[key] = event[key]; 44108 } 44109 44110 // Check if the event is a MouseEvent generated within the iframe. 44111 // If so, adjust the coordinates to be relative to the position of 44112 // the iframe. This ensures that components such as Draggable 44113 // receive coordinates relative to the window, instead of relative 44114 // to the iframe. Without this, the Draggable event handler would 44115 // result in components "jumping" position as soon as the user 44116 // drags over the iframe. 44117 if (event instanceof frame.contentDocument.defaultView.MouseEvent) { 44118 const rect = frame.getBoundingClientRect(); 44119 init.clientX += rect.left; 44120 init.clientY += rect.top; 44121 } 44122 const newEvent = new Constructor(event.type, init); 44123 if (init.defaultPrevented) { 44124 newEvent.preventDefault(); 44125 } 44126 const cancelled = !frame.dispatchEvent(newEvent); 44127 if (cancelled) { 44128 event.preventDefault(); 44129 } 44130 } 44131 44132 /** 44133 * Bubbles some event types (keydown, keypress, and dragover) to parent document 44134 * document to ensure that the keyboard shortcuts and drag and drop work. 44135 * 44136 * Ideally, we should remove event bubbling in the future. Keyboard shortcuts 44137 * should be context dependent, e.g. actions on blocks like Cmd+A should not 44138 * work globally outside the block editor. 44139 * 44140 * @param {Document} iframeDocument Document to attach listeners to. 44141 */ 44142 function useBubbleEvents(iframeDocument) { 44143 return (0,external_wp_compose_namespaceObject.useRefEffect)(() => { 44144 const { 44145 defaultView 44146 } = iframeDocument; 44147 if (!defaultView) { 44148 return; 44149 } 44150 const { 44151 frameElement 44152 } = defaultView; 44153 const html = iframeDocument.documentElement; 44154 const eventTypes = ['dragover', 'mousemove']; 44155 const handlers = {}; 44156 for (const name of eventTypes) { 44157 handlers[name] = event => { 44158 const prototype = Object.getPrototypeOf(event); 44159 const constructorName = prototype.constructor.name; 44160 const Constructor = window[constructorName]; 44161 bubbleEvent(event, Constructor, frameElement); 44162 }; 44163 html.addEventListener(name, handlers[name]); 44164 } 44165 return () => { 44166 for (const name of eventTypes) { 44167 html.removeEventListener(name, handlers[name]); 44168 } 44169 }; 44170 }); 44171 } 44172 function Iframe({ 44173 contentRef, 44174 children, 44175 tabIndex = 0, 44176 scale = 1, 44177 frameSize = 0, 44178 readonly, 44179 forwardedRef: ref, 44180 title = (0,external_wp_i18n_namespaceObject.__)('Editor canvas'), 44181 ...props 44182 }) { 44183 const { 44184 resolvedAssets, 44185 isPreviewMode 44186 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 44187 const { 44188 getSettings 44189 } = select(store); 44190 const settings = getSettings(); 44191 return { 44192 resolvedAssets: settings.__unstableResolvedAssets, 44193 isPreviewMode: settings.__unstableIsPreviewMode 44194 }; 44195 }, []); 44196 const { 44197 styles = '', 44198 scripts = '' 44199 } = resolvedAssets; 44200 const [iframeDocument, setIframeDocument] = (0,external_wp_element_namespaceObject.useState)(); 44201 const initialContainerWidth = (0,external_wp_element_namespaceObject.useRef)(0); 44202 const [bodyClasses, setBodyClasses] = (0,external_wp_element_namespaceObject.useState)([]); 44203 const clearerRef = useBlockSelectionClearer(); 44204 const [before, writingFlowRef, after] = useWritingFlow(); 44205 const [contentResizeListener, { 44206 height: contentHeight 44207 }] = (0,external_wp_compose_namespaceObject.useResizeObserver)(); 44208 const [containerResizeListener, { 44209 width: containerWidth 44210 }] = (0,external_wp_compose_namespaceObject.useResizeObserver)(); 44211 const setRef = (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 44212 node._load = () => { 44213 setIframeDocument(node.contentDocument); 44214 }; 44215 let iFrameDocument; 44216 // Prevent the default browser action for files dropped outside of dropzones. 44217 function preventFileDropDefault(event) { 44218 event.preventDefault(); 44219 } 44220 function onLoad() { 44221 const { 44222 contentDocument, 44223 ownerDocument 44224 } = node; 44225 const { 44226 documentElement 44227 } = contentDocument; 44228 iFrameDocument = contentDocument; 44229 documentElement.classList.add('block-editor-iframe__html'); 44230 clearerRef(documentElement); 44231 44232 // Ideally ALL classes that are added through get_body_class should 44233 // be added in the editor too, which we'll somehow have to get from 44234 // the server in the future (which will run the PHP filters). 44235 setBodyClasses(Array.from(ownerDocument.body.classList).filter(name => name.startsWith('admin-color-') || name.startsWith('post-type-') || name === 'wp-embed-responsive')); 44236 contentDocument.dir = ownerDocument.dir; 44237 for (const compatStyle of getCompatibilityStyles()) { 44238 if (contentDocument.getElementById(compatStyle.id)) { 44239 continue; 44240 } 44241 contentDocument.head.appendChild(compatStyle.cloneNode(true)); 44242 if (!isPreviewMode) { 44243 // eslint-disable-next-line no-console 44244 console.warn(`$compatStyle.id} was added to the iframe incorrectly. Please use block.json or enqueue_block_assets to add styles to the iframe.`, compatStyle); 44245 } 44246 } 44247 iFrameDocument.addEventListener('dragover', preventFileDropDefault, false); 44248 iFrameDocument.addEventListener('drop', preventFileDropDefault, false); 44249 } 44250 node.addEventListener('load', onLoad); 44251 return () => { 44252 delete node._load; 44253 node.removeEventListener('load', onLoad); 44254 iFrameDocument?.removeEventListener('dragover', preventFileDropDefault); 44255 iFrameDocument?.removeEventListener('drop', preventFileDropDefault); 44256 }; 44257 }, []); 44258 const [iframeWindowInnerHeight, setIframeWindowInnerHeight] = (0,external_wp_element_namespaceObject.useState)(); 44259 const iframeResizeRef = (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 44260 const nodeWindow = node.ownerDocument.defaultView; 44261 setIframeWindowInnerHeight(nodeWindow.innerHeight); 44262 const onResize = () => { 44263 setIframeWindowInnerHeight(nodeWindow.innerHeight); 44264 }; 44265 nodeWindow.addEventListener('resize', onResize); 44266 return () => { 44267 nodeWindow.removeEventListener('resize', onResize); 44268 }; 44269 }, []); 44270 const [windowInnerWidth, setWindowInnerWidth] = (0,external_wp_element_namespaceObject.useState)(); 44271 const windowResizeRef = (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 44272 const nodeWindow = node.ownerDocument.defaultView; 44273 setWindowInnerWidth(nodeWindow.innerWidth); 44274 const onResize = () => { 44275 setWindowInnerWidth(nodeWindow.innerWidth); 44276 }; 44277 nodeWindow.addEventListener('resize', onResize); 44278 return () => { 44279 nodeWindow.removeEventListener('resize', onResize); 44280 }; 44281 }, []); 44282 const isZoomedOut = scale !== 1; 44283 (0,external_wp_element_namespaceObject.useEffect)(() => { 44284 if (!isZoomedOut) { 44285 initialContainerWidth.current = containerWidth; 44286 } 44287 }, [containerWidth, isZoomedOut]); 44288 const scaleContainerWidth = Math.max(initialContainerWidth.current, containerWidth); 44289 const disabledRef = (0,external_wp_compose_namespaceObject.useDisabled)({ 44290 isDisabled: !readonly 44291 }); 44292 const bodyRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([useBubbleEvents(iframeDocument), contentRef, clearerRef, writingFlowRef, disabledRef, 44293 // Avoid resize listeners when not needed, these will trigger 44294 // unnecessary re-renders when animating the iframe width, or when 44295 // expanding preview iframes. 44296 isZoomedOut ? iframeResizeRef : null]); 44297 44298 // Correct doctype is required to enable rendering in standards 44299 // mode. Also preload the styles to avoid a flash of unstyled 44300 // content. 44301 const html = `<!doctype html> 44302 <html> 44303 <head> 44304 <meta charset="utf-8"> 44305 <script>window.frameElement._load()</script> 44306 <style> 44307 html{ 44308 height: auto !important; 44309 min-height: 100%; 44310 } 44311 /* Lowest specificity to not override global styles */ 44312 :where(body) { 44313 margin: 0; 44314 /* Default background color in case zoom out mode background 44315 colors the html element */ 44316 background-color: white; 44317 } 44318 </style> 44319 $styles} 44320 $scripts} 44321 </head> 44322 <body> 44323 <script>document.currentScript.parentElement.remove()</script> 44324 </body> 44325 </html>`; 44326 const [src, cleanup] = (0,external_wp_element_namespaceObject.useMemo)(() => { 44327 const _src = URL.createObjectURL(new window.Blob([html], { 44328 type: 'text/html' 44329 })); 44330 return [_src, () => URL.revokeObjectURL(_src)]; 44331 }, [html]); 44332 (0,external_wp_element_namespaceObject.useEffect)(() => cleanup, [cleanup]); 44333 const zoomOutAnimationClassnameRef = (0,external_wp_element_namespaceObject.useRef)(null); 44334 44335 // Toggle zoom out CSS Classes only when zoom out mode changes. We could add these into the useEffect 44336 // that controls settings the CSS variables, but then we would need to do more work to ensure we're 44337 // only toggling these when the zoom out mode changes, as that useEffect is also triggered by a large 44338 // number of dependencies. 44339 (0,external_wp_element_namespaceObject.useEffect)(() => { 44340 if (!iframeDocument || !isZoomedOut) { 44341 return; 44342 } 44343 const handleZoomOutAnimationClassname = () => { 44344 clearTimeout(zoomOutAnimationClassnameRef.current); 44345 iframeDocument.documentElement.classList.add('zoom-out-animation'); 44346 zoomOutAnimationClassnameRef.current = setTimeout(() => { 44347 iframeDocument.documentElement.classList.remove('zoom-out-animation'); 44348 }, 400); // 400ms should match the animation speed used in components/iframe/content.scss 44349 }; 44350 handleZoomOutAnimationClassname(); 44351 iframeDocument.documentElement.classList.add('is-zoomed-out'); 44352 return () => { 44353 handleZoomOutAnimationClassname(); 44354 iframeDocument.documentElement.classList.remove('is-zoomed-out'); 44355 }; 44356 }, [iframeDocument, isZoomedOut]); 44357 44358 // Calculate the scaling and CSS variables for the zoom out canvas 44359 (0,external_wp_element_namespaceObject.useEffect)(() => { 44360 if (!iframeDocument || !isZoomedOut) { 44361 return; 44362 } 44363 const maxWidth = 750; 44364 // Note: When we initialize the zoom out when the canvas is smaller (sidebars open), 44365 // initialContainerWidth will be smaller than the full page, and reflow will happen 44366 // when the canvas area becomes larger due to sidebars closing. This is a known but 44367 // minor divergence for now. 44368 44369 // This scaling calculation has to happen within the JS because CSS calc() can 44370 // only divide and multiply by a unitless value. I.e. calc( 100px / 2 ) is valid 44371 // but calc( 100px / 2px ) is not. 44372 iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scale', scale === 'default' ? (Math.min(containerWidth, maxWidth) - parseInt(frameSize) * 2) / scaleContainerWidth : scale); 44373 44374 // frameSize has to be a px value for the scaling and frame size to be computed correctly. 44375 iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-frame-size', typeof frameSize === 'number' ? `$frameSize}px` : frameSize); 44376 iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-content-height', `$contentHeight}px`); 44377 iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-inner-height', `$iframeWindowInnerHeight}px`); 44378 iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-container-width', `$containerWidth}px`); 44379 iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scale-container-width', `$scaleContainerWidth}px`); 44380 return () => { 44381 iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-scale'); 44382 iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-frame-size'); 44383 iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-content-height'); 44384 iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-inner-height'); 44385 iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-container-width'); 44386 iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-scale-container-width'); 44387 }; 44388 }, [scale, frameSize, iframeDocument, iframeWindowInnerHeight, contentHeight, containerWidth, windowInnerWidth, isZoomedOut, scaleContainerWidth]); 44389 44390 // Make sure to not render the before and after focusable div elements in view 44391 // mode. They're only needed to capture focus in edit mode. 44392 const shouldRenderFocusCaptureElements = tabIndex >= 0 && !isPreviewMode; 44393 const iframe = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 44394 children: [shouldRenderFocusCaptureElements && before, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("iframe", { 44395 ...props, 44396 style: { 44397 ...props.style, 44398 height: props.style?.height, 44399 border: 0 44400 }, 44401 ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, setRef]), 44402 tabIndex: tabIndex 44403 // Correct doctype is required to enable rendering in standards 44404 // mode. Also preload the styles to avoid a flash of unstyled 44405 // content. 44406 , 44407 src: src, 44408 title: title, 44409 onKeyDown: event => { 44410 if (props.onKeyDown) { 44411 props.onKeyDown(event); 44412 } 44413 // If the event originates from inside the iframe, it means 44414 // it bubbled through the portal, but only with React 44415 // events. We need to to bubble native events as well, 44416 // though by doing so we also trigger another React event, 44417 // so we need to stop the propagation of this event to avoid 44418 // duplication. 44419 if (event.currentTarget.ownerDocument !== event.target.ownerDocument) { 44420 // We should only stop propagation of the React event, 44421 // the native event should further bubble inside the 44422 // iframe to the document and window. 44423 // Alternatively, we could consider redispatching the 44424 // native event in the iframe. 44425 const { 44426 stopPropagation 44427 } = event.nativeEvent; 44428 event.nativeEvent.stopPropagation = () => {}; 44429 event.stopPropagation(); 44430 event.nativeEvent.stopPropagation = stopPropagation; 44431 bubbleEvent(event, window.KeyboardEvent, event.currentTarget); 44432 } 44433 }, 44434 children: iframeDocument && (0,external_wp_element_namespaceObject.createPortal)( 44435 /*#__PURE__*/ 44436 // We want to prevent React events from bubbling throught the iframe 44437 // we bubble these manually. 44438 /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ 44439 (0,external_ReactJSXRuntime_namespaceObject.jsxs)("body", { 44440 ref: bodyRef, 44441 className: dist_clsx('block-editor-iframe__body', 'editor-styles-wrapper', ...bodyClasses), 44442 children: [contentResizeListener, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalStyleProvider, { 44443 document: iframeDocument, 44444 children: children 44445 })] 44446 }), iframeDocument.documentElement) 44447 }), shouldRenderFocusCaptureElements && after] 44448 }); 44449 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 44450 className: "block-editor-iframe__container", 44451 ref: windowResizeRef, 44452 children: [containerResizeListener, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 44453 className: dist_clsx('block-editor-iframe__scale-container', isZoomedOut && 'is-zoomed-out'), 44454 style: { 44455 '--wp-block-editor-iframe-zoom-out-scale-container-width': isZoomedOut && `$scaleContainerWidth}px` 44456 }, 44457 children: iframe 44458 })] 44459 }); 44460 } 44461 function IframeIfReady(props, ref) { 44462 const isInitialised = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getSettings().__internalIsInitialized, []); 44463 44464 // We shouldn't render the iframe until the editor settings are initialised. 44465 // The initial settings are needed to get the styles for the srcDoc, which 44466 // cannot be changed after the iframe is mounted. srcDoc is used to to set 44467 // the initial iframe HTML, which is required to avoid a flash of unstyled 44468 // content. 44469 if (!isInitialised) { 44470 return null; 44471 } 44472 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Iframe, { 44473 ...props, 44474 forwardedRef: ref 44475 }); 44476 } 44477 /* harmony default export */ const iframe = ((0,external_wp_element_namespaceObject.forwardRef)(IframeIfReady)); 44478 44479 ;// CONCATENATED MODULE: ./node_modules/parsel-js/dist/parsel.js 44480 const TOKENS = { 44481 attribute: /\[\s*(?:(?<namespace>\*|[-\w\P{ASCII}]*)\|)?(?<name>[-\w\P{ASCII}]+)\s*(?:(?<operator>\W?=)\s*(?<value>.+?)\s*(\s(?<caseSensitive>[iIsS]))?\s*)?\]/gu, 44482 id: /#(?<name>[-\w\P{ASCII}]+)/gu, 44483 class: /\.(?<name>[-\w\P{ASCII}]+)/gu, 44484 comma: /\s*,\s*/g, 44485 combinator: /\s*[\s>+~]\s*/g, 44486 'pseudo-element': /::(?<name>[-\w\P{ASCII}]+)(?:\((?<argument>¶*)\))?/gu, 44487 'pseudo-class': /:(?<name>[-\w\P{ASCII}]+)(?:\((?<argument>¶*)\))?/gu, 44488 universal: /(?:(?<namespace>\*|[-\w\P{ASCII}]*)\|)?\*/gu, 44489 type: /(?:(?<namespace>\*|[-\w\P{ASCII}]*)\|)?(?<name>[-\w\P{ASCII}]+)/gu, // this must be last 44490 }; 44491 const TRIM_TOKENS = new Set(['combinator', 'comma']); 44492 const RECURSIVE_PSEUDO_CLASSES = new Set([ 44493 'not', 44494 'is', 44495 'where', 44496 'has', 44497 'matches', 44498 '-moz-any', 44499 '-webkit-any', 44500 'nth-child', 44501 'nth-last-child', 44502 ]); 44503 const nthChildRegExp = /(?<index>[\dn+-]+)\s+of\s+(?<subtree>.+)/; 44504 const RECURSIVE_PSEUDO_CLASSES_ARGS = { 44505 'nth-child': nthChildRegExp, 44506 'nth-last-child': nthChildRegExp, 44507 }; 44508 const getArgumentPatternByType = (type) => { 44509 switch (type) { 44510 case 'pseudo-element': 44511 case 'pseudo-class': 44512 return new RegExp(TOKENS[type].source.replace('(?<argument>¶*)', '(?<argument>.*)'), 'gu'); 44513 default: 44514 return TOKENS[type]; 44515 } 44516 }; 44517 function gobbleParens(text, offset) { 44518 let nesting = 0; 44519 let result = ''; 44520 for (; offset < text.length; offset++) { 44521 const char = text[offset]; 44522 switch (char) { 44523 case '(': 44524 ++nesting; 44525 break; 44526 case ')': 44527 --nesting; 44528 break; 44529 } 44530 result += char; 44531 if (nesting === 0) { 44532 return result; 44533 } 44534 } 44535 return result; 44536 } 44537 function tokenizeBy(text, grammar = TOKENS) { 44538 if (!text) { 44539 return []; 44540 } 44541 const tokens = [text]; 44542 for (const [type, pattern] of Object.entries(grammar)) { 44543 for (let i = 0; i < tokens.length; i++) { 44544 const token = tokens[i]; 44545 if (typeof token !== 'string') { 44546 continue; 44547 } 44548 pattern.lastIndex = 0; 44549 const match = pattern.exec(token); 44550 if (!match) { 44551 continue; 44552 } 44553 const from = match.index - 1; 44554 const args = []; 44555 const content = match[0]; 44556 const before = token.slice(0, from + 1); 44557 if (before) { 44558 args.push(before); 44559 } 44560 args.push({ 44561 ...match.groups, 44562 type, 44563 content, 44564 }); 44565 const after = token.slice(from + content.length + 1); 44566 if (after) { 44567 args.push(after); 44568 } 44569 tokens.splice(i, 1, ...args); 44570 } 44571 } 44572 let offset = 0; 44573 for (const token of tokens) { 44574 switch (typeof token) { 44575 case 'string': 44576 throw new Error(`Unexpected sequence $token} found at index $offset}`); 44577 case 'object': 44578 offset += token.content.length; 44579 token.pos = [offset - token.content.length, offset]; 44580 if (TRIM_TOKENS.has(token.type)) { 44581 token.content = token.content.trim() || ' '; 44582 } 44583 break; 44584 } 44585 } 44586 return tokens; 44587 } 44588 const STRING_PATTERN = /(['"])([^\\\n]+?)\1/g; 44589 const ESCAPE_PATTERN = /\\./g; 44590 function parsel_tokenize(selector, grammar = TOKENS) { 44591 // Prevent leading/trailing whitespaces from being interpreted as combinators 44592 selector = selector.trim(); 44593 if (selector === '') { 44594 return []; 44595 } 44596 const replacements = []; 44597 // Replace escapes with placeholders. 44598 selector = selector.replace(ESCAPE_PATTERN, (value, offset) => { 44599 replacements.push({ value, offset }); 44600 return '\uE000'.repeat(value.length); 44601 }); 44602 // Replace strings with placeholders. 44603 selector = selector.replace(STRING_PATTERN, (value, quote, content, offset) => { 44604 replacements.push({ value, offset }); 44605 return `$quote}${'\uE001'.repeat(content.length)}$quote}`; 44606 }); 44607 // Replace parentheses with placeholders. 44608 { 44609 let pos = 0; 44610 let offset; 44611 while ((offset = selector.indexOf('(', pos)) > -1) { 44612 const value = gobbleParens(selector, offset); 44613 replacements.push({ value, offset }); 44614 selector = `$selector.substring(0, offset)}(${'¶'.repeat(value.length - 2)})$selector.substring(offset + value.length)}`; 44615 pos = offset + value.length; 44616 } 44617 } 44618 // Now we have no nested structures and we can parse with regexes 44619 const tokens = tokenizeBy(selector, grammar); 44620 // Replace placeholders in reverse order. 44621 const changedTokens = new Set(); 44622 for (const replacement of replacements.reverse()) { 44623 for (const token of tokens) { 44624 const { offset, value } = replacement; 44625 if (!(token.pos[0] <= offset && 44626 offset + value.length <= token.pos[1])) { 44627 continue; 44628 } 44629 const { content } = token; 44630 const tokenOffset = offset - token.pos[0]; 44631 token.content = 44632 content.slice(0, tokenOffset) + 44633 value + 44634 content.slice(tokenOffset + value.length); 44635 if (token.content !== content) { 44636 changedTokens.add(token); 44637 } 44638 } 44639 } 44640 // Update changed tokens. 44641 for (const token of changedTokens) { 44642 const pattern = getArgumentPatternByType(token.type); 44643 if (!pattern) { 44644 throw new Error(`Unknown token type: $token.type}`); 44645 } 44646 pattern.lastIndex = 0; 44647 const match = pattern.exec(token.content); 44648 if (!match) { 44649 throw new Error(`Unable to parse content for $token.type}: $token.content}`); 44650 } 44651 Object.assign(token, match.groups); 44652 } 44653 return tokens; 44654 } 44655 /** 44656 * Convert a flat list of tokens into a tree of complex & compound selectors 44657 */ 44658 function nestTokens(tokens, { list = true } = {}) { 44659 if (list && tokens.find((t) => t.type === 'comma')) { 44660 const selectors = []; 44661 const temp = []; 44662 for (let i = 0; i < tokens.length; i++) { 44663 if (tokens[i].type === 'comma') { 44664 if (temp.length === 0) { 44665 throw new Error('Incorrect comma at ' + i); 44666 } 44667 selectors.push(nestTokens(temp, { list: false })); 44668 temp.length = 0; 44669 } 44670 else { 44671 temp.push(tokens[i]); 44672 } 44673 } 44674 if (temp.length === 0) { 44675 throw new Error('Trailing comma'); 44676 } 44677 else { 44678 selectors.push(nestTokens(temp, { list: false })); 44679 } 44680 return { type: 'list', list: selectors }; 44681 } 44682 for (let i = tokens.length - 1; i >= 0; i--) { 44683 let token = tokens[i]; 44684 if (token.type === 'combinator') { 44685 let left = tokens.slice(0, i); 44686 let right = tokens.slice(i + 1); 44687 return { 44688 type: 'complex', 44689 combinator: token.content, 44690 left: nestTokens(left), 44691 right: nestTokens(right), 44692 }; 44693 } 44694 } 44695 switch (tokens.length) { 44696 case 0: 44697 throw new Error('Could not build AST.'); 44698 case 1: 44699 // If we're here, there are no combinators, so it's just a list. 44700 return tokens[0]; 44701 default: 44702 return { 44703 type: 'compound', 44704 list: [...tokens], // clone to avoid pointers messing up the AST 44705 }; 44706 } 44707 } 44708 /** 44709 * Traverse an AST in depth-first order 44710 */ 44711 function* flatten(node, 44712 /** 44713 * @internal 44714 */ 44715 parent) { 44716 switch (node.type) { 44717 case 'list': 44718 for (let child of node.list) { 44719 yield* flatten(child, node); 44720 } 44721 break; 44722 case 'complex': 44723 yield* flatten(node.left, node); 44724 yield* flatten(node.right, node); 44725 break; 44726 case 'compound': 44727 yield* node.list.map((token) => [token, node]); 44728 break; 44729 default: 44730 yield [node, parent]; 44731 } 44732 } 44733 /** 44734 * Traverse an AST (or part thereof), in depth-first order 44735 */ 44736 function walk(node, visit, 44737 /** 44738 * @internal 44739 */ 44740 parent) { 44741 if (!node) { 44742 return; 44743 } 44744 for (const [token, ast] of flatten(node, parent)) { 44745 visit(token, ast); 44746 } 44747 } 44748 /** 44749 * Parse a CSS selector 44750 * 44751 * @param selector - The selector to parse 44752 * @param options.recursive - Whether to parse the arguments of pseudo-classes like :is(), :has() etc. Defaults to true. 44753 * @param options.list - Whether this can be a selector list (A, B, C etc). Defaults to true. 44754 */ 44755 function parse(selector, { recursive = true, list = true } = {}) { 44756 const tokens = parsel_tokenize(selector); 44757 if (!tokens) { 44758 return; 44759 } 44760 const ast = nestTokens(tokens, { list }); 44761 if (!recursive) { 44762 return ast; 44763 } 44764 for (const [token] of flatten(ast)) { 44765 if (token.type !== 'pseudo-class' || !token.argument) { 44766 continue; 44767 } 44768 if (!RECURSIVE_PSEUDO_CLASSES.has(token.name)) { 44769 continue; 44770 } 44771 let argument = token.argument; 44772 const childArg = RECURSIVE_PSEUDO_CLASSES_ARGS[token.name]; 44773 if (childArg) { 44774 const match = childArg.exec(argument); 44775 if (!match) { 44776 continue; 44777 } 44778 Object.assign(token, match.groups); 44779 argument = match.groups['subtree']; 44780 } 44781 if (!argument) { 44782 continue; 44783 } 44784 Object.assign(token, { 44785 subtree: parse(argument, { 44786 recursive: true, 44787 list: true, 44788 }), 44789 }); 44790 } 44791 return ast; 44792 } 44793 /** 44794 * Converts the given list or (sub)tree to a string. 44795 */ 44796 function stringify(listOrNode) { 44797 let tokens; 44798 if (Array.isArray(listOrNode)) { 44799 tokens = listOrNode; 44800 } 44801 else { 44802 tokens = [...flatten(listOrNode)].map(([token]) => token); 44803 } 44804 return tokens.map(token => token.content).join(''); 44805 } 44806 /** 44807 * To convert the specificity array to a number 44808 */ 44809 function specificityToNumber(specificity, base) { 44810 base = base || Math.max(...specificity) + 1; 44811 return (specificity[0] * (base << 1) + specificity[1] * base + specificity[2]); 44812 } 44813 /** 44814 * Calculate specificity of a selector. 44815 * 44816 * If the selector is a list, the max specificity is returned. 44817 */ 44818 function specificity(selector) { 44819 let ast = selector; 44820 if (typeof ast === 'string') { 44821 ast = parse(ast, { recursive: true }); 44822 } 44823 if (!ast) { 44824 return []; 44825 } 44826 if (ast.type === 'list' && 'list' in ast) { 44827 let base = 10; 44828 const specificities = ast.list.map((ast) => { 44829 const sp = specificity(ast); 44830 base = Math.max(base, ...specificity(ast)); 44831 return sp; 44832 }); 44833 const numbers = specificities.map((ast) => specificityToNumber(ast, base)); 44834 return specificities[numbers.indexOf(Math.max(...numbers))]; 44835 } 44836 const ret = [0, 0, 0]; 44837 for (const [token] of flatten(ast)) { 44838 switch (token.type) { 44839 case 'id': 44840 ret[0]++; 44841 break; 44842 case 'class': 44843 case 'attribute': 44844 ret[1]++; 44845 break; 44846 case 'pseudo-element': 44847 case 'type': 44848 ret[2]++; 44849 break; 44850 case 'pseudo-class': 44851 if (token.name === 'where') { 44852 break; 44853 } 44854 if (!RECURSIVE_PSEUDO_CLASSES.has(token.name) || 44855 !token.subtree) { 44856 ret[1]++; 44857 break; 44858 } 44859 const sub = specificity(token.subtree); 44860 sub.forEach((s, i) => (ret[i] += s)); 44861 // :nth-child() & :nth-last-child() add (0, 1, 0) to the specificity of their most complex selector 44862 if (token.name === 'nth-child' || 44863 token.name === 'nth-last-child') { 44864 ret[1]++; 44865 } 44866 } 44867 } 44868 return ret; 44869 } 44870 44871 44872 44873 // EXTERNAL MODULE: ./node_modules/postcss/lib/postcss.js 44874 var postcss = __webpack_require__(4529); 44875 ;// CONCATENATED MODULE: ./node_modules/postcss/lib/postcss.mjs 44876 44877 44878 /* harmony default export */ const lib_postcss = (postcss); 44879 44880 const postcss_stringify = postcss.stringify 44881 const fromJSON = postcss.fromJSON 44882 const postcss_plugin = postcss.plugin 44883 const postcss_parse = postcss.parse 44884 const list = postcss.list 44885 44886 const postcss_document = postcss.document 44887 const comment = postcss.comment 44888 const atRule = postcss.atRule 44889 const rule = postcss.rule 44890 const decl = postcss.decl 44891 const root = postcss.root 44892 44893 const CssSyntaxError = postcss.CssSyntaxError 44894 const Declaration = postcss.Declaration 44895 const Container = postcss.Container 44896 const Processor = postcss.Processor 44897 const Document = postcss.Document 44898 const Comment = postcss.Comment 44899 const postcss_Warning = postcss.Warning 44900 const AtRule = postcss.AtRule 44901 const Result = postcss.Result 44902 const Input = postcss.Input 44903 const Rule = postcss.Rule 44904 const postcss_Root = postcss.Root 44905 const Node = postcss.Node 44906 44907 // EXTERNAL MODULE: ./node_modules/postcss-prefix-selector/index.js 44908 var postcss_prefix_selector = __webpack_require__(1443); 44909 var postcss_prefix_selector_default = /*#__PURE__*/__webpack_require__.n(postcss_prefix_selector); 44910 // EXTERNAL MODULE: ./node_modules/postcss-urlrebase/index.js 44911 var postcss_urlrebase = __webpack_require__(5404); 44912 var postcss_urlrebase_default = /*#__PURE__*/__webpack_require__.n(postcss_urlrebase); 44913 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/transform-styles/index.js 44914 /** 44915 * External dependencies 44916 */ 44917 44918 44919 44920 44921 const cacheByWrapperSelector = new Map(); 44922 const ROOT_SELECTOR_TOKENS = [{ 44923 type: 'type', 44924 content: 'body' 44925 }, { 44926 type: 'type', 44927 content: 'html' 44928 }, { 44929 type: 'pseudo-class', 44930 content: ':root' 44931 }, { 44932 type: 'pseudo-class', 44933 content: ':where(body)' 44934 }, { 44935 type: 'pseudo-class', 44936 content: ':where(:root)' 44937 }, { 44938 type: 'pseudo-class', 44939 content: ':where(html)' 44940 }]; 44941 44942 /** 44943 * Prefixes root selectors in a way that ensures consistent specificity. 44944 * This requires special handling, since prefixing a classname before 44945 * html, body, or :root will generally result in an invalid selector. 44946 * 44947 * Some libraries will simply replace the root selector with the prefix 44948 * instead, but this results in inconsistent specificity. 44949 * 44950 * This function instead inserts the prefix after the root tags but before 44951 * any other part of the selector. This results in consistent specificity: 44952 * - If a `:where()` selector is used for the prefix, all selectors output 44953 * by `transformStyles` will have no specificity increase. 44954 * - If a classname, id, or something else is used as the prefix, all selectors 44955 * will have the same specificity bump when transformed. 44956 * 44957 * @param {string} prefix The prefix. 44958 * @param {string} selector The selector. 44959 * 44960 * @return {string} The prefixed root selector. 44961 */ 44962 function prefixRootSelector(prefix, selector) { 44963 // Use a tokenizer, since regular expressions are unreliable. 44964 const tokenized = parsel_tokenize(selector); 44965 44966 // Find the last token that contains a root selector by walking back 44967 // through the tokens. 44968 const lastRootIndex = tokenized.findLastIndex(({ 44969 content, 44970 type 44971 }) => { 44972 return ROOT_SELECTOR_TOKENS.some(rootSelector => content === rootSelector.content && type === rootSelector.type); 44973 }); 44974 44975 // Walk forwards to find the combinator after the last root. 44976 // This is where the root ends and the rest of the selector begins, 44977 // and the index to insert before. 44978 // Doing it this way takes into account that a root selector like 44979 // 'body' may have additional id/class/pseudo-class/attribute-selector 44980 // parts chained to it, which is difficult to quantify using a regex. 44981 let insertionPoint = -1; 44982 for (let i = lastRootIndex + 1; i < tokenized.length; i++) { 44983 if (tokenized[i].type === 'combinator') { 44984 insertionPoint = i; 44985 break; 44986 } 44987 } 44988 44989 // Tokenize and insert the prefix with a ' ' combinator before it. 44990 const tokenizedPrefix = parsel_tokenize(prefix); 44991 tokenized.splice( 44992 // Insert at the insertion point, or the end. 44993 insertionPoint === -1 ? tokenized.length : insertionPoint, 0, { 44994 type: 'combinator', 44995 content: ' ' 44996 }, ...tokenizedPrefix); 44997 return stringify(tokenized); 44998 } 44999 function transformStyle({ 45000 css, 45001 ignoredSelectors = [], 45002 baseURL 45003 }, wrapperSelector = '', transformOptions) { 45004 // When there is no wrapper selector and no base URL, there is no need 45005 // to transform the CSS. This is most cases because in the default 45006 // iframed editor, no wrapping is needed, and not many styles 45007 // provide a base URL. 45008 if (!wrapperSelector && !baseURL) { 45009 return css; 45010 } 45011 try { 45012 var _transformOptions$ign; 45013 const excludedSelectors = [...ignoredSelectors, ...((_transformOptions$ign = transformOptions?.ignoredSelectors) !== null && _transformOptions$ign !== void 0 ? _transformOptions$ign : []), wrapperSelector]; 45014 return lib_postcss([wrapperSelector && postcss_prefix_selector_default()({ 45015 prefix: wrapperSelector, 45016 transform(prefix, selector, prefixedSelector) { 45017 // For backwards compatibility, don't use the `exclude` option 45018 // of postcss-prefix-selector, instead handle it here to match 45019 // the behavior of the old library (postcss-prefix-wrap) that 45020 // `transformStyle` previously used. 45021 if (excludedSelectors.some(excludedSelector => excludedSelector instanceof RegExp ? selector.match(excludedSelector) : selector.includes(excludedSelector))) { 45022 return selector; 45023 } 45024 const hasRootSelector = ROOT_SELECTOR_TOKENS.some(rootSelector => selector.startsWith(rootSelector.content)); 45025 45026 // Reorganize root selectors such that the root part comes before the prefix, 45027 // but the prefix still comes before the remaining part of the selector. 45028 if (hasRootSelector) { 45029 return prefixRootSelector(prefix, selector); 45030 } 45031 return prefixedSelector; 45032 } 45033 }), baseURL && postcss_urlrebase_default()({ 45034 rootUrl: baseURL 45035 })].filter(Boolean)).process(css, {}).css; // use sync PostCSS API 45036 } catch (error) { 45037 if (error instanceof CssSyntaxError) { 45038 // eslint-disable-next-line no-console 45039 console.warn('wp.blockEditor.transformStyles Failed to transform CSS.', error.message + '\n' + error.showSourceCode(false)); 45040 } else { 45041 // eslint-disable-next-line no-console 45042 console.warn('wp.blockEditor.transformStyles Failed to transform CSS.', error); 45043 } 45044 return null; 45045 } 45046 } 45047 45048 /** 45049 * @typedef {Object} EditorStyle 45050 * @property {string} css the CSS block(s), as a single string. 45051 * @property {?string} baseURL the base URL to be used as the reference when rewritting urls. 45052 * @property {?string[]} ignoredSelectors the selectors not to wrap. 45053 */ 45054 45055 /** 45056 * @typedef {Object} TransformOptions 45057 * @property {?string[]} ignoredSelectors the selectors not to wrap. 45058 */ 45059 45060 /** 45061 * Applies a series of CSS rule transforms to wrap selectors inside a given class and/or rewrite URLs depending on the parameters passed. 45062 * 45063 * @param {EditorStyle[]} styles CSS rules. 45064 * @param {string} wrapperSelector Wrapper selector. 45065 * @param {TransformOptions} transformOptions Additional options for style transformation. 45066 * @return {Array} converted rules. 45067 */ 45068 const transform_styles_transformStyles = (styles, wrapperSelector = '', transformOptions) => { 45069 let cache = cacheByWrapperSelector.get(wrapperSelector); 45070 if (!cache) { 45071 cache = new WeakMap(); 45072 cacheByWrapperSelector.set(wrapperSelector, cache); 45073 } 45074 return styles.map(style => { 45075 let css = cache.get(style); 45076 if (!css) { 45077 css = transformStyle(style, wrapperSelector, transformOptions); 45078 cache.set(style, css); 45079 } 45080 return css; 45081 }); 45082 }; 45083 /* harmony default export */ const transform_styles = (transform_styles_transformStyles); 45084 45085 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/editor-styles/index.js 45086 /** 45087 * External dependencies 45088 */ 45089 45090 45091 45092 45093 /** 45094 * WordPress dependencies 45095 */ 45096 45097 45098 45099 45100 /** 45101 * Internal dependencies 45102 */ 45103 45104 45105 45106 45107 45108 45109 k([names, a11y]); 45110 function useDarkThemeBodyClassName(styles, scope) { 45111 return (0,external_wp_element_namespaceObject.useCallback)(node => { 45112 if (!node) { 45113 return; 45114 } 45115 const { 45116 ownerDocument 45117 } = node; 45118 const { 45119 defaultView, 45120 body 45121 } = ownerDocument; 45122 const canvas = scope ? ownerDocument.querySelector(scope) : body; 45123 let backgroundColor; 45124 if (!canvas) { 45125 // The real .editor-styles-wrapper element might not exist in the 45126 // DOM, so calculate the background color by creating a fake 45127 // wrapper. 45128 const tempCanvas = ownerDocument.createElement('div'); 45129 tempCanvas.classList.add('editor-styles-wrapper'); 45130 body.appendChild(tempCanvas); 45131 backgroundColor = defaultView?.getComputedStyle(tempCanvas, null).getPropertyValue('background-color'); 45132 body.removeChild(tempCanvas); 45133 } else { 45134 backgroundColor = defaultView?.getComputedStyle(canvas, null).getPropertyValue('background-color'); 45135 } 45136 const colordBackgroundColor = w(backgroundColor); 45137 // If background is transparent, it should be treated as light color. 45138 if (colordBackgroundColor.luminance() > 0.5 || colordBackgroundColor.alpha() === 0) { 45139 body.classList.remove('is-dark-theme'); 45140 } else { 45141 body.classList.add('is-dark-theme'); 45142 } 45143 }, [styles, scope]); 45144 } 45145 function EditorStyles({ 45146 styles, 45147 scope, 45148 transformOptions 45149 }) { 45150 const overrides = (0,external_wp_data_namespaceObject.useSelect)(select => unlock(select(store)).getStyleOverrides(), []); 45151 const [transformedStyles, transformedSvgs] = (0,external_wp_element_namespaceObject.useMemo)(() => { 45152 const _styles = Object.values(styles !== null && styles !== void 0 ? styles : []); 45153 for (const [id, override] of overrides) { 45154 const index = _styles.findIndex(({ 45155 id: _id 45156 }) => id === _id); 45157 const overrideWithId = { 45158 ...override, 45159 id 45160 }; 45161 if (index === -1) { 45162 _styles.push(overrideWithId); 45163 } else { 45164 _styles[index] = overrideWithId; 45165 } 45166 } 45167 return [transform_styles(_styles.filter(style => style?.css), scope, transformOptions), _styles.filter(style => style.__unstableType === 'svgs').map(style => style.assets).join('')]; 45168 }, [styles, overrides, scope, transformOptions]); 45169 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 45170 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("style", { 45171 ref: useDarkThemeBodyClassName(transformedStyles, scope) 45172 }), transformedStyles.map((css, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("style", { 45173 children: css 45174 }, index)), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SVG, { 45175 xmlns: "http://www.w3.org/2000/svg", 45176 viewBox: "0 0 0 0", 45177 width: "0", 45178 height: "0", 45179 role: "none", 45180 style: { 45181 visibility: 'hidden', 45182 position: 'absolute', 45183 left: '-9999px', 45184 overflow: 'hidden' 45185 }, 45186 dangerouslySetInnerHTML: { 45187 __html: transformedSvgs 45188 } 45189 })] 45190 }); 45191 } 45192 /* harmony default export */ const editor_styles = ((0,external_wp_element_namespaceObject.memo)(EditorStyles)); 45193 45194 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-preview/auto.js 45195 /** 45196 * WordPress dependencies 45197 */ 45198 45199 45200 45201 45202 45203 /** 45204 * Internal dependencies 45205 */ 45206 45207 45208 45209 45210 45211 // This is used to avoid rendering the block list if the sizes change. 45212 45213 45214 45215 let MemoizedBlockList; 45216 const MAX_HEIGHT = 2000; 45217 const EMPTY_ADDITIONAL_STYLES = []; 45218 function ScaledBlockPreview({ 45219 viewportWidth, 45220 containerWidth, 45221 minHeight, 45222 additionalStyles = EMPTY_ADDITIONAL_STYLES 45223 }) { 45224 if (!viewportWidth) { 45225 viewportWidth = containerWidth; 45226 } 45227 const [contentResizeListener, { 45228 height: contentHeight 45229 }] = (0,external_wp_compose_namespaceObject.useResizeObserver)(); 45230 const { 45231 styles 45232 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 45233 const settings = select(store).getSettings(); 45234 return { 45235 styles: settings.styles 45236 }; 45237 }, []); 45238 45239 // Avoid scrollbars for pattern previews. 45240 const editorStyles = (0,external_wp_element_namespaceObject.useMemo)(() => { 45241 if (styles) { 45242 return [...styles, { 45243 css: 'body{height:auto;overflow:hidden;border:none;padding:0;}', 45244 __unstableType: 'presets' 45245 }, ...additionalStyles]; 45246 } 45247 return styles; 45248 }, [styles, additionalStyles]); 45249 45250 // Initialize on render instead of module top level, to avoid circular dependency issues. 45251 MemoizedBlockList = MemoizedBlockList || (0,external_wp_element_namespaceObject.memo)(BlockList); 45252 const scale = containerWidth / viewportWidth; 45253 const aspectRatio = contentHeight ? containerWidth / (contentHeight * scale) : 0; 45254 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Disabled, { 45255 className: "block-editor-block-preview__content", 45256 style: { 45257 transform: `scale($scale})`, 45258 // Using width + aspect-ratio instead of height here triggers browsers' native 45259 // handling of scrollbar's visibility. It prevents the flickering issue seen 45260 // in https://github.com/WordPress/gutenberg/issues/52027. 45261 // See https://github.com/WordPress/gutenberg/pull/52921 for more info. 45262 aspectRatio, 45263 maxHeight: contentHeight > MAX_HEIGHT ? MAX_HEIGHT * scale : undefined, 45264 minHeight 45265 }, 45266 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(iframe, { 45267 contentRef: (0,external_wp_compose_namespaceObject.useRefEffect)(bodyElement => { 45268 const { 45269 ownerDocument: { 45270 documentElement 45271 } 45272 } = bodyElement; 45273 documentElement.classList.add('block-editor-block-preview__content-iframe'); 45274 documentElement.style.position = 'absolute'; 45275 documentElement.style.width = '100%'; 45276 45277 // Necessary for contentResizeListener to work. 45278 bodyElement.style.boxSizing = 'border-box'; 45279 bodyElement.style.position = 'absolute'; 45280 bodyElement.style.width = '100%'; 45281 }, []), 45282 "aria-hidden": true, 45283 tabIndex: -1, 45284 style: { 45285 position: 'absolute', 45286 width: viewportWidth, 45287 height: contentHeight, 45288 pointerEvents: 'none', 45289 // This is a catch-all max-height for patterns. 45290 // See: https://github.com/WordPress/gutenberg/pull/38175. 45291 maxHeight: MAX_HEIGHT, 45292 minHeight: scale !== 0 && scale < 1 && minHeight ? minHeight / scale : minHeight 45293 }, 45294 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(editor_styles, { 45295 styles: editorStyles 45296 }), contentResizeListener, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MemoizedBlockList, { 45297 renderAppender: false 45298 })] 45299 }) 45300 }); 45301 } 45302 function AutoBlockPreview(props) { 45303 const [containerResizeListener, { 45304 width: containerWidth 45305 }] = (0,external_wp_compose_namespaceObject.useResizeObserver)(); 45306 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 45307 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45308 style: { 45309 position: 'relative', 45310 width: '100%', 45311 height: 0 45312 }, 45313 children: containerResizeListener 45314 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45315 className: "block-editor-block-preview__container", 45316 children: !!containerWidth && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ScaledBlockPreview, { 45317 ...props, 45318 containerWidth: containerWidth 45319 }) 45320 })] 45321 }); 45322 } 45323 45324 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-preview/index.js 45325 /** 45326 * External dependencies 45327 */ 45328 45329 45330 /** 45331 * WordPress dependencies 45332 */ 45333 45334 45335 45336 45337 45338 /** 45339 * Internal dependencies 45340 */ 45341 45342 45343 45344 45345 45346 45347 45348 const block_preview_EMPTY_ADDITIONAL_STYLES = []; 45349 function BlockPreview({ 45350 blocks, 45351 viewportWidth = 1200, 45352 minHeight, 45353 additionalStyles = block_preview_EMPTY_ADDITIONAL_STYLES, 45354 // Deprecated props: 45355 __experimentalMinHeight, 45356 __experimentalPadding 45357 }) { 45358 if (__experimentalMinHeight) { 45359 minHeight = __experimentalMinHeight; 45360 external_wp_deprecated_default()('The __experimentalMinHeight prop', { 45361 since: '6.2', 45362 version: '6.4', 45363 alternative: 'minHeight' 45364 }); 45365 } 45366 if (__experimentalPadding) { 45367 additionalStyles = [...additionalStyles, { 45368 css: `body { padding: $__experimentalPadding}px; }` 45369 }]; 45370 external_wp_deprecated_default()('The __experimentalPadding prop of BlockPreview', { 45371 since: '6.2', 45372 version: '6.4', 45373 alternative: 'additionalStyles' 45374 }); 45375 } 45376 const originalSettings = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getSettings(), []); 45377 const settings = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 45378 ...originalSettings, 45379 focusMode: false, 45380 // Disable "Spotlight mode". 45381 __unstableIsPreviewMode: true 45382 }), [originalSettings]); 45383 const renderedBlocks = (0,external_wp_element_namespaceObject.useMemo)(() => Array.isArray(blocks) ? blocks : [blocks], [blocks]); 45384 if (!blocks || blocks.length === 0) { 45385 return null; 45386 } 45387 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ExperimentalBlockEditorProvider, { 45388 value: renderedBlocks, 45389 settings: settings, 45390 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AutoBlockPreview, { 45391 viewportWidth: viewportWidth, 45392 minHeight: minHeight, 45393 additionalStyles: additionalStyles 45394 }) 45395 }); 45396 } 45397 45398 /** 45399 * BlockPreview renders a preview of a block or array of blocks. 45400 * 45401 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-preview/README.md 45402 * 45403 * @param {Object} preview options for how the preview should be shown 45404 * @param {Array|Object} preview.blocks A block instance (object) or an array of blocks to be previewed. 45405 * @param {number} preview.viewportWidth Width of the preview container in pixels. Controls at what size the blocks will be rendered inside the preview. Default: 700. 45406 * 45407 * @return {Component} The component to be rendered. 45408 */ 45409 /* harmony default export */ const block_preview = ((0,external_wp_element_namespaceObject.memo)(BlockPreview)); 45410 45411 /** 45412 * This hook is used to lightly mark an element as a block preview wrapper 45413 * element. Call this hook and pass the returned props to the element to mark as 45414 * a block preview wrapper, automatically rendering inner blocks as children. If 45415 * you define a ref for the element, it is important to pass the ref to this 45416 * hook, which the hook in turn will pass to the component through the props it 45417 * returns. Optionally, you can also pass any other props through this hook, and 45418 * they will be merged and returned. 45419 * 45420 * @param {Object} options Preview options. 45421 * @param {WPBlock[]} options.blocks Block objects. 45422 * @param {Object} options.props Optional. Props to pass to the element. Must contain 45423 * the ref if one is defined. 45424 * @param {Object} options.layout Layout settings to be used in the preview. 45425 */ 45426 function useBlockPreview({ 45427 blocks, 45428 props = {}, 45429 layout 45430 }) { 45431 const originalSettings = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getSettings(), []); 45432 const settings = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 45433 ...originalSettings, 45434 styles: undefined, 45435 // Clear styles included by the parent settings, as they are already output by the parent's EditorStyles. 45436 focusMode: false, 45437 // Disable "Spotlight mode". 45438 __unstableIsPreviewMode: true 45439 }), [originalSettings]); 45440 const disabledRef = (0,external_wp_compose_namespaceObject.useDisabled)(); 45441 const ref = (0,external_wp_compose_namespaceObject.useMergeRefs)([props.ref, disabledRef]); 45442 const renderedBlocks = (0,external_wp_element_namespaceObject.useMemo)(() => Array.isArray(blocks) ? blocks : [blocks], [blocks]); 45443 const children = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ExperimentalBlockEditorProvider, { 45444 value: renderedBlocks, 45445 settings: settings, 45446 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(editor_styles, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockListItems, { 45447 renderAppender: false, 45448 layout: layout 45449 })] 45450 }); 45451 return { 45452 ...props, 45453 ref, 45454 className: dist_clsx(props.className, 'block-editor-block-preview__live-content', 'components-disabled'), 45455 children: blocks?.length ? children : null 45456 }; 45457 } 45458 45459 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/preview-panel.js 45460 /** 45461 * WordPress dependencies 45462 */ 45463 45464 45465 45466 45467 /** 45468 * Internal dependencies 45469 */ 45470 45471 45472 45473 45474 function InserterPreviewPanel({ 45475 item 45476 }) { 45477 var _example$viewportWidt; 45478 const { 45479 name, 45480 title, 45481 icon, 45482 description, 45483 initialAttributes, 45484 example 45485 } = item; 45486 const isReusable = (0,external_wp_blocks_namespaceObject.isReusableBlock)(item); 45487 const blocks = (0,external_wp_element_namespaceObject.useMemo)(() => { 45488 if (!example) { 45489 return (0,external_wp_blocks_namespaceObject.createBlock)(name, initialAttributes); 45490 } 45491 return (0,external_wp_blocks_namespaceObject.getBlockFromExample)(name, { 45492 attributes: { 45493 ...example.attributes, 45494 ...initialAttributes 45495 }, 45496 innerBlocks: example.innerBlocks 45497 }); 45498 }, [name, example, initialAttributes]); 45499 // Same as height of BlockPreviewPanel. 45500 const previewHeight = 144; 45501 const sidebarWidth = 280; 45502 const viewportWidth = (_example$viewportWidt = example?.viewportWidth) !== null && _example$viewportWidt !== void 0 ? _example$viewportWidt : 500; 45503 const scale = sidebarWidth / viewportWidth; 45504 const minHeight = scale !== 0 && scale < 1 && previewHeight ? previewHeight / scale : previewHeight; 45505 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 45506 className: "block-editor-inserter__preview-container", 45507 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45508 className: "block-editor-inserter__preview", 45509 children: isReusable || example ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45510 className: "block-editor-inserter__preview-content", 45511 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_preview, { 45512 blocks: blocks, 45513 viewportWidth: viewportWidth, 45514 minHeight: previewHeight, 45515 additionalStyles: 45516 //We want this CSS to be in sync with the one in BlockPreviewPanel. 45517 [{ 45518 css: ` 45519 body { 45520 padding: 24px; 45521 min-height:$Math.round(minHeight)}px; 45522 display:flex; 45523 align-items:center; 45524 } 45525 .is-root-container { width: 100%; } 45526 ` 45527 }] 45528 }) 45529 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45530 className: "block-editor-inserter__preview-content-missing", 45531 children: (0,external_wp_i18n_namespaceObject.__)('No preview available.') 45532 }) 45533 }), !isReusable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_card, { 45534 title: title, 45535 icon: icon, 45536 description: description 45537 })] 45538 }); 45539 } 45540 /* harmony default export */ const preview_panel = (InserterPreviewPanel); 45541 45542 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter-listbox/item.js 45543 /** 45544 * WordPress dependencies 45545 */ 45546 45547 45548 45549 function InserterListboxItem({ 45550 isFirst, 45551 as: Component, 45552 children, 45553 ...props 45554 }, ref) { 45555 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Composite.Item, { 45556 ref: ref, 45557 role: "option" 45558 // Use the Composite.Item `accessibleWhenDisabled` prop 45559 // over Button's `isFocusable`. The latter was shown to 45560 // cause an issue with tab order in the inserter list. 45561 , 45562 accessibleWhenDisabled: true, 45563 ...props, 45564 render: htmlProps => { 45565 const propsWithTabIndex = { 45566 ...htmlProps, 45567 tabIndex: isFirst ? 0 : htmlProps.tabIndex 45568 }; 45569 if (Component) { 45570 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, { 45571 ...propsWithTabIndex, 45572 children: children 45573 }); 45574 } 45575 if (typeof children === 'function') { 45576 return children(propsWithTabIndex); 45577 } 45578 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 45579 __next40pxDefaultSize: true, 45580 ...propsWithTabIndex, 45581 children: children 45582 }); 45583 } 45584 }); 45585 } 45586 /* harmony default export */ const inserter_listbox_item = ((0,external_wp_element_namespaceObject.forwardRef)(InserterListboxItem)); 45587 45588 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/drag-handle.js 45589 /** 45590 * WordPress dependencies 45591 */ 45592 45593 45594 const dragHandle = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 45595 width: "24", 45596 height: "24", 45597 xmlns: "http://www.w3.org/2000/svg", 45598 viewBox: "0 0 24 24", 45599 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 45600 d: "M8 7h2V5H8v2zm0 6h2v-2H8v2zm0 6h2v-2H8v2zm6-14v2h2V5h-2zm0 8h2v-2h-2v2zm0 6h2v-2h-2v2z" 45601 }) 45602 }); 45603 /* harmony default export */ const drag_handle = (dragHandle); 45604 45605 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-draggable/draggable-chip.js 45606 /** 45607 * WordPress dependencies 45608 */ 45609 45610 45611 45612 45613 /** 45614 * Internal dependencies 45615 */ 45616 45617 45618 45619 function BlockDraggableChip({ 45620 count, 45621 icon, 45622 isPattern, 45623 fadeWhenDisabled 45624 }) { 45625 const patternLabel = isPattern && (0,external_wp_i18n_namespaceObject.__)('Pattern'); 45626 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45627 className: "block-editor-block-draggable-chip-wrapper", 45628 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45629 className: "block-editor-block-draggable-chip", 45630 "data-testid": "block-draggable-chip", 45631 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 45632 justify: "center", 45633 className: "block-editor-block-draggable-chip__content", 45634 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 45635 children: icon ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 45636 icon: icon 45637 }) : patternLabel || (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: Number of blocks. */ 45638 (0,external_wp_i18n_namespaceObject._n)('%d block', '%d blocks', count), count) 45639 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 45640 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 45641 icon: drag_handle 45642 }) 45643 }), fadeWhenDisabled && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 45644 className: "block-editor-block-draggable-chip__disabled", 45645 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 45646 className: "block-editor-block-draggable-chip__disabled-icon" 45647 }) 45648 })] 45649 }) 45650 }) 45651 }); 45652 } 45653 45654 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter-draggable-blocks/index.js 45655 /** 45656 * WordPress dependencies 45657 */ 45658 45659 45660 45661 45662 /** 45663 * Internal dependencies 45664 */ 45665 45666 45667 45668 45669 45670 const InserterDraggableBlocks = ({ 45671 isEnabled, 45672 blocks, 45673 icon, 45674 children, 45675 pattern 45676 }) => { 45677 const transferData = { 45678 type: 'inserter', 45679 blocks 45680 }; 45681 const blockTypeIcon = (0,external_wp_data_namespaceObject.useSelect)(select => { 45682 const { 45683 getBlockType 45684 } = select(external_wp_blocks_namespaceObject.store); 45685 return blocks.length === 1 && getBlockType(blocks[0].name)?.icon; 45686 }, [blocks]); 45687 const { 45688 startDragging, 45689 stopDragging 45690 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 45691 if (!isEnabled) { 45692 return children({ 45693 draggable: false, 45694 onDragStart: undefined, 45695 onDragEnd: undefined 45696 }); 45697 } 45698 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Draggable, { 45699 __experimentalTransferDataType: "wp-blocks", 45700 transferData: transferData, 45701 onDragStart: event => { 45702 startDragging(); 45703 const parsedBlocks = pattern?.type === INSERTER_PATTERN_TYPES.user && pattern?.syncStatus !== 'unsynced' ? [(0,external_wp_blocks_namespaceObject.createBlock)('core/block', { 45704 ref: pattern.id 45705 })] : blocks; 45706 event.dataTransfer.setData('text/html', (0,external_wp_blocks_namespaceObject.serialize)(parsedBlocks)); 45707 }, 45708 onDragEnd: () => { 45709 stopDragging(); 45710 }, 45711 __experimentalDragComponent: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockDraggableChip, { 45712 count: blocks.length, 45713 icon: icon || !pattern && blockTypeIcon, 45714 isPattern: !!pattern 45715 }), 45716 children: ({ 45717 onDraggableStart, 45718 onDraggableEnd 45719 }) => { 45720 return children({ 45721 draggable: true, 45722 onDragStart: onDraggableStart, 45723 onDragEnd: onDraggableEnd 45724 }); 45725 } 45726 }); 45727 }; 45728 /* harmony default export */ const inserter_draggable_blocks = (InserterDraggableBlocks); 45729 45730 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter-list-item/index.js 45731 /** 45732 * External dependencies 45733 */ 45734 45735 45736 /** 45737 * WordPress dependencies 45738 */ 45739 45740 45741 45742 45743 45744 /** 45745 * Internal dependencies 45746 */ 45747 45748 45749 45750 45751 45752 function InserterListItem({ 45753 className, 45754 isFirst, 45755 item, 45756 onSelect, 45757 onHover, 45758 isDraggable, 45759 ...props 45760 }) { 45761 const isDraggingRef = (0,external_wp_element_namespaceObject.useRef)(false); 45762 const itemIconStyle = item.icon ? { 45763 backgroundColor: item.icon.background, 45764 color: item.icon.foreground 45765 } : {}; 45766 const blocks = (0,external_wp_element_namespaceObject.useMemo)(() => [(0,external_wp_blocks_namespaceObject.createBlock)(item.name, item.initialAttributes, (0,external_wp_blocks_namespaceObject.createBlocksFromInnerBlocksTemplate)(item.innerBlocks))], [item.name, item.initialAttributes, item.innerBlocks]); 45767 const isSynced = (0,external_wp_blocks_namespaceObject.isReusableBlock)(item) && item.syncStatus !== 'unsynced' || (0,external_wp_blocks_namespaceObject.isTemplatePart)(item); 45768 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter_draggable_blocks, { 45769 isEnabled: isDraggable && !item.isDisabled, 45770 blocks: blocks, 45771 icon: item.icon, 45772 children: ({ 45773 draggable, 45774 onDragStart, 45775 onDragEnd 45776 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45777 className: dist_clsx('block-editor-block-types-list__list-item', { 45778 'is-synced': isSynced 45779 }), 45780 draggable: draggable, 45781 onDragStart: event => { 45782 isDraggingRef.current = true; 45783 if (onDragStart) { 45784 onHover(null); 45785 onDragStart(event); 45786 } 45787 }, 45788 onDragEnd: event => { 45789 isDraggingRef.current = false; 45790 if (onDragEnd) { 45791 onDragEnd(event); 45792 } 45793 }, 45794 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(inserter_listbox_item, { 45795 isFirst: isFirst, 45796 className: dist_clsx('block-editor-block-types-list__item', className), 45797 disabled: item.isDisabled, 45798 onClick: event => { 45799 event.preventDefault(); 45800 onSelect(item, (0,external_wp_keycodes_namespaceObject.isAppleOS)() ? event.metaKey : event.ctrlKey); 45801 onHover(null); 45802 }, 45803 onKeyDown: event => { 45804 const { 45805 keyCode 45806 } = event; 45807 if (keyCode === external_wp_keycodes_namespaceObject.ENTER) { 45808 event.preventDefault(); 45809 onSelect(item, (0,external_wp_keycodes_namespaceObject.isAppleOS)() ? event.metaKey : event.ctrlKey); 45810 onHover(null); 45811 } 45812 }, 45813 onMouseEnter: () => { 45814 if (isDraggingRef.current) { 45815 return; 45816 } 45817 onHover(item); 45818 }, 45819 onMouseLeave: () => onHover(null), 45820 ...props, 45821 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 45822 className: "block-editor-block-types-list__item-icon", 45823 style: itemIconStyle, 45824 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 45825 icon: item.icon, 45826 showColors: true 45827 }) 45828 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 45829 className: "block-editor-block-types-list__item-title", 45830 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, { 45831 numberOfLines: 3, 45832 children: item.title 45833 }) 45834 })] 45835 }) 45836 }) 45837 }); 45838 } 45839 /* harmony default export */ const inserter_list_item = ((0,external_wp_element_namespaceObject.memo)(InserterListItem)); 45840 45841 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter-listbox/group.js 45842 /** 45843 * WordPress dependencies 45844 */ 45845 45846 45847 45848 45849 function InserterListboxGroup(props, ref) { 45850 const [shouldSpeak, setShouldSpeak] = (0,external_wp_element_namespaceObject.useState)(false); 45851 (0,external_wp_element_namespaceObject.useEffect)(() => { 45852 if (shouldSpeak) { 45853 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.__)('Use left and right arrow keys to move through blocks')); 45854 } 45855 }, [shouldSpeak]); 45856 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45857 ref: ref, 45858 role: "listbox", 45859 "aria-orientation": "horizontal", 45860 onFocus: () => { 45861 setShouldSpeak(true); 45862 }, 45863 onBlur: event => { 45864 const focusingOutsideGroup = !event.currentTarget.contains(event.relatedTarget); 45865 if (focusingOutsideGroup) { 45866 setShouldSpeak(false); 45867 } 45868 }, 45869 ...props 45870 }); 45871 } 45872 /* harmony default export */ const group = ((0,external_wp_element_namespaceObject.forwardRef)(InserterListboxGroup)); 45873 45874 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter-listbox/row.js 45875 /** 45876 * WordPress dependencies 45877 */ 45878 45879 45880 45881 function InserterListboxRow(props, ref) { 45882 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Composite.Group, { 45883 role: "presentation", 45884 ref: ref, 45885 ...props 45886 }); 45887 } 45888 /* harmony default export */ const inserter_listbox_row = ((0,external_wp_element_namespaceObject.forwardRef)(InserterListboxRow)); 45889 45890 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-types-list/index.js 45891 /** 45892 * WordPress dependencies 45893 */ 45894 45895 45896 45897 /** 45898 * Internal dependencies 45899 */ 45900 45901 45902 45903 45904 function chunk(array, size) { 45905 const chunks = []; 45906 for (let i = 0, j = array.length; i < j; i += size) { 45907 chunks.push(array.slice(i, i + size)); 45908 } 45909 return chunks; 45910 } 45911 function BlockTypesList({ 45912 items = [], 45913 onSelect, 45914 onHover = () => {}, 45915 children, 45916 label, 45917 isDraggable = true 45918 }) { 45919 const className = 'block-editor-block-types-list'; 45920 const listId = (0,external_wp_compose_namespaceObject.useInstanceId)(BlockTypesList, className); 45921 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(group, { 45922 className: className, 45923 "aria-label": label, 45924 children: [chunk(items, 3).map((row, i) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter_listbox_row, { 45925 children: row.map((item, j) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter_list_item, { 45926 item: item, 45927 className: (0,external_wp_blocks_namespaceObject.getBlockMenuDefaultClassName)(item.id), 45928 onSelect: onSelect, 45929 onHover: onHover, 45930 isDraggable: isDraggable && !item.isDisabled, 45931 isFirst: i === 0 && j === 0, 45932 rowId: `$listId}-$i}` 45933 }, item.id)) 45934 }, i)), children] 45935 }); 45936 } 45937 /* harmony default export */ const block_types_list = (BlockTypesList); 45938 45939 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/panel.js 45940 /** 45941 * WordPress dependencies 45942 */ 45943 45944 45945 45946 45947 function InserterPanel({ 45948 title, 45949 icon, 45950 children 45951 }) { 45952 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 45953 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 45954 className: "block-editor-inserter__panel-header", 45955 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("h2", { 45956 className: "block-editor-inserter__panel-title", 45957 children: title 45958 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Icon, { 45959 icon: icon 45960 })] 45961 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 45962 className: "block-editor-inserter__panel-content", 45963 children: children 45964 })] 45965 }); 45966 } 45967 /* harmony default export */ const panel = (InserterPanel); 45968 45969 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/hooks/use-block-types-state.js 45970 /** 45971 * WordPress dependencies 45972 */ 45973 45974 45975 45976 45977 /** 45978 * Internal dependencies 45979 */ 45980 45981 45982 45983 /** 45984 * Retrieves the block types inserter state. 45985 * 45986 * @param {string=} rootClientId Insertion's root client ID. 45987 * @param {Function} onInsert function called when inserter a list of blocks. 45988 * @param {boolean} isQuick 45989 * @return {Array} Returns the block types state. (block types, categories, collections, onSelect handler) 45990 */ 45991 const useBlockTypesState = (rootClientId, onInsert, isQuick) => { 45992 const options = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 45993 [withRootClientIdOptionKey]: !isQuick 45994 }), [isQuick]); 45995 const [items] = (0,external_wp_data_namespaceObject.useSelect)(select => [select(store).getInserterItems(rootClientId, options)], [rootClientId, options]); 45996 const [categories, collections] = (0,external_wp_data_namespaceObject.useSelect)(select => { 45997 const { 45998 getCategories, 45999 getCollections 46000 } = select(external_wp_blocks_namespaceObject.store); 46001 return [getCategories(), getCollections()]; 46002 }, []); 46003 const onSelectItem = (0,external_wp_element_namespaceObject.useCallback)(({ 46004 name, 46005 initialAttributes, 46006 innerBlocks, 46007 syncStatus, 46008 content, 46009 rootClientId: _rootClientId 46010 }, shouldFocusBlock) => { 46011 const insertedBlock = syncStatus === 'unsynced' ? (0,external_wp_blocks_namespaceObject.parse)(content, { 46012 __unstableSkipMigrationLogs: true 46013 }) : (0,external_wp_blocks_namespaceObject.createBlock)(name, initialAttributes, (0,external_wp_blocks_namespaceObject.createBlocksFromInnerBlocksTemplate)(innerBlocks)); 46014 onInsert(insertedBlock, undefined, shouldFocusBlock, _rootClientId); 46015 }, [onInsert]); 46016 return [items, categories, collections, onSelectItem]; 46017 }; 46018 /* harmony default export */ const use_block_types_state = (useBlockTypesState); 46019 46020 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter-listbox/index.js 46021 /** 46022 * WordPress dependencies 46023 */ 46024 46025 46026 /** 46027 * Internal dependencies 46028 */ 46029 46030 46031 46032 46033 46034 function InserterListbox({ 46035 children 46036 }) { 46037 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Composite, { 46038 focusShift: true, 46039 focusWrap: "horizontal", 46040 render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {}), 46041 children: children 46042 }); 46043 } 46044 /* harmony default export */ const inserter_listbox = (InserterListbox); 46045 46046 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/no-results.js 46047 /** 46048 * WordPress dependencies 46049 */ 46050 46051 46052 46053 46054 function InserterNoResults() { 46055 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 46056 className: "block-editor-inserter__no-results", 46057 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 46058 className: "block-editor-inserter__no-results-icon", 46059 icon: block_default 46060 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 46061 children: (0,external_wp_i18n_namespaceObject.__)('No results found.') 46062 })] 46063 }); 46064 } 46065 /* harmony default export */ const no_results = (InserterNoResults); 46066 46067 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-types-tab.js 46068 /** 46069 * WordPress dependencies 46070 */ 46071 46072 46073 46074 46075 /** 46076 * Internal dependencies 46077 */ 46078 46079 46080 46081 46082 46083 46084 46085 46086 46087 const getBlockNamespace = item => item.name.split('/')[0]; 46088 const MAX_SUGGESTED_ITEMS = 6; 46089 46090 /** 46091 * Shared reference to an empty array for cases where it is important to avoid 46092 * returning a new array reference on every invocation and rerendering the component. 46093 * 46094 * @type {Array} 46095 */ 46096 const block_types_tab_EMPTY_ARRAY = []; 46097 function BlockTypesTabPanel({ 46098 items, 46099 collections, 46100 categories, 46101 onSelectItem, 46102 onHover, 46103 showMostUsedBlocks, 46104 className 46105 }) { 46106 const suggestedItems = (0,external_wp_element_namespaceObject.useMemo)(() => { 46107 return orderBy(items, 'frecency', 'desc').slice(0, MAX_SUGGESTED_ITEMS); 46108 }, [items]); 46109 const uncategorizedItems = (0,external_wp_element_namespaceObject.useMemo)(() => { 46110 return items.filter(item => !item.category); 46111 }, [items]); 46112 const itemsPerCollection = (0,external_wp_element_namespaceObject.useMemo)(() => { 46113 // Create a new Object to avoid mutating collection. 46114 const result = { 46115 ...collections 46116 }; 46117 Object.keys(collections).forEach(namespace => { 46118 result[namespace] = items.filter(item => getBlockNamespace(item) === namespace); 46119 if (result[namespace].length === 0) { 46120 delete result[namespace]; 46121 } 46122 }); 46123 return result; 46124 }, [items, collections]); 46125 46126 // Hide block preview on unmount. 46127 (0,external_wp_element_namespaceObject.useEffect)(() => () => onHover(null), []); 46128 46129 /** 46130 * The inserter contains a big number of blocks and opening it is a costful operation. 46131 * The rendering is the most costful part of it, in order to improve the responsiveness 46132 * of the "opening" action, these lazy lists allow us to render the inserter category per category, 46133 * once all the categories are rendered, we start rendering the collections and the uncategorized block types. 46134 */ 46135 const currentlyRenderedCategories = (0,external_wp_compose_namespaceObject.useAsyncList)(categories); 46136 const didRenderAllCategories = categories.length === currentlyRenderedCategories.length; 46137 46138 // Async List requires an array. 46139 const collectionEntries = (0,external_wp_element_namespaceObject.useMemo)(() => { 46140 return Object.entries(collections); 46141 }, [collections]); 46142 const currentlyRenderedCollections = (0,external_wp_compose_namespaceObject.useAsyncList)(didRenderAllCategories ? collectionEntries : block_types_tab_EMPTY_ARRAY); 46143 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 46144 className: className, 46145 children: [showMostUsedBlocks && 46146 // Only show the most used blocks if the total amount of block 46147 // is larger than 1 row, otherwise it is not so useful. 46148 items.length > 3 && !!suggestedItems.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(panel, { 46149 title: (0,external_wp_i18n_namespaceObject._x)('Most used', 'blocks'), 46150 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_types_list, { 46151 items: suggestedItems, 46152 onSelect: onSelectItem, 46153 onHover: onHover, 46154 label: (0,external_wp_i18n_namespaceObject._x)('Most used', 'blocks') 46155 }) 46156 }), currentlyRenderedCategories.map(category => { 46157 const categoryItems = items.filter(item => item.category === category.slug); 46158 if (!categoryItems || !categoryItems.length) { 46159 return null; 46160 } 46161 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(panel, { 46162 title: category.title, 46163 icon: category.icon, 46164 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_types_list, { 46165 items: categoryItems, 46166 onSelect: onSelectItem, 46167 onHover: onHover, 46168 label: category.title 46169 }) 46170 }, category.slug); 46171 }), didRenderAllCategories && uncategorizedItems.length > 0 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(panel, { 46172 className: "block-editor-inserter__uncategorized-blocks-panel", 46173 title: (0,external_wp_i18n_namespaceObject.__)('Uncategorized'), 46174 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_types_list, { 46175 items: uncategorizedItems, 46176 onSelect: onSelectItem, 46177 onHover: onHover, 46178 label: (0,external_wp_i18n_namespaceObject.__)('Uncategorized') 46179 }) 46180 }), currentlyRenderedCollections.map(([namespace, collection]) => { 46181 const collectionItems = itemsPerCollection[namespace]; 46182 if (!collectionItems || !collectionItems.length) { 46183 return null; 46184 } 46185 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(panel, { 46186 title: collection.title, 46187 icon: collection.icon, 46188 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_types_list, { 46189 items: collectionItems, 46190 onSelect: onSelectItem, 46191 onHover: onHover, 46192 label: collection.title 46193 }) 46194 }, namespace); 46195 })] 46196 }); 46197 } 46198 function BlockTypesTab({ 46199 rootClientId, 46200 onInsert, 46201 onHover, 46202 showMostUsedBlocks 46203 }, ref) { 46204 const [items, categories, collections, onSelectItem] = use_block_types_state(rootClientId, onInsert); 46205 if (!items.length) { 46206 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(no_results, {}); 46207 } 46208 const itemsForCurrentRoot = []; 46209 const itemsRemaining = []; 46210 for (const item of items) { 46211 // Skip reusable blocks, they moved to the patterns tab. 46212 if (item.category === 'reusable') { 46213 continue; 46214 } 46215 if (rootClientId && item.rootClientId === rootClientId) { 46216 itemsForCurrentRoot.push(item); 46217 } else { 46218 itemsRemaining.push(item); 46219 } 46220 } 46221 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter_listbox, { 46222 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 46223 ref: ref, 46224 children: [!!itemsForCurrentRoot.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 46225 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTypesTabPanel, { 46226 items: itemsForCurrentRoot, 46227 categories: categories, 46228 collections: collections, 46229 onSelectItem: onSelectItem, 46230 onHover: onHover, 46231 showMostUsedBlocks: showMostUsedBlocks, 46232 className: "block-editor-inserter__insertable-blocks-at-selection" 46233 }) 46234 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTypesTabPanel, { 46235 items: itemsRemaining, 46236 categories: categories, 46237 collections: collections, 46238 onSelectItem: onSelectItem, 46239 onHover: onHover, 46240 showMostUsedBlocks: showMostUsedBlocks, 46241 className: "block-editor-inserter__all-blocks" 46242 })] 46243 }) 46244 }); 46245 } 46246 /* harmony default export */ const block_types_tab = ((0,external_wp_element_namespaceObject.forwardRef)(BlockTypesTab)); 46247 46248 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-patterns-explorer/pattern-explorer-sidebar.js 46249 /** 46250 * WordPress dependencies 46251 */ 46252 46253 46254 46255 46256 function PatternCategoriesList({ 46257 selectedCategory, 46258 patternCategories, 46259 onClickCategory 46260 }) { 46261 const baseClassName = 'block-editor-block-patterns-explorer__sidebar'; 46262 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 46263 className: `$baseClassName}__categories-list`, 46264 children: patternCategories.map(({ 46265 name, 46266 label 46267 }) => { 46268 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 46269 __next40pxDefaultSize: true, 46270 label: label, 46271 className: `$baseClassName}__categories-list__item`, 46272 isPressed: selectedCategory === name, 46273 onClick: () => { 46274 onClickCategory(name); 46275 }, 46276 children: label 46277 }, name); 46278 }) 46279 }); 46280 } 46281 function PatternsExplorerSearch({ 46282 searchValue, 46283 setSearchValue 46284 }) { 46285 const baseClassName = 'block-editor-block-patterns-explorer__search'; 46286 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 46287 className: baseClassName, 46288 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SearchControl, { 46289 __nextHasNoMarginBottom: true, 46290 onChange: setSearchValue, 46291 value: searchValue, 46292 label: (0,external_wp_i18n_namespaceObject.__)('Search for patterns'), 46293 placeholder: (0,external_wp_i18n_namespaceObject.__)('Search') 46294 }) 46295 }); 46296 } 46297 function PatternExplorerSidebar({ 46298 selectedCategory, 46299 patternCategories, 46300 onClickCategory, 46301 searchValue, 46302 setSearchValue 46303 }) { 46304 const baseClassName = 'block-editor-block-patterns-explorer__sidebar'; 46305 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 46306 className: baseClassName, 46307 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PatternsExplorerSearch, { 46308 searchValue: searchValue, 46309 setSearchValue: setSearchValue 46310 }), !searchValue && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PatternCategoriesList, { 46311 selectedCategory: selectedCategory, 46312 patternCategories: patternCategories, 46313 onClickCategory: onClickCategory 46314 })] 46315 }); 46316 } 46317 /* harmony default export */ const pattern_explorer_sidebar = (PatternExplorerSidebar); 46318 46319 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-patterns-paging/index.js 46320 /** 46321 * WordPress dependencies 46322 */ 46323 46324 46325 46326 46327 function Pagination({ 46328 currentPage, 46329 numPages, 46330 changePage, 46331 totalItems 46332 }) { 46333 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 46334 className: "block-editor-patterns__grid-pagination-wrapper", 46335 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 46336 variant: "muted", 46337 children: (0,external_wp_i18n_namespaceObject.sprintf)( 46338 // translators: %s: Total number of patterns. 46339 (0,external_wp_i18n_namespaceObject._n)('%s item', '%s items', totalItems), totalItems) 46340 }), numPages > 1 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 46341 expanded: false, 46342 spacing: 3, 46343 justify: "flex-start", 46344 className: "block-editor-patterns__grid-pagination", 46345 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 46346 expanded: false, 46347 spacing: 1, 46348 className: "block-editor-patterns__grid-pagination-previous", 46349 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 46350 // TODO: Switch to `true` (40px size) if possible 46351 , { 46352 __next40pxDefaultSize: false, 46353 variant: "tertiary", 46354 onClick: () => changePage(1), 46355 disabled: currentPage === 1, 46356 "aria-label": (0,external_wp_i18n_namespaceObject.__)('First page'), 46357 accessibleWhenDisabled: true, 46358 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 46359 children: "\xAB" 46360 }) 46361 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 46362 // TODO: Switch to `true` (40px size) if possible 46363 , { 46364 __next40pxDefaultSize: false, 46365 variant: "tertiary", 46366 onClick: () => changePage(currentPage - 1), 46367 disabled: currentPage === 1, 46368 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Previous page'), 46369 accessibleWhenDisabled: true, 46370 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 46371 children: "\u2039" 46372 }) 46373 })] 46374 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 46375 variant: "muted", 46376 children: (0,external_wp_i18n_namespaceObject.sprintf)( 46377 // translators: 1: Current page number. 2: Total number of pages. 46378 (0,external_wp_i18n_namespaceObject._x)('%1$s of %2$s', 'paging'), currentPage, numPages) 46379 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 46380 expanded: false, 46381 spacing: 1, 46382 className: "block-editor-patterns__grid-pagination-next", 46383 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 46384 // TODO: Switch to `true` (40px size) if possible 46385 , { 46386 __next40pxDefaultSize: false, 46387 variant: "tertiary", 46388 onClick: () => changePage(currentPage + 1), 46389 disabled: currentPage === numPages, 46390 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Next page'), 46391 accessibleWhenDisabled: true, 46392 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 46393 children: "\u203A" 46394 }) 46395 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 46396 variant: "tertiary", 46397 onClick: () => changePage(numPages), 46398 disabled: currentPage === numPages, 46399 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Last page'), 46400 size: "default", 46401 accessibleWhenDisabled: true, 46402 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 46403 children: "\xBB" 46404 }) 46405 })] 46406 })] 46407 })] 46408 }); 46409 } 46410 46411 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-patterns-list/index.js 46412 /** 46413 * External dependencies 46414 */ 46415 46416 46417 /** 46418 * WordPress dependencies 46419 */ 46420 46421 46422 46423 46424 46425 46426 46427 /** 46428 * Internal dependencies 46429 */ 46430 46431 46432 46433 46434 46435 46436 46437 const WithToolTip = ({ 46438 showTooltip, 46439 title, 46440 children 46441 }) => { 46442 if (showTooltip) { 46443 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tooltip, { 46444 text: title, 46445 children: children 46446 }); 46447 } 46448 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 46449 children: children 46450 }); 46451 }; 46452 function BlockPattern({ 46453 id, 46454 isDraggable, 46455 pattern, 46456 onClick, 46457 onHover, 46458 showTitle = true, 46459 showTooltip, 46460 category 46461 }) { 46462 const [isDragging, setIsDragging] = (0,external_wp_element_namespaceObject.useState)(false); 46463 const { 46464 blocks, 46465 viewportWidth 46466 } = pattern; 46467 const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(BlockPattern); 46468 const descriptionId = `block-editor-block-patterns-list__item-description-$instanceId}`; 46469 46470 // When we have a selected category and the pattern is draggable, we need to update the 46471 // pattern's categories in metadata to only contain the selected category, and pass this to 46472 // InserterDraggableBlocks component. We do that because we use this information for pattern 46473 // shuffling and it makes more sense to show only the ones from the initially selected category during insertion. 46474 const patternBlocks = (0,external_wp_element_namespaceObject.useMemo)(() => { 46475 if (!category || !isDraggable) { 46476 return blocks; 46477 } 46478 return (blocks !== null && blocks !== void 0 ? blocks : []).map(block => { 46479 const clonedBlock = (0,external_wp_blocks_namespaceObject.cloneBlock)(block); 46480 if (clonedBlock.attributes.metadata?.categories?.includes(category)) { 46481 clonedBlock.attributes.metadata.categories = [category]; 46482 } 46483 return clonedBlock; 46484 }); 46485 }, [blocks, isDraggable, category]); 46486 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter_draggable_blocks, { 46487 isEnabled: isDraggable, 46488 blocks: patternBlocks, 46489 pattern: pattern, 46490 children: ({ 46491 draggable, 46492 onDragStart, 46493 onDragEnd 46494 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 46495 className: "block-editor-block-patterns-list__list-item", 46496 draggable: draggable, 46497 onDragStart: event => { 46498 setIsDragging(true); 46499 if (onDragStart) { 46500 onHover?.(null); 46501 onDragStart(event); 46502 } 46503 }, 46504 onDragEnd: event => { 46505 setIsDragging(false); 46506 if (onDragEnd) { 46507 onDragEnd(event); 46508 } 46509 }, 46510 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WithToolTip, { 46511 showTooltip: showTooltip && !pattern.type !== INSERTER_PATTERN_TYPES.user, 46512 title: pattern.title, 46513 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Composite.Item, { 46514 render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 46515 role: "option", 46516 "aria-label": pattern.title, 46517 "aria-describedby": pattern.description ? descriptionId : undefined, 46518 className: dist_clsx('block-editor-block-patterns-list__item', { 46519 'block-editor-block-patterns-list__list-item-synced': pattern.type === INSERTER_PATTERN_TYPES.user && !pattern.syncStatus 46520 }) 46521 }), 46522 id: id, 46523 onClick: () => { 46524 onClick(pattern, blocks); 46525 onHover?.(null); 46526 }, 46527 onMouseEnter: () => { 46528 if (isDragging) { 46529 return; 46530 } 46531 onHover?.(pattern); 46532 }, 46533 onMouseLeave: () => onHover?.(null), 46534 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_preview, { 46535 blocks: blocks, 46536 viewportWidth: viewportWidth 46537 }), showTitle && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 46538 className: "block-editor-patterns__pattern-details", 46539 spacing: 2, 46540 children: [pattern.type === INSERTER_PATTERN_TYPES.user && !pattern.syncStatus && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 46541 className: "block-editor-patterns__pattern-icon-wrapper", 46542 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 46543 className: "block-editor-patterns__pattern-icon", 46544 icon: library_symbol 46545 }) 46546 }), (!showTooltip || pattern.type === INSERTER_PATTERN_TYPES.user) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 46547 className: "block-editor-block-patterns-list__item-title", 46548 children: pattern.title 46549 })] 46550 }), !!pattern.description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 46551 id: descriptionId, 46552 children: pattern.description 46553 })] 46554 }) 46555 }) 46556 }) 46557 }); 46558 } 46559 function BlockPatternPlaceholder() { 46560 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 46561 className: "block-editor-block-patterns-list__item is-placeholder" 46562 }); 46563 } 46564 function BlockPatternsList({ 46565 isDraggable, 46566 blockPatterns, 46567 shownPatterns, 46568 onHover, 46569 onClickPattern, 46570 orientation, 46571 label = (0,external_wp_i18n_namespaceObject.__)('Block patterns'), 46572 category, 46573 showTitle = true, 46574 showTitlesAsTooltip, 46575 pagingProps 46576 }, ref) { 46577 const [activeCompositeId, setActiveCompositeId] = (0,external_wp_element_namespaceObject.useState)(undefined); 46578 (0,external_wp_element_namespaceObject.useEffect)(() => { 46579 // Reset the active composite item whenever the available patterns change, 46580 // to make sure that Composite widget can receive focus correctly when its 46581 // composite items change. The first composite item will receive focus. 46582 const firstCompositeItemId = blockPatterns.find(pattern => shownPatterns.includes(pattern))?.name; 46583 setActiveCompositeId(firstCompositeItemId); 46584 }, [shownPatterns, blockPatterns]); 46585 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Composite, { 46586 orientation: orientation, 46587 activeId: activeCompositeId, 46588 setActiveId: setActiveCompositeId, 46589 role: "listbox", 46590 className: "block-editor-block-patterns-list", 46591 "aria-label": label, 46592 ref: ref, 46593 children: [blockPatterns.map(pattern => { 46594 const isShown = shownPatterns.includes(pattern); 46595 return isShown ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockPattern, { 46596 id: pattern.name, 46597 pattern: pattern, 46598 onClick: onClickPattern, 46599 onHover: onHover, 46600 isDraggable: isDraggable, 46601 showTitle: showTitle, 46602 showTooltip: showTitlesAsTooltip, 46603 category: category 46604 }, pattern.name) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockPatternPlaceholder, {}, pattern.name); 46605 }), pagingProps && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Pagination, { 46606 ...pagingProps 46607 })] 46608 }); 46609 } 46610 /* harmony default export */ const block_patterns_list = ((0,external_wp_element_namespaceObject.forwardRef)(BlockPatternsList)); 46611 46612 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/hooks/use-insertion-point.js 46613 /** 46614 * WordPress dependencies 46615 */ 46616 46617 46618 46619 46620 46621 46622 /** 46623 * Internal dependencies 46624 */ 46625 46626 46627 function getIndex({ 46628 destinationRootClientId, 46629 destinationIndex, 46630 rootClientId, 46631 registry 46632 }) { 46633 if (rootClientId === destinationRootClientId) { 46634 return destinationIndex; 46635 } 46636 const parents = ['', ...registry.select(store).getBlockParents(destinationRootClientId), destinationRootClientId]; 46637 const parentIndex = parents.indexOf(rootClientId); 46638 if (parentIndex !== -1) { 46639 return registry.select(store).getBlockIndex(parents[parentIndex + 1]) + 1; 46640 } 46641 return registry.select(store).getBlockOrder(rootClientId).length; 46642 } 46643 46644 /** 46645 * @typedef WPInserterConfig 46646 * 46647 * @property {string=} rootClientId If set, insertion will be into the 46648 * block with this ID. 46649 * @property {number=} insertionIndex If set, insertion will be into this 46650 * explicit position. 46651 * @property {string=} clientId If set, insertion will be after the 46652 * block with this ID. 46653 * @property {boolean=} isAppender Whether the inserter is an appender 46654 * or not. 46655 * @property {Function=} onSelect Called after insertion. 46656 */ 46657 46658 /** 46659 * Returns the insertion point state given the inserter config. 46660 * 46661 * @param {WPInserterConfig} config Inserter Config. 46662 * @return {Array} Insertion Point State (rootClientID, onInsertBlocks and onToggle). 46663 */ 46664 function useInsertionPoint({ 46665 rootClientId = '', 46666 insertionIndex, 46667 clientId, 46668 isAppender, 46669 onSelect, 46670 shouldFocusBlock = true, 46671 selectBlockOnInsert = true 46672 }) { 46673 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 46674 const { 46675 getSelectedBlock 46676 } = (0,external_wp_data_namespaceObject.useSelect)(store); 46677 const { 46678 destinationRootClientId, 46679 destinationIndex 46680 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 46681 const { 46682 getSelectedBlockClientId, 46683 getBlockRootClientId, 46684 getBlockIndex, 46685 getBlockOrder, 46686 getSectionRootClientId, 46687 __unstableGetEditorMode 46688 } = unlock(select(store)); 46689 const selectedBlockClientId = getSelectedBlockClientId(); 46690 let _destinationRootClientId = rootClientId; 46691 let _destinationIndex; 46692 if (insertionIndex !== undefined) { 46693 // Insert into a specific index. 46694 _destinationIndex = insertionIndex; 46695 } else if (clientId) { 46696 // Insert after a specific client ID. 46697 _destinationIndex = getBlockIndex(clientId); 46698 } else if (!isAppender && selectedBlockClientId) { 46699 const sectionRootClientId = getSectionRootClientId(); 46700 46701 // Avoids empty inserter when the selected block is acting 46702 // as the "root". 46703 // See https://github.com/WordPress/gutenberg/pull/66214. 46704 if (__unstableGetEditorMode() === 'zoom-out' && sectionRootClientId === selectedBlockClientId) { 46705 _destinationRootClientId = sectionRootClientId; 46706 _destinationIndex = getBlockOrder(_destinationRootClientId).length; 46707 } else { 46708 _destinationRootClientId = getBlockRootClientId(selectedBlockClientId); 46709 _destinationIndex = getBlockIndex(selectedBlockClientId) + 1; 46710 } 46711 } else { 46712 // Insert at the end of the list. 46713 _destinationIndex = getBlockOrder(_destinationRootClientId).length; 46714 } 46715 return { 46716 destinationRootClientId: _destinationRootClientId, 46717 destinationIndex: _destinationIndex 46718 }; 46719 }, [rootClientId, insertionIndex, clientId, isAppender]); 46720 const { 46721 replaceBlocks, 46722 insertBlocks, 46723 showInsertionPoint, 46724 hideInsertionPoint, 46725 setLastFocus 46726 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 46727 const onInsertBlocks = (0,external_wp_element_namespaceObject.useCallback)((blocks, meta, shouldForceFocusBlock = false, _rootClientId) => { 46728 // When we are trying to move focus or select a new block on insert, we also 46729 // need to clear the last focus to avoid the focus being set to the wrong block 46730 // when tabbing back into the canvas if the block was added from outside the 46731 // editor canvas. 46732 if (shouldForceFocusBlock || shouldFocusBlock || selectBlockOnInsert) { 46733 setLastFocus(null); 46734 } 46735 const selectedBlock = getSelectedBlock(); 46736 if (!isAppender && selectedBlock && (0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(selectedBlock)) { 46737 replaceBlocks(selectedBlock.clientId, blocks, null, shouldFocusBlock || shouldForceFocusBlock ? 0 : null, meta); 46738 } else { 46739 insertBlocks(blocks, isAppender || _rootClientId === undefined ? destinationIndex : getIndex({ 46740 destinationRootClientId, 46741 destinationIndex, 46742 rootClientId: _rootClientId, 46743 registry 46744 }), isAppender || _rootClientId === undefined ? destinationRootClientId : _rootClientId, selectBlockOnInsert, shouldFocusBlock || shouldForceFocusBlock ? 0 : null, meta); 46745 } 46746 const blockLength = Array.isArray(blocks) ? blocks.length : 1; 46747 const message = (0,external_wp_i18n_namespaceObject.sprintf)( 46748 // translators: %d: the name of the block that has been added 46749 (0,external_wp_i18n_namespaceObject._n)('%d block added.', '%d blocks added.', blockLength), blockLength); 46750 (0,external_wp_a11y_namespaceObject.speak)(message); 46751 if (onSelect) { 46752 onSelect(blocks); 46753 } 46754 }, [isAppender, getSelectedBlock, replaceBlocks, insertBlocks, destinationRootClientId, destinationIndex, onSelect, shouldFocusBlock, selectBlockOnInsert]); 46755 const onToggleInsertionPoint = (0,external_wp_element_namespaceObject.useCallback)(item => { 46756 if (item?.hasOwnProperty('rootClientId')) { 46757 showInsertionPoint(item.rootClientId, getIndex({ 46758 destinationRootClientId, 46759 destinationIndex, 46760 rootClientId: item.rootClientId, 46761 registry 46762 })); 46763 } else { 46764 hideInsertionPoint(); 46765 } 46766 }, [showInsertionPoint, hideInsertionPoint, destinationRootClientId, destinationIndex]); 46767 return [destinationRootClientId, onInsertBlocks, onToggleInsertionPoint]; 46768 } 46769 /* harmony default export */ const use_insertion_point = (useInsertionPoint); 46770 46771 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/hooks/use-patterns-state.js 46772 /** 46773 * WordPress dependencies 46774 */ 46775 46776 46777 46778 46779 46780 46781 /** 46782 * Internal dependencies 46783 */ 46784 46785 46786 46787 /** 46788 * Retrieves the block patterns inserter state. 46789 * 46790 * @param {Function} onInsert function called when inserter a list of blocks. 46791 * @param {string=} rootClientId Insertion's root client ID. 46792 * 46793 * @param {string} selectedCategory The selected pattern category. 46794 * @return {Array} Returns the patterns state. (patterns, categories, onSelect handler) 46795 */ 46796 const usePatternsState = (onInsert, rootClientId, selectedCategory) => { 46797 const { 46798 patternCategories, 46799 patterns, 46800 userPatternCategories 46801 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 46802 const { 46803 __experimentalGetAllowedPatterns, 46804 getSettings 46805 } = select(store); 46806 const { 46807 __experimentalUserPatternCategories, 46808 __experimentalBlockPatternCategories 46809 } = getSettings(); 46810 return { 46811 patterns: __experimentalGetAllowedPatterns(rootClientId), 46812 userPatternCategories: __experimentalUserPatternCategories, 46813 patternCategories: __experimentalBlockPatternCategories 46814 }; 46815 }, [rootClientId]); 46816 const allCategories = (0,external_wp_element_namespaceObject.useMemo)(() => { 46817 const categories = [...patternCategories]; 46818 userPatternCategories?.forEach(userCategory => { 46819 if (!categories.find(existingCategory => existingCategory.name === userCategory.name)) { 46820 categories.push(userCategory); 46821 } 46822 }); 46823 return categories; 46824 }, [patternCategories, userPatternCategories]); 46825 const { 46826 createSuccessNotice 46827 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_notices_namespaceObject.store); 46828 const onClickPattern = (0,external_wp_element_namespaceObject.useCallback)((pattern, blocks) => { 46829 const patternBlocks = pattern.type === INSERTER_PATTERN_TYPES.user && pattern.syncStatus !== 'unsynced' ? [(0,external_wp_blocks_namespaceObject.createBlock)('core/block', { 46830 ref: pattern.id 46831 })] : blocks; 46832 onInsert((patternBlocks !== null && patternBlocks !== void 0 ? patternBlocks : []).map(block => { 46833 const clonedBlock = (0,external_wp_blocks_namespaceObject.cloneBlock)(block); 46834 if (clonedBlock.attributes.metadata?.categories?.includes(selectedCategory)) { 46835 clonedBlock.attributes.metadata.categories = [selectedCategory]; 46836 } 46837 return clonedBlock; 46838 }), pattern.name); 46839 createSuccessNotice((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: block pattern title. */ 46840 (0,external_wp_i18n_namespaceObject.__)('Block pattern "%s" inserted.'), pattern.title), { 46841 type: 'snackbar', 46842 id: 'block-pattern-inserted-notice' 46843 }); 46844 }, [createSuccessNotice, onInsert, selectedCategory]); 46845 return [patterns, allCategories, onClickPattern]; 46846 }; 46847 /* harmony default export */ const use_patterns_state = (usePatternsState); 46848 46849 // EXTERNAL MODULE: ./node_modules/remove-accents/index.js 46850 var remove_accents = __webpack_require__(9681); 46851 var remove_accents_default = /*#__PURE__*/__webpack_require__.n(remove_accents); 46852 ;// CONCATENATED MODULE: ./node_modules/lower-case/dist.es2015/index.js 46853 /** 46854 * Source: ftp://ftp.unicode.org/Public/UCD/latest/ucd/SpecialCasing.txt 46855 */ 46856 var SUPPORTED_LOCALE = { 46857 tr: { 46858 regexp: /\u0130|\u0049|\u0049\u0307/g, 46859 map: { 46860 İ: "\u0069", 46861 I: "\u0131", 46862 İ: "\u0069", 46863 }, 46864 }, 46865 az: { 46866 regexp: /\u0130/g, 46867 map: { 46868 İ: "\u0069", 46869 I: "\u0131", 46870 İ: "\u0069", 46871 }, 46872 }, 46873 lt: { 46874 regexp: /\u0049|\u004A|\u012E|\u00CC|\u00CD|\u0128/g, 46875 map: { 46876 I: "\u0069\u0307", 46877 J: "\u006A\u0307", 46878 Į: "\u012F\u0307", 46879 Ì: "\u0069\u0307\u0300", 46880 Í: "\u0069\u0307\u0301", 46881 Ĩ: "\u0069\u0307\u0303", 46882 }, 46883 }, 46884 }; 46885 /** 46886 * Localized lower case. 46887 */ 46888 function localeLowerCase(str, locale) { 46889 var lang = SUPPORTED_LOCALE[locale.toLowerCase()]; 46890 if (lang) 46891 return lowerCase(str.replace(lang.regexp, function (m) { return lang.map[m]; })); 46892 return lowerCase(str); 46893 } 46894 /** 46895 * Lower case as a function. 46896 */ 46897 function lowerCase(str) { 46898 return str.toLowerCase(); 46899 } 46900 46901 ;// CONCATENATED MODULE: ./node_modules/no-case/dist.es2015/index.js 46902 46903 // Support camel case ("camelCase" -> "camel Case" and "CAMELCase" -> "CAMEL Case"). 46904 var DEFAULT_SPLIT_REGEXP = [/([a-z0-9])([A-Z])/g, /([A-Z])([A-Z][a-z])/g]; 46905 // Remove all non-word characters. 46906 var DEFAULT_STRIP_REGEXP = /[^A-Z0-9]+/gi; 46907 /** 46908 * Normalize the string into something other libraries can manipulate easier. 46909 */ 46910 function noCase(input, options) { 46911 if (options === void 0) { options = {}; } 46912 var _a = options.splitRegexp, splitRegexp = _a === void 0 ? DEFAULT_SPLIT_REGEXP : _a, _b = options.stripRegexp, stripRegexp = _b === void 0 ? DEFAULT_STRIP_REGEXP : _b, _c = options.transform, transform = _c === void 0 ? lowerCase : _c, _d = options.delimiter, delimiter = _d === void 0 ? " " : _d; 46913 var result = dist_es2015_replace(dist_es2015_replace(input, splitRegexp, "$1\0$2"), stripRegexp, "\0"); 46914 var start = 0; 46915 var end = result.length; 46916 // Trim the delimiter from around the output string. 46917 while (result.charAt(start) === "\0") 46918 start++; 46919 while (result.charAt(end - 1) === "\0") 46920 end--; 46921 // Transform each token independently. 46922 return result.slice(start, end).split("\0").map(transform).join(delimiter); 46923 } 46924 /** 46925 * Replace `re` in the input string with the replacement value. 46926 */ 46927 function dist_es2015_replace(input, re, value) { 46928 if (re instanceof RegExp) 46929 return input.replace(re, value); 46930 return re.reduce(function (input, re) { return input.replace(re, value); }, input); 46931 } 46932 46933 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/search-items.js 46934 /** 46935 * External dependencies 46936 */ 46937 46938 46939 46940 // Default search helpers. 46941 const defaultGetName = item => item.name || ''; 46942 const defaultGetTitle = item => item.title; 46943 const defaultGetDescription = item => item.description || ''; 46944 const defaultGetKeywords = item => item.keywords || []; 46945 const defaultGetCategory = item => item.category; 46946 const defaultGetCollection = () => null; 46947 46948 // Normalization regexes 46949 const splitRegexp = [/([\p{Ll}\p{Lo}\p{N}])([\p{Lu}\p{Lt}])/gu, 46950 // One lowercase or digit, followed by one uppercase. 46951 /([\p{Lu}\p{Lt}])([\p{Lu}\p{Lt}][\p{Ll}\p{Lo}])/gu // One uppercase followed by one uppercase and one lowercase. 46952 ]; 46953 const stripRegexp = /(\p{C}|\p{P}|\p{S})+/giu; // Anything that's not a punctuation, symbol or control/format character. 46954 46955 // Normalization cache 46956 const extractedWords = new Map(); 46957 const normalizedStrings = new Map(); 46958 46959 /** 46960 * Extracts words from an input string. 46961 * 46962 * @param {string} input The input string. 46963 * 46964 * @return {Array} Words, extracted from the input string. 46965 */ 46966 function extractWords(input = '') { 46967 if (extractedWords.has(input)) { 46968 return extractedWords.get(input); 46969 } 46970 const result = noCase(input, { 46971 splitRegexp, 46972 stripRegexp 46973 }).split(' ').filter(Boolean); 46974 extractedWords.set(input, result); 46975 return result; 46976 } 46977 46978 /** 46979 * Sanitizes the search input string. 46980 * 46981 * @param {string} input The search input to normalize. 46982 * 46983 * @return {string} The normalized search input. 46984 */ 46985 function normalizeString(input = '') { 46986 if (normalizedStrings.has(input)) { 46987 return normalizedStrings.get(input); 46988 } 46989 46990 // Disregard diacritics. 46991 // Input: "média" 46992 let result = remove_accents_default()(input); 46993 46994 // Accommodate leading slash, matching autocomplete expectations. 46995 // Input: "/media" 46996 result = result.replace(/^\//, ''); 46997 46998 // Lowercase. 46999 // Input: "MEDIA" 47000 result = result.toLowerCase(); 47001 normalizedStrings.set(input, result); 47002 return result; 47003 } 47004 47005 /** 47006 * Converts the search term into a list of normalized terms. 47007 * 47008 * @param {string} input The search term to normalize. 47009 * 47010 * @return {string[]} The normalized list of search terms. 47011 */ 47012 const getNormalizedSearchTerms = (input = '') => { 47013 return extractWords(normalizeString(input)); 47014 }; 47015 const removeMatchingTerms = (unmatchedTerms, unprocessedTerms) => { 47016 return unmatchedTerms.filter(term => !getNormalizedSearchTerms(unprocessedTerms).some(unprocessedTerm => unprocessedTerm.includes(term))); 47017 }; 47018 const searchBlockItems = (items, categories, collections, searchInput) => { 47019 const normalizedSearchTerms = getNormalizedSearchTerms(searchInput); 47020 if (normalizedSearchTerms.length === 0) { 47021 return items; 47022 } 47023 const config = { 47024 getCategory: item => categories.find(({ 47025 slug 47026 }) => slug === item.category)?.title, 47027 getCollection: item => collections[item.name.split('/')[0]]?.title 47028 }; 47029 return searchItems(items, searchInput, config); 47030 }; 47031 47032 /** 47033 * Filters an item list given a search term. 47034 * 47035 * @param {Array} items Item list 47036 * @param {string} searchInput Search input. 47037 * @param {Object} config Search Config. 47038 * 47039 * @return {Array} Filtered item list. 47040 */ 47041 const searchItems = (items = [], searchInput = '', config = {}) => { 47042 const normalizedSearchTerms = getNormalizedSearchTerms(searchInput); 47043 if (normalizedSearchTerms.length === 0) { 47044 return items; 47045 } 47046 const rankedItems = items.map(item => { 47047 return [item, getItemSearchRank(item, searchInput, config)]; 47048 }).filter(([, rank]) => rank > 0); 47049 rankedItems.sort(([, rank1], [, rank2]) => rank2 - rank1); 47050 return rankedItems.map(([item]) => item); 47051 }; 47052 47053 /** 47054 * Get the search rank for a given item and a specific search term. 47055 * The better the match, the higher the rank. 47056 * If the rank equals 0, it should be excluded from the results. 47057 * 47058 * @param {Object} item Item to filter. 47059 * @param {string} searchTerm Search term. 47060 * @param {Object} config Search Config. 47061 * 47062 * @return {number} Search Rank. 47063 */ 47064 function getItemSearchRank(item, searchTerm, config = {}) { 47065 const { 47066 getName = defaultGetName, 47067 getTitle = defaultGetTitle, 47068 getDescription = defaultGetDescription, 47069 getKeywords = defaultGetKeywords, 47070 getCategory = defaultGetCategory, 47071 getCollection = defaultGetCollection 47072 } = config; 47073 const name = getName(item); 47074 const title = getTitle(item); 47075 const description = getDescription(item); 47076 const keywords = getKeywords(item); 47077 const category = getCategory(item); 47078 const collection = getCollection(item); 47079 const normalizedSearchInput = normalizeString(searchTerm); 47080 const normalizedTitle = normalizeString(title); 47081 let rank = 0; 47082 47083 // Prefers exact matches 47084 // Then prefers if the beginning of the title matches the search term 47085 // name, keywords, categories, collection, variations match come later. 47086 if (normalizedSearchInput === normalizedTitle) { 47087 rank += 30; 47088 } else if (normalizedTitle.startsWith(normalizedSearchInput)) { 47089 rank += 20; 47090 } else { 47091 const terms = [name, title, description, ...keywords, category, collection].join(' '); 47092 const normalizedSearchTerms = extractWords(normalizedSearchInput); 47093 const unmatchedTerms = removeMatchingTerms(normalizedSearchTerms, terms); 47094 if (unmatchedTerms.length === 0) { 47095 rank += 10; 47096 } 47097 } 47098 47099 // Give a better rank to "core" namespaced items. 47100 if (rank !== 0 && name.startsWith('core/')) { 47101 const isCoreBlockVariation = name !== item.id; 47102 // Give a bit better rank to "core" blocks over "core" block variations. 47103 rank += isCoreBlockVariation ? 1 : 2; 47104 } 47105 return rank; 47106 } 47107 47108 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/hooks/use-patterns-paging.js 47109 /** 47110 * WordPress dependencies 47111 */ 47112 47113 47114 47115 const PAGE_SIZE = 20; 47116 const INITIAL_INSERTER_RESULTS = 5; 47117 47118 /** 47119 * Supplies values needed to page the patterns list client side. 47120 * 47121 * @param {Array} currentCategoryPatterns An array of the current patterns to display. 47122 * @param {string} currentCategory The currently selected category. 47123 * @param {Object} scrollContainerRef Ref of container to to find scroll container for when moving between pages. 47124 * @param {string} currentFilter The currently search filter. 47125 * 47126 * @return {Object} Returns the relevant paging values. (totalItems, categoryPatternsList, numPages, changePage, currentPage) 47127 */ 47128 function usePatternsPaging(currentCategoryPatterns, currentCategory, scrollContainerRef, currentFilter = '') { 47129 const [currentPage, setCurrentPage] = (0,external_wp_element_namespaceObject.useState)(1); 47130 const previousCategory = (0,external_wp_compose_namespaceObject.usePrevious)(currentCategory); 47131 const previousFilter = (0,external_wp_compose_namespaceObject.usePrevious)(currentFilter); 47132 if ((previousCategory !== currentCategory || previousFilter !== currentFilter) && currentPage !== 1) { 47133 setCurrentPage(1); 47134 } 47135 const totalItems = currentCategoryPatterns.length; 47136 const pageIndex = currentPage - 1; 47137 const categoryPatterns = (0,external_wp_element_namespaceObject.useMemo)(() => { 47138 return currentCategoryPatterns.slice(pageIndex * PAGE_SIZE, pageIndex * PAGE_SIZE + PAGE_SIZE); 47139 }, [pageIndex, currentCategoryPatterns]); 47140 const categoryPatternsAsyncList = (0,external_wp_compose_namespaceObject.useAsyncList)(categoryPatterns, { 47141 step: INITIAL_INSERTER_RESULTS 47142 }); 47143 const numPages = Math.ceil(currentCategoryPatterns.length / PAGE_SIZE); 47144 const changePage = page => { 47145 const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(scrollContainerRef?.current); 47146 scrollContainer?.scrollTo(0, 0); 47147 setCurrentPage(page); 47148 }; 47149 (0,external_wp_element_namespaceObject.useEffect)(function scrollToTopOnCategoryChange() { 47150 const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(scrollContainerRef?.current); 47151 scrollContainer?.scrollTo(0, 0); 47152 }, [currentCategory, scrollContainerRef]); 47153 return { 47154 totalItems, 47155 categoryPatterns, 47156 categoryPatternsAsyncList, 47157 numPages, 47158 changePage, 47159 currentPage 47160 }; 47161 } 47162 47163 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-patterns-explorer/pattern-list.js 47164 /** 47165 * WordPress dependencies 47166 */ 47167 47168 47169 47170 47171 47172 47173 /** 47174 * Internal dependencies 47175 */ 47176 47177 47178 47179 47180 47181 47182 47183 47184 47185 47186 47187 function PatternsListHeader({ 47188 filterValue, 47189 filteredBlockPatternsLength 47190 }) { 47191 if (!filterValue) { 47192 return null; 47193 } 47194 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalHeading, { 47195 level: 2, 47196 lineHeight: "48px", 47197 className: "block-editor-block-patterns-explorer__search-results-count", 47198 children: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of patterns. */ 47199 (0,external_wp_i18n_namespaceObject._n)('%d pattern found', '%d patterns found', filteredBlockPatternsLength), filteredBlockPatternsLength) 47200 }); 47201 } 47202 function PatternList({ 47203 searchValue, 47204 selectedCategory, 47205 patternCategories, 47206 rootClientId 47207 }) { 47208 const container = (0,external_wp_element_namespaceObject.useRef)(); 47209 const debouncedSpeak = (0,external_wp_compose_namespaceObject.useDebounce)(external_wp_a11y_namespaceObject.speak, 500); 47210 const [destinationRootClientId, onInsertBlocks] = use_insertion_point({ 47211 rootClientId, 47212 shouldFocusBlock: true 47213 }); 47214 const [patterns,, onClickPattern] = use_patterns_state(onInsertBlocks, destinationRootClientId, selectedCategory); 47215 const registeredPatternCategories = (0,external_wp_element_namespaceObject.useMemo)(() => patternCategories.map(patternCategory => patternCategory.name), [patternCategories]); 47216 const filteredBlockPatterns = (0,external_wp_element_namespaceObject.useMemo)(() => { 47217 const filteredPatterns = patterns.filter(pattern => { 47218 if (selectedCategory === allPatternsCategory.name) { 47219 return true; 47220 } 47221 if (selectedCategory === myPatternsCategory.name && pattern.type === INSERTER_PATTERN_TYPES.user) { 47222 return true; 47223 } 47224 if (selectedCategory === 'uncategorized') { 47225 var _pattern$categories$s; 47226 const hasKnownCategory = (_pattern$categories$s = pattern.categories?.some(category => registeredPatternCategories.includes(category))) !== null && _pattern$categories$s !== void 0 ? _pattern$categories$s : false; 47227 return !pattern.categories?.length || !hasKnownCategory; 47228 } 47229 return pattern.categories?.includes(selectedCategory); 47230 }); 47231 if (!searchValue) { 47232 return filteredPatterns; 47233 } 47234 return searchItems(filteredPatterns, searchValue); 47235 }, [searchValue, patterns, selectedCategory, registeredPatternCategories]); 47236 47237 // Announce search results on change. 47238 (0,external_wp_element_namespaceObject.useEffect)(() => { 47239 if (!searchValue) { 47240 return; 47241 } 47242 const count = filteredBlockPatterns.length; 47243 const resultsFoundMessage = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */ 47244 (0,external_wp_i18n_namespaceObject._n)('%d result found.', '%d results found.', count), count); 47245 debouncedSpeak(resultsFoundMessage); 47246 }, [searchValue, debouncedSpeak, filteredBlockPatterns.length]); 47247 const pagingProps = usePatternsPaging(filteredBlockPatterns, selectedCategory, container); 47248 47249 // Reset page when search value changes. 47250 const [previousSearchValue, setPreviousSearchValue] = (0,external_wp_element_namespaceObject.useState)(searchValue); 47251 if (searchValue !== previousSearchValue) { 47252 setPreviousSearchValue(searchValue); 47253 pagingProps.changePage(1); 47254 } 47255 const hasItems = !!filteredBlockPatterns?.length; 47256 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 47257 className: "block-editor-block-patterns-explorer__list", 47258 ref: container, 47259 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PatternsListHeader, { 47260 filterValue: searchValue, 47261 filteredBlockPatternsLength: filteredBlockPatterns.length 47262 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter_listbox, { 47263 children: hasItems && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 47264 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_patterns_list, { 47265 shownPatterns: pagingProps.categoryPatternsAsyncList, 47266 blockPatterns: pagingProps.categoryPatterns, 47267 onClickPattern: onClickPattern, 47268 isDraggable: false 47269 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Pagination, { 47270 ...pagingProps 47271 })] 47272 }) 47273 })] 47274 }); 47275 } 47276 /* harmony default export */ const pattern_list = (PatternList); 47277 47278 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-patterns-tab/use-pattern-categories.js 47279 /** 47280 * WordPress dependencies 47281 */ 47282 47283 47284 47285 47286 /** 47287 * Internal dependencies 47288 */ 47289 47290 47291 function hasRegisteredCategory(pattern, allCategories) { 47292 if (!pattern.categories || !pattern.categories.length) { 47293 return false; 47294 } 47295 return pattern.categories.some(cat => allCategories.some(category => category.name === cat)); 47296 } 47297 function usePatternCategories(rootClientId, sourceFilter = 'all') { 47298 const [patterns, allCategories] = use_patterns_state(undefined, rootClientId); 47299 const filteredPatterns = (0,external_wp_element_namespaceObject.useMemo)(() => sourceFilter === 'all' ? patterns : patterns.filter(pattern => !isPatternFiltered(pattern, sourceFilter)), [sourceFilter, patterns]); 47300 47301 // Remove any empty categories. 47302 const populatedCategories = (0,external_wp_element_namespaceObject.useMemo)(() => { 47303 const categories = allCategories.filter(category => filteredPatterns.some(pattern => pattern.categories?.includes(category.name))).sort((a, b) => a.label.localeCompare(b.label)); 47304 if (filteredPatterns.some(pattern => !hasRegisteredCategory(pattern, allCategories)) && !categories.find(category => category.name === 'uncategorized')) { 47305 categories.push({ 47306 name: 'uncategorized', 47307 label: (0,external_wp_i18n_namespaceObject._x)('Uncategorized') 47308 }); 47309 } 47310 if (filteredPatterns.some(pattern => pattern.type === INSERTER_PATTERN_TYPES.user)) { 47311 categories.unshift(myPatternsCategory); 47312 } 47313 if (filteredPatterns.length > 0) { 47314 categories.unshift({ 47315 name: allPatternsCategory.name, 47316 label: allPatternsCategory.label 47317 }); 47318 } 47319 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of categories . */ 47320 (0,external_wp_i18n_namespaceObject._n)('%d category button displayed.', '%d category buttons displayed.', categories.length), categories.length)); 47321 return categories; 47322 }, [allCategories, filteredPatterns]); 47323 return populatedCategories; 47324 } 47325 47326 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-patterns-explorer/index.js 47327 /** 47328 * WordPress dependencies 47329 */ 47330 47331 47332 47333 47334 /** 47335 * Internal dependencies 47336 */ 47337 47338 47339 47340 47341 47342 function PatternsExplorer({ 47343 initialCategory, 47344 rootClientId 47345 }) { 47346 const [searchValue, setSearchValue] = (0,external_wp_element_namespaceObject.useState)(''); 47347 const [selectedCategory, setSelectedCategory] = (0,external_wp_element_namespaceObject.useState)(initialCategory?.name); 47348 const patternCategories = usePatternCategories(rootClientId); 47349 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 47350 className: "block-editor-block-patterns-explorer", 47351 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(pattern_explorer_sidebar, { 47352 selectedCategory: selectedCategory, 47353 patternCategories: patternCategories, 47354 onClickCategory: setSelectedCategory, 47355 searchValue: searchValue, 47356 setSearchValue: setSearchValue 47357 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(pattern_list, { 47358 searchValue: searchValue, 47359 selectedCategory: selectedCategory, 47360 patternCategories: patternCategories, 47361 rootClientId: rootClientId 47362 })] 47363 }); 47364 } 47365 function PatternsExplorerModal({ 47366 onModalClose, 47367 ...restProps 47368 }) { 47369 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Modal, { 47370 title: (0,external_wp_i18n_namespaceObject.__)('Patterns'), 47371 onRequestClose: onModalClose, 47372 isFullScreen: true, 47373 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PatternsExplorer, { 47374 ...restProps 47375 }) 47376 }); 47377 } 47378 /* harmony default export */ const block_patterns_explorer = (PatternsExplorerModal); 47379 47380 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/mobile-tab-navigation.js 47381 /** 47382 * WordPress dependencies 47383 */ 47384 47385 47386 47387 47388 47389 function ScreenHeader({ 47390 title 47391 }) { 47392 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalVStack, { 47393 spacing: 0, 47394 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalView, { 47395 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalSpacer, { 47396 marginBottom: 0, 47397 paddingX: 4, 47398 paddingY: 3, 47399 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 47400 spacing: 2, 47401 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNavigatorBackButton, { 47402 style: 47403 // TODO: This style override is also used in ToolsPanelHeader. 47404 // It should be supported out-of-the-box by Button. 47405 { 47406 minWidth: 24, 47407 padding: 0 47408 }, 47409 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_right : chevron_left, 47410 size: "small", 47411 label: (0,external_wp_i18n_namespaceObject.__)('Back') 47412 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalSpacer, { 47413 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalHeading, { 47414 level: 5, 47415 children: title 47416 }) 47417 })] 47418 }) 47419 }) 47420 }) 47421 }); 47422 } 47423 function MobileTabNavigation({ 47424 categories, 47425 children 47426 }) { 47427 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalNavigatorProvider, { 47428 initialPath: "/", 47429 className: "block-editor-inserter__mobile-tab-navigation", 47430 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNavigatorScreen, { 47431 path: "/", 47432 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalItemGroup, { 47433 children: categories.map(category => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNavigatorButton, { 47434 path: `/category/$category.name}`, 47435 as: external_wp_components_namespaceObject.__experimentalItem, 47436 isAction: true, 47437 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 47438 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexBlock, { 47439 children: category.label 47440 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 47441 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_left : chevron_right 47442 })] 47443 }) 47444 }, category.name)) 47445 }) 47446 }), categories.map(category => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalNavigatorScreen, { 47447 path: `/category/$category.name}`, 47448 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ScreenHeader, { 47449 title: (0,external_wp_i18n_namespaceObject.__)('Back') 47450 }), children(category)] 47451 }, category.name))] 47452 }); 47453 } 47454 47455 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-patterns-tab/patterns-filter.js 47456 /** 47457 * WordPress dependencies 47458 */ 47459 47460 47461 47462 47463 47464 /** 47465 * Internal dependencies 47466 */ 47467 47468 47469 47470 47471 const getShouldDisableSyncFilter = sourceFilter => sourceFilter !== 'all' && sourceFilter !== 'user'; 47472 const getShouldHideSourcesFilter = category => { 47473 return category.name === myPatternsCategory.name; 47474 }; 47475 const PATTERN_SOURCE_MENU_OPTIONS = [{ 47476 value: 'all', 47477 label: (0,external_wp_i18n_namespaceObject._x)('All', 'patterns') 47478 }, { 47479 value: INSERTER_PATTERN_TYPES.directory, 47480 label: (0,external_wp_i18n_namespaceObject.__)('Pattern Directory') 47481 }, { 47482 value: INSERTER_PATTERN_TYPES.theme, 47483 label: (0,external_wp_i18n_namespaceObject.__)('Theme & Plugins') 47484 }, { 47485 value: INSERTER_PATTERN_TYPES.user, 47486 label: (0,external_wp_i18n_namespaceObject.__)('User') 47487 }]; 47488 function PatternsFilter({ 47489 setPatternSyncFilter, 47490 setPatternSourceFilter, 47491 patternSyncFilter, 47492 patternSourceFilter, 47493 scrollContainerRef, 47494 category 47495 }) { 47496 // If the category is `myPatterns` then we need to set the source filter to `user`, but 47497 // we do this by deriving from props rather than calling setPatternSourceFilter otherwise 47498 // the user may be confused when switching to another category if the haven't explicity set 47499 // this filter themselves. 47500 const currentPatternSourceFilter = category.name === myPatternsCategory.name ? INSERTER_PATTERN_TYPES.user : patternSourceFilter; 47501 47502 // We need to disable the sync filter option if the source filter is not 'all' or 'user' 47503 // otherwise applying them will just result in no patterns being shown. 47504 const shouldDisableSyncFilter = getShouldDisableSyncFilter(currentPatternSourceFilter); 47505 47506 // We also hide the directory and theme source filter if the category is `myPatterns` 47507 // otherwise there will only be one option available. 47508 const shouldHideSourcesFilter = getShouldHideSourcesFilter(category); 47509 const patternSyncMenuOptions = (0,external_wp_element_namespaceObject.useMemo)(() => [{ 47510 value: 'all', 47511 label: (0,external_wp_i18n_namespaceObject._x)('All', 'patterns') 47512 }, { 47513 value: INSERTER_SYNC_TYPES.full, 47514 label: (0,external_wp_i18n_namespaceObject._x)('Synced', 'patterns'), 47515 disabled: shouldDisableSyncFilter 47516 }, { 47517 value: INSERTER_SYNC_TYPES.unsynced, 47518 label: (0,external_wp_i18n_namespaceObject._x)('Not synced', 'patterns'), 47519 disabled: shouldDisableSyncFilter 47520 }], [shouldDisableSyncFilter]); 47521 function handleSetSourceFilterChange(newSourceFilter) { 47522 setPatternSourceFilter(newSourceFilter); 47523 if (getShouldDisableSyncFilter(newSourceFilter)) { 47524 setPatternSyncFilter('all'); 47525 } 47526 } 47527 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 47528 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropdownMenu, { 47529 popoverProps: { 47530 placement: 'right-end' 47531 }, 47532 label: (0,external_wp_i18n_namespaceObject.__)('Filter patterns'), 47533 toggleProps: { 47534 size: 'compact' 47535 }, 47536 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 47537 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SVG, { 47538 width: "24", 47539 height: "24", 47540 viewBox: "0 0 24 24", 47541 fill: "none", 47542 xmlns: "http://www.w3.org/2000/svg", 47543 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Path, { 47544 d: "M10 17.5H14V16H10V17.5ZM6 6V7.5H18V6H6ZM8 12.5H16V11H8V12.5Z", 47545 fill: "currentColor" 47546 }) 47547 }) 47548 }), 47549 children: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 47550 children: [!shouldHideSourcesFilter && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 47551 label: (0,external_wp_i18n_namespaceObject.__)('Source'), 47552 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItemsChoice, { 47553 choices: PATTERN_SOURCE_MENU_OPTIONS, 47554 onSelect: value => { 47555 handleSetSourceFilterChange(value); 47556 scrollContainerRef.current?.scrollTo(0, 0); 47557 }, 47558 value: currentPatternSourceFilter 47559 }) 47560 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 47561 label: (0,external_wp_i18n_namespaceObject.__)('Type'), 47562 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItemsChoice, { 47563 choices: patternSyncMenuOptions, 47564 onSelect: value => { 47565 setPatternSyncFilter(value); 47566 scrollContainerRef.current?.scrollTo(0, 0); 47567 }, 47568 value: patternSyncFilter 47569 }) 47570 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 47571 className: "block-editor-tool-selector__help", 47572 children: (0,external_wp_element_namespaceObject.createInterpolateElement)((0,external_wp_i18n_namespaceObject.__)('Patterns are available from the <Link>WordPress.org Pattern Directory</Link>, bundled in the active theme, or created by users on this site. Only patterns created on this site can be synced.'), { 47573 Link: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ExternalLink, { 47574 href: (0,external_wp_i18n_namespaceObject.__)('https://wordpress.org/patterns/') 47575 }) 47576 }) 47577 })] 47578 }) 47579 }) 47580 }); 47581 } 47582 47583 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-patterns-tab/pattern-category-previews.js 47584 /** 47585 * WordPress dependencies 47586 */ 47587 47588 47589 47590 47591 47592 /** 47593 * Internal dependencies 47594 */ 47595 47596 47597 47598 47599 47600 47601 47602 47603 47604 47605 const pattern_category_previews_noop = () => {}; 47606 function PatternCategoryPreviews({ 47607 rootClientId, 47608 onInsert, 47609 onHover = pattern_category_previews_noop, 47610 category, 47611 showTitlesAsTooltip 47612 }) { 47613 const isZoomOutMode = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).__unstableGetEditorMode() === 'zoom-out', []); 47614 const [allPatterns,, onClickPattern] = use_patterns_state(onInsert, rootClientId, category?.name); 47615 const [patternSyncFilter, setPatternSyncFilter] = (0,external_wp_element_namespaceObject.useState)('all'); 47616 const [patternSourceFilter, setPatternSourceFilter] = (0,external_wp_element_namespaceObject.useState)('all'); 47617 const availableCategories = usePatternCategories(rootClientId, patternSourceFilter); 47618 const scrollContainerRef = (0,external_wp_element_namespaceObject.useRef)(); 47619 const currentCategoryPatterns = (0,external_wp_element_namespaceObject.useMemo)(() => allPatterns.filter(pattern => { 47620 if (isPatternFiltered(pattern, patternSourceFilter, patternSyncFilter)) { 47621 return false; 47622 } 47623 if (category.name === allPatternsCategory.name) { 47624 return true; 47625 } 47626 if (category.name === myPatternsCategory.name && pattern.type === INSERTER_PATTERN_TYPES.user) { 47627 return true; 47628 } 47629 if (category.name === 'uncategorized') { 47630 // The uncategorized category should show all the patterns without any category... 47631 if (!pattern.categories) { 47632 return true; 47633 } 47634 47635 // ...or with no available category. 47636 return !pattern.categories.some(catName => availableCategories.some(c => c.name === catName)); 47637 } 47638 return pattern.categories?.includes(category.name); 47639 }), [allPatterns, availableCategories, category.name, patternSourceFilter, patternSyncFilter]); 47640 const pagingProps = usePatternsPaging(currentCategoryPatterns, category, scrollContainerRef); 47641 const { 47642 changePage 47643 } = pagingProps; 47644 47645 // Hide block pattern preview on unmount. 47646 // eslint-disable-next-line react-hooks/exhaustive-deps 47647 (0,external_wp_element_namespaceObject.useEffect)(() => () => onHover(null), []); 47648 const onSetPatternSyncFilter = (0,external_wp_element_namespaceObject.useCallback)(value => { 47649 setPatternSyncFilter(value); 47650 changePage(1); 47651 }, [setPatternSyncFilter, changePage]); 47652 const onSetPatternSourceFilter = (0,external_wp_element_namespaceObject.useCallback)(value => { 47653 setPatternSourceFilter(value); 47654 changePage(1); 47655 }, [setPatternSourceFilter, changePage]); 47656 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 47657 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 47658 spacing: 2, 47659 className: "block-editor-inserter__patterns-category-panel-header", 47660 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 47661 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexBlock, { 47662 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalHeading, { 47663 className: "block-editor-inserter__patterns-category-panel-title", 47664 size: 13, 47665 level: 4, 47666 as: "div", 47667 children: category.label 47668 }) 47669 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PatternsFilter, { 47670 patternSyncFilter: patternSyncFilter, 47671 patternSourceFilter: patternSourceFilter, 47672 setPatternSyncFilter: onSetPatternSyncFilter, 47673 setPatternSourceFilter: onSetPatternSourceFilter, 47674 scrollContainerRef: scrollContainerRef, 47675 category: category 47676 })] 47677 }), !currentCategoryPatterns.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 47678 variant: "muted", 47679 className: "block-editor-inserter__patterns-category-no-results", 47680 children: (0,external_wp_i18n_namespaceObject.__)('No results found') 47681 })] 47682 }), currentCategoryPatterns.length > 0 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 47683 children: [isZoomOutMode && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 47684 size: "12", 47685 as: "p", 47686 className: "block-editor-inserter__help-text", 47687 children: (0,external_wp_i18n_namespaceObject.__)('Drag and drop patterns into the canvas.') 47688 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_patterns_list, { 47689 ref: scrollContainerRef, 47690 shownPatterns: pagingProps.categoryPatternsAsyncList, 47691 blockPatterns: pagingProps.categoryPatterns, 47692 onClickPattern: onClickPattern, 47693 onHover: onHover, 47694 label: category.label, 47695 orientation: "vertical", 47696 category: category.name, 47697 isDraggable: true, 47698 showTitlesAsTooltip: showTitlesAsTooltip, 47699 patternFilter: patternSourceFilter, 47700 pagingProps: pagingProps 47701 })] 47702 })] 47703 }); 47704 } 47705 47706 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/category-tabs/index.js 47707 /** 47708 * WordPress dependencies 47709 */ 47710 47711 47712 47713 47714 47715 /** 47716 * Internal dependencies 47717 */ 47718 47719 47720 47721 const { 47722 Tabs: category_tabs_Tabs 47723 } = unlock(external_wp_components_namespaceObject.privateApis); 47724 function CategoryTabs({ 47725 categories, 47726 selectedCategory, 47727 onSelectCategory, 47728 children 47729 }) { 47730 // Copied from InterfaceSkeleton. 47731 const ANIMATION_DURATION = 0.25; 47732 const disableMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); 47733 const defaultTransition = { 47734 type: 'tween', 47735 duration: disableMotion ? 0 : ANIMATION_DURATION, 47736 ease: [0.6, 0, 0.4, 1] 47737 }; 47738 const previousSelectedCategory = (0,external_wp_compose_namespaceObject.usePrevious)(selectedCategory); 47739 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(category_tabs_Tabs, { 47740 className: "block-editor-inserter__category-tabs", 47741 selectOnMove: false, 47742 selectedTabId: selectedCategory ? selectedCategory.name : null, 47743 orientation: "vertical", 47744 onSelect: categoryId => { 47745 // Pass the full category object 47746 onSelectCategory(categories.find(category => category.name === categoryId)); 47747 }, 47748 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(category_tabs_Tabs.TabList, { 47749 className: "block-editor-inserter__category-tablist", 47750 children: categories.map(category => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(category_tabs_Tabs.Tab, { 47751 tabId: category.name, 47752 className: "block-editor-inserter__category-tab", 47753 "aria-label": category.label, 47754 "aria-current": category === selectedCategory ? 'true' : undefined, 47755 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 47756 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexBlock, { 47757 children: category.label 47758 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 47759 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_left : chevron_right 47760 })] 47761 }) 47762 }, category.name)) 47763 }), categories.map(category => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(category_tabs_Tabs.TabPanel, { 47764 tabId: category.name, 47765 focusable: false, 47766 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__unstableMotion.div, { 47767 className: "block-editor-inserter__category-panel", 47768 initial: !previousSelectedCategory ? 'closed' : 'open', 47769 animate: "open", 47770 variants: { 47771 open: { 47772 transform: 'translateX( 0 )', 47773 transitionEnd: { 47774 zIndex: '1' 47775 } 47776 }, 47777 closed: { 47778 transform: 'translateX( -100% )', 47779 zIndex: '-1' 47780 } 47781 }, 47782 transition: defaultTransition, 47783 children: children 47784 }) 47785 }, category.name))] 47786 }); 47787 } 47788 /* harmony default export */ const category_tabs = (CategoryTabs); 47789 47790 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-patterns-tab/index.js 47791 /** 47792 * WordPress dependencies 47793 */ 47794 47795 47796 47797 47798 47799 47800 /** 47801 * Internal dependencies 47802 */ 47803 47804 47805 47806 47807 47808 47809 47810 47811 47812 47813 47814 function BlockPatternsTab({ 47815 onSelectCategory, 47816 selectedCategory, 47817 onInsert, 47818 rootClientId, 47819 setHasCategories, 47820 children 47821 }) { 47822 const [showPatternsExplorer, setShowPatternsExplorer] = (0,external_wp_element_namespaceObject.useState)(false); 47823 const categories = usePatternCategories(rootClientId); 47824 const isMobile = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 47825 const isResolvingPatterns = (0,external_wp_data_namespaceObject.useSelect)(select => unlock(select(store)).isResolvingPatterns(), []); 47826 (0,external_wp_element_namespaceObject.useEffect)(() => { 47827 setHasCategories(!!categories.length); 47828 }, [categories, setHasCategories]); 47829 if (isResolvingPatterns) { 47830 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 47831 className: "block-editor-inserter__patterns-loading", 47832 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Spinner, {}) 47833 }); 47834 } 47835 if (!categories.length) { 47836 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(no_results, {}); 47837 } 47838 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 47839 children: [!isMobile && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 47840 className: "block-editor-inserter__block-patterns-tabs-container", 47841 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(category_tabs, { 47842 categories: categories, 47843 selectedCategory: selectedCategory, 47844 onSelectCategory: onSelectCategory, 47845 children: children 47846 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 47847 __next40pxDefaultSize: true, 47848 className: "block-editor-inserter__patterns-explore-button", 47849 onClick: () => setShowPatternsExplorer(true), 47850 variant: "secondary", 47851 children: (0,external_wp_i18n_namespaceObject.__)('Explore all patterns') 47852 })] 47853 }), isMobile && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MobileTabNavigation, { 47854 categories: categories, 47855 children: category => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 47856 className: "block-editor-inserter__category-panel", 47857 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PatternCategoryPreviews, { 47858 onInsert: onInsert, 47859 rootClientId: rootClientId, 47860 category: category, 47861 showTitlesAsTooltip: false 47862 }, category.name) 47863 }) 47864 }), showPatternsExplorer && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_patterns_explorer, { 47865 initialCategory: selectedCategory || categories[0], 47866 patternCategories: categories, 47867 onModalClose: () => setShowPatternsExplorer(false), 47868 rootClientId: rootClientId 47869 })] 47870 }); 47871 } 47872 /* harmony default export */ const block_patterns_tab = (BlockPatternsTab); 47873 47874 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/external.js 47875 /** 47876 * WordPress dependencies 47877 */ 47878 47879 47880 const external = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 47881 xmlns: "http://www.w3.org/2000/svg", 47882 viewBox: "0 0 24 24", 47883 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 47884 d: "M19.5 4.5h-7V6h4.44l-5.97 5.97 1.06 1.06L18 7.06v4.44h1.5v-7Zm-13 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-3H17v3a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h3V5.5h-3Z" 47885 }) 47886 }); 47887 /* harmony default export */ const library_external = (external); 47888 47889 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/media-tab/utils.js 47890 /** 47891 * WordPress dependencies 47892 */ 47893 47894 47895 const mediaTypeTag = { 47896 image: 'img', 47897 video: 'video', 47898 audio: 'audio' 47899 }; 47900 47901 /** @typedef {import('./hooks').InserterMediaItem} InserterMediaItem */ 47902 47903 /** 47904 * Creates a block and a preview element from a media object. 47905 * 47906 * @param {InserterMediaItem} media The media object to create the block from. 47907 * @param {('image'|'audio'|'video')} mediaType The media type to create the block for. 47908 * @return {[WPBlock, JSX.Element]} An array containing the block and the preview element. 47909 */ 47910 function getBlockAndPreviewFromMedia(media, mediaType) { 47911 // Add the common attributes between the different media types. 47912 const attributes = { 47913 id: media.id || undefined, 47914 caption: media.caption || undefined 47915 }; 47916 const mediaSrc = media.url; 47917 const alt = media.alt || undefined; 47918 if (mediaType === 'image') { 47919 attributes.url = mediaSrc; 47920 attributes.alt = alt; 47921 } else if (['video', 'audio'].includes(mediaType)) { 47922 attributes.src = mediaSrc; 47923 } 47924 const PreviewTag = mediaTypeTag[mediaType]; 47925 const preview = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PreviewTag, { 47926 src: media.previewUrl || mediaSrc, 47927 alt: alt, 47928 controls: mediaType === 'audio' ? true : undefined, 47929 inert: "true", 47930 onError: ({ 47931 currentTarget 47932 }) => { 47933 // Fall back to the media source if the preview cannot be loaded. 47934 if (currentTarget.src === media.previewUrl) { 47935 currentTarget.src = mediaSrc; 47936 } 47937 } 47938 }); 47939 return [(0,external_wp_blocks_namespaceObject.createBlock)(`core/$mediaType}`, attributes), preview]; 47940 } 47941 47942 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/media-tab/media-preview.js 47943 /** 47944 * External dependencies 47945 */ 47946 47947 47948 /** 47949 * WordPress dependencies 47950 */ 47951 47952 47953 47954 47955 47956 47957 47958 47959 47960 /** 47961 * Internal dependencies 47962 */ 47963 47964 47965 47966 47967 47968 47969 const ALLOWED_MEDIA_TYPES = ['image']; 47970 const MAXIMUM_TITLE_LENGTH = 25; 47971 const MEDIA_OPTIONS_POPOVER_PROPS = { 47972 position: 'bottom left', 47973 className: 'block-editor-inserter__media-list__item-preview-options__popover' 47974 }; 47975 function MediaPreviewOptions({ 47976 category, 47977 media 47978 }) { 47979 if (!category.getReportUrl) { 47980 return null; 47981 } 47982 const reportUrl = category.getReportUrl(media); 47983 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropdownMenu, { 47984 className: "block-editor-inserter__media-list__item-preview-options", 47985 label: (0,external_wp_i18n_namespaceObject.__)('Options'), 47986 popoverProps: MEDIA_OPTIONS_POPOVER_PROPS, 47987 icon: more_vertical, 47988 children: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 47989 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 47990 onClick: () => window.open(reportUrl, '_blank').focus(), 47991 icon: library_external, 47992 children: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: The media type to report e.g: "image", "video", "audio" */ 47993 (0,external_wp_i18n_namespaceObject.__)('Report %s'), category.mediaType) 47994 }) 47995 }) 47996 }); 47997 } 47998 function InsertExternalImageModal({ 47999 onClose, 48000 onSubmit 48001 }) { 48002 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Modal, { 48003 title: (0,external_wp_i18n_namespaceObject.__)('Insert external image'), 48004 onRequestClose: onClose, 48005 className: "block-editor-inserter-media-tab-media-preview-inserter-external-image-modal", 48006 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 48007 spacing: 3, 48008 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 48009 children: (0,external_wp_i18n_namespaceObject.__)('This image cannot be uploaded to your Media Library, but it can still be inserted as an external image.') 48010 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 48011 children: (0,external_wp_i18n_namespaceObject.__)('External images can be removed by the external provider without warning and could even have legal compliance issues related to privacy legislation.') 48012 })] 48013 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 48014 className: "block-editor-block-lock-modal__actions", 48015 justify: "flex-end", 48016 expanded: false, 48017 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 48018 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 48019 __next40pxDefaultSize: true, 48020 variant: "tertiary", 48021 onClick: onClose, 48022 children: (0,external_wp_i18n_namespaceObject.__)('Cancel') 48023 }) 48024 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 48025 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 48026 __next40pxDefaultSize: true, 48027 variant: "primary", 48028 onClick: onSubmit, 48029 children: (0,external_wp_i18n_namespaceObject.__)('Insert') 48030 }) 48031 })] 48032 })] 48033 }); 48034 } 48035 function MediaPreview({ 48036 media, 48037 onClick, 48038 category 48039 }) { 48040 const [showExternalUploadModal, setShowExternalUploadModal] = (0,external_wp_element_namespaceObject.useState)(false); 48041 const [isHovered, setIsHovered] = (0,external_wp_element_namespaceObject.useState)(false); 48042 const [isInserting, setIsInserting] = (0,external_wp_element_namespaceObject.useState)(false); 48043 const [block, preview] = (0,external_wp_element_namespaceObject.useMemo)(() => getBlockAndPreviewFromMedia(media, category.mediaType), [media, category.mediaType]); 48044 const { 48045 createErrorNotice, 48046 createSuccessNotice 48047 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_notices_namespaceObject.store); 48048 const { 48049 getSettings 48050 } = (0,external_wp_data_namespaceObject.useSelect)(store); 48051 const onMediaInsert = (0,external_wp_element_namespaceObject.useCallback)(previewBlock => { 48052 // Prevent multiple uploads when we're in the process of inserting. 48053 if (isInserting) { 48054 return; 48055 } 48056 const settings = getSettings(); 48057 const clonedBlock = (0,external_wp_blocks_namespaceObject.cloneBlock)(previewBlock); 48058 const { 48059 id, 48060 url, 48061 caption 48062 } = clonedBlock.attributes; 48063 48064 // User has no permission to upload media. 48065 if (!id && !settings.mediaUpload) { 48066 setShowExternalUploadModal(true); 48067 return; 48068 } 48069 48070 // Media item already exists in library, so just insert it. 48071 if (!!id) { 48072 onClick(clonedBlock); 48073 return; 48074 } 48075 setIsInserting(true); 48076 // Media item does not exist in library, so try to upload it. 48077 // Fist fetch the image data. This may fail if the image host 48078 // doesn't allow CORS with the domain. 48079 // If this happens, we insert the image block using the external 48080 // URL and let the user know about the possible implications. 48081 window.fetch(url).then(response => response.blob()).then(blob => { 48082 settings.mediaUpload({ 48083 filesList: [blob], 48084 additionalData: { 48085 caption 48086 }, 48087 onFileChange([img]) { 48088 if ((0,external_wp_blob_namespaceObject.isBlobURL)(img.url)) { 48089 return; 48090 } 48091 onClick({ 48092 ...clonedBlock, 48093 attributes: { 48094 ...clonedBlock.attributes, 48095 id: img.id, 48096 url: img.url 48097 } 48098 }); 48099 createSuccessNotice((0,external_wp_i18n_namespaceObject.__)('Image uploaded and inserted.'), { 48100 type: 'snackbar' 48101 }); 48102 setIsInserting(false); 48103 }, 48104 allowedTypes: ALLOWED_MEDIA_TYPES, 48105 onError(message) { 48106 createErrorNotice(message, { 48107 type: 'snackbar' 48108 }); 48109 setIsInserting(false); 48110 } 48111 }); 48112 }).catch(() => { 48113 setShowExternalUploadModal(true); 48114 setIsInserting(false); 48115 }); 48116 }, [isInserting, getSettings, onClick, createSuccessNotice, createErrorNotice]); 48117 const title = typeof media.title === 'string' ? media.title : media.title?.rendered || (0,external_wp_i18n_namespaceObject.__)('no title'); 48118 let truncatedTitle; 48119 if (title.length > MAXIMUM_TITLE_LENGTH) { 48120 const omission = '...'; 48121 truncatedTitle = title.slice(0, MAXIMUM_TITLE_LENGTH - omission.length) + omission; 48122 } 48123 const onMouseEnter = (0,external_wp_element_namespaceObject.useCallback)(() => setIsHovered(true), []); 48124 const onMouseLeave = (0,external_wp_element_namespaceObject.useCallback)(() => setIsHovered(false), []); 48125 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 48126 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter_draggable_blocks, { 48127 isEnabled: true, 48128 blocks: [block], 48129 children: ({ 48130 draggable, 48131 onDragStart, 48132 onDragEnd 48133 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 48134 className: dist_clsx('block-editor-inserter__media-list__list-item', { 48135 'is-hovered': isHovered 48136 }), 48137 draggable: draggable, 48138 onDragStart: onDragStart, 48139 onDragEnd: onDragEnd, 48140 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 48141 onMouseEnter: onMouseEnter, 48142 onMouseLeave: onMouseLeave, 48143 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tooltip, { 48144 text: truncatedTitle || title, 48145 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Composite.Item, { 48146 render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 48147 "aria-label": title, 48148 role: "option", 48149 className: "block-editor-inserter__media-list__item" 48150 }), 48151 onClick: () => onMediaInsert(block), 48152 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 48153 className: "block-editor-inserter__media-list__item-preview", 48154 children: [preview, isInserting && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 48155 className: "block-editor-inserter__media-list__item-preview-spinner", 48156 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Spinner, {}) 48157 })] 48158 }) 48159 }) 48160 }), !isInserting && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MediaPreviewOptions, { 48161 category: category, 48162 media: media 48163 })] 48164 }) 48165 }) 48166 }), showExternalUploadModal && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InsertExternalImageModal, { 48167 onClose: () => setShowExternalUploadModal(false), 48168 onSubmit: () => { 48169 onClick((0,external_wp_blocks_namespaceObject.cloneBlock)(block)); 48170 createSuccessNotice((0,external_wp_i18n_namespaceObject.__)('Image inserted.'), { 48171 type: 'snackbar' 48172 }); 48173 setShowExternalUploadModal(false); 48174 } 48175 })] 48176 }); 48177 } 48178 48179 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/media-tab/media-list.js 48180 /** 48181 * WordPress dependencies 48182 */ 48183 48184 48185 48186 /** 48187 * Internal dependencies 48188 */ 48189 48190 48191 function MediaList({ 48192 mediaList, 48193 category, 48194 onClick, 48195 label = (0,external_wp_i18n_namespaceObject.__)('Media List') 48196 }) { 48197 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Composite, { 48198 role: "listbox", 48199 className: "block-editor-inserter__media-list", 48200 "aria-label": label, 48201 children: mediaList.map((media, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MediaPreview, { 48202 media: media, 48203 category: category, 48204 onClick: onClick 48205 }, media.id || media.sourceId || index)) 48206 }); 48207 } 48208 /* harmony default export */ const media_list = (MediaList); 48209 48210 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/media-tab/hooks.js 48211 /** 48212 * WordPress dependencies 48213 */ 48214 48215 48216 48217 /** 48218 * Internal dependencies 48219 */ 48220 48221 48222 48223 /** @typedef {import('../../../store/actions').InserterMediaRequest} InserterMediaRequest */ 48224 /** @typedef {import('../../../store/actions').InserterMediaItem} InserterMediaItem */ 48225 48226 /** 48227 * Fetches media items based on the provided category. 48228 * Each media category is responsible for providing a `fetch` function. 48229 * 48230 * @param {Object} category The media category to fetch results for. 48231 * @param {InserterMediaRequest} query The query args to use for the request. 48232 * @return {InserterMediaItem[]} The media results. 48233 */ 48234 function useMediaResults(category, query = {}) { 48235 const [mediaList, setMediaList] = (0,external_wp_element_namespaceObject.useState)(); 48236 const [isLoading, setIsLoading] = (0,external_wp_element_namespaceObject.useState)(false); 48237 // We need to keep track of the last request made because 48238 // multiple request can be fired without knowing the order 48239 // of resolution, and we need to ensure we are showing 48240 // the results of the last request. 48241 // In the future we could use AbortController to cancel previous 48242 // requests, but we don't for now as it involves adding support 48243 // for this to `core-data` package. 48244 const lastRequestRef = (0,external_wp_element_namespaceObject.useRef)(); 48245 (0,external_wp_element_namespaceObject.useEffect)(() => { 48246 (async () => { 48247 const key = JSON.stringify({ 48248 category: category.name, 48249 ...query 48250 }); 48251 lastRequestRef.current = key; 48252 setIsLoading(true); 48253 setMediaList([]); // Empty the previous results. 48254 const _media = await category.fetch?.(query); 48255 if (key === lastRequestRef.current) { 48256 setMediaList(_media); 48257 setIsLoading(false); 48258 } 48259 })(); 48260 }, [category.name, ...Object.values(query)]); 48261 return { 48262 mediaList, 48263 isLoading 48264 }; 48265 } 48266 function useMediaCategories(rootClientId) { 48267 const [categories, setCategories] = (0,external_wp_element_namespaceObject.useState)([]); 48268 const inserterMediaCategories = (0,external_wp_data_namespaceObject.useSelect)(select => unlock(select(store)).getInserterMediaCategories(), []); 48269 const { 48270 canInsertImage, 48271 canInsertVideo, 48272 canInsertAudio 48273 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 48274 const { 48275 canInsertBlockType 48276 } = select(store); 48277 return { 48278 canInsertImage: canInsertBlockType('core/image', rootClientId), 48279 canInsertVideo: canInsertBlockType('core/video', rootClientId), 48280 canInsertAudio: canInsertBlockType('core/audio', rootClientId) 48281 }; 48282 }, [rootClientId]); 48283 (0,external_wp_element_namespaceObject.useEffect)(() => { 48284 (async () => { 48285 const _categories = []; 48286 // If `inserterMediaCategories` is not defined in 48287 // block editor settings, do not show any media categories. 48288 if (!inserterMediaCategories) { 48289 return; 48290 } 48291 // Loop through categories to check if they have at least one media item. 48292 const categoriesHaveMedia = new Map(await Promise.all(inserterMediaCategories.map(async category => { 48293 // Some sources are external and we don't need to make a request. 48294 if (category.isExternalResource) { 48295 return [category.name, true]; 48296 } 48297 let results = []; 48298 try { 48299 results = await category.fetch({ 48300 per_page: 1 48301 }); 48302 } catch (e) { 48303 // If the request fails, we shallow the error and just don't show 48304 // the category, in order to not break the media tab. 48305 } 48306 return [category.name, !!results.length]; 48307 }))); 48308 // We need to filter out categories that don't have any media items or 48309 // whose corresponding block type is not allowed to be inserted, based 48310 // on the category's `mediaType`. 48311 const canInsertMediaType = { 48312 image: canInsertImage, 48313 video: canInsertVideo, 48314 audio: canInsertAudio 48315 }; 48316 inserterMediaCategories.forEach(category => { 48317 if (canInsertMediaType[category.mediaType] && categoriesHaveMedia.get(category.name)) { 48318 _categories.push(category); 48319 } 48320 }); 48321 if (!!_categories.length) { 48322 setCategories(_categories); 48323 } 48324 })(); 48325 }, [canInsertImage, canInsertVideo, canInsertAudio, inserterMediaCategories]); 48326 return categories; 48327 } 48328 48329 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/media-tab/media-panel.js 48330 /** 48331 * WordPress dependencies 48332 */ 48333 48334 48335 48336 48337 /** 48338 * Internal dependencies 48339 */ 48340 48341 48342 48343 48344 48345 const INITIAL_MEDIA_ITEMS_PER_PAGE = 10; 48346 function MediaCategoryPanel({ 48347 rootClientId, 48348 onInsert, 48349 category 48350 }) { 48351 const [search, setSearch, debouncedSearch] = (0,external_wp_compose_namespaceObject.useDebouncedInput)(); 48352 const { 48353 mediaList, 48354 isLoading 48355 } = useMediaResults(category, { 48356 per_page: !!debouncedSearch ? 20 : INITIAL_MEDIA_ITEMS_PER_PAGE, 48357 search: debouncedSearch 48358 }); 48359 const baseCssClass = 'block-editor-inserter__media-panel'; 48360 const searchLabel = category.labels.search_items || (0,external_wp_i18n_namespaceObject.__)('Search'); 48361 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 48362 className: baseCssClass, 48363 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SearchControl, { 48364 __nextHasNoMarginBottom: true, 48365 className: `$baseCssClass}-search`, 48366 onChange: setSearch, 48367 value: search, 48368 label: searchLabel, 48369 placeholder: searchLabel 48370 }), isLoading && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 48371 className: `$baseCssClass}-spinner`, 48372 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Spinner, {}) 48373 }), !isLoading && !mediaList?.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(no_results, {}), !isLoading && !!mediaList?.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(media_list, { 48374 rootClientId: rootClientId, 48375 onClick: onInsert, 48376 mediaList: mediaList, 48377 category: category 48378 })] 48379 }); 48380 } 48381 48382 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/media-tab/media-tab.js 48383 /** 48384 * WordPress dependencies 48385 */ 48386 48387 48388 48389 48390 48391 /** 48392 * Internal dependencies 48393 */ 48394 48395 48396 48397 48398 48399 48400 48401 48402 48403 48404 48405 const media_tab_ALLOWED_MEDIA_TYPES = ['image', 'video', 'audio']; 48406 function MediaTab({ 48407 rootClientId, 48408 selectedCategory, 48409 onSelectCategory, 48410 setHasCategories, 48411 onInsert, 48412 children 48413 }) { 48414 const mediaCategories = useMediaCategories(rootClientId); 48415 const isMobile = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 48416 const baseCssClass = 'block-editor-inserter__media-tabs'; 48417 const onSelectMedia = (0,external_wp_element_namespaceObject.useCallback)(media => { 48418 if (!media?.url) { 48419 return; 48420 } 48421 const [block] = getBlockAndPreviewFromMedia(media, media.type); 48422 onInsert(block); 48423 }, [onInsert]); 48424 const categories = (0,external_wp_element_namespaceObject.useMemo)(() => mediaCategories.map(mediaCategory => ({ 48425 ...mediaCategory, 48426 label: mediaCategory.labels.name 48427 })), [mediaCategories]); 48428 (0,external_wp_element_namespaceObject.useEffect)(() => { 48429 setHasCategories(!!categories.length); 48430 }, [categories, setHasCategories]); 48431 if (!categories.length) { 48432 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(no_results, {}); 48433 } 48434 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 48435 children: [!isMobile && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 48436 className: `$baseCssClass}-container`, 48437 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(category_tabs, { 48438 categories: categories, 48439 selectedCategory: selectedCategory, 48440 onSelectCategory: onSelectCategory, 48441 children: children 48442 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(check, { 48443 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(media_upload, { 48444 multiple: false, 48445 onSelect: onSelectMedia, 48446 allowedTypes: media_tab_ALLOWED_MEDIA_TYPES, 48447 render: ({ 48448 open 48449 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 48450 __next40pxDefaultSize: true, 48451 onClick: event => { 48452 // Safari doesn't emit a focus event on button elements when 48453 // clicked and we need to manually focus the button here. 48454 // The reason is that core's Media Library modal explicitly triggers a 48455 // focus event and therefore a `blur` event is triggered on a different 48456 // element, which doesn't contain the `data-unstable-ignore-focus-outside-for-relatedtarget` 48457 // attribute making the Inserter dialog to close. 48458 event.target.focus(); 48459 open(); 48460 }, 48461 className: "block-editor-inserter__media-library-button", 48462 variant: "secondary", 48463 "data-unstable-ignore-focus-outside-for-relatedtarget": ".media-modal", 48464 children: (0,external_wp_i18n_namespaceObject.__)('Open Media Library') 48465 }) 48466 }) 48467 })] 48468 }), isMobile && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MobileTabNavigation, { 48469 categories: categories, 48470 children: category => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MediaCategoryPanel, { 48471 onInsert: onInsert, 48472 rootClientId: rootClientId, 48473 category: category 48474 }) 48475 })] 48476 }); 48477 } 48478 /* harmony default export */ const media_tab = (MediaTab); 48479 48480 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter-menu-extension/index.js 48481 /** 48482 * WordPress dependencies 48483 */ 48484 48485 const { 48486 Fill: __unstableInserterMenuExtension, 48487 Slot 48488 } = (0,external_wp_components_namespaceObject.createSlotFill)('__unstableInserterMenuExtension'); 48489 __unstableInserterMenuExtension.Slot = Slot; 48490 /* harmony default export */ const inserter_menu_extension = (__unstableInserterMenuExtension); 48491 48492 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/order-inserter-block-items.js 48493 /** @typedef {import('../store/selectors').WPEditorInserterItem} WPEditorInserterItem */ 48494 48495 /** 48496 * Helper function to order inserter block items according to a provided array of prioritized blocks. 48497 * 48498 * @param {WPEditorInserterItem[]} items The array of editor inserter block items to be sorted. 48499 * @param {string[]} priority The array of block names to be prioritized. 48500 * @return {WPEditorInserterItem[]} The sorted array of editor inserter block items. 48501 */ 48502 const orderInserterBlockItems = (items, priority) => { 48503 if (!priority) { 48504 return items; 48505 } 48506 items.sort(({ 48507 id: aName 48508 }, { 48509 id: bName 48510 }) => { 48511 // Sort block items according to `priority`. 48512 let aIndex = priority.indexOf(aName); 48513 let bIndex = priority.indexOf(bName); 48514 // All other block items should come after that. 48515 if (aIndex < 0) { 48516 aIndex = priority.length; 48517 } 48518 if (bIndex < 0) { 48519 bIndex = priority.length; 48520 } 48521 return aIndex - bIndex; 48522 }); 48523 return items; 48524 }; 48525 48526 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/search-results.js 48527 /** 48528 * WordPress dependencies 48529 */ 48530 48531 48532 48533 48534 48535 48536 48537 /** 48538 * Internal dependencies 48539 */ 48540 48541 48542 48543 48544 48545 48546 48547 48548 48549 48550 48551 48552 48553 48554 48555 const search_results_INITIAL_INSERTER_RESULTS = 9; 48556 /** 48557 * Shared reference to an empty array for cases where it is important to avoid 48558 * returning a new array reference on every invocation and rerendering the component. 48559 * 48560 * @type {Array} 48561 */ 48562 const search_results_EMPTY_ARRAY = []; 48563 function InserterSearchResults({ 48564 filterValue, 48565 onSelect, 48566 onHover, 48567 onHoverPattern, 48568 rootClientId, 48569 clientId, 48570 isAppender, 48571 __experimentalInsertionIndex, 48572 maxBlockPatterns, 48573 maxBlockTypes, 48574 showBlockDirectory = false, 48575 isDraggable = true, 48576 shouldFocusBlock = true, 48577 prioritizePatterns, 48578 selectBlockOnInsert, 48579 isQuick 48580 }) { 48581 const debouncedSpeak = (0,external_wp_compose_namespaceObject.useDebounce)(external_wp_a11y_namespaceObject.speak, 500); 48582 const { 48583 prioritizedBlocks 48584 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 48585 const blockListSettings = select(store).getBlockListSettings(rootClientId); 48586 return { 48587 prioritizedBlocks: blockListSettings?.prioritizedInserterBlocks || search_results_EMPTY_ARRAY 48588 }; 48589 }, [rootClientId]); 48590 const [destinationRootClientId, onInsertBlocks] = use_insertion_point({ 48591 onSelect, 48592 rootClientId, 48593 clientId, 48594 isAppender, 48595 insertionIndex: __experimentalInsertionIndex, 48596 shouldFocusBlock, 48597 selectBlockOnInsert 48598 }); 48599 const [blockTypes, blockTypeCategories, blockTypeCollections, onSelectBlockType] = use_block_types_state(destinationRootClientId, onInsertBlocks, isQuick); 48600 const [patterns,, onClickPattern] = use_patterns_state(onInsertBlocks, destinationRootClientId); 48601 const filteredBlockPatterns = (0,external_wp_element_namespaceObject.useMemo)(() => { 48602 if (maxBlockPatterns === 0) { 48603 return []; 48604 } 48605 const results = searchItems(patterns, filterValue); 48606 return maxBlockPatterns !== undefined ? results.slice(0, maxBlockPatterns) : results; 48607 }, [filterValue, patterns, maxBlockPatterns]); 48608 let maxBlockTypesToShow = maxBlockTypes; 48609 if (prioritizePatterns && filteredBlockPatterns.length > 2) { 48610 maxBlockTypesToShow = 0; 48611 } 48612 const filteredBlockTypes = (0,external_wp_element_namespaceObject.useMemo)(() => { 48613 if (maxBlockTypesToShow === 0) { 48614 return []; 48615 } 48616 const nonPatternBlockTypes = blockTypes.filter(blockType => blockType.name !== 'core/block'); 48617 let orderedItems = orderBy(nonPatternBlockTypes, 'frecency', 'desc'); 48618 if (!filterValue && prioritizedBlocks.length) { 48619 orderedItems = orderInserterBlockItems(orderedItems, prioritizedBlocks); 48620 } 48621 const results = searchBlockItems(orderedItems, blockTypeCategories, blockTypeCollections, filterValue); 48622 return maxBlockTypesToShow !== undefined ? results.slice(0, maxBlockTypesToShow) : results; 48623 }, [filterValue, blockTypes, blockTypeCategories, blockTypeCollections, maxBlockTypesToShow, prioritizedBlocks]); 48624 48625 // Announce search results on change. 48626 (0,external_wp_element_namespaceObject.useEffect)(() => { 48627 if (!filterValue) { 48628 return; 48629 } 48630 const count = filteredBlockTypes.length + filteredBlockPatterns.length; 48631 const resultsFoundMessage = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */ 48632 (0,external_wp_i18n_namespaceObject._n)('%d result found.', '%d results found.', count), count); 48633 debouncedSpeak(resultsFoundMessage); 48634 }, [filterValue, debouncedSpeak, filteredBlockTypes, filteredBlockPatterns]); 48635 const currentShownBlockTypes = (0,external_wp_compose_namespaceObject.useAsyncList)(filteredBlockTypes, { 48636 step: search_results_INITIAL_INSERTER_RESULTS 48637 }); 48638 const currentShownPatterns = (0,external_wp_compose_namespaceObject.useAsyncList)(currentShownBlockTypes.length === filteredBlockTypes.length ? filteredBlockPatterns : search_results_EMPTY_ARRAY); 48639 const hasItems = filteredBlockTypes.length > 0 || filteredBlockPatterns.length > 0; 48640 const blocksUI = !!filteredBlockTypes.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(panel, { 48641 title: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 48642 children: (0,external_wp_i18n_namespaceObject.__)('Blocks') 48643 }), 48644 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_types_list, { 48645 items: currentShownBlockTypes, 48646 onSelect: onSelectBlockType, 48647 onHover: onHover, 48648 label: (0,external_wp_i18n_namespaceObject.__)('Blocks'), 48649 isDraggable: isDraggable 48650 }) 48651 }); 48652 const patternsUI = !!filteredBlockPatterns.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(panel, { 48653 title: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 48654 children: (0,external_wp_i18n_namespaceObject.__)('Block patterns') 48655 }), 48656 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 48657 className: "block-editor-inserter__quick-inserter-patterns", 48658 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_patterns_list, { 48659 shownPatterns: currentShownPatterns, 48660 blockPatterns: filteredBlockPatterns, 48661 onClickPattern: onClickPattern, 48662 onHover: onHoverPattern, 48663 isDraggable: isDraggable 48664 }) 48665 }) 48666 }); 48667 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(inserter_listbox, { 48668 children: [!showBlockDirectory && !hasItems && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(no_results, {}), prioritizePatterns ? patternsUI : blocksUI, !!filteredBlockTypes.length && !!filteredBlockPatterns.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 48669 className: "block-editor-inserter__quick-inserter-separator" 48670 }), prioritizePatterns ? blocksUI : patternsUI, showBlockDirectory && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter_menu_extension.Slot, { 48671 fillProps: { 48672 onSelect: onSelectBlockType, 48673 onHover, 48674 filterValue, 48675 hasItems, 48676 rootClientId: destinationRootClientId 48677 }, 48678 children: fills => { 48679 if (fills.length) { 48680 return fills; 48681 } 48682 if (!hasItems) { 48683 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(no_results, {}); 48684 } 48685 return null; 48686 } 48687 })] 48688 }); 48689 } 48690 /* harmony default export */ const search_results = (InserterSearchResults); 48691 48692 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/close-small.js 48693 /** 48694 * WordPress dependencies 48695 */ 48696 48697 48698 const closeSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 48699 xmlns: "http://www.w3.org/2000/svg", 48700 viewBox: "0 0 24 24", 48701 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 48702 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" 48703 }) 48704 }); 48705 /* harmony default export */ const close_small = (closeSmall); 48706 48707 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/tabbed-sidebar/index.js 48708 /** 48709 * WordPress dependencies 48710 */ 48711 48712 48713 48714 48715 /** 48716 * Internal dependencies 48717 */ 48718 48719 48720 48721 const { 48722 Tabs: tabbed_sidebar_Tabs 48723 } = unlock(external_wp_components_namespaceObject.privateApis); 48724 function TabbedSidebar({ 48725 defaultTabId, 48726 onClose, 48727 onSelect, 48728 selectedTab, 48729 tabs, 48730 closeButtonLabel 48731 }, ref) { 48732 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 48733 className: "block-editor-tabbed-sidebar", 48734 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(tabbed_sidebar_Tabs, { 48735 selectOnMove: false, 48736 defaultTabId: defaultTabId, 48737 onSelect: onSelect, 48738 selectedTabId: selectedTab, 48739 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 48740 className: "block-editor-tabbed-sidebar__tablist-and-close-button", 48741 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 48742 className: "block-editor-tabbed-sidebar__close-button", 48743 icon: close_small, 48744 label: closeButtonLabel, 48745 onClick: () => onClose(), 48746 size: "small" 48747 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tabbed_sidebar_Tabs.TabList, { 48748 className: "block-editor-tabbed-sidebar__tablist", 48749 ref: ref, 48750 children: tabs.map(tab => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tabbed_sidebar_Tabs.Tab, { 48751 tabId: tab.name, 48752 className: "block-editor-tabbed-sidebar__tab", 48753 children: tab.title 48754 }, tab.name)) 48755 })] 48756 }), tabs.map(tab => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tabbed_sidebar_Tabs.TabPanel, { 48757 tabId: tab.name, 48758 focusable: false, 48759 className: "block-editor-tabbed-sidebar__tabpanel", 48760 ref: tab.panelRef, 48761 children: tab.panel 48762 }, tab.name))] 48763 }) 48764 }); 48765 } 48766 /* harmony default export */ const tabbed_sidebar = ((0,external_wp_element_namespaceObject.forwardRef)(TabbedSidebar)); 48767 48768 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/use-zoom-out.js 48769 /** 48770 * WordPress dependencies 48771 */ 48772 48773 48774 48775 /** 48776 * Internal dependencies 48777 */ 48778 48779 48780 /** 48781 * A hook used to set the editor mode to zoomed out mode, invoking the hook sets the mode. 48782 * 48783 * @param {boolean} zoomOut If we should enter into zoomOut mode or not 48784 */ 48785 function useZoomOut(zoomOut = true) { 48786 const { 48787 __unstableSetEditorMode, 48788 setZoomLevel 48789 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 48790 const { 48791 __unstableGetEditorMode 48792 } = unlock((0,external_wp_data_namespaceObject.useSelect)(store)); 48793 const originalEditingModeRef = (0,external_wp_element_namespaceObject.useRef)(null); 48794 const mode = __unstableGetEditorMode(); 48795 (0,external_wp_element_namespaceObject.useEffect)(() => { 48796 // Only set this on mount so we know what to return to when we unmount. 48797 if (!originalEditingModeRef.current) { 48798 originalEditingModeRef.current = mode; 48799 } 48800 return () => { 48801 // We need to use __unstableGetEditorMode() here and not `mode`, as mode may not update on unmount 48802 if (__unstableGetEditorMode() === 'zoom-out' && __unstableGetEditorMode() !== originalEditingModeRef.current) { 48803 __unstableSetEditorMode(originalEditingModeRef.current); 48804 setZoomLevel(100); 48805 } 48806 }; 48807 }, []); 48808 48809 // The effect opens the zoom-out view if we want it open and it's not currently in zoom-out mode. 48810 (0,external_wp_element_namespaceObject.useEffect)(() => { 48811 if (zoomOut && mode !== 'zoom-out') { 48812 __unstableSetEditorMode('zoom-out'); 48813 setZoomLevel(50); 48814 } else if (!zoomOut && __unstableGetEditorMode() === 'zoom-out' && originalEditingModeRef.current !== mode) { 48815 __unstableSetEditorMode(originalEditingModeRef.current); 48816 setZoomLevel(100); 48817 } 48818 }, [__unstableGetEditorMode, __unstableSetEditorMode, zoomOut, setZoomLevel]); // Mode is deliberately excluded from the dependencies so that the effect does not run when mode changes. 48819 } 48820 48821 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/menu.js 48822 /** 48823 * External dependencies 48824 */ 48825 48826 48827 /** 48828 * WordPress dependencies 48829 */ 48830 48831 48832 48833 48834 48835 48836 /** 48837 * Internal dependencies 48838 */ 48839 48840 48841 48842 48843 48844 48845 48846 48847 48848 48849 48850 48851 48852 48853 const NOOP = () => {}; 48854 function InserterMenu({ 48855 rootClientId, 48856 clientId, 48857 isAppender, 48858 __experimentalInsertionIndex, 48859 onSelect, 48860 showInserterHelpPanel, 48861 showMostUsedBlocks, 48862 __experimentalFilterValue = '', 48863 shouldFocusBlock = true, 48864 onPatternCategorySelection, 48865 onClose, 48866 __experimentalInitialTab, 48867 __experimentalInitialCategory 48868 }, ref) { 48869 const isZoomOutMode = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).__unstableGetEditorMode() === 'zoom-out', []); 48870 const [filterValue, setFilterValue, delayedFilterValue] = (0,external_wp_compose_namespaceObject.useDebouncedInput)(__experimentalFilterValue); 48871 const [hoveredItem, setHoveredItem] = (0,external_wp_element_namespaceObject.useState)(null); 48872 const [selectedPatternCategory, setSelectedPatternCategory] = (0,external_wp_element_namespaceObject.useState)(__experimentalInitialCategory); 48873 const [patternFilter, setPatternFilter] = (0,external_wp_element_namespaceObject.useState)('all'); 48874 const [selectedMediaCategory, setSelectedMediaCategory] = (0,external_wp_element_namespaceObject.useState)(null); 48875 const isLargeViewport = (0,external_wp_compose_namespaceObject.useViewportMatch)('large'); 48876 const [hasCategories, setHasCategories] = (0,external_wp_element_namespaceObject.useState)(true); 48877 function getInitialTab() { 48878 if (__experimentalInitialTab) { 48879 return __experimentalInitialTab; 48880 } 48881 if (isZoomOutMode) { 48882 return 'patterns'; 48883 } 48884 } 48885 const [selectedTab, setSelectedTab] = (0,external_wp_element_namespaceObject.useState)(getInitialTab()); 48886 const shouldUseZoomOut = selectedTab === 'patterns' || selectedTab === 'media'; 48887 useZoomOut(shouldUseZoomOut && isLargeViewport); 48888 const [destinationRootClientId, onInsertBlocks, onToggleInsertionPoint] = use_insertion_point({ 48889 rootClientId, 48890 clientId, 48891 isAppender, 48892 insertionIndex: __experimentalInsertionIndex, 48893 shouldFocusBlock 48894 }); 48895 const blockTypesTabRef = (0,external_wp_element_namespaceObject.useRef)(); 48896 const onInsert = (0,external_wp_element_namespaceObject.useCallback)((blocks, meta, shouldForceFocusBlock, _rootClientId) => { 48897 onInsertBlocks(blocks, meta, shouldForceFocusBlock, _rootClientId); 48898 onSelect(blocks); 48899 48900 // Check for focus loss due to filtering blocks by selected block type 48901 window.requestAnimationFrame(() => { 48902 if (!shouldFocusBlock && !blockTypesTabRef.current?.contains(ref.current.ownerDocument.activeElement)) { 48903 // There has been a focus loss, so focus the first button in the block types tab 48904 blockTypesTabRef.current?.querySelector('button').focus(); 48905 } 48906 }); 48907 }, [onInsertBlocks, onSelect, shouldFocusBlock]); 48908 const onInsertPattern = (0,external_wp_element_namespaceObject.useCallback)((blocks, patternName) => { 48909 onToggleInsertionPoint(false); 48910 onInsertBlocks(blocks, { 48911 patternName 48912 }); 48913 onSelect(); 48914 }, [onInsertBlocks, onSelect]); 48915 const onHover = (0,external_wp_element_namespaceObject.useCallback)(item => { 48916 onToggleInsertionPoint(item); 48917 setHoveredItem(item); 48918 }, [onToggleInsertionPoint, setHoveredItem]); 48919 const onClickPatternCategory = (0,external_wp_element_namespaceObject.useCallback)((patternCategory, filter) => { 48920 setSelectedPatternCategory(patternCategory); 48921 setPatternFilter(filter); 48922 onPatternCategorySelection?.(); 48923 }, [setSelectedPatternCategory, onPatternCategorySelection]); 48924 const showPatternPanel = selectedTab === 'patterns' && hasCategories && !delayedFilterValue && !!selectedPatternCategory; 48925 const showMediaPanel = selectedTab === 'media' && !!selectedMediaCategory && hasCategories; 48926 const inserterSearch = (0,external_wp_element_namespaceObject.useMemo)(() => { 48927 if (selectedTab === 'media') { 48928 return null; 48929 } 48930 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 48931 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SearchControl, { 48932 __nextHasNoMarginBottom: true, 48933 className: "block-editor-inserter__search", 48934 onChange: value => { 48935 if (hoveredItem) { 48936 setHoveredItem(null); 48937 } 48938 setFilterValue(value); 48939 }, 48940 value: filterValue, 48941 label: (0,external_wp_i18n_namespaceObject.__)('Search for blocks and patterns'), 48942 placeholder: (0,external_wp_i18n_namespaceObject.__)('Search') 48943 }), !!delayedFilterValue && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(search_results, { 48944 filterValue: delayedFilterValue, 48945 onSelect: onSelect, 48946 onHover: onHover, 48947 rootClientId: rootClientId, 48948 clientId: clientId, 48949 isAppender: isAppender, 48950 __experimentalInsertionIndex: __experimentalInsertionIndex, 48951 showBlockDirectory: true, 48952 shouldFocusBlock: shouldFocusBlock, 48953 prioritizePatterns: selectedTab === 'patterns' 48954 })] 48955 }); 48956 }, [selectedTab, hoveredItem, setHoveredItem, setFilterValue, filterValue, delayedFilterValue, onSelect, onHover, shouldFocusBlock, clientId, rootClientId, __experimentalInsertionIndex, isAppender]); 48957 const blocksTab = (0,external_wp_element_namespaceObject.useMemo)(() => { 48958 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 48959 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 48960 className: "block-editor-inserter__block-list", 48961 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_types_tab, { 48962 ref: blockTypesTabRef, 48963 rootClientId: destinationRootClientId, 48964 onInsert: onInsert, 48965 onHover: onHover, 48966 showMostUsedBlocks: showMostUsedBlocks 48967 }) 48968 }), showInserterHelpPanel && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 48969 className: "block-editor-inserter__tips", 48970 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 48971 as: "h2", 48972 children: (0,external_wp_i18n_namespaceObject.__)('A tip for using the block editor') 48973 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tips, {})] 48974 })] 48975 }); 48976 }, [destinationRootClientId, onInsert, onHover, showMostUsedBlocks, showInserterHelpPanel]); 48977 const patternsTab = (0,external_wp_element_namespaceObject.useMemo)(() => { 48978 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_patterns_tab, { 48979 rootClientId: destinationRootClientId, 48980 onInsert: onInsertPattern, 48981 onSelectCategory: onClickPatternCategory, 48982 selectedCategory: selectedPatternCategory, 48983 setHasCategories: setHasCategories, 48984 children: showPatternPanel && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PatternCategoryPreviews, { 48985 rootClientId: destinationRootClientId, 48986 onInsert: onInsertPattern, 48987 category: selectedPatternCategory, 48988 patternFilter: patternFilter, 48989 showTitlesAsTooltip: true 48990 }) 48991 }); 48992 }, [destinationRootClientId, onInsertPattern, onClickPatternCategory, patternFilter, selectedPatternCategory, showPatternPanel]); 48993 const mediaTab = (0,external_wp_element_namespaceObject.useMemo)(() => { 48994 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(media_tab, { 48995 rootClientId: destinationRootClientId, 48996 selectedCategory: selectedMediaCategory, 48997 onSelectCategory: setSelectedMediaCategory, 48998 onInsert: onInsert, 48999 setHasCategories: setHasCategories, 49000 children: showMediaPanel && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MediaCategoryPanel, { 49001 rootClientId: destinationRootClientId, 49002 onInsert: onInsert, 49003 category: selectedMediaCategory 49004 }) 49005 }); 49006 }, [destinationRootClientId, onInsert, selectedMediaCategory, setSelectedMediaCategory, showMediaPanel]); 49007 const handleSetSelectedTab = value => { 49008 // If no longer on patterns tab remove the category setting. 49009 if (value !== 'patterns') { 49010 setSelectedPatternCategory(null); 49011 } 49012 setSelectedTab(value); 49013 }; 49014 49015 // Focus first active tab, if any 49016 const tabsRef = (0,external_wp_element_namespaceObject.useRef)(); 49017 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 49018 if (tabsRef.current) { 49019 window.requestAnimationFrame(() => { 49020 tabsRef.current.querySelector('[role="tab"][aria-selected="true"]')?.focus(); 49021 }); 49022 } 49023 }, []); 49024 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 49025 className: dist_clsx('block-editor-inserter__menu', { 49026 'show-panel': showPatternPanel || showMediaPanel, 49027 'is-zoom-out': isZoomOutMode 49028 }), 49029 ref: ref, 49030 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 49031 className: "block-editor-inserter__main-area", 49032 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tabbed_sidebar, { 49033 ref: tabsRef, 49034 onSelect: handleSetSelectedTab, 49035 onClose: onClose, 49036 selectedTab: selectedTab, 49037 closeButtonLabel: (0,external_wp_i18n_namespaceObject.__)('Close block inserter'), 49038 tabs: [{ 49039 name: 'blocks', 49040 title: (0,external_wp_i18n_namespaceObject.__)('Blocks'), 49041 panel: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 49042 children: [inserterSearch, selectedTab === 'blocks' && !delayedFilterValue && blocksTab] 49043 }) 49044 }, { 49045 name: 'patterns', 49046 title: (0,external_wp_i18n_namespaceObject.__)('Patterns'), 49047 panel: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 49048 children: [inserterSearch, selectedTab === 'patterns' && !delayedFilterValue && patternsTab] 49049 }) 49050 }, { 49051 name: 'media', 49052 title: (0,external_wp_i18n_namespaceObject.__)('Media'), 49053 panel: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 49054 children: [inserterSearch, mediaTab] 49055 }) 49056 }] 49057 }) 49058 }), showInserterHelpPanel && hoveredItem && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, { 49059 className: "block-editor-inserter__preview-container__popover", 49060 placement: "right-start", 49061 offset: 16, 49062 focusOnMount: false, 49063 animate: false, 49064 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(preview_panel, { 49065 item: hoveredItem 49066 }) 49067 })] 49068 }); 49069 } 49070 const PrivateInserterMenu = (0,external_wp_element_namespaceObject.forwardRef)(InserterMenu); 49071 function PublicInserterMenu(props, ref) { 49072 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateInserterMenu, { 49073 ...props, 49074 onPatternCategorySelection: NOOP, 49075 ref: ref 49076 }); 49077 } 49078 /* harmony default export */ const menu = ((0,external_wp_element_namespaceObject.forwardRef)(PublicInserterMenu)); 49079 49080 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/quick-inserter.js 49081 /** 49082 * External dependencies 49083 */ 49084 49085 49086 /** 49087 * WordPress dependencies 49088 */ 49089 49090 49091 49092 49093 49094 /** 49095 * Internal dependencies 49096 */ 49097 49098 49099 49100 49101 49102 49103 49104 const SEARCH_THRESHOLD = 6; 49105 const SHOWN_BLOCK_TYPES = 6; 49106 const SHOWN_BLOCK_PATTERNS = 2; 49107 const SHOWN_BLOCK_PATTERNS_WITH_PRIORITIZATION = 4; 49108 function QuickInserter({ 49109 onSelect, 49110 rootClientId, 49111 clientId, 49112 isAppender, 49113 prioritizePatterns, 49114 selectBlockOnInsert, 49115 hasSearch = true 49116 }) { 49117 const [filterValue, setFilterValue] = (0,external_wp_element_namespaceObject.useState)(''); 49118 const [destinationRootClientId, onInsertBlocks] = use_insertion_point({ 49119 onSelect, 49120 rootClientId, 49121 clientId, 49122 isAppender, 49123 selectBlockOnInsert 49124 }); 49125 const [blockTypes] = use_block_types_state(destinationRootClientId, onInsertBlocks, true); 49126 const [patterns] = use_patterns_state(onInsertBlocks, destinationRootClientId); 49127 const { 49128 setInserterIsOpened, 49129 insertionIndex 49130 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 49131 const { 49132 getSettings, 49133 getBlockIndex, 49134 getBlockCount 49135 } = select(store); 49136 const settings = getSettings(); 49137 const index = getBlockIndex(clientId); 49138 const blockCount = getBlockCount(); 49139 return { 49140 setInserterIsOpened: settings.__experimentalSetIsInserterOpened, 49141 insertionIndex: index === -1 ? blockCount : index 49142 }; 49143 }, [clientId]); 49144 const showPatterns = patterns.length && (!!filterValue || prioritizePatterns); 49145 const showSearch = hasSearch && (showPatterns && patterns.length > SEARCH_THRESHOLD || blockTypes.length > SEARCH_THRESHOLD); 49146 (0,external_wp_element_namespaceObject.useEffect)(() => { 49147 if (setInserterIsOpened) { 49148 setInserterIsOpened(false); 49149 } 49150 }, [setInserterIsOpened]); 49151 49152 // When clicking Browse All select the appropriate block so as 49153 // the insertion point can work as expected. 49154 const onBrowseAll = () => { 49155 setInserterIsOpened({ 49156 rootClientId, 49157 insertionIndex, 49158 filterValue, 49159 onSelect 49160 }); 49161 }; 49162 let maxBlockPatterns = 0; 49163 if (showPatterns) { 49164 maxBlockPatterns = prioritizePatterns ? SHOWN_BLOCK_PATTERNS_WITH_PRIORITIZATION : SHOWN_BLOCK_PATTERNS; 49165 } 49166 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 49167 className: dist_clsx('block-editor-inserter__quick-inserter', { 49168 'has-search': showSearch, 49169 'has-expand': setInserterIsOpened 49170 }), 49171 children: [showSearch && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SearchControl, { 49172 __nextHasNoMarginBottom: true, 49173 className: "block-editor-inserter__search", 49174 value: filterValue, 49175 onChange: value => { 49176 setFilterValue(value); 49177 }, 49178 label: (0,external_wp_i18n_namespaceObject.__)('Search for blocks and patterns'), 49179 placeholder: (0,external_wp_i18n_namespaceObject.__)('Search') 49180 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 49181 className: "block-editor-inserter__quick-inserter-results", 49182 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(search_results, { 49183 filterValue: filterValue, 49184 onSelect: onSelect, 49185 rootClientId: rootClientId, 49186 clientId: clientId, 49187 isAppender: isAppender, 49188 maxBlockPatterns: maxBlockPatterns, 49189 maxBlockTypes: SHOWN_BLOCK_TYPES, 49190 isDraggable: false, 49191 prioritizePatterns: prioritizePatterns, 49192 selectBlockOnInsert: selectBlockOnInsert, 49193 isQuick: true 49194 }) 49195 }), setInserterIsOpened && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 49196 __next40pxDefaultSize: true, 49197 className: "block-editor-inserter__quick-inserter-expand", 49198 onClick: onBrowseAll, 49199 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Browse all. This will open the main inserter panel in the editor toolbar.'), 49200 children: (0,external_wp_i18n_namespaceObject.__)('Browse all') 49201 })] 49202 }); 49203 } 49204 49205 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/index.js 49206 /** 49207 * External dependencies 49208 */ 49209 49210 49211 /** 49212 * WordPress dependencies 49213 */ 49214 49215 49216 49217 49218 49219 49220 49221 49222 49223 /** 49224 * Internal dependencies 49225 */ 49226 49227 49228 49229 49230 const defaultRenderToggle = ({ 49231 onToggle, 49232 disabled, 49233 isOpen, 49234 blockTitle, 49235 hasSingleBlockType, 49236 toggleProps = {}, 49237 prioritizePatterns 49238 }) => { 49239 const { 49240 as: Wrapper = external_wp_components_namespaceObject.Button, 49241 label: labelProp, 49242 onClick, 49243 ...rest 49244 } = toggleProps; 49245 let label = labelProp; 49246 if (!label && hasSingleBlockType) { 49247 label = (0,external_wp_i18n_namespaceObject.sprintf)( 49248 // translators: %s: the name of the block when there is only one 49249 (0,external_wp_i18n_namespaceObject._x)('Add %s', 'directly add the only allowed block'), blockTitle); 49250 } else if (!label && prioritizePatterns) { 49251 label = (0,external_wp_i18n_namespaceObject.__)('Add pattern'); 49252 } else if (!label) { 49253 label = (0,external_wp_i18n_namespaceObject._x)('Add block', 'Generic label for block inserter button'); 49254 } 49255 49256 // Handle both onClick functions from the toggle and the parent component. 49257 function handleClick(event) { 49258 if (onToggle) { 49259 onToggle(event); 49260 } 49261 if (onClick) { 49262 onClick(event); 49263 } 49264 } 49265 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Wrapper, { 49266 icon: library_plus, 49267 label: label, 49268 tooltipPosition: "bottom", 49269 onClick: handleClick, 49270 className: "block-editor-inserter__toggle", 49271 "aria-haspopup": !hasSingleBlockType ? 'true' : false, 49272 "aria-expanded": !hasSingleBlockType ? isOpen : false, 49273 disabled: disabled, 49274 ...rest 49275 }); 49276 }; 49277 class Inserter extends external_wp_element_namespaceObject.Component { 49278 constructor() { 49279 super(...arguments); 49280 this.onToggle = this.onToggle.bind(this); 49281 this.renderToggle = this.renderToggle.bind(this); 49282 this.renderContent = this.renderContent.bind(this); 49283 } 49284 onToggle(isOpen) { 49285 const { 49286 onToggle 49287 } = this.props; 49288 49289 // Surface toggle callback to parent component. 49290 if (onToggle) { 49291 onToggle(isOpen); 49292 } 49293 } 49294 49295 /** 49296 * Render callback to display Dropdown toggle element. 49297 * 49298 * @param {Object} options 49299 * @param {Function} options.onToggle Callback to invoke when toggle is 49300 * pressed. 49301 * @param {boolean} options.isOpen Whether dropdown is currently open. 49302 * 49303 * @return {Element} Dropdown toggle element. 49304 */ 49305 renderToggle({ 49306 onToggle, 49307 isOpen 49308 }) { 49309 const { 49310 disabled, 49311 blockTitle, 49312 hasSingleBlockType, 49313 directInsertBlock, 49314 toggleProps, 49315 hasItems, 49316 renderToggle = defaultRenderToggle, 49317 prioritizePatterns 49318 } = this.props; 49319 return renderToggle({ 49320 onToggle, 49321 isOpen, 49322 disabled: disabled || !hasItems, 49323 blockTitle, 49324 hasSingleBlockType, 49325 directInsertBlock, 49326 toggleProps, 49327 prioritizePatterns 49328 }); 49329 } 49330 49331 /** 49332 * Render callback to display Dropdown content element. 49333 * 49334 * @param {Object} options 49335 * @param {Function} options.onClose Callback to invoke when dropdown is 49336 * closed. 49337 * 49338 * @return {Element} Dropdown content element. 49339 */ 49340 renderContent({ 49341 onClose 49342 }) { 49343 const { 49344 rootClientId, 49345 clientId, 49346 isAppender, 49347 showInserterHelpPanel, 49348 // This prop is experimental to give some time for the quick inserter to mature 49349 // Feel free to make them stable after a few releases. 49350 __experimentalIsQuick: isQuick, 49351 prioritizePatterns, 49352 onSelectOrClose, 49353 selectBlockOnInsert 49354 } = this.props; 49355 if (isQuick) { 49356 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(QuickInserter, { 49357 onSelect: blocks => { 49358 const firstBlock = Array.isArray(blocks) && blocks?.length ? blocks[0] : blocks; 49359 if (onSelectOrClose && typeof onSelectOrClose === 'function') { 49360 onSelectOrClose(firstBlock); 49361 } 49362 onClose(); 49363 }, 49364 rootClientId: rootClientId, 49365 clientId: clientId, 49366 isAppender: isAppender, 49367 prioritizePatterns: prioritizePatterns, 49368 selectBlockOnInsert: selectBlockOnInsert 49369 }); 49370 } 49371 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(menu, { 49372 onSelect: () => { 49373 onClose(); 49374 }, 49375 rootClientId: rootClientId, 49376 clientId: clientId, 49377 isAppender: isAppender, 49378 showInserterHelpPanel: showInserterHelpPanel 49379 }); 49380 } 49381 render() { 49382 const { 49383 position, 49384 hasSingleBlockType, 49385 directInsertBlock, 49386 insertOnlyAllowedBlock, 49387 __experimentalIsQuick: isQuick, 49388 onSelectOrClose 49389 } = this.props; 49390 if (hasSingleBlockType || directInsertBlock) { 49391 return this.renderToggle({ 49392 onToggle: insertOnlyAllowedBlock 49393 }); 49394 } 49395 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 49396 className: "block-editor-inserter", 49397 contentClassName: dist_clsx('block-editor-inserter__popover', { 49398 'is-quick': isQuick 49399 }), 49400 popoverProps: { 49401 position, 49402 shift: true 49403 }, 49404 onToggle: this.onToggle, 49405 expandOnMobile: true, 49406 headerTitle: (0,external_wp_i18n_namespaceObject.__)('Add a block'), 49407 renderToggle: this.renderToggle, 49408 renderContent: this.renderContent, 49409 onClose: onSelectOrClose 49410 }); 49411 } 49412 } 49413 /* harmony default export */ const inserter = ((0,external_wp_compose_namespaceObject.compose)([(0,external_wp_data_namespaceObject.withSelect)((select, { 49414 clientId, 49415 rootClientId, 49416 shouldDirectInsert = true 49417 }) => { 49418 const { 49419 getBlockRootClientId, 49420 hasInserterItems, 49421 getAllowedBlocks, 49422 getDirectInsertBlock, 49423 getSettings 49424 } = select(store); 49425 const { 49426 getBlockVariations 49427 } = select(external_wp_blocks_namespaceObject.store); 49428 rootClientId = rootClientId || getBlockRootClientId(clientId) || undefined; 49429 const allowedBlocks = getAllowedBlocks(rootClientId); 49430 const directInsertBlock = shouldDirectInsert && getDirectInsertBlock(rootClientId); 49431 const settings = getSettings(); 49432 const hasSingleBlockType = allowedBlocks?.length === 1 && getBlockVariations(allowedBlocks[0].name, 'inserter')?.length === 0; 49433 let allowedBlockType = false; 49434 if (hasSingleBlockType) { 49435 allowedBlockType = allowedBlocks[0]; 49436 } 49437 return { 49438 hasItems: hasInserterItems(rootClientId), 49439 hasSingleBlockType, 49440 blockTitle: allowedBlockType ? allowedBlockType.title : '', 49441 allowedBlockType, 49442 directInsertBlock, 49443 rootClientId, 49444 prioritizePatterns: settings.__experimentalPreferPatternsOnRoot && !rootClientId 49445 }; 49446 }), (0,external_wp_data_namespaceObject.withDispatch)((dispatch, ownProps, { 49447 select 49448 }) => { 49449 return { 49450 insertOnlyAllowedBlock() { 49451 const { 49452 rootClientId, 49453 clientId, 49454 isAppender, 49455 hasSingleBlockType, 49456 allowedBlockType, 49457 directInsertBlock, 49458 onSelectOrClose, 49459 selectBlockOnInsert 49460 } = ownProps; 49461 if (!hasSingleBlockType && !directInsertBlock) { 49462 return; 49463 } 49464 function getAdjacentBlockAttributes(attributesToCopy) { 49465 const { 49466 getBlock, 49467 getPreviousBlockClientId 49468 } = select(store); 49469 if (!attributesToCopy || !clientId && !rootClientId) { 49470 return {}; 49471 } 49472 const result = {}; 49473 let adjacentAttributes = {}; 49474 49475 // If there is no clientId, then attempt to get attributes 49476 // from the last block within innerBlocks of the root block. 49477 if (!clientId) { 49478 const parentBlock = getBlock(rootClientId); 49479 if (parentBlock?.innerBlocks?.length) { 49480 const lastInnerBlock = parentBlock.innerBlocks[parentBlock.innerBlocks.length - 1]; 49481 if (directInsertBlock && directInsertBlock?.name === lastInnerBlock.name) { 49482 adjacentAttributes = lastInnerBlock.attributes; 49483 } 49484 } 49485 } else { 49486 // Otherwise, attempt to get attributes from the 49487 // previous block relative to the current clientId. 49488 const currentBlock = getBlock(clientId); 49489 const previousBlock = getBlock(getPreviousBlockClientId(clientId)); 49490 if (currentBlock?.name === previousBlock?.name) { 49491 adjacentAttributes = previousBlock?.attributes || {}; 49492 } 49493 } 49494 49495 // Copy over only those attributes flagged to be copied. 49496 attributesToCopy.forEach(attribute => { 49497 if (adjacentAttributes.hasOwnProperty(attribute)) { 49498 result[attribute] = adjacentAttributes[attribute]; 49499 } 49500 }); 49501 return result; 49502 } 49503 function getInsertionIndex() { 49504 const { 49505 getBlockIndex, 49506 getBlockSelectionEnd, 49507 getBlockOrder, 49508 getBlockRootClientId 49509 } = select(store); 49510 49511 // If the clientId is defined, we insert at the position of the block. 49512 if (clientId) { 49513 return getBlockIndex(clientId); 49514 } 49515 49516 // If there a selected block, we insert after the selected block. 49517 const end = getBlockSelectionEnd(); 49518 if (!isAppender && end && getBlockRootClientId(end) === rootClientId) { 49519 return getBlockIndex(end) + 1; 49520 } 49521 49522 // Otherwise, we insert at the end of the current rootClientId. 49523 return getBlockOrder(rootClientId).length; 49524 } 49525 const { 49526 insertBlock 49527 } = dispatch(store); 49528 let blockToInsert; 49529 49530 // Attempt to augment the directInsertBlock with attributes from an adjacent block. 49531 // This ensures styling from nearby blocks is preserved in the newly inserted block. 49532 // See: https://github.com/WordPress/gutenberg/issues/37904 49533 if (directInsertBlock) { 49534 const newAttributes = getAdjacentBlockAttributes(directInsertBlock.attributesToCopy); 49535 blockToInsert = (0,external_wp_blocks_namespaceObject.createBlock)(directInsertBlock.name, { 49536 ...(directInsertBlock.attributes || {}), 49537 ...newAttributes 49538 }); 49539 } else { 49540 blockToInsert = (0,external_wp_blocks_namespaceObject.createBlock)(allowedBlockType.name); 49541 } 49542 insertBlock(blockToInsert, getInsertionIndex(), rootClientId, selectBlockOnInsert); 49543 if (onSelectOrClose) { 49544 onSelectOrClose({ 49545 clientId: blockToInsert?.clientId 49546 }); 49547 } 49548 const message = (0,external_wp_i18n_namespaceObject.sprintf)( 49549 // translators: %s: the name of the block that has been added 49550 (0,external_wp_i18n_namespaceObject.__)('%s block added'), allowedBlockType.title); 49551 (0,external_wp_a11y_namespaceObject.speak)(message); 49552 } 49553 }; 49554 }), 49555 // The global inserter should always be visible, we are using ( ! isAppender && ! rootClientId && ! clientId ) as 49556 // a way to detect the global Inserter. 49557 (0,external_wp_compose_namespaceObject.ifCondition)(({ 49558 hasItems, 49559 isAppender, 49560 rootClientId, 49561 clientId 49562 }) => hasItems || !isAppender && !rootClientId && !clientId)])(Inserter)); 49563 49564 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/button-block-appender/index.js 49565 /** 49566 * External dependencies 49567 */ 49568 49569 49570 /** 49571 * WordPress dependencies 49572 */ 49573 49574 49575 49576 49577 49578 49579 /** 49580 * Internal dependencies 49581 */ 49582 49583 49584 49585 function button_block_appender_ButtonBlockAppender({ 49586 rootClientId, 49587 className, 49588 onFocus, 49589 tabIndex, 49590 onSelect 49591 }, ref) { 49592 const inserterButtonRef = (0,external_wp_element_namespaceObject.useRef)(); 49593 const mergedInserterButtonRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([inserterButtonRef, ref]); 49594 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter, { 49595 position: "bottom center", 49596 rootClientId: rootClientId, 49597 __experimentalIsQuick: true, 49598 onSelectOrClose: (...args) => { 49599 if (onSelect && typeof onSelect === 'function') { 49600 onSelect(...args); 49601 } 49602 inserterButtonRef.current?.focus(); 49603 }, 49604 renderToggle: ({ 49605 onToggle, 49606 disabled, 49607 isOpen, 49608 blockTitle, 49609 hasSingleBlockType 49610 }) => { 49611 const isToggleButton = !hasSingleBlockType; 49612 const label = hasSingleBlockType ? (0,external_wp_i18n_namespaceObject.sprintf)( 49613 // translators: %s: the name of the block when there is only one 49614 (0,external_wp_i18n_namespaceObject._x)('Add %s', 'directly add the only allowed block'), blockTitle) : (0,external_wp_i18n_namespaceObject._x)('Add block', 'Generic label for block inserter button'); 49615 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 49616 __next40pxDefaultSize: true, 49617 ref: mergedInserterButtonRef, 49618 onFocus: onFocus, 49619 tabIndex: tabIndex, 49620 className: dist_clsx(className, 'block-editor-button-block-appender'), 49621 onClick: onToggle, 49622 "aria-haspopup": isToggleButton ? 'true' : undefined, 49623 "aria-expanded": isToggleButton ? isOpen : undefined 49624 // Disable reason: There shouldn't be a case where this button is disabled but not visually hidden. 49625 // eslint-disable-next-line no-restricted-syntax 49626 , 49627 disabled: disabled, 49628 label: label, 49629 showTooltip: true, 49630 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 49631 icon: library_plus 49632 }) 49633 }); 49634 }, 49635 isAppender: true 49636 }); 49637 } 49638 49639 /** 49640 * Use `ButtonBlockAppender` instead. 49641 * 49642 * @deprecated 49643 */ 49644 const ButtonBlockerAppender = (0,external_wp_element_namespaceObject.forwardRef)((props, ref) => { 49645 external_wp_deprecated_default()(`wp.blockEditor.ButtonBlockerAppender`, { 49646 alternative: 'wp.blockEditor.ButtonBlockAppender', 49647 since: '5.9' 49648 }); 49649 return button_block_appender_ButtonBlockAppender(props, ref); 49650 }); 49651 49652 /** 49653 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/button-block-appender/README.md 49654 */ 49655 /* harmony default export */ const button_block_appender = ((0,external_wp_element_namespaceObject.forwardRef)(button_block_appender_ButtonBlockAppender)); 49656 49657 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/grid/grid-visualizer.js 49658 /** 49659 * External dependencies 49660 */ 49661 49662 49663 /** 49664 * WordPress dependencies 49665 */ 49666 49667 49668 49669 49670 /** 49671 * Internal dependencies 49672 */ 49673 49674 49675 49676 49677 49678 49679 49680 49681 function GridVisualizer({ 49682 clientId, 49683 contentRef, 49684 parentLayout 49685 }) { 49686 const isDistractionFree = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getSettings().isDistractionFree, []); 49687 const gridElement = useBlockElement(clientId); 49688 if (isDistractionFree || !gridElement) { 49689 return null; 49690 } 49691 const isManualGrid = parentLayout?.isManualPlacement && window.__experimentalEnableGridInteractivity; 49692 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridVisualizerGrid, { 49693 gridClientId: clientId, 49694 gridElement: gridElement, 49695 isManualGrid: isManualGrid, 49696 ref: contentRef 49697 }); 49698 } 49699 const GridVisualizerGrid = (0,external_wp_element_namespaceObject.forwardRef)(({ 49700 gridClientId, 49701 gridElement, 49702 isManualGrid 49703 }, ref) => { 49704 const [gridInfo, setGridInfo] = (0,external_wp_element_namespaceObject.useState)(() => getGridInfo(gridElement)); 49705 const [isDroppingAllowed, setIsDroppingAllowed] = (0,external_wp_element_namespaceObject.useState)(false); 49706 (0,external_wp_element_namespaceObject.useEffect)(() => { 49707 const observers = []; 49708 for (const element of [gridElement, ...gridElement.children]) { 49709 const observer = new window.ResizeObserver(() => { 49710 setGridInfo(getGridInfo(gridElement)); 49711 }); 49712 observer.observe(element); 49713 observers.push(observer); 49714 } 49715 return () => { 49716 for (const observer of observers) { 49717 observer.disconnect(); 49718 } 49719 }; 49720 }, [gridElement]); 49721 (0,external_wp_element_namespaceObject.useEffect)(() => { 49722 function onGlobalDrag() { 49723 setIsDroppingAllowed(true); 49724 } 49725 function onGlobalDragEnd() { 49726 setIsDroppingAllowed(false); 49727 } 49728 document.addEventListener('drag', onGlobalDrag); 49729 document.addEventListener('dragend', onGlobalDragEnd); 49730 return () => { 49731 document.removeEventListener('drag', onGlobalDrag); 49732 document.removeEventListener('dragend', onGlobalDragEnd); 49733 }; 49734 }, []); 49735 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cover, { 49736 className: dist_clsx('block-editor-grid-visualizer', { 49737 'is-dropping-allowed': isDroppingAllowed 49738 }), 49739 clientId: gridClientId, 49740 __unstablePopoverSlot: "__unstable-block-tools-after", 49741 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 49742 ref: ref, 49743 className: "block-editor-grid-visualizer__grid", 49744 style: gridInfo.style, 49745 children: isManualGrid ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ManualGridVisualizer, { 49746 gridClientId: gridClientId, 49747 gridInfo: gridInfo 49748 }) : Array.from({ 49749 length: gridInfo.numItems 49750 }, (_, i) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridVisualizerCell, { 49751 color: gridInfo.currentColor 49752 }, i)) 49753 }) 49754 }); 49755 }); 49756 function ManualGridVisualizer({ 49757 gridClientId, 49758 gridInfo 49759 }) { 49760 const [highlightedRect, setHighlightedRect] = (0,external_wp_element_namespaceObject.useState)(null); 49761 const gridItemStyles = (0,external_wp_data_namespaceObject.useSelect)(select => { 49762 const { 49763 getBlockOrder, 49764 getBlockStyles 49765 } = unlock(select(store)); 49766 const blockOrder = getBlockOrder(gridClientId); 49767 return getBlockStyles(blockOrder); 49768 }, [gridClientId]); 49769 const occupiedRects = (0,external_wp_element_namespaceObject.useMemo)(() => { 49770 const rects = []; 49771 for (const style of Object.values(gridItemStyles)) { 49772 var _style$layout; 49773 const { 49774 columnStart, 49775 rowStart, 49776 columnSpan = 1, 49777 rowSpan = 1 49778 } = (_style$layout = style?.layout) !== null && _style$layout !== void 0 ? _style$layout : {}; 49779 if (!columnStart || !rowStart) { 49780 continue; 49781 } 49782 rects.push(new GridRect({ 49783 columnStart, 49784 rowStart, 49785 columnSpan, 49786 rowSpan 49787 })); 49788 } 49789 return rects; 49790 }, [gridItemStyles]); 49791 return range(1, gridInfo.numRows).map(row => range(1, gridInfo.numColumns).map(column => { 49792 var _highlightedRect$cont; 49793 const isCellOccupied = occupiedRects.some(rect => rect.contains(column, row)); 49794 const isHighlighted = (_highlightedRect$cont = highlightedRect?.contains(column, row)) !== null && _highlightedRect$cont !== void 0 ? _highlightedRect$cont : false; 49795 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridVisualizerCell, { 49796 color: gridInfo.currentColor, 49797 className: isHighlighted && 'is-highlighted', 49798 children: isCellOccupied ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridVisualizerDropZone, { 49799 column: column, 49800 row: row, 49801 gridClientId: gridClientId, 49802 gridInfo: gridInfo, 49803 setHighlightedRect: setHighlightedRect 49804 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridVisualizerAppender, { 49805 column: column, 49806 row: row, 49807 gridClientId: gridClientId, 49808 gridInfo: gridInfo, 49809 setHighlightedRect: setHighlightedRect 49810 }) 49811 }, `$row}-$column}`); 49812 })); 49813 } 49814 function GridVisualizerCell({ 49815 color, 49816 children, 49817 className 49818 }) { 49819 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 49820 className: dist_clsx('block-editor-grid-visualizer__cell', className), 49821 style: { 49822 boxShadow: `inset 0 0 0 1px color-mix(in srgb, $color} 20%, #0000)`, 49823 color 49824 }, 49825 children: children 49826 }); 49827 } 49828 function useGridVisualizerDropZone(column, row, gridClientId, gridInfo, setHighlightedRect) { 49829 const { 49830 getBlockAttributes, 49831 getBlockRootClientId, 49832 canInsertBlockType, 49833 getBlockName 49834 } = (0,external_wp_data_namespaceObject.useSelect)(store); 49835 const { 49836 updateBlockAttributes, 49837 moveBlocksToPosition, 49838 __unstableMarkNextChangeAsNotPersistent 49839 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 49840 const getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(gridClientId, gridInfo.numColumns); 49841 return useDropZoneWithValidation({ 49842 validateDrag(srcClientId) { 49843 const blockName = getBlockName(srcClientId); 49844 if (!canInsertBlockType(blockName, gridClientId)) { 49845 return false; 49846 } 49847 const attributes = getBlockAttributes(srcClientId); 49848 const rect = new GridRect({ 49849 columnStart: column, 49850 rowStart: row, 49851 columnSpan: attributes.style?.layout?.columnSpan, 49852 rowSpan: attributes.style?.layout?.rowSpan 49853 }); 49854 const isInBounds = new GridRect({ 49855 columnSpan: gridInfo.numColumns, 49856 rowSpan: gridInfo.numRows 49857 }).containsRect(rect); 49858 return isInBounds; 49859 }, 49860 onDragEnter(srcClientId) { 49861 const attributes = getBlockAttributes(srcClientId); 49862 setHighlightedRect(new GridRect({ 49863 columnStart: column, 49864 rowStart: row, 49865 columnSpan: attributes.style?.layout?.columnSpan, 49866 rowSpan: attributes.style?.layout?.rowSpan 49867 })); 49868 }, 49869 onDragLeave() { 49870 // onDragEnter can be called before onDragLeave if the user moves 49871 // their mouse quickly, so only clear the highlight if it was set 49872 // by this cell. 49873 setHighlightedRect(prevHighlightedRect => prevHighlightedRect?.columnStart === column && prevHighlightedRect?.rowStart === row ? null : prevHighlightedRect); 49874 }, 49875 onDrop(srcClientId) { 49876 setHighlightedRect(null); 49877 const attributes = getBlockAttributes(srcClientId); 49878 updateBlockAttributes(srcClientId, { 49879 style: { 49880 ...attributes.style, 49881 layout: { 49882 ...attributes.style?.layout, 49883 columnStart: column, 49884 rowStart: row 49885 } 49886 } 49887 }); 49888 __unstableMarkNextChangeAsNotPersistent(); 49889 moveBlocksToPosition([srcClientId], getBlockRootClientId(srcClientId), gridClientId, getNumberOfBlocksBeforeCell(column, row)); 49890 } 49891 }); 49892 } 49893 function GridVisualizerDropZone({ 49894 column, 49895 row, 49896 gridClientId, 49897 gridInfo, 49898 setHighlightedRect 49899 }) { 49900 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 49901 className: "block-editor-grid-visualizer__drop-zone", 49902 ref: useGridVisualizerDropZone(column, row, gridClientId, gridInfo, setHighlightedRect) 49903 }); 49904 } 49905 function GridVisualizerAppender({ 49906 column, 49907 row, 49908 gridClientId, 49909 gridInfo, 49910 setHighlightedRect 49911 }) { 49912 const { 49913 updateBlockAttributes, 49914 moveBlocksToPosition, 49915 __unstableMarkNextChangeAsNotPersistent 49916 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 49917 const getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(gridClientId, gridInfo.numColumns); 49918 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(button_block_appender, { 49919 rootClientId: gridClientId, 49920 className: "block-editor-grid-visualizer__appender", 49921 ref: useGridVisualizerDropZone(column, row, gridClientId, gridInfo, setHighlightedRect), 49922 style: { 49923 color: gridInfo.currentColor 49924 }, 49925 onSelect: block => { 49926 if (!block) { 49927 return; 49928 } 49929 updateBlockAttributes(block.clientId, { 49930 style: { 49931 layout: { 49932 columnStart: column, 49933 rowStart: row 49934 } 49935 } 49936 }); 49937 __unstableMarkNextChangeAsNotPersistent(); 49938 moveBlocksToPosition([block.clientId], gridClientId, gridClientId, getNumberOfBlocksBeforeCell(column, row)); 49939 } 49940 }); 49941 } 49942 function useDropZoneWithValidation({ 49943 validateDrag, 49944 onDragEnter, 49945 onDragLeave, 49946 onDrop 49947 }) { 49948 const { 49949 getDraggedBlockClientIds 49950 } = (0,external_wp_data_namespaceObject.useSelect)(store); 49951 return (0,external_wp_compose_namespaceObject.__experimentalUseDropZone)({ 49952 onDragEnter() { 49953 const [srcClientId] = getDraggedBlockClientIds(); 49954 if (srcClientId && validateDrag(srcClientId)) { 49955 onDragEnter(srcClientId); 49956 } 49957 }, 49958 onDragLeave() { 49959 onDragLeave(); 49960 }, 49961 onDrop() { 49962 const [srcClientId] = getDraggedBlockClientIds(); 49963 if (srcClientId && validateDrag(srcClientId)) { 49964 onDrop(srcClientId); 49965 } 49966 } 49967 }); 49968 } 49969 49970 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/grid/grid-item-resizer.js 49971 /** 49972 * WordPress dependencies 49973 */ 49974 49975 49976 49977 /** 49978 * Internal dependencies 49979 */ 49980 49981 49982 49983 49984 function GridItemResizer({ 49985 clientId, 49986 bounds, 49987 onChange, 49988 parentLayout 49989 }) { 49990 const blockElement = useBlockElement(clientId); 49991 const rootBlockElement = blockElement?.parentElement; 49992 const { 49993 isManualPlacement 49994 } = parentLayout; 49995 if (!blockElement || !rootBlockElement) { 49996 return null; 49997 } 49998 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridItemResizerInner, { 49999 clientId: clientId, 50000 bounds: bounds, 50001 blockElement: blockElement, 50002 rootBlockElement: rootBlockElement, 50003 onChange: onChange, 50004 isManualGrid: isManualPlacement && window.__experimentalEnableGridInteractivity 50005 }); 50006 } 50007 function GridItemResizerInner({ 50008 clientId, 50009 bounds, 50010 blockElement, 50011 rootBlockElement, 50012 onChange, 50013 isManualGrid 50014 }) { 50015 const [resizeDirection, setResizeDirection] = (0,external_wp_element_namespaceObject.useState)(null); 50016 const [enableSide, setEnableSide] = (0,external_wp_element_namespaceObject.useState)({ 50017 top: false, 50018 bottom: false, 50019 left: false, 50020 right: false 50021 }); 50022 (0,external_wp_element_namespaceObject.useEffect)(() => { 50023 const observer = new window.ResizeObserver(() => { 50024 const blockClientRect = blockElement.getBoundingClientRect(); 50025 const rootBlockClientRect = rootBlockElement.getBoundingClientRect(); 50026 setEnableSide({ 50027 top: blockClientRect.top > rootBlockClientRect.top, 50028 bottom: blockClientRect.bottom < rootBlockClientRect.bottom, 50029 left: blockClientRect.left > rootBlockClientRect.left, 50030 right: blockClientRect.right < rootBlockClientRect.right 50031 }); 50032 }); 50033 observer.observe(blockElement); 50034 return () => observer.disconnect(); 50035 }, [blockElement, rootBlockElement]); 50036 const justification = { 50037 right: 'left', 50038 left: 'right' 50039 }; 50040 const alignment = { 50041 top: 'flex-end', 50042 bottom: 'flex-start' 50043 }; 50044 const styles = { 50045 display: 'flex', 50046 justifyContent: 'center', 50047 alignItems: 'center', 50048 ...(justification[resizeDirection] && { 50049 justifyContent: justification[resizeDirection] 50050 }), 50051 ...(alignment[resizeDirection] && { 50052 alignItems: alignment[resizeDirection] 50053 }) 50054 }; 50055 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cover, { 50056 className: "block-editor-grid-item-resizer", 50057 clientId: clientId, 50058 __unstablePopoverSlot: "__unstable-block-tools-after", 50059 additionalStyles: styles, 50060 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ResizableBox, { 50061 className: "block-editor-grid-item-resizer__box", 50062 size: { 50063 width: '100%', 50064 height: '100%' 50065 }, 50066 enable: { 50067 bottom: enableSide.bottom, 50068 bottomLeft: false, 50069 bottomRight: false, 50070 left: enableSide.left, 50071 right: enableSide.right, 50072 top: enableSide.top, 50073 topLeft: false, 50074 topRight: false 50075 }, 50076 bounds: bounds, 50077 boundsByDirection: true, 50078 onPointerDown: ({ 50079 target, 50080 pointerId 50081 }) => { 50082 /* 50083 * Captures the pointer to avoid hiccups while dragging over objects 50084 * like iframes and ensures that the event to end the drag is 50085 * captured by the target (resize handle) whether or not it’s under 50086 * the pointer. 50087 */ 50088 target.setPointerCapture(pointerId); 50089 }, 50090 onResizeStart: (event, direction) => { 50091 /* 50092 * The container justification and alignment need to be set 50093 * according to the direction the resizer is being dragged in, 50094 * so that it resizes in the right direction. 50095 */ 50096 setResizeDirection(direction); 50097 }, 50098 onResizeStop: (event, direction, boxElement) => { 50099 const columnGap = parseFloat(utils_getComputedCSS(rootBlockElement, 'column-gap')); 50100 const rowGap = parseFloat(utils_getComputedCSS(rootBlockElement, 'row-gap')); 50101 const gridColumnTracks = getGridTracks(utils_getComputedCSS(rootBlockElement, 'grid-template-columns'), columnGap); 50102 const gridRowTracks = getGridTracks(utils_getComputedCSS(rootBlockElement, 'grid-template-rows'), rowGap); 50103 const rect = new window.DOMRect(blockElement.offsetLeft + boxElement.offsetLeft, blockElement.offsetTop + boxElement.offsetTop, boxElement.offsetWidth, boxElement.offsetHeight); 50104 const columnStart = getClosestTrack(gridColumnTracks, rect.left) + 1; 50105 const rowStart = getClosestTrack(gridRowTracks, rect.top) + 1; 50106 const columnEnd = getClosestTrack(gridColumnTracks, rect.right, 'end') + 1; 50107 const rowEnd = getClosestTrack(gridRowTracks, rect.bottom, 'end') + 1; 50108 onChange({ 50109 columnSpan: columnEnd - columnStart + 1, 50110 rowSpan: rowEnd - rowStart + 1, 50111 columnStart: isManualGrid ? columnStart : undefined, 50112 rowStart: isManualGrid ? rowStart : undefined 50113 }); 50114 } 50115 }) 50116 }); 50117 } 50118 50119 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-up.js 50120 /** 50121 * WordPress dependencies 50122 */ 50123 50124 50125 const chevronUp = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 50126 viewBox: "0 0 24 24", 50127 xmlns: "http://www.w3.org/2000/svg", 50128 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 50129 d: "M6.5 12.4L12 8l5.5 4.4-.9 1.2L12 10l-4.5 3.6-1-1.2z" 50130 }) 50131 }); 50132 /* harmony default export */ const chevron_up = (chevronUp); 50133 50134 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-down.js 50135 /** 50136 * WordPress dependencies 50137 */ 50138 50139 50140 const chevronDown = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 50141 viewBox: "0 0 24 24", 50142 xmlns: "http://www.w3.org/2000/svg", 50143 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 50144 d: "M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 14l4.5-3.6 1 1.2z" 50145 }) 50146 }); 50147 /* harmony default export */ const chevron_down = (chevronDown); 50148 50149 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/grid/grid-item-movers.js 50150 /** 50151 * External dependencies 50152 */ 50153 50154 50155 /** 50156 * WordPress dependencies 50157 */ 50158 50159 50160 50161 50162 50163 50164 /** 50165 * Internal dependencies 50166 */ 50167 50168 50169 50170 50171 50172 50173 function GridItemMovers({ 50174 layout, 50175 parentLayout, 50176 onChange, 50177 gridClientId, 50178 blockClientId 50179 }) { 50180 var _layout$columnStart, _layout$rowStart, _layout$columnSpan, _layout$rowSpan; 50181 const { 50182 moveBlocksToPosition, 50183 __unstableMarkNextChangeAsNotPersistent 50184 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 50185 const columnStart = (_layout$columnStart = layout?.columnStart) !== null && _layout$columnStart !== void 0 ? _layout$columnStart : 1; 50186 const rowStart = (_layout$rowStart = layout?.rowStart) !== null && _layout$rowStart !== void 0 ? _layout$rowStart : 1; 50187 const columnSpan = (_layout$columnSpan = layout?.columnSpan) !== null && _layout$columnSpan !== void 0 ? _layout$columnSpan : 1; 50188 const rowSpan = (_layout$rowSpan = layout?.rowSpan) !== null && _layout$rowSpan !== void 0 ? _layout$rowSpan : 1; 50189 const columnEnd = columnStart + columnSpan - 1; 50190 const rowEnd = rowStart + rowSpan - 1; 50191 const columnCount = parentLayout?.columnCount; 50192 const rowCount = parentLayout?.rowCount; 50193 const getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(gridClientId, columnCount); 50194 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls, { 50195 group: "parent", 50196 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.ToolbarGroup, { 50197 className: "block-editor-grid-item-mover__move-button-container", 50198 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 50199 className: "block-editor-grid-item-mover__move-horizontal-button-container is-left", 50200 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridItemMover, { 50201 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_right : chevron_left, 50202 label: (0,external_wp_i18n_namespaceObject.__)('Move left'), 50203 description: (0,external_wp_i18n_namespaceObject.__)('Move left'), 50204 isDisabled: columnStart <= 1, 50205 onClick: () => { 50206 onChange({ 50207 columnStart: columnStart - 1 50208 }); 50209 __unstableMarkNextChangeAsNotPersistent(); 50210 moveBlocksToPosition([blockClientId], gridClientId, gridClientId, getNumberOfBlocksBeforeCell(columnStart - 1, rowStart)); 50211 } 50212 }) 50213 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 50214 className: "block-editor-grid-item-mover__move-vertical-button-container", 50215 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridItemMover, { 50216 className: "is-up-button", 50217 icon: chevron_up, 50218 label: (0,external_wp_i18n_namespaceObject.__)('Move up'), 50219 description: (0,external_wp_i18n_namespaceObject.__)('Move up'), 50220 isDisabled: rowStart <= 1, 50221 onClick: () => { 50222 onChange({ 50223 rowStart: rowStart - 1 50224 }); 50225 __unstableMarkNextChangeAsNotPersistent(); 50226 moveBlocksToPosition([blockClientId], gridClientId, gridClientId, getNumberOfBlocksBeforeCell(columnStart, rowStart - 1)); 50227 } 50228 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridItemMover, { 50229 className: "is-down-button", 50230 icon: chevron_down, 50231 label: (0,external_wp_i18n_namespaceObject.__)('Move down'), 50232 description: (0,external_wp_i18n_namespaceObject.__)('Move down'), 50233 isDisabled: rowCount && rowEnd >= rowCount, 50234 onClick: () => { 50235 onChange({ 50236 rowStart: rowStart + 1 50237 }); 50238 __unstableMarkNextChangeAsNotPersistent(); 50239 moveBlocksToPosition([blockClientId], gridClientId, gridClientId, getNumberOfBlocksBeforeCell(columnStart, rowStart + 1)); 50240 } 50241 })] 50242 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 50243 className: "block-editor-grid-item-mover__move-horizontal-button-container is-right", 50244 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridItemMover, { 50245 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_left : chevron_right, 50246 label: (0,external_wp_i18n_namespaceObject.__)('Move right'), 50247 description: (0,external_wp_i18n_namespaceObject.__)('Move right'), 50248 isDisabled: columnCount && columnEnd >= columnCount, 50249 onClick: () => { 50250 onChange({ 50251 columnStart: columnStart + 1 50252 }); 50253 __unstableMarkNextChangeAsNotPersistent(); 50254 moveBlocksToPosition([blockClientId], gridClientId, gridClientId, getNumberOfBlocksBeforeCell(columnStart + 1, rowStart)); 50255 } 50256 }) 50257 })] 50258 }) 50259 }); 50260 } 50261 function GridItemMover({ 50262 className, 50263 icon, 50264 label, 50265 isDisabled, 50266 onClick, 50267 description 50268 }) { 50269 const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(GridItemMover); 50270 const descriptionId = `block-editor-grid-item-mover-button__description-$instanceId}`; 50271 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 50272 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 50273 className: dist_clsx('block-editor-grid-item-mover-button', className), 50274 icon: icon, 50275 label: label, 50276 "aria-describedby": descriptionId, 50277 onClick: isDisabled ? null : onClick, 50278 disabled: isDisabled, 50279 accessibleWhenDisabled: true 50280 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 50281 id: descriptionId, 50282 children: description 50283 })] 50284 }); 50285 } 50286 50287 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/layout-child.js 50288 /** 50289 * WordPress dependencies 50290 */ 50291 50292 50293 50294 50295 /** 50296 * Internal dependencies 50297 */ 50298 50299 50300 50301 50302 50303 50304 50305 function useBlockPropsChildLayoutStyles({ 50306 style 50307 }) { 50308 var _style$layout; 50309 const shouldRenderChildLayoutStyles = (0,external_wp_data_namespaceObject.useSelect)(select => { 50310 return !select(store).getSettings().disableLayoutStyles; 50311 }); 50312 const layout = (_style$layout = style?.layout) !== null && _style$layout !== void 0 ? _style$layout : {}; 50313 const { 50314 selfStretch, 50315 flexSize, 50316 columnStart, 50317 rowStart, 50318 columnSpan, 50319 rowSpan 50320 } = layout; 50321 const parentLayout = useLayout() || {}; 50322 const { 50323 columnCount, 50324 minimumColumnWidth 50325 } = parentLayout; 50326 const id = (0,external_wp_compose_namespaceObject.useInstanceId)(useBlockPropsChildLayoutStyles); 50327 const selector = `.wp-container-content-$id}`; 50328 50329 // Check that the grid layout attributes are of the correct type, so that we don't accidentally 50330 // write code that stores a string attribute instead of a number. 50331 if (false) {} 50332 let css = ''; 50333 if (shouldRenderChildLayoutStyles) { 50334 if (selfStretch === 'fixed' && flexSize) { 50335 css = `$selector} { 50336 flex-basis: $flexSize}; 50337 box-sizing: border-box; 50338 }`; 50339 } else if (selfStretch === 'fill') { 50340 css = `$selector} { 50341 flex-grow: 1; 50342 }`; 50343 } else if (columnStart && columnSpan) { 50344 css = `$selector} { 50345 grid-column: $columnStart} / span $columnSpan}; 50346 }`; 50347 } else if (columnStart) { 50348 css = `$selector} { 50349 grid-column: $columnStart}; 50350 }`; 50351 } else if (columnSpan) { 50352 css = `$selector} { 50353 grid-column: span $columnSpan}; 50354 }`; 50355 } 50356 if (rowStart && rowSpan) { 50357 css += `$selector} { 50358 grid-row: $rowStart} / span $rowSpan}; 50359 }`; 50360 } else if (rowStart) { 50361 css += `$selector} { 50362 grid-row: $rowStart}; 50363 }`; 50364 } else if (rowSpan) { 50365 css += `$selector} { 50366 grid-row: span $rowSpan}; 50367 }`; 50368 } 50369 /** 50370 * If minimumColumnWidth is set on the parent, or if no 50371 * columnCount is set, the grid is responsive so a 50372 * container query is needed for the span to resize. 50373 */ 50374 if ((columnSpan || columnStart) && (minimumColumnWidth || !columnCount)) { 50375 let parentColumnValue = parseFloat(minimumColumnWidth); 50376 /** 50377 * 12rem is the default minimumColumnWidth value. 50378 * If parentColumnValue is not a number, default to 12. 50379 */ 50380 if (isNaN(parentColumnValue)) { 50381 parentColumnValue = 12; 50382 } 50383 let parentColumnUnit = minimumColumnWidth?.replace(parentColumnValue, ''); 50384 /** 50385 * Check that parent column unit is either 'px', 'rem' or 'em'. 50386 * If not, default to 'rem'. 50387 */ 50388 if (!['px', 'rem', 'em'].includes(parentColumnUnit)) { 50389 parentColumnUnit = 'rem'; 50390 } 50391 let numColsToBreakAt = 2; 50392 if (columnSpan && columnStart) { 50393 numColsToBreakAt = columnSpan + columnStart - 1; 50394 } else if (columnSpan) { 50395 numColsToBreakAt = columnSpan; 50396 } else { 50397 numColsToBreakAt = columnStart; 50398 } 50399 const defaultGapValue = parentColumnUnit === 'px' ? 24 : 1.5; 50400 const containerQueryValue = numColsToBreakAt * parentColumnValue + (numColsToBreakAt - 1) * defaultGapValue; 50401 // For blocks that only span one column, we want to remove any rowStart values as 50402 // the container reduces in size, so that blocks are still arranged in markup order. 50403 const minimumContainerQueryValue = parentColumnValue * 2 + defaultGapValue - 1; 50404 // If a span is set we want to preserve it as long as possible, otherwise we just reset the value. 50405 const gridColumnValue = columnSpan && columnSpan > 1 ? '1/-1' : 'auto'; 50406 css += `@container (max-width: $Math.max(containerQueryValue, minimumContainerQueryValue)}$parentColumnUnit}) { 50407 $selector} { 50408 grid-column: $gridColumnValue}; 50409 grid-row: auto; 50410 } 50411 }`; 50412 } 50413 } 50414 useStyleOverride({ 50415 css 50416 }); 50417 50418 // Only attach a container class if there is generated CSS to be attached. 50419 if (!css) { 50420 return; 50421 } 50422 50423 // Attach a `wp-container-content` id-based classname. 50424 return { 50425 className: `wp-container-content-$id}` 50426 }; 50427 } 50428 function ChildLayoutControlsPure({ 50429 clientId, 50430 style, 50431 setAttributes 50432 }) { 50433 const parentLayout = useLayout() || {}; 50434 const { 50435 type: parentLayoutType = 'default', 50436 allowSizingOnChildren = false, 50437 isManualPlacement 50438 } = parentLayout; 50439 if (parentLayoutType !== 'grid') { 50440 return null; 50441 } 50442 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridTools, { 50443 clientId: clientId, 50444 style: style, 50445 setAttributes: setAttributes, 50446 allowSizingOnChildren: allowSizingOnChildren, 50447 isManualPlacement: isManualPlacement, 50448 parentLayout: parentLayout 50449 }); 50450 } 50451 function GridTools({ 50452 clientId, 50453 style, 50454 setAttributes, 50455 allowSizingOnChildren, 50456 isManualPlacement, 50457 parentLayout 50458 }) { 50459 const { 50460 rootClientId, 50461 isVisible 50462 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 50463 const { 50464 getBlockRootClientId, 50465 getBlockEditingMode, 50466 getTemplateLock 50467 } = select(store); 50468 const _rootClientId = getBlockRootClientId(clientId); 50469 if (getTemplateLock(_rootClientId) || getBlockEditingMode(_rootClientId) !== 'default') { 50470 return { 50471 rootClientId: _rootClientId, 50472 isVisible: false 50473 }; 50474 } 50475 return { 50476 rootClientId: _rootClientId, 50477 isVisible: true 50478 }; 50479 }, [clientId]); 50480 50481 // Use useState() instead of useRef() so that GridItemResizer updates when ref is set. 50482 const [resizerBounds, setResizerBounds] = (0,external_wp_element_namespaceObject.useState)(); 50483 if (!isVisible) { 50484 return null; 50485 } 50486 function updateLayout(layout) { 50487 setAttributes({ 50488 style: { 50489 ...style, 50490 layout: { 50491 ...style?.layout, 50492 ...layout 50493 } 50494 } 50495 }); 50496 } 50497 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 50498 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridVisualizer, { 50499 clientId: rootClientId, 50500 contentRef: setResizerBounds, 50501 parentLayout: parentLayout 50502 }), allowSizingOnChildren && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridItemResizer, { 50503 clientId: clientId 50504 // Don't allow resizing beyond the grid visualizer. 50505 , 50506 bounds: resizerBounds, 50507 onChange: updateLayout, 50508 parentLayout: parentLayout 50509 }), isManualPlacement && window.__experimentalEnableGridInteractivity && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridItemMovers, { 50510 layout: style?.layout, 50511 parentLayout: parentLayout, 50512 onChange: updateLayout, 50513 gridClientId: rootClientId, 50514 blockClientId: clientId 50515 })] 50516 }); 50517 } 50518 /* harmony default export */ const layout_child = ({ 50519 useBlockProps: useBlockPropsChildLayoutStyles, 50520 edit: ChildLayoutControlsPure, 50521 attributeKeys: ['style'], 50522 hasSupport() { 50523 return true; 50524 } 50525 }); 50526 50527 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/content-lock-ui.js 50528 /** 50529 * WordPress dependencies 50530 */ 50531 50532 50533 50534 50535 50536 /** 50537 * Internal dependencies 50538 */ 50539 50540 50541 50542 50543 // The implementation of content locking is mainly in this file, although the mechanism 50544 // to stop temporarily editing as blocks when an outside block is selected is on component StopEditingAsBlocksOnOutsideSelect 50545 // at block-editor/src/components/block-list/index.js. 50546 // Besides the components on this file and the file referenced above the implementation 50547 // also includes artifacts on the store (actions, reducers, and selector). 50548 50549 function ContentLockControlsPure({ 50550 clientId 50551 }) { 50552 const { 50553 templateLock, 50554 isLockedByParent, 50555 isEditingAsBlocks 50556 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 50557 const { 50558 getContentLockingParent, 50559 getTemplateLock, 50560 getTemporarilyEditingAsBlocks 50561 } = unlock(select(store)); 50562 return { 50563 templateLock: getTemplateLock(clientId), 50564 isLockedByParent: !!getContentLockingParent(clientId), 50565 isEditingAsBlocks: getTemporarilyEditingAsBlocks() === clientId 50566 }; 50567 }, [clientId]); 50568 const { 50569 stopEditingAsBlocks 50570 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 50571 const isContentLocked = !isLockedByParent && templateLock === 'contentOnly'; 50572 const stopEditingAsBlockCallback = (0,external_wp_element_namespaceObject.useCallback)(() => { 50573 stopEditingAsBlocks(clientId); 50574 }, [clientId, stopEditingAsBlocks]); 50575 if (!isContentLocked && !isEditingAsBlocks) { 50576 return null; 50577 } 50578 const showStopEditingAsBlocks = isEditingAsBlocks && !isContentLocked; 50579 return showStopEditingAsBlocks && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls, { 50580 group: "other", 50581 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 50582 onClick: stopEditingAsBlockCallback, 50583 children: (0,external_wp_i18n_namespaceObject.__)('Done') 50584 }) 50585 }); 50586 } 50587 /* harmony default export */ const content_lock_ui = ({ 50588 edit: ContentLockControlsPure, 50589 hasSupport() { 50590 return true; 50591 } 50592 }); 50593 50594 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/metadata.js 50595 /** 50596 * WordPress dependencies 50597 */ 50598 50599 const META_ATTRIBUTE_NAME = 'metadata'; 50600 50601 /** 50602 * Filters registered block settings, extending attributes to include `metadata`. 50603 * 50604 * see: https://github.com/WordPress/gutenberg/pull/40393/files#r864632012 50605 * 50606 * @param {Object} blockTypeSettings Original block settings. 50607 * @return {Object} Filtered block settings. 50608 */ 50609 function addMetaAttribute(blockTypeSettings) { 50610 // Allow blocks to specify their own attribute definition with default values if needed. 50611 if (blockTypeSettings?.attributes?.[META_ATTRIBUTE_NAME]?.type) { 50612 return blockTypeSettings; 50613 } 50614 blockTypeSettings.attributes = { 50615 ...blockTypeSettings.attributes, 50616 [META_ATTRIBUTE_NAME]: { 50617 type: 'object' 50618 } 50619 }; 50620 return blockTypeSettings; 50621 } 50622 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/metadata/addMetaAttribute', addMetaAttribute); 50623 50624 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/block-hooks.js 50625 /** 50626 * WordPress dependencies 50627 */ 50628 50629 50630 50631 50632 50633 50634 /** 50635 * Internal dependencies 50636 */ 50637 50638 50639 50640 50641 const block_hooks_EMPTY_OBJECT = {}; 50642 function BlockHooksControlPure({ 50643 name, 50644 clientId, 50645 metadata: { 50646 ignoredHookedBlocks = [] 50647 } = {} 50648 }) { 50649 const blockTypes = (0,external_wp_data_namespaceObject.useSelect)(select => select(external_wp_blocks_namespaceObject.store).getBlockTypes(), []); 50650 50651 // A hooked block added via a filter will not be exposed through a block 50652 // type's `blockHooks` property; however, if the containing layout has been 50653 // modified, it will be present in the anchor block's `ignoredHookedBlocks` 50654 // metadata. 50655 const hookedBlocksForCurrentBlock = (0,external_wp_element_namespaceObject.useMemo)(() => blockTypes?.filter(({ 50656 name: blockName, 50657 blockHooks 50658 }) => blockHooks && name in blockHooks || ignoredHookedBlocks.includes(blockName)), [blockTypes, name, ignoredHookedBlocks]); 50659 const hookedBlockClientIds = (0,external_wp_data_namespaceObject.useSelect)(select => { 50660 const { 50661 getBlocks, 50662 getBlockRootClientId, 50663 getGlobalBlockCount 50664 } = select(store); 50665 const rootClientId = getBlockRootClientId(clientId); 50666 const _hookedBlockClientIds = hookedBlocksForCurrentBlock.reduce((clientIds, block) => { 50667 // If the block doesn't exist anywhere in the block tree, 50668 // we know that we have to set the toggle to disabled. 50669 if (getGlobalBlockCount(block.name) === 0) { 50670 return clientIds; 50671 } 50672 const relativePosition = block?.blockHooks?.[name]; 50673 let candidates; 50674 switch (relativePosition) { 50675 case 'before': 50676 case 'after': 50677 // Any of the current block's siblings (with the right block type) qualifies 50678 // as a hooked block (inserted `before` or `after` the current one), as the block 50679 // might've been automatically inserted and then moved around a bit by the user. 50680 candidates = getBlocks(rootClientId); 50681 break; 50682 case 'first_child': 50683 case 'last_child': 50684 // Any of the current block's child blocks (with the right block type) qualifies 50685 // as a hooked first or last child block, as the block might've been automatically 50686 // inserted and then moved around a bit by the user. 50687 candidates = getBlocks(clientId); 50688 break; 50689 case undefined: 50690 // If we haven't found a blockHooks field with a relative position for the hooked 50691 // block, it means that it was added by a filter. In this case, we look for the block 50692 // both among the current block's siblings and its children. 50693 candidates = [...getBlocks(rootClientId), ...getBlocks(clientId)]; 50694 break; 50695 } 50696 const hookedBlock = candidates?.find(candidate => candidate.name === block.name); 50697 50698 // If the block exists in the designated location, we consider it hooked 50699 // and show the toggle as enabled. 50700 if (hookedBlock) { 50701 return { 50702 ...clientIds, 50703 [block.name]: hookedBlock.clientId 50704 }; 50705 } 50706 50707 // If no hooked block was found in any of its designated locations, 50708 // we set the toggle to disabled. 50709 return clientIds; 50710 }, {}); 50711 if (Object.values(_hookedBlockClientIds).length > 0) { 50712 return _hookedBlockClientIds; 50713 } 50714 return block_hooks_EMPTY_OBJECT; 50715 }, [hookedBlocksForCurrentBlock, name, clientId]); 50716 const { 50717 getBlockIndex, 50718 getBlockCount, 50719 getBlockRootClientId 50720 } = (0,external_wp_data_namespaceObject.useSelect)(store); 50721 const { 50722 insertBlock, 50723 removeBlock 50724 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 50725 if (!hookedBlocksForCurrentBlock.length) { 50726 return null; 50727 } 50728 50729 // Group by block namespace (i.e. prefix before the slash). 50730 const groupedHookedBlocks = hookedBlocksForCurrentBlock.reduce((groups, block) => { 50731 const [namespace] = block.name.split('/'); 50732 if (!groups[namespace]) { 50733 groups[namespace] = []; 50734 } 50735 groups[namespace].push(block); 50736 return groups; 50737 }, {}); 50738 const insertBlockIntoDesignatedLocation = (block, relativePosition) => { 50739 const blockIndex = getBlockIndex(clientId); 50740 const innerBlocksLength = getBlockCount(clientId); 50741 const rootClientId = getBlockRootClientId(clientId); 50742 switch (relativePosition) { 50743 case 'before': 50744 case 'after': 50745 insertBlock(block, relativePosition === 'after' ? blockIndex + 1 : blockIndex, rootClientId, 50746 // Insert as a child of the current block's parent 50747 false); 50748 break; 50749 case 'first_child': 50750 case 'last_child': 50751 insertBlock(block, 50752 // TODO: It'd be great if insertBlock() would accept negative indices for insertion. 50753 relativePosition === 'first_child' ? 0 : innerBlocksLength, clientId, 50754 // Insert as a child of the current block. 50755 false); 50756 break; 50757 case undefined: 50758 // If we do not know the relative position, it is because the block was 50759 // added via a filter. In this case, we default to inserting it after the 50760 // current block. 50761 insertBlock(block, blockIndex + 1, rootClientId, 50762 // Insert as a child of the current block's parent 50763 false); 50764 break; 50765 } 50766 }; 50767 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 50768 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.PanelBody, { 50769 className: "block-editor-hooks__block-hooks", 50770 title: (0,external_wp_i18n_namespaceObject.__)('Plugins'), 50771 initialOpen: true, 50772 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 50773 className: "block-editor-hooks__block-hooks-helptext", 50774 children: (0,external_wp_i18n_namespaceObject.__)('Manage the inclusion of blocks added automatically by plugins.') 50775 }), Object.keys(groupedHookedBlocks).map(vendor => { 50776 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_element_namespaceObject.Fragment, { 50777 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("h3", { 50778 children: vendor 50779 }), groupedHookedBlocks[vendor].map(block => { 50780 const checked = (block.name in hookedBlockClientIds); 50781 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 50782 __nextHasNoMarginBottom: true, 50783 checked: checked, 50784 label: block.title, 50785 onChange: () => { 50786 if (!checked) { 50787 // Create and insert block. 50788 const relativePosition = block.blockHooks[name]; 50789 insertBlockIntoDesignatedLocation((0,external_wp_blocks_namespaceObject.createBlock)(block.name), relativePosition); 50790 return; 50791 } 50792 50793 // Remove block. 50794 removeBlock(hookedBlockClientIds[block.name], false); 50795 } 50796 }, block.title); 50797 })] 50798 }, vendor); 50799 })] 50800 }) 50801 }); 50802 } 50803 /* harmony default export */ const block_hooks = ({ 50804 edit: BlockHooksControlPure, 50805 attributeKeys: ['metadata'], 50806 hasSupport() { 50807 return true; 50808 } 50809 }); 50810 50811 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/block-bindings.js 50812 /** 50813 * WordPress dependencies 50814 */ 50815 50816 50817 /** 50818 * Internal dependencies 50819 */ 50820 50821 50822 function isObjectEmpty(object) { 50823 return !object || Object.keys(object).length === 0; 50824 } 50825 50826 /** 50827 * Contains utils to update the block `bindings` metadata. 50828 * 50829 * @typedef {Object} WPBlockBindingsUtils 50830 * 50831 * @property {Function} updateBlockBindings Updates the value of the bindings connected to block attributes. 50832 * @property {Function} removeAllBlockBindings Removes the bindings property of the `metadata` attribute. 50833 */ 50834 50835 /** 50836 * Retrieves the existing utils needed to update the block `bindings` metadata. 50837 * They can be used to create, modify, or remove connections from the existing block attributes. 50838 * 50839 * It contains the following utils: 50840 * - `updateBlockBindings`: Updates the value of the bindings connected to block attributes. It can be used to remove a specific binding by setting the value to `undefined`. 50841 * - `removeAllBlockBindings`: Removes the bindings property of the `metadata` attribute. 50842 * 50843 * @param {?string} clientId Optional block client ID. If not set, it will use the current block client ID from the context. 50844 * 50845 * @return {?WPBlockBindingsUtils} Object containing the block bindings utils. 50846 * 50847 * @example 50848 * ```js 50849 * import { useBlockBindingsUtils } from '@wordpress/block-editor' 50850 * const { updateBlockBindings, removeAllBlockBindings } = useBlockBindingsUtils(); 50851 * 50852 * // Update url and alt attributes. 50853 * updateBlockBindings( { 50854 * url: { 50855 * source: 'core/post-meta', 50856 * args: { 50857 * key: 'url_custom_field', 50858 * }, 50859 * }, 50860 * alt: { 50861 * source: 'core/post-meta', 50862 * args: { 50863 * key: 'text_custom_field', 50864 * }, 50865 * }, 50866 * } ); 50867 * 50868 * // Remove binding from url attribute. 50869 * updateBlockBindings( { url: undefined } ); 50870 * 50871 * // Remove bindings from all attributes. 50872 * removeAllBlockBindings(); 50873 * ``` 50874 */ 50875 function useBlockBindingsUtils(clientId) { 50876 const { 50877 clientId: contextClientId 50878 } = useBlockEditContext(); 50879 const blockClientId = clientId || contextClientId; 50880 const { 50881 updateBlockAttributes 50882 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 50883 const { 50884 getBlockAttributes 50885 } = (0,external_wp_data_namespaceObject.useRegistry)().select(store); 50886 50887 /** 50888 * Updates the value of the bindings connected to block attributes. 50889 * It removes the binding when the new value is `undefined`. 50890 * 50891 * @param {Object} bindings Bindings including the attributes to update and the new object. 50892 * @param {string} bindings.source The source name to connect to. 50893 * @param {Object} [bindings.args] Object containing the arguments needed by the source. 50894 * 50895 * @example 50896 * ```js 50897 * import { useBlockBindingsUtils } from '@wordpress/block-editor' 50898 * 50899 * const { updateBlockBindings } = useBlockBindingsUtils(); 50900 * updateBlockBindings( { 50901 * url: { 50902 * source: 'core/post-meta', 50903 * args: { 50904 * key: 'url_custom_field', 50905 * }, 50906 * }, 50907 * alt: { 50908 * source: 'core/post-meta', 50909 * args: { 50910 * key: 'text_custom_field', 50911 * }, 50912 * } 50913 * } ); 50914 * ``` 50915 */ 50916 const updateBlockBindings = bindings => { 50917 const { 50918 metadata: { 50919 bindings: currentBindings, 50920 ...metadata 50921 } = {} 50922 } = getBlockAttributes(blockClientId); 50923 const newBindings = { 50924 ...currentBindings 50925 }; 50926 Object.entries(bindings).forEach(([attribute, binding]) => { 50927 if (!binding && newBindings[attribute]) { 50928 delete newBindings[attribute]; 50929 return; 50930 } 50931 newBindings[attribute] = binding; 50932 }); 50933 const newMetadata = { 50934 ...metadata, 50935 bindings: newBindings 50936 }; 50937 if (isObjectEmpty(newMetadata.bindings)) { 50938 delete newMetadata.bindings; 50939 } 50940 updateBlockAttributes(blockClientId, { 50941 metadata: isObjectEmpty(newMetadata) ? undefined : newMetadata 50942 }); 50943 }; 50944 50945 /** 50946 * Removes the bindings property of the `metadata` attribute. 50947 * 50948 * @example 50949 * ```js 50950 * import { useBlockBindingsUtils } from '@wordpress/block-editor' 50951 * 50952 * const { removeAllBlockBindings } = useBlockBindingsUtils(); 50953 * removeAllBlockBindings(); 50954 * ``` 50955 */ 50956 const removeAllBlockBindings = () => { 50957 const { 50958 metadata: { 50959 bindings, 50960 ...metadata 50961 } = {} 50962 } = getBlockAttributes(blockClientId); 50963 updateBlockAttributes(blockClientId, { 50964 metadata: isObjectEmpty(metadata) ? undefined : metadata 50965 }); 50966 }; 50967 return { 50968 updateBlockBindings, 50969 removeAllBlockBindings 50970 }; 50971 } 50972 50973 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/block-bindings.js 50974 /** 50975 * WordPress dependencies 50976 */ 50977 50978 50979 50980 50981 50982 50983 50984 /** 50985 * Internal dependencies 50986 */ 50987 50988 50989 50990 50991 50992 50993 50994 50995 50996 50997 const { 50998 DropdownMenuV2 50999 } = unlock(external_wp_components_namespaceObject.privateApis); 51000 const block_bindings_EMPTY_OBJECT = {}; 51001 const block_bindings_useToolsPanelDropdownMenuProps = () => { 51002 const isMobile = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 51003 return !isMobile ? { 51004 popoverProps: { 51005 placement: 'left-start', 51006 // For non-mobile, inner sidebar width (248px) - button width (24px) - border (1px) + padding (16px) + spacing (20px) 51007 offset: 259 51008 } 51009 } : {}; 51010 }; 51011 function BlockBindingsPanelDropdown({ 51012 fieldsList, 51013 attribute, 51014 binding 51015 }) { 51016 const { 51017 clientId 51018 } = useBlockEditContext(); 51019 const registeredSources = (0,external_wp_blocks_namespaceObject.getBlockBindingsSources)(); 51020 const { 51021 updateBlockBindings 51022 } = useBlockBindingsUtils(); 51023 const currentKey = binding?.args?.key; 51024 const attributeType = (0,external_wp_data_namespaceObject.useSelect)(select => { 51025 const { 51026 name: blockName 51027 } = select(store).getBlock(clientId); 51028 const _attributeType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockName).attributes?.[attribute]?.type; 51029 return _attributeType === 'rich-text' ? 'string' : _attributeType; 51030 }, [clientId, attribute]); 51031 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 51032 children: Object.entries(fieldsList).map(([name, fields], i) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_element_namespaceObject.Fragment, { 51033 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(DropdownMenuV2.Group, { 51034 children: [Object.keys(fieldsList).length > 1 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuV2.GroupLabel, { 51035 children: registeredSources[name].label 51036 }), Object.entries(fields).filter(([, args]) => args?.type === attributeType).map(([key, args]) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(DropdownMenuV2.RadioItem, { 51037 onChange: () => updateBlockBindings({ 51038 [attribute]: { 51039 source: name, 51040 args: { 51041 key 51042 } 51043 } 51044 }), 51045 name: attribute + '-binding', 51046 value: key, 51047 checked: key === currentKey, 51048 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuV2.ItemLabel, { 51049 children: args?.label 51050 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuV2.ItemHelpText, { 51051 children: args?.value 51052 })] 51053 }, key))] 51054 }), i !== Object.keys(fieldsList).length - 1 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuV2.Separator, {})] 51055 }, name)) 51056 }); 51057 } 51058 function BlockBindingsAttribute({ 51059 attribute, 51060 binding, 51061 fieldsList 51062 }) { 51063 const { 51064 source: sourceName, 51065 args 51066 } = binding || {}; 51067 const sourceProps = (0,external_wp_blocks_namespaceObject.getBlockBindingsSource)(sourceName); 51068 const isSourceInvalid = !sourceProps; 51069 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 51070 className: "block-editor-bindings__item", 51071 spacing: 0, 51072 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 51073 truncate: true, 51074 children: attribute 51075 }), !!binding && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 51076 truncate: true, 51077 variant: !isSourceInvalid && 'muted', 51078 isDestructive: isSourceInvalid, 51079 children: isSourceInvalid ? (0,external_wp_i18n_namespaceObject.__)('Invalid source') : fieldsList?.[sourceName]?.[args?.key]?.label || sourceProps?.label || sourceName 51080 })] 51081 }); 51082 } 51083 function ReadOnlyBlockBindingsPanelItems({ 51084 bindings, 51085 fieldsList 51086 }) { 51087 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 51088 children: Object.entries(bindings).map(([attribute, binding]) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalItem, { 51089 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockBindingsAttribute, { 51090 attribute: attribute, 51091 binding: binding, 51092 fieldsList: fieldsList 51093 }) 51094 }, attribute)) 51095 }); 51096 } 51097 function EditableBlockBindingsPanelItems({ 51098 attributes, 51099 bindings, 51100 fieldsList 51101 }) { 51102 const { 51103 updateBlockBindings 51104 } = useBlockBindingsUtils(); 51105 const isMobile = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 51106 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 51107 children: attributes.map(attribute => { 51108 const binding = bindings[attribute]; 51109 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 51110 hasValue: () => !!binding, 51111 label: attribute, 51112 onDeselect: () => { 51113 updateBlockBindings({ 51114 [attribute]: undefined 51115 }); 51116 }, 51117 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuV2, { 51118 placement: isMobile ? 'bottom-start' : 'left-start', 51119 gutter: isMobile ? 8 : 36, 51120 trigger: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalItem, { 51121 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockBindingsAttribute, { 51122 attribute: attribute, 51123 binding: binding, 51124 fieldsList: fieldsList 51125 }) 51126 }), 51127 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockBindingsPanelDropdown, { 51128 fieldsList: fieldsList, 51129 attribute: attribute, 51130 binding: binding 51131 }) 51132 }) 51133 }, attribute); 51134 }) 51135 }); 51136 } 51137 const BlockBindingsPanel = ({ 51138 name: blockName, 51139 metadata 51140 }) => { 51141 const blockContext = (0,external_wp_element_namespaceObject.useContext)(block_context); 51142 const { 51143 removeAllBlockBindings 51144 } = useBlockBindingsUtils(); 51145 const bindableAttributes = getBindableAttributes(blockName); 51146 const dropdownMenuProps = block_bindings_useToolsPanelDropdownMenuProps(); 51147 51148 // `useSelect` is used purposely here to ensure `getFieldsList` 51149 // is updated whenever there are updates in block context. 51150 // `source.getFieldsList` may also call a selector via `select`. 51151 const _fieldsList = {}; 51152 const { 51153 fieldsList, 51154 canUpdateBlockBindings 51155 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 51156 if (!bindableAttributes || bindableAttributes.length === 0) { 51157 return block_bindings_EMPTY_OBJECT; 51158 } 51159 const registeredSources = (0,external_wp_blocks_namespaceObject.getBlockBindingsSources)(); 51160 Object.entries(registeredSources).forEach(([sourceName, { 51161 getFieldsList, 51162 usesContext 51163 }]) => { 51164 if (getFieldsList) { 51165 // Populate context. 51166 const context = {}; 51167 if (usesContext?.length) { 51168 for (const key of usesContext) { 51169 context[key] = blockContext[key]; 51170 } 51171 } 51172 const sourceList = getFieldsList({ 51173 select, 51174 context 51175 }); 51176 // Only add source if the list is not empty. 51177 if (Object.keys(sourceList || {}).length) { 51178 _fieldsList[sourceName] = { 51179 ...sourceList 51180 }; 51181 } 51182 } 51183 }); 51184 return { 51185 fieldsList: Object.values(_fieldsList).length > 0 ? _fieldsList : block_bindings_EMPTY_OBJECT, 51186 canUpdateBlockBindings: select(store).getSettings().canUpdateBlockBindings 51187 }; 51188 }, [blockContext, bindableAttributes]); 51189 // Return early if there are no bindable attributes. 51190 if (!bindableAttributes || bindableAttributes.length === 0) { 51191 return null; 51192 } 51193 // Filter bindings to only show bindable attributes and remove pattern overrides. 51194 const { 51195 bindings 51196 } = metadata || {}; 51197 const filteredBindings = { 51198 ...bindings 51199 }; 51200 Object.keys(filteredBindings).forEach(key => { 51201 if (!canBindAttribute(blockName, key) || filteredBindings[key].source === 'core/pattern-overrides') { 51202 delete filteredBindings[key]; 51203 } 51204 }); 51205 51206 // Lock the UI when the user can't update bindings or there are no fields to connect to. 51207 const readOnly = !canUpdateBlockBindings || !Object.keys(fieldsList).length; 51208 if (readOnly && Object.keys(filteredBindings).length === 0) { 51209 return null; 51210 } 51211 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, { 51212 group: "bindings", 51213 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 51214 label: (0,external_wp_i18n_namespaceObject.__)('Attributes'), 51215 resetAll: () => { 51216 removeAllBlockBindings(); 51217 }, 51218 dropdownMenuProps: dropdownMenuProps, 51219 className: "block-editor-bindings__panel", 51220 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalItemGroup, { 51221 isBordered: true, 51222 isSeparated: true, 51223 children: readOnly ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ReadOnlyBlockBindingsPanelItems, { 51224 bindings: filteredBindings, 51225 fieldsList: fieldsList 51226 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(EditableBlockBindingsPanelItems, { 51227 attributes: bindableAttributes, 51228 bindings: filteredBindings, 51229 fieldsList: fieldsList 51230 }) 51231 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalItemGroup, { 51232 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 51233 variant: "muted", 51234 children: (0,external_wp_i18n_namespaceObject.__)('Attributes connected to custom fields or other dynamic data.') 51235 }) 51236 })] 51237 }) 51238 }); 51239 }; 51240 /* harmony default export */ const block_bindings = ({ 51241 edit: BlockBindingsPanel, 51242 attributeKeys: ['metadata'], 51243 hasSupport() { 51244 return true; 51245 } 51246 }); 51247 51248 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/block-renaming.js 51249 /** 51250 * WordPress dependencies 51251 */ 51252 51253 51254 51255 /** 51256 * Filters registered block settings, adding an `__experimentalLabel` callback if one does not already exist. 51257 * 51258 * @param {Object} settings Original block settings. 51259 * 51260 * @return {Object} Filtered block settings. 51261 */ 51262 function addLabelCallback(settings) { 51263 // If blocks provide their own label callback, do not override it. 51264 if (settings.__experimentalLabel) { 51265 return settings; 51266 } 51267 const supportsBlockNaming = (0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, 'renaming', true // default value 51268 ); 51269 51270 // Check whether block metadata is supported before using it. 51271 if (supportsBlockNaming) { 51272 settings.__experimentalLabel = (attributes, { 51273 context 51274 }) => { 51275 const { 51276 metadata 51277 } = attributes; 51278 51279 // In the list view, use the block's name attribute as the label. 51280 if (context === 'list-view' && metadata?.name) { 51281 return metadata.name; 51282 } 51283 }; 51284 } 51285 return settings; 51286 } 51287 (0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/metadata/addLabelCallback', addLabelCallback); 51288 51289 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/grid/use-grid-layout-sync.js 51290 /** 51291 * WordPress dependencies 51292 */ 51293 51294 51295 51296 51297 /** 51298 * Internal dependencies 51299 */ 51300 51301 51302 51303 function useGridLayoutSync({ 51304 clientId: gridClientId 51305 }) { 51306 const { 51307 gridLayout, 51308 blockOrder, 51309 selectedBlockLayout 51310 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 51311 var _getBlockAttributes$l; 51312 const { 51313 getBlockAttributes, 51314 getBlockOrder 51315 } = select(store); 51316 const selectedBlock = select(store).getSelectedBlock(); 51317 return { 51318 gridLayout: (_getBlockAttributes$l = getBlockAttributes(gridClientId).layout) !== null && _getBlockAttributes$l !== void 0 ? _getBlockAttributes$l : {}, 51319 blockOrder: getBlockOrder(gridClientId), 51320 selectedBlockLayout: selectedBlock?.attributes.style?.layout 51321 }; 51322 }, [gridClientId]); 51323 const { 51324 getBlockAttributes, 51325 getBlockRootClientId 51326 } = (0,external_wp_data_namespaceObject.useSelect)(store); 51327 const { 51328 updateBlockAttributes, 51329 __unstableMarkNextChangeAsNotPersistent 51330 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 51331 const selectedBlockRect = (0,external_wp_element_namespaceObject.useMemo)(() => selectedBlockLayout ? new GridRect(selectedBlockLayout) : null, [selectedBlockLayout]); 51332 const previouslySelectedBlockRect = (0,external_wp_compose_namespaceObject.usePrevious)(selectedBlockRect); 51333 const previousIsManualPlacement = (0,external_wp_compose_namespaceObject.usePrevious)(gridLayout.isManualPlacement); 51334 const previousBlockOrder = (0,external_wp_compose_namespaceObject.usePrevious)(blockOrder); 51335 (0,external_wp_element_namespaceObject.useEffect)(() => { 51336 const updates = {}; 51337 if (gridLayout.isManualPlacement) { 51338 const occupiedRects = []; 51339 51340 // Respect the position of blocks that already have a columnStart and rowStart value. 51341 for (const clientId of blockOrder) { 51342 var _getBlockAttributes$s; 51343 const { 51344 columnStart, 51345 rowStart, 51346 columnSpan = 1, 51347 rowSpan = 1 51348 } = (_getBlockAttributes$s = getBlockAttributes(clientId).style?.layout) !== null && _getBlockAttributes$s !== void 0 ? _getBlockAttributes$s : {}; 51349 if (!columnStart || !rowStart) { 51350 continue; 51351 } 51352 occupiedRects.push(new GridRect({ 51353 columnStart, 51354 rowStart, 51355 columnSpan, 51356 rowSpan 51357 })); 51358 } 51359 51360 // When in manual mode, ensure that every block has a columnStart and rowStart value. 51361 for (const clientId of blockOrder) { 51362 var _attributes$style$lay; 51363 const attributes = getBlockAttributes(clientId); 51364 const { 51365 columnStart, 51366 rowStart, 51367 columnSpan = 1, 51368 rowSpan = 1 51369 } = (_attributes$style$lay = attributes.style?.layout) !== null && _attributes$style$lay !== void 0 ? _attributes$style$lay : {}; 51370 if (columnStart && rowStart) { 51371 continue; 51372 } 51373 const [newColumnStart, newRowStart] = placeBlock(occupiedRects, gridLayout.columnCount, columnSpan, rowSpan, previouslySelectedBlockRect?.columnEnd, previouslySelectedBlockRect?.rowEnd); 51374 occupiedRects.push(new GridRect({ 51375 columnStart: newColumnStart, 51376 rowStart: newRowStart, 51377 columnSpan, 51378 rowSpan 51379 })); 51380 updates[clientId] = { 51381 style: { 51382 ...attributes.style, 51383 layout: { 51384 ...attributes.style?.layout, 51385 columnStart: newColumnStart, 51386 rowStart: newRowStart 51387 } 51388 } 51389 }; 51390 } 51391 51392 // Ensure there's enough rows to fit all blocks. 51393 const bottomMostRow = Math.max(...occupiedRects.map(r => r.rowEnd)); 51394 if (!gridLayout.rowCount || gridLayout.rowCount < bottomMostRow) { 51395 updates[gridClientId] = { 51396 layout: { 51397 ...gridLayout, 51398 rowCount: bottomMostRow 51399 } 51400 }; 51401 } 51402 51403 // Unset grid layout attributes for blocks removed from the grid. 51404 for (const clientId of previousBlockOrder !== null && previousBlockOrder !== void 0 ? previousBlockOrder : []) { 51405 if (!blockOrder.includes(clientId)) { 51406 var _attributes$style$lay2; 51407 const rootClientId = getBlockRootClientId(clientId); 51408 51409 // Block was removed from the editor, so nothing to do. 51410 if (rootClientId === null) { 51411 continue; 51412 } 51413 51414 // Check if the block is being moved to another grid. 51415 // If so, do nothing and let the new grid parent handle 51416 // the attributes. 51417 const rootAttributes = getBlockAttributes(rootClientId); 51418 if (rootAttributes?.layout?.type === 'grid') { 51419 continue; 51420 } 51421 const attributes = getBlockAttributes(clientId); 51422 const { 51423 columnStart, 51424 rowStart, 51425 columnSpan, 51426 rowSpan, 51427 ...layout 51428 } = (_attributes$style$lay2 = attributes.style?.layout) !== null && _attributes$style$lay2 !== void 0 ? _attributes$style$lay2 : {}; 51429 if (columnStart || rowStart || columnSpan || rowSpan) { 51430 const hasEmptyLayoutAttribute = Object.keys(layout).length === 0; 51431 updates[clientId] = setImmutably(attributes, ['style', 'layout'], hasEmptyLayoutAttribute ? undefined : layout); 51432 } 51433 } 51434 } 51435 } else { 51436 // Remove all of the columnStart and rowStart values 51437 // when switching from manual to auto mode, 51438 if (previousIsManualPlacement === true) { 51439 for (const clientId of blockOrder) { 51440 var _attributes$style$lay3; 51441 const attributes = getBlockAttributes(clientId); 51442 const { 51443 columnStart, 51444 rowStart, 51445 ...layout 51446 } = (_attributes$style$lay3 = attributes.style?.layout) !== null && _attributes$style$lay3 !== void 0 ? _attributes$style$lay3 : {}; 51447 // Only update attributes if columnStart or rowStart are set. 51448 if (columnStart || rowStart) { 51449 const hasEmptyLayoutAttribute = Object.keys(layout).length === 0; 51450 updates[clientId] = setImmutably(attributes, ['style', 'layout'], hasEmptyLayoutAttribute ? undefined : layout); 51451 } 51452 } 51453 } 51454 51455 // Remove row styles in auto mode 51456 if (gridLayout.rowCount) { 51457 updates[gridClientId] = { 51458 layout: { 51459 ...gridLayout, 51460 rowCount: undefined 51461 } 51462 }; 51463 } 51464 } 51465 if (Object.keys(updates).length) { 51466 __unstableMarkNextChangeAsNotPersistent(); 51467 updateBlockAttributes(Object.keys(updates), updates, /* uniqueByBlock: */true); 51468 } 51469 }, [ 51470 // Actual deps to sync: 51471 gridClientId, gridLayout, previousBlockOrder, blockOrder, previouslySelectedBlockRect, previousIsManualPlacement, 51472 // These won't change, but the linter thinks they might: 51473 __unstableMarkNextChangeAsNotPersistent, getBlockAttributes, getBlockRootClientId, updateBlockAttributes]); 51474 } 51475 51476 /** 51477 * @param {GridRect[]} occupiedRects 51478 * @param {number} gridColumnCount 51479 * @param {number} blockColumnSpan 51480 * @param {number} blockRowSpan 51481 * @param {number?} startColumn 51482 * @param {number?} startRow 51483 */ 51484 function placeBlock(occupiedRects, gridColumnCount, blockColumnSpan, blockRowSpan, startColumn = 1, startRow = 1) { 51485 for (let row = startRow;; row++) { 51486 for (let column = row === startRow ? startColumn : 1; column <= gridColumnCount; column++) { 51487 const candidateRect = new GridRect({ 51488 columnStart: column, 51489 rowStart: row, 51490 columnSpan: blockColumnSpan, 51491 rowSpan: blockRowSpan 51492 }); 51493 if (!occupiedRects.some(r => r.intersectsRect(candidateRect))) { 51494 return [column, row]; 51495 } 51496 } 51497 } 51498 } 51499 51500 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/grid-visualizer.js 51501 /** 51502 * WordPress dependencies 51503 */ 51504 51505 51506 51507 51508 /** 51509 * Internal dependencies 51510 */ 51511 51512 51513 51514 51515 51516 function GridLayoutSync(props) { 51517 useGridLayoutSync(props); 51518 } 51519 function grid_visualizer_GridTools({ 51520 clientId, 51521 layout 51522 }) { 51523 const isVisible = (0,external_wp_data_namespaceObject.useSelect)(select => { 51524 const { 51525 isBlockSelected, 51526 isDraggingBlocks, 51527 getTemplateLock, 51528 getBlockEditingMode 51529 } = select(store); 51530 51531 // These calls are purposely ordered from least expensive to most expensive. 51532 // Hides the visualizer in cases where the user is not or cannot interact with it. 51533 if (!isDraggingBlocks() && !isBlockSelected(clientId) || getTemplateLock(clientId) || getBlockEditingMode(clientId) !== 'default') { 51534 return false; 51535 } 51536 return true; 51537 }, [clientId]); 51538 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 51539 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLayoutSync, { 51540 clientId: clientId 51541 }), isVisible && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridVisualizer, { 51542 clientId: clientId, 51543 parentLayout: layout 51544 })] 51545 }); 51546 } 51547 const addGridVisualizerToBlockEdit = (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(BlockEdit => props => { 51548 if (props.attributes.layout?.type !== 'grid') { 51549 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockEdit, { 51550 ...props 51551 }, "edit"); 51552 } 51553 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 51554 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(grid_visualizer_GridTools, { 51555 clientId: props.clientId, 51556 layout: props.attributes.layout 51557 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockEdit, { 51558 ...props 51559 }, "edit")] 51560 }); 51561 }, 'addGridVisualizerToBlockEdit'); 51562 (0,external_wp_hooks_namespaceObject.addFilter)('editor.BlockEdit', 'core/editor/grid-visualizer', addGridVisualizerToBlockEdit); 51563 51564 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/use-border-props.js 51565 /** 51566 * Internal dependencies 51567 */ 51568 51569 51570 51571 51572 // This utility is intended to assist where the serialization of the border 51573 // block support is being skipped for a block but the border related CSS classes 51574 // & styles still need to be generated so they can be applied to inner elements. 51575 51576 /** 51577 * Provides the CSS class names and inline styles for a block's border support 51578 * attributes. 51579 * 51580 * @param {Object} attributes Block attributes. 51581 * @return {Object} Border block support derived CSS classes & styles. 51582 */ 51583 function getBorderClassesAndStyles(attributes) { 51584 const border = attributes.style?.border || {}; 51585 const className = getBorderClasses(attributes); 51586 return { 51587 className: className || undefined, 51588 style: getInlineStyles({ 51589 border 51590 }) 51591 }; 51592 } 51593 51594 /** 51595 * Derives the border related props for a block from its border block support 51596 * attributes. 51597 * 51598 * Inline styles are forced for named colors to ensure these selections are 51599 * reflected when themes do not load their color stylesheets in the editor. 51600 * 51601 * @param {Object} attributes Block attributes. 51602 * 51603 * @return {Object} ClassName & style props from border block support. 51604 */ 51605 function useBorderProps(attributes) { 51606 const { 51607 colors 51608 } = useMultipleOriginColorsAndGradients(); 51609 const borderProps = getBorderClassesAndStyles(attributes); 51610 const { 51611 borderColor 51612 } = attributes; 51613 51614 // Force inline styles to apply named border colors when themes do not load 51615 // their color stylesheets in the editor. 51616 if (borderColor) { 51617 const borderColorObject = getMultiOriginColor({ 51618 colors, 51619 namedColor: borderColor 51620 }); 51621 borderProps.style.borderColor = borderColorObject.color; 51622 } 51623 return borderProps; 51624 } 51625 51626 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/use-shadow-props.js 51627 /** 51628 * Internal dependencies 51629 */ 51630 51631 51632 // This utility is intended to assist where the serialization of the shadow 51633 // block support is being skipped for a block but the shadow related CSS classes 51634 // & styles still need to be generated so they can be applied to inner elements. 51635 51636 /** 51637 * Provides the CSS class names and inline styles for a block's shadow support 51638 * attributes. 51639 * 51640 * @param {Object} attributes Block attributes. 51641 * @return {Object} Shadow block support derived CSS classes & styles. 51642 */ 51643 function getShadowClassesAndStyles(attributes) { 51644 const shadow = attributes.style?.shadow || ''; 51645 return { 51646 style: getInlineStyles({ 51647 shadow 51648 }) 51649 }; 51650 } 51651 51652 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/use-color-props.js 51653 /** 51654 * External dependencies 51655 */ 51656 51657 51658 /** 51659 * WordPress dependencies 51660 */ 51661 51662 51663 /** 51664 * Internal dependencies 51665 */ 51666 51667 51668 51669 51670 51671 // The code in this file has largely been lifted from the color block support 51672 // hook. 51673 // 51674 // This utility is intended to assist where the serialization of the colors 51675 // block support is being skipped for a block but the color related CSS classes 51676 // & styles still need to be generated so they can be applied to inner elements. 51677 51678 /** 51679 * Provides the CSS class names and inline styles for a block's color support 51680 * attributes. 51681 * 51682 * @param {Object} attributes Block attributes. 51683 * 51684 * @return {Object} Color block support derived CSS classes & styles. 51685 */ 51686 function getColorClassesAndStyles(attributes) { 51687 const { 51688 backgroundColor, 51689 textColor, 51690 gradient, 51691 style 51692 } = attributes; 51693 51694 // Collect color CSS classes. 51695 const backgroundClass = getColorClassName('background-color', backgroundColor); 51696 const textClass = getColorClassName('color', textColor); 51697 const gradientClass = __experimentalGetGradientClass(gradient); 51698 const hasGradient = gradientClass || style?.color?.gradient; 51699 51700 // Determine color CSS class name list. 51701 const className = dist_clsx(textClass, gradientClass, { 51702 // Don't apply the background class if there's a gradient. 51703 [backgroundClass]: !hasGradient && !!backgroundClass, 51704 'has-text-color': textColor || style?.color?.text, 51705 'has-background': backgroundColor || style?.color?.background || gradient || style?.color?.gradient, 51706 'has-link-color': style?.elements?.link?.color 51707 }); 51708 51709 // Collect inline styles for colors. 51710 const colorStyles = style?.color || {}; 51711 const styleProp = getInlineStyles({ 51712 color: colorStyles 51713 }); 51714 return { 51715 className: className || undefined, 51716 style: styleProp 51717 }; 51718 } 51719 51720 /** 51721 * Determines the color related props for a block derived from its color block 51722 * support attributes. 51723 * 51724 * Inline styles are forced for named colors to ensure these selections are 51725 * reflected when themes do not load their color stylesheets in the editor. 51726 * 51727 * @param {Object} attributes Block attributes. 51728 * 51729 * @return {Object} ClassName & style props from colors block support. 51730 */ 51731 function useColorProps(attributes) { 51732 const { 51733 backgroundColor, 51734 textColor, 51735 gradient 51736 } = attributes; 51737 const [userPalette, themePalette, defaultPalette, userGradients, themeGradients, defaultGradients] = use_settings_useSettings('color.palette.custom', 'color.palette.theme', 'color.palette.default', 'color.gradients.custom', 'color.gradients.theme', 'color.gradients.default'); 51738 const colors = (0,external_wp_element_namespaceObject.useMemo)(() => [...(userPalette || []), ...(themePalette || []), ...(defaultPalette || [])], [userPalette, themePalette, defaultPalette]); 51739 const gradients = (0,external_wp_element_namespaceObject.useMemo)(() => [...(userGradients || []), ...(themeGradients || []), ...(defaultGradients || [])], [userGradients, themeGradients, defaultGradients]); 51740 const colorProps = getColorClassesAndStyles(attributes); 51741 51742 // Force inline styles to apply colors when themes do not load their color 51743 // stylesheets in the editor. 51744 if (backgroundColor) { 51745 const backgroundColorObject = getColorObjectByAttributeValues(colors, backgroundColor); 51746 colorProps.style.backgroundColor = backgroundColorObject.color; 51747 } 51748 if (gradient) { 51749 colorProps.style.background = getGradientValueBySlug(gradients, gradient); 51750 } 51751 if (textColor) { 51752 const textColorObject = getColorObjectByAttributeValues(colors, textColor); 51753 colorProps.style.color = textColorObject.color; 51754 } 51755 return colorProps; 51756 } 51757 51758 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/use-spacing-props.js 51759 /** 51760 * Internal dependencies 51761 */ 51762 51763 51764 // This utility is intended to assist where the serialization of the spacing 51765 // block support is being skipped for a block but the spacing related CSS 51766 // styles still need to be generated so they can be applied to inner elements. 51767 51768 /** 51769 * Provides the CSS class names and inline styles for a block's spacing support 51770 * attributes. 51771 * 51772 * @param {Object} attributes Block attributes. 51773 * 51774 * @return {Object} Spacing block support derived CSS classes & styles. 51775 */ 51776 function getSpacingClassesAndStyles(attributes) { 51777 const { 51778 style 51779 } = attributes; 51780 51781 // Collect inline styles for spacing. 51782 const spacingStyles = style?.spacing || {}; 51783 const styleProp = getInlineStyles({ 51784 spacing: spacingStyles 51785 }); 51786 return { 51787 style: styleProp 51788 }; 51789 } 51790 51791 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/use-typography-props.js 51792 /** 51793 * External dependencies 51794 */ 51795 51796 51797 /** 51798 * WordPress dependencies 51799 */ 51800 51801 51802 /** 51803 * Internal dependencies 51804 */ 51805 51806 51807 51808 51809 const { 51810 kebabCase: use_typography_props_kebabCase 51811 } = unlock(external_wp_components_namespaceObject.privateApis); 51812 51813 /* 51814 * This utility is intended to assist where the serialization of the typography 51815 * block support is being skipped for a block but the typography related CSS 51816 * styles still need to be generated so they can be applied to inner elements. 51817 */ 51818 /** 51819 * Provides the CSS class names and inline styles for a block's typography support 51820 * attributes. 51821 * 51822 * @param {Object} attributes Block attributes. 51823 * @param {Object|boolean} settings Merged theme.json settings 51824 * 51825 * @return {Object} Typography block support derived CSS classes & styles. 51826 */ 51827 function getTypographyClassesAndStyles(attributes, settings) { 51828 let typographyStyles = attributes?.style?.typography || {}; 51829 typographyStyles = { 51830 ...typographyStyles, 51831 fontSize: getTypographyFontSizeValue({ 51832 size: attributes?.style?.typography?.fontSize 51833 }, settings) 51834 }; 51835 const style = getInlineStyles({ 51836 typography: typographyStyles 51837 }); 51838 const fontFamilyClassName = !!attributes?.fontFamily ? `has-$use_typography_props_kebabCase(attributes.fontFamily)}-font-family` : ''; 51839 const textAlignClassName = !!attributes?.style?.typography?.textAlign ? `has-text-align-$attributes?.style?.typography?.textAlign}` : ''; 51840 const className = dist_clsx(fontFamilyClassName, textAlignClassName, getFontSizeClass(attributes?.fontSize)); 51841 return { 51842 className, 51843 style 51844 }; 51845 } 51846 51847 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/use-cached-truthy.js 51848 /** 51849 * WordPress dependencies 51850 */ 51851 51852 51853 /** 51854 * Keeps an up-to-date copy of the passed value and returns it. If value becomes falsy, it will return the last truthy copy. 51855 * 51856 * @param {any} value 51857 * @return {any} value 51858 */ 51859 function useCachedTruthy(value) { 51860 const [cachedValue, setCachedValue] = (0,external_wp_element_namespaceObject.useState)(value); 51861 (0,external_wp_element_namespaceObject.useEffect)(() => { 51862 if (value) { 51863 setCachedValue(value); 51864 } 51865 }, [value]); 51866 return cachedValue; 51867 } 51868 51869 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/index.js 51870 /** 51871 * Internal dependencies 51872 */ 51873 51874 51875 51876 51877 51878 51879 51880 51881 51882 51883 51884 51885 51886 51887 51888 51889 51890 51891 51892 51893 51894 51895 51896 51897 51898 51899 51900 51901 51902 createBlockEditFilter([align, text_align, hooks_anchor, custom_class_name, style, duotone, position, layout, content_lock_ui, block_hooks, block_bindings, layout_child].filter(Boolean)); 51903 createBlockListBlockFilter([align, text_align, background, style, color, dimensions, duotone, font_family, font_size, border, position, block_style_variation, layout_child]); 51904 createBlockSaveFilter([align, text_align, hooks_anchor, aria_label, custom_class_name, border, color, style, font_family, font_size]); 51905 51906 51907 51908 51909 51910 51911 51912 51913 51914 51915 51916 51917 51918 51919 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/colors/with-colors.js 51920 /** 51921 * WordPress dependencies 51922 */ 51923 51924 51925 51926 51927 /** 51928 * Internal dependencies 51929 */ 51930 51931 51932 51933 51934 const { 51935 kebabCase: with_colors_kebabCase 51936 } = unlock(external_wp_components_namespaceObject.privateApis); 51937 51938 /** 51939 * Capitalizes the first letter in a string. 51940 * 51941 * @param {string} str The string whose first letter the function will capitalize. 51942 * 51943 * @return {string} Capitalized string. 51944 */ 51945 const upperFirst = ([firstLetter, ...rest]) => firstLetter.toUpperCase() + rest.join(''); 51946 51947 /** 51948 * Higher order component factory for injecting the `colorsArray` argument as 51949 * the colors prop in the `withCustomColors` HOC. 51950 * 51951 * @param {Array} colorsArray An array of color objects. 51952 * 51953 * @return {Function} The higher order component. 51954 */ 51955 const withCustomColorPalette = colorsArray => (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(WrappedComponent => props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, { 51956 ...props, 51957 colors: colorsArray 51958 }), 'withCustomColorPalette'); 51959 51960 /** 51961 * Higher order component factory for injecting the editor colors as the 51962 * `colors` prop in the `withColors` HOC. 51963 * 51964 * @return {Function} The higher order component. 51965 */ 51966 const withEditorColorPalette = () => (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(WrappedComponent => props => { 51967 const [userPalette, themePalette, defaultPalette] = use_settings_useSettings('color.palette.custom', 'color.palette.theme', 'color.palette.default'); 51968 const allColors = (0,external_wp_element_namespaceObject.useMemo)(() => [...(userPalette || []), ...(themePalette || []), ...(defaultPalette || [])], [userPalette, themePalette, defaultPalette]); 51969 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, { 51970 ...props, 51971 colors: allColors 51972 }); 51973 }, 'withEditorColorPalette'); 51974 51975 /** 51976 * Helper function used with `createHigherOrderComponent` to create 51977 * higher order components for managing color logic. 51978 * 51979 * @param {Array} colorTypes An array of color types (e.g. 'backgroundColor, borderColor). 51980 * @param {Function} withColorPalette A HOC for injecting the 'colors' prop into the WrappedComponent. 51981 * 51982 * @return {Component} The component that can be used as a HOC. 51983 */ 51984 function createColorHOC(colorTypes, withColorPalette) { 51985 const colorMap = colorTypes.reduce((colorObject, colorType) => { 51986 return { 51987 ...colorObject, 51988 ...(typeof colorType === 'string' ? { 51989 [colorType]: with_colors_kebabCase(colorType) 51990 } : colorType) 51991 }; 51992 }, {}); 51993 return (0,external_wp_compose_namespaceObject.compose)([withColorPalette, WrappedComponent => { 51994 return class extends external_wp_element_namespaceObject.Component { 51995 constructor(props) { 51996 super(props); 51997 this.setters = this.createSetters(); 51998 this.colorUtils = { 51999 getMostReadableColor: this.getMostReadableColor.bind(this) 52000 }; 52001 this.state = {}; 52002 } 52003 getMostReadableColor(colorValue) { 52004 const { 52005 colors 52006 } = this.props; 52007 return getMostReadableColor(colors, colorValue); 52008 } 52009 createSetters() { 52010 return Object.keys(colorMap).reduce((settersAccumulator, colorAttributeName) => { 52011 const upperFirstColorAttributeName = upperFirst(colorAttributeName); 52012 const customColorAttributeName = `custom$upperFirstColorAttributeName}`; 52013 settersAccumulator[`set$upperFirstColorAttributeName}`] = this.createSetColor(colorAttributeName, customColorAttributeName); 52014 return settersAccumulator; 52015 }, {}); 52016 } 52017 createSetColor(colorAttributeName, customColorAttributeName) { 52018 return colorValue => { 52019 const colorObject = getColorObjectByColorValue(this.props.colors, colorValue); 52020 this.props.setAttributes({ 52021 [colorAttributeName]: colorObject && colorObject.slug ? colorObject.slug : undefined, 52022 [customColorAttributeName]: colorObject && colorObject.slug ? undefined : colorValue 52023 }); 52024 }; 52025 } 52026 static getDerivedStateFromProps({ 52027 attributes, 52028 colors 52029 }, previousState) { 52030 return Object.entries(colorMap).reduce((newState, [colorAttributeName, colorContext]) => { 52031 const colorObject = getColorObjectByAttributeValues(colors, attributes[colorAttributeName], attributes[`custom$upperFirst(colorAttributeName)}`]); 52032 const previousColorObject = previousState[colorAttributeName]; 52033 const previousColor = previousColorObject?.color; 52034 /** 52035 * The "and previousColorObject" condition checks that a previous color object was already computed. 52036 * At the start previousColorObject and colorValue are both equal to undefined 52037 * bus as previousColorObject does not exist we should compute the object. 52038 */ 52039 if (previousColor === colorObject.color && previousColorObject) { 52040 newState[colorAttributeName] = previousColorObject; 52041 } else { 52042 newState[colorAttributeName] = { 52043 ...colorObject, 52044 class: getColorClassName(colorContext, colorObject.slug) 52045 }; 52046 } 52047 return newState; 52048 }, {}); 52049 } 52050 render() { 52051 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, { 52052 ...this.props, 52053 colors: undefined, 52054 ...this.state, 52055 ...this.setters, 52056 colorUtils: this.colorUtils 52057 }); 52058 } 52059 }; 52060 }]); 52061 } 52062 52063 /** 52064 * A higher-order component factory for creating a 'withCustomColors' HOC, which handles color logic 52065 * for class generation color value, retrieval and color attribute setting. 52066 * 52067 * Use this higher-order component to work with a custom set of colors. 52068 * 52069 * @example 52070 * 52071 * ```jsx 52072 * const CUSTOM_COLORS = [ { name: 'Red', slug: 'red', color: '#ff0000' }, { name: 'Blue', slug: 'blue', color: '#0000ff' } ]; 52073 * const withCustomColors = createCustomColorsHOC( CUSTOM_COLORS ); 52074 * // ... 52075 * export default compose( 52076 * withCustomColors( 'backgroundColor', 'borderColor' ), 52077 * MyColorfulComponent, 52078 * ); 52079 * ``` 52080 * 52081 * @param {Array} colorsArray The array of color objects (name, slug, color, etc... ). 52082 * 52083 * @return {Function} Higher-order component. 52084 */ 52085 function createCustomColorsHOC(colorsArray) { 52086 return (...colorTypes) => { 52087 const withColorPalette = withCustomColorPalette(colorsArray); 52088 return (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(createColorHOC(colorTypes, withColorPalette), 'withCustomColors'); 52089 }; 52090 } 52091 52092 /** 52093 * A higher-order component, which handles color logic for class generation color value, retrieval and color attribute setting. 52094 * 52095 * For use with the default editor/theme color palette. 52096 * 52097 * @example 52098 * 52099 * ```jsx 52100 * export default compose( 52101 * withColors( 'backgroundColor', { textColor: 'color' } ), 52102 * MyColorfulComponent, 52103 * ); 52104 * ``` 52105 * 52106 * @param {...(Object|string)} colorTypes The arguments can be strings or objects. If the argument is an object, 52107 * it should contain the color attribute name as key and the color context as value. 52108 * If the argument is a string the value should be the color attribute name, 52109 * the color context is computed by applying a kebab case transform to the value. 52110 * Color context represents the context/place where the color is going to be used. 52111 * The class name of the color is generated using 'has' followed by the color name 52112 * and ending with the color context all in kebab case e.g: has-green-background-color. 52113 * 52114 * @return {Function} Higher-order component. 52115 */ 52116 function withColors(...colorTypes) { 52117 const withColorPalette = withEditorColorPalette(); 52118 return (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(createColorHOC(colorTypes, withColorPalette), 'withColors'); 52119 } 52120 52121 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/colors/index.js 52122 52123 52124 52125 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/gradients/index.js 52126 52127 52128 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/font-sizes/font-size-picker.js 52129 /** 52130 * WordPress dependencies 52131 */ 52132 52133 52134 /** 52135 * Internal dependencies 52136 */ 52137 52138 52139 function font_size_picker_FontSizePicker(props) { 52140 const [fontSizes, customFontSize] = use_settings_useSettings('typography.fontSizes', 'typography.customFontSize'); 52141 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FontSizePicker, { 52142 ...props, 52143 fontSizes: fontSizes, 52144 disableCustomFontSizes: !customFontSize 52145 }); 52146 } 52147 52148 /** 52149 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/font-sizes/README.md 52150 */ 52151 /* harmony default export */ const font_size_picker = (font_size_picker_FontSizePicker); 52152 52153 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/font-sizes/with-font-sizes.js 52154 /** 52155 * WordPress dependencies 52156 */ 52157 52158 52159 52160 /** 52161 * Internal dependencies 52162 */ 52163 52164 52165 52166 const DEFAULT_FONT_SIZES = []; 52167 52168 /** 52169 * Capitalizes the first letter in a string. 52170 * 52171 * @param {string} str The string whose first letter the function will capitalize. 52172 * 52173 * @return {string} Capitalized string. 52174 */ 52175 const with_font_sizes_upperFirst = ([firstLetter, ...rest]) => firstLetter.toUpperCase() + rest.join(''); 52176 52177 /** 52178 * Higher-order component, which handles font size logic for class generation, 52179 * font size value retrieval, and font size change handling. 52180 * 52181 * @param {...(Object|string)} fontSizeNames The arguments should all be strings. 52182 * Each string contains the font size 52183 * attribute name e.g: 'fontSize'. 52184 * 52185 * @return {Function} Higher-order component. 52186 */ 52187 /* harmony default export */ const with_font_sizes = ((...fontSizeNames) => { 52188 /* 52189 * Computes an object whose key is the font size attribute name as passed in the array, 52190 * and the value is the custom font size attribute name. 52191 * Custom font size is automatically compted by appending custom followed by the font size attribute name in with the first letter capitalized. 52192 */ 52193 const fontSizeAttributeNames = fontSizeNames.reduce((fontSizeAttributeNamesAccumulator, fontSizeAttributeName) => { 52194 fontSizeAttributeNamesAccumulator[fontSizeAttributeName] = `custom$with_font_sizes_upperFirst(fontSizeAttributeName)}`; 52195 return fontSizeAttributeNamesAccumulator; 52196 }, {}); 52197 return (0,external_wp_compose_namespaceObject.createHigherOrderComponent)((0,external_wp_compose_namespaceObject.compose)([(0,external_wp_compose_namespaceObject.createHigherOrderComponent)(WrappedComponent => props => { 52198 const [fontSizes] = use_settings_useSettings('typography.fontSizes'); 52199 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, { 52200 ...props, 52201 fontSizes: fontSizes || DEFAULT_FONT_SIZES 52202 }); 52203 }, 'withFontSizes'), WrappedComponent => { 52204 return class extends external_wp_element_namespaceObject.Component { 52205 constructor(props) { 52206 super(props); 52207 this.setters = this.createSetters(); 52208 this.state = {}; 52209 } 52210 createSetters() { 52211 return Object.entries(fontSizeAttributeNames).reduce((settersAccumulator, [fontSizeAttributeName, customFontSizeAttributeName]) => { 52212 const upperFirstFontSizeAttributeName = with_font_sizes_upperFirst(fontSizeAttributeName); 52213 settersAccumulator[`set$upperFirstFontSizeAttributeName}`] = this.createSetFontSize(fontSizeAttributeName, customFontSizeAttributeName); 52214 return settersAccumulator; 52215 }, {}); 52216 } 52217 createSetFontSize(fontSizeAttributeName, customFontSizeAttributeName) { 52218 return fontSizeValue => { 52219 const fontSizeObject = this.props.fontSizes?.find(({ 52220 size 52221 }) => size === Number(fontSizeValue)); 52222 this.props.setAttributes({ 52223 [fontSizeAttributeName]: fontSizeObject && fontSizeObject.slug ? fontSizeObject.slug : undefined, 52224 [customFontSizeAttributeName]: fontSizeObject && fontSizeObject.slug ? undefined : fontSizeValue 52225 }); 52226 }; 52227 } 52228 static getDerivedStateFromProps({ 52229 attributes, 52230 fontSizes 52231 }, previousState) { 52232 const didAttributesChange = (customFontSizeAttributeName, fontSizeAttributeName) => { 52233 if (previousState[fontSizeAttributeName]) { 52234 // If new font size is name compare with the previous slug. 52235 if (attributes[fontSizeAttributeName]) { 52236 return attributes[fontSizeAttributeName] !== previousState[fontSizeAttributeName].slug; 52237 } 52238 // If font size is not named, update when the font size value changes. 52239 return previousState[fontSizeAttributeName].size !== attributes[customFontSizeAttributeName]; 52240 } 52241 // In this case we need to build the font size object. 52242 return true; 52243 }; 52244 if (!Object.values(fontSizeAttributeNames).some(didAttributesChange)) { 52245 return null; 52246 } 52247 const newState = Object.entries(fontSizeAttributeNames).filter(([key, value]) => didAttributesChange(value, key)).reduce((newStateAccumulator, [fontSizeAttributeName, customFontSizeAttributeName]) => { 52248 const fontSizeAttributeValue = attributes[fontSizeAttributeName]; 52249 const fontSizeObject = utils_getFontSize(fontSizes, fontSizeAttributeValue, attributes[customFontSizeAttributeName]); 52250 newStateAccumulator[fontSizeAttributeName] = { 52251 ...fontSizeObject, 52252 class: getFontSizeClass(fontSizeAttributeValue) 52253 }; 52254 return newStateAccumulator; 52255 }, {}); 52256 return { 52257 ...previousState, 52258 ...newState 52259 }; 52260 } 52261 render() { 52262 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, { 52263 ...this.props, 52264 fontSizes: undefined, 52265 ...this.state, 52266 ...this.setters 52267 }); 52268 } 52269 }; 52270 }]), 'withFontSizes'); 52271 }); 52272 52273 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/font-sizes/index.js 52274 52275 52276 52277 52278 52279 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/autocompleters/block.js 52280 /** 52281 * WordPress dependencies 52282 */ 52283 52284 52285 52286 52287 /** 52288 * Internal dependencies 52289 */ 52290 52291 52292 52293 52294 52295 52296 52297 52298 52299 const block_noop = () => {}; 52300 const block_SHOWN_BLOCK_TYPES = 9; 52301 52302 /** @typedef {import('@wordpress/components').WPCompleter} WPCompleter */ 52303 52304 /** 52305 * Creates a blocks repeater for replacing the current block with a selected block type. 52306 * 52307 * @return {WPCompleter} A blocks completer. 52308 */ 52309 function createBlockCompleter() { 52310 return { 52311 name: 'blocks', 52312 className: 'block-editor-autocompleters__block', 52313 triggerPrefix: '/', 52314 useItems(filterValue) { 52315 const { 52316 rootClientId, 52317 selectedBlockName, 52318 prioritizedBlocks 52319 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 52320 const { 52321 getSelectedBlockClientId, 52322 getBlockName, 52323 getBlockListSettings, 52324 getBlockRootClientId 52325 } = select(store); 52326 const selectedBlockClientId = getSelectedBlockClientId(); 52327 const _rootClientId = getBlockRootClientId(selectedBlockClientId); 52328 return { 52329 selectedBlockName: selectedBlockClientId ? getBlockName(selectedBlockClientId) : null, 52330 rootClientId: _rootClientId, 52331 prioritizedBlocks: getBlockListSettings(_rootClientId)?.prioritizedInserterBlocks 52332 }; 52333 }, []); 52334 const [items, categories, collections] = use_block_types_state(rootClientId, block_noop, true); 52335 const filteredItems = (0,external_wp_element_namespaceObject.useMemo)(() => { 52336 const initialFilteredItems = !!filterValue.trim() ? searchBlockItems(items, categories, collections, filterValue) : orderInserterBlockItems(orderBy(items, 'frecency', 'desc'), prioritizedBlocks); 52337 return initialFilteredItems.filter(item => item.name !== selectedBlockName).slice(0, block_SHOWN_BLOCK_TYPES); 52338 }, [filterValue, selectedBlockName, items, categories, collections, prioritizedBlocks]); 52339 const options = (0,external_wp_element_namespaceObject.useMemo)(() => filteredItems.map(blockItem => { 52340 const { 52341 title, 52342 icon, 52343 isDisabled 52344 } = blockItem; 52345 return { 52346 key: `block-$blockItem.id}`, 52347 value: blockItem, 52348 label: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 52349 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 52350 icon: icon, 52351 showColors: true 52352 }, "icon"), title] 52353 }), 52354 isDisabled 52355 }; 52356 }), [filteredItems]); 52357 return [options]; 52358 }, 52359 allowContext(before, after) { 52360 return !(/\S/.test(before) || /\S/.test(after)); 52361 }, 52362 getOptionCompletion(inserterItem) { 52363 const { 52364 name, 52365 initialAttributes, 52366 innerBlocks, 52367 syncStatus, 52368 content 52369 } = inserterItem; 52370 return { 52371 action: 'replace', 52372 value: syncStatus === 'unsynced' ? (0,external_wp_blocks_namespaceObject.parse)(content, { 52373 __unstableSkipMigrationLogs: true 52374 }) : (0,external_wp_blocks_namespaceObject.createBlock)(name, initialAttributes, (0,external_wp_blocks_namespaceObject.createBlocksFromInnerBlocksTemplate)(innerBlocks)) 52375 }; 52376 } 52377 }; 52378 } 52379 52380 /** 52381 * Creates a blocks repeater for replacing the current block with a selected block type. 52382 * 52383 * @return {WPCompleter} A blocks completer. 52384 */ 52385 /* harmony default export */ const autocompleters_block = (createBlockCompleter()); 52386 52387 ;// CONCATENATED MODULE: external ["wp","apiFetch"] 52388 const external_wp_apiFetch_namespaceObject = window["wp"]["apiFetch"]; 52389 var external_wp_apiFetch_default = /*#__PURE__*/__webpack_require__.n(external_wp_apiFetch_namespaceObject); 52390 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/post.js 52391 /** 52392 * WordPress dependencies 52393 */ 52394 52395 52396 const post = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 52397 xmlns: "http://www.w3.org/2000/svg", 52398 viewBox: "0 0 24 24", 52399 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 52400 d: "m7.3 9.7 1.4 1.4c.2-.2.3-.3.4-.5 0 0 0-.1.1-.1.3-.5.4-1.1.3-1.6L12 7 9 4 7.2 6.5c-.6-.1-1.1 0-1.6.3 0 0-.1 0-.1.1-.3.1-.4.2-.6.4l1.4 1.4L4 11v1h1l2.3-2.3zM4 20h9v-1.5H4V20zm0-5.5V16h16v-1.5H4z" 52401 }) 52402 }); 52403 /* harmony default export */ const library_post = (post); 52404 52405 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/autocompleters/link.js 52406 /** 52407 * WordPress dependencies 52408 */ 52409 // Disable Reason: Needs to be refactored. 52410 // eslint-disable-next-line no-restricted-imports 52411 52412 52413 52414 52415 52416 52417 const SHOWN_SUGGESTIONS = 10; 52418 52419 /** @typedef {import('@wordpress/components').WPCompleter} WPCompleter */ 52420 52421 /** 52422 * Creates a suggestion list for links to posts or pages. 52423 * 52424 * @return {WPCompleter} A links completer. 52425 */ 52426 function createLinkCompleter() { 52427 return { 52428 name: 'links', 52429 className: 'block-editor-autocompleters__link', 52430 triggerPrefix: '[[', 52431 options: async letters => { 52432 let options = await external_wp_apiFetch_default()({ 52433 path: (0,external_wp_url_namespaceObject.addQueryArgs)('/wp/v2/search', { 52434 per_page: SHOWN_SUGGESTIONS, 52435 search: letters, 52436 type: 'post', 52437 order_by: 'menu_order' 52438 }) 52439 }); 52440 options = options.filter(option => option.title !== ''); 52441 return options; 52442 }, 52443 getOptionKeywords(item) { 52444 const expansionWords = item.title.split(/\s+/); 52445 return [...expansionWords]; 52446 }, 52447 getOptionLabel(item) { 52448 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 52449 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 52450 icon: item.subtype === 'page' ? library_page : library_post 52451 }, "icon"), item.title] 52452 }); 52453 }, 52454 getOptionCompletion(item) { 52455 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("a", { 52456 href: item.url, 52457 children: item.title 52458 }); 52459 } 52460 }; 52461 } 52462 52463 /** 52464 * Creates a suggestion list for links to posts or pages.. 52465 * 52466 * @return {WPCompleter} A link completer. 52467 */ 52468 /* harmony default export */ const autocompleters_link = (createLinkCompleter()); 52469 52470 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/autocomplete/index.js 52471 /** 52472 * WordPress dependencies 52473 */ 52474 52475 52476 52477 52478 52479 /** 52480 * Internal dependencies 52481 */ 52482 52483 52484 52485 52486 /** 52487 * Shared reference to an empty array for cases where it is important to avoid 52488 * returning a new array reference on every invocation. 52489 * 52490 * @type {Array} 52491 */ 52492 52493 const autocomplete_EMPTY_ARRAY = []; 52494 function useCompleters({ 52495 completers = autocomplete_EMPTY_ARRAY 52496 }) { 52497 const { 52498 name 52499 } = useBlockEditContext(); 52500 return (0,external_wp_element_namespaceObject.useMemo)(() => { 52501 let filteredCompleters = [...completers, autocompleters_link]; 52502 if (name === (0,external_wp_blocks_namespaceObject.getDefaultBlockName)() || (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, '__experimentalSlashInserter', false)) { 52503 filteredCompleters = [...filteredCompleters, autocompleters_block]; 52504 } 52505 if ((0,external_wp_hooks_namespaceObject.hasFilter)('editor.Autocomplete.completers')) { 52506 // Provide copies so filters may directly modify them. 52507 if (filteredCompleters === completers) { 52508 filteredCompleters = filteredCompleters.map(completer => ({ 52509 ...completer 52510 })); 52511 } 52512 filteredCompleters = (0,external_wp_hooks_namespaceObject.applyFilters)('editor.Autocomplete.completers', filteredCompleters, name); 52513 } 52514 return filteredCompleters; 52515 }, [completers, name]); 52516 } 52517 function useBlockEditorAutocompleteProps(props) { 52518 return (0,external_wp_components_namespaceObject.__unstableUseAutocompleteProps)({ 52519 ...props, 52520 completers: useCompleters(props) 52521 }); 52522 } 52523 52524 /** 52525 * Wrap the default Autocomplete component with one that supports a filter hook 52526 * for customizing its list of autocompleters. 52527 * 52528 * @type {import('react').FC} 52529 */ 52530 function BlockEditorAutocomplete(props) { 52531 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Autocomplete, { 52532 ...props, 52533 completers: useCompleters(props) 52534 }); 52535 } 52536 52537 /** 52538 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/autocomplete/README.md 52539 */ 52540 /* harmony default export */ const autocomplete = (BlockEditorAutocomplete); 52541 52542 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/fullscreen.js 52543 /** 52544 * WordPress dependencies 52545 */ 52546 52547 52548 const fullscreen = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 52549 xmlns: "http://www.w3.org/2000/svg", 52550 viewBox: "0 0 24 24", 52551 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 52552 d: "M6 4a2 2 0 0 0-2 2v3h1.5V6a.5.5 0 0 1 .5-.5h3V4H6Zm3 14.5H6a.5.5 0 0 1-.5-.5v-3H4v3a2 2 0 0 0 2 2h3v-1.5Zm6 1.5v-1.5h3a.5.5 0 0 0 .5-.5v-3H20v3a2 2 0 0 1-2 2h-3Zm3-16a2 2 0 0 1 2 2v3h-1.5V6a.5.5 0 0 0-.5-.5h-3V4h3Z" 52553 }) 52554 }); 52555 /* harmony default export */ const library_fullscreen = (fullscreen); 52556 52557 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-full-height-alignment-control/index.js 52558 /** 52559 * WordPress dependencies 52560 */ 52561 52562 52563 52564 52565 function BlockFullHeightAlignmentControl({ 52566 isActive, 52567 label = (0,external_wp_i18n_namespaceObject.__)('Toggle full height'), 52568 onToggle, 52569 isDisabled 52570 }) { 52571 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 52572 isActive: isActive, 52573 icon: library_fullscreen, 52574 label: label, 52575 onClick: () => onToggle(!isActive), 52576 disabled: isDisabled 52577 }); 52578 } 52579 /* harmony default export */ const block_full_height_alignment_control = (BlockFullHeightAlignmentControl); 52580 52581 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-alignment-matrix-control/index.js 52582 /** 52583 * WordPress dependencies 52584 */ 52585 52586 52587 52588 52589 const block_alignment_matrix_control_noop = () => {}; 52590 function BlockAlignmentMatrixControl(props) { 52591 const { 52592 label = (0,external_wp_i18n_namespaceObject.__)('Change matrix alignment'), 52593 onChange = block_alignment_matrix_control_noop, 52594 value = 'center', 52595 isDisabled 52596 } = props; 52597 const icon = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.AlignmentMatrixControl.Icon, { 52598 value: value 52599 }); 52600 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 52601 popoverProps: { 52602 placement: 'bottom-start' 52603 }, 52604 renderToggle: ({ 52605 onToggle, 52606 isOpen 52607 }) => { 52608 const openOnArrowDown = event => { 52609 if (!isOpen && event.keyCode === external_wp_keycodes_namespaceObject.DOWN) { 52610 event.preventDefault(); 52611 onToggle(); 52612 } 52613 }; 52614 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 52615 onClick: onToggle, 52616 "aria-haspopup": "true", 52617 "aria-expanded": isOpen, 52618 onKeyDown: openOnArrowDown, 52619 label: label, 52620 icon: icon, 52621 showTooltip: true, 52622 disabled: isDisabled 52623 }); 52624 }, 52625 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.AlignmentMatrixControl, { 52626 hasFocusBorder: false, 52627 onChange: onChange, 52628 value: value 52629 }) 52630 }); 52631 } 52632 /* harmony default export */ const block_alignment_matrix_control = (BlockAlignmentMatrixControl); 52633 52634 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-title/use-block-display-title.js 52635 /** 52636 * WordPress dependencies 52637 */ 52638 52639 52640 52641 /** 52642 * Internal dependencies 52643 */ 52644 52645 52646 /** 52647 * Returns the block's configured title as a string, or empty if the title 52648 * cannot be determined. 52649 * 52650 * @example 52651 * 52652 * ```js 52653 * useBlockDisplayTitle( { clientId: 'afd1cb17-2c08-4e7a-91be-007ba7ddc3a1', maximumLength: 17 } ); 52654 * ``` 52655 * 52656 * @param {Object} props 52657 * @param {string} props.clientId Client ID of block. 52658 * @param {number|undefined} props.maximumLength The maximum length that the block title string may be before truncated. 52659 * @param {string|undefined} props.context The context to pass to `getBlockLabel`. 52660 * @return {?string} Block title. 52661 */ 52662 function useBlockDisplayTitle({ 52663 clientId, 52664 maximumLength, 52665 context 52666 }) { 52667 const blockTitle = (0,external_wp_data_namespaceObject.useSelect)(select => { 52668 if (!clientId) { 52669 return null; 52670 } 52671 const { 52672 getBlockName, 52673 getBlockAttributes 52674 } = select(store); 52675 const { 52676 getBlockType, 52677 getActiveBlockVariation 52678 } = select(external_wp_blocks_namespaceObject.store); 52679 const blockName = getBlockName(clientId); 52680 const blockType = getBlockType(blockName); 52681 if (!blockType) { 52682 return null; 52683 } 52684 const attributes = getBlockAttributes(clientId); 52685 const label = (0,external_wp_blocks_namespaceObject.__experimentalGetBlockLabel)(blockType, attributes, context); 52686 // If the label is defined we prioritize it over a possible block variation title match. 52687 if (label !== blockType.title) { 52688 return label; 52689 } 52690 const match = getActiveBlockVariation(blockName, attributes); 52691 // Label will fallback to the title if no label is defined for the current label context. 52692 return match?.title || blockType.title; 52693 }, [clientId, context]); 52694 if (!blockTitle) { 52695 return null; 52696 } 52697 if (maximumLength && maximumLength > 0 && blockTitle.length > maximumLength) { 52698 const omission = '...'; 52699 return blockTitle.slice(0, maximumLength - omission.length) + omission; 52700 } 52701 return blockTitle; 52702 } 52703 52704 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-title/index.js 52705 /** 52706 * Internal dependencies 52707 */ 52708 52709 52710 52711 /** 52712 * Renders the block's configured title as a string, or empty if the title 52713 * cannot be determined. 52714 * 52715 * @example 52716 * 52717 * ```jsx 52718 * <BlockTitle clientId="afd1cb17-2c08-4e7a-91be-007ba7ddc3a1" maximumLength={ 17 }/> 52719 * ``` 52720 * 52721 * @param {Object} props 52722 * @param {string} props.clientId Client ID of block. 52723 * @param {number|undefined} props.maximumLength The maximum length that the block title string may be before truncated. 52724 * @param {string|undefined} props.context The context to pass to `getBlockLabel`. 52725 * 52726 * @return {JSX.Element} Block title. 52727 */ 52728 function BlockTitle({ 52729 clientId, 52730 maximumLength, 52731 context 52732 }) { 52733 return useBlockDisplayTitle({ 52734 clientId, 52735 maximumLength, 52736 context 52737 }); 52738 } 52739 52740 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/get-editor-region.js 52741 /** 52742 * Gets the editor region for a given editor canvas element or 52743 * returns the passed element if no region is found 52744 * 52745 * @param { Object } editor The editor canvas element. 52746 * @return { Object } The editor region or given editor element 52747 */ 52748 function getEditorRegion(editor) { 52749 var _Array$from$find, _editorCanvas$closest; 52750 if (!editor) { 52751 return null; 52752 } 52753 52754 // If there are multiple editors, we need to find the iframe that contains our contentRef to make sure 52755 // we're focusing the region that contains this editor. 52756 const editorCanvas = (_Array$from$find = Array.from(document.querySelectorAll('iframe[name="editor-canvas"]').values()).find(iframe => { 52757 // Find the iframe that contains our contentRef 52758 const iframeDocument = iframe.contentDocument || iframe.contentWindow.document; 52759 return iframeDocument === editor.ownerDocument; 52760 })) !== null && _Array$from$find !== void 0 ? _Array$from$find : editor; 52761 52762 // The region is provided by the editor, not the block-editor. 52763 // We should send focus to the region if one is available to reuse the 52764 // same interface for navigating landmarks. If no region is available, 52765 // use the canvas instead. 52766 return (_editorCanvas$closest = editorCanvas?.closest('[role="region"]')) !== null && _editorCanvas$closest !== void 0 ? _editorCanvas$closest : editorCanvas; 52767 } 52768 52769 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-breadcrumb/index.js 52770 /** 52771 * WordPress dependencies 52772 */ 52773 52774 52775 52776 52777 52778 52779 /** 52780 * Internal dependencies 52781 */ 52782 52783 52784 52785 52786 52787 52788 /** 52789 * Block breadcrumb component, displaying the hierarchy of the current block selection as a breadcrumb. 52790 * 52791 * @param {Object} props Component props. 52792 * @param {string} props.rootLabelText Translated label for the root element of the breadcrumb trail. 52793 * @return {Element} Block Breadcrumb. 52794 */ 52795 52796 52797 function BlockBreadcrumb({ 52798 rootLabelText 52799 }) { 52800 const { 52801 selectBlock, 52802 clearSelectedBlock 52803 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 52804 const { 52805 clientId, 52806 parents, 52807 hasSelection 52808 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 52809 const { 52810 getSelectionStart, 52811 getSelectedBlockClientId, 52812 getEnabledBlockParents 52813 } = unlock(select(store)); 52814 const selectedBlockClientId = getSelectedBlockClientId(); 52815 return { 52816 parents: getEnabledBlockParents(selectedBlockClientId), 52817 clientId: selectedBlockClientId, 52818 hasSelection: !!getSelectionStart().clientId 52819 }; 52820 }, []); 52821 const rootLabel = rootLabelText || (0,external_wp_i18n_namespaceObject.__)('Document'); 52822 52823 // We don't care about this specific ref, but this is a way 52824 // to get a ref within the editor canvas so we can focus it later. 52825 const blockRef = (0,external_wp_element_namespaceObject.useRef)(); 52826 useBlockElementRef(clientId, blockRef); 52827 52828 /* 52829 * Disable reason: The `list` ARIA role is redundant but 52830 * Safari+VoiceOver won't announce the list otherwise. 52831 */ 52832 /* eslint-disable jsx-a11y/no-redundant-roles */ 52833 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("ul", { 52834 className: "block-editor-block-breadcrumb", 52835 role: "list", 52836 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Block breadcrumb'), 52837 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", { 52838 className: !hasSelection ? 'block-editor-block-breadcrumb__current' : undefined, 52839 "aria-current": !hasSelection ? 'true' : undefined, 52840 children: [hasSelection && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 52841 size: "small", 52842 className: "block-editor-block-breadcrumb__button", 52843 onClick: () => { 52844 // Find the block editor wrapper for the selected block 52845 const blockEditor = blockRef.current?.closest('.editor-styles-wrapper'); 52846 clearSelectedBlock(); 52847 getEditorRegion(blockEditor)?.focus(); 52848 }, 52849 children: rootLabel 52850 }), !hasSelection && rootLabel, !!clientId && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 52851 icon: chevron_right_small, 52852 className: "block-editor-block-breadcrumb__separator" 52853 })] 52854 }), parents.map(parentClientId => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", { 52855 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 52856 size: "small", 52857 className: "block-editor-block-breadcrumb__button", 52858 onClick: () => selectBlock(parentClientId), 52859 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTitle, { 52860 clientId: parentClientId, 52861 maximumLength: 35 52862 }) 52863 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 52864 icon: chevron_right_small, 52865 className: "block-editor-block-breadcrumb__separator" 52866 })] 52867 }, parentClientId)), !!clientId && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("li", { 52868 className: "block-editor-block-breadcrumb__current", 52869 "aria-current": "true", 52870 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTitle, { 52871 clientId: clientId, 52872 maximumLength: 35 52873 }) 52874 })] 52875 }) 52876 /* eslint-enable jsx-a11y/no-redundant-roles */; 52877 } 52878 /* harmony default export */ const block_breadcrumb = (BlockBreadcrumb); 52879 52880 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-content-overlay/index.js 52881 /** 52882 * WordPress dependencies 52883 */ 52884 52885 52886 /** 52887 * Internal dependencies 52888 */ 52889 52890 function useBlockOverlayActive(clientId) { 52891 return (0,external_wp_data_namespaceObject.useSelect)(select => { 52892 const { 52893 __unstableHasActiveBlockOverlayActive 52894 } = select(store); 52895 return __unstableHasActiveBlockOverlayActive(clientId); 52896 }, [clientId]); 52897 } 52898 52899 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/use-block-toolbar-popover-props.js 52900 /** 52901 * WordPress dependencies 52902 */ 52903 52904 52905 52906 52907 52908 /** 52909 * Internal dependencies 52910 */ 52911 52912 52913 52914 52915 const COMMON_PROPS = { 52916 placement: 'top-start' 52917 }; 52918 52919 // By default the toolbar sets the `shift` prop. If the user scrolls the page 52920 // down the toolbar will stay on screen by adopting a sticky position at the 52921 // top of the viewport. 52922 const DEFAULT_PROPS = { 52923 ...COMMON_PROPS, 52924 flip: false, 52925 shift: true 52926 }; 52927 52928 // When there isn't enough height between the top of the block and the editor 52929 // canvas, the `shift` prop is set to `false`, as it will cause the block to be 52930 // obscured. The `flip` behavior is enabled, which positions the toolbar below 52931 // the block. This only happens if the block is smaller than the viewport, as 52932 // otherwise the toolbar will be off-screen. 52933 const RESTRICTED_HEIGHT_PROPS = { 52934 ...COMMON_PROPS, 52935 flip: true, 52936 shift: false 52937 }; 52938 52939 /** 52940 * Get the popover props for the block toolbar, determined by the space at the top of the canvas and the toolbar height. 52941 * 52942 * @param {Element} contentElement The DOM element that represents the editor content or canvas. 52943 * @param {Element} selectedBlockElement The outer DOM element of the first selected block. 52944 * @param {Element} scrollContainer The scrollable container for the contentElement. 52945 * @param {number} toolbarHeight The height of the toolbar in pixels. 52946 * @param {boolean} isSticky Whether or not the selected block is sticky or fixed. 52947 * 52948 * @return {Object} The popover props used to determine the position of the toolbar. 52949 */ 52950 function getProps(contentElement, selectedBlockElement, scrollContainer, toolbarHeight, isSticky) { 52951 if (!contentElement || !selectedBlockElement) { 52952 return DEFAULT_PROPS; 52953 } 52954 52955 // Get how far the content area has been scrolled. 52956 const scrollTop = scrollContainer?.scrollTop || 0; 52957 const blockRect = getElementBounds(selectedBlockElement); 52958 const contentRect = contentElement.getBoundingClientRect(); 52959 52960 // Get the vertical position of top of the visible content area. 52961 const topOfContentElementInViewport = scrollTop + contentRect.top; 52962 52963 // The document element's clientHeight represents the viewport height. 52964 const viewportHeight = contentElement.ownerDocument.documentElement.clientHeight; 52965 52966 // The restricted height area is calculated as the sum of the 52967 // vertical position of the visible content area, plus the height 52968 // of the block toolbar. 52969 const restrictedTopArea = topOfContentElementInViewport + toolbarHeight; 52970 const hasSpaceForToolbarAbove = blockRect.top > restrictedTopArea; 52971 const isBlockTallerThanViewport = blockRect.height > viewportHeight - toolbarHeight; 52972 52973 // Sticky blocks are treated as if they will never have enough space for the toolbar above. 52974 if (!isSticky && (hasSpaceForToolbarAbove || isBlockTallerThanViewport)) { 52975 return DEFAULT_PROPS; 52976 } 52977 return RESTRICTED_HEIGHT_PROPS; 52978 } 52979 52980 /** 52981 * Determines the desired popover positioning behavior, returning a set of appropriate props. 52982 * 52983 * @param {Object} elements 52984 * @param {Element} elements.contentElement The DOM element that represents the editor content or canvas. 52985 * @param {string} elements.clientId The clientId of the first selected block. 52986 * 52987 * @return {Object} The popover props used to determine the position of the toolbar. 52988 */ 52989 function useBlockToolbarPopoverProps({ 52990 contentElement, 52991 clientId 52992 }) { 52993 const selectedBlockElement = useBlockElement(clientId); 52994 const [toolbarHeight, setToolbarHeight] = (0,external_wp_element_namespaceObject.useState)(0); 52995 const { 52996 blockIndex, 52997 isSticky 52998 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 52999 const { 53000 getBlockIndex, 53001 getBlockAttributes 53002 } = select(store); 53003 return { 53004 blockIndex: getBlockIndex(clientId), 53005 isSticky: hasStickyOrFixedPositionValue(getBlockAttributes(clientId)) 53006 }; 53007 }, [clientId]); 53008 const scrollContainer = (0,external_wp_element_namespaceObject.useMemo)(() => { 53009 if (!contentElement) { 53010 return; 53011 } 53012 return (0,external_wp_dom_namespaceObject.getScrollContainer)(contentElement); 53013 }, [contentElement]); 53014 const [props, setProps] = (0,external_wp_element_namespaceObject.useState)(() => getProps(contentElement, selectedBlockElement, scrollContainer, toolbarHeight, isSticky)); 53015 const popoverRef = (0,external_wp_compose_namespaceObject.useRefEffect)(popoverNode => { 53016 setToolbarHeight(popoverNode.offsetHeight); 53017 }, []); 53018 const updateProps = (0,external_wp_element_namespaceObject.useCallback)(() => setProps(getProps(contentElement, selectedBlockElement, scrollContainer, toolbarHeight, isSticky)), [contentElement, selectedBlockElement, scrollContainer, toolbarHeight]); 53019 53020 // Update props when the block is moved. This also ensures the props are 53021 // correct on initial mount, and when the selected block or content element 53022 // changes (since the callback ref will update). 53023 (0,external_wp_element_namespaceObject.useLayoutEffect)(updateProps, [blockIndex, updateProps]); 53024 53025 // Update props when the viewport is resized or the block is resized. 53026 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 53027 if (!contentElement || !selectedBlockElement) { 53028 return; 53029 } 53030 53031 // Update the toolbar props on viewport resize. 53032 const contentView = contentElement?.ownerDocument?.defaultView; 53033 contentView?.addEventHandler?.('resize', updateProps); 53034 53035 // Update the toolbar props on block resize. 53036 let resizeObserver; 53037 const blockView = selectedBlockElement?.ownerDocument?.defaultView; 53038 if (blockView.ResizeObserver) { 53039 resizeObserver = new blockView.ResizeObserver(updateProps); 53040 resizeObserver.observe(selectedBlockElement); 53041 } 53042 return () => { 53043 contentView?.removeEventHandler?.('resize', updateProps); 53044 if (resizeObserver) { 53045 resizeObserver.disconnect(); 53046 } 53047 }; 53048 }, [updateProps, contentElement, selectedBlockElement]); 53049 return { 53050 ...props, 53051 ref: popoverRef 53052 }; 53053 } 53054 53055 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/use-selected-block-tool-props.js 53056 /** 53057 * WordPress dependencies 53058 */ 53059 53060 53061 /** 53062 * Internal dependencies 53063 */ 53064 53065 53066 /** 53067 * Returns props for the selected block tools and empty block inserter. 53068 * 53069 * @param {string} clientId Selected block client ID. 53070 */ 53071 function useSelectedBlockToolProps(clientId) { 53072 const selectedBlockProps = (0,external_wp_data_namespaceObject.useSelect)(select => { 53073 const { 53074 getBlockRootClientId, 53075 getBlockParents, 53076 __experimentalGetBlockListSettingsForBlocks, 53077 isBlockInsertionPointVisible, 53078 getBlockInsertionPoint, 53079 getBlockOrder, 53080 hasMultiSelection, 53081 getLastMultiSelectedBlockClientId 53082 } = select(store); 53083 const blockParentsClientIds = getBlockParents(clientId); 53084 53085 // Get Block List Settings for all ancestors of the current Block clientId. 53086 const parentBlockListSettings = __experimentalGetBlockListSettingsForBlocks(blockParentsClientIds); 53087 53088 // Get the clientId of the topmost parent with the capture toolbars setting. 53089 const capturingClientId = blockParentsClientIds.find(parentClientId => parentBlockListSettings[parentClientId]?.__experimentalCaptureToolbars); 53090 let isInsertionPointVisible = false; 53091 if (isBlockInsertionPointVisible()) { 53092 const insertionPoint = getBlockInsertionPoint(); 53093 const order = getBlockOrder(insertionPoint.rootClientId); 53094 isInsertionPointVisible = order[insertionPoint.index] === clientId; 53095 } 53096 return { 53097 capturingClientId, 53098 isInsertionPointVisible, 53099 lastClientId: hasMultiSelection() ? getLastMultiSelectedBlockClientId() : null, 53100 rootClientId: getBlockRootClientId(clientId) 53101 }; 53102 }, [clientId]); 53103 return selectedBlockProps; 53104 } 53105 53106 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/empty-block-inserter.js 53107 /** 53108 * External dependencies 53109 */ 53110 53111 53112 /** 53113 * Internal dependencies 53114 */ 53115 53116 53117 53118 53119 53120 function EmptyBlockInserter({ 53121 clientId, 53122 __unstableContentRef 53123 }) { 53124 const { 53125 capturingClientId, 53126 isInsertionPointVisible, 53127 lastClientId, 53128 rootClientId 53129 } = useSelectedBlockToolProps(clientId); 53130 const popoverProps = useBlockToolbarPopoverProps({ 53131 contentElement: __unstableContentRef?.current, 53132 clientId 53133 }); 53134 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cover, { 53135 clientId: capturingClientId || clientId, 53136 bottomClientId: lastClientId, 53137 className: dist_clsx('block-editor-block-list__block-side-inserter-popover', { 53138 'is-insertion-point-visible': isInsertionPointVisible 53139 }), 53140 __unstableContentRef: __unstableContentRef, 53141 ...popoverProps, 53142 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 53143 className: "block-editor-block-list__empty-block-inserter", 53144 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter, { 53145 position: "bottom right", 53146 rootClientId: rootClientId, 53147 clientId: clientId, 53148 __experimentalIsQuick: true 53149 }) 53150 }) 53151 }); 53152 } 53153 53154 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-draggable/use-scroll-when-dragging.js 53155 /** 53156 * WordPress dependencies 53157 */ 53158 53159 53160 const SCROLL_INACTIVE_DISTANCE_PX = 50; 53161 const SCROLL_INTERVAL_MS = 25; 53162 const PIXELS_PER_SECOND_PER_PERCENTAGE = 1000; 53163 const VELOCITY_MULTIPLIER = PIXELS_PER_SECOND_PER_PERCENTAGE * (SCROLL_INTERVAL_MS / 1000); 53164 53165 /** 53166 * React hook that scrolls the scroll container when a block is being dragged. 53167 * 53168 * @return {Function[]} `startScrolling`, `scrollOnDragOver`, `stopScrolling` 53169 * functions to be called in `onDragStart`, `onDragOver` 53170 * and `onDragEnd` events respectively. 53171 */ 53172 function useScrollWhenDragging() { 53173 const dragStartYRef = (0,external_wp_element_namespaceObject.useRef)(null); 53174 const velocityYRef = (0,external_wp_element_namespaceObject.useRef)(null); 53175 const scrollParentYRef = (0,external_wp_element_namespaceObject.useRef)(null); 53176 const scrollEditorIntervalRef = (0,external_wp_element_namespaceObject.useRef)(null); 53177 53178 // Clear interval when unmounting. 53179 (0,external_wp_element_namespaceObject.useEffect)(() => () => { 53180 if (scrollEditorIntervalRef.current) { 53181 clearInterval(scrollEditorIntervalRef.current); 53182 scrollEditorIntervalRef.current = null; 53183 } 53184 }, []); 53185 const startScrolling = (0,external_wp_element_namespaceObject.useCallback)(event => { 53186 dragStartYRef.current = event.clientY; 53187 53188 // Find nearest parent(s) to scroll. 53189 scrollParentYRef.current = (0,external_wp_dom_namespaceObject.getScrollContainer)(event.target); 53190 scrollEditorIntervalRef.current = setInterval(() => { 53191 if (scrollParentYRef.current && velocityYRef.current) { 53192 const newTop = scrollParentYRef.current.scrollTop + velocityYRef.current; 53193 53194 // Setting `behavior: 'smooth'` as a scroll property seems to hurt performance. 53195 // Better to use a small scroll interval. 53196 scrollParentYRef.current.scroll({ 53197 top: newTop 53198 }); 53199 } 53200 }, SCROLL_INTERVAL_MS); 53201 }, []); 53202 const scrollOnDragOver = (0,external_wp_element_namespaceObject.useCallback)(event => { 53203 if (!scrollParentYRef.current) { 53204 return; 53205 } 53206 const scrollParentHeight = scrollParentYRef.current.offsetHeight; 53207 const offsetDragStartPosition = dragStartYRef.current - scrollParentYRef.current.offsetTop; 53208 const offsetDragPosition = event.clientY - scrollParentYRef.current.offsetTop; 53209 if (event.clientY > offsetDragStartPosition) { 53210 // User is dragging downwards. 53211 const moveableDistance = Math.max(scrollParentHeight - offsetDragStartPosition - SCROLL_INACTIVE_DISTANCE_PX, 0); 53212 const dragDistance = Math.max(offsetDragPosition - offsetDragStartPosition - SCROLL_INACTIVE_DISTANCE_PX, 0); 53213 const distancePercentage = moveableDistance === 0 || dragDistance === 0 ? 0 : dragDistance / moveableDistance; 53214 velocityYRef.current = VELOCITY_MULTIPLIER * distancePercentage; 53215 } else if (event.clientY < offsetDragStartPosition) { 53216 // User is dragging upwards. 53217 const moveableDistance = Math.max(offsetDragStartPosition - SCROLL_INACTIVE_DISTANCE_PX, 0); 53218 const dragDistance = Math.max(offsetDragStartPosition - offsetDragPosition - SCROLL_INACTIVE_DISTANCE_PX, 0); 53219 const distancePercentage = moveableDistance === 0 || dragDistance === 0 ? 0 : dragDistance / moveableDistance; 53220 velocityYRef.current = -VELOCITY_MULTIPLIER * distancePercentage; 53221 } else { 53222 velocityYRef.current = 0; 53223 } 53224 }, []); 53225 const stopScrolling = () => { 53226 dragStartYRef.current = null; 53227 scrollParentYRef.current = null; 53228 if (scrollEditorIntervalRef.current) { 53229 clearInterval(scrollEditorIntervalRef.current); 53230 scrollEditorIntervalRef.current = null; 53231 } 53232 }; 53233 return [startScrolling, scrollOnDragOver, stopScrolling]; 53234 } 53235 53236 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-draggable/index.js 53237 /** 53238 * WordPress dependencies 53239 */ 53240 53241 53242 53243 53244 53245 53246 /** 53247 * Internal dependencies 53248 */ 53249 53250 53251 53252 53253 53254 53255 const BlockDraggable = ({ 53256 appendToOwnerDocument, 53257 children, 53258 clientIds, 53259 cloneClassname, 53260 elementId, 53261 onDragStart, 53262 onDragEnd, 53263 fadeWhenDisabled = false, 53264 dragComponent 53265 }) => { 53266 const { 53267 srcRootClientId, 53268 isDraggable, 53269 icon, 53270 visibleInserter, 53271 getBlockType 53272 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 53273 const { 53274 canMoveBlocks, 53275 getBlockRootClientId, 53276 getBlockName, 53277 getBlockAttributes, 53278 isBlockInsertionPointVisible 53279 } = select(store); 53280 const { 53281 getBlockType: _getBlockType, 53282 getActiveBlockVariation 53283 } = select(external_wp_blocks_namespaceObject.store); 53284 const rootClientId = getBlockRootClientId(clientIds[0]); 53285 const blockName = getBlockName(clientIds[0]); 53286 const variation = getActiveBlockVariation(blockName, getBlockAttributes(clientIds[0])); 53287 return { 53288 srcRootClientId: rootClientId, 53289 isDraggable: canMoveBlocks(clientIds), 53290 icon: variation?.icon || _getBlockType(blockName)?.icon, 53291 visibleInserter: isBlockInsertionPointVisible(), 53292 getBlockType: _getBlockType 53293 }; 53294 }, [clientIds]); 53295 const isDraggingRef = (0,external_wp_element_namespaceObject.useRef)(false); 53296 const [startScrolling, scrollOnDragOver, stopScrolling] = useScrollWhenDragging(); 53297 const { 53298 getAllowedBlocks, 53299 getBlockNamesByClientId, 53300 getBlockRootClientId 53301 } = (0,external_wp_data_namespaceObject.useSelect)(store); 53302 const { 53303 startDraggingBlocks, 53304 stopDraggingBlocks 53305 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 53306 53307 // Stop dragging blocks if the block draggable is unmounted. 53308 (0,external_wp_element_namespaceObject.useEffect)(() => { 53309 return () => { 53310 if (isDraggingRef.current) { 53311 stopDraggingBlocks(); 53312 } 53313 }; 53314 }, []); 53315 53316 // Find the root of the editor iframe. 53317 const blockEl = useBlockElement(clientIds[0]); 53318 const editorRoot = blockEl?.closest('body'); 53319 53320 /* 53321 * Add a dragover event listener to the editor root to track the blocks being dragged over. 53322 * The listener has to be inside the editor iframe otherwise the target isn't accessible. 53323 */ 53324 (0,external_wp_element_namespaceObject.useEffect)(() => { 53325 if (!editorRoot || !fadeWhenDisabled) { 53326 return; 53327 } 53328 const onDragOver = event => { 53329 if (!event.target.closest('[data-block]')) { 53330 return; 53331 } 53332 const draggedBlockNames = getBlockNamesByClientId(clientIds); 53333 const targetClientId = event.target.closest('[data-block]').getAttribute('data-block'); 53334 const allowedBlocks = getAllowedBlocks(targetClientId); 53335 const targetBlockName = getBlockNamesByClientId([targetClientId])[0]; 53336 53337 /* 53338 * Check if the target is valid to drop in. 53339 * If the target's allowedBlocks is an empty array, 53340 * it isn't a container block, in which case we check 53341 * its parent's validity instead. 53342 */ 53343 let dropTargetValid; 53344 if (allowedBlocks?.length === 0) { 53345 const targetRootClientId = getBlockRootClientId(targetClientId); 53346 const targetRootBlockName = getBlockNamesByClientId([targetRootClientId])[0]; 53347 const rootAllowedBlocks = getAllowedBlocks(targetRootClientId); 53348 dropTargetValid = isDropTargetValid(getBlockType, rootAllowedBlocks, draggedBlockNames, targetRootBlockName); 53349 } else { 53350 dropTargetValid = isDropTargetValid(getBlockType, allowedBlocks, draggedBlockNames, targetBlockName); 53351 } 53352 53353 /* 53354 * Update the body class to reflect if drop target is valid. 53355 * This has to be done on the document body because the draggable 53356 * chip is rendered outside of the editor iframe. 53357 */ 53358 if (!dropTargetValid && !visibleInserter) { 53359 window?.document?.body?.classList?.add('block-draggable-invalid-drag-token'); 53360 } else { 53361 window?.document?.body?.classList?.remove('block-draggable-invalid-drag-token'); 53362 } 53363 }; 53364 const throttledOnDragOver = (0,external_wp_compose_namespaceObject.throttle)(onDragOver, 200); 53365 editorRoot.addEventListener('dragover', throttledOnDragOver); 53366 return () => { 53367 editorRoot.removeEventListener('dragover', throttledOnDragOver); 53368 }; 53369 }, [clientIds, editorRoot, fadeWhenDisabled, getAllowedBlocks, getBlockNamesByClientId, getBlockRootClientId, getBlockType, visibleInserter]); 53370 if (!isDraggable) { 53371 return children({ 53372 draggable: false 53373 }); 53374 } 53375 const transferData = { 53376 type: 'block', 53377 srcClientIds: clientIds, 53378 srcRootClientId 53379 }; 53380 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Draggable, { 53381 appendToOwnerDocument: appendToOwnerDocument, 53382 cloneClassname: cloneClassname, 53383 __experimentalTransferDataType: "wp-blocks", 53384 transferData: transferData, 53385 onDragStart: event => { 53386 // Defer hiding the dragged source element to the next 53387 // frame to enable dragging. 53388 window.requestAnimationFrame(() => { 53389 startDraggingBlocks(clientIds); 53390 isDraggingRef.current = true; 53391 startScrolling(event); 53392 if (onDragStart) { 53393 onDragStart(); 53394 } 53395 }); 53396 }, 53397 onDragOver: scrollOnDragOver, 53398 onDragEnd: () => { 53399 stopDraggingBlocks(); 53400 isDraggingRef.current = false; 53401 stopScrolling(); 53402 if (onDragEnd) { 53403 onDragEnd(); 53404 } 53405 }, 53406 __experimentalDragComponent: 53407 // Check against `undefined` so that `null` can be used to disable 53408 // the default drag component. 53409 dragComponent !== undefined ? dragComponent : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockDraggableChip, { 53410 count: clientIds.length, 53411 icon: icon, 53412 fadeWhenDisabled: true 53413 }), 53414 elementId: elementId, 53415 children: ({ 53416 onDraggableStart, 53417 onDraggableEnd 53418 }) => { 53419 return children({ 53420 draggable: true, 53421 onDragStart: onDraggableStart, 53422 onDragEnd: onDraggableEnd 53423 }); 53424 } 53425 }); 53426 }; 53427 /* harmony default export */ const block_draggable = (BlockDraggable); 53428 53429 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-mover/mover-description.js 53430 /** 53431 * WordPress dependencies 53432 */ 53433 53434 const getMovementDirection = (moveDirection, orientation) => { 53435 if (moveDirection === 'up') { 53436 if (orientation === 'horizontal') { 53437 return (0,external_wp_i18n_namespaceObject.isRTL)() ? 'right' : 'left'; 53438 } 53439 return 'up'; 53440 } else if (moveDirection === 'down') { 53441 if (orientation === 'horizontal') { 53442 return (0,external_wp_i18n_namespaceObject.isRTL)() ? 'left' : 'right'; 53443 } 53444 return 'down'; 53445 } 53446 return null; 53447 }; 53448 53449 /** 53450 * Return a label for the block movement controls depending on block position. 53451 * 53452 * @param {number} selectedCount Number of blocks selected. 53453 * @param {string} type Block type - in the case of a single block, should 53454 * define its 'type'. I.e. 'Text', 'Heading', 'Image' etc. 53455 * @param {number} firstIndex The index (position - 1) of the first block selected. 53456 * @param {boolean} isFirst This is the first block. 53457 * @param {boolean} isLast This is the last block. 53458 * @param {number} dir Direction of movement (> 0 is considered to be going 53459 * down, < 0 is up). 53460 * @param {string} orientation The orientation of the block movers, vertical or 53461 * horizontal. 53462 * 53463 * @return {string | undefined} Label for the block movement controls. 53464 */ 53465 function getBlockMoverDescription(selectedCount, type, firstIndex, isFirst, isLast, dir, orientation) { 53466 const position = firstIndex + 1; 53467 if (selectedCount > 1) { 53468 return getMultiBlockMoverDescription(selectedCount, firstIndex, isFirst, isLast, dir, orientation); 53469 } 53470 if (isFirst && isLast) { 53471 return (0,external_wp_i18n_namespaceObject.sprintf)( 53472 // translators: %s: Type of block (i.e. Text, Image etc) 53473 (0,external_wp_i18n_namespaceObject.__)('Block %s is the only block, and cannot be moved'), type); 53474 } 53475 if (dir > 0 && !isLast) { 53476 // Moving down. 53477 const movementDirection = getMovementDirection('down', orientation); 53478 if (movementDirection === 'down') { 53479 return (0,external_wp_i18n_namespaceObject.sprintf)( 53480 // translators: 1: Type of block (i.e. Text, Image etc), 2: Position of selected block, 3: New position 53481 (0,external_wp_i18n_namespaceObject.__)('Move %1$s block from position %2$d down to position %3$d'), type, position, position + 1); 53482 } 53483 if (movementDirection === 'left') { 53484 return (0,external_wp_i18n_namespaceObject.sprintf)( 53485 // translators: 1: Type of block (i.e. Text, Image etc), 2: Position of selected block, 3: New position 53486 (0,external_wp_i18n_namespaceObject.__)('Move %1$s block from position %2$d left to position %3$d'), type, position, position + 1); 53487 } 53488 if (movementDirection === 'right') { 53489 return (0,external_wp_i18n_namespaceObject.sprintf)( 53490 // translators: 1: Type of block (i.e. Text, Image etc), 2: Position of selected block, 3: New position 53491 (0,external_wp_i18n_namespaceObject.__)('Move %1$s block from position %2$d right to position %3$d'), type, position, position + 1); 53492 } 53493 } 53494 if (dir > 0 && isLast) { 53495 // Moving down, and is the last item. 53496 const movementDirection = getMovementDirection('down', orientation); 53497 if (movementDirection === 'down') { 53498 return (0,external_wp_i18n_namespaceObject.sprintf)( 53499 // translators: 1: Type of block (i.e. Text, Image etc) 53500 (0,external_wp_i18n_namespaceObject.__)('Block %1$s is at the end of the content and can’t be moved down'), type); 53501 } 53502 if (movementDirection === 'left') { 53503 return (0,external_wp_i18n_namespaceObject.sprintf)( 53504 // translators: 1: Type of block (i.e. Text, Image etc) 53505 (0,external_wp_i18n_namespaceObject.__)('Block %1$s is at the end of the content and can’t be moved left'), type); 53506 } 53507 if (movementDirection === 'right') { 53508 return (0,external_wp_i18n_namespaceObject.sprintf)( 53509 // translators: 1: Type of block (i.e. Text, Image etc) 53510 (0,external_wp_i18n_namespaceObject.__)('Block %1$s is at the end of the content and can’t be moved right'), type); 53511 } 53512 } 53513 if (dir < 0 && !isFirst) { 53514 // Moving up. 53515 const movementDirection = getMovementDirection('up', orientation); 53516 if (movementDirection === 'up') { 53517 return (0,external_wp_i18n_namespaceObject.sprintf)( 53518 // translators: 1: Type of block (i.e. Text, Image etc), 2: Position of selected block, 3: New position 53519 (0,external_wp_i18n_namespaceObject.__)('Move %1$s block from position %2$d up to position %3$d'), type, position, position - 1); 53520 } 53521 if (movementDirection === 'left') { 53522 return (0,external_wp_i18n_namespaceObject.sprintf)( 53523 // translators: 1: Type of block (i.e. Text, Image etc), 2: Position of selected block, 3: New position 53524 (0,external_wp_i18n_namespaceObject.__)('Move %1$s block from position %2$d left to position %3$d'), type, position, position - 1); 53525 } 53526 if (movementDirection === 'right') { 53527 return (0,external_wp_i18n_namespaceObject.sprintf)( 53528 // translators: 1: Type of block (i.e. Text, Image etc), 2: Position of selected block, 3: New position 53529 (0,external_wp_i18n_namespaceObject.__)('Move %1$s block from position %2$d right to position %3$d'), type, position, position - 1); 53530 } 53531 } 53532 if (dir < 0 && isFirst) { 53533 // Moving up, and is the first item. 53534 const movementDirection = getMovementDirection('up', orientation); 53535 if (movementDirection === 'up') { 53536 return (0,external_wp_i18n_namespaceObject.sprintf)( 53537 // translators: 1: Type of block (i.e. Text, Image etc) 53538 (0,external_wp_i18n_namespaceObject.__)('Block %1$s is at the beginning of the content and can’t be moved up'), type); 53539 } 53540 if (movementDirection === 'left') { 53541 return (0,external_wp_i18n_namespaceObject.sprintf)( 53542 // translators: 1: Type of block (i.e. Text, Image etc) 53543 (0,external_wp_i18n_namespaceObject.__)('Block %1$s is at the beginning of the content and can’t be moved left'), type); 53544 } 53545 if (movementDirection === 'right') { 53546 return (0,external_wp_i18n_namespaceObject.sprintf)( 53547 // translators: 1: Type of block (i.e. Text, Image etc) 53548 (0,external_wp_i18n_namespaceObject.__)('Block %1$s is at the beginning of the content and can’t be moved right'), type); 53549 } 53550 } 53551 } 53552 53553 /** 53554 * Return a label for the block movement controls depending on block position. 53555 * 53556 * @param {number} selectedCount Number of blocks selected. 53557 * @param {number} firstIndex The index (position - 1) of the first block selected. 53558 * @param {boolean} isFirst This is the first block. 53559 * @param {boolean} isLast This is the last block. 53560 * @param {number} dir Direction of movement (> 0 is considered to be going 53561 * down, < 0 is up). 53562 * @param {string} orientation The orientation of the block movers, vertical or 53563 * horizontal. 53564 * 53565 * @return {string | undefined} Label for the block movement controls. 53566 */ 53567 function getMultiBlockMoverDescription(selectedCount, firstIndex, isFirst, isLast, dir, orientation) { 53568 const position = firstIndex + 1; 53569 if (isFirst && isLast) { 53570 // All blocks are selected 53571 return (0,external_wp_i18n_namespaceObject.__)('All blocks are selected, and cannot be moved'); 53572 } 53573 if (dir > 0 && !isLast) { 53574 // moving down 53575 const movementDirection = getMovementDirection('down', orientation); 53576 if (movementDirection === 'down') { 53577 return (0,external_wp_i18n_namespaceObject.sprintf)( 53578 // translators: 1: Number of selected blocks, 2: Position of selected blocks 53579 (0,external_wp_i18n_namespaceObject.__)('Move %1$d blocks from position %2$d down by one place'), selectedCount, position); 53580 } 53581 if (movementDirection === 'left') { 53582 return (0,external_wp_i18n_namespaceObject.sprintf)( 53583 // translators: 1: Number of selected blocks, 2: Position of selected blocks 53584 (0,external_wp_i18n_namespaceObject.__)('Move %1$d blocks from position %2$d left by one place'), selectedCount, position); 53585 } 53586 if (movementDirection === 'right') { 53587 return (0,external_wp_i18n_namespaceObject.sprintf)( 53588 // translators: 1: Number of selected blocks, 2: Position of selected blocks 53589 (0,external_wp_i18n_namespaceObject.__)('Move %1$d blocks from position %2$d right by one place'), selectedCount, position); 53590 } 53591 } 53592 if (dir > 0 && isLast) { 53593 // moving down, and the selected blocks are the last item 53594 const movementDirection = getMovementDirection('down', orientation); 53595 if (movementDirection === 'down') { 53596 return (0,external_wp_i18n_namespaceObject.__)('Blocks cannot be moved down as they are already at the bottom'); 53597 } 53598 if (movementDirection === 'left') { 53599 return (0,external_wp_i18n_namespaceObject.__)('Blocks cannot be moved left as they are already are at the leftmost position'); 53600 } 53601 if (movementDirection === 'right') { 53602 return (0,external_wp_i18n_namespaceObject.__)('Blocks cannot be moved right as they are already are at the rightmost position'); 53603 } 53604 } 53605 if (dir < 0 && !isFirst) { 53606 // moving up 53607 const movementDirection = getMovementDirection('up', orientation); 53608 if (movementDirection === 'up') { 53609 return (0,external_wp_i18n_namespaceObject.sprintf)( 53610 // translators: 1: Number of selected blocks, 2: Position of selected blocks 53611 (0,external_wp_i18n_namespaceObject.__)('Move %1$d blocks from position %2$d up by one place'), selectedCount, position); 53612 } 53613 if (movementDirection === 'left') { 53614 return (0,external_wp_i18n_namespaceObject.sprintf)( 53615 // translators: 1: Number of selected blocks, 2: Position of selected blocks 53616 (0,external_wp_i18n_namespaceObject.__)('Move %1$d blocks from position %2$d left by one place'), selectedCount, position); 53617 } 53618 if (movementDirection === 'right') { 53619 return (0,external_wp_i18n_namespaceObject.sprintf)( 53620 // translators: 1: Number of selected blocks, 2: Position of selected blocks 53621 (0,external_wp_i18n_namespaceObject.__)('Move %1$d blocks from position %2$d right by one place'), selectedCount, position); 53622 } 53623 } 53624 if (dir < 0 && isFirst) { 53625 // moving up, and the selected blocks are the first item 53626 const movementDirection = getMovementDirection('up', orientation); 53627 if (movementDirection === 'up') { 53628 return (0,external_wp_i18n_namespaceObject.__)('Blocks cannot be moved up as they are already at the top'); 53629 } 53630 if (movementDirection === 'left') { 53631 return (0,external_wp_i18n_namespaceObject.__)('Blocks cannot be moved left as they are already are at the leftmost position'); 53632 } 53633 if (movementDirection === 'right') { 53634 return (0,external_wp_i18n_namespaceObject.__)('Blocks cannot be moved right as they are already are at the rightmost position'); 53635 } 53636 } 53637 } 53638 53639 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-mover/button.js 53640 /** 53641 * External dependencies 53642 */ 53643 53644 53645 /** 53646 * WordPress dependencies 53647 */ 53648 53649 53650 53651 53652 53653 53654 53655 /** 53656 * Internal dependencies 53657 */ 53658 53659 53660 53661 53662 53663 53664 const getArrowIcon = (direction, orientation) => { 53665 if (direction === 'up') { 53666 if (orientation === 'horizontal') { 53667 return (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_right : chevron_left; 53668 } 53669 return chevron_up; 53670 } else if (direction === 'down') { 53671 if (orientation === 'horizontal') { 53672 return (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_left : chevron_right; 53673 } 53674 return chevron_down; 53675 } 53676 return null; 53677 }; 53678 const getMovementDirectionLabel = (moveDirection, orientation) => { 53679 if (moveDirection === 'up') { 53680 if (orientation === 'horizontal') { 53681 return (0,external_wp_i18n_namespaceObject.isRTL)() ? (0,external_wp_i18n_namespaceObject.__)('Move right') : (0,external_wp_i18n_namespaceObject.__)('Move left'); 53682 } 53683 return (0,external_wp_i18n_namespaceObject.__)('Move up'); 53684 } else if (moveDirection === 'down') { 53685 if (orientation === 'horizontal') { 53686 return (0,external_wp_i18n_namespaceObject.isRTL)() ? (0,external_wp_i18n_namespaceObject.__)('Move left') : (0,external_wp_i18n_namespaceObject.__)('Move right'); 53687 } 53688 return (0,external_wp_i18n_namespaceObject.__)('Move down'); 53689 } 53690 return null; 53691 }; 53692 const BlockMoverButton = (0,external_wp_element_namespaceObject.forwardRef)(({ 53693 clientIds, 53694 direction, 53695 orientation: moverOrientation, 53696 ...props 53697 }, ref) => { 53698 const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(BlockMoverButton); 53699 const normalizedClientIds = Array.isArray(clientIds) ? clientIds : [clientIds]; 53700 const blocksCount = normalizedClientIds.length; 53701 const { 53702 disabled 53703 } = props; 53704 const { 53705 blockType, 53706 isDisabled, 53707 rootClientId, 53708 isFirst, 53709 isLast, 53710 firstIndex, 53711 orientation = 'vertical' 53712 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 53713 const { 53714 getBlockIndex, 53715 getBlockRootClientId, 53716 getBlockOrder, 53717 getBlock, 53718 getBlockListSettings 53719 } = select(store); 53720 const firstClientId = normalizedClientIds[0]; 53721 const blockRootClientId = getBlockRootClientId(firstClientId); 53722 const firstBlockIndex = getBlockIndex(firstClientId); 53723 const lastBlockIndex = getBlockIndex(normalizedClientIds[normalizedClientIds.length - 1]); 53724 const blockOrder = getBlockOrder(blockRootClientId); 53725 const block = getBlock(firstClientId); 53726 const isFirstBlock = firstBlockIndex === 0; 53727 const isLastBlock = lastBlockIndex === blockOrder.length - 1; 53728 const { 53729 orientation: blockListOrientation 53730 } = getBlockListSettings(blockRootClientId) || {}; 53731 return { 53732 blockType: block ? (0,external_wp_blocks_namespaceObject.getBlockType)(block.name) : null, 53733 isDisabled: disabled || (direction === 'up' ? isFirstBlock : isLastBlock), 53734 rootClientId: blockRootClientId, 53735 firstIndex: firstBlockIndex, 53736 isFirst: isFirstBlock, 53737 isLast: isLastBlock, 53738 orientation: moverOrientation || blockListOrientation 53739 }; 53740 }, [clientIds, direction]); 53741 const { 53742 moveBlocksDown, 53743 moveBlocksUp 53744 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 53745 const moverFunction = direction === 'up' ? moveBlocksUp : moveBlocksDown; 53746 const onClick = event => { 53747 moverFunction(clientIds, rootClientId); 53748 if (props.onClick) { 53749 props.onClick(event); 53750 } 53751 }; 53752 const descriptionId = `block-editor-block-mover-button__description-$instanceId}`; 53753 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 53754 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 53755 __next40pxDefaultSize: true, 53756 ref: ref, 53757 className: dist_clsx('block-editor-block-mover-button', `is-$direction}-button`), 53758 icon: getArrowIcon(direction, orientation), 53759 label: getMovementDirectionLabel(direction, orientation), 53760 "aria-describedby": descriptionId, 53761 ...props, 53762 onClick: isDisabled ? null : onClick, 53763 disabled: isDisabled, 53764 accessibleWhenDisabled: true 53765 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 53766 id: descriptionId, 53767 children: getBlockMoverDescription(blocksCount, blockType && blockType.title, firstIndex, isFirst, isLast, direction === 'up' ? -1 : 1, orientation) 53768 })] 53769 }); 53770 }); 53771 const BlockMoverUpButton = (0,external_wp_element_namespaceObject.forwardRef)((props, ref) => { 53772 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockMoverButton, { 53773 direction: "up", 53774 ref: ref, 53775 ...props 53776 }); 53777 }); 53778 const BlockMoverDownButton = (0,external_wp_element_namespaceObject.forwardRef)((props, ref) => { 53779 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockMoverButton, { 53780 direction: "down", 53781 ref: ref, 53782 ...props 53783 }); 53784 }); 53785 53786 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-mover/index.js 53787 /** 53788 * External dependencies 53789 */ 53790 53791 53792 /** 53793 * WordPress dependencies 53794 */ 53795 53796 53797 53798 53799 53800 53801 /** 53802 * Internal dependencies 53803 */ 53804 53805 53806 53807 53808 53809 function BlockMover({ 53810 clientIds, 53811 hideDragHandle, 53812 isBlockMoverUpButtonDisabled, 53813 isBlockMoverDownButtonDisabled 53814 }) { 53815 const { 53816 canMove, 53817 rootClientId, 53818 isFirst, 53819 isLast, 53820 orientation, 53821 isManualGrid 53822 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 53823 var _getBlockAttributes; 53824 const { 53825 getBlockIndex, 53826 getBlockListSettings, 53827 canMoveBlocks, 53828 getBlockOrder, 53829 getBlockRootClientId, 53830 getBlockAttributes 53831 } = select(store); 53832 const normalizedClientIds = Array.isArray(clientIds) ? clientIds : [clientIds]; 53833 const firstClientId = normalizedClientIds[0]; 53834 const _rootClientId = getBlockRootClientId(firstClientId); 53835 const firstIndex = getBlockIndex(firstClientId); 53836 const lastIndex = getBlockIndex(normalizedClientIds[normalizedClientIds.length - 1]); 53837 const blockOrder = getBlockOrder(_rootClientId); 53838 const { 53839 layout = {} 53840 } = (_getBlockAttributes = getBlockAttributes(_rootClientId)) !== null && _getBlockAttributes !== void 0 ? _getBlockAttributes : {}; 53841 return { 53842 canMove: canMoveBlocks(clientIds), 53843 rootClientId: _rootClientId, 53844 isFirst: firstIndex === 0, 53845 isLast: lastIndex === blockOrder.length - 1, 53846 orientation: getBlockListSettings(_rootClientId)?.orientation, 53847 isManualGrid: layout.type === 'grid' && layout.isManualPlacement && window.__experimentalEnableGridInteractivity 53848 }; 53849 }, [clientIds]); 53850 if (!canMove || isFirst && isLast && !rootClientId || hideDragHandle && isManualGrid) { 53851 return null; 53852 } 53853 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.ToolbarGroup, { 53854 className: dist_clsx('block-editor-block-mover', { 53855 'is-horizontal': orientation === 'horizontal' 53856 }), 53857 children: [!hideDragHandle && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_draggable, { 53858 clientIds: clientIds, 53859 fadeWhenDisabled: true, 53860 children: draggableProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 53861 __next40pxDefaultSize: true, 53862 icon: drag_handle, 53863 className: "block-editor-block-mover__drag-handle", 53864 label: (0,external_wp_i18n_namespaceObject.__)('Drag') 53865 // Should not be able to tab to drag handle as this 53866 // button can only be used with a pointer device. 53867 , 53868 tabIndex: "-1", 53869 ...draggableProps 53870 }) 53871 }), !isManualGrid && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 53872 className: "block-editor-block-mover__move-button-container", 53873 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarItem, { 53874 children: itemProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockMoverUpButton, { 53875 disabled: isBlockMoverUpButtonDisabled, 53876 clientIds: clientIds, 53877 ...itemProps 53878 }) 53879 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarItem, { 53880 children: itemProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockMoverDownButton, { 53881 disabled: isBlockMoverDownButtonDisabled, 53882 clientIds: clientIds, 53883 ...itemProps 53884 }) 53885 })] 53886 })] 53887 }); 53888 } 53889 53890 /** 53891 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-mover/README.md 53892 */ 53893 /* harmony default export */ const block_mover = (BlockMover); 53894 53895 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-toolbar/utils.js 53896 /** 53897 * WordPress dependencies 53898 */ 53899 53900 53901 53902 /** 53903 * Internal dependencies 53904 */ 53905 53906 const { 53907 clearTimeout: utils_clearTimeout, 53908 setTimeout: utils_setTimeout 53909 } = window; 53910 const DEBOUNCE_TIMEOUT = 200; 53911 53912 /** 53913 * Hook that creates debounced callbacks when the node is hovered or focused. 53914 * 53915 * @param {Object} props Component props. 53916 * @param {Object} props.ref Element reference. 53917 * @param {boolean} props.isFocused Whether the component has current focus. 53918 * @param {number} props.highlightParent Whether to highlight the parent block. It defaults in highlighting the selected block. 53919 * @param {number} [props.debounceTimeout=250] Debounce timeout in milliseconds. 53920 */ 53921 function useDebouncedShowGestures({ 53922 ref, 53923 isFocused, 53924 highlightParent, 53925 debounceTimeout = DEBOUNCE_TIMEOUT 53926 }) { 53927 const { 53928 getSelectedBlockClientId, 53929 getBlockRootClientId 53930 } = (0,external_wp_data_namespaceObject.useSelect)(store); 53931 const { 53932 toggleBlockHighlight 53933 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 53934 const timeoutRef = (0,external_wp_element_namespaceObject.useRef)(); 53935 const isDistractionFree = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getSettings().isDistractionFree, []); 53936 const handleOnChange = nextIsFocused => { 53937 if (nextIsFocused && isDistractionFree) { 53938 return; 53939 } 53940 const selectedBlockClientId = getSelectedBlockClientId(); 53941 const clientId = highlightParent ? getBlockRootClientId(selectedBlockClientId) : selectedBlockClientId; 53942 toggleBlockHighlight(clientId, nextIsFocused); 53943 }; 53944 const getIsHovered = () => { 53945 return ref?.current && ref.current.matches(':hover'); 53946 }; 53947 const shouldHideGestures = () => { 53948 const isHovered = getIsHovered(); 53949 return !isFocused && !isHovered; 53950 }; 53951 const clearTimeoutRef = () => { 53952 const timeout = timeoutRef.current; 53953 if (timeout && utils_clearTimeout) { 53954 utils_clearTimeout(timeout); 53955 } 53956 }; 53957 const debouncedShowGestures = event => { 53958 if (event) { 53959 event.stopPropagation(); 53960 } 53961 clearTimeoutRef(); 53962 handleOnChange(true); 53963 }; 53964 const debouncedHideGestures = event => { 53965 if (event) { 53966 event.stopPropagation(); 53967 } 53968 clearTimeoutRef(); 53969 timeoutRef.current = utils_setTimeout(() => { 53970 if (shouldHideGestures()) { 53971 handleOnChange(false); 53972 } 53973 }, debounceTimeout); 53974 }; 53975 (0,external_wp_element_namespaceObject.useEffect)(() => () => { 53976 /** 53977 * We need to call the change handler with `isFocused` 53978 * set to false on unmount because we also clear the 53979 * timeout that would handle that. 53980 */ 53981 handleOnChange(false); 53982 clearTimeoutRef(); 53983 }, []); 53984 return { 53985 debouncedShowGestures, 53986 debouncedHideGestures 53987 }; 53988 } 53989 53990 /** 53991 * Hook that provides gesture events for DOM elements 53992 * that interact with the isFocused state. 53993 * 53994 * @param {Object} props Component props. 53995 * @param {Object} props.ref Element reference. 53996 * @param {number} [props.highlightParent=false] Whether to highlight the parent block. It defaults to highlighting the selected block. 53997 * @param {number} [props.debounceTimeout=250] Debounce timeout in milliseconds. 53998 */ 53999 function useShowHoveredOrFocusedGestures({ 54000 ref, 54001 highlightParent = false, 54002 debounceTimeout = DEBOUNCE_TIMEOUT 54003 }) { 54004 const [isFocused, setIsFocused] = (0,external_wp_element_namespaceObject.useState)(false); 54005 const { 54006 debouncedShowGestures, 54007 debouncedHideGestures 54008 } = useDebouncedShowGestures({ 54009 ref, 54010 debounceTimeout, 54011 isFocused, 54012 highlightParent 54013 }); 54014 const registerRef = (0,external_wp_element_namespaceObject.useRef)(false); 54015 const isFocusedWithin = () => { 54016 return ref?.current && ref.current.contains(ref.current.ownerDocument.activeElement); 54017 }; 54018 (0,external_wp_element_namespaceObject.useEffect)(() => { 54019 const node = ref.current; 54020 const handleOnFocus = () => { 54021 if (isFocusedWithin()) { 54022 setIsFocused(true); 54023 debouncedShowGestures(); 54024 } 54025 }; 54026 const handleOnBlur = () => { 54027 if (!isFocusedWithin()) { 54028 setIsFocused(false); 54029 debouncedHideGestures(); 54030 } 54031 }; 54032 54033 /** 54034 * Events are added via DOM events (vs. React synthetic events), 54035 * as the child React components swallow mouse events. 54036 */ 54037 if (node && !registerRef.current) { 54038 node.addEventListener('focus', handleOnFocus, true); 54039 node.addEventListener('blur', handleOnBlur, true); 54040 registerRef.current = true; 54041 } 54042 return () => { 54043 if (node) { 54044 node.removeEventListener('focus', handleOnFocus); 54045 node.removeEventListener('blur', handleOnBlur); 54046 } 54047 }; 54048 }, [ref, registerRef, setIsFocused, debouncedShowGestures, debouncedHideGestures]); 54049 return { 54050 onMouseMove: debouncedShowGestures, 54051 onMouseLeave: debouncedHideGestures 54052 }; 54053 } 54054 54055 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-parent-selector/index.js 54056 /** 54057 * WordPress dependencies 54058 */ 54059 54060 54061 54062 54063 54064 54065 /** 54066 * Internal dependencies 54067 */ 54068 54069 54070 54071 54072 54073 /** 54074 * Block parent selector component, displaying the hierarchy of the 54075 * current block selection as a single icon to "go up" a level. 54076 * 54077 * @return {Component} Parent block selector. 54078 */ 54079 54080 function BlockParentSelector() { 54081 const { 54082 selectBlock 54083 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 54084 const { 54085 firstParentClientId, 54086 isVisible 54087 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 54088 const { 54089 getBlockName, 54090 getBlockParents, 54091 getSelectedBlockClientId, 54092 getBlockEditingMode 54093 } = select(store); 54094 const { 54095 hasBlockSupport 54096 } = select(external_wp_blocks_namespaceObject.store); 54097 const selectedBlockClientId = getSelectedBlockClientId(); 54098 const parents = getBlockParents(selectedBlockClientId); 54099 const _firstParentClientId = parents[parents.length - 1]; 54100 const parentBlockName = getBlockName(_firstParentClientId); 54101 const _parentBlockType = (0,external_wp_blocks_namespaceObject.getBlockType)(parentBlockName); 54102 return { 54103 firstParentClientId: _firstParentClientId, 54104 isVisible: _firstParentClientId && getBlockEditingMode(_firstParentClientId) === 'default' && hasBlockSupport(_parentBlockType, '__experimentalParentSelector', true) 54105 }; 54106 }, []); 54107 const blockInformation = useBlockDisplayInformation(firstParentClientId); 54108 54109 // Allows highlighting the parent block outline when focusing or hovering 54110 // the parent block selector within the child. 54111 const nodeRef = (0,external_wp_element_namespaceObject.useRef)(); 54112 const showHoveredOrFocusedGestures = useShowHoveredOrFocusedGestures({ 54113 ref: nodeRef, 54114 highlightParent: true 54115 }); 54116 if (!isVisible) { 54117 return null; 54118 } 54119 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 54120 className: "block-editor-block-parent-selector", 54121 ref: nodeRef, 54122 ...showHoveredOrFocusedGestures, 54123 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 54124 className: "block-editor-block-parent-selector__button", 54125 onClick: () => selectBlock(firstParentClientId), 54126 label: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: Name of the block's parent. */ 54127 (0,external_wp_i18n_namespaceObject.__)('Select parent block: %s'), blockInformation?.title), 54128 showTooltip: true, 54129 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 54130 icon: blockInformation?.icon 54131 }) 54132 }) 54133 }, firstParentClientId); 54134 } 54135 54136 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/copy.js 54137 /** 54138 * WordPress dependencies 54139 */ 54140 54141 54142 const copy_copy = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 54143 xmlns: "http://www.w3.org/2000/svg", 54144 viewBox: "0 0 24 24", 54145 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 54146 fillRule: "evenodd", 54147 clipRule: "evenodd", 54148 d: "M5 4.5h11a.5.5 0 0 1 .5.5v11a.5.5 0 0 1-.5.5H5a.5.5 0 0 1-.5-.5V5a.5.5 0 0 1 .5-.5ZM3 5a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5Zm17 3v10.75c0 .69-.56 1.25-1.25 1.25H6v1.5h12.75a2.75 2.75 0 0 0 2.75-2.75V8H20Z" 54149 }) 54150 }); 54151 /* harmony default export */ const library_copy = (copy_copy); 54152 54153 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/preview-block-popover.js 54154 /** 54155 * WordPress dependencies 54156 */ 54157 54158 54159 54160 54161 /** 54162 * Internal dependencies 54163 */ 54164 54165 54166 54167 function PreviewBlockPopover({ 54168 blocks 54169 }) { 54170 const isMobile = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 54171 if (isMobile) { 54172 return null; 54173 } 54174 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 54175 className: "block-editor-block-switcher__popover-preview-container", 54176 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, { 54177 className: "block-editor-block-switcher__popover-preview", 54178 placement: "right-start", 54179 focusOnMount: false, 54180 offset: 16, 54181 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 54182 className: "block-editor-block-switcher__preview", 54183 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 54184 className: "block-editor-block-switcher__preview-title", 54185 children: (0,external_wp_i18n_namespaceObject.__)('Preview') 54186 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_preview, { 54187 viewportWidth: 500, 54188 blocks: blocks 54189 })] 54190 }) 54191 }) 54192 }); 54193 } 54194 54195 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/block-variation-transformations.js 54196 /** 54197 * WordPress dependencies 54198 */ 54199 54200 54201 54202 54203 54204 /** 54205 * Internal dependencies 54206 */ 54207 54208 54209 54210 54211 54212 54213 const block_variation_transformations_EMPTY_OBJECT = {}; 54214 function useBlockVariationTransforms({ 54215 clientIds, 54216 blocks 54217 }) { 54218 const { 54219 activeBlockVariation, 54220 blockVariationTransformations 54221 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 54222 const { 54223 getBlockAttributes, 54224 canRemoveBlocks 54225 } = select(store); 54226 const { 54227 getActiveBlockVariation, 54228 getBlockVariations 54229 } = select(external_wp_blocks_namespaceObject.store); 54230 const canRemove = canRemoveBlocks(clientIds); 54231 // Only handle single selected blocks for now. 54232 if (blocks.length !== 1 || !canRemove) { 54233 return block_variation_transformations_EMPTY_OBJECT; 54234 } 54235 const [firstBlock] = blocks; 54236 return { 54237 blockVariationTransformations: getBlockVariations(firstBlock.name, 'transform'), 54238 activeBlockVariation: getActiveBlockVariation(firstBlock.name, getBlockAttributes(firstBlock.clientId)) 54239 }; 54240 }, [clientIds, blocks]); 54241 const transformations = (0,external_wp_element_namespaceObject.useMemo)(() => { 54242 return blockVariationTransformations?.filter(({ 54243 name 54244 }) => name !== activeBlockVariation?.name); 54245 }, [blockVariationTransformations, activeBlockVariation]); 54246 return transformations; 54247 } 54248 const BlockVariationTransformations = ({ 54249 transformations, 54250 onSelect, 54251 blocks 54252 }) => { 54253 const [hoveredTransformItemName, setHoveredTransformItemName] = (0,external_wp_element_namespaceObject.useState)(); 54254 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 54255 children: [hoveredTransformItemName && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PreviewBlockPopover, { 54256 blocks: (0,external_wp_blocks_namespaceObject.cloneBlock)(blocks[0], transformations.find(({ 54257 name 54258 }) => name === hoveredTransformItemName).attributes) 54259 }), transformations?.map(item => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockVariationTranformationItem, { 54260 item: item, 54261 onSelect: onSelect, 54262 setHoveredTransformItemName: setHoveredTransformItemName 54263 }, item.name))] 54264 }); 54265 }; 54266 function BlockVariationTranformationItem({ 54267 item, 54268 onSelect, 54269 setHoveredTransformItemName 54270 }) { 54271 const { 54272 name, 54273 icon, 54274 title 54275 } = item; 54276 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuItem, { 54277 className: (0,external_wp_blocks_namespaceObject.getBlockMenuDefaultClassName)(name), 54278 onClick: event => { 54279 event.preventDefault(); 54280 onSelect(name); 54281 }, 54282 onMouseLeave: () => setHoveredTransformItemName(null), 54283 onMouseEnter: () => setHoveredTransformItemName(name), 54284 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 54285 icon: icon, 54286 showColors: true 54287 }), title] 54288 }); 54289 } 54290 /* harmony default export */ const block_variation_transformations = (BlockVariationTransformations); 54291 54292 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/block-transformations-menu.js 54293 /** 54294 * WordPress dependencies 54295 */ 54296 54297 54298 54299 54300 54301 /** 54302 * Internal dependencies 54303 */ 54304 54305 54306 54307 54308 /** 54309 * Helper hook to group transformations to display them in a specific order in the UI. 54310 * For now we group only priority content driven transformations(ex. paragraph -> heading). 54311 * 54312 * Later on we could also group 'layout' transformations(ex. paragraph -> group) and 54313 * display them in different sections. 54314 * 54315 * @param {Object[]} possibleBlockTransformations The available block transformations. 54316 * @return {Record<string, Object[]>} The grouped block transformations. 54317 */ 54318 54319 54320 54321 function useGroupedTransforms(possibleBlockTransformations) { 54322 const priorityContentTranformationBlocks = { 54323 'core/paragraph': 1, 54324 'core/heading': 2, 54325 'core/list': 3, 54326 'core/quote': 4 54327 }; 54328 const transformations = (0,external_wp_element_namespaceObject.useMemo)(() => { 54329 const priorityTextTranformsNames = Object.keys(priorityContentTranformationBlocks); 54330 const groupedPossibleTransforms = possibleBlockTransformations.reduce((accumulator, item) => { 54331 const { 54332 name 54333 } = item; 54334 if (priorityTextTranformsNames.includes(name)) { 54335 accumulator.priorityTextTransformations.push(item); 54336 } else { 54337 accumulator.restTransformations.push(item); 54338 } 54339 return accumulator; 54340 }, { 54341 priorityTextTransformations: [], 54342 restTransformations: [] 54343 }); 54344 /** 54345 * If there is only one priority text transformation and it's a Quote, 54346 * is should move to the rest transformations. This is because Quote can 54347 * be a container for any block type, so in multi-block selection it will 54348 * always be suggested, even for non-text blocks. 54349 */ 54350 if (groupedPossibleTransforms.priorityTextTransformations.length === 1 && groupedPossibleTransforms.priorityTextTransformations[0].name === 'core/quote') { 54351 const singleQuote = groupedPossibleTransforms.priorityTextTransformations.pop(); 54352 groupedPossibleTransforms.restTransformations.push(singleQuote); 54353 } 54354 return groupedPossibleTransforms; 54355 }, [possibleBlockTransformations]); 54356 54357 // Order the priority text transformations. 54358 transformations.priorityTextTransformations.sort(({ 54359 name: currentName 54360 }, { 54361 name: nextName 54362 }) => { 54363 return priorityContentTranformationBlocks[currentName] < priorityContentTranformationBlocks[nextName] ? -1 : 1; 54364 }); 54365 return transformations; 54366 } 54367 const BlockTransformationsMenu = ({ 54368 className, 54369 possibleBlockTransformations, 54370 possibleBlockVariationTransformations, 54371 onSelect, 54372 onSelectVariation, 54373 blocks 54374 }) => { 54375 const [hoveredTransformItemName, setHoveredTransformItemName] = (0,external_wp_element_namespaceObject.useState)(); 54376 const { 54377 priorityTextTransformations, 54378 restTransformations 54379 } = useGroupedTransforms(possibleBlockTransformations); 54380 // We have to check if both content transformations(priority and rest) are set 54381 // in order to create a separate MenuGroup for them. 54382 const hasBothContentTransformations = priorityTextTransformations.length && restTransformations.length; 54383 const restTransformItems = !!restTransformations.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RestTransformationItems, { 54384 restTransformations: restTransformations, 54385 onSelect: onSelect, 54386 setHoveredTransformItemName: setHoveredTransformItemName 54387 }); 54388 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 54389 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuGroup, { 54390 label: (0,external_wp_i18n_namespaceObject.__)('Transform to'), 54391 className: className, 54392 children: [hoveredTransformItemName && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PreviewBlockPopover, { 54393 blocks: (0,external_wp_blocks_namespaceObject.switchToBlockType)(blocks, hoveredTransformItemName) 54394 }), !!possibleBlockVariationTransformations?.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_variation_transformations, { 54395 transformations: possibleBlockVariationTransformations, 54396 blocks: blocks, 54397 onSelect: onSelectVariation 54398 }), priorityTextTransformations.map(item => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTranformationItem, { 54399 item: item, 54400 onSelect: onSelect, 54401 setHoveredTransformItemName: setHoveredTransformItemName 54402 }, item.name)), !hasBothContentTransformations && restTransformItems] 54403 }), !!hasBothContentTransformations && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 54404 className: className, 54405 children: restTransformItems 54406 })] 54407 }); 54408 }; 54409 function RestTransformationItems({ 54410 restTransformations, 54411 onSelect, 54412 setHoveredTransformItemName 54413 }) { 54414 return restTransformations.map(item => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTranformationItem, { 54415 item: item, 54416 onSelect: onSelect, 54417 setHoveredTransformItemName: setHoveredTransformItemName 54418 }, item.name)); 54419 } 54420 function BlockTranformationItem({ 54421 item, 54422 onSelect, 54423 setHoveredTransformItemName 54424 }) { 54425 const { 54426 name, 54427 icon, 54428 title, 54429 isDisabled 54430 } = item; 54431 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuItem, { 54432 className: (0,external_wp_blocks_namespaceObject.getBlockMenuDefaultClassName)(name), 54433 onClick: event => { 54434 event.preventDefault(); 54435 onSelect(name); 54436 }, 54437 disabled: isDisabled, 54438 onMouseLeave: () => setHoveredTransformItemName(null), 54439 onMouseEnter: () => setHoveredTransformItemName(name), 54440 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 54441 icon: icon, 54442 showColors: true 54443 }), title] 54444 }); 54445 } 54446 /* harmony default export */ const block_transformations_menu = (BlockTransformationsMenu); 54447 54448 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-styles/utils.js 54449 /** 54450 * WordPress dependencies 54451 */ 54452 54453 54454 54455 /** 54456 * Returns the active style from the given className. 54457 * 54458 * @param {Array} styles Block styles. 54459 * @param {string} className Class name 54460 * 54461 * @return {Object?} The active style. 54462 */ 54463 function getActiveStyle(styles, className) { 54464 for (const style of new (external_wp_tokenList_default())(className).values()) { 54465 if (style.indexOf('is-style-') === -1) { 54466 continue; 54467 } 54468 const potentialStyleName = style.substring(9); 54469 const activeStyle = styles?.find(({ 54470 name 54471 }) => name === potentialStyleName); 54472 if (activeStyle) { 54473 return activeStyle; 54474 } 54475 } 54476 return getDefaultStyle(styles); 54477 } 54478 54479 /** 54480 * Replaces the active style in the block's className. 54481 * 54482 * @param {string} className Class name. 54483 * @param {Object?} activeStyle The replaced style. 54484 * @param {Object} newStyle The replacing style. 54485 * 54486 * @return {string} The updated className. 54487 */ 54488 function replaceActiveStyle(className, activeStyle, newStyle) { 54489 const list = new (external_wp_tokenList_default())(className); 54490 if (activeStyle) { 54491 list.remove('is-style-' + activeStyle.name); 54492 } 54493 list.add('is-style-' + newStyle.name); 54494 return list.value; 54495 } 54496 54497 /** 54498 * Returns a collection of styles that can be represented on the frontend. 54499 * The function checks a style collection for a default style. If none is found, it adds one to 54500 * act as a fallback for when there is no active style applied to a block. The default item also serves 54501 * as a switch on the frontend to deactivate non-default styles. 54502 * 54503 * @param {Array} styles Block styles. 54504 * 54505 * @return {Array<Object?>} The style collection. 54506 */ 54507 function getRenderedStyles(styles) { 54508 if (!styles || styles.length === 0) { 54509 return []; 54510 } 54511 return getDefaultStyle(styles) ? styles : [{ 54512 name: 'default', 54513 label: (0,external_wp_i18n_namespaceObject._x)('Default', 'block style'), 54514 isDefault: true 54515 }, ...styles]; 54516 } 54517 54518 /** 54519 * Returns a style object from a collection of styles where that style object is the default block style. 54520 * 54521 * @param {Array} styles Block styles. 54522 * 54523 * @return {Object?} The default style object, if found. 54524 */ 54525 function getDefaultStyle(styles) { 54526 return styles?.find(style => style.isDefault); 54527 } 54528 54529 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-styles/use-styles-for-block.js 54530 /** 54531 * WordPress dependencies 54532 */ 54533 54534 54535 54536 54537 /** 54538 * Internal dependencies 54539 */ 54540 54541 54542 54543 /** 54544 * 54545 * @param {WPBlock} block Block object. 54546 * @param {WPBlockType} type Block type settings. 54547 * @return {WPBlock} A generic block ready for styles preview. 54548 */ 54549 function useGenericPreviewBlock(block, type) { 54550 return (0,external_wp_element_namespaceObject.useMemo)(() => { 54551 const example = type?.example; 54552 const blockName = type?.name; 54553 if (example && blockName) { 54554 return (0,external_wp_blocks_namespaceObject.getBlockFromExample)(blockName, { 54555 attributes: example.attributes, 54556 innerBlocks: example.innerBlocks 54557 }); 54558 } 54559 if (block) { 54560 return (0,external_wp_blocks_namespaceObject.cloneBlock)(block); 54561 } 54562 }, [type?.example ? block?.name : block, type]); 54563 } 54564 54565 /** 54566 * @typedef useStylesForBlocksArguments 54567 * @property {string} clientId Block client ID. 54568 * @property {() => void} onSwitch Block style switch callback function. 54569 */ 54570 54571 /** 54572 * 54573 * @param {useStylesForBlocksArguments} useStylesForBlocks arguments. 54574 * @return {Object} Results of the select methods. 54575 */ 54576 function useStylesForBlocks({ 54577 clientId, 54578 onSwitch 54579 }) { 54580 const selector = select => { 54581 const { 54582 getBlock 54583 } = select(store); 54584 const block = getBlock(clientId); 54585 if (!block) { 54586 return {}; 54587 } 54588 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(block.name); 54589 const { 54590 getBlockStyles 54591 } = select(external_wp_blocks_namespaceObject.store); 54592 return { 54593 block, 54594 blockType, 54595 styles: getBlockStyles(block.name), 54596 className: block.attributes.className || '' 54597 }; 54598 }; 54599 const { 54600 styles, 54601 block, 54602 blockType, 54603 className 54604 } = (0,external_wp_data_namespaceObject.useSelect)(selector, [clientId]); 54605 const { 54606 updateBlockAttributes 54607 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 54608 const stylesToRender = getRenderedStyles(styles); 54609 const activeStyle = getActiveStyle(stylesToRender, className); 54610 const genericPreviewBlock = useGenericPreviewBlock(block, blockType); 54611 const onSelect = style => { 54612 const styleClassName = replaceActiveStyle(className, activeStyle, style); 54613 updateBlockAttributes(clientId, { 54614 className: styleClassName 54615 }); 54616 onSwitch(); 54617 }; 54618 return { 54619 onSelect, 54620 stylesToRender, 54621 activeStyle, 54622 genericPreviewBlock, 54623 className 54624 }; 54625 } 54626 54627 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-styles/menu-items.js 54628 /** 54629 * WordPress dependencies 54630 */ 54631 54632 54633 54634 /** 54635 * Internal dependencies 54636 */ 54637 54638 54639 54640 const menu_items_noop = () => {}; 54641 function BlockStylesMenuItems({ 54642 clientId, 54643 onSwitch = menu_items_noop 54644 }) { 54645 const { 54646 onSelect, 54647 stylesToRender, 54648 activeStyle 54649 } = useStylesForBlocks({ 54650 clientId, 54651 onSwitch 54652 }); 54653 if (!stylesToRender || stylesToRender.length === 0) { 54654 return null; 54655 } 54656 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 54657 children: stylesToRender.map(style => { 54658 const menuItemText = style.label || style.name; 54659 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 54660 icon: activeStyle.name === style.name ? library_check : null, 54661 onClick: () => onSelect(style), 54662 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 54663 as: "span", 54664 limit: 18, 54665 ellipsizeMode: "tail", 54666 truncate: true, 54667 children: menuItemText 54668 }) 54669 }, style.name); 54670 }) 54671 }); 54672 } 54673 54674 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/block-styles-menu.js 54675 /** 54676 * WordPress dependencies 54677 */ 54678 54679 54680 54681 /** 54682 * Internal dependencies 54683 */ 54684 54685 54686 function BlockStylesMenu({ 54687 hoveredBlock, 54688 onSwitch 54689 }) { 54690 const { 54691 clientId 54692 } = hoveredBlock; 54693 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 54694 label: (0,external_wp_i18n_namespaceObject.__)('Styles'), 54695 className: "block-editor-block-switcher__styles__menugroup", 54696 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockStylesMenuItems, { 54697 clientId: clientId, 54698 onSwitch: onSwitch 54699 }) 54700 }); 54701 } 54702 54703 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/utils.js 54704 /** 54705 * WordPress dependencies 54706 */ 54707 54708 54709 /** 54710 * Try to find a matching block by a block's name in a provided 54711 * block. We recurse through InnerBlocks and return the reference 54712 * of the matched block (it could be an InnerBlock). 54713 * If no match is found return nothing. 54714 * 54715 * @param {WPBlock} block The block to try to find a match. 54716 * @param {string} selectedBlockName The block's name to use for matching condition. 54717 * @param {Set} consumedBlocks A set holding the previously matched/consumed blocks. 54718 * 54719 * @return {WPBlock | undefined} The matched block if found or nothing(`undefined`). 54720 */ 54721 const getMatchingBlockByName = (block, selectedBlockName, consumedBlocks = new Set()) => { 54722 const { 54723 clientId, 54724 name, 54725 innerBlocks = [] 54726 } = block; 54727 // Check if block has been consumed already. 54728 if (consumedBlocks.has(clientId)) { 54729 return; 54730 } 54731 if (name === selectedBlockName) { 54732 return block; 54733 } 54734 // Try to find a matching block from InnerBlocks recursively. 54735 for (const innerBlock of innerBlocks) { 54736 const match = getMatchingBlockByName(innerBlock, selectedBlockName, consumedBlocks); 54737 if (match) { 54738 return match; 54739 } 54740 } 54741 }; 54742 54743 /** 54744 * Find and return the block attributes to retain through 54745 * the transformation, based on Block Type's `role:content` 54746 * attributes. If no `role:content` attributes exist, 54747 * return selected block's attributes. 54748 * 54749 * @param {string} name Block type's namespaced name. 54750 * @param {Object} attributes Selected block's attributes. 54751 * @return {Object} The block's attributes to retain. 54752 */ 54753 const getRetainedBlockAttributes = (name, attributes) => { 54754 const contentAttributes = (0,external_wp_blocks_namespaceObject.getBlockAttributesNamesByRole)(name, 'content'); 54755 if (!contentAttributes?.length) { 54756 return attributes; 54757 } 54758 return contentAttributes.reduce((_accumulator, attribute) => { 54759 if (attributes[attribute]) { 54760 _accumulator[attribute] = attributes[attribute]; 54761 } 54762 return _accumulator; 54763 }, {}); 54764 }; 54765 54766 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/use-transformed-patterns.js 54767 /** 54768 * WordPress dependencies 54769 */ 54770 54771 54772 54773 /** 54774 * Internal dependencies 54775 */ 54776 54777 54778 /** 54779 * Mutate the matched block's attributes by getting 54780 * which block type's attributes to retain and prioritize 54781 * them in the merging of the attributes. 54782 * 54783 * @param {WPBlock} match The matched block. 54784 * @param {WPBlock} selectedBlock The selected block. 54785 * @return {void} 54786 */ 54787 const transformMatchingBlock = (match, selectedBlock) => { 54788 // Get the block attributes to retain through the transformation. 54789 const retainedBlockAttributes = getRetainedBlockAttributes(selectedBlock.name, selectedBlock.attributes); 54790 match.attributes = { 54791 ...match.attributes, 54792 ...retainedBlockAttributes 54793 }; 54794 }; 54795 54796 /** 54797 * By providing the selected blocks and pattern's blocks 54798 * find the matching blocks, transform them and return them. 54799 * If not all selected blocks are matched, return nothing. 54800 * 54801 * @param {WPBlock[]} selectedBlocks The selected blocks. 54802 * @param {WPBlock[]} patternBlocks The pattern's blocks. 54803 * @return {WPBlock[]|void} The transformed pattern's blocks or undefined if not all selected blocks have been matched. 54804 */ 54805 const getPatternTransformedBlocks = (selectedBlocks, patternBlocks) => { 54806 // Clone Pattern's blocks to produce new clientIds and be able to mutate the matches. 54807 const _patternBlocks = patternBlocks.map(block => (0,external_wp_blocks_namespaceObject.cloneBlock)(block)); 54808 /** 54809 * Keep track of the consumed pattern blocks. 54810 * This is needed because we loop the selected blocks 54811 * and for example we may have selected two paragraphs and 54812 * the pattern's blocks could have more `paragraphs`. 54813 */ 54814 const consumedBlocks = new Set(); 54815 for (const selectedBlock of selectedBlocks) { 54816 let isMatch = false; 54817 for (const patternBlock of _patternBlocks) { 54818 const match = getMatchingBlockByName(patternBlock, selectedBlock.name, consumedBlocks); 54819 if (!match) { 54820 continue; 54821 } 54822 isMatch = true; 54823 consumedBlocks.add(match.clientId); 54824 // We update (mutate) the matching pattern block. 54825 transformMatchingBlock(match, selectedBlock); 54826 // No need to loop through other pattern's blocks. 54827 break; 54828 } 54829 // Bail eary if a selected block has not been matched. 54830 if (!isMatch) { 54831 return; 54832 } 54833 } 54834 return _patternBlocks; 54835 }; 54836 54837 /** 54838 * @typedef {WPBlockPattern & {transformedBlocks: WPBlock[]}} TransformedBlockPattern 54839 */ 54840 54841 /** 54842 * Custom hook that accepts patterns from state and the selected 54843 * blocks and tries to match these with the pattern's blocks. 54844 * If all selected blocks are matched with a Pattern's block, 54845 * we transform them by retaining block's attributes with `role:content`. 54846 * The transformed pattern's blocks are set to a new pattern 54847 * property `transformedBlocks`. 54848 * 54849 * @param {WPBlockPattern[]} patterns Patterns from state. 54850 * @param {WPBlock[]} selectedBlocks The currently selected blocks. 54851 * @return {TransformedBlockPattern[]} Returns the eligible matched patterns with all the selected blocks. 54852 */ 54853 const useTransformedPatterns = (patterns, selectedBlocks) => { 54854 return (0,external_wp_element_namespaceObject.useMemo)(() => patterns.reduce((accumulator, _pattern) => { 54855 const transformedBlocks = getPatternTransformedBlocks(selectedBlocks, _pattern.blocks); 54856 if (transformedBlocks) { 54857 accumulator.push({ 54858 ..._pattern, 54859 transformedBlocks 54860 }); 54861 } 54862 return accumulator; 54863 }, []), [patterns, selectedBlocks]); 54864 }; 54865 /* harmony default export */ const use_transformed_patterns = (useTransformedPatterns); 54866 54867 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/pattern-transformations-menu.js 54868 /** 54869 * WordPress dependencies 54870 */ 54871 54872 54873 54874 54875 54876 54877 /** 54878 * Internal dependencies 54879 */ 54880 54881 54882 54883 54884 function PatternTransformationsMenu({ 54885 blocks, 54886 patterns: statePatterns, 54887 onSelect 54888 }) { 54889 const [showTransforms, setShowTransforms] = (0,external_wp_element_namespaceObject.useState)(false); 54890 const patterns = use_transformed_patterns(statePatterns, blocks); 54891 if (!patterns.length) { 54892 return null; 54893 } 54894 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuGroup, { 54895 className: "block-editor-block-switcher__pattern__transforms__menugroup", 54896 children: [showTransforms && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PreviewPatternsPopover, { 54897 patterns: patterns, 54898 onSelect: onSelect 54899 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 54900 onClick: event => { 54901 event.preventDefault(); 54902 setShowTransforms(!showTransforms); 54903 }, 54904 icon: chevron_right, 54905 children: (0,external_wp_i18n_namespaceObject.__)('Patterns') 54906 })] 54907 }); 54908 } 54909 function PreviewPatternsPopover({ 54910 patterns, 54911 onSelect 54912 }) { 54913 const isMobile = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 54914 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 54915 className: "block-editor-block-switcher__popover-preview-container", 54916 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, { 54917 className: "block-editor-block-switcher__popover-preview", 54918 placement: isMobile ? 'bottom' : 'right-start', 54919 offset: 16, 54920 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 54921 className: "block-editor-block-switcher__preview is-pattern-list-preview", 54922 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(pattern_transformations_menu_BlockPatternsList, { 54923 patterns: patterns, 54924 onSelect: onSelect 54925 }) 54926 }) 54927 }) 54928 }); 54929 } 54930 function pattern_transformations_menu_BlockPatternsList({ 54931 patterns, 54932 onSelect 54933 }) { 54934 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Composite, { 54935 role: "listbox", 54936 className: "block-editor-block-switcher__preview-patterns-container", 54937 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Patterns list'), 54938 children: patterns.map(pattern => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(pattern_transformations_menu_BlockPattern, { 54939 pattern: pattern, 54940 onSelect: onSelect 54941 }, pattern.name)) 54942 }); 54943 } 54944 function pattern_transformations_menu_BlockPattern({ 54945 pattern, 54946 onSelect 54947 }) { 54948 // TODO check pattern/preview width... 54949 const baseClassName = 'block-editor-block-switcher__preview-patterns-container'; 54950 const descriptionId = (0,external_wp_compose_namespaceObject.useInstanceId)(pattern_transformations_menu_BlockPattern, `$baseClassName}-list__item-description`); 54951 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 54952 className: `$baseClassName}-list__list-item`, 54953 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Composite.Item, { 54954 render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 54955 role: "option", 54956 "aria-label": pattern.title, 54957 "aria-describedby": pattern.description ? descriptionId : undefined, 54958 className: `$baseClassName}-list__item` 54959 }), 54960 onClick: () => onSelect(pattern.transformedBlocks), 54961 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_preview, { 54962 blocks: pattern.transformedBlocks, 54963 viewportWidth: pattern.viewportWidth || 500 54964 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 54965 className: `$baseClassName}-list__item-title`, 54966 children: pattern.title 54967 })] 54968 }), !!pattern.description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 54969 id: descriptionId, 54970 children: pattern.description 54971 })] 54972 }); 54973 } 54974 /* harmony default export */ const pattern_transformations_menu = (PatternTransformationsMenu); 54975 54976 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/index.js 54977 /** 54978 * WordPress dependencies 54979 */ 54980 54981 54982 54983 54984 54985 54986 /** 54987 * Internal dependencies 54988 */ 54989 54990 54991 54992 54993 54994 54995 54996 54997 54998 54999 function BlockSwitcherDropdownMenuContents({ 55000 onClose, 55001 clientIds, 55002 hasBlockStyles, 55003 canRemove, 55004 isUsingBindings 55005 }) { 55006 const { 55007 replaceBlocks, 55008 multiSelect, 55009 updateBlockAttributes 55010 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 55011 const { 55012 possibleBlockTransformations, 55013 patterns, 55014 blocks 55015 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 55016 const { 55017 getBlocksByClientId, 55018 getBlockRootClientId, 55019 getBlockTransformItems, 55020 __experimentalGetPatternTransformItems 55021 } = select(store); 55022 const rootClientId = getBlockRootClientId(Array.isArray(clientIds) ? clientIds[0] : clientIds); 55023 const _blocks = getBlocksByClientId(clientIds); 55024 return { 55025 blocks: _blocks, 55026 possibleBlockTransformations: getBlockTransformItems(_blocks, rootClientId), 55027 patterns: __experimentalGetPatternTransformItems(_blocks, rootClientId) 55028 }; 55029 }, [clientIds]); 55030 const blockVariationTransformations = useBlockVariationTransforms({ 55031 clientIds, 55032 blocks 55033 }); 55034 function selectForMultipleBlocks(insertedBlocks) { 55035 if (insertedBlocks.length > 1) { 55036 multiSelect(insertedBlocks[0].clientId, insertedBlocks[insertedBlocks.length - 1].clientId); 55037 } 55038 } 55039 // Simple block tranformation based on the `Block Transforms` API. 55040 function onBlockTransform(name) { 55041 const newBlocks = (0,external_wp_blocks_namespaceObject.switchToBlockType)(blocks, name); 55042 replaceBlocks(clientIds, newBlocks); 55043 selectForMultipleBlocks(newBlocks); 55044 } 55045 function onBlockVariationTransform(name) { 55046 updateBlockAttributes(blocks[0].clientId, { 55047 ...blockVariationTransformations.find(({ 55048 name: variationName 55049 }) => variationName === name).attributes 55050 }); 55051 } 55052 // Pattern transformation through the `Patterns` API. 55053 function onPatternTransform(transformedBlocks) { 55054 replaceBlocks(clientIds, transformedBlocks); 55055 selectForMultipleBlocks(transformedBlocks); 55056 } 55057 /** 55058 * The `isTemplate` check is a stopgap solution here. 55059 * Ideally, the Transforms API should handle this 55060 * by allowing to exclude blocks from wildcard transformations. 55061 */ 55062 const isSingleBlock = blocks.length === 1; 55063 const isTemplate = isSingleBlock && (0,external_wp_blocks_namespaceObject.isTemplatePart)(blocks[0]); 55064 const hasPossibleBlockTransformations = !!possibleBlockTransformations.length && canRemove && !isTemplate; 55065 const hasPossibleBlockVariationTransformations = !!blockVariationTransformations?.length; 55066 const hasPatternTransformation = !!patterns?.length && canRemove; 55067 const hasBlockOrBlockVariationTransforms = hasPossibleBlockTransformations || hasPossibleBlockVariationTransformations; 55068 const hasContents = hasBlockStyles || hasBlockOrBlockVariationTransforms || hasPatternTransformation; 55069 if (!hasContents) { 55070 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 55071 className: "block-editor-block-switcher__no-transforms", 55072 children: (0,external_wp_i18n_namespaceObject.__)('No transforms.') 55073 }); 55074 } 55075 const connectedBlockDescription = isSingleBlock ? (0,external_wp_i18n_namespaceObject._x)('This block is connected.', 'block toolbar button label and description') : (0,external_wp_i18n_namespaceObject._x)('These blocks are connected.', 'block toolbar button label and description'); 55076 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 55077 className: "block-editor-block-switcher__container", 55078 children: [hasPatternTransformation && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(pattern_transformations_menu, { 55079 blocks: blocks, 55080 patterns: patterns, 55081 onSelect: transformedBlocks => { 55082 onPatternTransform(transformedBlocks); 55083 onClose(); 55084 } 55085 }), hasBlockOrBlockVariationTransforms && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_transformations_menu, { 55086 className: "block-editor-block-switcher__transforms__menugroup", 55087 possibleBlockTransformations: possibleBlockTransformations, 55088 possibleBlockVariationTransformations: blockVariationTransformations, 55089 blocks: blocks, 55090 onSelect: name => { 55091 onBlockTransform(name); 55092 onClose(); 55093 }, 55094 onSelectVariation: name => { 55095 onBlockVariationTransform(name); 55096 onClose(); 55097 } 55098 }), hasBlockStyles && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockStylesMenu, { 55099 hoveredBlock: blocks[0], 55100 onSwitch: onClose 55101 }), isUsingBindings && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 55102 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 55103 className: "block-editor-block-switcher__binding-indicator", 55104 children: connectedBlockDescription 55105 }) 55106 })] 55107 }); 55108 } 55109 const BlockIndicator = ({ 55110 icon, 55111 showTitle, 55112 blockTitle 55113 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 55114 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 55115 className: "block-editor-block-switcher__toggle", 55116 icon: icon, 55117 showColors: true 55118 }), showTitle && blockTitle && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 55119 className: "block-editor-block-switcher__toggle-text", 55120 children: blockTitle 55121 })] 55122 }); 55123 const BlockSwitcher = ({ 55124 clientIds, 55125 disabled, 55126 isUsingBindings 55127 }) => { 55128 const { 55129 hasContentOnlyLocking, 55130 canRemove, 55131 hasBlockStyles, 55132 icon, 55133 invalidBlocks, 55134 isReusable, 55135 isTemplate 55136 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 55137 const { 55138 getTemplateLock, 55139 getBlocksByClientId, 55140 getBlockAttributes, 55141 canRemoveBlocks 55142 } = select(store); 55143 const { 55144 getBlockStyles, 55145 getBlockType, 55146 getActiveBlockVariation 55147 } = select(external_wp_blocks_namespaceObject.store); 55148 const _blocks = getBlocksByClientId(clientIds); 55149 if (!_blocks.length || _blocks.some(block => !block)) { 55150 return { 55151 invalidBlocks: true 55152 }; 55153 } 55154 const [{ 55155 name: firstBlockName 55156 }] = _blocks; 55157 const _isSingleBlockSelected = _blocks.length === 1; 55158 const blockType = getBlockType(firstBlockName); 55159 let _icon; 55160 let _hasTemplateLock; 55161 if (_isSingleBlockSelected) { 55162 const match = getActiveBlockVariation(firstBlockName, getBlockAttributes(clientIds[0])); 55163 // Take into account active block variations. 55164 _icon = match?.icon || blockType.icon; 55165 _hasTemplateLock = getTemplateLock(clientIds[0]) === 'contentOnly'; 55166 } else { 55167 const isSelectionOfSameType = new Set(_blocks.map(({ 55168 name 55169 }) => name)).size === 1; 55170 _hasTemplateLock = clientIds.some(id => getTemplateLock(id) === 'contentOnly'); 55171 // When selection consists of blocks of multiple types, display an 55172 // appropriate icon to communicate the non-uniformity. 55173 _icon = isSelectionOfSameType ? blockType.icon : library_copy; 55174 } 55175 return { 55176 canRemove: canRemoveBlocks(clientIds), 55177 hasBlockStyles: _isSingleBlockSelected && !!getBlockStyles(firstBlockName)?.length, 55178 icon: _icon, 55179 isReusable: _isSingleBlockSelected && (0,external_wp_blocks_namespaceObject.isReusableBlock)(_blocks[0]), 55180 isTemplate: _isSingleBlockSelected && (0,external_wp_blocks_namespaceObject.isTemplatePart)(_blocks[0]), 55181 hasContentOnlyLocking: _hasTemplateLock 55182 }; 55183 }, [clientIds]); 55184 const blockTitle = useBlockDisplayTitle({ 55185 clientId: clientIds?.[0], 55186 maximumLength: 35 55187 }); 55188 if (invalidBlocks) { 55189 return null; 55190 } 55191 const isSingleBlock = clientIds.length === 1; 55192 const blockSwitcherLabel = isSingleBlock ? blockTitle : (0,external_wp_i18n_namespaceObject.__)('Multiple blocks selected'); 55193 const hideDropdown = disabled || !hasBlockStyles && !canRemove || hasContentOnlyLocking; 55194 if (hideDropdown) { 55195 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 55196 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 55197 disabled: true, 55198 className: "block-editor-block-switcher__no-switcher-icon", 55199 title: blockSwitcherLabel, 55200 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockIndicator, { 55201 icon: icon, 55202 showTitle: isReusable || isTemplate, 55203 blockTitle: blockTitle 55204 }) 55205 }) 55206 }); 55207 } 55208 const blockSwitcherDescription = isSingleBlock ? (0,external_wp_i18n_namespaceObject.__)('Change block type or style') : (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of blocks. */ 55209 (0,external_wp_i18n_namespaceObject._n)('Change type of %d block', 'Change type of %d blocks', clientIds.length), clientIds.length); 55210 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 55211 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarItem, { 55212 children: toggleProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropdownMenu, { 55213 className: "block-editor-block-switcher", 55214 label: blockSwitcherLabel, 55215 popoverProps: { 55216 placement: 'bottom-start', 55217 className: 'block-editor-block-switcher__popover' 55218 }, 55219 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockIndicator, { 55220 icon: icon, 55221 showTitle: isReusable || isTemplate, 55222 blockTitle: blockTitle 55223 }), 55224 toggleProps: { 55225 description: blockSwitcherDescription, 55226 ...toggleProps 55227 }, 55228 menuProps: { 55229 orientation: 'both' 55230 }, 55231 children: ({ 55232 onClose 55233 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockSwitcherDropdownMenuContents, { 55234 onClose: onClose, 55235 clientIds: clientIds, 55236 hasBlockStyles: hasBlockStyles, 55237 canRemove: canRemove, 55238 isUsingBindings: isUsingBindings 55239 }) 55240 }) 55241 }) 55242 }); 55243 }; 55244 /* harmony default export */ const block_switcher = (BlockSwitcher); 55245 55246 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-toolbar/block-toolbar-last-item.js 55247 /** 55248 * WordPress dependencies 55249 */ 55250 55251 const { 55252 Fill: __unstableBlockToolbarLastItem, 55253 Slot: block_toolbar_last_item_Slot 55254 } = (0,external_wp_components_namespaceObject.createSlotFill)('__unstableBlockToolbarLastItem'); 55255 __unstableBlockToolbarLastItem.Slot = block_toolbar_last_item_Slot; 55256 /* harmony default export */ const block_toolbar_last_item = (__unstableBlockToolbarLastItem); 55257 55258 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/supports.js 55259 /** 55260 * WordPress dependencies 55261 */ 55262 55263 55264 const ALIGN_SUPPORT_KEY = 'align'; 55265 const ALIGN_WIDE_SUPPORT_KEY = 'alignWide'; 55266 const supports_BORDER_SUPPORT_KEY = '__experimentalBorder'; 55267 const supports_COLOR_SUPPORT_KEY = 'color'; 55268 const CUSTOM_CLASS_NAME_SUPPORT_KEY = 'customClassName'; 55269 const supports_FONT_FAMILY_SUPPORT_KEY = 'typography.__experimentalFontFamily'; 55270 const supports_FONT_SIZE_SUPPORT_KEY = 'typography.fontSize'; 55271 const supports_LINE_HEIGHT_SUPPORT_KEY = 'typography.lineHeight'; 55272 /** 55273 * Key within block settings' support array indicating support for font style. 55274 */ 55275 const supports_FONT_STYLE_SUPPORT_KEY = 'typography.__experimentalFontStyle'; 55276 /** 55277 * Key within block settings' support array indicating support for font weight. 55278 */ 55279 const supports_FONT_WEIGHT_SUPPORT_KEY = 'typography.__experimentalFontWeight'; 55280 /** 55281 * Key within block settings' supports array indicating support for text 55282 * align e.g. settings found in `block.json`. 55283 */ 55284 const supports_TEXT_ALIGN_SUPPORT_KEY = 'typography.textAlign'; 55285 /** 55286 * Key within block settings' supports array indicating support for text 55287 * columns e.g. settings found in `block.json`. 55288 */ 55289 const supports_TEXT_COLUMNS_SUPPORT_KEY = 'typography.textColumns'; 55290 /** 55291 * Key within block settings' supports array indicating support for text 55292 * decorations e.g. settings found in `block.json`. 55293 */ 55294 const supports_TEXT_DECORATION_SUPPORT_KEY = 'typography.__experimentalTextDecoration'; 55295 /** 55296 * Key within block settings' supports array indicating support for writing mode 55297 * e.g. settings found in `block.json`. 55298 */ 55299 const supports_WRITING_MODE_SUPPORT_KEY = 'typography.__experimentalWritingMode'; 55300 /** 55301 * Key within block settings' supports array indicating support for text 55302 * transforms e.g. settings found in `block.json`. 55303 */ 55304 const supports_TEXT_TRANSFORM_SUPPORT_KEY = 'typography.__experimentalTextTransform'; 55305 55306 /** 55307 * Key within block settings' supports array indicating support for letter-spacing 55308 * e.g. settings found in `block.json`. 55309 */ 55310 const supports_LETTER_SPACING_SUPPORT_KEY = 'typography.__experimentalLetterSpacing'; 55311 const LAYOUT_SUPPORT_KEY = 'layout'; 55312 const supports_TYPOGRAPHY_SUPPORT_KEYS = [supports_LINE_HEIGHT_SUPPORT_KEY, supports_FONT_SIZE_SUPPORT_KEY, supports_FONT_STYLE_SUPPORT_KEY, supports_FONT_WEIGHT_SUPPORT_KEY, supports_FONT_FAMILY_SUPPORT_KEY, supports_TEXT_ALIGN_SUPPORT_KEY, supports_TEXT_COLUMNS_SUPPORT_KEY, supports_TEXT_DECORATION_SUPPORT_KEY, supports_TEXT_TRANSFORM_SUPPORT_KEY, supports_WRITING_MODE_SUPPORT_KEY, supports_LETTER_SPACING_SUPPORT_KEY]; 55313 const EFFECTS_SUPPORT_KEYS = ['shadow']; 55314 const supports_SPACING_SUPPORT_KEY = 'spacing'; 55315 const supports_styleSupportKeys = [...EFFECTS_SUPPORT_KEYS, ...supports_TYPOGRAPHY_SUPPORT_KEYS, supports_BORDER_SUPPORT_KEY, supports_COLOR_SUPPORT_KEY, supports_SPACING_SUPPORT_KEY]; 55316 55317 /** 55318 * Returns true if the block defines support for align. 55319 * 55320 * @param {string|Object} nameOrType Block name or type object. 55321 * @return {boolean} Whether the block supports the feature. 55322 */ 55323 const hasAlignSupport = nameOrType => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(nameOrType, ALIGN_SUPPORT_KEY); 55324 55325 /** 55326 * Returns the block support value for align, if defined. 55327 * 55328 * @param {string|Object} nameOrType Block name or type object. 55329 * @return {unknown} The block support value. 55330 */ 55331 const getAlignSupport = nameOrType => getBlockSupport(nameOrType, ALIGN_SUPPORT_KEY); 55332 55333 /** 55334 * Returns true if the block defines support for align wide. 55335 * 55336 * @param {string|Object} nameOrType Block name or type object. 55337 * @return {boolean} Whether the block supports the feature. 55338 */ 55339 const hasAlignWideSupport = nameOrType => hasBlockSupport(nameOrType, ALIGN_WIDE_SUPPORT_KEY); 55340 55341 /** 55342 * Returns the block support value for align wide, if defined. 55343 * 55344 * @param {string|Object} nameOrType Block name or type object. 55345 * @return {unknown} The block support value. 55346 */ 55347 const getAlignWideSupport = nameOrType => getBlockSupport(nameOrType, ALIGN_WIDE_SUPPORT_KEY); 55348 55349 /** 55350 * Determine whether there is block support for border properties. 55351 * 55352 * @param {string|Object} nameOrType Block name or type object. 55353 * @param {string} feature Border feature to check support for. 55354 * 55355 * @return {boolean} Whether there is support. 55356 */ 55357 function supports_hasBorderSupport(nameOrType, feature = 'any') { 55358 if (external_wp_element_namespaceObject.Platform.OS !== 'web') { 55359 return false; 55360 } 55361 const support = (0,external_wp_blocks_namespaceObject.getBlockSupport)(nameOrType, supports_BORDER_SUPPORT_KEY); 55362 if (support === true) { 55363 return true; 55364 } 55365 if (feature === 'any') { 55366 return !!(support?.color || support?.radius || support?.width || support?.style); 55367 } 55368 return !!support?.[feature]; 55369 } 55370 55371 /** 55372 * Get block support for border properties. 55373 * 55374 * @param {string|Object} nameOrType Block name or type object. 55375 * @param {string} feature Border feature to get. 55376 * 55377 * @return {unknown} The block support. 55378 */ 55379 const getBorderSupport = (nameOrType, feature) => getBlockSupport(nameOrType, [supports_BORDER_SUPPORT_KEY, feature]); 55380 55381 /** 55382 * Returns true if the block defines support for color. 55383 * 55384 * @param {string|Object} nameOrType Block name or type object. 55385 * @return {boolean} Whether the block supports the feature. 55386 */ 55387 const supports_hasColorSupport = nameOrType => { 55388 const colorSupport = getBlockSupport(nameOrType, supports_COLOR_SUPPORT_KEY); 55389 return colorSupport && (colorSupport.link === true || colorSupport.gradient === true || colorSupport.background !== false || colorSupport.text !== false); 55390 }; 55391 55392 /** 55393 * Returns true if the block defines support for link color. 55394 * 55395 * @param {string|Object} nameOrType Block name or type object. 55396 * @return {boolean} Whether the block supports the feature. 55397 */ 55398 const supports_hasLinkColorSupport = nameOrType => { 55399 if (Platform.OS !== 'web') { 55400 return false; 55401 } 55402 const colorSupport = getBlockSupport(nameOrType, supports_COLOR_SUPPORT_KEY); 55403 return colorSupport !== null && typeof colorSupport === 'object' && !!colorSupport.link; 55404 }; 55405 55406 /** 55407 * Returns true if the block defines support for gradient color. 55408 * 55409 * @param {string|Object} nameOrType Block name or type object. 55410 * @return {boolean} Whether the block supports the feature. 55411 */ 55412 const supports_hasGradientSupport = nameOrType => { 55413 const colorSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(nameOrType, supports_COLOR_SUPPORT_KEY); 55414 return colorSupport !== null && typeof colorSupport === 'object' && !!colorSupport.gradients; 55415 }; 55416 55417 /** 55418 * Returns true if the block defines support for background color. 55419 * 55420 * @param {string|Object} nameOrType Block name or type object. 55421 * @return {boolean} Whether the block supports the feature. 55422 */ 55423 const supports_hasBackgroundColorSupport = nameOrType => { 55424 const colorSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(nameOrType, supports_COLOR_SUPPORT_KEY); 55425 return colorSupport && colorSupport.background !== false; 55426 }; 55427 55428 /** 55429 * Returns true if the block defines support for text-align. 55430 * 55431 * @param {string|Object} nameOrType Block name or type object. 55432 * @return {boolean} Whether the block supports the feature. 55433 */ 55434 const hasTextAlignSupport = nameOrType => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(nameOrType, supports_TEXT_ALIGN_SUPPORT_KEY); 55435 55436 /** 55437 * Returns the block support value for text-align, if defined. 55438 * 55439 * @param {string|Object} nameOrType Block name or type object. 55440 * @return {unknown} The block support value. 55441 */ 55442 const getTextAlignSupport = nameOrType => getBlockSupport(nameOrType, supports_TEXT_ALIGN_SUPPORT_KEY); 55443 55444 /** 55445 * Returns true if the block defines support for background color. 55446 * 55447 * @param {string|Object} nameOrType Block name or type object. 55448 * @return {boolean} Whether the block supports the feature. 55449 */ 55450 const supports_hasTextColorSupport = nameOrType => { 55451 const colorSupport = (0,external_wp_blocks_namespaceObject.getBlockSupport)(nameOrType, supports_COLOR_SUPPORT_KEY); 55452 return colorSupport && colorSupport.text !== false; 55453 }; 55454 55455 /** 55456 * Get block support for color properties. 55457 * 55458 * @param {string|Object} nameOrType Block name or type object. 55459 * @param {string} feature Color feature to get. 55460 * 55461 * @return {unknown} The block support. 55462 */ 55463 const getColorSupport = (nameOrType, feature) => getBlockSupport(nameOrType, [supports_COLOR_SUPPORT_KEY, feature]); 55464 55465 /** 55466 * Returns true if the block defines support for custom class name. 55467 * 55468 * @param {string|Object} nameOrType Block name or type object. 55469 * @return {boolean} Whether the block supports the feature. 55470 */ 55471 const hasCustomClassNameSupport = nameOrType => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(nameOrType, CUSTOM_CLASS_NAME_SUPPORT_KEY, true); 55472 55473 /** 55474 * Returns the block support value for custom class name, if defined. 55475 * 55476 * @param {string|Object} nameOrType Block name or type object. 55477 * @return {unknown} The block support value. 55478 */ 55479 const getCustomClassNameSupport = nameOrType => getBlockSupport(nameOrType, CUSTOM_CLASS_NAME_SUPPORT_KEY, true); 55480 55481 /** 55482 * Returns true if the block defines support for font family. 55483 * 55484 * @param {string|Object} nameOrType Block name or type object. 55485 * @return {boolean} Whether the block supports the feature. 55486 */ 55487 const hasFontFamilySupport = nameOrType => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(nameOrType, supports_FONT_FAMILY_SUPPORT_KEY); 55488 55489 /** 55490 * Returns the block support value for font family, if defined. 55491 * 55492 * @param {string|Object} nameOrType Block name or type object. 55493 * @return {unknown} The block support value. 55494 */ 55495 const getFontFamilySupport = nameOrType => getBlockSupport(nameOrType, supports_FONT_FAMILY_SUPPORT_KEY); 55496 55497 /** 55498 * Returns true if the block defines support for font size. 55499 * 55500 * @param {string|Object} nameOrType Block name or type object. 55501 * @return {boolean} Whether the block supports the feature. 55502 */ 55503 const hasFontSizeSupport = nameOrType => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(nameOrType, supports_FONT_SIZE_SUPPORT_KEY); 55504 55505 /** 55506 * Returns the block support value for font size, if defined. 55507 * 55508 * @param {string|Object} nameOrType Block name or type object. 55509 * @return {unknown} The block support value. 55510 */ 55511 const getFontSizeSupport = nameOrType => getBlockSupport(nameOrType, supports_FONT_SIZE_SUPPORT_KEY); 55512 55513 /** 55514 * Returns true if the block defines support for layout. 55515 * 55516 * @param {string|Object} nameOrType Block name or type object. 55517 * @return {boolean} Whether the block supports the feature. 55518 */ 55519 const hasLayoutSupport = nameOrType => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(nameOrType, LAYOUT_SUPPORT_KEY); 55520 55521 /** 55522 * Returns the block support value for layout, if defined. 55523 * 55524 * @param {string|Object} nameOrType Block name or type object. 55525 * @return {unknown} The block support value. 55526 */ 55527 const getLayoutSupport = nameOrType => getBlockSupport(nameOrType, LAYOUT_SUPPORT_KEY); 55528 55529 /** 55530 * Returns true if the block defines support for style. 55531 * 55532 * @param {string|Object} nameOrType Block name or type object. 55533 * @return {boolean} Whether the block supports the feature. 55534 */ 55535 const supports_hasStyleSupport = nameOrType => supports_styleSupportKeys.some(key => (0,external_wp_blocks_namespaceObject.hasBlockSupport)(nameOrType, key)); 55536 55537 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-paste-styles/index.js 55538 /** 55539 * WordPress dependencies 55540 */ 55541 55542 55543 55544 55545 55546 55547 /** 55548 * Internal dependencies 55549 */ 55550 55551 55552 55553 /** 55554 * Determine if the copied text looks like serialized blocks or not. 55555 * Since plain text will always get parsed into a freeform block, 55556 * we check that if the parsed blocks is anything other than that. 55557 * 55558 * @param {string} text The copied text. 55559 * @return {boolean} True if the text looks like serialized blocks, false otherwise. 55560 */ 55561 function hasSerializedBlocks(text) { 55562 try { 55563 const blocks = (0,external_wp_blocks_namespaceObject.parse)(text, { 55564 __unstableSkipMigrationLogs: true, 55565 __unstableSkipAutop: true 55566 }); 55567 if (blocks.length === 1 && blocks[0].name === 'core/freeform') { 55568 // It's likely that the text is just plain text and not serialized blocks. 55569 return false; 55570 } 55571 return true; 55572 } catch (err) { 55573 // Parsing error, the text is not serialized blocks. 55574 // (Even though that it technically won't happen) 55575 return false; 55576 } 55577 } 55578 55579 /** 55580 * Style attributes are attributes being added in `block-editor/src/hooks/*`. 55581 * (Except for some unrelated to style like `anchor` or `settings`.) 55582 * They generally represent the default block supports. 55583 */ 55584 const STYLE_ATTRIBUTES = { 55585 align: hasAlignSupport, 55586 borderColor: nameOrType => supports_hasBorderSupport(nameOrType, 'color'), 55587 backgroundColor: supports_hasBackgroundColorSupport, 55588 textAlign: hasTextAlignSupport, 55589 textColor: supports_hasTextColorSupport, 55590 gradient: supports_hasGradientSupport, 55591 className: hasCustomClassNameSupport, 55592 fontFamily: hasFontFamilySupport, 55593 fontSize: hasFontSizeSupport, 55594 layout: hasLayoutSupport, 55595 style: supports_hasStyleSupport 55596 }; 55597 55598 /** 55599 * Get the "style attributes" from a given block to a target block. 55600 * 55601 * @param {WPBlock} sourceBlock The source block. 55602 * @param {WPBlock} targetBlock The target block. 55603 * @return {Object} the filtered attributes object. 55604 */ 55605 function getStyleAttributes(sourceBlock, targetBlock) { 55606 return Object.entries(STYLE_ATTRIBUTES).reduce((attributes, [attributeKey, hasSupport]) => { 55607 // Only apply the attribute if both blocks support it. 55608 if (hasSupport(sourceBlock.name) && hasSupport(targetBlock.name)) { 55609 // Override attributes that are not present in the block to their defaults. 55610 attributes[attributeKey] = sourceBlock.attributes[attributeKey]; 55611 } 55612 return attributes; 55613 }, {}); 55614 } 55615 55616 /** 55617 * Update the target blocks with style attributes recursively. 55618 * 55619 * @param {WPBlock[]} targetBlocks The target blocks to be updated. 55620 * @param {WPBlock[]} sourceBlocks The source blocks to get th style attributes from. 55621 * @param {Function} updateBlockAttributes The function to update the attributes. 55622 */ 55623 function recursivelyUpdateBlockAttributes(targetBlocks, sourceBlocks, updateBlockAttributes) { 55624 for (let index = 0; index < Math.min(sourceBlocks.length, targetBlocks.length); index += 1) { 55625 updateBlockAttributes(targetBlocks[index].clientId, getStyleAttributes(sourceBlocks[index], targetBlocks[index])); 55626 recursivelyUpdateBlockAttributes(targetBlocks[index].innerBlocks, sourceBlocks[index].innerBlocks, updateBlockAttributes); 55627 } 55628 } 55629 55630 /** 55631 * A hook to return a pasteStyles event function for handling pasting styles to blocks. 55632 * 55633 * @return {Function} A function to update the styles to the blocks. 55634 */ 55635 function usePasteStyles() { 55636 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 55637 const { 55638 updateBlockAttributes 55639 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 55640 const { 55641 createSuccessNotice, 55642 createWarningNotice, 55643 createErrorNotice 55644 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_notices_namespaceObject.store); 55645 return (0,external_wp_element_namespaceObject.useCallback)(async targetBlocks => { 55646 let html = ''; 55647 try { 55648 // `http:` sites won't have the clipboard property on navigator. 55649 // (with the exception of localhost.) 55650 if (!window.navigator.clipboard) { 55651 createErrorNotice((0,external_wp_i18n_namespaceObject.__)('Unable to paste styles. This feature is only available on secure (https) sites in supporting browsers.'), { 55652 type: 'snackbar' 55653 }); 55654 return; 55655 } 55656 html = await window.navigator.clipboard.readText(); 55657 } catch (error) { 55658 // Possibly the permission is denied. 55659 createErrorNotice((0,external_wp_i18n_namespaceObject.__)('Unable to paste styles. Please allow browser clipboard permissions before continuing.'), { 55660 type: 'snackbar' 55661 }); 55662 return; 55663 } 55664 55665 // Abort if the copied text is empty or doesn't look like serialized blocks. 55666 if (!html || !hasSerializedBlocks(html)) { 55667 createWarningNotice((0,external_wp_i18n_namespaceObject.__)("Unable to paste styles. Block styles couldn't be found within the copied content."), { 55668 type: 'snackbar' 55669 }); 55670 return; 55671 } 55672 const copiedBlocks = (0,external_wp_blocks_namespaceObject.parse)(html); 55673 if (copiedBlocks.length === 1) { 55674 // Apply styles of the block to all the target blocks. 55675 registry.batch(() => { 55676 recursivelyUpdateBlockAttributes(targetBlocks, targetBlocks.map(() => copiedBlocks[0]), updateBlockAttributes); 55677 }); 55678 } else { 55679 registry.batch(() => { 55680 recursivelyUpdateBlockAttributes(targetBlocks, copiedBlocks, updateBlockAttributes); 55681 }); 55682 } 55683 if (targetBlocks.length === 1) { 55684 const title = (0,external_wp_blocks_namespaceObject.getBlockType)(targetBlocks[0].name)?.title; 55685 createSuccessNotice((0,external_wp_i18n_namespaceObject.sprintf)( 55686 // Translators: Name of the block being pasted, e.g. "Paragraph". 55687 (0,external_wp_i18n_namespaceObject.__)('Pasted styles to %s.'), title), { 55688 type: 'snackbar' 55689 }); 55690 } else { 55691 createSuccessNotice((0,external_wp_i18n_namespaceObject.sprintf)( 55692 // Translators: The number of the blocks. 55693 (0,external_wp_i18n_namespaceObject.__)('Pasted styles to %d blocks.'), targetBlocks.length), { 55694 type: 'snackbar' 55695 }); 55696 } 55697 }, [registry.batch, updateBlockAttributes, createSuccessNotice, createWarningNotice, createErrorNotice]); 55698 } 55699 55700 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-actions/index.js 55701 /** 55702 * WordPress dependencies 55703 */ 55704 55705 55706 55707 /** 55708 * Internal dependencies 55709 */ 55710 55711 55712 55713 function BlockActions({ 55714 clientIds, 55715 children, 55716 __experimentalUpdateSelection: updateSelection 55717 }) { 55718 const { 55719 getDefaultBlockName, 55720 getGroupingBlockName 55721 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 55722 const selected = (0,external_wp_data_namespaceObject.useSelect)(select => { 55723 const { 55724 canInsertBlockType, 55725 getBlockRootClientId, 55726 getBlocksByClientId, 55727 getDirectInsertBlock, 55728 canMoveBlocks, 55729 canRemoveBlocks 55730 } = select(store); 55731 const blocks = getBlocksByClientId(clientIds); 55732 const rootClientId = getBlockRootClientId(clientIds[0]); 55733 const canInsertDefaultBlock = canInsertBlockType(getDefaultBlockName(), rootClientId); 55734 const directInsertBlock = rootClientId ? getDirectInsertBlock(rootClientId) : null; 55735 return { 55736 canMove: canMoveBlocks(clientIds), 55737 canRemove: canRemoveBlocks(clientIds), 55738 canInsertBlock: canInsertDefaultBlock || !!directInsertBlock, 55739 canCopyStyles: blocks.every(block => { 55740 return !!block && ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(block.name, 'color') || (0,external_wp_blocks_namespaceObject.hasBlockSupport)(block.name, 'typography')); 55741 }), 55742 canDuplicate: blocks.every(block => { 55743 return !!block && (0,external_wp_blocks_namespaceObject.hasBlockSupport)(block.name, 'multiple', true) && canInsertBlockType(block.name, rootClientId); 55744 }) 55745 }; 55746 }, [clientIds, getDefaultBlockName]); 55747 const { 55748 getBlocksByClientId, 55749 getBlocks 55750 } = (0,external_wp_data_namespaceObject.useSelect)(store); 55751 const { 55752 canMove, 55753 canRemove, 55754 canInsertBlock, 55755 canCopyStyles, 55756 canDuplicate 55757 } = selected; 55758 const { 55759 removeBlocks, 55760 replaceBlocks, 55761 duplicateBlocks, 55762 insertAfterBlock, 55763 insertBeforeBlock, 55764 flashBlock, 55765 setBlockMovingClientId, 55766 setNavigationMode, 55767 selectBlock 55768 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 55769 const notifyCopy = useNotifyCopy(); 55770 const pasteStyles = usePasteStyles(); 55771 return children({ 55772 canCopyStyles, 55773 canDuplicate, 55774 canInsertBlock, 55775 canMove, 55776 canRemove, 55777 onDuplicate() { 55778 return duplicateBlocks(clientIds, updateSelection); 55779 }, 55780 onRemove() { 55781 return removeBlocks(clientIds, updateSelection); 55782 }, 55783 onInsertBefore() { 55784 insertBeforeBlock(clientIds[0]); 55785 }, 55786 onInsertAfter() { 55787 insertAfterBlock(clientIds[clientIds.length - 1]); 55788 }, 55789 onMoveTo() { 55790 setNavigationMode(true); 55791 selectBlock(clientIds[0]); 55792 setBlockMovingClientId(clientIds[0]); 55793 }, 55794 onGroup() { 55795 if (!clientIds.length) { 55796 return; 55797 } 55798 const groupingBlockName = getGroupingBlockName(); 55799 55800 // Activate the `transform` on `core/group` which does the conversion. 55801 const newBlocks = (0,external_wp_blocks_namespaceObject.switchToBlockType)(getBlocksByClientId(clientIds), groupingBlockName); 55802 if (!newBlocks) { 55803 return; 55804 } 55805 replaceBlocks(clientIds, newBlocks); 55806 }, 55807 onUngroup() { 55808 if (!clientIds.length) { 55809 return; 55810 } 55811 const innerBlocks = getBlocks(clientIds[0]); 55812 if (!innerBlocks.length) { 55813 return; 55814 } 55815 replaceBlocks(clientIds, innerBlocks); 55816 }, 55817 onCopy() { 55818 if (clientIds.length === 1) { 55819 flashBlock(clientIds[0]); 55820 } 55821 notifyCopy('copy', clientIds); 55822 }, 55823 async onPasteStyles() { 55824 await pasteStyles(getBlocksByClientId(clientIds)); 55825 } 55826 }); 55827 } 55828 55829 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-settings-menu/block-html-convert-button.js 55830 /** 55831 * WordPress dependencies 55832 */ 55833 55834 55835 55836 55837 55838 /** 55839 * Internal dependencies 55840 */ 55841 55842 55843 function BlockHTMLConvertButton({ 55844 clientId 55845 }) { 55846 const block = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getBlock(clientId), [clientId]); 55847 const { 55848 replaceBlocks 55849 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 55850 if (!block || block.name !== 'core/html') { 55851 return null; 55852 } 55853 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 55854 onClick: () => replaceBlocks(clientId, (0,external_wp_blocks_namespaceObject.rawHandler)({ 55855 HTML: (0,external_wp_blocks_namespaceObject.getBlockContent)(block) 55856 })), 55857 children: (0,external_wp_i18n_namespaceObject.__)('Convert to Blocks') 55858 }); 55859 } 55860 /* harmony default export */ const block_html_convert_button = (BlockHTMLConvertButton); 55861 55862 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-settings-menu/block-settings-menu-first-item.js 55863 /** 55864 * WordPress dependencies 55865 */ 55866 55867 const { 55868 Fill: __unstableBlockSettingsMenuFirstItem, 55869 Slot: block_settings_menu_first_item_Slot 55870 } = (0,external_wp_components_namespaceObject.createSlotFill)('__unstableBlockSettingsMenuFirstItem'); 55871 __unstableBlockSettingsMenuFirstItem.Slot = block_settings_menu_first_item_Slot; 55872 /* harmony default export */ const block_settings_menu_first_item = (__unstableBlockSettingsMenuFirstItem); 55873 55874 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/convert-to-group-buttons/use-convert-to-group-button-props.js 55875 /** 55876 * WordPress dependencies 55877 */ 55878 55879 55880 55881 /** 55882 * Internal dependencies 55883 */ 55884 55885 55886 /** 55887 * Contains the properties `ConvertToGroupButton` component needs. 55888 * 55889 * @typedef {Object} ConvertToGroupButtonProps 55890 * @property {string[]} clientIds An array of the selected client ids. 55891 * @property {boolean} isGroupable Indicates if the selected blocks can be grouped. 55892 * @property {boolean} isUngroupable Indicates if the selected blocks can be ungrouped. 55893 * @property {WPBlock[]} blocksSelection An array of the selected blocks. 55894 * @property {string} groupingBlockName The name of block used for handling grouping interactions. 55895 */ 55896 55897 /** 55898 * Returns the properties `ConvertToGroupButton` component needs to work properly. 55899 * It is used in `BlockSettingsMenuControls` to know if `ConvertToGroupButton` 55900 * should be rendered, to avoid ending up with an empty MenuGroup. 55901 * 55902 * @param {?string[]} selectedClientIds An optional array of clientIds to group. The selected blocks 55903 * from the block editor store are used if this is not provided. 55904 * 55905 * @return {ConvertToGroupButtonProps} Returns the properties needed by `ConvertToGroupButton`. 55906 */ 55907 function useConvertToGroupButtonProps(selectedClientIds) { 55908 return (0,external_wp_data_namespaceObject.useSelect)(select => { 55909 const { 55910 getBlocksByClientId, 55911 getSelectedBlockClientIds, 55912 isUngroupable, 55913 isGroupable 55914 } = select(store); 55915 const { 55916 getGroupingBlockName, 55917 getBlockType 55918 } = select(external_wp_blocks_namespaceObject.store); 55919 const clientIds = selectedClientIds?.length ? selectedClientIds : getSelectedBlockClientIds(); 55920 const blocksSelection = getBlocksByClientId(clientIds); 55921 const [firstSelectedBlock] = blocksSelection; 55922 const _isUngroupable = clientIds.length === 1 && isUngroupable(clientIds[0]); 55923 return { 55924 clientIds, 55925 isGroupable: isGroupable(clientIds), 55926 isUngroupable: _isUngroupable, 55927 blocksSelection, 55928 groupingBlockName: getGroupingBlockName(), 55929 onUngroup: _isUngroupable && getBlockType(firstSelectedBlock.name)?.transforms?.ungroup 55930 }; 55931 }, [selectedClientIds]); 55932 } 55933 55934 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/convert-to-group-buttons/index.js 55935 /** 55936 * WordPress dependencies 55937 */ 55938 55939 55940 55941 55942 55943 55944 /** 55945 * Internal dependencies 55946 */ 55947 55948 55949 55950 55951 55952 55953 function ConvertToGroupButton({ 55954 clientIds, 55955 isGroupable, 55956 isUngroupable, 55957 onUngroup, 55958 blocksSelection, 55959 groupingBlockName, 55960 onClose = () => {} 55961 }) { 55962 const { 55963 getSelectedBlockClientIds 55964 } = (0,external_wp_data_namespaceObject.useSelect)(store); 55965 const { 55966 replaceBlocks 55967 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 55968 const onConvertToGroup = () => { 55969 // Activate the `transform` on the Grouping Block which does the conversion. 55970 const newBlocks = (0,external_wp_blocks_namespaceObject.switchToBlockType)(blocksSelection, groupingBlockName); 55971 if (newBlocks) { 55972 replaceBlocks(clientIds, newBlocks); 55973 } 55974 }; 55975 const onConvertFromGroup = () => { 55976 let innerBlocks = blocksSelection[0].innerBlocks; 55977 if (!innerBlocks.length) { 55978 return; 55979 } 55980 if (onUngroup) { 55981 innerBlocks = onUngroup(blocksSelection[0].attributes, blocksSelection[0].innerBlocks); 55982 } 55983 replaceBlocks(clientIds, innerBlocks); 55984 }; 55985 if (!isGroupable && !isUngroupable) { 55986 return null; 55987 } 55988 const selectedBlockClientIds = getSelectedBlockClientIds(); 55989 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 55990 children: [isGroupable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 55991 shortcut: selectedBlockClientIds.length > 1 ? external_wp_keycodes_namespaceObject.displayShortcut.primary('g') : undefined, 55992 onClick: () => { 55993 onConvertToGroup(); 55994 onClose(); 55995 }, 55996 children: (0,external_wp_i18n_namespaceObject._x)('Group', 'verb') 55997 }), isUngroupable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 55998 onClick: () => { 55999 onConvertFromGroup(); 56000 onClose(); 56001 }, 56002 children: (0,external_wp_i18n_namespaceObject._x)('Ungroup', 'Ungrouping blocks from within a grouping block back into individual blocks within the Editor') 56003 })] 56004 }); 56005 } 56006 56007 56008 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-lock/use-block-lock.js 56009 /** 56010 * WordPress dependencies 56011 */ 56012 56013 56014 /** 56015 * Internal dependencies 56016 */ 56017 56018 56019 /** 56020 * Return details about the block lock status. 56021 * 56022 * @param {string} clientId The block client Id. 56023 * 56024 * @return {Object} Block lock status 56025 */ 56026 function useBlockLock(clientId) { 56027 return (0,external_wp_data_namespaceObject.useSelect)(select => { 56028 const { 56029 canEditBlock, 56030 canMoveBlock, 56031 canRemoveBlock, 56032 canLockBlockType, 56033 getBlockName, 56034 getTemplateLock 56035 } = select(store); 56036 const canEdit = canEditBlock(clientId); 56037 const canMove = canMoveBlock(clientId); 56038 const canRemove = canRemoveBlock(clientId); 56039 return { 56040 canEdit, 56041 canMove, 56042 canRemove, 56043 canLock: canLockBlockType(getBlockName(clientId)), 56044 isContentLocked: getTemplateLock(clientId) === 'contentOnly', 56045 isLocked: !canEdit || !canMove || !canRemove 56046 }; 56047 }, [clientId]); 56048 } 56049 56050 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/unlock.js 56051 /** 56052 * WordPress dependencies 56053 */ 56054 56055 56056 const unlock_unlock = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 56057 viewBox: "0 0 24 24", 56058 xmlns: "http://www.w3.org/2000/svg", 56059 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 56060 d: "M17 10h-1.2V7c0-2.1-1.7-3.8-3.8-3.8-2.1 0-3.8 1.7-3.8 3.8h1.5c0-1.2 1-2.2 2.2-2.2s2.2 1 2.2 2.2v3H7c-.6 0-1 .4-1 1v8c0 .6.4 1 1 1h10c.6 0 1-.4 1-1v-8c0-.6-.4-1-1-1z" 56061 }) 56062 }); 56063 /* harmony default export */ const library_unlock = (unlock_unlock); 56064 56065 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/lock-outline.js 56066 /** 56067 * WordPress dependencies 56068 */ 56069 56070 56071 const lockOutline = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 56072 viewBox: "0 0 24 24", 56073 xmlns: "http://www.w3.org/2000/svg", 56074 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 56075 d: "M17 10h-1.2V7c0-2.1-1.7-3.8-3.8-3.8-2.1 0-3.8 1.7-3.8 3.8v3H7c-.6 0-1 .4-1 1v8c0 .6.4 1 1 1h10c.6 0 1-.4 1-1v-8c0-.6-.4-1-1-1zM9.8 7c0-1.2 1-2.2 2.2-2.2 1.2 0 2.2 1 2.2 2.2v3H9.8V7zm6.7 11.5h-9v-7h9v7z" 56076 }) 56077 }); 56078 /* harmony default export */ const lock_outline = (lockOutline); 56079 56080 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/lock.js 56081 /** 56082 * WordPress dependencies 56083 */ 56084 56085 56086 const lock_lock = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 56087 viewBox: "0 0 24 24", 56088 xmlns: "http://www.w3.org/2000/svg", 56089 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 56090 d: "M17 10h-1.2V7c0-2.1-1.7-3.8-3.8-3.8-2.1 0-3.8 1.7-3.8 3.8v3H7c-.6 0-1 .4-1 1v8c0 .6.4 1 1 1h10c.6 0 1-.4 1-1v-8c0-.6-.4-1-1-1zm-2.8 0H9.8V7c0-1.2 1-2.2 2.2-2.2s2.2 1 2.2 2.2v3z" 56091 }) 56092 }); 56093 /* harmony default export */ const library_lock = (lock_lock); 56094 56095 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-lock/modal.js 56096 /** 56097 * WordPress dependencies 56098 */ 56099 56100 56101 56102 56103 56104 56105 56106 /** 56107 * Internal dependencies 56108 */ 56109 56110 56111 56112 56113 // Entity based blocks which allow edit locking 56114 56115 56116 const ALLOWS_EDIT_LOCKING = ['core/block', 'core/navigation']; 56117 function getTemplateLockValue(lock) { 56118 // Prevents all operations. 56119 if (lock.remove && lock.move) { 56120 return 'all'; 56121 } 56122 56123 // Prevents inserting or removing blocks, but allows moving existing blocks. 56124 if (lock.remove && !lock.move) { 56125 return 'insert'; 56126 } 56127 return false; 56128 } 56129 function BlockLockModal({ 56130 clientId, 56131 onClose 56132 }) { 56133 const [lock, setLock] = (0,external_wp_element_namespaceObject.useState)({ 56134 move: false, 56135 remove: false 56136 }); 56137 const { 56138 canEdit, 56139 canMove, 56140 canRemove 56141 } = useBlockLock(clientId); 56142 const { 56143 allowsEditLocking, 56144 templateLock, 56145 hasTemplateLock 56146 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 56147 const { 56148 getBlockName, 56149 getBlockAttributes 56150 } = select(store); 56151 const blockName = getBlockName(clientId); 56152 const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(blockName); 56153 return { 56154 allowsEditLocking: ALLOWS_EDIT_LOCKING.includes(blockName), 56155 templateLock: getBlockAttributes(clientId)?.templateLock, 56156 hasTemplateLock: !!blockType?.attributes?.templateLock 56157 }; 56158 }, [clientId]); 56159 const [applyTemplateLock, setApplyTemplateLock] = (0,external_wp_element_namespaceObject.useState)(!!templateLock); 56160 const { 56161 updateBlockAttributes 56162 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 56163 const blockInformation = useBlockDisplayInformation(clientId); 56164 (0,external_wp_element_namespaceObject.useEffect)(() => { 56165 setLock({ 56166 move: !canMove, 56167 remove: !canRemove, 56168 ...(allowsEditLocking ? { 56169 edit: !canEdit 56170 } : {}) 56171 }); 56172 }, [canEdit, canMove, canRemove, allowsEditLocking]); 56173 const isAllChecked = Object.values(lock).every(Boolean); 56174 const isMixed = Object.values(lock).some(Boolean) && !isAllChecked; 56175 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Modal, { 56176 title: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: Name of the block. */ 56177 (0,external_wp_i18n_namespaceObject.__)('Lock %s'), blockInformation.title), 56178 overlayClassName: "block-editor-block-lock-modal", 56179 onRequestClose: onClose, 56180 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("form", { 56181 onSubmit: event => { 56182 event.preventDefault(); 56183 updateBlockAttributes([clientId], { 56184 lock, 56185 templateLock: applyTemplateLock ? getTemplateLockValue(lock) : undefined 56186 }); 56187 onClose(); 56188 }, 56189 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 56190 className: "block-editor-block-lock-modal__options", 56191 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("legend", { 56192 children: (0,external_wp_i18n_namespaceObject.__)('Choose specific attributes to restrict or lock all available options.') 56193 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("ul", { 56194 role: "list", 56195 className: "block-editor-block-lock-modal__checklist", 56196 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", { 56197 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CheckboxControl, { 56198 __nextHasNoMarginBottom: true, 56199 className: "block-editor-block-lock-modal__options-all", 56200 label: (0,external_wp_i18n_namespaceObject.__)('Lock all'), 56201 checked: isAllChecked, 56202 indeterminate: isMixed, 56203 onChange: newValue => setLock({ 56204 move: newValue, 56205 remove: newValue, 56206 ...(allowsEditLocking ? { 56207 edit: newValue 56208 } : {}) 56209 }) 56210 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("ul", { 56211 role: "list", 56212 className: "block-editor-block-lock-modal__checklist", 56213 children: [allowsEditLocking && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", { 56214 className: "block-editor-block-lock-modal__checklist-item", 56215 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CheckboxControl, { 56216 __nextHasNoMarginBottom: true, 56217 label: (0,external_wp_i18n_namespaceObject.__)('Restrict editing'), 56218 checked: !!lock.edit, 56219 onChange: edit => setLock(prevLock => ({ 56220 ...prevLock, 56221 edit 56222 })) 56223 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Icon, { 56224 className: "block-editor-block-lock-modal__lock-icon", 56225 icon: lock.edit ? library_lock : library_unlock 56226 })] 56227 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", { 56228 className: "block-editor-block-lock-modal__checklist-item", 56229 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CheckboxControl, { 56230 __nextHasNoMarginBottom: true, 56231 label: (0,external_wp_i18n_namespaceObject.__)('Disable movement'), 56232 checked: lock.move, 56233 onChange: move => setLock(prevLock => ({ 56234 ...prevLock, 56235 move 56236 })) 56237 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Icon, { 56238 className: "block-editor-block-lock-modal__lock-icon", 56239 icon: lock.move ? library_lock : library_unlock 56240 })] 56241 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", { 56242 className: "block-editor-block-lock-modal__checklist-item", 56243 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CheckboxControl, { 56244 __nextHasNoMarginBottom: true, 56245 label: (0,external_wp_i18n_namespaceObject.__)('Prevent removal'), 56246 checked: lock.remove, 56247 onChange: remove => setLock(prevLock => ({ 56248 ...prevLock, 56249 remove 56250 })) 56251 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Icon, { 56252 className: "block-editor-block-lock-modal__lock-icon", 56253 icon: lock.remove ? library_lock : library_unlock 56254 })] 56255 })] 56256 })] 56257 }) 56258 }), hasTemplateLock && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 56259 __nextHasNoMarginBottom: true, 56260 className: "block-editor-block-lock-modal__template-lock", 56261 label: (0,external_wp_i18n_namespaceObject.__)('Apply to all blocks inside'), 56262 checked: applyTemplateLock, 56263 disabled: lock.move && !lock.remove, 56264 onChange: () => setApplyTemplateLock(!applyTemplateLock) 56265 })] 56266 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 56267 className: "block-editor-block-lock-modal__actions", 56268 justify: "flex-end", 56269 expanded: false, 56270 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 56271 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 56272 variant: "tertiary", 56273 onClick: onClose, 56274 __next40pxDefaultSize: true, 56275 children: (0,external_wp_i18n_namespaceObject.__)('Cancel') 56276 }) 56277 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 56278 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 56279 variant: "primary", 56280 type: "submit", 56281 __next40pxDefaultSize: true, 56282 children: (0,external_wp_i18n_namespaceObject.__)('Apply') 56283 }) 56284 })] 56285 })] 56286 }) 56287 }); 56288 } 56289 56290 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-lock/menu-item.js 56291 /** 56292 * WordPress dependencies 56293 */ 56294 56295 56296 56297 56298 56299 /** 56300 * Internal dependencies 56301 */ 56302 56303 56304 56305 56306 56307 function BlockLockMenuItem({ 56308 clientId 56309 }) { 56310 const { 56311 canLock, 56312 isLocked 56313 } = useBlockLock(clientId); 56314 const [isModalOpen, toggleModal] = (0,external_wp_element_namespaceObject.useReducer)(isActive => !isActive, false); 56315 if (!canLock) { 56316 return null; 56317 } 56318 const label = isLocked ? (0,external_wp_i18n_namespaceObject.__)('Unlock') : (0,external_wp_i18n_namespaceObject.__)('Lock'); 56319 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 56320 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56321 icon: isLocked ? library_unlock : lock_outline, 56322 onClick: toggleModal, 56323 "aria-expanded": isModalOpen, 56324 "aria-haspopup": "dialog", 56325 children: label 56326 }), isModalOpen && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockLockModal, { 56327 clientId: clientId, 56328 onClose: toggleModal 56329 })] 56330 }); 56331 } 56332 56333 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-settings-menu/block-mode-toggle.js 56334 /** 56335 * WordPress dependencies 56336 */ 56337 56338 56339 56340 56341 56342 /** 56343 * Internal dependencies 56344 */ 56345 56346 56347 const block_mode_toggle_noop = () => {}; 56348 function BlockModeToggle({ 56349 clientId, 56350 onToggle = block_mode_toggle_noop 56351 }) { 56352 const { 56353 blockType, 56354 mode, 56355 isCodeEditingEnabled 56356 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 56357 const { 56358 getBlock, 56359 getBlockMode, 56360 getSettings 56361 } = select(store); 56362 const block = getBlock(clientId); 56363 return { 56364 mode: getBlockMode(clientId), 56365 blockType: block ? (0,external_wp_blocks_namespaceObject.getBlockType)(block.name) : null, 56366 isCodeEditingEnabled: getSettings().codeEditingEnabled 56367 }; 56368 }, [clientId]); 56369 const { 56370 toggleBlockMode 56371 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 56372 if (!blockType || !(0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'html', true) || !isCodeEditingEnabled) { 56373 return null; 56374 } 56375 const label = mode === 'visual' ? (0,external_wp_i18n_namespaceObject.__)('Edit as HTML') : (0,external_wp_i18n_namespaceObject.__)('Edit visually'); 56376 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56377 onClick: () => { 56378 toggleBlockMode(clientId); 56379 onToggle(); 56380 }, 56381 children: label 56382 }); 56383 } 56384 56385 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/content-lock/modify-content-lock-menu-item.js 56386 /** 56387 * WordPress dependencies 56388 */ 56389 56390 56391 56392 56393 /** 56394 * Internal dependencies 56395 */ 56396 56397 56398 56399 // The implementation of content locking is mainly in this file, although the mechanism 56400 // to stop temporarily editing as blocks when an outside block is selected is on component StopEditingAsBlocksOnOutsideSelect 56401 // at block-editor/src/components/block-list/index.js. 56402 // Besides the components on this file and the file referenced above the implementation 56403 // also includes artifacts on the store (actions, reducers, and selector). 56404 56405 function ModifyContentLockMenuItem({ 56406 clientId, 56407 onClose 56408 }) { 56409 const { 56410 templateLock, 56411 isLockedByParent, 56412 isEditingAsBlocks 56413 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 56414 const { 56415 getContentLockingParent, 56416 getTemplateLock, 56417 getTemporarilyEditingAsBlocks 56418 } = unlock(select(store)); 56419 return { 56420 templateLock: getTemplateLock(clientId), 56421 isLockedByParent: !!getContentLockingParent(clientId), 56422 isEditingAsBlocks: getTemporarilyEditingAsBlocks() === clientId 56423 }; 56424 }, [clientId]); 56425 const blockEditorActions = (0,external_wp_data_namespaceObject.useDispatch)(store); 56426 const isContentLocked = !isLockedByParent && templateLock === 'contentOnly'; 56427 if (!isContentLocked && !isEditingAsBlocks) { 56428 return null; 56429 } 56430 const { 56431 modifyContentLockBlock 56432 } = unlock(blockEditorActions); 56433 const showStartEditingAsBlocks = !isEditingAsBlocks && isContentLocked; 56434 return showStartEditingAsBlocks && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56435 onClick: () => { 56436 modifyContentLockBlock(clientId); 56437 onClose(); 56438 }, 56439 children: (0,external_wp_i18n_namespaceObject._x)('Modify', 'Unlock content locked blocks') 56440 }); 56441 } 56442 56443 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-rename/use-block-rename.js 56444 /** 56445 * WordPress dependencies 56446 */ 56447 56448 function useBlockRename(name) { 56449 return { 56450 canRename: (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, 'renaming', true) 56451 }; 56452 } 56453 56454 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-rename/is-empty-string.js 56455 function isEmptyString(testString) { 56456 return testString?.trim()?.length === 0; 56457 } 56458 56459 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-rename/modal.js 56460 /** 56461 * WordPress dependencies 56462 */ 56463 56464 56465 56466 56467 56468 /** 56469 * Internal dependencies 56470 */ 56471 56472 56473 56474 function BlockRenameModal({ 56475 blockName, 56476 originalBlockName, 56477 onClose, 56478 onSave, 56479 // Pattern Overrides is a WordPress-only feature but it also uses the Block Binding API. 56480 // Ideally this should not be inside the block editor package, but we keep it here for simplicity. 56481 hasOverridesWarning 56482 }) { 56483 const [editedBlockName, setEditedBlockName] = (0,external_wp_element_namespaceObject.useState)(blockName); 56484 const nameHasChanged = editedBlockName !== blockName; 56485 const nameIsOriginal = editedBlockName === originalBlockName; 56486 const nameIsEmpty = isEmptyString(editedBlockName); 56487 const isNameValid = nameHasChanged || nameIsOriginal; 56488 const autoSelectInputText = event => event.target.select(); 56489 const handleSubmit = () => { 56490 const message = nameIsOriginal || nameIsEmpty ? (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: new name/label for the block */ 56491 (0,external_wp_i18n_namespaceObject.__)('Block name reset to: "%s".'), editedBlockName) : (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: new name/label for the block */ 56492 (0,external_wp_i18n_namespaceObject.__)('Block name changed to: "%s".'), editedBlockName); 56493 56494 // Must be assertive to immediately announce change. 56495 (0,external_wp_a11y_namespaceObject.speak)(message, 'assertive'); 56496 onSave(editedBlockName); 56497 56498 // Immediate close avoids ability to hit save multiple times. 56499 onClose(); 56500 }; 56501 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Modal, { 56502 title: (0,external_wp_i18n_namespaceObject.__)('Rename'), 56503 onRequestClose: onClose, 56504 overlayClassName: "block-editor-block-rename-modal", 56505 focusOnMount: "firstContentElement", 56506 size: "small", 56507 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("form", { 56508 onSubmit: e => { 56509 e.preventDefault(); 56510 if (!isNameValid) { 56511 return; 56512 } 56513 handleSubmit(); 56514 }, 56515 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 56516 spacing: "3", 56517 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextControl, { 56518 __nextHasNoMarginBottom: true, 56519 __next40pxDefaultSize: true, 56520 value: editedBlockName, 56521 label: (0,external_wp_i18n_namespaceObject.__)('Name'), 56522 help: hasOverridesWarning ? (0,external_wp_i18n_namespaceObject.__)('This block allows overrides. Changing the name can cause problems with content entered into instances of this pattern.') : undefined, 56523 placeholder: originalBlockName, 56524 onChange: setEditedBlockName, 56525 onFocus: autoSelectInputText 56526 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 56527 justify: "right", 56528 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 56529 __next40pxDefaultSize: true, 56530 variant: "tertiary", 56531 onClick: onClose, 56532 children: (0,external_wp_i18n_namespaceObject.__)('Cancel') 56533 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 56534 __next40pxDefaultSize: true, 56535 "aria-disabled": !isNameValid, 56536 variant: "primary", 56537 type: "submit", 56538 children: (0,external_wp_i18n_namespaceObject.__)('Save') 56539 })] 56540 })] 56541 }) 56542 }) 56543 }); 56544 } 56545 56546 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-rename/rename-control.js 56547 /** 56548 * WordPress dependencies 56549 */ 56550 56551 56552 56553 56554 56555 /** 56556 * Internal dependencies 56557 */ 56558 56559 56560 56561 56562 56563 56564 56565 function BlockRenameControl({ 56566 clientId 56567 }) { 56568 const [renamingBlock, setRenamingBlock] = (0,external_wp_element_namespaceObject.useState)(false); 56569 const { 56570 metadata 56571 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 56572 const { 56573 getBlockAttributes 56574 } = select(store); 56575 const _metadata = getBlockAttributes(clientId)?.metadata; 56576 return { 56577 metadata: _metadata 56578 }; 56579 }, [clientId]); 56580 const { 56581 updateBlockAttributes 56582 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 56583 const customName = metadata?.name; 56584 const hasPatternOverrides = !!customName && !!metadata?.bindings && Object.values(metadata.bindings).some(binding => binding.source === 'core/pattern-overrides'); 56585 function onChange(newName) { 56586 updateBlockAttributes([clientId], { 56587 metadata: { 56588 ...metadata, 56589 name: newName 56590 } 56591 }); 56592 } 56593 const blockInformation = useBlockDisplayInformation(clientId); 56594 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 56595 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56596 onClick: () => { 56597 setRenamingBlock(true); 56598 }, 56599 "aria-expanded": renamingBlock, 56600 "aria-haspopup": "dialog", 56601 children: (0,external_wp_i18n_namespaceObject.__)('Rename') 56602 }), renamingBlock && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockRenameModal, { 56603 blockName: customName || '', 56604 originalBlockName: blockInformation?.title, 56605 hasOverridesWarning: hasPatternOverrides, 56606 onClose: () => setRenamingBlock(false), 56607 onSave: newName => { 56608 // If the new value is the block's original name (e.g. `Group`) 56609 // or it is an empty string then assume the intent is to reset 56610 // the value. Therefore reset the metadata. 56611 if (newName === blockInformation?.title || isEmptyString(newName)) { 56612 newName = undefined; 56613 } 56614 onChange(newName); 56615 } 56616 })] 56617 }); 56618 } 56619 56620 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-settings-menu-controls/index.js 56621 /** 56622 * WordPress dependencies 56623 */ 56624 56625 56626 56627 56628 56629 /** 56630 * Internal dependencies 56631 */ 56632 56633 56634 56635 56636 56637 56638 56639 56640 const { 56641 Fill, 56642 Slot: block_settings_menu_controls_Slot 56643 } = (0,external_wp_components_namespaceObject.createSlotFill)('BlockSettingsMenuControls'); 56644 const BlockSettingsMenuControlsSlot = ({ 56645 fillProps, 56646 clientIds = null 56647 }) => { 56648 const { 56649 selectedBlocks, 56650 selectedClientIds, 56651 isContentOnly 56652 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 56653 const { 56654 getBlockNamesByClientId, 56655 getSelectedBlockClientIds, 56656 getBlockEditingMode 56657 } = select(store); 56658 const ids = clientIds !== null ? clientIds : getSelectedBlockClientIds(); 56659 return { 56660 selectedBlocks: getBlockNamesByClientId(ids), 56661 selectedClientIds: ids, 56662 isContentOnly: getBlockEditingMode(ids[0]) === 'contentOnly' 56663 }; 56664 }, [clientIds]); 56665 const { 56666 canLock 56667 } = useBlockLock(selectedClientIds[0]); 56668 const { 56669 canRename 56670 } = useBlockRename(selectedBlocks[0]); 56671 const showLockButton = selectedClientIds.length === 1 && canLock && !isContentOnly; 56672 const showRenameButton = selectedClientIds.length === 1 && canRename && !isContentOnly; 56673 56674 // Check if current selection of blocks is Groupable or Ungroupable 56675 // and pass this props down to ConvertToGroupButton. 56676 const convertToGroupButtonProps = useConvertToGroupButtonProps(selectedClientIds); 56677 const { 56678 isGroupable, 56679 isUngroupable 56680 } = convertToGroupButtonProps; 56681 const showConvertToGroupButton = (isGroupable || isUngroupable) && !isContentOnly; 56682 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_settings_menu_controls_Slot, { 56683 fillProps: { 56684 ...fillProps, 56685 selectedBlocks, 56686 selectedClientIds 56687 }, 56688 children: fills => { 56689 if (!fills?.length > 0 && !showConvertToGroupButton && !showLockButton) { 56690 return null; 56691 } 56692 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuGroup, { 56693 children: [showConvertToGroupButton && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ConvertToGroupButton, { 56694 ...convertToGroupButtonProps, 56695 onClose: fillProps?.onClose 56696 }), showLockButton && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockLockMenuItem, { 56697 clientId: selectedClientIds[0] 56698 }), showRenameButton && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockRenameControl, { 56699 clientId: selectedClientIds[0] 56700 }), fills, fillProps?.canMove && !fillProps?.onlyBlock && !isContentOnly && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56701 onClick: (0,external_wp_compose_namespaceObject.pipe)(fillProps?.onClose, fillProps?.onMoveTo), 56702 children: (0,external_wp_i18n_namespaceObject.__)('Move to') 56703 }), selectedClientIds.length === 1 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ModifyContentLockMenuItem, { 56704 clientId: selectedClientIds[0], 56705 onClose: fillProps?.onClose 56706 }), fillProps?.count === 1 && !isContentOnly && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockModeToggle, { 56707 clientId: fillProps?.firstBlockClientId, 56708 onToggle: fillProps?.onClose 56709 })] 56710 }); 56711 } 56712 }); 56713 }; 56714 56715 /** 56716 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-settings-menu-controls/README.md 56717 * 56718 * @param {Object} props Fill props. 56719 * @return {Element} Element. 56720 */ 56721 function BlockSettingsMenuControls({ 56722 ...props 56723 }) { 56724 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalStyleProvider, { 56725 document: document, 56726 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Fill, { 56727 ...props 56728 }) 56729 }); 56730 } 56731 BlockSettingsMenuControls.Slot = BlockSettingsMenuControlsSlot; 56732 /* harmony default export */ const block_settings_menu_controls = (BlockSettingsMenuControls); 56733 56734 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-settings-menu/block-parent-selector-menu-item.js 56735 /** 56736 * WordPress dependencies 56737 */ 56738 56739 56740 56741 56742 56743 56744 /** 56745 * Internal dependencies 56746 */ 56747 56748 56749 56750 56751 function BlockParentSelectorMenuItem({ 56752 parentClientId, 56753 parentBlockType 56754 }) { 56755 const isSmallViewport = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 56756 const { 56757 selectBlock 56758 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 56759 56760 // Allows highlighting the parent block outline when focusing or hovering 56761 // the parent block selector within the child. 56762 const menuItemRef = (0,external_wp_element_namespaceObject.useRef)(); 56763 const gesturesProps = useShowHoveredOrFocusedGestures({ 56764 ref: menuItemRef, 56765 highlightParent: true 56766 }); 56767 if (!isSmallViewport) { 56768 return null; 56769 } 56770 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56771 ...gesturesProps, 56772 ref: menuItemRef, 56773 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 56774 icon: parentBlockType.icon 56775 }), 56776 onClick: () => selectBlock(parentClientId), 56777 children: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: Name of the block's parent. */ 56778 (0,external_wp_i18n_namespaceObject.__)('Select parent block (%s)'), parentBlockType.title) 56779 }); 56780 } 56781 56782 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-settings-menu/block-settings-dropdown.js 56783 /** 56784 * WordPress dependencies 56785 */ 56786 56787 56788 56789 56790 56791 56792 56793 56794 56795 56796 /** 56797 * Internal dependencies 56798 */ 56799 56800 56801 56802 56803 56804 56805 56806 56807 56808 56809 const block_settings_dropdown_POPOVER_PROPS = { 56810 className: 'block-editor-block-settings-menu__popover', 56811 placement: 'bottom-start' 56812 }; 56813 function CopyMenuItem({ 56814 clientIds, 56815 onCopy, 56816 label, 56817 shortcut 56818 }) { 56819 const { 56820 getBlocksByClientId 56821 } = (0,external_wp_data_namespaceObject.useSelect)(store); 56822 const ref = (0,external_wp_compose_namespaceObject.useCopyToClipboard)(() => (0,external_wp_blocks_namespaceObject.serialize)(getBlocksByClientId(clientIds)), onCopy); 56823 const copyMenuItemLabel = label ? label : (0,external_wp_i18n_namespaceObject.__)('Copy'); 56824 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56825 ref: ref, 56826 shortcut: shortcut, 56827 children: copyMenuItemLabel 56828 }); 56829 } 56830 function BlockSettingsDropdown({ 56831 block, 56832 clientIds, 56833 children, 56834 __experimentalSelectBlock, 56835 ...props 56836 }) { 56837 // Get the client id of the current block for this menu, if one is set. 56838 const currentClientId = block?.clientId; 56839 const count = clientIds.length; 56840 const firstBlockClientId = clientIds[0]; 56841 const isZoomOut = (0,external_wp_data_namespaceObject.useSelect)(select => { 56842 const { 56843 __unstableGetEditorMode 56844 } = unlock(select(store)); 56845 return __unstableGetEditorMode() === 'zoom-out'; 56846 }); 56847 const { 56848 firstParentClientId, 56849 onlyBlock, 56850 parentBlockType, 56851 previousBlockClientId, 56852 selectedBlockClientIds, 56853 openedBlockSettingsMenu, 56854 isContentOnly 56855 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 56856 const { 56857 getBlockCount, 56858 getBlockName, 56859 getBlockRootClientId, 56860 getPreviousBlockClientId, 56861 getSelectedBlockClientIds, 56862 getBlockAttributes, 56863 getOpenedBlockSettingsMenu, 56864 getBlockEditingMode 56865 } = unlock(select(store)); 56866 const { 56867 getActiveBlockVariation 56868 } = select(external_wp_blocks_namespaceObject.store); 56869 const _firstParentClientId = getBlockRootClientId(firstBlockClientId); 56870 const parentBlockName = _firstParentClientId && getBlockName(_firstParentClientId); 56871 return { 56872 firstParentClientId: _firstParentClientId, 56873 onlyBlock: 1 === getBlockCount(_firstParentClientId), 56874 parentBlockType: _firstParentClientId && (getActiveBlockVariation(parentBlockName, getBlockAttributes(_firstParentClientId)) || (0,external_wp_blocks_namespaceObject.getBlockType)(parentBlockName)), 56875 previousBlockClientId: getPreviousBlockClientId(firstBlockClientId), 56876 selectedBlockClientIds: getSelectedBlockClientIds(), 56877 openedBlockSettingsMenu: getOpenedBlockSettingsMenu(), 56878 isContentOnly: getBlockEditingMode(firstBlockClientId) === 'contentOnly' 56879 }; 56880 }, [firstBlockClientId]); 56881 const { 56882 getBlockOrder, 56883 getSelectedBlockClientIds 56884 } = (0,external_wp_data_namespaceObject.useSelect)(store); 56885 const { 56886 setOpenedBlockSettingsMenu 56887 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 56888 const shortcuts = (0,external_wp_data_namespaceObject.useSelect)(select => { 56889 const { 56890 getShortcutRepresentation 56891 } = select(external_wp_keyboardShortcuts_namespaceObject.store); 56892 return { 56893 duplicate: getShortcutRepresentation('core/block-editor/duplicate'), 56894 remove: getShortcutRepresentation('core/block-editor/remove'), 56895 insertAfter: getShortcutRepresentation('core/block-editor/insert-after'), 56896 insertBefore: getShortcutRepresentation('core/block-editor/insert-before') 56897 }; 56898 }, []); 56899 const hasSelectedBlocks = selectedBlockClientIds.length > 0; 56900 async function updateSelectionAfterDuplicate(clientIdsPromise) { 56901 if (!__experimentalSelectBlock) { 56902 return; 56903 } 56904 const ids = await clientIdsPromise; 56905 if (ids && ids[0]) { 56906 __experimentalSelectBlock(ids[0], false); 56907 } 56908 } 56909 function updateSelectionAfterRemove() { 56910 if (!__experimentalSelectBlock) { 56911 return; 56912 } 56913 let blockToFocus = previousBlockClientId || firstParentClientId; 56914 56915 // Focus the first block if there's no previous block nor parent block. 56916 if (!blockToFocus) { 56917 blockToFocus = getBlockOrder()[0]; 56918 } 56919 56920 // Only update the selection if the original selection is removed. 56921 const shouldUpdateSelection = hasSelectedBlocks && getSelectedBlockClientIds().length === 0; 56922 __experimentalSelectBlock(blockToFocus, shouldUpdateSelection); 56923 } 56924 56925 // This can occur when the selected block (the parent) 56926 // displays child blocks within a List View. 56927 const parentBlockIsSelected = selectedBlockClientIds?.includes(firstParentClientId); 56928 56929 // When a currentClientId is in use, treat the menu as a controlled component. 56930 // This ensures that only one block settings menu is open at a time. 56931 // This is a temporary solution to work around an issue with `onFocusOutside` 56932 // where it does not allow a dropdown to be closed if focus was never within 56933 // the dropdown to begin with. Examples include a user either CMD+Clicking or 56934 // right clicking into an inactive window. 56935 // See: https://github.com/WordPress/gutenberg/pull/54083 56936 const open = !currentClientId ? undefined : openedBlockSettingsMenu === currentClientId || false; 56937 function onToggle(localOpen) { 56938 if (localOpen && openedBlockSettingsMenu !== currentClientId) { 56939 setOpenedBlockSettingsMenu(currentClientId); 56940 } else if (!localOpen && openedBlockSettingsMenu && openedBlockSettingsMenu === currentClientId) { 56941 setOpenedBlockSettingsMenu(undefined); 56942 } 56943 } 56944 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockActions, { 56945 clientIds: clientIds, 56946 __experimentalUpdateSelection: !__experimentalSelectBlock, 56947 children: ({ 56948 canCopyStyles, 56949 canDuplicate, 56950 canInsertBlock, 56951 canMove, 56952 canRemove, 56953 onDuplicate, 56954 onInsertAfter, 56955 onInsertBefore, 56956 onRemove, 56957 onCopy, 56958 onPasteStyles, 56959 onMoveTo 56960 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropdownMenu, { 56961 icon: more_vertical, 56962 label: (0,external_wp_i18n_namespaceObject.__)('Options'), 56963 className: "block-editor-block-settings-menu", 56964 popoverProps: block_settings_dropdown_POPOVER_PROPS, 56965 open: open, 56966 onToggle: onToggle, 56967 noIcons: true, 56968 ...props, 56969 children: ({ 56970 onClose 56971 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 56972 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuGroup, { 56973 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_settings_menu_first_item.Slot, { 56974 fillProps: { 56975 onClose 56976 } 56977 }), !parentBlockIsSelected && !!firstParentClientId && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockParentSelectorMenuItem, { 56978 parentClientId: firstParentClientId, 56979 parentBlockType: parentBlockType 56980 }), count === 1 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_html_convert_button, { 56981 clientId: firstBlockClientId 56982 }), (!isContentOnly || isZoomOut) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CopyMenuItem, { 56983 clientIds: clientIds, 56984 onCopy: onCopy, 56985 shortcut: external_wp_keycodes_namespaceObject.displayShortcut.primary('c') 56986 }), canDuplicate && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56987 onClick: (0,external_wp_compose_namespaceObject.pipe)(onClose, onDuplicate, updateSelectionAfterDuplicate), 56988 shortcut: shortcuts.duplicate, 56989 children: (0,external_wp_i18n_namespaceObject.__)('Duplicate') 56990 }), canInsertBlock && !isContentOnly && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 56991 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56992 onClick: (0,external_wp_compose_namespaceObject.pipe)(onClose, onInsertBefore), 56993 shortcut: shortcuts.insertBefore, 56994 children: (0,external_wp_i18n_namespaceObject.__)('Add before') 56995 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 56996 onClick: (0,external_wp_compose_namespaceObject.pipe)(onClose, onInsertAfter), 56997 shortcut: shortcuts.insertAfter, 56998 children: (0,external_wp_i18n_namespaceObject.__)('Add after') 56999 })] 57000 })] 57001 }), canCopyStyles && !isContentOnly && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuGroup, { 57002 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CopyMenuItem, { 57003 clientIds: clientIds, 57004 onCopy: onCopy, 57005 label: (0,external_wp_i18n_namespaceObject.__)('Copy styles') 57006 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 57007 onClick: onPasteStyles, 57008 children: (0,external_wp_i18n_namespaceObject.__)('Paste styles') 57009 })] 57010 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_settings_menu_controls.Slot, { 57011 fillProps: { 57012 onClose, 57013 canMove, 57014 onMoveTo, 57015 onlyBlock, 57016 count, 57017 firstBlockClientId 57018 }, 57019 clientIds: clientIds 57020 }), typeof children === 'function' ? children({ 57021 onClose 57022 }) : external_wp_element_namespaceObject.Children.map(child => (0,external_wp_element_namespaceObject.cloneElement)(child, { 57023 onClose 57024 })), canRemove && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 57025 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 57026 onClick: (0,external_wp_compose_namespaceObject.pipe)(onClose, onRemove, updateSelectionAfterRemove), 57027 shortcut: shortcuts.remove, 57028 children: (0,external_wp_i18n_namespaceObject.__)('Delete') 57029 }) 57030 })] 57031 }) 57032 }) 57033 }); 57034 } 57035 /* harmony default export */ const block_settings_dropdown = (BlockSettingsDropdown); 57036 57037 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-settings-menu/index.js 57038 /** 57039 * WordPress dependencies 57040 */ 57041 57042 57043 /** 57044 * Internal dependencies 57045 */ 57046 57047 57048 function BlockSettingsMenu({ 57049 clientIds, 57050 ...props 57051 }) { 57052 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 57053 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarItem, { 57054 children: toggleProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_settings_dropdown, { 57055 clientIds: clientIds, 57056 toggleProps: toggleProps, 57057 ...props 57058 }) 57059 }) 57060 }); 57061 } 57062 /* harmony default export */ const block_settings_menu = (BlockSettingsMenu); 57063 57064 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-lock/toolbar.js 57065 /** 57066 * WordPress dependencies 57067 */ 57068 57069 57070 57071 57072 57073 /** 57074 * Internal dependencies 57075 */ 57076 57077 57078 57079 57080 57081 function BlockLockToolbar({ 57082 clientId 57083 }) { 57084 const { 57085 canLock, 57086 isLocked 57087 } = useBlockLock(clientId); 57088 const [isModalOpen, toggleModal] = (0,external_wp_element_namespaceObject.useReducer)(isActive => !isActive, false); 57089 const hasLockButtonShownRef = (0,external_wp_element_namespaceObject.useRef)(false); 57090 57091 // If the block lock button has been shown, we don't want to remove it 57092 // from the toolbar until the toolbar is rendered again without it. 57093 // Removing it beforehand can cause focus loss issues, such as when 57094 // unlocking the block from the modal. It needs to return focus from 57095 // whence it came, and to do that, we need to leave the button in the toolbar. 57096 (0,external_wp_element_namespaceObject.useEffect)(() => { 57097 if (isLocked) { 57098 hasLockButtonShownRef.current = true; 57099 } 57100 }, [isLocked]); 57101 if (!isLocked && !hasLockButtonShownRef.current) { 57102 return null; 57103 } 57104 let label = isLocked ? (0,external_wp_i18n_namespaceObject.__)('Unlock') : (0,external_wp_i18n_namespaceObject.__)('Lock'); 57105 if (!canLock && isLocked) { 57106 label = (0,external_wp_i18n_namespaceObject.__)('Locked'); 57107 } 57108 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 57109 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 57110 className: "block-editor-block-lock-toolbar", 57111 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 57112 disabled: !canLock, 57113 icon: isLocked ? library_lock : library_unlock, 57114 label: label, 57115 onClick: toggleModal, 57116 "aria-expanded": isModalOpen, 57117 "aria-haspopup": "dialog" 57118 }) 57119 }), isModalOpen && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockLockModal, { 57120 clientId: clientId, 57121 onClose: toggleModal 57122 })] 57123 }); 57124 } 57125 57126 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/group.js 57127 /** 57128 * WordPress dependencies 57129 */ 57130 57131 57132 const group_group = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 57133 viewBox: "0 0 24 24", 57134 xmlns: "http://www.w3.org/2000/svg", 57135 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 57136 d: "M18 4h-7c-1.1 0-2 .9-2 2v3H6c-1.1 0-2 .9-2 2v7c0 1.1.9 2 2 2h7c1.1 0 2-.9 2-2v-3h3c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-4.5 14c0 .3-.2.5-.5.5H6c-.3 0-.5-.2-.5-.5v-7c0-.3.2-.5.5-.5h3V13c0 1.1.9 2 2 2h2.5v3zm0-4.5H11c-.3 0-.5-.2-.5-.5v-2.5H13c.3 0 .5.2.5.5v2.5zm5-.5c0 .3-.2.5-.5.5h-3V11c0-1.1-.9-2-2-2h-2.5V6c0-.3.2-.5.5-.5h7c.3 0 .5.2.5.5v7z" 57137 }) 57138 }); 57139 /* harmony default export */ const library_group = (group_group); 57140 57141 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/row.js 57142 /** 57143 * WordPress dependencies 57144 */ 57145 57146 57147 const row = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 57148 xmlns: "http://www.w3.org/2000/svg", 57149 viewBox: "0 0 24 24", 57150 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 57151 d: "M4 6.5h5a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H4V16h5a.5.5 0 0 0 .5-.5v-7A.5.5 0 0 0 9 8H4V6.5Zm16 0h-5a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h5V16h-5a.5.5 0 0 1-.5-.5v-7A.5.5 0 0 1 15 8h5V6.5Z" 57152 }) 57153 }); 57154 /* harmony default export */ const library_row = (row); 57155 57156 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/stack.js 57157 /** 57158 * WordPress dependencies 57159 */ 57160 57161 57162 const stack = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 57163 xmlns: "http://www.w3.org/2000/svg", 57164 viewBox: "0 0 24 24", 57165 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 57166 d: "M17.5 4v5a2 2 0 0 1-2 2h-7a2 2 0 0 1-2-2V4H8v5a.5.5 0 0 0 .5.5h7A.5.5 0 0 0 16 9V4h1.5Zm0 16v-5a2 2 0 0 0-2-2h-7a2 2 0 0 0-2 2v5H8v-5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v5h1.5Z" 57167 }) 57168 }); 57169 /* harmony default export */ const library_stack = (stack); 57170 57171 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/grid.js 57172 /** 57173 * WordPress dependencies 57174 */ 57175 57176 57177 const grid_grid = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 57178 xmlns: "http://www.w3.org/2000/svg", 57179 viewBox: "0 0 24 24", 57180 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 57181 d: "m3 5c0-1.10457.89543-2 2-2h13.5c1.1046 0 2 .89543 2 2v13.5c0 1.1046-.8954 2-2 2h-13.5c-1.10457 0-2-.8954-2-2zm2-.5h6v6.5h-6.5v-6c0-.27614.22386-.5.5-.5zm-.5 8v6c0 .2761.22386.5.5.5h6v-6.5zm8 0v6.5h6c.2761 0 .5-.2239.5-.5v-6zm0-8v6.5h6.5v-6c0-.27614-.2239-.5-.5-.5z", 57182 fillRule: "evenodd", 57183 clipRule: "evenodd" 57184 }) 57185 }); 57186 /* harmony default export */ const library_grid = (grid_grid); 57187 57188 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/convert-to-group-buttons/toolbar.js 57189 /** 57190 * WordPress dependencies 57191 */ 57192 57193 57194 57195 57196 57197 57198 /** 57199 * Internal dependencies 57200 */ 57201 57202 57203 57204 57205 const layouts = { 57206 group: { 57207 type: 'constrained' 57208 }, 57209 row: { 57210 type: 'flex', 57211 flexWrap: 'nowrap' 57212 }, 57213 stack: { 57214 type: 'flex', 57215 orientation: 'vertical' 57216 }, 57217 grid: { 57218 type: 'grid' 57219 } 57220 }; 57221 function BlockGroupToolbar() { 57222 const { 57223 blocksSelection, 57224 clientIds, 57225 groupingBlockName, 57226 isGroupable 57227 } = useConvertToGroupButtonProps(); 57228 const { 57229 replaceBlocks 57230 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 57231 const { 57232 canRemove, 57233 variations 57234 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 57235 const { 57236 canRemoveBlocks 57237 } = select(store); 57238 const { 57239 getBlockVariations 57240 } = select(external_wp_blocks_namespaceObject.store); 57241 return { 57242 canRemove: canRemoveBlocks(clientIds), 57243 variations: getBlockVariations(groupingBlockName, 'transform') 57244 }; 57245 }, [clientIds, groupingBlockName]); 57246 const onConvertToGroup = layout => { 57247 const newBlocks = (0,external_wp_blocks_namespaceObject.switchToBlockType)(blocksSelection, groupingBlockName); 57248 if (typeof layout !== 'string') { 57249 layout = 'group'; 57250 } 57251 if (newBlocks && newBlocks.length > 0) { 57252 // Because the block is not in the store yet we can't use 57253 // updateBlockAttributes so need to manually update attributes. 57254 newBlocks[0].attributes.layout = layouts[layout]; 57255 replaceBlocks(clientIds, newBlocks); 57256 } 57257 }; 57258 const onConvertToRow = () => onConvertToGroup('row'); 57259 const onConvertToStack = () => onConvertToGroup('stack'); 57260 const onConvertToGrid = () => onConvertToGroup('grid'); 57261 57262 // Don't render the button if the current selection cannot be grouped. 57263 // A good example is selecting multiple button blocks within a Buttons block: 57264 // The group block is not a valid child of Buttons, so we should not show the button. 57265 // Any blocks that are locked against removal also cannot be grouped. 57266 if (!isGroupable || !canRemove) { 57267 return null; 57268 } 57269 const canInsertRow = !!variations.find(({ 57270 name 57271 }) => name === 'group-row'); 57272 const canInsertStack = !!variations.find(({ 57273 name 57274 }) => name === 'group-stack'); 57275 const canInsertGrid = !!variations.find(({ 57276 name 57277 }) => name === 'group-grid'); 57278 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.ToolbarGroup, { 57279 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 57280 icon: library_group, 57281 label: (0,external_wp_i18n_namespaceObject._x)('Group', 'verb'), 57282 onClick: onConvertToGroup 57283 }), canInsertRow && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 57284 icon: library_row, 57285 label: (0,external_wp_i18n_namespaceObject._x)('Row', 'single horizontal line'), 57286 onClick: onConvertToRow 57287 }), canInsertStack && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 57288 icon: library_stack, 57289 label: (0,external_wp_i18n_namespaceObject._x)('Stack', 'verb'), 57290 onClick: onConvertToStack 57291 }), canInsertGrid && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 57292 icon: library_grid, 57293 label: (0,external_wp_i18n_namespaceObject._x)('Grid', 'verb'), 57294 onClick: onConvertToGrid 57295 })] 57296 }); 57297 } 57298 /* harmony default export */ const toolbar = (BlockGroupToolbar); 57299 57300 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-edit-visually-button/index.js 57301 /** 57302 * WordPress dependencies 57303 */ 57304 57305 57306 57307 57308 /** 57309 * Internal dependencies 57310 */ 57311 57312 57313 function BlockEditVisuallyButton({ 57314 clientIds 57315 }) { 57316 // Edit visually only works for single block selection. 57317 const clientId = clientIds.length === 1 ? clientIds[0] : undefined; 57318 const canEditVisually = (0,external_wp_data_namespaceObject.useSelect)(select => !!clientId && select(store).getBlockMode(clientId) === 'html', [clientId]); 57319 const { 57320 toggleBlockMode 57321 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 57322 if (!canEditVisually) { 57323 return null; 57324 } 57325 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 57326 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 57327 onClick: () => { 57328 toggleBlockMode(clientId); 57329 }, 57330 children: (0,external_wp_i18n_namespaceObject.__)('Edit visually') 57331 }) 57332 }); 57333 } 57334 57335 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-toolbar/block-name-context.js 57336 /** 57337 * WordPress dependencies 57338 */ 57339 57340 const __unstableBlockNameContext = (0,external_wp_element_namespaceObject.createContext)(''); 57341 /* harmony default export */ const block_name_context = (__unstableBlockNameContext); 57342 57343 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/navigable-toolbar/index.js 57344 /** 57345 * WordPress dependencies 57346 */ 57347 57348 57349 57350 57351 57352 57353 57354 57355 /** 57356 * Internal dependencies 57357 */ 57358 57359 57360 57361 function hasOnlyToolbarItem(elements) { 57362 const dataProp = 'toolbarItem'; 57363 return !elements.some(element => !(dataProp in element.dataset)); 57364 } 57365 function getAllFocusableToolbarItemsIn(container) { 57366 return Array.from(container.querySelectorAll('[data-toolbar-item]:not([disabled])')); 57367 } 57368 function hasFocusWithin(container) { 57369 return container.contains(container.ownerDocument.activeElement); 57370 } 57371 function focusFirstTabbableIn(container) { 57372 const [firstTabbable] = external_wp_dom_namespaceObject.focus.tabbable.find(container); 57373 if (firstTabbable) { 57374 firstTabbable.focus({ 57375 // When focusing newly mounted toolbars, 57376 // the position of the popover is often not right on the first render 57377 // This prevents the layout shifts when focusing the dialogs. 57378 preventScroll: true 57379 }); 57380 } 57381 } 57382 function useIsAccessibleToolbar(toolbarRef) { 57383 /* 57384 * By default, we'll assume the starting accessible state of the Toolbar 57385 * is true, as it seems to be the most common case. 57386 * 57387 * Transitioning from an (initial) false to true state causes the 57388 * <Toolbar /> component to mount twice, which is causing undesired 57389 * side-effects. These side-effects appear to only affect certain 57390 * E2E tests. 57391 * 57392 * This was initial discovered in this pull-request: 57393 * https://github.com/WordPress/gutenberg/pull/23425 57394 */ 57395 const initialAccessibleToolbarState = true; 57396 57397 // By default, it's gonna render NavigableMenu. If all the tabbable elements 57398 // inside the toolbar are ToolbarItem components (or derived components like 57399 // ToolbarButton), then we can wrap them with the accessible Toolbar 57400 // component. 57401 const [isAccessibleToolbar, setIsAccessibleToolbar] = (0,external_wp_element_namespaceObject.useState)(initialAccessibleToolbarState); 57402 const determineIsAccessibleToolbar = (0,external_wp_element_namespaceObject.useCallback)(() => { 57403 const tabbables = external_wp_dom_namespaceObject.focus.tabbable.find(toolbarRef.current); 57404 const onlyToolbarItem = hasOnlyToolbarItem(tabbables); 57405 if (!onlyToolbarItem) { 57406 external_wp_deprecated_default()('Using custom components as toolbar controls', { 57407 since: '5.6', 57408 alternative: 'ToolbarItem, ToolbarButton or ToolbarDropdownMenu components', 57409 link: 'https://developer.wordpress.org/block-editor/components/toolbar-button/#inside-blockcontrols' 57410 }); 57411 } 57412 setIsAccessibleToolbar(onlyToolbarItem); 57413 }, [toolbarRef]); 57414 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 57415 // Toolbar buttons may be rendered asynchronously, so we use 57416 // MutationObserver to check if the toolbar subtree has been modified. 57417 const observer = new window.MutationObserver(determineIsAccessibleToolbar); 57418 observer.observe(toolbarRef.current, { 57419 childList: true, 57420 subtree: true 57421 }); 57422 return () => observer.disconnect(); 57423 }, [determineIsAccessibleToolbar, isAccessibleToolbar, toolbarRef]); 57424 return isAccessibleToolbar; 57425 } 57426 function useToolbarFocus({ 57427 toolbarRef, 57428 focusOnMount, 57429 isAccessibleToolbar, 57430 defaultIndex, 57431 onIndexChange, 57432 shouldUseKeyboardFocusShortcut, 57433 focusEditorOnEscape 57434 }) { 57435 // Make sure we don't use modified versions of this prop. 57436 const [initialFocusOnMount] = (0,external_wp_element_namespaceObject.useState)(focusOnMount); 57437 const [initialIndex] = (0,external_wp_element_namespaceObject.useState)(defaultIndex); 57438 const focusToolbar = (0,external_wp_element_namespaceObject.useCallback)(() => { 57439 focusFirstTabbableIn(toolbarRef.current); 57440 }, [toolbarRef]); 57441 const focusToolbarViaShortcut = () => { 57442 if (shouldUseKeyboardFocusShortcut) { 57443 focusToolbar(); 57444 } 57445 }; 57446 57447 // Focus on toolbar when pressing alt+F10 when the toolbar is visible. 57448 (0,external_wp_keyboardShortcuts_namespaceObject.useShortcut)('core/block-editor/focus-toolbar', focusToolbarViaShortcut); 57449 (0,external_wp_element_namespaceObject.useEffect)(() => { 57450 if (initialFocusOnMount) { 57451 focusToolbar(); 57452 } 57453 }, [isAccessibleToolbar, initialFocusOnMount, focusToolbar]); 57454 (0,external_wp_element_namespaceObject.useEffect)(() => { 57455 // Store ref so we have access on useEffect cleanup: https://legacy.reactjs.org/blog/2020/08/10/react-v17-rc.html#effect-cleanup-timing 57456 const navigableToolbarRef = toolbarRef.current; 57457 // If initialIndex is passed, we focus on that toolbar item when the 57458 // toolbar gets mounted and initial focus is not forced. 57459 // We have to wait for the next browser paint because block controls aren't 57460 // rendered right away when the toolbar gets mounted. 57461 let raf = 0; 57462 57463 // If the toolbar already had focus before the render, we don't want to move it. 57464 // https://github.com/WordPress/gutenberg/issues/58511 57465 if (!initialFocusOnMount && !hasFocusWithin(navigableToolbarRef)) { 57466 raf = window.requestAnimationFrame(() => { 57467 const items = getAllFocusableToolbarItemsIn(navigableToolbarRef); 57468 const index = initialIndex || 0; 57469 if (items[index] && hasFocusWithin(navigableToolbarRef)) { 57470 items[index].focus({ 57471 // When focusing newly mounted toolbars, 57472 // the position of the popover is often not right on the first render 57473 // This prevents the layout shifts when focusing the dialogs. 57474 preventScroll: true 57475 }); 57476 } 57477 }); 57478 } 57479 return () => { 57480 window.cancelAnimationFrame(raf); 57481 if (!onIndexChange || !navigableToolbarRef) { 57482 return; 57483 } 57484 // When the toolbar element is unmounted and onIndexChange is passed, we 57485 // pass the focused toolbar item index so it can be hydrated later. 57486 const items = getAllFocusableToolbarItemsIn(navigableToolbarRef); 57487 const index = items.findIndex(item => item.tabIndex === 0); 57488 onIndexChange(index); 57489 }; 57490 }, [initialIndex, initialFocusOnMount, onIndexChange, toolbarRef]); 57491 const { 57492 getLastFocus 57493 } = unlock((0,external_wp_data_namespaceObject.useSelect)(store)); 57494 /** 57495 * Handles returning focus to the block editor canvas when pressing escape. 57496 */ 57497 (0,external_wp_element_namespaceObject.useEffect)(() => { 57498 const navigableToolbarRef = toolbarRef.current; 57499 if (focusEditorOnEscape) { 57500 const handleKeyDown = event => { 57501 const lastFocus = getLastFocus(); 57502 if (event.keyCode === external_wp_keycodes_namespaceObject.ESCAPE && lastFocus?.current) { 57503 // Focus the last focused element when pressing escape. 57504 event.preventDefault(); 57505 lastFocus.current.focus(); 57506 } 57507 }; 57508 navigableToolbarRef.addEventListener('keydown', handleKeyDown); 57509 return () => { 57510 navigableToolbarRef.removeEventListener('keydown', handleKeyDown); 57511 }; 57512 } 57513 }, [focusEditorOnEscape, getLastFocus, toolbarRef]); 57514 } 57515 function NavigableToolbar({ 57516 children, 57517 focusOnMount, 57518 focusEditorOnEscape = false, 57519 shouldUseKeyboardFocusShortcut = true, 57520 __experimentalInitialIndex: initialIndex, 57521 __experimentalOnIndexChange: onIndexChange, 57522 orientation = 'horizontal', 57523 ...props 57524 }) { 57525 const toolbarRef = (0,external_wp_element_namespaceObject.useRef)(); 57526 const isAccessibleToolbar = useIsAccessibleToolbar(toolbarRef); 57527 useToolbarFocus({ 57528 toolbarRef, 57529 focusOnMount, 57530 defaultIndex: initialIndex, 57531 onIndexChange, 57532 isAccessibleToolbar, 57533 shouldUseKeyboardFocusShortcut, 57534 focusEditorOnEscape 57535 }); 57536 if (isAccessibleToolbar) { 57537 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Toolbar, { 57538 label: props['aria-label'], 57539 ref: toolbarRef, 57540 orientation: orientation, 57541 ...props, 57542 children: children 57543 }); 57544 } 57545 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.NavigableMenu, { 57546 orientation: orientation, 57547 role: "toolbar", 57548 ref: toolbarRef, 57549 ...props, 57550 children: children 57551 }); 57552 } 57553 57554 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-controls/use-has-block-controls.js 57555 /** 57556 * WordPress dependencies 57557 */ 57558 57559 57560 57561 /** 57562 * Internal dependencies 57563 */ 57564 57565 function useHasAnyBlockControls() { 57566 let hasAnyBlockControls = false; 57567 for (const group in block_controls_groups) { 57568 // It is safe to violate the rules of hooks here as the `groups` object 57569 // is static and will not change length between renders. Do not return 57570 // early as that will cause the hook to be called a different number of 57571 // times between renders. 57572 // eslint-disable-next-line react-hooks/rules-of-hooks 57573 if (useHasBlockControls(group)) { 57574 hasAnyBlockControls = true; 57575 } 57576 } 57577 return hasAnyBlockControls; 57578 } 57579 function useHasBlockControls(group = 'default') { 57580 const Slot = block_controls_groups[group]?.Slot; 57581 const fills = (0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(Slot?.__unstableName); 57582 if (!Slot) { 57583 true ? external_wp_warning_default()(`Unknown BlockControls group "$group}" provided.`) : 0; 57584 return null; 57585 } 57586 return !!fills?.length; 57587 } 57588 57589 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-toolbar/use-has-block-toolbar.js 57590 /** 57591 * WordPress dependencies 57592 */ 57593 57594 57595 /** 57596 * Internal dependencies 57597 */ 57598 57599 57600 57601 /** 57602 * Returns true if the block toolbar should be shown. 57603 * 57604 * @return {boolean} Whether the block toolbar component will be rendered. 57605 */ 57606 function useHasBlockToolbar() { 57607 const { 57608 isToolbarEnabled, 57609 isBlockDisabled 57610 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 57611 const { 57612 getBlockEditingMode, 57613 getBlockName, 57614 getBlockSelectionStart 57615 } = select(store); 57616 57617 // we only care about the 1st selected block 57618 // for the toolbar, so we use getBlockSelectionStart 57619 // instead of getSelectedBlockClientIds 57620 const selectedBlockClientId = getBlockSelectionStart(); 57621 const blockType = selectedBlockClientId && (0,external_wp_blocks_namespaceObject.getBlockType)(getBlockName(selectedBlockClientId)); 57622 return { 57623 isToolbarEnabled: blockType && (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, '__experimentalToolbar', true), 57624 isBlockDisabled: getBlockEditingMode(selectedBlockClientId) === 'disabled' 57625 }; 57626 }, []); 57627 const hasAnyBlockControls = useHasAnyBlockControls(); 57628 if (!isToolbarEnabled || isBlockDisabled && !hasAnyBlockControls) { 57629 return false; 57630 } 57631 return true; 57632 } 57633 57634 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/shuffle.js 57635 /** 57636 * WordPress dependencies 57637 */ 57638 57639 57640 const shuffle = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 57641 viewBox: "0 0 24 24", 57642 xmlns: "http://www.w3.org/2000/SVG", 57643 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 57644 d: "M17.192 6.75L15.47 5.03l1.06-1.06 3.537 3.53-3.537 3.53-1.06-1.06 1.723-1.72h-3.19c-.602 0-.993.202-1.28.498-.309.319-.538.792-.695 1.383-.13.488-.222 1.023-.296 1.508-.034.664-.116 1.413-.303 2.117-.193.721-.513 1.467-1.068 2.04-.575.594-1.359.954-2.357.954H4v-1.5h4.003c.601 0 .993-.202 1.28-.498.308-.319.538-.792.695-1.383.149-.557.216-1.093.288-1.662l.039-.31a9.653 9.653 0 0 1 .272-1.653c.193-.722.513-1.467 1.067-2.04.576-.594 1.36-.954 2.358-.954h3.19zM8.004 6.75c.8 0 1.46.23 1.988.628a6.24 6.24 0 0 0-.684 1.396 1.725 1.725 0 0 0-.024-.026c-.287-.296-.679-.498-1.28-.498H4v-1.5h4.003zM12.699 14.726c-.161.459-.38.94-.684 1.396.527.397 1.188.628 1.988.628h3.19l-1.722 1.72 1.06 1.06L20.067 16l-3.537-3.53-1.06 1.06 1.723 1.72h-3.19c-.602 0-.993-.202-1.28-.498a1.96 1.96 0 0 1-.024-.026z" 57645 }) 57646 }); 57647 /* harmony default export */ const library_shuffle = (shuffle); 57648 57649 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-toolbar/shuffle.js 57650 /** 57651 * WordPress dependencies 57652 */ 57653 57654 57655 57656 57657 57658 57659 /** 57660 * Internal dependencies 57661 */ 57662 57663 57664 const shuffle_EMPTY_ARRAY = []; 57665 function shuffle_Container(props) { 57666 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 57667 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 57668 ...props 57669 }) 57670 }); 57671 } 57672 function Shuffle({ 57673 clientId, 57674 as = shuffle_Container 57675 }) { 57676 const { 57677 categories, 57678 patterns, 57679 patternName 57680 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 57681 const { 57682 getBlockAttributes, 57683 getBlockRootClientId, 57684 __experimentalGetAllowedPatterns 57685 } = select(store); 57686 const attributes = getBlockAttributes(clientId); 57687 const _categories = attributes?.metadata?.categories || shuffle_EMPTY_ARRAY; 57688 const _patternName = attributes?.metadata?.patternName; 57689 const rootBlock = getBlockRootClientId(clientId); 57690 57691 // Calling `__experimentalGetAllowedPatterns` is expensive. 57692 // Checking if the block can be shuffled prevents unnecessary selector calls. 57693 // See: https://github.com/WordPress/gutenberg/pull/64736. 57694 const _patterns = _categories.length > 0 ? __experimentalGetAllowedPatterns(rootBlock) : shuffle_EMPTY_ARRAY; 57695 return { 57696 categories: _categories, 57697 patterns: _patterns, 57698 patternName: _patternName 57699 }; 57700 }, [clientId]); 57701 const { 57702 replaceBlocks 57703 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 57704 const sameCategoryPatternsWithSingleWrapper = (0,external_wp_element_namespaceObject.useMemo)(() => { 57705 if (categories.length === 0 || !patterns || patterns.length === 0) { 57706 return shuffle_EMPTY_ARRAY; 57707 } 57708 return patterns.filter(pattern => { 57709 const isCorePattern = pattern.source === 'core' || pattern.source?.startsWith('pattern-directory') && pattern.source !== 'pattern-directory/theme'; 57710 return ( 57711 // Check if the pattern has only one top level block, 57712 // otherwise we may shuffle to pattern that will not allow to continue shuffling. 57713 pattern.blocks.length === 1 && 57714 // We exclude the core patterns and pattern directory patterns that are not theme patterns. 57715 !isCorePattern && pattern.categories?.some(category => { 57716 return categories.includes(category); 57717 }) && ( 57718 // Check if the pattern is not a synced pattern. 57719 pattern.syncStatus === 'unsynced' || !pattern.id) 57720 ); 57721 }); 57722 }, [categories, patterns]); 57723 if (sameCategoryPatternsWithSingleWrapper.length < 2) { 57724 return null; 57725 } 57726 function getNextPattern() { 57727 const numberOfPatterns = sameCategoryPatternsWithSingleWrapper.length; 57728 const patternIndex = sameCategoryPatternsWithSingleWrapper.findIndex(({ 57729 name 57730 }) => name === patternName); 57731 const nextPatternIndex = patternIndex + 1 < numberOfPatterns ? patternIndex + 1 : 0; 57732 return sameCategoryPatternsWithSingleWrapper[nextPatternIndex]; 57733 } 57734 const ComponentToUse = as; 57735 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ComponentToUse, { 57736 label: (0,external_wp_i18n_namespaceObject.__)('Shuffle'), 57737 icon: library_shuffle, 57738 className: "block-editor-block-toolbar-shuffle", 57739 onClick: () => { 57740 const nextPattern = getNextPattern(); 57741 nextPattern.blocks[0].attributes = { 57742 ...nextPattern.blocks[0].attributes, 57743 metadata: { 57744 ...nextPattern.blocks[0].attributes.metadata, 57745 categories 57746 } 57747 }; 57748 replaceBlocks(clientId, nextPattern.blocks); 57749 } 57750 }); 57751 } 57752 57753 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-toolbar/index.js 57754 /** 57755 * External dependencies 57756 */ 57757 57758 57759 /** 57760 * WordPress dependencies 57761 */ 57762 57763 57764 57765 57766 57767 57768 57769 /** 57770 * Internal dependencies 57771 */ 57772 57773 57774 57775 57776 57777 57778 57779 57780 57781 57782 57783 57784 57785 57786 57787 57788 57789 /** 57790 * Renders the block toolbar. 57791 * 57792 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-toolbar/README.md 57793 * 57794 * @param {Object} props Components props. 57795 * @param {boolean} props.hideDragHandle Show or hide the Drag Handle for drag and drop functionality. 57796 * @param {boolean} props.focusOnMount Focus the toolbar when mounted. 57797 * @param {number} props.__experimentalInitialIndex The initial index of the toolbar item to focus. 57798 * @param {Function} props.__experimentalOnIndexChange Callback function to be called when the index of the focused toolbar item changes. 57799 * @param {string} props.variant Style variant of the toolbar, also passed to the Dropdowns rendered from Block Toolbar Buttons. 57800 */ 57801 57802 57803 57804 function PrivateBlockToolbar({ 57805 hideDragHandle, 57806 focusOnMount, 57807 __experimentalInitialIndex, 57808 __experimentalOnIndexChange, 57809 variant = 'unstyled' 57810 }) { 57811 const { 57812 blockClientId, 57813 blockClientIds, 57814 isDefaultEditingMode, 57815 blockType, 57816 toolbarKey, 57817 shouldShowVisualToolbar, 57818 showParentSelector, 57819 isUsingBindings, 57820 hasParentPattern, 57821 hasContentOnlyLocking, 57822 showShuffleButton, 57823 showSlots, 57824 showGroupButtons, 57825 showLockButtons 57826 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 57827 const { 57828 getBlockName, 57829 getBlockMode, 57830 getBlockParents, 57831 getSelectedBlockClientIds, 57832 isBlockValid, 57833 getBlockEditingMode, 57834 getBlockAttributes, 57835 getBlockParentsByBlockName, 57836 getTemplateLock, 57837 isZoomOutMode 57838 } = unlock(select(store)); 57839 const selectedBlockClientIds = getSelectedBlockClientIds(); 57840 const selectedBlockClientId = selectedBlockClientIds[0]; 57841 const parents = getBlockParents(selectedBlockClientId); 57842 const firstParentClientId = parents[parents.length - 1]; 57843 const parentBlockName = getBlockName(firstParentClientId); 57844 const parentBlockType = (0,external_wp_blocks_namespaceObject.getBlockType)(parentBlockName); 57845 const editingMode = getBlockEditingMode(selectedBlockClientId); 57846 const _isDefaultEditingMode = editingMode === 'default'; 57847 const _blockName = getBlockName(selectedBlockClientId); 57848 const isValid = selectedBlockClientIds.every(id => isBlockValid(id)); 57849 const isVisual = selectedBlockClientIds.every(id => getBlockMode(id) === 'visual'); 57850 const _isUsingBindings = selectedBlockClientIds.every(clientId => !!getBlockAttributes(clientId)?.metadata?.bindings); 57851 const _hasParentPattern = selectedBlockClientIds.every(clientId => getBlockParentsByBlockName(clientId, 'core/block', true).length > 0); 57852 57853 // If one or more selected blocks are locked, do not show the BlockGroupToolbar. 57854 const _hasTemplateLock = selectedBlockClientIds.some(id => getTemplateLock(id) === 'contentOnly'); 57855 return { 57856 blockClientId: selectedBlockClientId, 57857 blockClientIds: selectedBlockClientIds, 57858 isDefaultEditingMode: _isDefaultEditingMode, 57859 blockType: selectedBlockClientId && (0,external_wp_blocks_namespaceObject.getBlockType)(_blockName), 57860 shouldShowVisualToolbar: isValid && isVisual, 57861 toolbarKey: `$selectedBlockClientId}$firstParentClientId}`, 57862 showParentSelector: !isZoomOutMode() && parentBlockType && getBlockEditingMode(firstParentClientId) === 'default' && (0,external_wp_blocks_namespaceObject.hasBlockSupport)(parentBlockType, '__experimentalParentSelector', true) && selectedBlockClientIds.length === 1 && _isDefaultEditingMode, 57863 isUsingBindings: _isUsingBindings, 57864 hasParentPattern: _hasParentPattern, 57865 hasContentOnlyLocking: _hasTemplateLock, 57866 showShuffleButton: isZoomOutMode(), 57867 showSlots: !isZoomOutMode(), 57868 showGroupButtons: !isZoomOutMode(), 57869 showLockButtons: !isZoomOutMode() 57870 }; 57871 }, []); 57872 const toolbarWrapperRef = (0,external_wp_element_namespaceObject.useRef)(null); 57873 57874 // Handles highlighting the current block outline on hover or focus of the 57875 // block type toolbar area. 57876 const nodeRef = (0,external_wp_element_namespaceObject.useRef)(); 57877 const showHoveredOrFocusedGestures = useShowHoveredOrFocusedGestures({ 57878 ref: nodeRef 57879 }); 57880 const isLargeViewport = !(0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 57881 const hasBlockToolbar = useHasBlockToolbar(); 57882 if (!hasBlockToolbar) { 57883 return null; 57884 } 57885 const isMultiToolbar = blockClientIds.length > 1; 57886 const isSynced = (0,external_wp_blocks_namespaceObject.isReusableBlock)(blockType) || (0,external_wp_blocks_namespaceObject.isTemplatePart)(blockType); 57887 57888 // Shifts the toolbar to make room for the parent block selector. 57889 const classes = dist_clsx('block-editor-block-contextual-toolbar', { 57890 'has-parent': showParentSelector 57891 }); 57892 const innerClasses = dist_clsx('block-editor-block-toolbar', { 57893 'is-synced': isSynced, 57894 'is-connected': isUsingBindings 57895 }); 57896 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigableToolbar, { 57897 focusEditorOnEscape: true, 57898 className: classes 57899 /* translators: accessibility text for the block toolbar */, 57900 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Block tools') 57901 // The variant is applied as "toolbar" when undefined, which is the black border style of the dropdown from the toolbar popover. 57902 , 57903 variant: variant === 'toolbar' ? undefined : variant, 57904 focusOnMount: focusOnMount, 57905 __experimentalInitialIndex: __experimentalInitialIndex, 57906 __experimentalOnIndexChange: __experimentalOnIndexChange 57907 // Resets the index whenever the active block changes so 57908 // this is not persisted. See https://github.com/WordPress/gutenberg/pull/25760#issuecomment-717906169 57909 , 57910 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 57911 ref: toolbarWrapperRef, 57912 className: innerClasses, 57913 children: [showParentSelector && !isMultiToolbar && isLargeViewport && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockParentSelector, {}), (shouldShowVisualToolbar || isMultiToolbar) && !hasParentPattern && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 57914 ref: nodeRef, 57915 ...showHoveredOrFocusedGestures, 57916 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.ToolbarGroup, { 57917 className: "block-editor-block-toolbar__block-controls", 57918 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_switcher, { 57919 clientIds: blockClientIds, 57920 disabled: !isDefaultEditingMode, 57921 isUsingBindings: isUsingBindings 57922 }), !isMultiToolbar && showLockButtons && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockLockToolbar, { 57923 clientId: blockClientId 57924 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_mover, { 57925 clientIds: blockClientIds, 57926 hideDragHandle: hideDragHandle 57927 })] 57928 }) 57929 }), !hasContentOnlyLocking && shouldShowVisualToolbar && isMultiToolbar && showGroupButtons && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar, {}), showShuffleButton && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 57930 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Shuffle, { 57931 clientId: blockClientIds[0], 57932 as: external_wp_components_namespaceObject.ToolbarButton 57933 }) 57934 }), shouldShowVisualToolbar && showSlots && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 57935 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls.Slot, { 57936 group: "parent", 57937 className: "block-editor-block-toolbar__slot" 57938 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls.Slot, { 57939 group: "block", 57940 className: "block-editor-block-toolbar__slot" 57941 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls.Slot, { 57942 className: "block-editor-block-toolbar__slot" 57943 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls.Slot, { 57944 group: "inline", 57945 className: "block-editor-block-toolbar__slot" 57946 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls.Slot, { 57947 group: "other", 57948 className: "block-editor-block-toolbar__slot" 57949 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_name_context.Provider, { 57950 value: blockType?.name, 57951 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_toolbar_last_item.Slot, {}) 57952 })] 57953 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockEditVisuallyButton, { 57954 clientIds: blockClientIds 57955 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_settings_menu, { 57956 clientIds: blockClientIds 57957 })] 57958 }) 57959 }, toolbarKey); 57960 } 57961 57962 /** 57963 * Renders the block toolbar. 57964 * 57965 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-toolbar/README.md 57966 * 57967 * @param {Object} props Components props. 57968 * @param {boolean} props.hideDragHandle Show or hide the Drag Handle for drag and drop functionality. 57969 * @param {string} props.variant Style variant of the toolbar, also passed to the Dropdowns rendered from Block Toolbar Buttons. 57970 */ 57971 function BlockToolbar({ 57972 hideDragHandle, 57973 variant 57974 }) { 57975 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockToolbar, { 57976 hideDragHandle: hideDragHandle, 57977 variant: variant, 57978 focusOnMount: undefined, 57979 __experimentalInitialIndex: undefined, 57980 __experimentalOnIndexChange: undefined 57981 }); 57982 } 57983 57984 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/block-toolbar-popover.js 57985 /** 57986 * External dependencies 57987 */ 57988 57989 /** 57990 * WordPress dependencies 57991 */ 57992 57993 57994 57995 /** 57996 * Internal dependencies 57997 */ 57998 57999 58000 58001 58002 58003 58004 function BlockToolbarPopover({ 58005 clientId, 58006 isTyping, 58007 __unstableContentRef 58008 }) { 58009 const { 58010 capturingClientId, 58011 isInsertionPointVisible, 58012 lastClientId 58013 } = useSelectedBlockToolProps(clientId); 58014 58015 // Stores the active toolbar item index so the block toolbar can return focus 58016 // to it when re-mounting. 58017 const initialToolbarItemIndexRef = (0,external_wp_element_namespaceObject.useRef)(); 58018 (0,external_wp_element_namespaceObject.useEffect)(() => { 58019 // Resets the index whenever the active block changes so this is not 58020 // persisted. See https://github.com/WordPress/gutenberg/pull/25760#issuecomment-717906169 58021 initialToolbarItemIndexRef.current = undefined; 58022 }, [clientId]); 58023 const { 58024 stopTyping 58025 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 58026 const isToolbarForcedRef = (0,external_wp_element_namespaceObject.useRef)(false); 58027 (0,external_wp_keyboardShortcuts_namespaceObject.useShortcut)('core/block-editor/focus-toolbar', () => { 58028 isToolbarForcedRef.current = true; 58029 stopTyping(true); 58030 }); 58031 (0,external_wp_element_namespaceObject.useEffect)(() => { 58032 isToolbarForcedRef.current = false; 58033 }); 58034 58035 // If the block has a parent with __experimentalCaptureToolbars enabled, 58036 // the toolbar should be positioned over the topmost capturing parent. 58037 const clientIdToPositionOver = capturingClientId || clientId; 58038 const popoverProps = useBlockToolbarPopoverProps({ 58039 contentElement: __unstableContentRef?.current, 58040 clientId: clientIdToPositionOver 58041 }); 58042 return !isTyping && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_popover, { 58043 clientId: clientIdToPositionOver, 58044 bottomClientId: lastClientId, 58045 className: dist_clsx('block-editor-block-list__block-popover', { 58046 'is-insertion-point-visible': isInsertionPointVisible 58047 }), 58048 resize: false, 58049 ...popoverProps, 58050 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockToolbar 58051 // If the toolbar is being shown because of being forced 58052 // it should focus the toolbar right after the mount. 58053 , { 58054 focusOnMount: isToolbarForcedRef.current, 58055 __experimentalInitialIndex: initialToolbarItemIndexRef.current, 58056 __experimentalOnIndexChange: index => { 58057 initialToolbarItemIndexRef.current = index; 58058 }, 58059 variant: "toolbar" 58060 }) 58061 }); 58062 } 58063 58064 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/block-selection-button.js 58065 /** 58066 * External dependencies 58067 */ 58068 58069 58070 /** 58071 * WordPress dependencies 58072 */ 58073 58074 58075 58076 58077 58078 58079 58080 58081 58082 58083 /** 58084 * Internal dependencies 58085 */ 58086 58087 58088 58089 58090 58091 58092 /** 58093 * Block selection button component, displaying the label of the block. If the block 58094 * descends from a root block, a button is displayed enabling the user to select 58095 * the root block. 58096 * 58097 * @param {string} props Component props. 58098 * @param {string} props.clientId Client ID of block. 58099 * @param {Object} ref Reference to the component. 58100 * 58101 * @return {Component} The component to be rendered. 58102 */ 58103 58104 58105 function BlockSelectionButton({ 58106 clientId, 58107 rootClientId 58108 }, ref) { 58109 const selected = (0,external_wp_data_namespaceObject.useSelect)(select => { 58110 const { 58111 getBlock, 58112 getBlockIndex, 58113 hasBlockMovingClientId, 58114 getBlockListSettings, 58115 __unstableGetEditorMode, 58116 getNextBlockClientId, 58117 getPreviousBlockClientId, 58118 canMoveBlock 58119 } = select(store); 58120 const { 58121 getActiveBlockVariation, 58122 getBlockType 58123 } = select(external_wp_blocks_namespaceObject.store); 58124 const index = getBlockIndex(clientId); 58125 const { 58126 name, 58127 attributes 58128 } = getBlock(clientId); 58129 const blockType = getBlockType(name); 58130 const orientation = getBlockListSettings(rootClientId)?.orientation; 58131 const match = getActiveBlockVariation(name, attributes); 58132 return { 58133 blockMovingMode: hasBlockMovingClientId(), 58134 editorMode: __unstableGetEditorMode(), 58135 icon: match?.icon || blockType.icon, 58136 label: (0,external_wp_blocks_namespaceObject.__experimentalGetAccessibleBlockLabel)(blockType, attributes, index + 1, orientation), 58137 canMove: canMoveBlock(clientId, rootClientId), 58138 getNextBlockClientId, 58139 getPreviousBlockClientId 58140 }; 58141 }, [clientId, rootClientId]); 58142 const { 58143 label, 58144 icon, 58145 blockMovingMode, 58146 editorMode, 58147 canMove 58148 } = selected; 58149 const { 58150 setNavigationMode, 58151 removeBlock 58152 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 58153 58154 // Focus the breadcrumb in navigation mode. 58155 (0,external_wp_element_namespaceObject.useEffect)(() => { 58156 if (editorMode === 'navigation') { 58157 ref.current.focus(); 58158 (0,external_wp_a11y_namespaceObject.speak)(label); 58159 } 58160 }, [label, editorMode]); 58161 const blockElement = useBlockElement(clientId); 58162 const { 58163 hasBlockMovingClientId, 58164 getBlockIndex, 58165 getBlockRootClientId, 58166 getClientIdsOfDescendants, 58167 getSelectedBlockClientId, 58168 getMultiSelectedBlocksEndClientId, 58169 getPreviousBlockClientId, 58170 getNextBlockClientId 58171 } = (0,external_wp_data_namespaceObject.useSelect)(store); 58172 const { 58173 selectBlock, 58174 clearSelectedBlock, 58175 setBlockMovingClientId, 58176 moveBlockToPosition 58177 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 58178 function onKeyDown(event) { 58179 const { 58180 keyCode 58181 } = event; 58182 const isUp = keyCode === external_wp_keycodes_namespaceObject.UP; 58183 const isDown = keyCode === external_wp_keycodes_namespaceObject.DOWN; 58184 const isLeft = keyCode === external_wp_keycodes_namespaceObject.LEFT; 58185 const isRight = keyCode === external_wp_keycodes_namespaceObject.RIGHT; 58186 const isTab = keyCode === external_wp_keycodes_namespaceObject.TAB; 58187 const isEscape = keyCode === external_wp_keycodes_namespaceObject.ESCAPE; 58188 const isEnter = keyCode === external_wp_keycodes_namespaceObject.ENTER; 58189 const isSpace = keyCode === external_wp_keycodes_namespaceObject.SPACE; 58190 const isShift = event.shiftKey; 58191 if (keyCode === external_wp_keycodes_namespaceObject.BACKSPACE || keyCode === external_wp_keycodes_namespaceObject.DELETE) { 58192 removeBlock(clientId); 58193 event.preventDefault(); 58194 return; 58195 } 58196 const selectedBlockClientId = getSelectedBlockClientId(); 58197 const selectionEndClientId = getMultiSelectedBlocksEndClientId(); 58198 const selectionBeforeEndClientId = getPreviousBlockClientId(selectionEndClientId || selectedBlockClientId); 58199 const selectionAfterEndClientId = getNextBlockClientId(selectionEndClientId || selectedBlockClientId); 58200 const navigateUp = isTab && isShift || isUp; 58201 const navigateDown = isTab && !isShift || isDown; 58202 // Move out of current nesting level (no effect if at root level). 58203 const navigateOut = isLeft; 58204 // Move into next nesting level (no effect if the current block has no innerBlocks). 58205 const navigateIn = isRight; 58206 let focusedBlockUid; 58207 if (navigateUp) { 58208 focusedBlockUid = selectionBeforeEndClientId; 58209 } else if (navigateDown) { 58210 focusedBlockUid = selectionAfterEndClientId; 58211 } else if (navigateOut) { 58212 var _getBlockRootClientId; 58213 focusedBlockUid = (_getBlockRootClientId = getBlockRootClientId(selectedBlockClientId)) !== null && _getBlockRootClientId !== void 0 ? _getBlockRootClientId : selectedBlockClientId; 58214 } else if (navigateIn) { 58215 var _getClientIdsOfDescen; 58216 focusedBlockUid = (_getClientIdsOfDescen = getClientIdsOfDescendants(selectedBlockClientId)[0]) !== null && _getClientIdsOfDescen !== void 0 ? _getClientIdsOfDescen : selectedBlockClientId; 58217 } 58218 const startingBlockClientId = hasBlockMovingClientId(); 58219 if (isEscape && startingBlockClientId && !event.defaultPrevented) { 58220 setBlockMovingClientId(null); 58221 event.preventDefault(); 58222 } 58223 if ((isEnter || isSpace) && startingBlockClientId) { 58224 const sourceRoot = getBlockRootClientId(startingBlockClientId); 58225 const destRoot = getBlockRootClientId(selectedBlockClientId); 58226 const sourceBlockIndex = getBlockIndex(startingBlockClientId); 58227 let destinationBlockIndex = getBlockIndex(selectedBlockClientId); 58228 if (sourceBlockIndex < destinationBlockIndex && sourceRoot === destRoot) { 58229 destinationBlockIndex -= 1; 58230 } 58231 moveBlockToPosition(startingBlockClientId, sourceRoot, destRoot, destinationBlockIndex); 58232 selectBlock(startingBlockClientId); 58233 setBlockMovingClientId(null); 58234 } 58235 // Prevent the block from being moved into itself. 58236 if (startingBlockClientId && selectedBlockClientId === startingBlockClientId && navigateIn) { 58237 return; 58238 } 58239 if (navigateDown || navigateUp || navigateOut || navigateIn) { 58240 if (focusedBlockUid) { 58241 event.preventDefault(); 58242 selectBlock(focusedBlockUid); 58243 } else if (isTab && selectedBlockClientId) { 58244 let nextTabbable; 58245 if (navigateDown) { 58246 nextTabbable = blockElement; 58247 do { 58248 nextTabbable = external_wp_dom_namespaceObject.focus.tabbable.findNext(nextTabbable); 58249 } while (nextTabbable && blockElement.contains(nextTabbable)); 58250 if (!nextTabbable) { 58251 nextTabbable = blockElement.ownerDocument.defaultView.frameElement; 58252 nextTabbable = external_wp_dom_namespaceObject.focus.tabbable.findNext(nextTabbable); 58253 } 58254 } else { 58255 nextTabbable = external_wp_dom_namespaceObject.focus.tabbable.findPrevious(blockElement); 58256 } 58257 if (nextTabbable) { 58258 event.preventDefault(); 58259 nextTabbable.focus(); 58260 clearSelectedBlock(); 58261 } 58262 } 58263 } 58264 } 58265 const classNames = dist_clsx('block-editor-block-list__block-selection-button', { 58266 'is-block-moving-mode': !!blockMovingMode 58267 }); 58268 const dragHandleLabel = (0,external_wp_i18n_namespaceObject.__)('Drag'); 58269 const showBlockDraggable = canMove && editorMode === 'navigation'; 58270 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 58271 className: classNames, 58272 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 58273 justify: "center", 58274 className: "block-editor-block-list__block-selection-button__content", 58275 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 58276 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 58277 icon: icon, 58278 showColors: true 58279 }) 58280 }), showBlockDraggable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 58281 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_draggable, { 58282 clientIds: [clientId], 58283 children: draggableProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 58284 // TODO: Switch to `true` (40px size) if possible 58285 , { 58286 __next40pxDefaultSize: false, 58287 icon: drag_handle, 58288 className: "block-selection-button_drag-handle", 58289 label: dragHandleLabel 58290 // Should not be able to tab to drag handle as this 58291 // button can only be used with a pointer device. 58292 , 58293 tabIndex: "-1", 58294 ...draggableProps 58295 }) 58296 }) 58297 }), editorMode === 'navigation' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 58298 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 58299 // TODO: Switch to `true` (40px size) if possible 58300 , { 58301 __next40pxDefaultSize: false, 58302 ref: ref, 58303 onClick: editorMode === 'navigation' ? () => setNavigationMode(false) : undefined, 58304 onKeyDown: onKeyDown, 58305 label: label, 58306 showTooltip: false, 58307 className: "block-selection-button_select-button", 58308 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTitle, { 58309 clientId: clientId, 58310 maximumLength: 35 58311 }) 58312 }) 58313 })] 58314 }) 58315 }); 58316 } 58317 /* harmony default export */ const block_selection_button = ((0,external_wp_element_namespaceObject.forwardRef)(BlockSelectionButton)); 58318 58319 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/block-toolbar-breadcrumb.js 58320 /** 58321 * External dependencies 58322 */ 58323 58324 58325 /** 58326 * WordPress dependencies 58327 */ 58328 58329 58330 /** 58331 * Internal dependencies 58332 */ 58333 58334 58335 58336 58337 58338 function BlockToolbarBreadcrumb({ 58339 clientId, 58340 __unstableContentRef 58341 }, ref) { 58342 const { 58343 capturingClientId, 58344 isInsertionPointVisible, 58345 lastClientId, 58346 rootClientId 58347 } = useSelectedBlockToolProps(clientId); 58348 const popoverProps = useBlockToolbarPopoverProps({ 58349 contentElement: __unstableContentRef?.current, 58350 clientId 58351 }); 58352 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockPopover, { 58353 clientId: capturingClientId || clientId, 58354 bottomClientId: lastClientId, 58355 className: dist_clsx('block-editor-block-list__block-popover', { 58356 'is-insertion-point-visible': isInsertionPointVisible 58357 }), 58358 resize: false, 58359 ...popoverProps, 58360 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_selection_button, { 58361 ref: ref, 58362 clientId: clientId, 58363 rootClientId: rootClientId 58364 }) 58365 }); 58366 } 58367 /* harmony default export */ const block_toolbar_breadcrumb = ((0,external_wp_element_namespaceObject.forwardRef)(BlockToolbarBreadcrumb)); 58368 58369 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/zoom-out-mode-inserter-button.js 58370 /** 58371 * External dependencies 58372 */ 58373 58374 58375 /** 58376 * WordPress dependencies 58377 */ 58378 58379 58380 58381 58382 58383 function ZoomOutModeInserterButton({ 58384 isVisible, 58385 onClick 58386 }) { 58387 const [zoomOutModeInserterButtonHovered, setZoomOutModeInserterButtonHovered] = (0,external_wp_element_namespaceObject.useState)(false); 58388 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 58389 variant: "primary", 58390 icon: library_plus, 58391 size: "compact", 58392 className: dist_clsx('block-editor-button-pattern-inserter__button', 'block-editor-block-tools__zoom-out-mode-inserter-button', { 58393 'is-visible': isVisible || zoomOutModeInserterButtonHovered 58394 }), 58395 onClick: onClick, 58396 onMouseOver: () => { 58397 setZoomOutModeInserterButtonHovered(true); 58398 }, 58399 onMouseOut: () => { 58400 setZoomOutModeInserterButtonHovered(false); 58401 }, 58402 label: (0,external_wp_i18n_namespaceObject._x)('Add pattern', 'Generic label for pattern inserter button') 58403 }); 58404 } 58405 /* harmony default export */ const zoom_out_mode_inserter_button = (ZoomOutModeInserterButton); 58406 58407 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/zoom-out-mode-inserters.js 58408 /** 58409 * WordPress dependencies 58410 */ 58411 58412 58413 58414 /** 58415 * Internal dependencies 58416 */ 58417 58418 58419 58420 58421 58422 function ZoomOutModeInserters() { 58423 const [isReady, setIsReady] = (0,external_wp_element_namespaceObject.useState)(false); 58424 const { 58425 hasSelection, 58426 blockOrder, 58427 setInserterIsOpened, 58428 sectionRootClientId, 58429 selectedBlockClientId 58430 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 58431 const { 58432 getSettings, 58433 getBlockOrder, 58434 getSelectionStart, 58435 getSelectedBlockClientId, 58436 getSectionRootClientId 58437 } = unlock(select(store)); 58438 const root = getSectionRootClientId(); 58439 return { 58440 hasSelection: !!getSelectionStart().clientId, 58441 blockOrder: getBlockOrder(root), 58442 sectionRootClientId: root, 58443 setInserterIsOpened: getSettings().__experimentalSetIsInserterOpened, 58444 selectedBlockClientId: getSelectedBlockClientId() 58445 }; 58446 }, []); 58447 const { 58448 showInsertionPoint 58449 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 58450 58451 // Defer the initial rendering to avoid the jumps due to the animation. 58452 (0,external_wp_element_namespaceObject.useEffect)(() => { 58453 const timeout = setTimeout(() => { 58454 setIsReady(true); 58455 }, 500); 58456 return () => { 58457 clearTimeout(timeout); 58458 }; 58459 }, []); 58460 if (!isReady || !hasSelection) { 58461 return null; 58462 } 58463 const previousClientId = selectedBlockClientId; 58464 const index = blockOrder.findIndex(clientId => selectedBlockClientId === clientId); 58465 const nextClientId = blockOrder[index + 1]; 58466 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inbetween, { 58467 previousClientId: previousClientId, 58468 nextClientId: nextClientId, 58469 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(zoom_out_mode_inserter_button, { 58470 onClick: () => { 58471 // Hotfix for wp/6.7 where focus is not transferred to the sidebar if the 58472 // block library is already open. 58473 const blockLibrary = document.querySelector('[aria-label="Block Library"]'); 58474 setInserterIsOpened({ 58475 rootClientId: sectionRootClientId, 58476 insertionIndex: index + 1, 58477 tab: 'patterns', 58478 category: 'all' 58479 }); 58480 showInsertionPoint(sectionRootClientId, index + 1, { 58481 operation: 'insert' 58482 }); 58483 58484 // If the block library was available before we opened it with `setInserterIsOpened`, we need to 58485 // send focus to the block library. 58486 if (blockLibrary) { 58487 blockLibrary.focus(); 58488 } 58489 } 58490 }) 58491 }); 58492 } 58493 /* harmony default export */ const zoom_out_mode_inserters = (ZoomOutModeInserters); 58494 58495 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/use-show-block-tools.js 58496 /** 58497 * WordPress dependencies 58498 */ 58499 58500 58501 58502 /** 58503 * Internal dependencies 58504 */ 58505 58506 58507 58508 /** 58509 * Source of truth for which block tools are showing in the block editor. 58510 * 58511 * @return {Object} Object of which block tools will be shown. 58512 */ 58513 function useShowBlockTools() { 58514 return (0,external_wp_data_namespaceObject.useSelect)(select => { 58515 const { 58516 getSelectedBlockClientId, 58517 getFirstMultiSelectedBlockClientId, 58518 getBlock, 58519 getBlockMode, 58520 getSettings, 58521 hasMultiSelection, 58522 __unstableGetEditorMode, 58523 isTyping 58524 } = unlock(select(store)); 58525 const clientId = getSelectedBlockClientId() || getFirstMultiSelectedBlockClientId(); 58526 const block = getBlock(clientId); 58527 const editorMode = __unstableGetEditorMode(); 58528 const hasSelectedBlock = !!clientId && !!block; 58529 const isEmptyDefaultBlock = hasSelectedBlock && (0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(block) && getBlockMode(clientId) !== 'html'; 58530 const _showEmptyBlockSideInserter = clientId && !isTyping() && editorMode === 'edit' && isEmptyDefaultBlock; 58531 const maybeShowBreadcrumb = hasSelectedBlock && !hasMultiSelection() && editorMode === 'navigation'; 58532 const _showBlockToolbarPopover = !getSettings().hasFixedToolbar && !_showEmptyBlockSideInserter && hasSelectedBlock && !isEmptyDefaultBlock && !maybeShowBreadcrumb; 58533 return { 58534 showEmptyBlockSideInserter: _showEmptyBlockSideInserter, 58535 showBreadcrumb: !_showEmptyBlockSideInserter && maybeShowBreadcrumb, 58536 showBlockToolbarPopover: _showBlockToolbarPopover 58537 }; 58538 }, []); 58539 } 58540 58541 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-tools/index.js 58542 /** 58543 * WordPress dependencies 58544 */ 58545 58546 58547 58548 58549 58550 58551 58552 58553 58554 /** 58555 * Internal dependencies 58556 */ 58557 58558 58559 58560 58561 58562 58563 58564 58565 58566 58567 58568 58569 function block_tools_selector(select) { 58570 const { 58571 getSelectedBlockClientId, 58572 getFirstMultiSelectedBlockClientId, 58573 getSettings, 58574 __unstableGetEditorMode, 58575 isTyping 58576 } = select(store); 58577 const clientId = getSelectedBlockClientId() || getFirstMultiSelectedBlockClientId(); 58578 const editorMode = __unstableGetEditorMode(); 58579 return { 58580 clientId, 58581 hasFixedToolbar: getSettings().hasFixedToolbar, 58582 isTyping: isTyping(), 58583 isZoomOutMode: editorMode === 'zoom-out' 58584 }; 58585 } 58586 58587 /** 58588 * Renders block tools (the block toolbar, select/navigation mode toolbar, the 58589 * insertion point and a slot for the inline rich text toolbar). Must be wrapped 58590 * around the block content and editor styles wrapper or iframe. 58591 * 58592 * @param {Object} $0 Props. 58593 * @param {Object} $0.children The block content and style container. 58594 * @param {Object} $0.__unstableContentRef Ref holding the content scroll container. 58595 */ 58596 function BlockTools({ 58597 children, 58598 __unstableContentRef, 58599 ...props 58600 }) { 58601 const { 58602 clientId, 58603 hasFixedToolbar, 58604 isTyping, 58605 isZoomOutMode 58606 } = (0,external_wp_data_namespaceObject.useSelect)(block_tools_selector, []); 58607 const isMatch = (0,external_wp_keyboardShortcuts_namespaceObject.__unstableUseShortcutEventMatch)(); 58608 const { 58609 getBlocksByClientId, 58610 getSelectedBlockClientIds, 58611 getBlockRootClientId, 58612 isGroupable 58613 } = (0,external_wp_data_namespaceObject.useSelect)(store); 58614 const { 58615 getGroupingBlockName 58616 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 58617 const { 58618 showEmptyBlockSideInserter, 58619 showBreadcrumb, 58620 showBlockToolbarPopover 58621 } = useShowBlockTools(); 58622 const { 58623 clearSelectedBlock, 58624 duplicateBlocks, 58625 removeBlocks, 58626 replaceBlocks, 58627 insertAfterBlock, 58628 insertBeforeBlock, 58629 selectBlock, 58630 moveBlocksUp, 58631 moveBlocksDown, 58632 expandBlock 58633 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 58634 const blockSelectionButtonRef = (0,external_wp_element_namespaceObject.useRef)(); 58635 function onKeyDown(event) { 58636 if (event.defaultPrevented) { 58637 return; 58638 } 58639 if (isMatch('core/block-editor/move-up', event)) { 58640 const clientIds = getSelectedBlockClientIds(); 58641 if (clientIds.length) { 58642 event.preventDefault(); 58643 const rootClientId = getBlockRootClientId(clientIds[0]); 58644 moveBlocksUp(clientIds, rootClientId); 58645 } 58646 } else if (isMatch('core/block-editor/move-down', event)) { 58647 const clientIds = getSelectedBlockClientIds(); 58648 if (clientIds.length) { 58649 event.preventDefault(); 58650 const rootClientId = getBlockRootClientId(clientIds[0]); 58651 moveBlocksDown(clientIds, rootClientId); 58652 } 58653 } else if (isMatch('core/block-editor/duplicate', event)) { 58654 const clientIds = getSelectedBlockClientIds(); 58655 if (clientIds.length) { 58656 event.preventDefault(); 58657 duplicateBlocks(clientIds); 58658 } 58659 } else if (isMatch('core/block-editor/remove', event)) { 58660 const clientIds = getSelectedBlockClientIds(); 58661 if (clientIds.length) { 58662 event.preventDefault(); 58663 removeBlocks(clientIds); 58664 } 58665 } else if (isMatch('core/block-editor/insert-after', event)) { 58666 const clientIds = getSelectedBlockClientIds(); 58667 if (clientIds.length) { 58668 event.preventDefault(); 58669 insertAfterBlock(clientIds[clientIds.length - 1]); 58670 } 58671 } else if (isMatch('core/block-editor/insert-before', event)) { 58672 const clientIds = getSelectedBlockClientIds(); 58673 if (clientIds.length) { 58674 event.preventDefault(); 58675 insertBeforeBlock(clientIds[0]); 58676 } 58677 } else if (isMatch('core/block-editor/unselect', event)) { 58678 if (event.target.closest('[role=toolbar]')) { 58679 // This shouldn't be necessary, but we have a combination of a few things all combining to create a situation where: 58680 // - Because the block toolbar uses createPortal to populate the block toolbar fills, we can't rely on the React event bubbling to hit the onKeyDown listener for the block toolbar 58681 // - Since we can't use the React tree, we use the DOM tree which _should_ handle the event bubbling correctly from a `createPortal` element. 58682 // - This bubbles via the React tree, which hits this `unselect` escape keypress before the block toolbar DOM event listener has access to it. 58683 // An alternative would be to remove the addEventListener on the navigableToolbar and use this event to handle it directly right here. That feels hacky too though. 58684 return; 58685 } 58686 const clientIds = getSelectedBlockClientIds(); 58687 if (clientIds.length > 1) { 58688 event.preventDefault(); 58689 // If there is more than one block selected, select the first 58690 // block so that focus is directed back to the beginning of the selection. 58691 // In effect, to the user this feels like deselecting the multi-selection. 58692 selectBlock(clientIds[0]); 58693 } else if (clientIds.length === 1 && event.target === blockSelectionButtonRef?.current) { 58694 event.preventDefault(); 58695 clearSelectedBlock(); 58696 getEditorRegion(__unstableContentRef.current)?.focus(); 58697 } 58698 } else if (isMatch('core/block-editor/collapse-list-view', event)) { 58699 // If focus is currently within a text field, such as a rich text block or other editable field, 58700 // skip collapsing the list view, and allow the keyboard shortcut to be handled by the text field. 58701 // This condition checks for both the active element and the active element within an iframed editor. 58702 if ((0,external_wp_dom_namespaceObject.isTextField)(event.target) || (0,external_wp_dom_namespaceObject.isTextField)(event.target?.contentWindow?.document?.activeElement)) { 58703 return; 58704 } 58705 event.preventDefault(); 58706 expandBlock(clientId); 58707 } else if (isMatch('core/block-editor/group', event)) { 58708 const clientIds = getSelectedBlockClientIds(); 58709 if (clientIds.length > 1 && isGroupable(clientIds)) { 58710 event.preventDefault(); 58711 const blocks = getBlocksByClientId(clientIds); 58712 const groupingBlockName = getGroupingBlockName(); 58713 const newBlocks = (0,external_wp_blocks_namespaceObject.switchToBlockType)(blocks, groupingBlockName); 58714 replaceBlocks(clientIds, newBlocks); 58715 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.__)('Selected blocks are grouped.')); 58716 } 58717 } 58718 } 58719 const blockToolbarRef = use_popover_scroll(__unstableContentRef); 58720 const blockToolbarAfterRef = use_popover_scroll(__unstableContentRef); 58721 return ( 58722 /*#__PURE__*/ 58723 // eslint-disable-next-line jsx-a11y/no-static-element-interactions 58724 (0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 58725 ...props, 58726 onKeyDown: onKeyDown, 58727 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(insertion_point_InsertionPointOpenRef.Provider, { 58728 value: (0,external_wp_element_namespaceObject.useRef)(false), 58729 children: [!isTyping && !isZoomOutMode && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InsertionPoint, { 58730 __unstableContentRef: __unstableContentRef 58731 }), showEmptyBlockSideInserter && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(EmptyBlockInserter, { 58732 __unstableContentRef: __unstableContentRef, 58733 clientId: clientId 58734 }), showBlockToolbarPopover && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockToolbarPopover, { 58735 __unstableContentRef: __unstableContentRef, 58736 clientId: clientId, 58737 isTyping: isTyping 58738 }), showBreadcrumb && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_toolbar_breadcrumb, { 58739 ref: blockSelectionButtonRef, 58740 __unstableContentRef: __unstableContentRef, 58741 clientId: clientId 58742 }), !isZoomOutMode && !hasFixedToolbar && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover.Slot, { 58743 name: "block-toolbar", 58744 ref: blockToolbarRef 58745 }), children, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover.Slot, { 58746 name: "__unstable-block-tools-after", 58747 ref: blockToolbarAfterRef 58748 }), isZoomOutMode && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(zoom_out_mode_inserters, { 58749 __unstableContentRef: __unstableContentRef 58750 })] 58751 }) 58752 }) 58753 ); 58754 } 58755 58756 ;// CONCATENATED MODULE: external ["wp","commands"] 58757 const external_wp_commands_namespaceObject = window["wp"]["commands"]; 58758 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/move-to.js 58759 /** 58760 * WordPress dependencies 58761 */ 58762 58763 58764 const move_to_moveTo = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 58765 xmlns: "http://www.w3.org/2000/svg", 58766 viewBox: "0 0 24 24", 58767 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 58768 d: "M19.75 9c0-1.257-.565-2.197-1.39-2.858-.797-.64-1.827-1.017-2.815-1.247-1.802-.42-3.703-.403-4.383-.396L11 4.5V6l.177-.001c.696-.006 2.416-.02 4.028.356.887.207 1.67.518 2.216.957.52.416.829.945.829 1.688 0 .592-.167.966-.407 1.23-.255.281-.656.508-1.236.674-1.19.34-2.82.346-4.607.346h-.077c-1.692 0-3.527 0-4.942.404-.732.209-1.424.545-1.935 1.108-.526.579-.796 1.33-.796 2.238 0 1.257.565 2.197 1.39 2.858.797.64 1.827 1.017 2.815 1.247 1.802.42 3.703.403 4.383.396L13 19.5h.714V22L18 18.5 13.714 15v3H13l-.177.001c-.696.006-2.416.02-4.028-.356-.887-.207-1.67-.518-2.216-.957-.52-.416-.829-.945-.829-1.688 0-.592.167-.966.407-1.23.255-.281.656-.508 1.237-.674 1.189-.34 2.819-.346 4.606-.346h.077c1.692 0 3.527 0 4.941-.404.732-.209 1.425-.545 1.936-1.108.526-.579.796-1.33.796-2.238z" 58769 }) 58770 }); 58771 /* harmony default export */ const move_to = (move_to_moveTo); 58772 58773 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/ungroup.js 58774 /** 58775 * WordPress dependencies 58776 */ 58777 58778 58779 const ungroup = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 58780 xmlns: "http://www.w3.org/2000/svg", 58781 viewBox: "0 0 24 24", 58782 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 58783 d: "M18 4h-7c-1.1 0-2 .9-2 2v7c0 1.1.9 2 2 2h7c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm.5 9c0 .3-.2.5-.5.5h-7c-.3 0-.5-.2-.5-.5V6c0-.3.2-.5.5-.5h7c.3 0 .5.2.5.5v7zm-5 5c0 .3-.2.5-.5.5H6c-.3 0-.5-.2-.5-.5v-7c0-.3.2-.5.5-.5h1V9H6c-1.1 0-2 .9-2 2v7c0 1.1.9 2 2 2h7c1.1 0 2-.9 2-2v-1h-1.5v1z" 58784 }) 58785 }); 58786 /* harmony default export */ const library_ungroup = (ungroup); 58787 58788 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/trash.js 58789 /** 58790 * WordPress dependencies 58791 */ 58792 58793 58794 const trash = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 58795 xmlns: "http://www.w3.org/2000/svg", 58796 viewBox: "0 0 24 24", 58797 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 58798 fillRule: "evenodd", 58799 clipRule: "evenodd", 58800 d: "M12 5.5A2.25 2.25 0 0 0 9.878 7h4.244A2.251 2.251 0 0 0 12 5.5ZM12 4a3.751 3.751 0 0 0-3.675 3H5v1.5h1.27l.818 8.997a2.75 2.75 0 0 0 2.739 2.501h4.347a2.75 2.75 0 0 0 2.738-2.5L17.73 8.5H19V7h-3.325A3.751 3.751 0 0 0 12 4Zm4.224 4.5H7.776l.806 8.861a1.25 1.25 0 0 0 1.245 1.137h4.347a1.25 1.25 0 0 0 1.245-1.137l.805-8.861Z" 58801 }) 58802 }); 58803 /* harmony default export */ const library_trash = (trash); 58804 58805 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-block-commands/index.js 58806 /** 58807 * WordPress dependencies 58808 */ 58809 58810 58811 58812 58813 58814 58815 /** 58816 * Internal dependencies 58817 */ 58818 58819 58820 58821 const useTransformCommands = () => { 58822 const { 58823 replaceBlocks, 58824 multiSelect 58825 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 58826 const { 58827 blocks, 58828 clientIds, 58829 canRemove, 58830 possibleBlockTransformations, 58831 invalidSelection 58832 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 58833 const { 58834 getBlockRootClientId, 58835 getBlockTransformItems, 58836 getSelectedBlockClientIds, 58837 getBlocksByClientId, 58838 canRemoveBlocks 58839 } = select(store); 58840 const selectedBlockClientIds = getSelectedBlockClientIds(); 58841 const selectedBlocks = getBlocksByClientId(selectedBlockClientIds); 58842 58843 // selectedBlocks can have `null`s when something tries to call `selectBlock` with an inexistent clientId. 58844 // These nulls will cause fatal errors down the line. 58845 // In order to prevent discrepancies between selectedBlockClientIds and selectedBlocks, we effectively treat the entire selection as invalid. 58846 // @see https://github.com/WordPress/gutenberg/pull/59410#issuecomment-2006304536 58847 if (selectedBlocks.filter(block => !block).length > 0) { 58848 return { 58849 invalidSelection: true 58850 }; 58851 } 58852 const rootClientId = getBlockRootClientId(selectedBlockClientIds[0]); 58853 return { 58854 blocks: selectedBlocks, 58855 clientIds: selectedBlockClientIds, 58856 possibleBlockTransformations: getBlockTransformItems(selectedBlocks, rootClientId), 58857 canRemove: canRemoveBlocks(selectedBlockClientIds), 58858 invalidSelection: false 58859 }; 58860 }, []); 58861 if (invalidSelection) { 58862 return { 58863 isLoading: false, 58864 commands: [] 58865 }; 58866 } 58867 const isTemplate = blocks.length === 1 && (0,external_wp_blocks_namespaceObject.isTemplatePart)(blocks[0]); 58868 function selectForMultipleBlocks(insertedBlocks) { 58869 if (insertedBlocks.length > 1) { 58870 multiSelect(insertedBlocks[0].clientId, insertedBlocks[insertedBlocks.length - 1].clientId); 58871 } 58872 } 58873 58874 // Simple block tranformation based on the `Block Transforms` API. 58875 function onBlockTransform(name) { 58876 const newBlocks = (0,external_wp_blocks_namespaceObject.switchToBlockType)(blocks, name); 58877 replaceBlocks(clientIds, newBlocks); 58878 selectForMultipleBlocks(newBlocks); 58879 } 58880 58881 /** 58882 * The `isTemplate` check is a stopgap solution here. 58883 * Ideally, the Transforms API should handle this 58884 * by allowing to exclude blocks from wildcard transformations. 58885 */ 58886 const hasPossibleBlockTransformations = !!possibleBlockTransformations.length && canRemove && !isTemplate; 58887 if (!clientIds || clientIds.length < 1 || !hasPossibleBlockTransformations) { 58888 return { 58889 isLoading: false, 58890 commands: [] 58891 }; 58892 } 58893 const commands = possibleBlockTransformations.map(transformation => { 58894 const { 58895 name, 58896 title, 58897 icon 58898 } = transformation; 58899 return { 58900 name: 'core/block-editor/transform-to-' + name.replace('/', '-'), 58901 /* translators: %s: Block or block variation name. */ 58902 label: (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Transform to %s'), title), 58903 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 58904 icon: icon 58905 }), 58906 callback: ({ 58907 close 58908 }) => { 58909 onBlockTransform(name); 58910 close(); 58911 } 58912 }; 58913 }); 58914 return { 58915 isLoading: false, 58916 commands 58917 }; 58918 }; 58919 const useActionsCommands = () => { 58920 const { 58921 clientIds 58922 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 58923 const { 58924 getSelectedBlockClientIds 58925 } = select(store); 58926 const selectedBlockClientIds = getSelectedBlockClientIds(); 58927 return { 58928 clientIds: selectedBlockClientIds 58929 }; 58930 }, []); 58931 const { 58932 getBlockRootClientId, 58933 canMoveBlocks, 58934 getBlockCount 58935 } = (0,external_wp_data_namespaceObject.useSelect)(store); 58936 const { 58937 setBlockMovingClientId, 58938 setNavigationMode, 58939 selectBlock 58940 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 58941 if (!clientIds || clientIds.length < 1) { 58942 return { 58943 isLoading: false, 58944 commands: [] 58945 }; 58946 } 58947 const rootClientId = getBlockRootClientId(clientIds[0]); 58948 const canMove = canMoveBlocks(clientIds) && getBlockCount(rootClientId) !== 1; 58949 const commands = []; 58950 if (canMove) { 58951 commands.push({ 58952 name: 'move-to', 58953 label: (0,external_wp_i18n_namespaceObject.__)('Move to'), 58954 callback: () => { 58955 setNavigationMode(true); 58956 selectBlock(clientIds[0]); 58957 setBlockMovingClientId(clientIds[0]); 58958 }, 58959 icon: move_to 58960 }); 58961 } 58962 return { 58963 isLoading: false, 58964 commands: commands.map(command => ({ 58965 ...command, 58966 name: 'core/block-editor/action-' + command.name, 58967 callback: ({ 58968 close 58969 }) => { 58970 command.callback(); 58971 close(); 58972 } 58973 })) 58974 }; 58975 }; 58976 const useQuickActionsCommands = () => { 58977 const { 58978 clientIds, 58979 isUngroupable, 58980 isGroupable 58981 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 58982 const { 58983 getSelectedBlockClientIds, 58984 isUngroupable: _isUngroupable, 58985 isGroupable: _isGroupable 58986 } = select(store); 58987 const selectedBlockClientIds = getSelectedBlockClientIds(); 58988 return { 58989 clientIds: selectedBlockClientIds, 58990 isUngroupable: _isUngroupable(), 58991 isGroupable: _isGroupable() 58992 }; 58993 }, []); 58994 const { 58995 canInsertBlockType, 58996 getBlockRootClientId, 58997 getBlocksByClientId, 58998 canRemoveBlocks 58999 } = (0,external_wp_data_namespaceObject.useSelect)(store); 59000 const { 59001 getDefaultBlockName, 59002 getGroupingBlockName 59003 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 59004 const blocks = getBlocksByClientId(clientIds); 59005 const { 59006 removeBlocks, 59007 replaceBlocks, 59008 duplicateBlocks, 59009 insertAfterBlock, 59010 insertBeforeBlock 59011 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 59012 const onGroup = () => { 59013 if (!blocks.length) { 59014 return; 59015 } 59016 const groupingBlockName = getGroupingBlockName(); 59017 59018 // Activate the `transform` on `core/group` which does the conversion. 59019 const newBlocks = (0,external_wp_blocks_namespaceObject.switchToBlockType)(blocks, groupingBlockName); 59020 if (!newBlocks) { 59021 return; 59022 } 59023 replaceBlocks(clientIds, newBlocks); 59024 }; 59025 const onUngroup = () => { 59026 if (!blocks.length) { 59027 return; 59028 } 59029 const innerBlocks = blocks[0].innerBlocks; 59030 if (!innerBlocks.length) { 59031 return; 59032 } 59033 replaceBlocks(clientIds, innerBlocks); 59034 }; 59035 if (!clientIds || clientIds.length < 1) { 59036 return { 59037 isLoading: false, 59038 commands: [] 59039 }; 59040 } 59041 const rootClientId = getBlockRootClientId(clientIds[0]); 59042 const canInsertDefaultBlock = canInsertBlockType(getDefaultBlockName(), rootClientId); 59043 const canDuplicate = blocks.every(block => { 59044 return !!block && (0,external_wp_blocks_namespaceObject.hasBlockSupport)(block.name, 'multiple', true) && canInsertBlockType(block.name, rootClientId); 59045 }); 59046 const canRemove = canRemoveBlocks(clientIds); 59047 const commands = []; 59048 if (canDuplicate) { 59049 commands.push({ 59050 name: 'duplicate', 59051 label: (0,external_wp_i18n_namespaceObject.__)('Duplicate'), 59052 callback: () => duplicateBlocks(clientIds, true), 59053 icon: library_copy 59054 }); 59055 } 59056 if (canInsertDefaultBlock) { 59057 commands.push({ 59058 name: 'add-before', 59059 label: (0,external_wp_i18n_namespaceObject.__)('Add before'), 59060 callback: () => { 59061 const clientId = Array.isArray(clientIds) ? clientIds[0] : clientId; 59062 insertBeforeBlock(clientId); 59063 }, 59064 icon: library_plus 59065 }, { 59066 name: 'add-after', 59067 label: (0,external_wp_i18n_namespaceObject.__)('Add after'), 59068 callback: () => { 59069 const clientId = Array.isArray(clientIds) ? clientIds[clientIds.length - 1] : clientId; 59070 insertAfterBlock(clientId); 59071 }, 59072 icon: library_plus 59073 }); 59074 } 59075 if (isGroupable) { 59076 commands.push({ 59077 name: 'Group', 59078 label: (0,external_wp_i18n_namespaceObject.__)('Group'), 59079 callback: onGroup, 59080 icon: library_group 59081 }); 59082 } 59083 if (isUngroupable) { 59084 commands.push({ 59085 name: 'ungroup', 59086 label: (0,external_wp_i18n_namespaceObject.__)('Ungroup'), 59087 callback: onUngroup, 59088 icon: library_ungroup 59089 }); 59090 } 59091 if (canRemove) { 59092 commands.push({ 59093 name: 'remove', 59094 label: (0,external_wp_i18n_namespaceObject.__)('Delete'), 59095 callback: () => removeBlocks(clientIds, true), 59096 icon: library_trash 59097 }); 59098 } 59099 return { 59100 isLoading: false, 59101 commands: commands.map(command => ({ 59102 ...command, 59103 name: 'core/block-editor/action-' + command.name, 59104 callback: ({ 59105 close 59106 }) => { 59107 command.callback(); 59108 close(); 59109 } 59110 })) 59111 }; 59112 }; 59113 const useBlockCommands = () => { 59114 (0,external_wp_commands_namespaceObject.useCommandLoader)({ 59115 name: 'core/block-editor/blockTransforms', 59116 hook: useTransformCommands 59117 }); 59118 (0,external_wp_commands_namespaceObject.useCommandLoader)({ 59119 name: 'core/block-editor/blockActions', 59120 hook: useActionsCommands 59121 }); 59122 (0,external_wp_commands_namespaceObject.useCommandLoader)({ 59123 name: 'core/block-editor/blockQuickActions', 59124 hook: useQuickActionsCommands, 59125 context: 'block-selection-edit' 59126 }); 59127 }; 59128 59129 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-canvas/index.js 59130 /** 59131 * WordPress dependencies 59132 */ 59133 59134 59135 59136 /** 59137 * Internal dependencies 59138 */ 59139 59140 59141 59142 59143 59144 59145 59146 59147 59148 // EditorStyles is a memoized component, so avoid passing a new 59149 // object reference on each render. 59150 59151 59152 const EDITOR_STYLE_TRANSFORM_OPTIONS = { 59153 // Don't transform selectors that already specify `.editor-styles-wrapper`. 59154 ignoredSelectors: [/\.editor-styles-wrapper/gi] 59155 }; 59156 function ExperimentalBlockCanvas({ 59157 shouldIframe = true, 59158 height = '300px', 59159 children = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockList, {}), 59160 styles, 59161 contentRef: contentRefProp, 59162 iframeProps 59163 }) { 59164 useBlockCommands(); 59165 const resetTypingRef = useMouseMoveTypingReset(); 59166 const clearerRef = useBlockSelectionClearer(); 59167 const localRef = (0,external_wp_element_namespaceObject.useRef)(); 59168 const contentRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([contentRefProp, clearerRef, localRef]); 59169 if (!shouldIframe) { 59170 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(BlockTools, { 59171 __unstableContentRef: localRef, 59172 style: { 59173 height, 59174 display: 'flex' 59175 }, 59176 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(editor_styles, { 59177 styles: styles, 59178 scope: ":where(.editor-styles-wrapper)", 59179 transformOptions: EDITOR_STYLE_TRANSFORM_OPTIONS 59180 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(writing_flow, { 59181 ref: contentRef, 59182 className: "editor-styles-wrapper", 59183 tabIndex: -1, 59184 style: { 59185 height: '100%', 59186 width: '100%' 59187 }, 59188 children: children 59189 })] 59190 }); 59191 } 59192 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTools, { 59193 __unstableContentRef: localRef, 59194 style: { 59195 height, 59196 display: 'flex' 59197 }, 59198 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(iframe, { 59199 ...iframeProps, 59200 ref: resetTypingRef, 59201 contentRef: contentRef, 59202 style: { 59203 ...iframeProps?.style 59204 }, 59205 name: "editor-canvas", 59206 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(editor_styles, { 59207 styles: styles 59208 }), children] 59209 }) 59210 }); 59211 } 59212 59213 /** 59214 * BlockCanvas component is a component used to display the canvas of the block editor. 59215 * What we call the canvas is an iframe containing the block list that you can manipulate. 59216 * The component is also responsible of wiring up all the necessary hooks to enable 59217 * the keyboard navigation across blocks in the editor and inject content styles into the iframe. 59218 * 59219 * @example 59220 * 59221 * ```jsx 59222 * function MyBlockEditor() { 59223 * const [ blocks, updateBlocks ] = useState([]); 59224 * return ( 59225 * <BlockEditorProvider 59226 * value={ blocks } 59227 * onInput={ updateBlocks } 59228 * onChange={ persistBlocks } 59229 * > 59230 * <BlockCanvas height="400px" /> 59231 * </BlockEditorProvider> 59232 * ); 59233 * } 59234 * ``` 59235 * 59236 * @param {Object} props Component props. 59237 * @param {string} props.height Canvas height, defaults to 300px. 59238 * @param {Array} props.styles Content styles to inject into the iframe. 59239 * @param {Element} props.children Content of the canvas, defaults to the BlockList component. 59240 * @return {Element} Block Breadcrumb. 59241 */ 59242 function BlockCanvas({ 59243 children, 59244 height, 59245 styles 59246 }) { 59247 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ExperimentalBlockCanvas, { 59248 height: height, 59249 styles: styles, 59250 children: children 59251 }); 59252 } 59253 /* harmony default export */ const block_canvas = (BlockCanvas); 59254 59255 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/color-style-selector/index.js 59256 /** 59257 * WordPress dependencies 59258 */ 59259 59260 59261 59262 59263 59264 const ColorSelectorSVGIcon = () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SVG, { 59265 xmlns: "http://www.w3.org/2000/svg", 59266 viewBox: "0 0 20 20", 59267 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Path, { 59268 d: "M7.434 5l3.18 9.16H8.538l-.692-2.184H4.628l-.705 2.184H2L5.18 5h2.254zm-1.13 1.904h-.115l-1.148 3.593H7.44L6.304 6.904zM14.348 7.006c1.853 0 2.9.876 2.9 2.374v4.78h-1.79v-.914h-.114c-.362.64-1.123 1.022-2.031 1.022-1.346 0-2.292-.826-2.292-2.108 0-1.27.972-2.006 2.71-2.107l1.696-.102V9.38c0-.584-.42-.914-1.18-.914-.667 0-1.112.228-1.264.647h-1.701c.12-1.295 1.307-2.107 3.066-2.107zm1.079 4.1l-1.416.09c-.793.056-1.18.342-1.18.844 0 .52.45.837 1.091.837.857 0 1.505-.545 1.505-1.256v-.515z" 59269 }) 59270 }); 59271 59272 /** 59273 * Color Selector Icon component. 59274 * 59275 * @param {Object} props Component properties. 59276 * @param {Object} props.style Style object. 59277 * @param {string} props.className Class name for component. 59278 * 59279 * @return {*} React Icon component. 59280 */ 59281 const ColorSelectorIcon = ({ 59282 style, 59283 className 59284 }) => { 59285 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 59286 className: "block-library-colors-selector__icon-container", 59287 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 59288 className: `$className} block-library-colors-selector__state-selection`, 59289 style: style, 59290 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorSelectorSVGIcon, {}) 59291 }) 59292 }); 59293 }; 59294 59295 /** 59296 * Renders the Colors Selector Toolbar with the icon button. 59297 * 59298 * @param {Object} props Component properties. 59299 * @param {Object} props.TextColor Text color component that wraps icon. 59300 * @param {Object} props.BackgroundColor Background color component that wraps icon. 59301 * 59302 * @return {*} React toggle button component. 59303 */ 59304 const renderToggleComponent = ({ 59305 TextColor, 59306 BackgroundColor 59307 }) => ({ 59308 onToggle, 59309 isOpen 59310 }) => { 59311 const openOnArrowDown = event => { 59312 if (!isOpen && event.keyCode === external_wp_keycodes_namespaceObject.DOWN) { 59313 event.preventDefault(); 59314 onToggle(); 59315 } 59316 }; 59317 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 59318 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 59319 className: "components-toolbar__control block-library-colors-selector__toggle", 59320 label: (0,external_wp_i18n_namespaceObject.__)('Open Colors Selector'), 59321 onClick: onToggle, 59322 onKeyDown: openOnArrowDown, 59323 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackgroundColor, { 59324 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TextColor, { 59325 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorSelectorIcon, {}) 59326 }) 59327 }) 59328 }) 59329 }); 59330 }; 59331 const BlockColorsStyleSelector = ({ 59332 children, 59333 ...other 59334 }) => { 59335 external_wp_deprecated_default()(`wp.blockEditor.BlockColorsStyleSelector`, { 59336 alternative: 'block supports API', 59337 since: '6.1', 59338 version: '6.3' 59339 }); 59340 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 59341 popoverProps: { 59342 placement: 'bottom-start' 59343 }, 59344 className: "block-library-colors-selector", 59345 contentClassName: "block-library-colors-selector__popover", 59346 renderToggle: renderToggleComponent(other), 59347 renderContent: () => children 59348 }); 59349 }; 59350 /* harmony default export */ const color_style_selector = (BlockColorsStyleSelector); 59351 59352 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/list-view.js 59353 /** 59354 * WordPress dependencies 59355 */ 59356 59357 59358 const listView = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 59359 viewBox: "0 0 24 24", 59360 xmlns: "http://www.w3.org/2000/svg", 59361 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 59362 d: "M3 6h11v1.5H3V6Zm3.5 5.5h11V13h-11v-1.5ZM21 17H10v1.5h11V17Z" 59363 }) 59364 }); 59365 /* harmony default export */ const list_view = (listView); 59366 59367 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/context.js 59368 /** 59369 * WordPress dependencies 59370 */ 59371 59372 const ListViewContext = (0,external_wp_element_namespaceObject.createContext)({}); 59373 const useListViewContext = () => (0,external_wp_element_namespaceObject.useContext)(ListViewContext); 59374 59375 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/aria-referenced-text.js 59376 /** 59377 * WordPress dependencies 59378 */ 59379 59380 59381 /** 59382 * A component specifically designed to be used as an element referenced 59383 * by ARIA attributes such as `aria-labelledby` or `aria-describedby`. 59384 * 59385 * @param {Object} props Props. 59386 * @param {import('react').ReactNode} props.children 59387 */ 59388 59389 function AriaReferencedText({ 59390 children, 59391 ...props 59392 }) { 59393 const ref = (0,external_wp_element_namespaceObject.useRef)(); 59394 (0,external_wp_element_namespaceObject.useEffect)(() => { 59395 if (ref.current) { 59396 // This seems like a no-op, but it fixes a bug in Firefox where 59397 // it fails to recompute the text when only the text node changes. 59398 // @see https://github.com/WordPress/gutenberg/pull/51035 59399 ref.current.textContent = ref.current.textContent; 59400 } 59401 }, [children]); 59402 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 59403 hidden: true, 59404 ...props, 59405 ref: ref, 59406 children: children 59407 }); 59408 } 59409 59410 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/appender.js 59411 /** 59412 * WordPress dependencies 59413 */ 59414 59415 59416 59417 59418 59419 59420 /** 59421 * Internal dependencies 59422 */ 59423 59424 59425 59426 59427 59428 59429 59430 const Appender = (0,external_wp_element_namespaceObject.forwardRef)(({ 59431 nestingLevel, 59432 blockCount, 59433 clientId, 59434 ...props 59435 }, ref) => { 59436 const { 59437 insertedBlock, 59438 setInsertedBlock 59439 } = useListViewContext(); 59440 const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(Appender); 59441 const hideInserter = (0,external_wp_data_namespaceObject.useSelect)(select => { 59442 const { 59443 getTemplateLock, 59444 __unstableGetEditorMode 59445 } = select(store); 59446 return !!getTemplateLock(clientId) || __unstableGetEditorMode() === 'zoom-out'; 59447 }, [clientId]); 59448 const blockTitle = useBlockDisplayTitle({ 59449 clientId, 59450 context: 'list-view' 59451 }); 59452 const insertedBlockTitle = useBlockDisplayTitle({ 59453 clientId: insertedBlock?.clientId, 59454 context: 'list-view' 59455 }); 59456 (0,external_wp_element_namespaceObject.useEffect)(() => { 59457 if (!insertedBlockTitle?.length) { 59458 return; 59459 } 59460 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.sprintf)( 59461 // translators: %s: name of block being inserted (i.e. Paragraph, Image, Group etc) 59462 (0,external_wp_i18n_namespaceObject.__)('%s block inserted'), insertedBlockTitle), 'assertive'); 59463 }, [insertedBlockTitle]); 59464 if (hideInserter) { 59465 return null; 59466 } 59467 const descriptionId = `list-view-appender__$instanceId}`; 59468 const description = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: 1: The name of the block. 2: The numerical position of the block. 3: The level of nesting for the block. */ 59469 (0,external_wp_i18n_namespaceObject.__)('Append to %1$s block at position %2$d, Level %3$d'), blockTitle, blockCount + 1, nestingLevel); 59470 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 59471 className: "list-view-appender", 59472 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter, { 59473 ref: ref, 59474 rootClientId: clientId, 59475 position: "bottom right", 59476 isAppender: true, 59477 selectBlockOnInsert: false, 59478 shouldDirectInsert: false, 59479 __experimentalIsQuick: true, 59480 ...props, 59481 toggleProps: { 59482 'aria-describedby': descriptionId 59483 }, 59484 onSelectOrClose: maybeInsertedBlock => { 59485 if (maybeInsertedBlock?.clientId) { 59486 setInsertedBlock(maybeInsertedBlock); 59487 } 59488 } 59489 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AriaReferencedText, { 59490 id: descriptionId, 59491 children: description 59492 })] 59493 }); 59494 }); 59495 59496 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/leaf.js 59497 /** 59498 * External dependencies 59499 */ 59500 59501 59502 59503 /** 59504 * WordPress dependencies 59505 */ 59506 59507 59508 59509 59510 /** 59511 * Internal dependencies 59512 */ 59513 59514 59515 const AnimatedTreeGridRow = dist_esm_it(external_wp_components_namespaceObject.__experimentalTreeGridRow); 59516 const ListViewLeaf = (0,external_wp_element_namespaceObject.forwardRef)(({ 59517 isDragged, 59518 isSelected, 59519 position, 59520 level, 59521 rowCount, 59522 children, 59523 className, 59524 path, 59525 ...props 59526 }, ref) => { 59527 const animationRef = use_moving_animation({ 59528 clientId: props['data-block'], 59529 enableAnimation: true, 59530 triggerAnimationOnChange: path 59531 }); 59532 const mergedRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, animationRef]); 59533 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AnimatedTreeGridRow, { 59534 ref: mergedRef, 59535 className: dist_clsx('block-editor-list-view-leaf', className), 59536 level: level, 59537 positionInSet: position, 59538 setSize: rowCount, 59539 isExpanded: undefined, 59540 ...props, 59541 children: children 59542 }); 59543 }); 59544 /* harmony default export */ const leaf = (ListViewLeaf); 59545 59546 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/use-list-view-scroll-into-view.js 59547 /** 59548 * WordPress dependencies 59549 */ 59550 59551 59552 function useListViewScrollIntoView({ 59553 isSelected, 59554 selectedClientIds, 59555 rowItemRef 59556 }) { 59557 const isSingleSelection = selectedClientIds.length === 1; 59558 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 59559 // Skip scrolling into view if this particular block isn't selected, 59560 // or if more than one block is selected overall. This is to avoid 59561 // scrolling the view in a multi selection where the user has intentionally 59562 // selected multiple blocks within the list view, but the initially 59563 // selected block may be out of view. 59564 if (!isSelected || !isSingleSelection || !rowItemRef.current) { 59565 return; 59566 } 59567 const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(rowItemRef.current); 59568 const { 59569 ownerDocument 59570 } = rowItemRef.current; 59571 const windowScroll = scrollContainer === ownerDocument.body || scrollContainer === ownerDocument.documentElement; 59572 59573 // If the there is no scroll container, of if the scroll container is the window, 59574 // do not scroll into view, as the block is already in view. 59575 if (windowScroll || !scrollContainer) { 59576 return; 59577 } 59578 const rowRect = rowItemRef.current.getBoundingClientRect(); 59579 const scrollContainerRect = scrollContainer.getBoundingClientRect(); 59580 59581 // If the selected block is not currently visible, scroll to it. 59582 if (rowRect.top < scrollContainerRect.top || rowRect.bottom > scrollContainerRect.bottom) { 59583 rowItemRef.current.scrollIntoView(); 59584 } 59585 }, [isSelected, isSingleSelection, rowItemRef]); 59586 } 59587 59588 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/pin-small.js 59589 /** 59590 * WordPress dependencies 59591 */ 59592 59593 59594 const pinSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 59595 width: "24", 59596 height: "24", 59597 viewBox: "0 0 24 24", 59598 xmlns: "http://www.w3.org/2000/svg", 59599 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 59600 d: "M10.97 10.159a3.382 3.382 0 0 0-2.857.955l1.724 1.723-2.836 2.913L7 17h1.25l2.913-2.837 1.723 1.723a3.38 3.38 0 0 0 .606-.825c.33-.63.446-1.343.35-2.032L17 10.695 13.305 7l-2.334 3.159Z" 59601 }) 59602 }); 59603 /* harmony default export */ const pin_small = (pinSmall); 59604 59605 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/lock-small.js 59606 /** 59607 * WordPress dependencies 59608 */ 59609 59610 59611 const lockSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 59612 viewBox: "0 0 24 24", 59613 xmlns: "http://www.w3.org/2000/svg", 59614 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 59615 fillRule: "evenodd", 59616 clipRule: "evenodd", 59617 d: "M15 11h-.2V9c0-1.5-1.2-2.8-2.8-2.8S9.2 7.5 9.2 9v2H9c-.6 0-1 .4-1 1v4c0 .6.4 1 1 1h6c.6 0 1-.4 1-1v-4c0-.6-.4-1-1-1zm-1.8 0h-2.5V9c0-.7.6-1.2 1.2-1.2s1.2.6 1.2 1.2v2z" 59618 }) 59619 }); 59620 /* harmony default export */ const lock_small = (lockSmall); 59621 59622 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/expander.js 59623 /** 59624 * WordPress dependencies 59625 */ 59626 59627 59628 59629 function ListViewExpander({ 59630 onClick 59631 }) { 59632 return ( 59633 /*#__PURE__*/ 59634 // Keyboard events are handled by TreeGrid see: components/src/tree-grid/index.js 59635 // 59636 // The expander component is implemented as a pseudo element in the w3 example 59637 // https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html 59638 // 59639 // We've mimicked this by adding an icon with aria-hidden set to true to hide this from the accessibility tree. 59640 // For the current tree grid implementation, please do not try to make this a button. 59641 // 59642 // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions 59643 (0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 59644 className: "block-editor-list-view__expander", 59645 onClick: event => onClick(event, { 59646 forceToggle: true 59647 }), 59648 "aria-hidden": "true", 59649 "data-testid": "list-view-expander", 59650 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 59651 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_left_small : chevron_right_small 59652 }) 59653 }) 59654 ); 59655 } 59656 59657 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/use-list-view-images.js 59658 /** 59659 * WordPress dependencies 59660 */ 59661 59662 59663 59664 /** 59665 * Internal dependencies 59666 */ 59667 59668 59669 // Maximum number of images to display in a list view row. 59670 const MAX_IMAGES = 3; 59671 function getImage(block) { 59672 if (block.name !== 'core/image') { 59673 return; 59674 } 59675 if (block.attributes?.url) { 59676 return { 59677 url: block.attributes.url, 59678 alt: block.attributes.alt, 59679 clientId: block.clientId 59680 }; 59681 } 59682 } 59683 function getImagesFromGallery(block) { 59684 if (block.name !== 'core/gallery' || !block.innerBlocks) { 59685 return []; 59686 } 59687 const images = []; 59688 for (const innerBlock of block.innerBlocks) { 59689 const img = getImage(innerBlock); 59690 if (img) { 59691 images.push(img); 59692 } 59693 if (images.length >= MAX_IMAGES) { 59694 return images; 59695 } 59696 } 59697 return images; 59698 } 59699 function getImagesFromBlock(block, isExpanded) { 59700 const img = getImage(block); 59701 if (img) { 59702 return [img]; 59703 } 59704 return isExpanded ? [] : getImagesFromGallery(block); 59705 } 59706 59707 /** 59708 * Get a block's preview images for display within a list view row. 59709 * 59710 * TODO: Currently only supports images from the core/image and core/gallery 59711 * blocks. This should be expanded to support other blocks that have images, 59712 * potentially via an API that blocks can opt into / provide their own logic. 59713 * 59714 * @param {Object} props Hook properties. 59715 * @param {string} props.clientId The block's clientId. 59716 * @param {boolean} props.isExpanded Whether or not the block is expanded in the list view. 59717 * @return {Array} Images. 59718 */ 59719 function useListViewImages({ 59720 clientId, 59721 isExpanded 59722 }) { 59723 const { 59724 block 59725 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 59726 const _block = select(store).getBlock(clientId); 59727 return { 59728 block: _block 59729 }; 59730 }, [clientId]); 59731 const images = (0,external_wp_element_namespaceObject.useMemo)(() => { 59732 return getImagesFromBlock(block, isExpanded); 59733 }, [block, isExpanded]); 59734 return images; 59735 } 59736 59737 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/block-select-button.js 59738 /** 59739 * External dependencies 59740 */ 59741 59742 59743 /** 59744 * WordPress dependencies 59745 */ 59746 59747 59748 59749 59750 59751 59752 /** 59753 * Internal dependencies 59754 */ 59755 59756 59757 59758 59759 59760 59761 59762 59763 59764 function ListViewBlockSelectButton({ 59765 className, 59766 block: { 59767 clientId 59768 }, 59769 onClick, 59770 onContextMenu, 59771 onMouseDown, 59772 onToggleExpanded, 59773 tabIndex, 59774 onFocus, 59775 onDragStart, 59776 onDragEnd, 59777 draggable, 59778 isExpanded, 59779 ariaDescribedBy 59780 }, ref) { 59781 const blockInformation = useBlockDisplayInformation(clientId); 59782 const blockTitle = useBlockDisplayTitle({ 59783 clientId, 59784 context: 'list-view' 59785 }); 59786 const { 59787 isLocked 59788 } = useBlockLock(clientId); 59789 const { 59790 isContentOnly 59791 } = (0,external_wp_data_namespaceObject.useSelect)(select => ({ 59792 isContentOnly: select(store).getBlockEditingMode(clientId) === 'contentOnly' 59793 }), [clientId]); 59794 const shouldShowLockIcon = isLocked && !isContentOnly; 59795 const isSticky = blockInformation?.positionType === 'sticky'; 59796 const images = useListViewImages({ 59797 clientId, 59798 isExpanded 59799 }); 59800 59801 // The `href` attribute triggers the browser's native HTML drag operations. 59802 // When the link is dragged, the element's outerHTML is set in DataTransfer object as text/html. 59803 // We need to clear any HTML drag data to prevent `pasteHandler` from firing 59804 // inside the `useOnBlockDrop` hook. 59805 const onDragStartHandler = event => { 59806 event.dataTransfer.clearData(); 59807 onDragStart?.(event); 59808 }; 59809 59810 /** 59811 * @param {KeyboardEvent} event 59812 */ 59813 function onKeyDown(event) { 59814 if (event.keyCode === external_wp_keycodes_namespaceObject.ENTER || event.keyCode === external_wp_keycodes_namespaceObject.SPACE) { 59815 onClick(event); 59816 } 59817 } 59818 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("a", { 59819 className: dist_clsx('block-editor-list-view-block-select-button', className), 59820 onClick: onClick, 59821 onContextMenu: onContextMenu, 59822 onKeyDown: onKeyDown, 59823 onMouseDown: onMouseDown, 59824 ref: ref, 59825 tabIndex: tabIndex, 59826 onFocus: onFocus, 59827 onDragStart: onDragStartHandler, 59828 onDragEnd: onDragEnd, 59829 draggable: draggable, 59830 href: `#block-$clientId}`, 59831 "aria-describedby": ariaDescribedBy, 59832 "aria-expanded": isExpanded, 59833 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListViewExpander, { 59834 onClick: onToggleExpanded 59835 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 59836 icon: blockInformation?.icon, 59837 showColors: true, 59838 context: "list-view" 59839 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 59840 alignment: "center", 59841 className: "block-editor-list-view-block-select-button__label-wrapper", 59842 justify: "flex-start", 59843 spacing: 1, 59844 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 59845 className: "block-editor-list-view-block-select-button__title", 59846 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, { 59847 ellipsizeMode: "auto", 59848 children: blockTitle 59849 }) 59850 }), blockInformation?.anchor && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 59851 className: "block-editor-list-view-block-select-button__anchor-wrapper", 59852 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, { 59853 className: "block-editor-list-view-block-select-button__anchor", 59854 ellipsizeMode: "auto", 59855 children: blockInformation.anchor 59856 }) 59857 }), isSticky && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 59858 className: "block-editor-list-view-block-select-button__sticky", 59859 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 59860 icon: pin_small 59861 }) 59862 }), images.length ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 59863 className: "block-editor-list-view-block-select-button__images", 59864 "aria-hidden": true, 59865 children: images.map((image, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 59866 className: "block-editor-list-view-block-select-button__image", 59867 style: { 59868 backgroundImage: `url($image.url})`, 59869 zIndex: images.length - index // Ensure the first image is on top, and subsequent images are behind. 59870 } 59871 }, image.clientId)) 59872 }) : null, shouldShowLockIcon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 59873 className: "block-editor-list-view-block-select-button__lock", 59874 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 59875 icon: lock_small 59876 }) 59877 })] 59878 })] 59879 }); 59880 } 59881 /* harmony default export */ const block_select_button = ((0,external_wp_element_namespaceObject.forwardRef)(ListViewBlockSelectButton)); 59882 59883 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/block-contents.js 59884 /** 59885 * External dependencies 59886 */ 59887 59888 59889 /** 59890 * WordPress dependencies 59891 */ 59892 59893 59894 59895 /** 59896 * Internal dependencies 59897 */ 59898 59899 59900 59901 59902 59903 59904 59905 const ListViewBlockContents = (0,external_wp_element_namespaceObject.forwardRef)(({ 59906 onClick, 59907 onToggleExpanded, 59908 block, 59909 isSelected, 59910 position, 59911 siblingBlockCount, 59912 level, 59913 isExpanded, 59914 selectedClientIds, 59915 ...props 59916 }, ref) => { 59917 const { 59918 clientId 59919 } = block; 59920 const { 59921 blockMovingClientId, 59922 selectedBlockInBlockEditor 59923 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 59924 const { 59925 hasBlockMovingClientId, 59926 getSelectedBlockClientId 59927 } = select(store); 59928 return { 59929 blockMovingClientId: hasBlockMovingClientId(), 59930 selectedBlockInBlockEditor: getSelectedBlockClientId() 59931 }; 59932 }, []); 59933 const { 59934 AdditionalBlockContent, 59935 insertedBlock, 59936 setInsertedBlock 59937 } = useListViewContext(); 59938 const isBlockMoveTarget = blockMovingClientId && selectedBlockInBlockEditor === clientId; 59939 const className = dist_clsx('block-editor-list-view-block-contents', { 59940 'is-dropping-before': isBlockMoveTarget 59941 }); 59942 59943 // Only include all selected blocks if the currently clicked on block 59944 // is one of the selected blocks. This ensures that if a user attempts 59945 // to drag a block that isn't part of the selection, they're still able 59946 // to drag it and rearrange its position. 59947 const draggableClientIds = selectedClientIds.includes(clientId) ? selectedClientIds : [clientId]; 59948 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 59949 children: [AdditionalBlockContent && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AdditionalBlockContent, { 59950 block: block, 59951 insertedBlock: insertedBlock, 59952 setInsertedBlock: setInsertedBlock 59953 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_draggable, { 59954 appendToOwnerDocument: true, 59955 clientIds: draggableClientIds, 59956 cloneClassname: "block-editor-list-view-draggable-chip", 59957 children: ({ 59958 draggable, 59959 onDragStart, 59960 onDragEnd 59961 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_select_button, { 59962 ref: ref, 59963 className: className, 59964 block: block, 59965 onClick: onClick, 59966 onToggleExpanded: onToggleExpanded, 59967 isSelected: isSelected, 59968 position: position, 59969 siblingBlockCount: siblingBlockCount, 59970 level: level, 59971 draggable: draggable, 59972 onDragStart: onDragStart, 59973 onDragEnd: onDragEnd, 59974 isExpanded: isExpanded, 59975 ...props 59976 }) 59977 })] 59978 }); 59979 }); 59980 /* harmony default export */ const block_contents = (ListViewBlockContents); 59981 59982 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/utils.js 59983 /** 59984 * WordPress dependencies 59985 */ 59986 59987 59988 const getBlockPositionDescription = (position, siblingCount, level) => (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: 1: The numerical position of the block. 2: The total number of blocks. 3. The level of nesting for the block. */ 59989 (0,external_wp_i18n_namespaceObject.__)('Block %1$d of %2$d, Level %3$d.'), position, siblingCount, level); 59990 const getBlockPropertiesDescription = (blockInformation, isLocked) => [blockInformation?.positionLabel ? `${(0,external_wp_i18n_namespaceObject.sprintf)( 59991 // translators: %s: Position of selected block, e.g. "Sticky" or "Fixed". 59992 (0,external_wp_i18n_namespaceObject.__)('Position: %s'), blockInformation.positionLabel)}.` : undefined, isLocked ? (0,external_wp_i18n_namespaceObject.__)('This block is locked.') : undefined].filter(Boolean).join(' '); 59993 59994 /** 59995 * Returns true if the client ID occurs within the block selection or multi-selection, 59996 * or false otherwise. 59997 * 59998 * @param {string} clientId Block client ID. 59999 * @param {string|string[]} selectedBlockClientIds Selected block client ID, or an array of multi-selected blocks client IDs. 60000 * 60001 * @return {boolean} Whether the block is in multi-selection set. 60002 */ 60003 const isClientIdSelected = (clientId, selectedBlockClientIds) => Array.isArray(selectedBlockClientIds) && selectedBlockClientIds.length ? selectedBlockClientIds.indexOf(clientId) !== -1 : selectedBlockClientIds === clientId; 60004 60005 /** 60006 * From a start and end clientId of potentially different nesting levels, 60007 * return the nearest-depth ids that have a common level of depth in the 60008 * nesting hierarchy. For multiple block selection, this ensure that the 60009 * selection is always at the same nesting level, and not split across 60010 * separate levels. 60011 * 60012 * @param {string} startId The first id of a selection. 60013 * @param {string} endId The end id of a selection, usually one that has been clicked on. 60014 * @param {string[]} startParents An array of ancestor ids for the start id, in descending order. 60015 * @param {string[]} endParents An array of ancestor ids for the end id, in descending order. 60016 * @return {Object} An object containing the start and end ids. 60017 */ 60018 function getCommonDepthClientIds(startId, endId, startParents, endParents) { 60019 const startPath = [...startParents, startId]; 60020 const endPath = [...endParents, endId]; 60021 const depth = Math.min(startPath.length, endPath.length) - 1; 60022 const start = startPath[depth]; 60023 const end = endPath[depth]; 60024 return { 60025 start, 60026 end 60027 }; 60028 } 60029 60030 /** 60031 * Shift focus to the list view item associated with a particular clientId. 60032 * 60033 * @typedef {import('@wordpress/element').RefObject} RefObject 60034 * 60035 * @param {string} focusClientId The client ID of the block to focus. 60036 * @param {?HTMLElement} treeGridElement The container element to search within. 60037 */ 60038 function focusListItem(focusClientId, treeGridElement) { 60039 const getFocusElement = () => { 60040 const row = treeGridElement?.querySelector(`[role=row][data-block="$focusClientId}"]`); 60041 if (!row) { 60042 return null; 60043 } 60044 // Focus the first focusable in the row, which is the ListViewBlockSelectButton. 60045 return external_wp_dom_namespaceObject.focus.focusable.find(row)[0]; 60046 }; 60047 let focusElement = getFocusElement(); 60048 if (focusElement) { 60049 focusElement.focus(); 60050 } else { 60051 // The element hasn't been painted yet. Defer focusing on the next frame. 60052 // This could happen when all blocks have been deleted and the default block 60053 // hasn't been added to the editor yet. 60054 window.requestAnimationFrame(() => { 60055 focusElement = getFocusElement(); 60056 60057 // Ignore if the element still doesn't exist. 60058 if (focusElement) { 60059 focusElement.focus(); 60060 } 60061 }); 60062 } 60063 } 60064 60065 /** 60066 * Get values for the block that flag whether the block should be displaced up or down, 60067 * whether the block is being nested, and whether the block appears after the dragged 60068 * blocks. These values are used to determine the class names to apply to the block. 60069 * The list view rows are displaced visually via CSS rules. Displacement rules: 60070 * - `normal`: no displacement — used to apply a translateY of `0` so that the block 60071 * appears in its original position, and moves to that position smoothly when dragging 60072 * outside of the list view area. 60073 * - `up`: the block should be displaced up, creating room beneath the block for the drop indicator. 60074 * - `down`: the block should be displaced down, creating room above the block for the drop indicator. 60075 * 60076 * @param {Object} props 60077 * @param {Object} props.blockIndexes The indexes of all the blocks in the list view, keyed by clientId. 60078 * @param {number|null|undefined} props.blockDropTargetIndex The index of the block that the user is dropping to. 60079 * @param {?string} props.blockDropPosition The position relative to the block that the user is dropping to. 60080 * @param {string} props.clientId The client id for the current block. 60081 * @param {?number} props.firstDraggedBlockIndex The index of the first dragged block. 60082 * @param {?boolean} props.isDragged Whether the current block is being dragged. Dragged blocks skip displacement. 60083 * @return {Object} An object containing the `displacement`, `isAfterDraggedBlocks` and `isNesting` values. 60084 */ 60085 function getDragDisplacementValues({ 60086 blockIndexes, 60087 blockDropTargetIndex, 60088 blockDropPosition, 60089 clientId, 60090 firstDraggedBlockIndex, 60091 isDragged 60092 }) { 60093 let displacement; 60094 let isNesting; 60095 let isAfterDraggedBlocks; 60096 if (!isDragged) { 60097 isNesting = false; 60098 const thisBlockIndex = blockIndexes[clientId]; 60099 isAfterDraggedBlocks = thisBlockIndex > firstDraggedBlockIndex; 60100 60101 // Determine where to displace the position of the current block, relative 60102 // to the blocks being dragged (in their original position) and the drop target 60103 // (the position where a user is currently dragging the blocks to). 60104 if (blockDropTargetIndex !== undefined && blockDropTargetIndex !== null && firstDraggedBlockIndex !== undefined) { 60105 // If the block is being dragged and there is a valid drop target, 60106 // determine if the block being rendered should be displaced up or down. 60107 60108 if (thisBlockIndex !== undefined) { 60109 if (thisBlockIndex >= firstDraggedBlockIndex && thisBlockIndex < blockDropTargetIndex) { 60110 // If the current block appears after the set of dragged blocks 60111 // (in their original position), but is before the drop target, 60112 // then the current block should be displaced up. 60113 displacement = 'up'; 60114 } else if (thisBlockIndex < firstDraggedBlockIndex && thisBlockIndex >= blockDropTargetIndex) { 60115 // If the current block appears before the set of dragged blocks 60116 // (in their original position), but is after the drop target, 60117 // then the current block should be displaced down. 60118 displacement = 'down'; 60119 } else { 60120 displacement = 'normal'; 60121 } 60122 isNesting = typeof blockDropTargetIndex === 'number' && blockDropTargetIndex - 1 === thisBlockIndex && blockDropPosition === 'inside'; 60123 } 60124 } else if (blockDropTargetIndex === null && firstDraggedBlockIndex !== undefined) { 60125 // A `null` value for `blockDropTargetIndex` indicates that the 60126 // drop target is outside of the valid areas within the list view. 60127 // In this case, the drag is still active, but as there is no 60128 // valid drop target, we should remove the gap indicating where 60129 // the block would be inserted. 60130 if (thisBlockIndex !== undefined && thisBlockIndex >= firstDraggedBlockIndex) { 60131 displacement = 'up'; 60132 } else { 60133 displacement = 'normal'; 60134 } 60135 } else if (blockDropTargetIndex !== undefined && blockDropTargetIndex !== null && firstDraggedBlockIndex === undefined) { 60136 // If the blockdrop target is defined, but there are no dragged blocks, 60137 // then the block should be displaced relative to the drop target. 60138 if (thisBlockIndex !== undefined) { 60139 if (thisBlockIndex < blockDropTargetIndex) { 60140 displacement = 'normal'; 60141 } else { 60142 displacement = 'down'; 60143 } 60144 } 60145 } else if (blockDropTargetIndex === null) { 60146 displacement = 'normal'; 60147 } 60148 } 60149 return { 60150 displacement, 60151 isNesting, 60152 isAfterDraggedBlocks 60153 }; 60154 } 60155 60156 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/block.js 60157 /** 60158 * External dependencies 60159 */ 60160 60161 60162 /** 60163 * WordPress dependencies 60164 */ 60165 60166 60167 60168 60169 60170 60171 60172 60173 60174 60175 60176 60177 /** 60178 * Internal dependencies 60179 */ 60180 60181 60182 60183 60184 60185 60186 60187 60188 60189 60190 60191 60192 60193 60194 function ListViewBlock({ 60195 block: { 60196 clientId 60197 }, 60198 displacement, 60199 isAfterDraggedBlocks, 60200 isDragged, 60201 isNesting, 60202 isSelected, 60203 isBranchSelected, 60204 selectBlock, 60205 position, 60206 level, 60207 rowCount, 60208 siblingBlockCount, 60209 showBlockMovers, 60210 path, 60211 isExpanded, 60212 selectedClientIds, 60213 isSyncedBranch 60214 }) { 60215 const cellRef = (0,external_wp_element_namespaceObject.useRef)(null); 60216 const rowRef = (0,external_wp_element_namespaceObject.useRef)(null); 60217 const settingsRef = (0,external_wp_element_namespaceObject.useRef)(null); 60218 const [isHovered, setIsHovered] = (0,external_wp_element_namespaceObject.useState)(false); 60219 const [settingsAnchorRect, setSettingsAnchorRect] = (0,external_wp_element_namespaceObject.useState)(); 60220 const { 60221 isLocked, 60222 canEdit, 60223 canMove 60224 } = useBlockLock(clientId); 60225 const isFirstSelectedBlock = isSelected && selectedClientIds[0] === clientId; 60226 const isLastSelectedBlock = isSelected && selectedClientIds[selectedClientIds.length - 1] === clientId; 60227 const { 60228 toggleBlockHighlight, 60229 duplicateBlocks, 60230 multiSelect, 60231 replaceBlocks, 60232 removeBlocks, 60233 insertAfterBlock, 60234 insertBeforeBlock, 60235 setOpenedBlockSettingsMenu 60236 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 60237 const { 60238 canInsertBlockType, 60239 getSelectedBlockClientIds, 60240 getPreviousBlockClientId, 60241 getBlockRootClientId, 60242 getBlockOrder, 60243 getBlockParents, 60244 getBlocksByClientId, 60245 canRemoveBlocks, 60246 isGroupable 60247 } = (0,external_wp_data_namespaceObject.useSelect)(store); 60248 const { 60249 getGroupingBlockName 60250 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 60251 const blockInformation = useBlockDisplayInformation(clientId); 60252 const { 60253 block, 60254 blockName, 60255 allowRightClickOverrides 60256 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 60257 const { 60258 getBlock, 60259 getBlockName, 60260 getSettings 60261 } = select(store); 60262 return { 60263 block: getBlock(clientId), 60264 blockName: getBlockName(clientId), 60265 allowRightClickOverrides: getSettings().allowRightClickOverrides 60266 }; 60267 }, [clientId]); 60268 const showBlockActions = 60269 // When a block hides its toolbar it also hides the block settings menu, 60270 // since that menu is part of the toolbar in the editor canvas. 60271 // List View respects this by also hiding the block settings menu. 60272 (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockName, '__experimentalToolbar', true); 60273 const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(ListViewBlock); 60274 const descriptionId = `list-view-block-select-button__description-$instanceId}`; 60275 const { 60276 expand, 60277 collapse, 60278 collapseAll, 60279 BlockSettingsMenu, 60280 listViewInstanceId, 60281 expandedState, 60282 setInsertedBlock, 60283 treeGridElementRef, 60284 rootClientId 60285 } = useListViewContext(); 60286 const isMatch = (0,external_wp_keyboardShortcuts_namespaceObject.__unstableUseShortcutEventMatch)(); 60287 60288 // Determine which blocks to update: 60289 // If the current (focused) block is part of the block selection, use the whole selection. 60290 // If the focused block is not part of the block selection, only update the focused block. 60291 function getBlocksToUpdate() { 60292 const selectedBlockClientIds = getSelectedBlockClientIds(); 60293 const isUpdatingSelectedBlocks = selectedBlockClientIds.includes(clientId); 60294 const firstBlockClientId = isUpdatingSelectedBlocks ? selectedBlockClientIds[0] : clientId; 60295 const firstBlockRootClientId = getBlockRootClientId(firstBlockClientId); 60296 const blocksToUpdate = isUpdatingSelectedBlocks ? selectedBlockClientIds : [clientId]; 60297 return { 60298 blocksToUpdate, 60299 firstBlockClientId, 60300 firstBlockRootClientId, 60301 selectedBlockClientIds 60302 }; 60303 } 60304 60305 /** 60306 * @param {KeyboardEvent} event 60307 */ 60308 async function onKeyDown(event) { 60309 if (event.defaultPrevented) { 60310 return; 60311 } 60312 60313 // Do not handle events if it comes from modals; 60314 // retain the default behavior for these keys. 60315 if (event.target.closest('[role=dialog]')) { 60316 return; 60317 } 60318 const isDeleteKey = [external_wp_keycodes_namespaceObject.BACKSPACE, external_wp_keycodes_namespaceObject.DELETE].includes(event.keyCode); 60319 60320 // If multiple blocks are selected, deselect all blocks when the user 60321 // presses the escape key. 60322 if (isMatch('core/block-editor/unselect', event) && selectedClientIds.length > 0) { 60323 event.stopPropagation(); 60324 event.preventDefault(); 60325 selectBlock(event, undefined); 60326 } else if (isDeleteKey || isMatch('core/block-editor/remove', event)) { 60327 var _getPreviousBlockClie; 60328 const { 60329 blocksToUpdate: blocksToDelete, 60330 firstBlockClientId, 60331 firstBlockRootClientId, 60332 selectedBlockClientIds 60333 } = getBlocksToUpdate(); 60334 60335 // Don't update the selection if the blocks cannot be deleted. 60336 if (!canRemoveBlocks(blocksToDelete)) { 60337 return; 60338 } 60339 let blockToFocus = (_getPreviousBlockClie = getPreviousBlockClientId(firstBlockClientId)) !== null && _getPreviousBlockClie !== void 0 ? _getPreviousBlockClie : 60340 // If the previous block is not found (when the first block is deleted), 60341 // fallback to focus the parent block. 60342 firstBlockRootClientId; 60343 removeBlocks(blocksToDelete, false); 60344 60345 // Update the selection if the original selection has been removed. 60346 const shouldUpdateSelection = selectedBlockClientIds.length > 0 && getSelectedBlockClientIds().length === 0; 60347 60348 // If there's no previous block nor parent block, focus the first block. 60349 if (!blockToFocus) { 60350 blockToFocus = getBlockOrder()[0]; 60351 } 60352 updateFocusAndSelection(blockToFocus, shouldUpdateSelection); 60353 } else if (isMatch('core/block-editor/duplicate', event)) { 60354 event.preventDefault(); 60355 const { 60356 blocksToUpdate, 60357 firstBlockRootClientId 60358 } = getBlocksToUpdate(); 60359 const canDuplicate = getBlocksByClientId(blocksToUpdate).every(blockToUpdate => { 60360 return !!blockToUpdate && (0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockToUpdate.name, 'multiple', true) && canInsertBlockType(blockToUpdate.name, firstBlockRootClientId); 60361 }); 60362 if (canDuplicate) { 60363 const updatedBlocks = await duplicateBlocks(blocksToUpdate, false); 60364 if (updatedBlocks?.length) { 60365 // If blocks have been duplicated, focus the first duplicated block. 60366 updateFocusAndSelection(updatedBlocks[0], false); 60367 } 60368 } 60369 } else if (isMatch('core/block-editor/insert-before', event)) { 60370 event.preventDefault(); 60371 const { 60372 blocksToUpdate 60373 } = getBlocksToUpdate(); 60374 await insertBeforeBlock(blocksToUpdate[0]); 60375 const newlySelectedBlocks = getSelectedBlockClientIds(); 60376 60377 // Focus the first block of the newly inserted blocks, to keep focus within the list view. 60378 setOpenedBlockSettingsMenu(undefined); 60379 updateFocusAndSelection(newlySelectedBlocks[0], false); 60380 } else if (isMatch('core/block-editor/insert-after', event)) { 60381 event.preventDefault(); 60382 const { 60383 blocksToUpdate 60384 } = getBlocksToUpdate(); 60385 await insertAfterBlock(blocksToUpdate.at(-1)); 60386 const newlySelectedBlocks = getSelectedBlockClientIds(); 60387 60388 // Focus the first block of the newly inserted blocks, to keep focus within the list view. 60389 setOpenedBlockSettingsMenu(undefined); 60390 updateFocusAndSelection(newlySelectedBlocks[0], false); 60391 } else if (isMatch('core/block-editor/select-all', event)) { 60392 event.preventDefault(); 60393 const { 60394 firstBlockRootClientId, 60395 selectedBlockClientIds 60396 } = getBlocksToUpdate(); 60397 const blockClientIds = getBlockOrder(firstBlockRootClientId); 60398 if (!blockClientIds.length) { 60399 return; 60400 } 60401 60402 // If we have selected all sibling nested blocks, try selecting up a level. 60403 // This is a similar implementation to that used by `useSelectAll`. 60404 // `isShallowEqual` is used for the list view instead of a length check, 60405 // as the array of siblings of the currently focused block may be a different 60406 // set of blocks from the current block selection if the user is focused 60407 // on a different part of the list view from the block selection. 60408 if (external_wp_isShallowEqual_default()(selectedBlockClientIds, blockClientIds)) { 60409 // Only select up a level if the first block is not the root block. 60410 // This ensures that the block selection can't break out of the root block 60411 // used by the list view, if the list view is only showing a partial hierarchy. 60412 if (firstBlockRootClientId && firstBlockRootClientId !== rootClientId) { 60413 updateFocusAndSelection(firstBlockRootClientId, true); 60414 return; 60415 } 60416 } 60417 60418 // Select all while passing `null` to skip focusing to the editor canvas, 60419 // and retain focus within the list view. 60420 multiSelect(blockClientIds[0], blockClientIds[blockClientIds.length - 1], null); 60421 } else if (isMatch('core/block-editor/collapse-list-view', event)) { 60422 event.preventDefault(); 60423 const { 60424 firstBlockClientId 60425 } = getBlocksToUpdate(); 60426 const blockParents = getBlockParents(firstBlockClientId, false); 60427 // Collapse all blocks. 60428 collapseAll(); 60429 // Expand all parents of the current block. 60430 expand(blockParents); 60431 } else if (isMatch('core/block-editor/group', event)) { 60432 const { 60433 blocksToUpdate 60434 } = getBlocksToUpdate(); 60435 if (blocksToUpdate.length > 1 && isGroupable(blocksToUpdate)) { 60436 event.preventDefault(); 60437 const blocks = getBlocksByClientId(blocksToUpdate); 60438 const groupingBlockName = getGroupingBlockName(); 60439 const newBlocks = (0,external_wp_blocks_namespaceObject.switchToBlockType)(blocks, groupingBlockName); 60440 replaceBlocks(blocksToUpdate, newBlocks); 60441 (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.__)('Selected blocks are grouped.')); 60442 const newlySelectedBlocks = getSelectedBlockClientIds(); 60443 // Focus the first block of the newly inserted blocks, to keep focus within the list view. 60444 setOpenedBlockSettingsMenu(undefined); 60445 updateFocusAndSelection(newlySelectedBlocks[0], false); 60446 } 60447 } 60448 } 60449 const onMouseEnter = (0,external_wp_element_namespaceObject.useCallback)(() => { 60450 setIsHovered(true); 60451 toggleBlockHighlight(clientId, true); 60452 }, [clientId, setIsHovered, toggleBlockHighlight]); 60453 const onMouseLeave = (0,external_wp_element_namespaceObject.useCallback)(() => { 60454 setIsHovered(false); 60455 toggleBlockHighlight(clientId, false); 60456 }, [clientId, setIsHovered, toggleBlockHighlight]); 60457 const selectEditorBlock = (0,external_wp_element_namespaceObject.useCallback)(event => { 60458 selectBlock(event, clientId); 60459 event.preventDefault(); 60460 }, [clientId, selectBlock]); 60461 const updateFocusAndSelection = (0,external_wp_element_namespaceObject.useCallback)((focusClientId, shouldSelectBlock) => { 60462 if (shouldSelectBlock) { 60463 selectBlock(undefined, focusClientId, null, null); 60464 } 60465 focusListItem(focusClientId, treeGridElementRef?.current); 60466 }, [selectBlock, treeGridElementRef]); 60467 const toggleExpanded = (0,external_wp_element_namespaceObject.useCallback)(event => { 60468 // Prevent shift+click from opening link in a new window when toggling. 60469 event.preventDefault(); 60470 event.stopPropagation(); 60471 if (isExpanded === true) { 60472 collapse(clientId); 60473 } else if (isExpanded === false) { 60474 expand(clientId); 60475 } 60476 }, [clientId, expand, collapse, isExpanded]); 60477 60478 // Allow right-clicking an item in the List View to open up the block settings dropdown. 60479 const onContextMenu = (0,external_wp_element_namespaceObject.useCallback)(event => { 60480 if (showBlockActions && allowRightClickOverrides) { 60481 settingsRef.current?.click(); 60482 // Ensure the position of the settings dropdown is at the cursor. 60483 setSettingsAnchorRect(new window.DOMRect(event.clientX, event.clientY, 0, 0)); 60484 event.preventDefault(); 60485 } 60486 }, [allowRightClickOverrides, settingsRef, showBlockActions]); 60487 const onMouseDown = (0,external_wp_element_namespaceObject.useCallback)(event => { 60488 // Prevent right-click from focusing the block, 60489 // because focus will be handled when opening the block settings dropdown. 60490 if (allowRightClickOverrides && event.button === 2) { 60491 event.preventDefault(); 60492 } 60493 }, [allowRightClickOverrides]); 60494 const settingsPopoverAnchor = (0,external_wp_element_namespaceObject.useMemo)(() => { 60495 const { 60496 ownerDocument 60497 } = rowRef?.current || {}; 60498 60499 // If no custom position is set, the settings dropdown will be anchored to the 60500 // DropdownMenu toggle button. 60501 if (!settingsAnchorRect || !ownerDocument) { 60502 return undefined; 60503 } 60504 60505 // Position the settings dropdown at the cursor when right-clicking a block. 60506 return { 60507 ownerDocument, 60508 getBoundingClientRect() { 60509 return settingsAnchorRect; 60510 } 60511 }; 60512 }, [settingsAnchorRect]); 60513 const clearSettingsAnchorRect = (0,external_wp_element_namespaceObject.useCallback)(() => { 60514 // Clear the custom position for the settings dropdown so that it is restored back 60515 // to being anchored to the DropdownMenu toggle button. 60516 setSettingsAnchorRect(undefined); 60517 }, [setSettingsAnchorRect]); 60518 60519 // Pass in a ref to the row, so that it can be scrolled 60520 // into view when selected. For long lists, the placeholder for the 60521 // selected block is also observed, within ListViewLeafPlaceholder. 60522 useListViewScrollIntoView({ 60523 isSelected, 60524 rowItemRef: rowRef, 60525 selectedClientIds 60526 }); 60527 60528 // When switching between rendering modes (such as template preview and content only), 60529 // it is possible for a block to temporarily be unavailable. In this case, we should not 60530 // render the leaf, to avoid errors further down the tree. 60531 if (!block) { 60532 return null; 60533 } 60534 const blockPositionDescription = getBlockPositionDescription(position, siblingBlockCount, level); 60535 const blockPropertiesDescription = getBlockPropertiesDescription(blockInformation, isLocked); 60536 const hasSiblings = siblingBlockCount > 0; 60537 const hasRenderedMovers = showBlockMovers && hasSiblings; 60538 const moverCellClassName = dist_clsx('block-editor-list-view-block__mover-cell', { 60539 'is-visible': isHovered || isSelected 60540 }); 60541 const listViewBlockSettingsClassName = dist_clsx('block-editor-list-view-block__menu-cell', { 60542 'is-visible': isHovered || isFirstSelectedBlock 60543 }); 60544 let colSpan; 60545 if (hasRenderedMovers) { 60546 colSpan = 2; 60547 } else if (!showBlockActions) { 60548 colSpan = 3; 60549 } 60550 const classes = dist_clsx({ 60551 'is-selected': isSelected, 60552 'is-first-selected': isFirstSelectedBlock, 60553 'is-last-selected': isLastSelectedBlock, 60554 'is-branch-selected': isBranchSelected, 60555 'is-synced-branch': isSyncedBranch, 60556 'is-dragging': isDragged, 60557 'has-single-cell': !showBlockActions, 60558 'is-synced': blockInformation?.isSynced, 60559 'is-draggable': canMove, 60560 'is-displacement-normal': displacement === 'normal', 60561 'is-displacement-up': displacement === 'up', 60562 'is-displacement-down': displacement === 'down', 60563 'is-after-dragged-blocks': isAfterDraggedBlocks, 60564 'is-nesting': isNesting 60565 }); 60566 60567 // Only include all selected blocks if the currently clicked on block 60568 // is one of the selected blocks. This ensures that if a user attempts 60569 // to alter a block that isn't part of the selection, they're still able 60570 // to do so. 60571 const dropdownClientIds = selectedClientIds.includes(clientId) ? selectedClientIds : [clientId]; 60572 60573 // Detect if there is a block in the canvas currently being edited and multi-selection is not happening. 60574 const currentlyEditingBlockInCanvas = isSelected && selectedClientIds.length === 1; 60575 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(leaf, { 60576 className: classes, 60577 isDragged: isDragged, 60578 onKeyDown: onKeyDown, 60579 onMouseEnter: onMouseEnter, 60580 onMouseLeave: onMouseLeave, 60581 onFocus: onMouseEnter, 60582 onBlur: onMouseLeave, 60583 level: level, 60584 position: position, 60585 rowCount: rowCount, 60586 path: path, 60587 id: `list-view-$listViewInstanceId}-block-$clientId}`, 60588 "data-block": clientId, 60589 "data-expanded": canEdit ? isExpanded : undefined, 60590 ref: rowRef, 60591 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTreeGridCell, { 60592 className: "block-editor-list-view-block__contents-cell", 60593 colSpan: colSpan, 60594 ref: cellRef, 60595 "aria-selected": !!isSelected, 60596 children: ({ 60597 ref, 60598 tabIndex, 60599 onFocus 60600 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 60601 className: "block-editor-list-view-block__contents-container", 60602 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_contents, { 60603 block: block, 60604 onClick: selectEditorBlock, 60605 onContextMenu: onContextMenu, 60606 onMouseDown: onMouseDown, 60607 onToggleExpanded: toggleExpanded, 60608 isSelected: isSelected, 60609 position: position, 60610 siblingBlockCount: siblingBlockCount, 60611 level: level, 60612 ref: ref, 60613 tabIndex: currentlyEditingBlockInCanvas ? 0 : tabIndex, 60614 onFocus: onFocus, 60615 isExpanded: canEdit ? isExpanded : undefined, 60616 selectedClientIds: selectedClientIds, 60617 ariaDescribedBy: descriptionId 60618 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AriaReferencedText, { 60619 id: descriptionId, 60620 children: [blockPositionDescription, blockPropertiesDescription].filter(Boolean).join(' ') 60621 })] 60622 }) 60623 }), hasRenderedMovers && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 60624 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalTreeGridCell, { 60625 className: moverCellClassName, 60626 withoutGridItem: true, 60627 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTreeGridItem, { 60628 children: ({ 60629 ref, 60630 tabIndex, 60631 onFocus 60632 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockMoverUpButton, { 60633 orientation: "vertical", 60634 clientIds: [clientId], 60635 ref: ref, 60636 tabIndex: tabIndex, 60637 onFocus: onFocus 60638 }) 60639 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTreeGridItem, { 60640 children: ({ 60641 ref, 60642 tabIndex, 60643 onFocus 60644 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockMoverDownButton, { 60645 orientation: "vertical", 60646 clientIds: [clientId], 60647 ref: ref, 60648 tabIndex: tabIndex, 60649 onFocus: onFocus 60650 }) 60651 })] 60652 }) 60653 }), showBlockActions && BlockSettingsMenu && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTreeGridCell, { 60654 className: listViewBlockSettingsClassName, 60655 "aria-selected": !!isSelected, 60656 ref: settingsRef, 60657 children: ({ 60658 ref, 60659 tabIndex, 60660 onFocus 60661 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockSettingsMenu, { 60662 clientIds: dropdownClientIds, 60663 block: block, 60664 icon: more_vertical, 60665 label: (0,external_wp_i18n_namespaceObject.__)('Options'), 60666 popoverProps: { 60667 anchor: settingsPopoverAnchor // Used to position the settings at the cursor on right-click. 60668 }, 60669 toggleProps: { 60670 ref, 60671 className: 'block-editor-list-view-block__menu', 60672 tabIndex, 60673 onClick: clearSettingsAnchorRect, 60674 onFocus 60675 }, 60676 disableOpenOnArrowDown: true, 60677 expand: expand, 60678 expandedState: expandedState, 60679 setInsertedBlock: setInsertedBlock, 60680 __experimentalSelectBlock: updateFocusAndSelection 60681 }) 60682 })] 60683 }); 60684 } 60685 /* harmony default export */ const list_view_block = ((0,external_wp_element_namespaceObject.memo)(ListViewBlock)); 60686 60687 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/branch.js 60688 /** 60689 * WordPress dependencies 60690 */ 60691 60692 60693 60694 60695 /** 60696 * Internal dependencies 60697 */ 60698 60699 60700 60701 60702 60703 60704 60705 /** 60706 * Given a block, returns the total number of blocks in that subtree. This is used to help determine 60707 * the list position of a block. 60708 * 60709 * When a block is collapsed, we do not count their children as part of that total. In the current drag 60710 * implementation dragged blocks and their children are not counted. 60711 * 60712 * @param {Object} block block tree 60713 * @param {Object} expandedState state that notes which branches are collapsed 60714 * @param {Array} draggedClientIds a list of dragged client ids 60715 * @param {boolean} isExpandedByDefault flag to determine the default fallback expanded state. 60716 * @return {number} block count 60717 */ 60718 60719 60720 60721 function countBlocks(block, expandedState, draggedClientIds, isExpandedByDefault) { 60722 var _expandedState$block$; 60723 const isDragged = draggedClientIds?.includes(block.clientId); 60724 if (isDragged) { 60725 return 0; 60726 } 60727 const isExpanded = (_expandedState$block$ = expandedState[block.clientId]) !== null && _expandedState$block$ !== void 0 ? _expandedState$block$ : isExpandedByDefault; 60728 if (isExpanded) { 60729 return 1 + block.innerBlocks.reduce(countReducer(expandedState, draggedClientIds, isExpandedByDefault), 0); 60730 } 60731 return 1; 60732 } 60733 const countReducer = (expandedState, draggedClientIds, isExpandedByDefault) => (count, block) => { 60734 var _expandedState$block$2; 60735 const isDragged = draggedClientIds?.includes(block.clientId); 60736 if (isDragged) { 60737 return count; 60738 } 60739 const isExpanded = (_expandedState$block$2 = expandedState[block.clientId]) !== null && _expandedState$block$2 !== void 0 ? _expandedState$block$2 : isExpandedByDefault; 60740 if (isExpanded && block.innerBlocks.length > 0) { 60741 return count + countBlocks(block, expandedState, draggedClientIds, isExpandedByDefault); 60742 } 60743 return count + 1; 60744 }; 60745 const branch_noop = () => {}; 60746 function ListViewBranch(props) { 60747 const { 60748 blocks, 60749 selectBlock = branch_noop, 60750 showBlockMovers, 60751 selectedClientIds, 60752 level = 1, 60753 path = '', 60754 isBranchSelected = false, 60755 listPosition = 0, 60756 fixedListWindow, 60757 isExpanded, 60758 parentId, 60759 shouldShowInnerBlocks = true, 60760 isSyncedBranch = false, 60761 showAppender: showAppenderProp = true 60762 } = props; 60763 const parentBlockInformation = useBlockDisplayInformation(parentId); 60764 const syncedBranch = isSyncedBranch || !!parentBlockInformation?.isSynced; 60765 const canParentExpand = (0,external_wp_data_namespaceObject.useSelect)(select => { 60766 if (!parentId) { 60767 return true; 60768 } 60769 return select(store).canEditBlock(parentId); 60770 }, [parentId]); 60771 const { 60772 blockDropPosition, 60773 blockDropTargetIndex, 60774 firstDraggedBlockIndex, 60775 blockIndexes, 60776 expandedState, 60777 draggedClientIds 60778 } = useListViewContext(); 60779 if (!canParentExpand) { 60780 return null; 60781 } 60782 60783 // Only show the appender at the first level. 60784 const showAppender = showAppenderProp && level === 1; 60785 const filteredBlocks = blocks.filter(Boolean); 60786 const blockCount = filteredBlocks.length; 60787 // The appender means an extra row in List View, so add 1 to the row count. 60788 const rowCount = showAppender ? blockCount + 1 : blockCount; 60789 let nextPosition = listPosition; 60790 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 60791 children: [filteredBlocks.map((block, index) => { 60792 var _expandedState$client; 60793 const { 60794 clientId, 60795 innerBlocks 60796 } = block; 60797 if (index > 0) { 60798 nextPosition += countBlocks(filteredBlocks[index - 1], expandedState, draggedClientIds, isExpanded); 60799 } 60800 const isDragged = !!draggedClientIds?.includes(clientId); 60801 60802 // Determine the displacement of the block while dragging. This 60803 // works out whether the current block should be displaced up or 60804 // down, relative to the dragged blocks and the drop target. 60805 const { 60806 displacement, 60807 isAfterDraggedBlocks, 60808 isNesting 60809 } = getDragDisplacementValues({ 60810 blockIndexes, 60811 blockDropTargetIndex, 60812 blockDropPosition, 60813 clientId, 60814 firstDraggedBlockIndex, 60815 isDragged 60816 }); 60817 const { 60818 itemInView 60819 } = fixedListWindow; 60820 const blockInView = itemInView(nextPosition); 60821 const position = index + 1; 60822 const updatedPath = path.length > 0 ? `$path}_$position}` : `$position}`; 60823 const hasNestedBlocks = !!innerBlocks?.length; 60824 const shouldExpand = hasNestedBlocks && shouldShowInnerBlocks ? (_expandedState$client = expandedState[clientId]) !== null && _expandedState$client !== void 0 ? _expandedState$client : isExpanded : undefined; 60825 60826 // Make updates to the selected or dragged blocks synchronous, 60827 // but asynchronous for any other block. 60828 const isSelected = isClientIdSelected(clientId, selectedClientIds); 60829 const isSelectedBranch = isBranchSelected || isSelected && hasNestedBlocks; 60830 60831 // To avoid performance issues, we only render blocks that are in view, 60832 // or blocks that are selected or dragged. If a block is selected, 60833 // it is only counted if it is the first of the block selection. 60834 // This prevents the entire tree from being rendered when a branch is 60835 // selected, or a user selects all blocks, while still enabling scroll 60836 // into view behavior when selecting a block or opening the list view. 60837 // The first and last blocks of the list are always rendered, to ensure 60838 // that Home and End keys work as expected. 60839 const showBlock = isDragged || blockInView || isSelected && clientId === selectedClientIds[0] || index === 0 || index === blockCount - 1; 60840 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_data_namespaceObject.AsyncModeProvider, { 60841 value: !isSelected, 60842 children: [showBlock && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(list_view_block, { 60843 block: block, 60844 selectBlock: selectBlock, 60845 isSelected: isSelected, 60846 isBranchSelected: isSelectedBranch, 60847 isDragged: isDragged, 60848 level: level, 60849 position: position, 60850 rowCount: rowCount, 60851 siblingBlockCount: blockCount, 60852 showBlockMovers: showBlockMovers, 60853 path: updatedPath, 60854 isExpanded: isDragged ? false : shouldExpand, 60855 listPosition: nextPosition, 60856 selectedClientIds: selectedClientIds, 60857 isSyncedBranch: syncedBranch, 60858 displacement: displacement, 60859 isAfterDraggedBlocks: isAfterDraggedBlocks, 60860 isNesting: isNesting 60861 }), !showBlock && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("tr", { 60862 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("td", { 60863 className: "block-editor-list-view-placeholder" 60864 }) 60865 }), hasNestedBlocks && shouldExpand && !isDragged && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListViewBranch, { 60866 parentId: clientId, 60867 blocks: innerBlocks, 60868 selectBlock: selectBlock, 60869 showBlockMovers: showBlockMovers, 60870 level: level + 1, 60871 path: updatedPath, 60872 listPosition: nextPosition + 1, 60873 fixedListWindow: fixedListWindow, 60874 isBranchSelected: isSelectedBranch, 60875 selectedClientIds: selectedClientIds, 60876 isExpanded: isExpanded, 60877 isSyncedBranch: syncedBranch 60878 })] 60879 }, clientId); 60880 }), showAppender && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTreeGridRow, { 60881 level: level, 60882 setSize: rowCount, 60883 positionInSet: rowCount, 60884 isExpanded: true, 60885 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTreeGridCell, { 60886 children: treeGridCellProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Appender, { 60887 clientId: parentId, 60888 nestingLevel: level, 60889 blockCount: blockCount, 60890 ...treeGridCellProps 60891 }) 60892 }) 60893 })] 60894 }); 60895 } 60896 /* harmony default export */ const branch = ((0,external_wp_element_namespaceObject.memo)(ListViewBranch)); 60897 60898 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/drop-indicator.js 60899 /** 60900 * External dependencies 60901 */ 60902 60903 60904 /** 60905 * WordPress dependencies 60906 */ 60907 60908 60909 60910 60911 60912 /** 60913 * Internal dependencies 60914 */ 60915 60916 60917 60918 60919 60920 60921 function ListViewDropIndicatorPreview({ 60922 draggedBlockClientId, 60923 listViewRef, 60924 blockDropTarget 60925 }) { 60926 const blockInformation = useBlockDisplayInformation(draggedBlockClientId); 60927 const blockTitle = useBlockDisplayTitle({ 60928 clientId: draggedBlockClientId, 60929 context: 'list-view' 60930 }); 60931 const { 60932 rootClientId, 60933 clientId, 60934 dropPosition 60935 } = blockDropTarget || {}; 60936 const [rootBlockElement, blockElement] = (0,external_wp_element_namespaceObject.useMemo)(() => { 60937 if (!listViewRef.current) { 60938 return []; 60939 } 60940 60941 // The rootClientId will be defined whenever dropping into inner 60942 // block lists, but is undefined when dropping at the root level. 60943 const _rootBlockElement = rootClientId ? listViewRef.current.querySelector(`[data-block="$rootClientId}"]`) : undefined; 60944 60945 // The clientId represents the sibling block, the dragged block will 60946 // usually be inserted adjacent to it. It will be undefined when 60947 // dropping a block into an empty block list. 60948 const _blockElement = clientId ? listViewRef.current.querySelector(`[data-block="$clientId}"]`) : undefined; 60949 return [_rootBlockElement, _blockElement]; 60950 }, [listViewRef, rootClientId, clientId]); 60951 60952 // The targetElement is the element that the drop indicator will appear 60953 // before or after. When dropping into an empty block list, blockElement 60954 // is undefined, so the indicator will appear after the rootBlockElement. 60955 const targetElement = blockElement || rootBlockElement; 60956 const rtl = (0,external_wp_i18n_namespaceObject.isRTL)(); 60957 const getDropIndicatorWidth = (0,external_wp_element_namespaceObject.useCallback)((targetElementRect, indent) => { 60958 if (!targetElement) { 60959 return 0; 60960 } 60961 60962 // Default to assuming that the width of the drop indicator 60963 // should be the same as the target element. 60964 let width = targetElement.offsetWidth; 60965 60966 // In deeply nested lists, where a scrollbar is present, 60967 // the width of the drop indicator should be the width of 60968 // the scroll container, minus the distance from the left 60969 // edge of the scroll container to the left edge of the 60970 // target element. 60971 const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(targetElement, 'horizontal'); 60972 const ownerDocument = targetElement.ownerDocument; 60973 const windowScroll = scrollContainer === ownerDocument.body || scrollContainer === ownerDocument.documentElement; 60974 if (scrollContainer && !windowScroll) { 60975 const scrollContainerRect = scrollContainer.getBoundingClientRect(); 60976 const distanceBetweenContainerAndTarget = (0,external_wp_i18n_namespaceObject.isRTL)() ? scrollContainerRect.right - targetElementRect.right : targetElementRect.left - scrollContainerRect.left; 60977 const scrollContainerWidth = scrollContainer.clientWidth; 60978 if (scrollContainerWidth < width + distanceBetweenContainerAndTarget) { 60979 width = scrollContainerWidth - distanceBetweenContainerAndTarget; 60980 } 60981 60982 // LTR logic for ensuring the drop indicator does not extend 60983 // beyond the right edge of the scroll container. 60984 if (!rtl && targetElementRect.left + indent < scrollContainerRect.left) { 60985 width -= scrollContainerRect.left - targetElementRect.left; 60986 return width; 60987 } 60988 60989 // RTL logic for ensuring the drop indicator does not extend 60990 // beyond the right edge of the scroll container. 60991 if (rtl && targetElementRect.right - indent > scrollContainerRect.right) { 60992 width -= targetElementRect.right - scrollContainerRect.right; 60993 return width; 60994 } 60995 } 60996 60997 // Subtract the indent from the final width of the indicator. 60998 return width - indent; 60999 }, [rtl, targetElement]); 61000 const style = (0,external_wp_element_namespaceObject.useMemo)(() => { 61001 if (!targetElement) { 61002 return {}; 61003 } 61004 const targetElementRect = targetElement.getBoundingClientRect(); 61005 return { 61006 width: getDropIndicatorWidth(targetElementRect, 0) 61007 }; 61008 }, [getDropIndicatorWidth, targetElement]); 61009 const horizontalScrollOffsetStyle = (0,external_wp_element_namespaceObject.useMemo)(() => { 61010 if (!targetElement) { 61011 return {}; 61012 } 61013 const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(targetElement); 61014 const ownerDocument = targetElement.ownerDocument; 61015 const windowScroll = scrollContainer === ownerDocument.body || scrollContainer === ownerDocument.documentElement; 61016 if (scrollContainer && !windowScroll) { 61017 const scrollContainerRect = scrollContainer.getBoundingClientRect(); 61018 const targetElementRect = targetElement.getBoundingClientRect(); 61019 const distanceBetweenContainerAndTarget = rtl ? scrollContainerRect.right - targetElementRect.right : targetElementRect.left - scrollContainerRect.left; 61020 if (!rtl && scrollContainerRect.left > targetElementRect.left) { 61021 return { 61022 transform: `translateX( $distanceBetweenContainerAndTarget}px )` 61023 }; 61024 } 61025 if (rtl && scrollContainerRect.right < targetElementRect.right) { 61026 return { 61027 transform: `translateX( $distanceBetweenContainerAndTarget * -1}px )` 61028 }; 61029 } 61030 } 61031 return {}; 61032 }, [rtl, targetElement]); 61033 const ariaLevel = (0,external_wp_element_namespaceObject.useMemo)(() => { 61034 if (!rootBlockElement) { 61035 return 1; 61036 } 61037 const _ariaLevel = parseInt(rootBlockElement.getAttribute('aria-level'), 10); 61038 return _ariaLevel ? _ariaLevel + 1 : 1; 61039 }, [rootBlockElement]); 61040 const hasAdjacentSelectedBranch = (0,external_wp_element_namespaceObject.useMemo)(() => { 61041 if (!targetElement) { 61042 return false; 61043 } 61044 return targetElement.classList.contains('is-branch-selected'); 61045 }, [targetElement]); 61046 const popoverAnchor = (0,external_wp_element_namespaceObject.useMemo)(() => { 61047 const isValidDropPosition = dropPosition === 'top' || dropPosition === 'bottom' || dropPosition === 'inside'; 61048 if (!targetElement || !isValidDropPosition) { 61049 return undefined; 61050 } 61051 return { 61052 contextElement: targetElement, 61053 getBoundingClientRect() { 61054 const rect = targetElement.getBoundingClientRect(); 61055 // In RTL languages, the drop indicator should be positioned 61056 // to the left of the target element, with the width of the 61057 // indicator determining the indent at the right edge of the 61058 // target element. In LTR languages, the drop indicator should 61059 // end at the right edge of the target element, with the indent 61060 // added to the position of the left edge of the target element. 61061 // let left = rtl ? rect.left : rect.left + indent; 61062 let left = rect.left; 61063 let top = 0; 61064 61065 // In deeply nested lists, where a scrollbar is present, 61066 // the width of the drop indicator should be the width of 61067 // the visible area of the scroll container. Additionally, 61068 // the left edge of the drop indicator line needs to be 61069 // offset by the distance the left edge of the target element 61070 // and the left edge of the scroll container. The ensures 61071 // that the drop indicator position never breaks out of the 61072 // visible area of the scroll container. 61073 const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(targetElement, 'horizontal'); 61074 const doc = targetElement.ownerDocument; 61075 const windowScroll = scrollContainer === doc.body || scrollContainer === doc.documentElement; 61076 61077 // If the scroll container is not the window, offset the left position, if need be. 61078 if (scrollContainer && !windowScroll) { 61079 const scrollContainerRect = scrollContainer.getBoundingClientRect(); 61080 61081 // In RTL languages, a vertical scrollbar is present on the 61082 // left edge of the scroll container. The width of the 61083 // scrollbar needs to be accounted for when positioning the 61084 // drop indicator. 61085 const scrollbarWidth = rtl ? scrollContainer.offsetWidth - scrollContainer.clientWidth : 0; 61086 if (left < scrollContainerRect.left + scrollbarWidth) { 61087 left = scrollContainerRect.left + scrollbarWidth; 61088 } 61089 } 61090 if (dropPosition === 'top') { 61091 top = rect.top - rect.height * 2; 61092 } else { 61093 // `dropPosition` is either `bottom` or `inside` 61094 top = rect.top; 61095 } 61096 const width = getDropIndicatorWidth(rect, 0); 61097 const height = rect.height; 61098 return new window.DOMRect(left, top, width, height); 61099 } 61100 }; 61101 }, [targetElement, dropPosition, getDropIndicatorWidth, rtl]); 61102 if (!targetElement) { 61103 return null; 61104 } 61105 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, { 61106 animate: false, 61107 anchor: popoverAnchor, 61108 focusOnMount: false, 61109 className: "block-editor-list-view-drop-indicator--preview", 61110 variant: "unstyled", 61111 flip: false, 61112 resize: true, 61113 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 61114 style: style, 61115 className: dist_clsx('block-editor-list-view-drop-indicator__line', { 61116 'block-editor-list-view-drop-indicator__line--darker': hasAdjacentSelectedBranch 61117 }), 61118 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 61119 className: "block-editor-list-view-leaf", 61120 "aria-level": ariaLevel, 61121 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 61122 className: dist_clsx('block-editor-list-view-block-select-button', 'block-editor-list-view-block-contents'), 61123 style: horizontalScrollOffsetStyle, 61124 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListViewExpander, { 61125 onClick: () => {} 61126 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 61127 icon: blockInformation?.icon, 61128 showColors: true, 61129 context: "list-view" 61130 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalHStack, { 61131 alignment: "center", 61132 className: "block-editor-list-view-block-select-button__label-wrapper", 61133 justify: "flex-start", 61134 spacing: 1, 61135 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 61136 className: "block-editor-list-view-block-select-button__title", 61137 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, { 61138 ellipsizeMode: "auto", 61139 children: blockTitle 61140 }) 61141 }) 61142 })] 61143 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 61144 className: "block-editor-list-view-block__menu-cell" 61145 })] 61146 }) 61147 }) 61148 }); 61149 } 61150 61151 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/use-block-selection.js 61152 /** 61153 * WordPress dependencies 61154 */ 61155 61156 61157 61158 61159 61160 61161 61162 /** 61163 * Internal dependencies 61164 */ 61165 61166 61167 function useBlockSelection() { 61168 const { 61169 clearSelectedBlock, 61170 multiSelect, 61171 selectBlock 61172 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 61173 const { 61174 getBlockName, 61175 getBlockParents, 61176 getBlockSelectionStart, 61177 getSelectedBlockClientIds, 61178 hasMultiSelection, 61179 hasSelectedBlock 61180 } = (0,external_wp_data_namespaceObject.useSelect)(store); 61181 const { 61182 getBlockType 61183 } = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store); 61184 const updateBlockSelection = (0,external_wp_element_namespaceObject.useCallback)(async (event, clientId, destinationClientId, focusPosition) => { 61185 if (!event?.shiftKey && event?.keyCode !== external_wp_keycodes_namespaceObject.ESCAPE) { 61186 selectBlock(clientId, focusPosition); 61187 return; 61188 } 61189 61190 // To handle multiple block selection via the `SHIFT` key, prevent 61191 // the browser default behavior of opening the link in a new window. 61192 event.preventDefault(); 61193 const isOnlyDeselection = event.type === 'keydown' && event.keyCode === external_wp_keycodes_namespaceObject.ESCAPE; 61194 const isKeyPress = event.type === 'keydown' && (event.keyCode === external_wp_keycodes_namespaceObject.UP || event.keyCode === external_wp_keycodes_namespaceObject.DOWN || event.keyCode === external_wp_keycodes_namespaceObject.HOME || event.keyCode === external_wp_keycodes_namespaceObject.END); 61195 61196 // Handle clicking on a block when no blocks are selected, and return early. 61197 if (!isKeyPress && !hasSelectedBlock() && !hasMultiSelection()) { 61198 selectBlock(clientId, null); 61199 return; 61200 } 61201 const selectedBlocks = getSelectedBlockClientIds(); 61202 const clientIdWithParents = [...getBlockParents(clientId), clientId]; 61203 if (isOnlyDeselection || isKeyPress && !selectedBlocks.some(blockId => clientIdWithParents.includes(blockId))) { 61204 // Ensure that shift-selecting blocks via the keyboard only 61205 // expands the current selection if focusing over already 61206 // selected blocks. Otherwise, clear the selection so that 61207 // a user can create a new selection entirely by keyboard. 61208 await clearSelectedBlock(); 61209 } 61210 61211 // Update selection, if not only clearing the selection. 61212 if (!isOnlyDeselection) { 61213 let startTarget = getBlockSelectionStart(); 61214 let endTarget = clientId; 61215 61216 // Handle keyboard behavior for selecting multiple blocks. 61217 if (isKeyPress) { 61218 if (!hasSelectedBlock() && !hasMultiSelection()) { 61219 // Set the starting point of the selection to the currently 61220 // focused block, if there are no blocks currently selected. 61221 // This ensures that as the selection is expanded or contracted, 61222 // the starting point of the selection is anchored to that block. 61223 startTarget = clientId; 61224 } 61225 if (destinationClientId) { 61226 // If the user presses UP or DOWN, we want to ensure that the block they're 61227 // moving to is the target for selection, and not the currently focused one. 61228 endTarget = destinationClientId; 61229 } 61230 } 61231 const startParents = getBlockParents(startTarget); 61232 const endParents = getBlockParents(endTarget); 61233 const { 61234 start, 61235 end 61236 } = getCommonDepthClientIds(startTarget, endTarget, startParents, endParents); 61237 await multiSelect(start, end, null); 61238 } 61239 61240 // Announce deselected block, or number of deselected blocks if 61241 // the total number of blocks deselected is greater than one. 61242 const updatedSelectedBlocks = getSelectedBlockClientIds(); 61243 61244 // If the selection is greater than 1 and the Home or End keys 61245 // were used to generate the selection, then skip announcing the 61246 // deselected blocks. 61247 if ((event.keyCode === external_wp_keycodes_namespaceObject.HOME || event.keyCode === external_wp_keycodes_namespaceObject.END) && updatedSelectedBlocks.length > 1) { 61248 return; 61249 } 61250 const selectionDiff = selectedBlocks.filter(blockId => !updatedSelectedBlocks.includes(blockId)); 61251 let label; 61252 if (selectionDiff.length === 1) { 61253 const title = getBlockType(getBlockName(selectionDiff[0]))?.title; 61254 if (title) { 61255 label = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: block name */ 61256 (0,external_wp_i18n_namespaceObject.__)('%s deselected.'), title); 61257 } 61258 } else if (selectionDiff.length > 1) { 61259 label = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: number of deselected blocks */ 61260 (0,external_wp_i18n_namespaceObject.__)('%s blocks deselected.'), selectionDiff.length); 61261 } 61262 if (label) { 61263 (0,external_wp_a11y_namespaceObject.speak)(label, 'assertive'); 61264 } 61265 }, [clearSelectedBlock, getBlockName, getBlockType, getBlockParents, getBlockSelectionStart, getSelectedBlockClientIds, hasMultiSelection, hasSelectedBlock, multiSelect, selectBlock]); 61266 return { 61267 updateBlockSelection 61268 }; 61269 } 61270 61271 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/use-list-view-block-indexes.js 61272 /** 61273 * WordPress dependencies 61274 */ 61275 61276 function useListViewBlockIndexes(blocks) { 61277 const blockIndexes = (0,external_wp_element_namespaceObject.useMemo)(() => { 61278 const indexes = {}; 61279 let currentGlobalIndex = 0; 61280 const traverseBlocks = blockList => { 61281 blockList.forEach(block => { 61282 indexes[block.clientId] = currentGlobalIndex; 61283 currentGlobalIndex++; 61284 if (block.innerBlocks.length > 0) { 61285 traverseBlocks(block.innerBlocks); 61286 } 61287 }); 61288 }; 61289 traverseBlocks(blocks); 61290 return indexes; 61291 }, [blocks]); 61292 return blockIndexes; 61293 } 61294 61295 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/use-list-view-client-ids.js 61296 /** 61297 * WordPress dependencies 61298 */ 61299 61300 61301 61302 /** 61303 * Internal dependencies 61304 */ 61305 61306 61307 function useListViewClientIds({ 61308 blocks, 61309 rootClientId 61310 }) { 61311 return (0,external_wp_data_namespaceObject.useSelect)(select => { 61312 const { 61313 getDraggedBlockClientIds, 61314 getSelectedBlockClientIds, 61315 getEnabledClientIdsTree 61316 } = unlock(select(store)); 61317 return { 61318 selectedClientIds: getSelectedBlockClientIds(), 61319 draggedClientIds: getDraggedBlockClientIds(), 61320 clientIdsTree: blocks !== null && blocks !== void 0 ? blocks : getEnabledClientIdsTree(rootClientId) 61321 }; 61322 }, [blocks, rootClientId]); 61323 } 61324 61325 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/use-list-view-collapse-items.js 61326 /** 61327 * WordPress dependencies 61328 */ 61329 61330 61331 61332 /** 61333 * Internal dependencies 61334 */ 61335 61336 61337 function useListViewCollapseItems({ 61338 collapseAll, 61339 expand 61340 }) { 61341 const { 61342 expandedBlock, 61343 getBlockParents 61344 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 61345 const { 61346 getBlockParents: _getBlockParents, 61347 getExpandedBlock 61348 } = unlock(select(store)); 61349 return { 61350 expandedBlock: getExpandedBlock(), 61351 getBlockParents: _getBlockParents 61352 }; 61353 }, []); 61354 61355 // Collapse all but the specified block when the expanded block client Id changes. 61356 (0,external_wp_element_namespaceObject.useEffect)(() => { 61357 if (expandedBlock) { 61358 const blockParents = getBlockParents(expandedBlock, false); 61359 // Collapse all blocks and expand the block's parents. 61360 collapseAll(); 61361 expand(blockParents); 61362 } 61363 }, [collapseAll, expand, expandedBlock, getBlockParents]); 61364 } 61365 61366 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/use-list-view-drop-zone.js 61367 /** 61368 * WordPress dependencies 61369 */ 61370 61371 61372 61373 61374 61375 /** 61376 * Internal dependencies 61377 */ 61378 61379 61380 61381 61382 /** @typedef {import('../../utils/math').WPPoint} WPPoint */ 61383 61384 /** 61385 * The type of a drag event. 61386 * 61387 * @typedef {'default'|'file'|'html'} WPDragEventType 61388 */ 61389 61390 /** 61391 * An object representing data for blocks in the DOM used by drag and drop. 61392 * 61393 * @typedef {Object} WPListViewDropZoneBlock 61394 * @property {string} clientId The client id for the block. 61395 * @property {string} rootClientId The root client id for the block. 61396 * @property {number} blockIndex The block's index. 61397 * @property {Element} element The DOM element representing the block. 61398 * @property {number} innerBlockCount The number of inner blocks the block has. 61399 * @property {boolean} isDraggedBlock Whether the block is currently being dragged. 61400 * @property {boolean} isExpanded Whether the block is expanded in the UI. 61401 * @property {boolean} canInsertDraggedBlocksAsSibling Whether the dragged block can be a sibling of this block. 61402 * @property {boolean} canInsertDraggedBlocksAsChild Whether the dragged block can be a child of this block. 61403 */ 61404 61405 /** 61406 * An array representing data for blocks in the DOM used by drag and drop. 61407 * 61408 * @typedef {WPListViewDropZoneBlock[]} WPListViewDropZoneBlocks 61409 */ 61410 61411 /** 61412 * An object containing details of a drop target. 61413 * 61414 * @typedef {Object} WPListViewDropZoneTarget 61415 * @property {string} blockIndex The insertion index. 61416 * @property {string} rootClientId The root client id for the block. 61417 * @property {string|undefined} clientId The client id for the block. 61418 * @property {'top'|'bottom'|'inside'} dropPosition The position relative to the block that the user is dropping to. 61419 * 'inside' refers to nesting as an inner block. 61420 */ 61421 61422 // When the indentation level, the corresponding left margin in `style.scss` 61423 // must be updated as well to ensure the drop zone is aligned with the indentation. 61424 const NESTING_LEVEL_INDENTATION = 24; 61425 61426 /** 61427 * Determines whether the user is positioning the dragged block to be 61428 * moved up to a parent level. 61429 * 61430 * Determined based on nesting level indentation of the current block. 61431 * 61432 * @param {WPPoint} point The point representing the cursor position when dragging. 61433 * @param {DOMRect} rect The rectangle. 61434 * @param {number} nestingLevel The nesting level of the block. 61435 * @param {boolean} rtl Whether the editor is in RTL mode. 61436 * @return {boolean} Whether the gesture is an upward gesture. 61437 */ 61438 function isUpGesture(point, rect, nestingLevel = 1, rtl = false) { 61439 // If the block is nested, and the user is dragging to the bottom 61440 // left of the block (or bottom right in RTL languages), then it is an upward gesture. 61441 const blockIndentPosition = rtl ? rect.right - nestingLevel * NESTING_LEVEL_INDENTATION : rect.left + nestingLevel * NESTING_LEVEL_INDENTATION; 61442 return rtl ? point.x > blockIndentPosition : point.x < blockIndentPosition; 61443 } 61444 61445 /** 61446 * Returns how many nesting levels up the user is attempting to drag to. 61447 * 61448 * The relative parent level is calculated based on how far 61449 * the cursor is from the provided nesting level (e.g. of a candidate block 61450 * that the user is hovering over). The nesting level is considered "desired" 61451 * because it is not guaranteed that the user will be able to drag to the desired level. 61452 * 61453 * The returned integer can be used to access an ascending array 61454 * of parent blocks, where the first item is the block the user 61455 * is hovering over, and the last item is the root block. 61456 * 61457 * @param {WPPoint} point The point representing the cursor position when dragging. 61458 * @param {DOMRect} rect The rectangle. 61459 * @param {number} nestingLevel The nesting level of the block. 61460 * @param {boolean} rtl Whether the editor is in RTL mode. 61461 * @return {number} The desired relative parent level. 61462 */ 61463 function getDesiredRelativeParentLevel(point, rect, nestingLevel = 1, rtl = false) { 61464 // In RTL languages, the block indent position is from the right edge of the block. 61465 // In LTR languages, the block indent position is from the left edge of the block. 61466 const blockIndentPosition = rtl ? rect.right - nestingLevel * NESTING_LEVEL_INDENTATION : rect.left + nestingLevel * NESTING_LEVEL_INDENTATION; 61467 const distanceBetweenPointAndBlockIndentPosition = rtl ? blockIndentPosition - point.x : point.x - blockIndentPosition; 61468 const desiredParentLevel = Math.round(distanceBetweenPointAndBlockIndentPosition / NESTING_LEVEL_INDENTATION); 61469 return Math.abs(desiredParentLevel); 61470 } 61471 61472 /** 61473 * Returns an array of the parent blocks of the block the user is dropping to. 61474 * 61475 * @param {WPListViewDropZoneBlock} candidateBlockData The block the user is dropping to. 61476 * @param {WPListViewDropZoneBlocks} blocksData Data about the blocks in list view. 61477 * @return {WPListViewDropZoneBlocks} An array of block parents, including the block the user is dropping to. 61478 */ 61479 function getCandidateBlockParents(candidateBlockData, blocksData) { 61480 const candidateBlockParents = []; 61481 let currentBlockData = candidateBlockData; 61482 while (currentBlockData) { 61483 candidateBlockParents.push({ 61484 ...currentBlockData 61485 }); 61486 currentBlockData = blocksData.find(blockData => blockData.clientId === currentBlockData.rootClientId); 61487 } 61488 return candidateBlockParents; 61489 } 61490 61491 /** 61492 * Given a list of blocks data and a block index, return the next non-dragged 61493 * block. This is used to determine the block that the user is dropping to, 61494 * while ignoring the dragged block. 61495 * 61496 * @param {WPListViewDropZoneBlocks} blocksData Data about the blocks in list view. 61497 * @param {number} index The index to begin searching from. 61498 * @return {WPListViewDropZoneBlock | undefined} The next non-dragged block. 61499 */ 61500 function getNextNonDraggedBlock(blocksData, index) { 61501 const nextBlockData = blocksData[index + 1]; 61502 if (nextBlockData && nextBlockData.isDraggedBlock) { 61503 return getNextNonDraggedBlock(blocksData, index + 1); 61504 } 61505 return nextBlockData; 61506 } 61507 61508 /** 61509 * Determines whether the user positioning the dragged block to nest as an 61510 * inner block. 61511 * 61512 * Determined based on nesting level indentation of the current block, plus 61513 * the indentation of the next level of nesting. The vertical position of the 61514 * cursor must also be within the block. 61515 * 61516 * @param {WPPoint} point The point representing the cursor position when dragging. 61517 * @param {DOMRect} rect The rectangle. 61518 * @param {number} nestingLevel The nesting level of the block. 61519 * @param {boolean} rtl Whether the editor is in RTL mode. 61520 */ 61521 function isNestingGesture(point, rect, nestingLevel = 1, rtl = false) { 61522 const blockIndentPosition = rtl ? rect.right - nestingLevel * NESTING_LEVEL_INDENTATION : rect.left + nestingLevel * NESTING_LEVEL_INDENTATION; 61523 const isNestingHorizontalGesture = rtl ? point.x < blockIndentPosition - NESTING_LEVEL_INDENTATION : point.x > blockIndentPosition + NESTING_LEVEL_INDENTATION; 61524 return isNestingHorizontalGesture && point.y < rect.bottom; 61525 } 61526 61527 // Block navigation is always a vertical list, so only allow dropping 61528 // to the above or below a block. 61529 const ALLOWED_DROP_EDGES = ['top', 'bottom']; 61530 61531 /** 61532 * Given blocks data and the cursor position, compute the drop target. 61533 * 61534 * @param {WPListViewDropZoneBlocks} blocksData Data about the blocks in list view. 61535 * @param {WPPoint} position The point representing the cursor position when dragging. 61536 * @param {boolean} rtl Whether the editor is in RTL mode. 61537 * 61538 * @return {WPListViewDropZoneTarget | undefined} An object containing data about the drop target. 61539 */ 61540 function getListViewDropTarget(blocksData, position, rtl = false) { 61541 let candidateEdge; 61542 let candidateBlockData; 61543 let candidateDistance; 61544 let candidateRect; 61545 let candidateBlockIndex; 61546 for (let i = 0; i < blocksData.length; i++) { 61547 const blockData = blocksData[i]; 61548 if (blockData.isDraggedBlock) { 61549 continue; 61550 } 61551 const rect = blockData.element.getBoundingClientRect(); 61552 const [distance, edge] = getDistanceToNearestEdge(position, rect, ALLOWED_DROP_EDGES); 61553 const isCursorWithinBlock = isPointContainedByRect(position, rect); 61554 if (candidateDistance === undefined || distance < candidateDistance || isCursorWithinBlock) { 61555 candidateDistance = distance; 61556 const index = blocksData.indexOf(blockData); 61557 const previousBlockData = blocksData[index - 1]; 61558 61559 // If dragging near the top of a block and the preceding block 61560 // is at the same level, use the preceding block as the candidate 61561 // instead, as later it makes determining a nesting drop easier. 61562 if (edge === 'top' && previousBlockData && previousBlockData.rootClientId === blockData.rootClientId && !previousBlockData.isDraggedBlock) { 61563 candidateBlockData = previousBlockData; 61564 candidateEdge = 'bottom'; 61565 candidateRect = previousBlockData.element.getBoundingClientRect(); 61566 candidateBlockIndex = index - 1; 61567 } else { 61568 candidateBlockData = blockData; 61569 candidateEdge = edge; 61570 candidateRect = rect; 61571 candidateBlockIndex = index; 61572 } 61573 61574 // If the mouse position is within the block, break early 61575 // as the user would intend to drop either before or after 61576 // this block. 61577 // 61578 // This solves an issue where some rows in the list view 61579 // tree overlap slightly due to sub-pixel rendering. 61580 if (isCursorWithinBlock) { 61581 break; 61582 } 61583 } 61584 } 61585 if (!candidateBlockData) { 61586 return; 61587 } 61588 const candidateBlockParents = getCandidateBlockParents(candidateBlockData, blocksData); 61589 const isDraggingBelow = candidateEdge === 'bottom'; 61590 61591 // If the user is dragging towards the bottom of the block check whether 61592 // they might be trying to nest the block as a child. 61593 // If the block already has inner blocks, and is expanded, this should be treated 61594 // as nesting since the next block in the tree will be the first child. 61595 // However, if the block is collapsed, dragging beneath the block should 61596 // still be allowed, as the next visible block in the tree will be a sibling. 61597 if (isDraggingBelow && candidateBlockData.canInsertDraggedBlocksAsChild && (candidateBlockData.innerBlockCount > 0 && candidateBlockData.isExpanded || isNestingGesture(position, candidateRect, candidateBlockParents.length, rtl))) { 61598 // If the block is expanded, insert the block as the first child. 61599 // Otherwise, for collapsed blocks, insert the block as the last child. 61600 const newBlockIndex = candidateBlockData.isExpanded ? 0 : candidateBlockData.innerBlockCount || 0; 61601 return { 61602 rootClientId: candidateBlockData.clientId, 61603 clientId: candidateBlockData.clientId, 61604 blockIndex: newBlockIndex, 61605 dropPosition: 'inside' 61606 }; 61607 } 61608 61609 // If the user is dragging towards the bottom of the block check whether 61610 // they might be trying to move the block to be at a parent level. 61611 if (isDraggingBelow && candidateBlockData.rootClientId && isUpGesture(position, candidateRect, candidateBlockParents.length, rtl)) { 61612 const nextBlock = getNextNonDraggedBlock(blocksData, candidateBlockIndex); 61613 const currentLevel = candidateBlockData.nestingLevel; 61614 const nextLevel = nextBlock ? nextBlock.nestingLevel : 1; 61615 if (currentLevel && nextLevel) { 61616 // Determine the desired relative level of the block to be dropped. 61617 const desiredRelativeLevel = getDesiredRelativeParentLevel(position, candidateRect, candidateBlockParents.length, rtl); 61618 const targetParentIndex = Math.max(Math.min(desiredRelativeLevel, currentLevel - nextLevel), 0); 61619 if (candidateBlockParents[targetParentIndex]) { 61620 // Default to the block index of the candidate block. 61621 let newBlockIndex = candidateBlockData.blockIndex; 61622 61623 // If the next block is at the same level, use that as the default 61624 // block index. This ensures that the block is dropped in the correct 61625 // position when dragging to the bottom of a block. 61626 if (candidateBlockParents[targetParentIndex].nestingLevel === nextBlock?.nestingLevel) { 61627 newBlockIndex = nextBlock?.blockIndex; 61628 } else { 61629 // Otherwise, search from the current block index back 61630 // to find the last block index within the same target parent. 61631 for (let i = candidateBlockIndex; i >= 0; i--) { 61632 const blockData = blocksData[i]; 61633 if (blockData.rootClientId === candidateBlockParents[targetParentIndex].rootClientId) { 61634 newBlockIndex = blockData.blockIndex + 1; 61635 break; 61636 } 61637 } 61638 } 61639 return { 61640 rootClientId: candidateBlockParents[targetParentIndex].rootClientId, 61641 clientId: candidateBlockData.clientId, 61642 blockIndex: newBlockIndex, 61643 dropPosition: candidateEdge 61644 }; 61645 } 61646 } 61647 } 61648 61649 // If dropping as a sibling, but block cannot be inserted in 61650 // this context, return early. 61651 if (!candidateBlockData.canInsertDraggedBlocksAsSibling) { 61652 return; 61653 } 61654 const offset = isDraggingBelow ? 1 : 0; 61655 return { 61656 rootClientId: candidateBlockData.rootClientId, 61657 clientId: candidateBlockData.clientId, 61658 blockIndex: candidateBlockData.blockIndex + offset, 61659 dropPosition: candidateEdge 61660 }; 61661 } 61662 61663 // Throttle options need to be defined outside of the hook to avoid 61664 // re-creating the object on every render. This is due to a limitation 61665 // of the `useThrottle` hook, where the options object is included 61666 // in the dependency array for memoization. 61667 const EXPAND_THROTTLE_OPTIONS = { 61668 leading: false, 61669 // Don't call the function immediately on the first call. 61670 trailing: true // Do call the function on the last call. 61671 }; 61672 61673 /** 61674 * A react hook for implementing a drop zone in list view. 61675 * 61676 * @param {Object} props Named parameters. 61677 * @param {?HTMLElement} [props.dropZoneElement] Optional element to be used as the drop zone. 61678 * @param {Object} [props.expandedState] The expanded state of the blocks in the list view. 61679 * @param {Function} [props.setExpandedState] Function to set the expanded state of a list of block clientIds. 61680 * 61681 * @return {WPListViewDropZoneTarget} The drop target. 61682 */ 61683 function useListViewDropZone({ 61684 dropZoneElement, 61685 expandedState, 61686 setExpandedState 61687 }) { 61688 const { 61689 getBlockRootClientId, 61690 getBlockIndex, 61691 getBlockCount, 61692 getDraggedBlockClientIds, 61693 canInsertBlocks 61694 } = (0,external_wp_data_namespaceObject.useSelect)(store); 61695 const [target, setTarget] = (0,external_wp_element_namespaceObject.useState)(); 61696 const { 61697 rootClientId: targetRootClientId, 61698 blockIndex: targetBlockIndex 61699 } = target || {}; 61700 const onBlockDrop = useOnBlockDrop(targetRootClientId, targetBlockIndex); 61701 const rtl = (0,external_wp_i18n_namespaceObject.isRTL)(); 61702 const previousRootClientId = (0,external_wp_compose_namespaceObject.usePrevious)(targetRootClientId); 61703 const maybeExpandBlock = (0,external_wp_element_namespaceObject.useCallback)((_expandedState, _target) => { 61704 // If the user is attempting to drop a block inside a collapsed block, 61705 // that is, using a nesting gesture flagged by 'inside' dropPosition, 61706 // expand the block within the list view, if it isn't already. 61707 const { 61708 rootClientId 61709 } = _target || {}; 61710 if (!rootClientId) { 61711 return; 61712 } 61713 if (_target?.dropPosition === 'inside' && !_expandedState[rootClientId]) { 61714 setExpandedState({ 61715 type: 'expand', 61716 clientIds: [rootClientId] 61717 }); 61718 } 61719 }, [setExpandedState]); 61720 61721 // Throttle the maybeExpandBlock function to avoid expanding the block 61722 // too quickly when the user is dragging over the block. This is to 61723 // avoid expanding the block when the user is just passing over it. 61724 const throttledMaybeExpandBlock = (0,external_wp_compose_namespaceObject.useThrottle)(maybeExpandBlock, 500, EXPAND_THROTTLE_OPTIONS); 61725 (0,external_wp_element_namespaceObject.useEffect)(() => { 61726 if (target?.dropPosition !== 'inside' || previousRootClientId !== target?.rootClientId) { 61727 throttledMaybeExpandBlock.cancel(); 61728 return; 61729 } 61730 throttledMaybeExpandBlock(expandedState, target); 61731 }, [expandedState, previousRootClientId, target, throttledMaybeExpandBlock]); 61732 const draggedBlockClientIds = getDraggedBlockClientIds(); 61733 const throttled = (0,external_wp_compose_namespaceObject.useThrottle)((0,external_wp_element_namespaceObject.useCallback)((event, currentTarget) => { 61734 const position = { 61735 x: event.clientX, 61736 y: event.clientY 61737 }; 61738 const isBlockDrag = !!draggedBlockClientIds?.length; 61739 const blockElements = Array.from(currentTarget.querySelectorAll('[data-block]')); 61740 const blocksData = blockElements.map(blockElement => { 61741 const clientId = blockElement.dataset.block; 61742 const isExpanded = blockElement.dataset.expanded === 'true'; 61743 const isDraggedBlock = blockElement.classList.contains('is-dragging'); 61744 61745 // Get nesting level from `aria-level` attribute because Firefox does not support `element.ariaLevel`. 61746 const nestingLevel = parseInt(blockElement.getAttribute('aria-level'), 10); 61747 const rootClientId = getBlockRootClientId(clientId); 61748 return { 61749 clientId, 61750 isExpanded, 61751 rootClientId, 61752 blockIndex: getBlockIndex(clientId), 61753 element: blockElement, 61754 nestingLevel: nestingLevel || undefined, 61755 isDraggedBlock: isBlockDrag ? isDraggedBlock : false, 61756 innerBlockCount: getBlockCount(clientId), 61757 canInsertDraggedBlocksAsSibling: isBlockDrag ? canInsertBlocks(draggedBlockClientIds, rootClientId) : true, 61758 canInsertDraggedBlocksAsChild: isBlockDrag ? canInsertBlocks(draggedBlockClientIds, clientId) : true 61759 }; 61760 }); 61761 const newTarget = getListViewDropTarget(blocksData, position, rtl); 61762 if (newTarget) { 61763 setTarget(newTarget); 61764 } 61765 }, [canInsertBlocks, draggedBlockClientIds, getBlockCount, getBlockIndex, getBlockRootClientId, rtl]), 50); 61766 const ref = (0,external_wp_compose_namespaceObject.__experimentalUseDropZone)({ 61767 dropZoneElement, 61768 onDrop(event) { 61769 throttled.cancel(); 61770 if (target) { 61771 onBlockDrop(event); 61772 } 61773 // Use `undefined` value to indicate that the drag has concluded. 61774 // This allows styling rules that are active only when a user is 61775 // dragging to be removed. 61776 setTarget(undefined); 61777 }, 61778 onDragLeave() { 61779 throttled.cancel(); 61780 // Use `null` value to indicate that the drop target is not valid, 61781 // but that the drag is still active. This allows for styling rules 61782 // that are active only when a user drags outside of the list view. 61783 setTarget(null); 61784 }, 61785 onDragOver(event) { 61786 // `currentTarget` is only available while the event is being 61787 // handled, so get it now and pass it to the thottled function. 61788 // https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget 61789 throttled(event, event.currentTarget); 61790 }, 61791 onDragEnd() { 61792 throttled.cancel(); 61793 // Use `undefined` value to indicate that the drag has concluded. 61794 // This allows styling rules that are active only when a user is 61795 // dragging to be removed. 61796 setTarget(undefined); 61797 } 61798 }); 61799 return { 61800 ref, 61801 target 61802 }; 61803 } 61804 61805 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/use-list-view-expand-selected-item.js 61806 /** 61807 * WordPress dependencies 61808 */ 61809 61810 61811 61812 /** 61813 * Internal dependencies 61814 */ 61815 61816 function useListViewExpandSelectedItem({ 61817 firstSelectedBlockClientId, 61818 setExpandedState 61819 }) { 61820 const [selectedTreeId, setSelectedTreeId] = (0,external_wp_element_namespaceObject.useState)(null); 61821 const { 61822 selectedBlockParentClientIds 61823 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 61824 const { 61825 getBlockParents 61826 } = select(store); 61827 return { 61828 selectedBlockParentClientIds: getBlockParents(firstSelectedBlockClientId, false) 61829 }; 61830 }, [firstSelectedBlockClientId]); 61831 61832 // Expand tree when a block is selected. 61833 (0,external_wp_element_namespaceObject.useEffect)(() => { 61834 // If the selectedTreeId is the same as the selected block, 61835 // it means that the block was selected using the block list tree. 61836 if (selectedTreeId === firstSelectedBlockClientId) { 61837 return; 61838 } 61839 61840 // If the selected block has parents, get the top-level parent. 61841 if (selectedBlockParentClientIds?.length) { 61842 // If the selected block has parents, 61843 // expand the tree branch. 61844 setExpandedState({ 61845 type: 'expand', 61846 clientIds: selectedBlockParentClientIds 61847 }); 61848 } 61849 }, [firstSelectedBlockClientId, selectedBlockParentClientIds, selectedTreeId, setExpandedState]); 61850 return { 61851 setSelectedTreeId 61852 }; 61853 } 61854 61855 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/use-clipboard-handler.js 61856 /** 61857 * WordPress dependencies 61858 */ 61859 61860 61861 61862 /** 61863 * Internal dependencies 61864 */ 61865 61866 61867 61868 61869 61870 // This hook borrows from useClipboardHandler in ../writing-flow/use-clipboard-handler.js 61871 // and adds behaviour for the list view, while skipping partial selection. 61872 function use_clipboard_handler_useClipboardHandler({ 61873 selectBlock 61874 }) { 61875 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 61876 const { 61877 getBlockOrder, 61878 getBlockRootClientId, 61879 getBlocksByClientId, 61880 getPreviousBlockClientId, 61881 getSelectedBlockClientIds, 61882 getSettings, 61883 canInsertBlockType, 61884 canRemoveBlocks 61885 } = (0,external_wp_data_namespaceObject.useSelect)(store); 61886 const { 61887 flashBlock, 61888 removeBlocks, 61889 replaceBlocks, 61890 insertBlocks 61891 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 61892 const notifyCopy = useNotifyCopy(); 61893 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 61894 function updateFocusAndSelection(focusClientId, shouldSelectBlock) { 61895 if (shouldSelectBlock) { 61896 selectBlock(undefined, focusClientId, null, null); 61897 } 61898 focusListItem(focusClientId, node); 61899 } 61900 61901 // Determine which blocks to update: 61902 // If the current (focused) block is part of the block selection, use the whole selection. 61903 // If the focused block is not part of the block selection, only update the focused block. 61904 function getBlocksToUpdate(clientId) { 61905 const selectedBlockClientIds = getSelectedBlockClientIds(); 61906 const isUpdatingSelectedBlocks = selectedBlockClientIds.includes(clientId); 61907 const firstBlockClientId = isUpdatingSelectedBlocks ? selectedBlockClientIds[0] : clientId; 61908 const firstBlockRootClientId = getBlockRootClientId(firstBlockClientId); 61909 const blocksToUpdate = isUpdatingSelectedBlocks ? selectedBlockClientIds : [clientId]; 61910 return { 61911 blocksToUpdate, 61912 firstBlockClientId, 61913 firstBlockRootClientId, 61914 originallySelectedBlockClientIds: selectedBlockClientIds 61915 }; 61916 } 61917 function handler(event) { 61918 if (event.defaultPrevented) { 61919 // This was possibly already handled in rich-text/use-paste-handler.js. 61920 return; 61921 } 61922 61923 // Only handle events that occur within the list view. 61924 if (!node.contains(event.target.ownerDocument.activeElement)) { 61925 return; 61926 } 61927 61928 // Retrieve the block clientId associated with the focused list view row. 61929 // This enables applying copy / cut / paste behavior to the focused block, 61930 // rather than just the blocks that are currently selected. 61931 const listViewRow = event.target.ownerDocument.activeElement?.closest('[role=row]'); 61932 const clientId = listViewRow?.dataset?.block; 61933 if (!clientId) { 61934 return; 61935 } 61936 const { 61937 blocksToUpdate: selectedBlockClientIds, 61938 firstBlockClientId, 61939 firstBlockRootClientId, 61940 originallySelectedBlockClientIds 61941 } = getBlocksToUpdate(clientId); 61942 if (selectedBlockClientIds.length === 0) { 61943 return; 61944 } 61945 event.preventDefault(); 61946 if (event.type === 'copy' || event.type === 'cut') { 61947 if (selectedBlockClientIds.length === 1) { 61948 flashBlock(selectedBlockClientIds[0]); 61949 } 61950 notifyCopy(event.type, selectedBlockClientIds); 61951 const blocks = getBlocksByClientId(selectedBlockClientIds); 61952 setClipboardBlocks(event, blocks, registry); 61953 } 61954 if (event.type === 'cut') { 61955 var _getPreviousBlockClie; 61956 // Don't update the selection if the blocks cannot be deleted. 61957 if (!canRemoveBlocks(selectedBlockClientIds)) { 61958 return; 61959 } 61960 let blockToFocus = (_getPreviousBlockClie = getPreviousBlockClientId(firstBlockClientId)) !== null && _getPreviousBlockClie !== void 0 ? _getPreviousBlockClie : 61961 // If the previous block is not found (when the first block is deleted), 61962 // fallback to focus the parent block. 61963 firstBlockRootClientId; 61964 61965 // Remove blocks, but don't update selection, and it will be handled below. 61966 removeBlocks(selectedBlockClientIds, false); 61967 61968 // Update the selection if the original selection has been removed. 61969 const shouldUpdateSelection = originallySelectedBlockClientIds.length > 0 && getSelectedBlockClientIds().length === 0; 61970 61971 // If there's no previous block nor parent block, focus the first block. 61972 if (!blockToFocus) { 61973 blockToFocus = getBlockOrder()[0]; 61974 } 61975 updateFocusAndSelection(blockToFocus, shouldUpdateSelection); 61976 } else if (event.type === 'paste') { 61977 const { 61978 __experimentalCanUserUseUnfilteredHTML: canUserUseUnfilteredHTML 61979 } = getSettings(); 61980 const blocks = getPasteBlocks(event, canUserUseUnfilteredHTML); 61981 if (selectedBlockClientIds.length === 1) { 61982 const [selectedBlockClientId] = selectedBlockClientIds; 61983 61984 // If a single block is focused, and the blocks to be posted can 61985 // be inserted within the block, then append the pasted blocks 61986 // within the focused block. For example, if you have copied a paragraph 61987 // block and paste it within a single Group block, this will append 61988 // the paragraph block within the Group block. 61989 if (blocks.every(block => canInsertBlockType(block.name, selectedBlockClientId))) { 61990 insertBlocks(blocks, undefined, selectedBlockClientId); 61991 updateFocusAndSelection(blocks[0]?.clientId, false); 61992 return; 61993 } 61994 } 61995 replaceBlocks(selectedBlockClientIds, blocks, blocks.length - 1, -1); 61996 updateFocusAndSelection(blocks[0]?.clientId, false); 61997 } 61998 } 61999 node.ownerDocument.addEventListener('copy', handler); 62000 node.ownerDocument.addEventListener('cut', handler); 62001 node.ownerDocument.addEventListener('paste', handler); 62002 return () => { 62003 node.ownerDocument.removeEventListener('copy', handler); 62004 node.ownerDocument.removeEventListener('cut', handler); 62005 node.ownerDocument.removeEventListener('paste', handler); 62006 }; 62007 }, []); 62008 } 62009 62010 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/index.js 62011 /** 62012 * External dependencies 62013 */ 62014 62015 62016 /** 62017 * WordPress dependencies 62018 */ 62019 62020 62021 62022 62023 62024 62025 62026 /** 62027 * Internal dependencies 62028 */ 62029 62030 62031 62032 62033 62034 62035 62036 62037 62038 62039 62040 62041 62042 62043 62044 const expanded = (state, action) => { 62045 if (action.type === 'clear') { 62046 return {}; 62047 } 62048 if (Array.isArray(action.clientIds)) { 62049 return { 62050 ...state, 62051 ...action.clientIds.reduce((newState, id) => ({ 62052 ...newState, 62053 [id]: action.type === 'expand' 62054 }), {}) 62055 }; 62056 } 62057 return state; 62058 }; 62059 const BLOCK_LIST_ITEM_HEIGHT = 32; 62060 62061 /** @typedef {import('react').ComponentType} ComponentType */ 62062 /** @typedef {import('react').Ref<HTMLElement>} Ref */ 62063 62064 /** 62065 * Show a hierarchical list of blocks. 62066 * 62067 * @param {Object} props Components props. 62068 * @param {string} props.id An HTML element id for the root element of ListView. 62069 * @param {Array} props.blocks _deprecated_ Custom subset of block client IDs to be used instead of the default hierarchy. 62070 * @param {?HTMLElement} props.dropZoneElement Optional element to be used as the drop zone. 62071 * @param {?boolean} props.showBlockMovers Flag to enable block movers. Defaults to `false`. 62072 * @param {?boolean} props.isExpanded Flag to determine whether nested levels are expanded by default. Defaults to `false`. 62073 * @param {?boolean} props.showAppender Flag to show or hide the block appender. Defaults to `false`. 62074 * @param {?ComponentType} props.blockSettingsMenu Optional more menu substitution. Defaults to the standard `BlockSettingsDropdown` component. 62075 * @param {string} props.rootClientId The client id of the root block from which we determine the blocks to show in the list. 62076 * @param {string} props.description Optional accessible description for the tree grid component. 62077 * @param {?Function} props.onSelect Optional callback to be invoked when a block is selected. Receives the block object that was selected. 62078 * @param {?ComponentType} props.additionalBlockContent Component that renders additional block content UI. 62079 * @param {Ref} ref Forwarded ref 62080 */ 62081 function ListViewComponent({ 62082 id, 62083 blocks, 62084 dropZoneElement, 62085 showBlockMovers = false, 62086 isExpanded = false, 62087 showAppender = false, 62088 blockSettingsMenu: BlockSettingsMenu = BlockSettingsDropdown, 62089 rootClientId, 62090 description, 62091 onSelect, 62092 additionalBlockContent: AdditionalBlockContent 62093 }, ref) { 62094 // This can be removed once we no longer need to support the blocks prop. 62095 if (blocks) { 62096 external_wp_deprecated_default()('`blocks` property in `wp.blockEditor.__experimentalListView`', { 62097 since: '6.3', 62098 alternative: '`rootClientId` property' 62099 }); 62100 } 62101 const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(ListViewComponent); 62102 const { 62103 clientIdsTree, 62104 draggedClientIds, 62105 selectedClientIds 62106 } = useListViewClientIds({ 62107 blocks, 62108 rootClientId 62109 }); 62110 const blockIndexes = useListViewBlockIndexes(clientIdsTree); 62111 const { 62112 getBlock 62113 } = (0,external_wp_data_namespaceObject.useSelect)(store); 62114 const { 62115 visibleBlockCount 62116 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 62117 const { 62118 getGlobalBlockCount, 62119 getClientIdsOfDescendants 62120 } = select(store); 62121 const draggedBlockCount = draggedClientIds?.length > 0 ? getClientIdsOfDescendants(draggedClientIds).length + 1 : 0; 62122 return { 62123 visibleBlockCount: getGlobalBlockCount() - draggedBlockCount 62124 }; 62125 }, [draggedClientIds]); 62126 const { 62127 updateBlockSelection 62128 } = useBlockSelection(); 62129 const [expandedState, setExpandedState] = (0,external_wp_element_namespaceObject.useReducer)(expanded, {}); 62130 const [insertedBlock, setInsertedBlock] = (0,external_wp_element_namespaceObject.useState)(null); 62131 const { 62132 setSelectedTreeId 62133 } = useListViewExpandSelectedItem({ 62134 firstSelectedBlockClientId: selectedClientIds[0], 62135 setExpandedState 62136 }); 62137 const selectEditorBlock = (0,external_wp_element_namespaceObject.useCallback)( 62138 /** 62139 * @param {MouseEvent | KeyboardEvent | undefined} event 62140 * @param {string} blockClientId 62141 * @param {null | undefined | -1 | 1} focusPosition 62142 */ 62143 (event, blockClientId, focusPosition) => { 62144 updateBlockSelection(event, blockClientId, null, focusPosition); 62145 setSelectedTreeId(blockClientId); 62146 if (onSelect) { 62147 onSelect(getBlock(blockClientId)); 62148 } 62149 }, [setSelectedTreeId, updateBlockSelection, onSelect, getBlock]); 62150 const { 62151 ref: dropZoneRef, 62152 target: blockDropTarget 62153 } = useListViewDropZone({ 62154 dropZoneElement, 62155 expandedState, 62156 setExpandedState 62157 }); 62158 const elementRef = (0,external_wp_element_namespaceObject.useRef)(); 62159 62160 // Allow handling of copy, cut, and paste events. 62161 const clipBoardRef = use_clipboard_handler_useClipboardHandler({ 62162 selectBlock: selectEditorBlock 62163 }); 62164 const treeGridRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([clipBoardRef, elementRef, dropZoneRef, ref]); 62165 (0,external_wp_element_namespaceObject.useEffect)(() => { 62166 // If a blocks are already selected when the list view is initially 62167 // mounted, shift focus to the first selected block. 62168 if (selectedClientIds?.length) { 62169 focusListItem(selectedClientIds[0], elementRef?.current); 62170 } 62171 // Disable reason: Only focus on the selected item when the list view is mounted. 62172 // eslint-disable-next-line react-hooks/exhaustive-deps 62173 }, []); 62174 const expand = (0,external_wp_element_namespaceObject.useCallback)(clientId => { 62175 if (!clientId) { 62176 return; 62177 } 62178 const clientIds = Array.isArray(clientId) ? clientId : [clientId]; 62179 setExpandedState({ 62180 type: 'expand', 62181 clientIds 62182 }); 62183 }, [setExpandedState]); 62184 const collapse = (0,external_wp_element_namespaceObject.useCallback)(clientId => { 62185 if (!clientId) { 62186 return; 62187 } 62188 setExpandedState({ 62189 type: 'collapse', 62190 clientIds: [clientId] 62191 }); 62192 }, [setExpandedState]); 62193 const collapseAll = (0,external_wp_element_namespaceObject.useCallback)(() => { 62194 setExpandedState({ 62195 type: 'clear' 62196 }); 62197 }, [setExpandedState]); 62198 const expandRow = (0,external_wp_element_namespaceObject.useCallback)(row => { 62199 expand(row?.dataset?.block); 62200 }, [expand]); 62201 const collapseRow = (0,external_wp_element_namespaceObject.useCallback)(row => { 62202 collapse(row?.dataset?.block); 62203 }, [collapse]); 62204 const focusRow = (0,external_wp_element_namespaceObject.useCallback)((event, startRow, endRow) => { 62205 if (event.shiftKey) { 62206 updateBlockSelection(event, startRow?.dataset?.block, endRow?.dataset?.block); 62207 } 62208 }, [updateBlockSelection]); 62209 useListViewCollapseItems({ 62210 collapseAll, 62211 expand 62212 }); 62213 const firstDraggedBlockClientId = draggedClientIds?.[0]; 62214 62215 // Convert a blockDropTarget into indexes relative to the blocks in the list view. 62216 // These values are used to determine which blocks should be displaced to make room 62217 // for the drop indicator. See `ListViewBranch` and `getDragDisplacementValues`. 62218 const { 62219 blockDropTargetIndex, 62220 blockDropPosition, 62221 firstDraggedBlockIndex 62222 } = (0,external_wp_element_namespaceObject.useMemo)(() => { 62223 let _blockDropTargetIndex, _firstDraggedBlockIndex; 62224 if (blockDropTarget?.clientId) { 62225 const foundBlockIndex = blockIndexes[blockDropTarget.clientId]; 62226 // If dragging below or inside the block, treat the drop target as the next block. 62227 _blockDropTargetIndex = foundBlockIndex === undefined || blockDropTarget?.dropPosition === 'top' ? foundBlockIndex : foundBlockIndex + 1; 62228 } else if (blockDropTarget === null) { 62229 // A `null` value is used to indicate that the user is dragging outside of the list view. 62230 _blockDropTargetIndex = null; 62231 } 62232 if (firstDraggedBlockClientId) { 62233 const foundBlockIndex = blockIndexes[firstDraggedBlockClientId]; 62234 _firstDraggedBlockIndex = foundBlockIndex === undefined || blockDropTarget?.dropPosition === 'top' ? foundBlockIndex : foundBlockIndex + 1; 62235 } 62236 return { 62237 blockDropTargetIndex: _blockDropTargetIndex, 62238 blockDropPosition: blockDropTarget?.dropPosition, 62239 firstDraggedBlockIndex: _firstDraggedBlockIndex 62240 }; 62241 }, [blockDropTarget, blockIndexes, firstDraggedBlockClientId]); 62242 const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 62243 blockDropPosition, 62244 blockDropTargetIndex, 62245 blockIndexes, 62246 draggedClientIds, 62247 expandedState, 62248 expand, 62249 firstDraggedBlockIndex, 62250 collapse, 62251 collapseAll, 62252 BlockSettingsMenu, 62253 listViewInstanceId: instanceId, 62254 AdditionalBlockContent, 62255 insertedBlock, 62256 setInsertedBlock, 62257 treeGridElementRef: elementRef, 62258 rootClientId 62259 }), [blockDropPosition, blockDropTargetIndex, blockIndexes, draggedClientIds, expandedState, expand, firstDraggedBlockIndex, collapse, collapseAll, BlockSettingsMenu, instanceId, AdditionalBlockContent, insertedBlock, setInsertedBlock, rootClientId]); 62260 62261 // List View renders a fixed number of items and relies on each having a fixed item height of 36px. 62262 // If this value changes, we should also change the itemHeight value set in useFixedWindowList. 62263 // See: https://github.com/WordPress/gutenberg/pull/35230 for additional context. 62264 const [fixedListWindow] = (0,external_wp_compose_namespaceObject.__experimentalUseFixedWindowList)(elementRef, BLOCK_LIST_ITEM_HEIGHT, visibleBlockCount, { 62265 // Ensure that the windowing logic is recalculated when the expanded state changes. 62266 // This is necessary because expanding a collapsed block in a short list view can 62267 // switch the list view to a tall list view with a scrollbar, and vice versa. 62268 // When this happens, the windowing logic needs to be recalculated to ensure that 62269 // the correct number of blocks are rendered, by rechecking for a scroll container. 62270 expandedState, 62271 useWindowing: true, 62272 windowOverscan: 40 62273 }); 62274 62275 // If there are no blocks to show and we're not showing the appender, do not render the list view. 62276 if (!clientIdsTree.length && !showAppender) { 62277 return null; 62278 } 62279 const describedById = description && `block-editor-list-view-description-$instanceId}`; 62280 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_data_namespaceObject.AsyncModeProvider, { 62281 value: true, 62282 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListViewDropIndicatorPreview, { 62283 draggedBlockClientId: firstDraggedBlockClientId, 62284 listViewRef: elementRef, 62285 blockDropTarget: blockDropTarget 62286 }), description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 62287 id: describedById, 62288 children: description 62289 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTreeGrid, { 62290 id: id, 62291 className: dist_clsx('block-editor-list-view-tree', { 62292 'is-dragging': draggedClientIds?.length > 0 && blockDropTargetIndex !== undefined 62293 }), 62294 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Block navigation structure'), 62295 ref: treeGridRef, 62296 onCollapseRow: collapseRow, 62297 onExpandRow: expandRow, 62298 onFocusRow: focusRow, 62299 applicationAriaLabel: (0,external_wp_i18n_namespaceObject.__)('Block navigation structure'), 62300 "aria-describedby": describedById, 62301 style: { 62302 '--wp-admin--list-view-dragged-items-height': draggedClientIds?.length ? `$BLOCK_LIST_ITEM_HEIGHT * (draggedClientIds.length - 1)}px` : null 62303 }, 62304 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListViewContext.Provider, { 62305 value: contextValue, 62306 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(branch, { 62307 blocks: clientIdsTree, 62308 parentId: rootClientId, 62309 selectBlock: selectEditorBlock, 62310 showBlockMovers: showBlockMovers, 62311 fixedListWindow: fixedListWindow, 62312 selectedClientIds: selectedClientIds, 62313 isExpanded: isExpanded, 62314 showAppender: showAppender 62315 }) 62316 }) 62317 })] 62318 }); 62319 } 62320 62321 // This is the private API for the ListView component. 62322 // It allows access to all props, not just the public ones. 62323 const PrivateListView = (0,external_wp_element_namespaceObject.forwardRef)(ListViewComponent); 62324 62325 // This is the public API for the ListView component. 62326 // We wrap the PrivateListView component to hide some props from the public API. 62327 /* harmony default export */ const components_list_view = ((0,external_wp_element_namespaceObject.forwardRef)((props, ref) => { 62328 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateListView, { 62329 ref: ref, 62330 ...props, 62331 showAppender: false, 62332 rootClientId: null, 62333 onSelect: null, 62334 additionalBlockContent: null, 62335 blockSettingsMenu: undefined 62336 }); 62337 })); 62338 62339 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-navigation/dropdown.js 62340 /** 62341 * WordPress dependencies 62342 */ 62343 62344 62345 /** 62346 * WordPress dependencies 62347 */ 62348 62349 62350 62351 62352 62353 62354 /** 62355 * Internal dependencies 62356 */ 62357 62358 62359 62360 62361 function BlockNavigationDropdownToggle({ 62362 isEnabled, 62363 onToggle, 62364 isOpen, 62365 innerRef, 62366 ...props 62367 }) { 62368 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 62369 // TODO: Switch to `true` (40px size) if possible 62370 , { 62371 __next40pxDefaultSize: false, 62372 ...props, 62373 ref: innerRef, 62374 icon: list_view, 62375 "aria-expanded": isOpen, 62376 "aria-haspopup": "true", 62377 onClick: isEnabled ? onToggle : undefined 62378 /* translators: button label text should, if possible, be under 16 characters. */, 62379 label: (0,external_wp_i18n_namespaceObject.__)('List view'), 62380 className: "block-editor-block-navigation", 62381 "aria-disabled": !isEnabled 62382 }); 62383 } 62384 function BlockNavigationDropdown({ 62385 isDisabled, 62386 ...props 62387 }, ref) { 62388 external_wp_deprecated_default()('wp.blockEditor.BlockNavigationDropdown', { 62389 since: '6.1', 62390 alternative: 'wp.components.Dropdown and wp.blockEditor.ListView' 62391 }); 62392 const hasBlocks = (0,external_wp_data_namespaceObject.useSelect)(select => !!select(store).getBlockCount(), []); 62393 const isEnabled = hasBlocks && !isDisabled; 62394 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 62395 contentClassName: "block-editor-block-navigation__popover", 62396 popoverProps: { 62397 placement: 'bottom-start' 62398 }, 62399 renderToggle: ({ 62400 isOpen, 62401 onToggle 62402 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockNavigationDropdownToggle, { 62403 ...props, 62404 innerRef: ref, 62405 isOpen: isOpen, 62406 onToggle: onToggle, 62407 isEnabled: isEnabled 62408 }), 62409 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 62410 className: "block-editor-block-navigation__container", 62411 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 62412 className: "block-editor-block-navigation__label", 62413 children: (0,external_wp_i18n_namespaceObject.__)('List view') 62414 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(components_list_view, {})] 62415 }) 62416 }); 62417 } 62418 /* harmony default export */ const dropdown = ((0,external_wp_element_namespaceObject.forwardRef)(BlockNavigationDropdown)); 62419 62420 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-styles/preview-panel.js 62421 /** 62422 * WordPress dependencies 62423 */ 62424 62425 62426 62427 /** 62428 * Internal dependencies 62429 */ 62430 62431 62432 62433 function BlockStylesPreviewPanel({ 62434 genericPreviewBlock, 62435 style, 62436 className, 62437 activeStyle 62438 }) { 62439 const example = (0,external_wp_blocks_namespaceObject.getBlockType)(genericPreviewBlock.name)?.example; 62440 const styleClassName = replaceActiveStyle(className, activeStyle, style); 62441 const previewBlocks = (0,external_wp_element_namespaceObject.useMemo)(() => { 62442 return { 62443 ...genericPreviewBlock, 62444 title: style.label || style.name, 62445 description: style.description, 62446 initialAttributes: { 62447 ...genericPreviewBlock.attributes, 62448 className: styleClassName + ' block-editor-block-styles__block-preview-container' 62449 }, 62450 example 62451 }; 62452 }, [genericPreviewBlock, styleClassName]); 62453 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(preview_panel, { 62454 item: previewBlocks 62455 }); 62456 } 62457 62458 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-styles/index.js 62459 /** 62460 * External dependencies 62461 */ 62462 62463 62464 /** 62465 * WordPress dependencies 62466 */ 62467 62468 62469 62470 62471 /** 62472 * Internal dependencies 62473 */ 62474 62475 62476 62477 62478 const block_styles_noop = () => {}; 62479 62480 // Block Styles component for the Settings Sidebar. 62481 function BlockStyles({ 62482 clientId, 62483 onSwitch = block_styles_noop, 62484 onHoverClassName = block_styles_noop 62485 }) { 62486 const { 62487 onSelect, 62488 stylesToRender, 62489 activeStyle, 62490 genericPreviewBlock, 62491 className: previewClassName 62492 } = useStylesForBlocks({ 62493 clientId, 62494 onSwitch 62495 }); 62496 const [hoveredStyle, setHoveredStyle] = (0,external_wp_element_namespaceObject.useState)(null); 62497 const isMobileViewport = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<'); 62498 if (!stylesToRender || stylesToRender.length === 0) { 62499 return null; 62500 } 62501 const debouncedSetHoveredStyle = (0,external_wp_compose_namespaceObject.debounce)(setHoveredStyle, 250); 62502 const onSelectStylePreview = style => { 62503 onSelect(style); 62504 onHoverClassName(null); 62505 setHoveredStyle(null); 62506 debouncedSetHoveredStyle.cancel(); 62507 }; 62508 const styleItemHandler = item => { 62509 var _item$name; 62510 if (hoveredStyle === item) { 62511 debouncedSetHoveredStyle.cancel(); 62512 return; 62513 } 62514 debouncedSetHoveredStyle(item); 62515 onHoverClassName((_item$name = item?.name) !== null && _item$name !== void 0 ? _item$name : null); 62516 }; 62517 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 62518 className: "block-editor-block-styles", 62519 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 62520 className: "block-editor-block-styles__variants", 62521 children: stylesToRender.map(style => { 62522 const buttonText = style.label || style.name; 62523 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 62524 __next40pxDefaultSize: true, 62525 className: dist_clsx('block-editor-block-styles__item', { 62526 'is-active': activeStyle.name === style.name 62527 }), 62528 variant: "secondary", 62529 label: buttonText, 62530 onMouseEnter: () => styleItemHandler(style), 62531 onFocus: () => styleItemHandler(style), 62532 onMouseLeave: () => styleItemHandler(null), 62533 onBlur: () => styleItemHandler(null), 62534 onClick: () => onSelectStylePreview(style), 62535 "aria-current": activeStyle.name === style.name, 62536 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, { 62537 numberOfLines: 1, 62538 className: "block-editor-block-styles__item-text", 62539 children: buttonText 62540 }) 62541 }, style.name); 62542 }) 62543 }), hoveredStyle && !isMobileViewport && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, { 62544 placement: "left-start", 62545 offset: 34, 62546 focusOnMount: false, 62547 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 62548 className: "block-editor-block-styles__preview-panel", 62549 onMouseLeave: () => styleItemHandler(null), 62550 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockStylesPreviewPanel, { 62551 activeStyle: activeStyle, 62552 className: previewClassName, 62553 genericPreviewBlock: genericPreviewBlock, 62554 style: hoveredStyle 62555 }) 62556 }) 62557 })] 62558 }); 62559 } 62560 /* harmony default export */ const block_styles = (BlockStyles); 62561 62562 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/paragraph.js 62563 /** 62564 * WordPress dependencies 62565 */ 62566 62567 62568 const paragraph = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 62569 xmlns: "http://www.w3.org/2000/svg", 62570 viewBox: "0 0 24 24", 62571 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 62572 d: "m9.99609 14v-.2251l.00391.0001v6.225h1.5v-14.5h2.5v14.5h1.5v-14.5h3v-1.5h-8.50391c-2.76142 0-5 2.23858-5 5 0 2.7614 2.23858 5 5 5z" 62573 }) 62574 }); 62575 /* harmony default export */ const library_paragraph = (paragraph); 62576 62577 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/heading-level-1.js 62578 /** 62579 * WordPress dependencies 62580 */ 62581 62582 62583 const headingLevel1 = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 62584 xmlns: "http://www.w3.org/2000/svg", 62585 viewBox: "0 0 24 24", 62586 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 62587 d: "M17.6 7c-.6.9-1.5 1.7-2.6 2v1h2v7h2V7h-1.4zM11 11H7V7H5v10h2v-4h4v4h2V7h-2v4z" 62588 }) 62589 }); 62590 /* harmony default export */ const heading_level_1 = (headingLevel1); 62591 62592 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/heading-level-2.js 62593 /** 62594 * WordPress dependencies 62595 */ 62596 62597 62598 const headingLevel2 = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 62599 xmlns: "http://www.w3.org/2000/svg", 62600 viewBox: "0 0 24 24", 62601 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 62602 d: "M9 11.1H5v-4H3v10h2v-4h4v4h2v-10H9v4zm8 4c.5-.4.6-.6 1.1-1.1.4-.4.8-.8 1.2-1.3.3-.4.6-.8.9-1.3.2-.4.3-.8.3-1.3 0-.4-.1-.9-.3-1.3-.2-.4-.4-.7-.8-1-.3-.3-.7-.5-1.2-.6-.5-.2-1-.2-1.5-.2-.4 0-.7 0-1.1.1-.3.1-.7.2-1 .3-.3.1-.6.3-.9.5-.3.2-.6.4-.8.7l1.2 1.2c.3-.3.6-.5 1-.7.4-.2.7-.3 1.2-.3s.9.1 1.3.4c.3.3.5.7.5 1.1 0 .4-.1.8-.4 1.1-.3.5-.6.9-1 1.2-.4.4-1 .9-1.6 1.4-.6.5-1.4 1.1-2.2 1.6v1.5h8v-2H17z" 62603 }) 62604 }); 62605 /* harmony default export */ const heading_level_2 = (headingLevel2); 62606 62607 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/heading-level-3.js 62608 /** 62609 * WordPress dependencies 62610 */ 62611 62612 62613 const headingLevel3 = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 62614 xmlns: "http://www.w3.org/2000/svg", 62615 viewBox: "0 0 24 24", 62616 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 62617 d: "M9 11H5V7H3v10h2v-4h4v4h2V7H9v4zm11.3 1.7c-.4-.4-1-.7-1.6-.8v-.1c.6-.2 1.1-.5 1.5-.9.3-.4.5-.8.5-1.3 0-.4-.1-.8-.3-1.1-.2-.3-.5-.6-.8-.8-.4-.2-.8-.4-1.2-.5-.6-.1-1.1-.2-1.6-.2-.6 0-1.3.1-1.8.3s-1.1.5-1.6.9l1.2 1.4c.4-.2.7-.4 1.1-.6.3-.2.7-.3 1.1-.3.4 0 .8.1 1.1.3.3.2.4.5.4.8 0 .4-.2.7-.6.9-.7.3-1.5.5-2.2.4v1.6c.5 0 1 0 1.5.1.3.1.7.2 1 .3.2.1.4.2.5.4s.1.4.1.6c0 .3-.2.7-.5.8-.4.2-.9.3-1.4.3s-1-.1-1.4-.3c-.4-.2-.8-.4-1.2-.7L13 15.6c.5.4 1 .8 1.6 1 .7.3 1.5.4 2.3.4.6 0 1.1-.1 1.6-.2.4-.1.9-.2 1.3-.5.4-.2.7-.5.9-.9.2-.4.3-.8.3-1.2 0-.6-.3-1.1-.7-1.5z" 62618 }) 62619 }); 62620 /* harmony default export */ const heading_level_3 = (headingLevel3); 62621 62622 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/heading-level-4.js 62623 /** 62624 * WordPress dependencies 62625 */ 62626 62627 62628 const headingLevel4 = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 62629 xmlns: "http://www.w3.org/2000/svg", 62630 viewBox: "0 0 24 24", 62631 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 62632 d: "M20 13V7h-3l-4 6v2h5v2h2v-2h1v-2h-1zm-2 0h-2.8L18 9v4zm-9-2H5V7H3v10h2v-4h4v4h2V7H9v4z" 62633 }) 62634 }); 62635 /* harmony default export */ const heading_level_4 = (headingLevel4); 62636 62637 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/heading-level-5.js 62638 /** 62639 * WordPress dependencies 62640 */ 62641 62642 62643 const headingLevel5 = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 62644 xmlns: "http://www.w3.org/2000/svg", 62645 viewBox: "0 0 24 24", 62646 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 62647 d: "M9 11H5V7H3v10h2v-4h4v4h2V7H9v4zm11.7 1.2c-.2-.3-.5-.7-.8-.9-.3-.3-.7-.5-1.1-.6-.5-.1-.9-.2-1.4-.2-.2 0-.5.1-.7.1-.2.1-.5.1-.7.2l.1-1.9h4.3V7H14l-.3 5 1 .6.5-.2.4-.1c.1-.1.3-.1.4-.1h.5c.5 0 1 .1 1.4.4.4.2.6.7.6 1.1 0 .4-.2.8-.6 1.1-.4.3-.9.4-1.4.4-.4 0-.9-.1-1.3-.3-.4-.2-.7-.4-1.1-.7 0 0-1.1 1.4-1 1.5.5.4 1 .8 1.6 1 .7.3 1.5.4 2.3.4.5 0 1-.1 1.5-.3s.9-.4 1.3-.7c.4-.3.7-.7.9-1.1s.3-.9.3-1.4-.1-1-.3-1.4z" 62648 }) 62649 }); 62650 /* harmony default export */ const heading_level_5 = (headingLevel5); 62651 62652 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/heading-level-6.js 62653 /** 62654 * WordPress dependencies 62655 */ 62656 62657 62658 const headingLevel6 = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 62659 xmlns: "http://www.w3.org/2000/svg", 62660 viewBox: "0 0 24 24", 62661 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 62662 d: "M20.7 12.4c-.2-.3-.4-.6-.7-.9s-.6-.5-1-.6c-.4-.2-.8-.2-1.2-.2-.5 0-.9.1-1.3.3s-.8.5-1.2.8c0-.5 0-.9.2-1.4l.6-.9c.2-.2.5-.4.8-.5.6-.2 1.3-.2 1.9 0 .3.1.6.3.8.5 0 0 1.3-1.3 1.3-1.4-.4-.3-.9-.6-1.4-.8-.6-.2-1.3-.3-2-.3-.6 0-1.1.1-1.7.4-.5.2-1 .5-1.4.9-.4.4-.8 1-1 1.6-.3.7-.4 1.5-.4 2.3s.1 1.5.3 2.1c.2.6.6 1.1 1 1.5.4.4.9.7 1.4.9 1 .3 2 .3 3 0 .4-.1.8-.3 1.2-.6.3-.3.6-.6.8-1 .2-.5.3-.9.3-1.4s-.1-.9-.3-1.3zm-2 2.1c-.1.2-.3.4-.4.5-.1.1-.3.2-.5.2-.2.1-.4.1-.6.1-.2.1-.5 0-.7-.1-.2 0-.3-.2-.5-.3-.1-.2-.3-.4-.4-.6-.2-.3-.3-.7-.3-1 .3-.3.6-.5 1-.7.3-.1.7-.2 1-.2.4 0 .8.1 1.1.3.3.3.4.7.4 1.1 0 .2 0 .5-.1.7zM9 11H5V7H3v10h2v-4h4v4h2V7H9v4z" 62663 }) 62664 }); 62665 /* harmony default export */ const heading_level_6 = (headingLevel6); 62666 62667 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-heading-level-dropdown/heading-level-icon.js 62668 /** 62669 * WordPress dependencies 62670 */ 62671 62672 62673 62674 /** @typedef {import('react').ComponentType} ComponentType */ 62675 62676 /** 62677 * HeadingLevelIcon props. 62678 * 62679 * @typedef WPHeadingLevelIconProps 62680 * 62681 * @property {number} level The heading level to show an icon for. 62682 */ 62683 62684 const LEVEL_TO_PATH = { 62685 0: library_paragraph, 62686 1: heading_level_1, 62687 2: heading_level_2, 62688 3: heading_level_3, 62689 4: heading_level_4, 62690 5: heading_level_5, 62691 6: heading_level_6 62692 }; 62693 62694 /** 62695 * Heading level icon. 62696 * 62697 * @param {WPHeadingLevelIconProps} props Component props. 62698 * 62699 * @return {?ComponentType} The icon. 62700 */ 62701 function HeadingLevelIcon({ 62702 level 62703 }) { 62704 if (LEVEL_TO_PATH[level]) { 62705 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Icon, { 62706 icon: LEVEL_TO_PATH[level] 62707 }); 62708 } 62709 return null; 62710 } 62711 62712 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-heading-level-dropdown/index.js 62713 /** 62714 * WordPress dependencies 62715 */ 62716 62717 62718 62719 /** 62720 * Internal dependencies 62721 */ 62722 62723 62724 const HEADING_LEVELS = [1, 2, 3, 4, 5, 6]; 62725 const block_heading_level_dropdown_POPOVER_PROPS = { 62726 className: 'block-library-heading-level-dropdown' 62727 }; 62728 62729 /** @typedef {import('react').ComponentType} ComponentType */ 62730 62731 /** 62732 * HeadingLevelDropdown props. 62733 * 62734 * @typedef WPHeadingLevelDropdownProps 62735 * 62736 * @property {number} value The chosen heading level. 62737 * @property {number[]} options An array of supported heading levels. 62738 * @property {()=>number} onChange Function called with 62739 * the selected value changes. 62740 */ 62741 62742 /** 62743 * Dropdown for selecting a heading level (1 through 6) or paragraph (0). 62744 * 62745 * @param {WPHeadingLevelDropdownProps} props Component props. 62746 * 62747 * @return {ComponentType} The toolbar. 62748 */ 62749 function HeadingLevelDropdown({ 62750 options = HEADING_LEVELS, 62751 value, 62752 onChange 62753 }) { 62754 const validOptions = options.filter(option => option === 0 || HEADING_LEVELS.includes(option)).sort((a, b) => a - b); // Sorts numerically in ascending order; 62755 62756 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarDropdownMenu, { 62757 popoverProps: block_heading_level_dropdown_POPOVER_PROPS, 62758 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HeadingLevelIcon, { 62759 level: value 62760 }), 62761 label: (0,external_wp_i18n_namespaceObject.__)('Change level'), 62762 controls: validOptions.map(targetLevel => { 62763 const isActive = targetLevel === value; 62764 return { 62765 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HeadingLevelIcon, { 62766 level: targetLevel 62767 }), 62768 title: targetLevel === 0 ? (0,external_wp_i18n_namespaceObject.__)('Paragraph') : (0,external_wp_i18n_namespaceObject.sprintf)( 62769 // translators: %d: heading level e.g: "1", "2", "3" 62770 (0,external_wp_i18n_namespaceObject.__)('Heading %d'), targetLevel), 62771 isActive, 62772 onClick() { 62773 onChange(targetLevel); 62774 }, 62775 role: 'menuitemradio' 62776 }; 62777 }) 62778 }); 62779 } 62780 62781 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/layout.js 62782 /** 62783 * WordPress dependencies 62784 */ 62785 62786 62787 const layout_layout = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 62788 xmlns: "http://www.w3.org/2000/svg", 62789 viewBox: "0 0 24 24", 62790 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 62791 d: "M18 5.5H6a.5.5 0 00-.5.5v3h13V6a.5.5 0 00-.5-.5zm.5 5H10v8h8a.5.5 0 00.5-.5v-7.5zm-10 0h-3V18a.5.5 0 00.5.5h2.5v-8zM6 4h12a2 2 0 012 2v12a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2z" 62792 }) 62793 }); 62794 /* harmony default export */ const library_layout = (layout_layout); 62795 62796 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-variation-picker/index.js 62797 /** 62798 * External dependencies 62799 */ 62800 62801 62802 /** 62803 * WordPress dependencies 62804 */ 62805 62806 62807 62808 62809 62810 function BlockVariationPicker({ 62811 icon = library_layout, 62812 label = (0,external_wp_i18n_namespaceObject.__)('Choose variation'), 62813 instructions = (0,external_wp_i18n_namespaceObject.__)('Select a variation to start with:'), 62814 variations, 62815 onSelect, 62816 allowSkip 62817 }) { 62818 const classes = dist_clsx('block-editor-block-variation-picker', { 62819 'has-many-variations': variations.length > 4 62820 }); 62821 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Placeholder, { 62822 icon: icon, 62823 label: label, 62824 instructions: instructions, 62825 className: classes, 62826 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("ul", { 62827 className: "block-editor-block-variation-picker__variations", 62828 role: "list", 62829 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Block variations'), 62830 children: variations.map(variation => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", { 62831 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 62832 __next40pxDefaultSize: true, 62833 variant: "tertiary", 62834 icon: variation.icon && variation.icon.src ? variation.icon.src : variation.icon, 62835 iconSize: 48, 62836 onClick: () => onSelect(variation), 62837 className: "block-editor-block-variation-picker__variation", 62838 label: variation.description || variation.title 62839 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 62840 className: "block-editor-block-variation-picker__variation-label", 62841 children: variation.title 62842 })] 62843 }, variation.name)) 62844 }), allowSkip && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 62845 className: "block-editor-block-variation-picker__skip", 62846 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 62847 __next40pxDefaultSize: true, 62848 variant: "link", 62849 onClick: () => onSelect(), 62850 children: (0,external_wp_i18n_namespaceObject.__)('Skip') 62851 }) 62852 })] 62853 }); 62854 } 62855 /* harmony default export */ const block_variation_picker = (BlockVariationPicker); 62856 62857 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-pattern-setup/constants.js 62858 const VIEWMODES = { 62859 carousel: 'carousel', 62860 grid: 'grid' 62861 }; 62862 62863 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-pattern-setup/setup-toolbar.js 62864 /** 62865 * WordPress dependencies 62866 */ 62867 62868 62869 62870 62871 /** 62872 * Internal dependencies 62873 */ 62874 62875 62876 62877 const Actions = ({ 62878 onBlockPatternSelect 62879 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 62880 className: "block-editor-block-pattern-setup__actions", 62881 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 62882 // TODO: Switch to `true` (40px size) if possible 62883 , { 62884 __next40pxDefaultSize: false, 62885 variant: "primary", 62886 onClick: onBlockPatternSelect, 62887 children: (0,external_wp_i18n_namespaceObject.__)('Choose') 62888 }) 62889 }); 62890 const CarouselNavigation = ({ 62891 handlePrevious, 62892 handleNext, 62893 activeSlide, 62894 totalSlides 62895 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 62896 className: "block-editor-block-pattern-setup__navigation", 62897 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 62898 // TODO: Switch to `true` (40px size) if possible 62899 , { 62900 __next40pxDefaultSize: false, 62901 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_right : chevron_left, 62902 label: (0,external_wp_i18n_namespaceObject.__)('Previous pattern'), 62903 onClick: handlePrevious, 62904 disabled: activeSlide === 0, 62905 accessibleWhenDisabled: true 62906 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 62907 // TODO: Switch to `true` (40px size) if possible 62908 , { 62909 __next40pxDefaultSize: false, 62910 icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_left : chevron_right, 62911 label: (0,external_wp_i18n_namespaceObject.__)('Next pattern'), 62912 onClick: handleNext, 62913 disabled: activeSlide === totalSlides - 1, 62914 accessibleWhenDisabled: true 62915 })] 62916 }); 62917 const SetupToolbar = ({ 62918 viewMode, 62919 setViewMode, 62920 handlePrevious, 62921 handleNext, 62922 activeSlide, 62923 totalSlides, 62924 onBlockPatternSelect 62925 }) => { 62926 const isCarouselView = viewMode === VIEWMODES.carousel; 62927 const displayControls = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 62928 className: "block-editor-block-pattern-setup__display-controls", 62929 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 62930 // TODO: Switch to `true` (40px size) if possible 62931 , { 62932 __next40pxDefaultSize: false, 62933 icon: stretch_full_width, 62934 label: (0,external_wp_i18n_namespaceObject.__)('Carousel view'), 62935 onClick: () => setViewMode(VIEWMODES.carousel), 62936 isPressed: isCarouselView 62937 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 62938 // TODO: Switch to `true` (40px size) if possible 62939 , { 62940 __next40pxDefaultSize: false, 62941 icon: library_grid, 62942 label: (0,external_wp_i18n_namespaceObject.__)('Grid view'), 62943 onClick: () => setViewMode(VIEWMODES.grid), 62944 isPressed: viewMode === VIEWMODES.grid 62945 })] 62946 }); 62947 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 62948 className: "block-editor-block-pattern-setup__toolbar", 62949 children: [isCarouselView && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CarouselNavigation, { 62950 handlePrevious: handlePrevious, 62951 handleNext: handleNext, 62952 activeSlide: activeSlide, 62953 totalSlides: totalSlides 62954 }), displayControls, isCarouselView && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Actions, { 62955 onBlockPatternSelect: onBlockPatternSelect 62956 })] 62957 }); 62958 }; 62959 /* harmony default export */ const setup_toolbar = (SetupToolbar); 62960 62961 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-pattern-setup/use-patterns-setup.js 62962 /** 62963 * WordPress dependencies 62964 */ 62965 62966 62967 /** 62968 * Internal dependencies 62969 */ 62970 62971 function usePatternsSetup(clientId, blockName, filterPatternsFn) { 62972 return (0,external_wp_data_namespaceObject.useSelect)(select => { 62973 const { 62974 getBlockRootClientId, 62975 getPatternsByBlockTypes, 62976 __experimentalGetAllowedPatterns 62977 } = select(store); 62978 const rootClientId = getBlockRootClientId(clientId); 62979 if (filterPatternsFn) { 62980 return __experimentalGetAllowedPatterns(rootClientId).filter(filterPatternsFn); 62981 } 62982 return getPatternsByBlockTypes(blockName, rootClientId); 62983 }, [clientId, blockName, filterPatternsFn]); 62984 } 62985 /* harmony default export */ const use_patterns_setup = (usePatternsSetup); 62986 62987 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-pattern-setup/index.js 62988 /** 62989 * WordPress dependencies 62990 */ 62991 62992 62993 62994 62995 62996 62997 62998 /** 62999 * Internal dependencies 63000 */ 63001 63002 63003 63004 63005 63006 63007 63008 63009 const SetupContent = ({ 63010 viewMode, 63011 activeSlide, 63012 patterns, 63013 onBlockPatternSelect, 63014 showTitles 63015 }) => { 63016 const containerClass = 'block-editor-block-pattern-setup__container'; 63017 if (viewMode === VIEWMODES.carousel) { 63018 const slideClass = new Map([[activeSlide, 'active-slide'], [activeSlide - 1, 'previous-slide'], [activeSlide + 1, 'next-slide']]); 63019 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63020 className: "block-editor-block-pattern-setup__carousel", 63021 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63022 className: containerClass, 63023 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63024 className: "carousel-container", 63025 children: patterns.map((pattern, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockPatternSlide, { 63026 active: index === activeSlide, 63027 className: slideClass.get(index) || '', 63028 pattern: pattern 63029 }, pattern.name)) 63030 }) 63031 }) 63032 }); 63033 } 63034 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63035 className: "block-editor-block-pattern-setup__grid", 63036 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Composite, { 63037 role: "listbox", 63038 className: containerClass, 63039 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Patterns list'), 63040 children: patterns.map(pattern => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_pattern_setup_BlockPattern, { 63041 pattern: pattern, 63042 onSelect: onBlockPatternSelect, 63043 showTitles: showTitles 63044 }, pattern.name)) 63045 }) 63046 }); 63047 }; 63048 function block_pattern_setup_BlockPattern({ 63049 pattern, 63050 onSelect, 63051 showTitles 63052 }) { 63053 const baseClassName = 'block-editor-block-pattern-setup-list'; 63054 const { 63055 blocks, 63056 description, 63057 viewportWidth = 700 63058 } = pattern; 63059 const descriptionId = (0,external_wp_compose_namespaceObject.useInstanceId)(block_pattern_setup_BlockPattern, `$baseClassName}__item-description`); 63060 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63061 className: `$baseClassName}__list-item`, 63062 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Composite.Item, { 63063 render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63064 "aria-describedby": description ? descriptionId : undefined, 63065 "aria-label": pattern.title, 63066 className: `$baseClassName}__item` 63067 }), 63068 id: `$baseClassName}__pattern__$pattern.name}`, 63069 role: "option", 63070 onClick: () => onSelect(blocks), 63071 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_preview, { 63072 blocks: blocks, 63073 viewportWidth: viewportWidth 63074 }), showTitles && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63075 className: `$baseClassName}__item-title`, 63076 children: pattern.title 63077 }), !!description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 63078 id: descriptionId, 63079 children: description 63080 })] 63081 }) 63082 }); 63083 } 63084 function BlockPatternSlide({ 63085 active, 63086 className, 63087 pattern, 63088 minHeight 63089 }) { 63090 const { 63091 blocks, 63092 title, 63093 description 63094 } = pattern; 63095 const descriptionId = (0,external_wp_compose_namespaceObject.useInstanceId)(BlockPatternSlide, 'block-editor-block-pattern-setup-list__item-description'); 63096 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 63097 "aria-hidden": !active, 63098 role: "img", 63099 className: `pattern-slide $className}`, 63100 "aria-label": title, 63101 "aria-describedby": description ? descriptionId : undefined, 63102 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_preview, { 63103 blocks: blocks, 63104 minHeight: minHeight 63105 }), !!description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 63106 id: descriptionId, 63107 children: description 63108 })] 63109 }); 63110 } 63111 const BlockPatternSetup = ({ 63112 clientId, 63113 blockName, 63114 filterPatternsFn, 63115 onBlockPatternSelect, 63116 initialViewMode = VIEWMODES.carousel, 63117 showTitles = false 63118 }) => { 63119 const [viewMode, setViewMode] = (0,external_wp_element_namespaceObject.useState)(initialViewMode); 63120 const [activeSlide, setActiveSlide] = (0,external_wp_element_namespaceObject.useState)(0); 63121 const { 63122 replaceBlock 63123 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 63124 const patterns = use_patterns_setup(clientId, blockName, filterPatternsFn); 63125 if (!patterns?.length) { 63126 return null; 63127 } 63128 const onBlockPatternSelectDefault = blocks => { 63129 const clonedBlocks = blocks.map(block => (0,external_wp_blocks_namespaceObject.cloneBlock)(block)); 63130 replaceBlock(clientId, clonedBlocks); 63131 }; 63132 const onPatternSelectCallback = onBlockPatternSelect || onBlockPatternSelectDefault; 63133 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 63134 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 63135 className: `block-editor-block-pattern-setup view-mode-$viewMode}`, 63136 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SetupContent, { 63137 viewMode: viewMode, 63138 activeSlide: activeSlide, 63139 patterns: patterns, 63140 onBlockPatternSelect: onPatternSelectCallback, 63141 showTitles: showTitles 63142 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(setup_toolbar, { 63143 viewMode: viewMode, 63144 setViewMode: setViewMode, 63145 activeSlide: activeSlide, 63146 totalSlides: patterns.length, 63147 handleNext: () => { 63148 setActiveSlide(active => Math.min(active + 1, patterns.length - 1)); 63149 }, 63150 handlePrevious: () => { 63151 setActiveSlide(active => Math.max(active - 1, 0)); 63152 }, 63153 onBlockPatternSelect: () => { 63154 onPatternSelectCallback(patterns[activeSlide].blocks); 63155 } 63156 })] 63157 }) 63158 }); 63159 }; 63160 /* harmony default export */ const block_pattern_setup = (BlockPatternSetup); 63161 63162 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-variation-transforms/index.js 63163 /** 63164 * WordPress dependencies 63165 */ 63166 63167 63168 63169 63170 63171 63172 63173 /** 63174 * Internal dependencies 63175 */ 63176 63177 63178 63179 63180 63181 function VariationsButtons({ 63182 className, 63183 onSelectVariation, 63184 selectedValue, 63185 variations 63186 }) { 63187 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 63188 className: className, 63189 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 63190 as: "legend", 63191 children: (0,external_wp_i18n_namespaceObject.__)('Transform to variation') 63192 }), variations.map(variation => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 63193 __next40pxDefaultSize: true, 63194 size: "compact", 63195 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 63196 icon: variation.icon, 63197 showColors: true 63198 }), 63199 isPressed: selectedValue === variation.name, 63200 label: selectedValue === variation.name ? variation.title : (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: Block or block variation name. */ 63201 (0,external_wp_i18n_namespaceObject.__)('Transform to %s'), variation.title), 63202 onClick: () => onSelectVariation(variation.name), 63203 "aria-label": variation.title, 63204 showTooltip: true 63205 }, variation.name))] 63206 }); 63207 } 63208 function VariationsDropdown({ 63209 className, 63210 onSelectVariation, 63211 selectedValue, 63212 variations 63213 }) { 63214 const selectOptions = variations.map(({ 63215 name, 63216 title, 63217 description 63218 }) => ({ 63219 value: name, 63220 label: title, 63221 info: description 63222 })); 63223 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropdownMenu, { 63224 className: className, 63225 label: (0,external_wp_i18n_namespaceObject.__)('Transform to variation'), 63226 text: (0,external_wp_i18n_namespaceObject.__)('Transform to variation'), 63227 popoverProps: { 63228 position: 'bottom center', 63229 className: `$className}__popover` 63230 }, 63231 icon: chevron_down, 63232 toggleProps: { 63233 iconPosition: 'right' 63234 }, 63235 children: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63236 className: `$className}__container`, 63237 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 63238 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItemsChoice, { 63239 choices: selectOptions, 63240 value: selectedValue, 63241 onSelect: onSelectVariation 63242 }) 63243 }) 63244 }) 63245 }); 63246 } 63247 function VariationsToggleGroupControl({ 63248 className, 63249 onSelectVariation, 63250 selectedValue, 63251 variations 63252 }) { 63253 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63254 className: className, 63255 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 63256 label: (0,external_wp_i18n_namespaceObject.__)('Transform to variation'), 63257 value: selectedValue, 63258 hideLabelFromVision: true, 63259 onChange: onSelectVariation, 63260 __next40pxDefaultSize: true, 63261 __nextHasNoMarginBottom: true, 63262 children: variations.map(variation => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOptionIcon, { 63263 icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 63264 icon: variation.icon, 63265 showColors: true 63266 }), 63267 value: variation.name, 63268 label: selectedValue === variation.name ? variation.title : (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: Block or block variation name. */ 63269 (0,external_wp_i18n_namespaceObject.__)('Transform to %s'), variation.title) 63270 }, variation.name)) 63271 }) 63272 }); 63273 } 63274 function __experimentalBlockVariationTransforms({ 63275 blockClientId 63276 }) { 63277 const { 63278 updateBlockAttributes 63279 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 63280 const { 63281 activeBlockVariation, 63282 variations, 63283 isContentOnly 63284 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 63285 const { 63286 getActiveBlockVariation, 63287 getBlockVariations 63288 } = select(external_wp_blocks_namespaceObject.store); 63289 const { 63290 getBlockName, 63291 getBlockAttributes, 63292 getBlockEditingMode 63293 } = select(store); 63294 const name = blockClientId && getBlockName(blockClientId); 63295 const { 63296 hasContentRoleAttribute 63297 } = unlock(select(external_wp_blocks_namespaceObject.store)); 63298 const isContentBlock = hasContentRoleAttribute(name); 63299 return { 63300 activeBlockVariation: getActiveBlockVariation(name, getBlockAttributes(blockClientId)), 63301 variations: name && getBlockVariations(name, 'transform'), 63302 isContentOnly: getBlockEditingMode(blockClientId) === 'contentOnly' && !isContentBlock 63303 }; 63304 }, [blockClientId]); 63305 const selectedValue = activeBlockVariation?.name; 63306 63307 // Check if each variation has a unique icon. 63308 const hasUniqueIcons = (0,external_wp_element_namespaceObject.useMemo)(() => { 63309 const variationIcons = new Set(); 63310 if (!variations) { 63311 return false; 63312 } 63313 variations.forEach(variation => { 63314 if (variation.icon) { 63315 variationIcons.add(variation.icon?.src || variation.icon); 63316 } 63317 }); 63318 return variationIcons.size === variations.length; 63319 }, [variations]); 63320 const onSelectVariation = variationName => { 63321 updateBlockAttributes(blockClientId, { 63322 ...variations.find(({ 63323 name 63324 }) => name === variationName).attributes 63325 }); 63326 }; 63327 if (!variations?.length || isContentOnly) { 63328 return null; 63329 } 63330 const baseClass = 'block-editor-block-variation-transforms'; 63331 63332 // Show buttons if there are more than 5 variations because the ToggleGroupControl does not wrap 63333 const showButtons = variations.length > 5; 63334 const ButtonComponent = showButtons ? VariationsButtons : VariationsToggleGroupControl; 63335 const Component = hasUniqueIcons ? ButtonComponent : VariationsDropdown; 63336 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, { 63337 className: baseClass, 63338 onSelectVariation: onSelectVariation, 63339 selectedValue: selectedValue, 63340 variations: variations 63341 }); 63342 } 63343 /* harmony default export */ const block_variation_transforms = (__experimentalBlockVariationTransforms); 63344 63345 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/color-palette/with-color-context.js 63346 /** 63347 * WordPress dependencies 63348 */ 63349 63350 63351 /** 63352 * Internal dependencies 63353 */ 63354 63355 63356 /* harmony default export */ const with_color_context = ((0,external_wp_compose_namespaceObject.createHigherOrderComponent)(WrappedComponent => { 63357 return props => { 63358 const [colorsFeature, enableCustomColors] = use_settings_useSettings('color.palette', 'color.custom'); 63359 const { 63360 colors = colorsFeature, 63361 disableCustomColors = !enableCustomColors 63362 } = props; 63363 const hasColorsToChoose = colors && colors.length > 0 || !disableCustomColors; 63364 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, { 63365 ...props, 63366 colors, 63367 disableCustomColors, 63368 hasColorsToChoose 63369 }); 63370 }; 63371 }, 'withColorContext')); 63372 63373 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/color-palette/index.js 63374 /** 63375 * WordPress dependencies 63376 */ 63377 63378 63379 /** 63380 * Internal dependencies 63381 */ 63382 63383 /* harmony default export */ const color_palette = (with_color_context(external_wp_components_namespaceObject.ColorPalette)); 63384 63385 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/color-palette/control.js 63386 /** 63387 * Internal dependencies 63388 */ 63389 63390 63391 function ColorPaletteControl({ 63392 onChange, 63393 value, 63394 ...otherProps 63395 }) { 63396 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(control, { 63397 ...otherProps, 63398 onColorChange: onChange, 63399 colorValue: value, 63400 gradients: [], 63401 disableCustomGradients: true 63402 }); 63403 } 63404 63405 ;// CONCATENATED MODULE: external ["wp","date"] 63406 const external_wp_date_namespaceObject = window["wp"]["date"]; 63407 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/date-format-picker/index.js 63408 /** 63409 * WordPress dependencies 63410 */ 63411 63412 63413 63414 63415 63416 // So that we illustrate the different formats in the dropdown properly, show a date that is 63417 // somwhat recent, has a day greater than 12, and a month with more than three letters. 63418 63419 63420 const exampleDate = new Date(); 63421 exampleDate.setDate(20); 63422 exampleDate.setMonth(exampleDate.getMonth() - 3); 63423 if (exampleDate.getMonth() === 4) { 63424 // May has three letters, so use March. 63425 exampleDate.setMonth(3); 63426 } 63427 63428 /** 63429 * The `DateFormatPicker` component renders controls that let the user choose a 63430 * _date format_. That is, how they want their dates to be formatted. 63431 * 63432 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/date-format-picker/README.md 63433 * 63434 * @param {Object} props 63435 * @param {string|null} props.format The selected date 63436 * format. If 63437 * `null`, 63438 * _Default_ is 63439 * selected. 63440 * @param {string} props.defaultFormat The date format that 63441 * will be used if the 63442 * user selects 63443 * 'Default'. 63444 * @param {( format: string|null ) => void} props.onChange Called when a 63445 * selection is 63446 * made. If `null`, 63447 * _Default_ is 63448 * selected. 63449 */ 63450 function DateFormatPicker({ 63451 format, 63452 defaultFormat, 63453 onChange 63454 }) { 63455 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 63456 className: "block-editor-date-format-picker", 63457 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 63458 as: "legend", 63459 children: (0,external_wp_i18n_namespaceObject.__)('Date format') 63460 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 63461 __nextHasNoMarginBottom: true, 63462 label: (0,external_wp_i18n_namespaceObject.__)('Default format'), 63463 help: `${(0,external_wp_i18n_namespaceObject.__)('Example:')} ${(0,external_wp_date_namespaceObject.dateI18n)(defaultFormat, exampleDate)}`, 63464 checked: !format, 63465 onChange: checked => onChange(checked ? null : defaultFormat) 63466 }), format && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NonDefaultControls, { 63467 format: format, 63468 onChange: onChange 63469 })] 63470 }); 63471 } 63472 function NonDefaultControls({ 63473 format, 63474 onChange 63475 }) { 63476 var _suggestedOptions$fin; 63477 // Suggest a short format, medium format, long format, and a standardised 63478 // (YYYY-MM-DD) format. The short, medium, and long formats are localised as 63479 // different languages have different ways of writing these. For example, 'F 63480 // j, Y' (April 20, 2022) in American English (en_US) is 'j. F Y' (20. April 63481 // 2022) in German (de). The resultant array is de-duplicated as some 63482 // languages will use the same format string for short, medium, and long 63483 // formats. 63484 const suggestedFormats = [...new Set([/* translators: See https://www.php.net/manual/datetime.format.php */ 63485 'Y-m-d', /* translators: See https://www.php.net/manual/datetime.format.php */ 63486 (0,external_wp_i18n_namespaceObject._x)('n/j/Y', 'short date format'), /* translators: See https://www.php.net/manual/datetime.format.php */ 63487 (0,external_wp_i18n_namespaceObject._x)('n/j/Y g:i A', 'short date format with time'), /* translators: See https://www.php.net/manual/datetime.format.php */ 63488 (0,external_wp_i18n_namespaceObject._x)('M j, Y', 'medium date format'), /* translators: See https://www.php.net/manual/datetime.format.php */ 63489 (0,external_wp_i18n_namespaceObject._x)('M j, Y g:i A', 'medium date format with time'), /* translators: See https://www.php.net/manual/datetime.format.php */ 63490 (0,external_wp_i18n_namespaceObject._x)('F j, Y', 'long date format'), /* translators: See https://www.php.net/manual/datetime.format.php */ 63491 (0,external_wp_i18n_namespaceObject._x)('M j', 'short date format without the year')])]; 63492 const suggestedOptions = [...suggestedFormats.map((suggestedFormat, index) => ({ 63493 key: `suggested-$index}`, 63494 name: (0,external_wp_date_namespaceObject.dateI18n)(suggestedFormat, exampleDate), 63495 format: suggestedFormat 63496 })), { 63497 key: 'human-diff', 63498 name: (0,external_wp_date_namespaceObject.humanTimeDiff)(exampleDate), 63499 format: 'human-diff' 63500 }]; 63501 const customOption = { 63502 key: 'custom', 63503 name: (0,external_wp_i18n_namespaceObject.__)('Custom'), 63504 className: 'block-editor-date-format-picker__custom-format-select-control__custom-option', 63505 hint: (0,external_wp_i18n_namespaceObject.__)('Enter your own date format') 63506 }; 63507 const [isCustom, setIsCustom] = (0,external_wp_element_namespaceObject.useState)(() => !!format && !suggestedOptions.some(option => option.format === format)); 63508 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 63509 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CustomSelectControl, { 63510 __next40pxDefaultSize: true, 63511 label: (0,external_wp_i18n_namespaceObject.__)('Choose a format'), 63512 options: [...suggestedOptions, customOption], 63513 value: isCustom ? customOption : (_suggestedOptions$fin = suggestedOptions.find(option => option.format === format)) !== null && _suggestedOptions$fin !== void 0 ? _suggestedOptions$fin : customOption, 63514 onChange: ({ 63515 selectedItem 63516 }) => { 63517 if (selectedItem === customOption) { 63518 setIsCustom(true); 63519 } else { 63520 setIsCustom(false); 63521 onChange(selectedItem.format); 63522 } 63523 } 63524 }), isCustom && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextControl, { 63525 __next40pxDefaultSize: true, 63526 __nextHasNoMarginBottom: true, 63527 label: (0,external_wp_i18n_namespaceObject.__)('Custom format'), 63528 hideLabelFromVision: true, 63529 help: (0,external_wp_element_namespaceObject.createInterpolateElement)((0,external_wp_i18n_namespaceObject.__)('Enter a date or time <Link>format string</Link>.'), { 63530 Link: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ExternalLink, { 63531 href: (0,external_wp_i18n_namespaceObject.__)('https://wordpress.org/documentation/article/customize-date-and-time-format/') 63532 }) 63533 }), 63534 value: format, 63535 onChange: value => onChange(value) 63536 })] 63537 }); 63538 } 63539 63540 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/colors-gradients/dropdown.js 63541 /** 63542 * External dependencies 63543 */ 63544 63545 63546 /** 63547 * WordPress dependencies 63548 */ 63549 63550 63551 /** 63552 * Internal dependencies 63553 */ 63554 63555 63556 // When the `ColorGradientSettingsDropdown` controls are being rendered to a 63557 // `ToolsPanel` they must be wrapped in a `ToolsPanelItem`. 63558 63559 63560 63561 const WithToolsPanelItem = ({ 63562 setting, 63563 children, 63564 panelId, 63565 ...props 63566 }) => { 63567 const clearValue = () => { 63568 if (setting.colorValue) { 63569 setting.onColorChange(); 63570 } else if (setting.gradientValue) { 63571 setting.onGradientChange(); 63572 } 63573 }; 63574 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 63575 hasValue: () => { 63576 return !!setting.colorValue || !!setting.gradientValue; 63577 }, 63578 label: setting.label, 63579 onDeselect: clearValue, 63580 isShownByDefault: setting.isShownByDefault !== undefined ? setting.isShownByDefault : true, 63581 ...props, 63582 className: "block-editor-tools-panel-color-gradient-settings__item", 63583 panelId: panelId 63584 // Pass resetAllFilter if supplied due to rendering via SlotFill 63585 // into parent ToolsPanel. 63586 , 63587 resetAllFilter: setting.resetAllFilter, 63588 children: children 63589 }); 63590 }; 63591 const dropdown_LabeledColorIndicator = ({ 63592 colorValue, 63593 label 63594 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 63595 justify: "flex-start", 63596 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ColorIndicator, { 63597 className: "block-editor-panel-color-gradient-settings__color-indicator", 63598 colorValue: colorValue 63599 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 63600 className: "block-editor-panel-color-gradient-settings__color-name", 63601 title: label, 63602 children: label 63603 })] 63604 }); 63605 63606 // Renders a color dropdown's toggle as an `Item` if it is within an `ItemGroup` 63607 // or as a `Button` if it isn't e.g. the controls are being rendered in 63608 // a `ToolsPanel`. 63609 const renderToggle = settings => ({ 63610 onToggle, 63611 isOpen 63612 }) => { 63613 const { 63614 colorValue, 63615 label 63616 } = settings; 63617 const toggleProps = { 63618 onClick: onToggle, 63619 className: dist_clsx('block-editor-panel-color-gradient-settings__dropdown', { 63620 'is-open': isOpen 63621 }), 63622 'aria-expanded': isOpen 63623 }; 63624 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 63625 __next40pxDefaultSize: true, 63626 ...toggleProps, 63627 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_LabeledColorIndicator, { 63628 colorValue: colorValue, 63629 label: label 63630 }) 63631 }); 63632 }; 63633 63634 // Renders a collection of color controls as dropdowns. Depending upon the 63635 // context in which these dropdowns are being rendered, they may be wrapped 63636 // in an `ItemGroup` with each dropdown's toggle as an `Item`, or alternatively, 63637 // the may be individually wrapped in a `ToolsPanelItem` with the toggle as 63638 // a regular `Button`. 63639 // 63640 // For more context see: https://github.com/WordPress/gutenberg/pull/40084 63641 function ColorGradientSettingsDropdown({ 63642 colors, 63643 disableCustomColors, 63644 disableCustomGradients, 63645 enableAlpha, 63646 gradients, 63647 settings, 63648 __experimentalIsRenderedInSidebar, 63649 ...props 63650 }) { 63651 let popoverProps; 63652 if (__experimentalIsRenderedInSidebar) { 63653 popoverProps = { 63654 placement: 'left-start', 63655 offset: 36, 63656 shift: true 63657 }; 63658 } 63659 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 63660 children: settings.map((setting, index) => { 63661 var _setting$gradientValu; 63662 const controlProps = { 63663 clearable: false, 63664 colorValue: setting.colorValue, 63665 colors, 63666 disableCustomColors, 63667 disableCustomGradients, 63668 enableAlpha, 63669 gradientValue: setting.gradientValue, 63670 gradients, 63671 label: setting.label, 63672 onColorChange: setting.onColorChange, 63673 onGradientChange: setting.onGradientChange, 63674 showTitle: false, 63675 __experimentalIsRenderedInSidebar, 63676 ...setting 63677 }; 63678 const toggleSettings = { 63679 colorValue: (_setting$gradientValu = setting.gradientValue) !== null && _setting$gradientValu !== void 0 ? _setting$gradientValu : setting.colorValue, 63680 label: setting.label 63681 }; 63682 return setting && 63683 /*#__PURE__*/ 63684 // If not in an `ItemGroup` wrap the dropdown in a 63685 // `ToolsPanelItem` 63686 (0,external_ReactJSXRuntime_namespaceObject.jsx)(WithToolsPanelItem, { 63687 setting: setting, 63688 ...props, 63689 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 63690 popoverProps: popoverProps, 63691 className: "block-editor-tools-panel-color-gradient-settings__dropdown", 63692 renderToggle: renderToggle(toggleSettings), 63693 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalDropdownContentWrapper, { 63694 paddingSize: "none", 63695 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 63696 className: "block-editor-panel-color-gradient-settings__dropdown-content", 63697 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(control, { 63698 ...controlProps 63699 }) 63700 }) 63701 }) 63702 }) 63703 }, index); 63704 }) 63705 }); 63706 } 63707 63708 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/colors-gradients/panel-color-gradient-settings.js 63709 /** 63710 * External dependencies 63711 */ 63712 63713 63714 /** 63715 * WordPress dependencies 63716 */ 63717 63718 63719 63720 63721 /** 63722 * Internal dependencies 63723 */ 63724 63725 63726 63727 63728 63729 const panel_color_gradient_settings_colorsAndGradientKeys = ['colors', 'disableCustomColors', 'gradients', 'disableCustomGradients']; 63730 const PanelColorGradientSettingsInner = ({ 63731 className, 63732 colors, 63733 gradients, 63734 disableCustomColors, 63735 disableCustomGradients, 63736 children, 63737 settings, 63738 title, 63739 showTitle = true, 63740 __experimentalIsRenderedInSidebar, 63741 enableAlpha 63742 }) => { 63743 const panelId = (0,external_wp_compose_namespaceObject.useInstanceId)(PanelColorGradientSettingsInner); 63744 const { 63745 batch 63746 } = (0,external_wp_data_namespaceObject.useRegistry)(); 63747 if ((!colors || colors.length === 0) && (!gradients || gradients.length === 0) && disableCustomColors && disableCustomGradients && settings?.every(setting => (!setting.colors || setting.colors.length === 0) && (!setting.gradients || setting.gradients.length === 0) && (setting.disableCustomColors === undefined || setting.disableCustomColors) && (setting.disableCustomGradients === undefined || setting.disableCustomGradients))) { 63748 return null; 63749 } 63750 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 63751 className: dist_clsx('block-editor-panel-color-gradient-settings', className), 63752 label: showTitle ? title : undefined, 63753 resetAll: () => { 63754 batch(() => { 63755 settings.forEach(({ 63756 colorValue, 63757 gradientValue, 63758 onColorChange, 63759 onGradientChange 63760 }) => { 63761 if (colorValue) { 63762 onColorChange(); 63763 } else if (gradientValue) { 63764 onGradientChange(); 63765 } 63766 }); 63767 }); 63768 }, 63769 panelId: panelId, 63770 __experimentalFirstVisibleItemClass: "first", 63771 __experimentalLastVisibleItemClass: "last", 63772 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorGradientSettingsDropdown, { 63773 settings: settings, 63774 panelId: panelId, 63775 colors, 63776 gradients, 63777 disableCustomColors, 63778 disableCustomGradients, 63779 __experimentalIsRenderedInSidebar, 63780 enableAlpha 63781 }), !!children && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 63782 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalSpacer, { 63783 marginY: 4 63784 }), " ", children] 63785 })] 63786 }); 63787 }; 63788 const PanelColorGradientSettingsSelect = props => { 63789 const colorGradientSettings = useMultipleOriginColorsAndGradients(); 63790 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PanelColorGradientSettingsInner, { 63791 ...colorGradientSettings, 63792 ...props 63793 }); 63794 }; 63795 const PanelColorGradientSettings = props => { 63796 if (panel_color_gradient_settings_colorsAndGradientKeys.every(key => props.hasOwnProperty(key))) { 63797 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PanelColorGradientSettingsInner, { 63798 ...props 63799 }); 63800 } 63801 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PanelColorGradientSettingsSelect, { 63802 ...props 63803 }); 63804 }; 63805 /* harmony default export */ const panel_color_gradient_settings = (PanelColorGradientSettings); 63806 63807 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/aspect-ratio.js 63808 /** 63809 * WordPress dependencies 63810 */ 63811 63812 63813 const aspectRatio = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 63814 xmlns: "http://www.w3.org/2000/svg", 63815 viewBox: "0 0 24 24", 63816 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 63817 d: "M18.5 5.5h-13c-1.1 0-2 .9-2 2v9c0 1.1.9 2 2 2h13c1.1 0 2-.9 2-2v-9c0-1.1-.9-2-2-2zm.5 11c0 .3-.2.5-.5.5h-13c-.3 0-.5-.2-.5-.5v-9c0-.3.2-.5.5-.5h13c.3 0 .5.2.5.5v9zM6.5 12H8v-2h2V8.5H6.5V12zm9.5 2h-2v1.5h3.5V12H16v2z" 63818 }) 63819 }); 63820 /* harmony default export */ const aspect_ratio = (aspectRatio); 63821 63822 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/constants.js 63823 const MIN_ZOOM = 100; 63824 const MAX_ZOOM = 300; 63825 const constants_POPOVER_PROPS = { 63826 placement: 'bottom-start' 63827 }; 63828 63829 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/use-save-image.js 63830 /** 63831 * WordPress dependencies 63832 */ 63833 // Disable Reason: Needs to be refactored. 63834 // eslint-disable-next-line no-restricted-imports 63835 63836 63837 63838 63839 63840 63841 function useSaveImage({ 63842 crop, 63843 rotation, 63844 url, 63845 id, 63846 onSaveImage, 63847 onFinishEditing 63848 }) { 63849 const { 63850 createErrorNotice 63851 } = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_notices_namespaceObject.store); 63852 const [isInProgress, setIsInProgress] = (0,external_wp_element_namespaceObject.useState)(false); 63853 const cancel = (0,external_wp_element_namespaceObject.useCallback)(() => { 63854 setIsInProgress(false); 63855 onFinishEditing(); 63856 }, [onFinishEditing]); 63857 const apply = (0,external_wp_element_namespaceObject.useCallback)(() => { 63858 setIsInProgress(true); 63859 const modifiers = []; 63860 if (rotation > 0) { 63861 modifiers.push({ 63862 type: 'rotate', 63863 args: { 63864 angle: rotation 63865 } 63866 }); 63867 } 63868 63869 // The crop script may return some very small, sub-pixel values when the image was not cropped. 63870 // Crop only when the new size has changed by more than 0.1%. 63871 if (crop.width < 99.9 || crop.height < 99.9) { 63872 modifiers.push({ 63873 type: 'crop', 63874 args: { 63875 left: crop.x, 63876 top: crop.y, 63877 width: crop.width, 63878 height: crop.height 63879 } 63880 }); 63881 } 63882 if (modifiers.length === 0) { 63883 // No changes to apply. 63884 setIsInProgress(false); 63885 onFinishEditing(); 63886 return; 63887 } 63888 external_wp_apiFetch_default()({ 63889 path: `/wp/v2/media/$id}/edit`, 63890 method: 'POST', 63891 data: { 63892 src: url, 63893 modifiers 63894 } 63895 }).then(response => { 63896 onSaveImage({ 63897 id: response.id, 63898 url: response.source_url 63899 }); 63900 }).catch(error => { 63901 createErrorNotice((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: 1. Error message */ 63902 (0,external_wp_i18n_namespaceObject.__)('Could not edit image. %s'), (0,external_wp_dom_namespaceObject.__unstableStripHTML)(error.message)), { 63903 id: 'image-editing-error', 63904 type: 'snackbar' 63905 }); 63906 }).finally(() => { 63907 setIsInProgress(false); 63908 onFinishEditing(); 63909 }); 63910 }, [crop, rotation, id, url, onSaveImage, createErrorNotice, onFinishEditing]); 63911 return (0,external_wp_element_namespaceObject.useMemo)(() => ({ 63912 isInProgress, 63913 apply, 63914 cancel 63915 }), [isInProgress, apply, cancel]); 63916 } 63917 63918 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/use-transform-image.js 63919 /* wp:polyfill */ 63920 /** 63921 * WordPress dependencies 63922 */ 63923 63924 63925 function useTransformImage({ 63926 url, 63927 naturalWidth, 63928 naturalHeight 63929 }) { 63930 const [editedUrl, setEditedUrl] = (0,external_wp_element_namespaceObject.useState)(); 63931 const [crop, setCrop] = (0,external_wp_element_namespaceObject.useState)(); 63932 const [position, setPosition] = (0,external_wp_element_namespaceObject.useState)({ 63933 x: 0, 63934 y: 0 63935 }); 63936 const [zoom, setZoom] = (0,external_wp_element_namespaceObject.useState)(100); 63937 const [rotation, setRotation] = (0,external_wp_element_namespaceObject.useState)(0); 63938 const defaultAspect = naturalWidth / naturalHeight; 63939 const [aspect, setAspect] = (0,external_wp_element_namespaceObject.useState)(defaultAspect); 63940 const rotateClockwise = (0,external_wp_element_namespaceObject.useCallback)(() => { 63941 const angle = (rotation + 90) % 360; 63942 let naturalAspectRatio = defaultAspect; 63943 if (rotation % 180 === 90) { 63944 naturalAspectRatio = 1 / defaultAspect; 63945 } 63946 if (angle === 0) { 63947 setEditedUrl(); 63948 setRotation(angle); 63949 setAspect(defaultAspect); 63950 setPosition(prevPosition => ({ 63951 x: -(prevPosition.y * naturalAspectRatio), 63952 y: prevPosition.x * naturalAspectRatio 63953 })); 63954 return; 63955 } 63956 function editImage(event) { 63957 const canvas = document.createElement('canvas'); 63958 let translateX = 0; 63959 let translateY = 0; 63960 if (angle % 180) { 63961 canvas.width = event.target.height; 63962 canvas.height = event.target.width; 63963 } else { 63964 canvas.width = event.target.width; 63965 canvas.height = event.target.height; 63966 } 63967 if (angle === 90 || angle === 180) { 63968 translateX = canvas.width; 63969 } 63970 if (angle === 270 || angle === 180) { 63971 translateY = canvas.height; 63972 } 63973 const context = canvas.getContext('2d'); 63974 context.translate(translateX, translateY); 63975 context.rotate(angle * Math.PI / 180); 63976 context.drawImage(event.target, 0, 0); 63977 canvas.toBlob(blob => { 63978 setEditedUrl(URL.createObjectURL(blob)); 63979 setRotation(angle); 63980 setAspect(canvas.width / canvas.height); 63981 setPosition(prevPosition => ({ 63982 x: -(prevPosition.y * naturalAspectRatio), 63983 y: prevPosition.x * naturalAspectRatio 63984 })); 63985 }); 63986 } 63987 const el = new window.Image(); 63988 el.src = url; 63989 el.onload = editImage; 63990 const imgCrossOrigin = (0,external_wp_hooks_namespaceObject.applyFilters)('media.crossOrigin', undefined, url); 63991 if (typeof imgCrossOrigin === 'string') { 63992 el.crossOrigin = imgCrossOrigin; 63993 } 63994 }, [rotation, defaultAspect, url]); 63995 return (0,external_wp_element_namespaceObject.useMemo)(() => ({ 63996 editedUrl, 63997 setEditedUrl, 63998 crop, 63999 setCrop, 64000 position, 64001 setPosition, 64002 zoom, 64003 setZoom, 64004 rotation, 64005 setRotation, 64006 rotateClockwise, 64007 aspect, 64008 setAspect, 64009 defaultAspect 64010 }), [editedUrl, crop, position, zoom, rotation, rotateClockwise, aspect, defaultAspect]); 64011 } 64012 64013 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/context.js 64014 /** 64015 * WordPress dependencies 64016 */ 64017 64018 64019 /** 64020 * Internal dependencies 64021 */ 64022 64023 64024 64025 const ImageEditingContext = (0,external_wp_element_namespaceObject.createContext)({}); 64026 const useImageEditingContext = () => (0,external_wp_element_namespaceObject.useContext)(ImageEditingContext); 64027 function ImageEditingProvider({ 64028 id, 64029 url, 64030 naturalWidth, 64031 naturalHeight, 64032 onFinishEditing, 64033 onSaveImage, 64034 children 64035 }) { 64036 const transformImage = useTransformImage({ 64037 url, 64038 naturalWidth, 64039 naturalHeight 64040 }); 64041 const saveImage = useSaveImage({ 64042 id, 64043 url, 64044 onSaveImage, 64045 onFinishEditing, 64046 ...transformImage 64047 }); 64048 const providerValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ 64049 ...transformImage, 64050 ...saveImage 64051 }), [transformImage, saveImage]); 64052 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ImageEditingContext.Provider, { 64053 value: providerValue, 64054 children: children 64055 }); 64056 } 64057 64058 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/aspect-ratio-dropdown.js 64059 /** 64060 * WordPress dependencies 64061 */ 64062 64063 64064 64065 64066 /** 64067 * Internal dependencies 64068 */ 64069 64070 64071 64072 64073 64074 64075 function AspectRatioGroup({ 64076 aspectRatios, 64077 isDisabled, 64078 label, 64079 onClick, 64080 value 64081 }) { 64082 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, { 64083 label: label, 64084 children: aspectRatios.map(({ 64085 name, 64086 slug, 64087 ratio 64088 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 64089 disabled: isDisabled, 64090 onClick: () => { 64091 onClick(ratio); 64092 }, 64093 role: "menuitemradio", 64094 isSelected: ratio === value, 64095 icon: ratio === value ? library_check : undefined, 64096 children: name 64097 }, slug)) 64098 }); 64099 } 64100 function ratioToNumber(str) { 64101 // TODO: support two-value aspect ratio? 64102 // https://css-tricks.com/almanac/properties/a/aspect-ratio/#aa-it-can-take-two-values 64103 const [a, b, ...rest] = str.split('/').map(Number); 64104 if (a <= 0 || b <= 0 || Number.isNaN(a) || Number.isNaN(b) || rest.length) { 64105 return NaN; 64106 } 64107 return b ? a / b : a; 64108 } 64109 function presetRatioAsNumber({ 64110 ratio, 64111 ...rest 64112 }) { 64113 return { 64114 ratio: ratioToNumber(ratio), 64115 ...rest 64116 }; 64117 } 64118 function AspectRatioDropdown({ 64119 toggleProps 64120 }) { 64121 const { 64122 isInProgress, 64123 aspect, 64124 setAspect, 64125 defaultAspect 64126 } = useImageEditingContext(); 64127 const [defaultRatios, themeRatios, showDefaultRatios] = use_settings_useSettings('dimensions.aspectRatios.default', 'dimensions.aspectRatios.theme', 'dimensions.defaultAspectRatios'); 64128 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropdownMenu, { 64129 icon: aspect_ratio, 64130 label: (0,external_wp_i18n_namespaceObject.__)('Aspect Ratio'), 64131 popoverProps: constants_POPOVER_PROPS, 64132 toggleProps: toggleProps, 64133 children: ({ 64134 onClose 64135 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 64136 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AspectRatioGroup, { 64137 isDisabled: isInProgress, 64138 onClick: newAspect => { 64139 setAspect(newAspect); 64140 onClose(); 64141 }, 64142 value: aspect, 64143 aspectRatios: [ 64144 // All ratios should be mirrored in AspectRatioTool in @wordpress/block-editor. 64145 { 64146 slug: 'original', 64147 name: (0,external_wp_i18n_namespaceObject.__)('Original'), 64148 aspect: defaultAspect 64149 }, ...(showDefaultRatios ? defaultRatios.map(presetRatioAsNumber).filter(({ 64150 ratio 64151 }) => ratio === 1) : [])] 64152 }), themeRatios?.length > 0 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AspectRatioGroup, { 64153 label: (0,external_wp_i18n_namespaceObject.__)('Theme'), 64154 isDisabled: isInProgress, 64155 onClick: newAspect => { 64156 setAspect(newAspect); 64157 onClose(); 64158 }, 64159 value: aspect, 64160 aspectRatios: themeRatios 64161 }), showDefaultRatios && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AspectRatioGroup, { 64162 label: (0,external_wp_i18n_namespaceObject.__)('Landscape'), 64163 isDisabled: isInProgress, 64164 onClick: newAspect => { 64165 setAspect(newAspect); 64166 onClose(); 64167 }, 64168 value: aspect, 64169 aspectRatios: defaultRatios.map(presetRatioAsNumber).filter(({ 64170 ratio 64171 }) => ratio > 1) 64172 }), showDefaultRatios && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AspectRatioGroup, { 64173 label: (0,external_wp_i18n_namespaceObject.__)('Portrait'), 64174 isDisabled: isInProgress, 64175 onClick: newAspect => { 64176 setAspect(newAspect); 64177 onClose(); 64178 }, 64179 value: aspect, 64180 aspectRatios: defaultRatios.map(presetRatioAsNumber).filter(({ 64181 ratio 64182 }) => ratio < 1) 64183 })] 64184 }) 64185 }); 64186 } 64187 64188 ;// CONCATENATED MODULE: ./node_modules/tslib/tslib.es6.mjs 64189 /****************************************************************************** 64190 Copyright (c) Microsoft Corporation. 64191 64192 Permission to use, copy, modify, and/or distribute this software for any 64193 purpose with or without fee is hereby granted. 64194 64195 THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH 64196 REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY 64197 AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, 64198 INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM 64199 LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR 64200 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR 64201 PERFORMANCE OF THIS SOFTWARE. 64202 ***************************************************************************** */ 64203 /* global Reflect, Promise, SuppressedError, Symbol, Iterator */ 64204 64205 var extendStatics = function(d, b) { 64206 extendStatics = Object.setPrototypeOf || 64207 ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || 64208 function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; 64209 return extendStatics(d, b); 64210 }; 64211 64212 function __extends(d, b) { 64213 if (typeof b !== "function" && b !== null) 64214 throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); 64215 extendStatics(d, b); 64216 function __() { this.constructor = d; } 64217 d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); 64218 } 64219 64220 var __assign = function() { 64221 __assign = Object.assign || function __assign(t) { 64222 for (var s, i = 1, n = arguments.length; i < n; i++) { 64223 s = arguments[i]; 64224 for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; 64225 } 64226 return t; 64227 } 64228 return __assign.apply(this, arguments); 64229 } 64230 64231 function __rest(s, e) { 64232 var t = {}; 64233 for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) 64234 t[p] = s[p]; 64235 if (s != null && typeof Object.getOwnPropertySymbols === "function") 64236 for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { 64237 if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) 64238 t[p[i]] = s[p[i]]; 64239 } 64240 return t; 64241 } 64242 64243 function __decorate(decorators, target, key, desc) { 64244 var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; 64245 if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); 64246 else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; 64247 return c > 3 && r && Object.defineProperty(target, key, r), r; 64248 } 64249 64250 function __param(paramIndex, decorator) { 64251 return function (target, key) { decorator(target, key, paramIndex); } 64252 } 64253 64254 function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) { 64255 function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; } 64256 var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value"; 64257 var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null; 64258 var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {}); 64259 var _, done = false; 64260 for (var i = decorators.length - 1; i >= 0; i--) { 64261 var context = {}; 64262 for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p]; 64263 for (var p in contextIn.access) context.access[p] = contextIn.access[p]; 64264 context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); }; 64265 var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context); 64266 if (kind === "accessor") { 64267 if (result === void 0) continue; 64268 if (result === null || typeof result !== "object") throw new TypeError("Object expected"); 64269 if (_ = accept(result.get)) descriptor.get = _; 64270 if (_ = accept(result.set)) descriptor.set = _; 64271 if (_ = accept(result.init)) initializers.unshift(_); 64272 } 64273 else if (_ = accept(result)) { 64274 if (kind === "field") initializers.unshift(_); 64275 else descriptor[key] = _; 64276 } 64277 } 64278 if (target) Object.defineProperty(target, contextIn.name, descriptor); 64279 done = true; 64280 }; 64281 64282 function __runInitializers(thisArg, initializers, value) { 64283 var useValue = arguments.length > 2; 64284 for (var i = 0; i < initializers.length; i++) { 64285 value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg); 64286 } 64287 return useValue ? value : void 0; 64288 }; 64289 64290 function __propKey(x) { 64291 return typeof x === "symbol" ? x : "".concat(x); 64292 }; 64293 64294 function __setFunctionName(f, name, prefix) { 64295 if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : ""; 64296 return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name }); 64297 }; 64298 64299 function __metadata(metadataKey, metadataValue) { 64300 if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue); 64301 } 64302 64303 function __awaiter(thisArg, _arguments, P, generator) { 64304 function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } 64305 return new (P || (P = Promise))(function (resolve, reject) { 64306 function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } 64307 function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } 64308 function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } 64309 step((generator = generator.apply(thisArg, _arguments || [])).next()); 64310 }); 64311 } 64312 64313 function __generator(thisArg, body) { 64314 var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype); 64315 return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; 64316 function verb(n) { return function (v) { return step([n, v]); }; } 64317 function step(op) { 64318 if (f) throw new TypeError("Generator is already executing."); 64319 while (g && (g = 0, op[0] && (_ = 0)), _) try { 64320 if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; 64321 if (y = 0, t) op = [op[0] & 2, t.value]; 64322 switch (op[0]) { 64323 case 0: case 1: t = op; break; 64324 case 4: _.label++; return { value: op[1], done: false }; 64325 case 5: _.label++; y = op[1]; op = [0]; continue; 64326 case 7: op = _.ops.pop(); _.trys.pop(); continue; 64327 default: 64328 if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } 64329 if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } 64330 if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } 64331 if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } 64332 if (t[2]) _.ops.pop(); 64333 _.trys.pop(); continue; 64334 } 64335 op = body.call(thisArg, _); 64336 } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } 64337 if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; 64338 } 64339 } 64340 64341 var __createBinding = Object.create ? (function(o, m, k, k2) { 64342 if (k2 === undefined) k2 = k; 64343 var desc = Object.getOwnPropertyDescriptor(m, k); 64344 if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { 64345 desc = { enumerable: true, get: function() { return m[k]; } }; 64346 } 64347 Object.defineProperty(o, k2, desc); 64348 }) : (function(o, m, k, k2) { 64349 if (k2 === undefined) k2 = k; 64350 o[k2] = m[k]; 64351 }); 64352 64353 function __exportStar(m, o) { 64354 for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p); 64355 } 64356 64357 function __values(o) { 64358 var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0; 64359 if (m) return m.call(o); 64360 if (o && typeof o.length === "number") return { 64361 next: function () { 64362 if (o && i >= o.length) o = void 0; 64363 return { value: o && o[i++], done: !o }; 64364 } 64365 }; 64366 throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined."); 64367 } 64368 64369 function __read(o, n) { 64370 var m = typeof Symbol === "function" && o[Symbol.iterator]; 64371 if (!m) return o; 64372 var i = m.call(o), r, ar = [], e; 64373 try { 64374 while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value); 64375 } 64376 catch (error) { e = { error: error }; } 64377 finally { 64378 try { 64379 if (r && !r.done && (m = i["return"])) m.call(i); 64380 } 64381 finally { if (e) throw e.error; } 64382 } 64383 return ar; 64384 } 64385 64386 /** @deprecated */ 64387 function __spread() { 64388 for (var ar = [], i = 0; i < arguments.length; i++) 64389 ar = ar.concat(__read(arguments[i])); 64390 return ar; 64391 } 64392 64393 /** @deprecated */ 64394 function __spreadArrays() { 64395 for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; 64396 for (var r = Array(s), k = 0, i = 0; i < il; i++) 64397 for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) 64398 r[k] = a[j]; 64399 return r; 64400 } 64401 64402 function __spreadArray(to, from, pack) { 64403 if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { 64404 if (ar || !(i in from)) { 64405 if (!ar) ar = Array.prototype.slice.call(from, 0, i); 64406 ar[i] = from[i]; 64407 } 64408 } 64409 return to.concat(ar || Array.prototype.slice.call(from)); 64410 } 64411 64412 function __await(v) { 64413 return this instanceof __await ? (this.v = v, this) : new __await(v); 64414 } 64415 64416 function __asyncGenerator(thisArg, _arguments, generator) { 64417 if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined."); 64418 var g = generator.apply(thisArg, _arguments || []), i, q = []; 64419 return i = Object.create((typeof AsyncIterator === "function" ? AsyncIterator : Object).prototype), verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i; 64420 function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; } 64421 function verb(n, f) { if (g[n]) { i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; if (f) i[n] = f(i[n]); } } 64422 function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } } 64423 function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); } 64424 function fulfill(value) { resume("next", value); } 64425 function reject(value) { resume("throw", value); } 64426 function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); } 64427 } 64428 64429 function __asyncDelegator(o) { 64430 var i, p; 64431 return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i; 64432 function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; } 64433 } 64434 64435 function __asyncValues(o) { 64436 if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined."); 64437 var m = o[Symbol.asyncIterator], i; 64438 return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i); 64439 function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; } 64440 function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); } 64441 } 64442 64443 function __makeTemplateObject(cooked, raw) { 64444 if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; } 64445 return cooked; 64446 }; 64447 64448 var __setModuleDefault = Object.create ? (function(o, v) { 64449 Object.defineProperty(o, "default", { enumerable: true, value: v }); 64450 }) : function(o, v) { 64451 o["default"] = v; 64452 }; 64453 64454 function __importStar(mod) { 64455 if (mod && mod.__esModule) return mod; 64456 var result = {}; 64457 if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k); 64458 __setModuleDefault(result, mod); 64459 return result; 64460 } 64461 64462 function __importDefault(mod) { 64463 return (mod && mod.__esModule) ? mod : { default: mod }; 64464 } 64465 64466 function __classPrivateFieldGet(receiver, state, kind, f) { 64467 if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter"); 64468 if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it"); 64469 return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver); 64470 } 64471 64472 function __classPrivateFieldSet(receiver, state, value, kind, f) { 64473 if (kind === "m") throw new TypeError("Private method is not writable"); 64474 if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter"); 64475 if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it"); 64476 return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value; 64477 } 64478 64479 function __classPrivateFieldIn(state, receiver) { 64480 if (receiver === null || (typeof receiver !== "object" && typeof receiver !== "function")) throw new TypeError("Cannot use 'in' operator on non-object"); 64481 return typeof state === "function" ? receiver === state : state.has(receiver); 64482 } 64483 64484 function __addDisposableResource(env, value, async) { 64485 if (value !== null && value !== void 0) { 64486 if (typeof value !== "object" && typeof value !== "function") throw new TypeError("Object expected."); 64487 var dispose, inner; 64488 if (async) { 64489 if (!Symbol.asyncDispose) throw new TypeError("Symbol.asyncDispose is not defined."); 64490 dispose = value[Symbol.asyncDispose]; 64491 } 64492 if (dispose === void 0) { 64493 if (!Symbol.dispose) throw new TypeError("Symbol.dispose is not defined."); 64494 dispose = value[Symbol.dispose]; 64495 if (async) inner = dispose; 64496 } 64497 if (typeof dispose !== "function") throw new TypeError("Object not disposable."); 64498 if (inner) dispose = function() { try { inner.call(this); } catch (e) { return Promise.reject(e); } }; 64499 env.stack.push({ value: value, dispose: dispose, async: async }); 64500 } 64501 else if (async) { 64502 env.stack.push({ async: true }); 64503 } 64504 return value; 64505 } 64506 64507 var _SuppressedError = typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) { 64508 var e = new Error(message); 64509 return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e; 64510 }; 64511 64512 function __disposeResources(env) { 64513 function fail(e) { 64514 env.error = env.hasError ? new _SuppressedError(e, env.error, "An error was suppressed during disposal.") : e; 64515 env.hasError = true; 64516 } 64517 var r, s = 0; 64518 function next() { 64519 while (r = env.stack.pop()) { 64520 try { 64521 if (!r.async && s === 1) return s = 0, env.stack.push(r), Promise.resolve().then(next); 64522 if (r.dispose) { 64523 var result = r.dispose.call(r.value); 64524 if (r.async) return s |= 2, Promise.resolve(result).then(next, function(e) { fail(e); return next(); }); 64525 } 64526 else s |= 1; 64527 } 64528 catch (e) { 64529 fail(e); 64530 } 64531 } 64532 if (s === 1) return env.hasError ? Promise.reject(env.error) : Promise.resolve(); 64533 if (env.hasError) throw env.error; 64534 } 64535 return next(); 64536 } 64537 64538 /* harmony default export */ const tslib_es6 = ({ 64539 __extends, 64540 __assign, 64541 __rest, 64542 __decorate, 64543 __param, 64544 __metadata, 64545 __awaiter, 64546 __generator, 64547 __createBinding, 64548 __exportStar, 64549 __values, 64550 __read, 64551 __spread, 64552 __spreadArrays, 64553 __spreadArray, 64554 __await, 64555 __asyncGenerator, 64556 __asyncDelegator, 64557 __asyncValues, 64558 __makeTemplateObject, 64559 __importStar, 64560 __importDefault, 64561 __classPrivateFieldGet, 64562 __classPrivateFieldSet, 64563 __classPrivateFieldIn, 64564 __addDisposableResource, 64565 __disposeResources, 64566 }); 64567 64568 // EXTERNAL MODULE: ./node_modules/normalize-wheel/index.js 64569 var normalize_wheel = __webpack_require__(7520); 64570 var normalize_wheel_default = /*#__PURE__*/__webpack_require__.n(normalize_wheel); 64571 ;// CONCATENATED MODULE: ./node_modules/react-easy-crop/index.module.js 64572 64573 64574 64575 64576 /** 64577 * Compute the dimension of the crop area based on media size, 64578 * aspect ratio and optionally rotation 64579 */ 64580 function getCropSize(mediaWidth, mediaHeight, containerWidth, containerHeight, aspect, rotation) { 64581 if (rotation === void 0) { 64582 rotation = 0; 64583 } 64584 var _a = rotateSize(mediaWidth, mediaHeight, rotation), 64585 width = _a.width, 64586 height = _a.height; 64587 var fittingWidth = Math.min(width, containerWidth); 64588 var fittingHeight = Math.min(height, containerHeight); 64589 if (fittingWidth > fittingHeight * aspect) { 64590 return { 64591 width: fittingHeight * aspect, 64592 height: fittingHeight 64593 }; 64594 } 64595 return { 64596 width: fittingWidth, 64597 height: fittingWidth / aspect 64598 }; 64599 } 64600 /** 64601 * Compute media zoom. 64602 * We fit the media into the container with "max-width: 100%; max-height: 100%;" 64603 */ 64604 function getMediaZoom(mediaSize) { 64605 // Take the axis with more pixels to improve accuracy 64606 return mediaSize.width > mediaSize.height ? mediaSize.width / mediaSize.naturalWidth : mediaSize.height / mediaSize.naturalHeight; 64607 } 64608 /** 64609 * Ensure a new media position stays in the crop area. 64610 */ 64611 function restrictPosition(position, mediaSize, cropSize, zoom, rotation) { 64612 if (rotation === void 0) { 64613 rotation = 0; 64614 } 64615 var _a = rotateSize(mediaSize.width, mediaSize.height, rotation), 64616 width = _a.width, 64617 height = _a.height; 64618 return { 64619 x: restrictPositionCoord(position.x, width, cropSize.width, zoom), 64620 y: restrictPositionCoord(position.y, height, cropSize.height, zoom) 64621 }; 64622 } 64623 function restrictPositionCoord(position, mediaSize, cropSize, zoom) { 64624 var maxPosition = mediaSize * zoom / 2 - cropSize / 2; 64625 return clamp(position, -maxPosition, maxPosition); 64626 } 64627 function getDistanceBetweenPoints(pointA, pointB) { 64628 return Math.sqrt(Math.pow(pointA.y - pointB.y, 2) + Math.pow(pointA.x - pointB.x, 2)); 64629 } 64630 function getRotationBetweenPoints(pointA, pointB) { 64631 return Math.atan2(pointB.y - pointA.y, pointB.x - pointA.x) * 180 / Math.PI; 64632 } 64633 /** 64634 * Compute the output cropped area of the media in percentages and pixels. 64635 * x/y are the top-left coordinates on the src media 64636 */ 64637 function computeCroppedArea(crop, mediaSize, cropSize, aspect, zoom, rotation, restrictPosition) { 64638 if (rotation === void 0) { 64639 rotation = 0; 64640 } 64641 if (restrictPosition === void 0) { 64642 restrictPosition = true; 64643 } 64644 // if the media is rotated by the user, we cannot limit the position anymore 64645 // as it might need to be negative. 64646 var limitAreaFn = restrictPosition ? limitArea : noOp; 64647 var mediaBBoxSize = rotateSize(mediaSize.width, mediaSize.height, rotation); 64648 var mediaNaturalBBoxSize = rotateSize(mediaSize.naturalWidth, mediaSize.naturalHeight, rotation); 64649 // calculate the crop area in percentages 64650 // in the rotated space 64651 var croppedAreaPercentages = { 64652 x: limitAreaFn(100, ((mediaBBoxSize.width - cropSize.width / zoom) / 2 - crop.x / zoom) / mediaBBoxSize.width * 100), 64653 y: limitAreaFn(100, ((mediaBBoxSize.height - cropSize.height / zoom) / 2 - crop.y / zoom) / mediaBBoxSize.height * 100), 64654 width: limitAreaFn(100, cropSize.width / mediaBBoxSize.width * 100 / zoom), 64655 height: limitAreaFn(100, cropSize.height / mediaBBoxSize.height * 100 / zoom) 64656 }; 64657 // we compute the pixels size naively 64658 var widthInPixels = Math.round(limitAreaFn(mediaNaturalBBoxSize.width, croppedAreaPercentages.width * mediaNaturalBBoxSize.width / 100)); 64659 var heightInPixels = Math.round(limitAreaFn(mediaNaturalBBoxSize.height, croppedAreaPercentages.height * mediaNaturalBBoxSize.height / 100)); 64660 var isImgWiderThanHigh = mediaNaturalBBoxSize.width >= mediaNaturalBBoxSize.height * aspect; 64661 // then we ensure the width and height exactly match the aspect (to avoid rounding approximations) 64662 // if the media is wider than high, when zoom is 0, the crop height will be equals to image height 64663 // thus we want to compute the width from the height and aspect for accuracy. 64664 // Otherwise, we compute the height from width and aspect. 64665 var sizePixels = isImgWiderThanHigh ? { 64666 width: Math.round(heightInPixels * aspect), 64667 height: heightInPixels 64668 } : { 64669 width: widthInPixels, 64670 height: Math.round(widthInPixels / aspect) 64671 }; 64672 var croppedAreaPixels = __assign(__assign({}, sizePixels), { 64673 x: Math.round(limitAreaFn(mediaNaturalBBoxSize.width - sizePixels.width, croppedAreaPercentages.x * mediaNaturalBBoxSize.width / 100)), 64674 y: Math.round(limitAreaFn(mediaNaturalBBoxSize.height - sizePixels.height, croppedAreaPercentages.y * mediaNaturalBBoxSize.height / 100)) 64675 }); 64676 return { 64677 croppedAreaPercentages: croppedAreaPercentages, 64678 croppedAreaPixels: croppedAreaPixels 64679 }; 64680 } 64681 /** 64682 * Ensure the returned value is between 0 and max 64683 */ 64684 function limitArea(max, value) { 64685 return Math.min(max, Math.max(0, value)); 64686 } 64687 function noOp(_max, value) { 64688 return value; 64689 } 64690 /** 64691 * Compute crop and zoom from the croppedAreaPercentages. 64692 */ 64693 function getInitialCropFromCroppedAreaPercentages(croppedAreaPercentages, mediaSize, rotation, cropSize, minZoom, maxZoom) { 64694 var mediaBBoxSize = rotateSize(mediaSize.width, mediaSize.height, rotation); 64695 // This is the inverse process of computeCroppedArea 64696 var zoom = clamp(cropSize.width / mediaBBoxSize.width * (100 / croppedAreaPercentages.width), minZoom, maxZoom); 64697 var crop = { 64698 x: zoom * mediaBBoxSize.width / 2 - cropSize.width / 2 - mediaBBoxSize.width * zoom * (croppedAreaPercentages.x / 100), 64699 y: zoom * mediaBBoxSize.height / 2 - cropSize.height / 2 - mediaBBoxSize.height * zoom * (croppedAreaPercentages.y / 100) 64700 }; 64701 return { 64702 crop: crop, 64703 zoom: zoom 64704 }; 64705 } 64706 /** 64707 * Compute zoom from the croppedAreaPixels 64708 */ 64709 function getZoomFromCroppedAreaPixels(croppedAreaPixels, mediaSize, cropSize) { 64710 var mediaZoom = getMediaZoom(mediaSize); 64711 return cropSize.height > cropSize.width ? cropSize.height / (croppedAreaPixels.height * mediaZoom) : cropSize.width / (croppedAreaPixels.width * mediaZoom); 64712 } 64713 /** 64714 * Compute crop and zoom from the croppedAreaPixels 64715 */ 64716 function getInitialCropFromCroppedAreaPixels(croppedAreaPixels, mediaSize, rotation, cropSize, minZoom, maxZoom) { 64717 if (rotation === void 0) { 64718 rotation = 0; 64719 } 64720 var mediaNaturalBBoxSize = rotateSize(mediaSize.naturalWidth, mediaSize.naturalHeight, rotation); 64721 var zoom = clamp(getZoomFromCroppedAreaPixels(croppedAreaPixels, mediaSize, cropSize), minZoom, maxZoom); 64722 var cropZoom = cropSize.height > cropSize.width ? cropSize.height / croppedAreaPixels.height : cropSize.width / croppedAreaPixels.width; 64723 var crop = { 64724 x: ((mediaNaturalBBoxSize.width - croppedAreaPixels.width) / 2 - croppedAreaPixels.x) * cropZoom, 64725 y: ((mediaNaturalBBoxSize.height - croppedAreaPixels.height) / 2 - croppedAreaPixels.y) * cropZoom 64726 }; 64727 return { 64728 crop: crop, 64729 zoom: zoom 64730 }; 64731 } 64732 /** 64733 * Return the point that is the center of point a and b 64734 */ 64735 function getCenter(a, b) { 64736 return { 64737 x: (b.x + a.x) / 2, 64738 y: (b.y + a.y) / 2 64739 }; 64740 } 64741 function getRadianAngle(degreeValue) { 64742 return degreeValue * Math.PI / 180; 64743 } 64744 /** 64745 * Returns the new bounding area of a rotated rectangle. 64746 */ 64747 function rotateSize(width, height, rotation) { 64748 var rotRad = getRadianAngle(rotation); 64749 return { 64750 width: Math.abs(Math.cos(rotRad) * width) + Math.abs(Math.sin(rotRad) * height), 64751 height: Math.abs(Math.sin(rotRad) * width) + Math.abs(Math.cos(rotRad) * height) 64752 }; 64753 } 64754 /** 64755 * Clamp value between min and max 64756 */ 64757 function clamp(value, min, max) { 64758 return Math.min(Math.max(value, min), max); 64759 } 64760 /** 64761 * Combine multiple class names into a single string. 64762 */ 64763 function classNames() { 64764 var args = []; 64765 for (var _i = 0; _i < arguments.length; _i++) { 64766 args[_i] = arguments[_i]; 64767 } 64768 return args.filter(function (value) { 64769 if (typeof value === 'string' && value.length > 0) { 64770 return true; 64771 } 64772 return false; 64773 }).join(' ').trim(); 64774 } 64775 64776 var css_248z = ".reactEasyCrop_Container {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n overflow: hidden;\n user-select: none;\n touch-action: none;\n cursor: move;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.reactEasyCrop_Image,\n.reactEasyCrop_Video {\n will-change: transform; /* this improves performances and prevent painting issues on iOS Chrome */\n}\n\n.reactEasyCrop_Contain {\n max-width: 100%;\n max-height: 100%;\n margin: auto;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n}\n.reactEasyCrop_Cover_Horizontal {\n width: 100%;\n height: auto;\n}\n.reactEasyCrop_Cover_Vertical {\n width: auto;\n height: 100%;\n}\n\n.reactEasyCrop_CropArea {\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n border: 1px solid rgba(255, 255, 255, 0.5);\n box-sizing: border-box;\n box-shadow: 0 0 0 9999em;\n color: rgba(0, 0, 0, 0.5);\n overflow: hidden;\n}\n\n.reactEasyCrop_CropAreaRound {\n border-radius: 50%;\n}\n\n.reactEasyCrop_CropAreaGrid::before {\n content: ' ';\n box-sizing: border-box;\n position: absolute;\n border: 1px solid rgba(255, 255, 255, 0.5);\n top: 0;\n bottom: 0;\n left: 33.33%;\n right: 33.33%;\n border-top: 0;\n border-bottom: 0;\n}\n\n.reactEasyCrop_CropAreaGrid::after {\n content: ' ';\n box-sizing: border-box;\n position: absolute;\n border: 1px solid rgba(255, 255, 255, 0.5);\n top: 33.33%;\n bottom: 33.33%;\n left: 0;\n right: 0;\n border-left: 0;\n border-right: 0;\n}\n"; 64777 64778 var index_module_MIN_ZOOM = 1; 64779 var index_module_MAX_ZOOM = 3; 64780 var Cropper = /** @class */function (_super) { 64781 __extends(Cropper, _super); 64782 function Cropper() { 64783 var _this = _super !== null && _super.apply(this, arguments) || this; 64784 _this.imageRef = external_React_.createRef(); 64785 _this.videoRef = external_React_.createRef(); 64786 _this.containerPosition = { 64787 x: 0, 64788 y: 0 64789 }; 64790 _this.containerRef = null; 64791 _this.styleRef = null; 64792 _this.containerRect = null; 64793 _this.mediaSize = { 64794 width: 0, 64795 height: 0, 64796 naturalWidth: 0, 64797 naturalHeight: 0 64798 }; 64799 _this.dragStartPosition = { 64800 x: 0, 64801 y: 0 64802 }; 64803 _this.dragStartCrop = { 64804 x: 0, 64805 y: 0 64806 }; 64807 _this.gestureZoomStart = 0; 64808 _this.gestureRotationStart = 0; 64809 _this.isTouching = false; 64810 _this.lastPinchDistance = 0; 64811 _this.lastPinchRotation = 0; 64812 _this.rafDragTimeout = null; 64813 _this.rafPinchTimeout = null; 64814 _this.wheelTimer = null; 64815 _this.currentDoc = typeof document !== 'undefined' ? document : null; 64816 _this.currentWindow = typeof window !== 'undefined' ? window : null; 64817 _this.resizeObserver = null; 64818 _this.state = { 64819 cropSize: null, 64820 hasWheelJustStarted: false, 64821 mediaObjectFit: undefined 64822 }; 64823 _this.initResizeObserver = function () { 64824 if (typeof window.ResizeObserver === 'undefined' || !_this.containerRef) { 64825 return; 64826 } 64827 var isFirstResize = true; 64828 _this.resizeObserver = new window.ResizeObserver(function (entries) { 64829 if (isFirstResize) { 64830 isFirstResize = false; // observe() is called on mount, we don't want to trigger a recompute on mount 64831 return; 64832 } 64833 _this.computeSizes(); 64834 }); 64835 _this.resizeObserver.observe(_this.containerRef); 64836 }; 64837 // this is to prevent Safari on iOS >= 10 to zoom the page 64838 _this.preventZoomSafari = function (e) { 64839 return e.preventDefault(); 64840 }; 64841 _this.cleanEvents = function () { 64842 if (!_this.currentDoc) return; 64843 _this.currentDoc.removeEventListener('mousemove', _this.onMouseMove); 64844 _this.currentDoc.removeEventListener('mouseup', _this.onDragStopped); 64845 _this.currentDoc.removeEventListener('touchmove', _this.onTouchMove); 64846 _this.currentDoc.removeEventListener('touchend', _this.onDragStopped); 64847 _this.currentDoc.removeEventListener('gesturemove', _this.onGestureMove); 64848 _this.currentDoc.removeEventListener('gestureend', _this.onGestureEnd); 64849 _this.currentDoc.removeEventListener('scroll', _this.onScroll); 64850 }; 64851 _this.clearScrollEvent = function () { 64852 if (_this.containerRef) _this.containerRef.removeEventListener('wheel', _this.onWheel); 64853 if (_this.wheelTimer) { 64854 clearTimeout(_this.wheelTimer); 64855 } 64856 }; 64857 _this.onMediaLoad = function () { 64858 var cropSize = _this.computeSizes(); 64859 if (cropSize) { 64860 _this.emitCropData(); 64861 _this.setInitialCrop(cropSize); 64862 } 64863 if (_this.props.onMediaLoaded) { 64864 _this.props.onMediaLoaded(_this.mediaSize); 64865 } 64866 }; 64867 _this.setInitialCrop = function (cropSize) { 64868 if (_this.props.initialCroppedAreaPercentages) { 64869 var _a = getInitialCropFromCroppedAreaPercentages(_this.props.initialCroppedAreaPercentages, _this.mediaSize, _this.props.rotation, cropSize, _this.props.minZoom, _this.props.maxZoom), 64870 crop = _a.crop, 64871 zoom = _a.zoom; 64872 _this.props.onCropChange(crop); 64873 _this.props.onZoomChange && _this.props.onZoomChange(zoom); 64874 } else if (_this.props.initialCroppedAreaPixels) { 64875 var _b = getInitialCropFromCroppedAreaPixels(_this.props.initialCroppedAreaPixels, _this.mediaSize, _this.props.rotation, cropSize, _this.props.minZoom, _this.props.maxZoom), 64876 crop = _b.crop, 64877 zoom = _b.zoom; 64878 _this.props.onCropChange(crop); 64879 _this.props.onZoomChange && _this.props.onZoomChange(zoom); 64880 } 64881 }; 64882 _this.computeSizes = function () { 64883 var _a, _b, _c, _d, _e, _f; 64884 var mediaRef = _this.imageRef.current || _this.videoRef.current; 64885 if (mediaRef && _this.containerRef) { 64886 _this.containerRect = _this.containerRef.getBoundingClientRect(); 64887 _this.saveContainerPosition(); 64888 var containerAspect = _this.containerRect.width / _this.containerRect.height; 64889 var naturalWidth = ((_a = _this.imageRef.current) === null || _a === void 0 ? void 0 : _a.naturalWidth) || ((_b = _this.videoRef.current) === null || _b === void 0 ? void 0 : _b.videoWidth) || 0; 64890 var naturalHeight = ((_c = _this.imageRef.current) === null || _c === void 0 ? void 0 : _c.naturalHeight) || ((_d = _this.videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) || 0; 64891 var isMediaScaledDown = mediaRef.offsetWidth < naturalWidth || mediaRef.offsetHeight < naturalHeight; 64892 var mediaAspect = naturalWidth / naturalHeight; 64893 // We do not rely on the offsetWidth/offsetHeight if the media is scaled down 64894 // as the values they report are rounded. That will result in precision losses 64895 // when calculating zoom. We use the fact that the media is positionned relative 64896 // to the container. That allows us to use the container's dimensions 64897 // and natural aspect ratio of the media to calculate accurate media size. 64898 // However, for this to work, the container should not be rotated 64899 var renderedMediaSize = void 0; 64900 if (isMediaScaledDown) { 64901 switch (_this.state.mediaObjectFit) { 64902 default: 64903 case 'contain': 64904 renderedMediaSize = containerAspect > mediaAspect ? { 64905 width: _this.containerRect.height * mediaAspect, 64906 height: _this.containerRect.height 64907 } : { 64908 width: _this.containerRect.width, 64909 height: _this.containerRect.width / mediaAspect 64910 }; 64911 break; 64912 case 'horizontal-cover': 64913 renderedMediaSize = { 64914 width: _this.containerRect.width, 64915 height: _this.containerRect.width / mediaAspect 64916 }; 64917 break; 64918 case 'vertical-cover': 64919 renderedMediaSize = { 64920 width: _this.containerRect.height * mediaAspect, 64921 height: _this.containerRect.height 64922 }; 64923 break; 64924 } 64925 } else { 64926 renderedMediaSize = { 64927 width: mediaRef.offsetWidth, 64928 height: mediaRef.offsetHeight 64929 }; 64930 } 64931 _this.mediaSize = __assign(__assign({}, renderedMediaSize), { 64932 naturalWidth: naturalWidth, 64933 naturalHeight: naturalHeight 64934 }); 64935 // set media size in the parent 64936 if (_this.props.setMediaSize) { 64937 _this.props.setMediaSize(_this.mediaSize); 64938 } 64939 var cropSize = _this.props.cropSize ? _this.props.cropSize : getCropSize(_this.mediaSize.width, _this.mediaSize.height, _this.containerRect.width, _this.containerRect.height, _this.props.aspect, _this.props.rotation); 64940 if (((_e = _this.state.cropSize) === null || _e === void 0 ? void 0 : _e.height) !== cropSize.height || ((_f = _this.state.cropSize) === null || _f === void 0 ? void 0 : _f.width) !== cropSize.width) { 64941 _this.props.onCropSizeChange && _this.props.onCropSizeChange(cropSize); 64942 } 64943 _this.setState({ 64944 cropSize: cropSize 64945 }, _this.recomputeCropPosition); 64946 // pass crop size to parent 64947 if (_this.props.setCropSize) { 64948 _this.props.setCropSize(cropSize); 64949 } 64950 return cropSize; 64951 } 64952 }; 64953 _this.saveContainerPosition = function () { 64954 if (_this.containerRef) { 64955 var bounds = _this.containerRef.getBoundingClientRect(); 64956 _this.containerPosition = { 64957 x: bounds.left, 64958 y: bounds.top 64959 }; 64960 } 64961 }; 64962 _this.onMouseDown = function (e) { 64963 if (!_this.currentDoc) return; 64964 e.preventDefault(); 64965 _this.currentDoc.addEventListener('mousemove', _this.onMouseMove); 64966 _this.currentDoc.addEventListener('mouseup', _this.onDragStopped); 64967 _this.saveContainerPosition(); 64968 _this.onDragStart(Cropper.getMousePoint(e)); 64969 }; 64970 _this.onMouseMove = function (e) { 64971 return _this.onDrag(Cropper.getMousePoint(e)); 64972 }; 64973 _this.onScroll = function (e) { 64974 if (!_this.currentDoc) return; 64975 e.preventDefault(); 64976 _this.saveContainerPosition(); 64977 }; 64978 _this.onTouchStart = function (e) { 64979 if (!_this.currentDoc) return; 64980 _this.isTouching = true; 64981 if (_this.props.onTouchRequest && !_this.props.onTouchRequest(e)) { 64982 return; 64983 } 64984 _this.currentDoc.addEventListener('touchmove', _this.onTouchMove, { 64985 passive: false 64986 }); // iOS 11 now defaults to passive: true 64987 _this.currentDoc.addEventListener('touchend', _this.onDragStopped); 64988 _this.saveContainerPosition(); 64989 if (e.touches.length === 2) { 64990 _this.onPinchStart(e); 64991 } else if (e.touches.length === 1) { 64992 _this.onDragStart(Cropper.getTouchPoint(e.touches[0])); 64993 } 64994 }; 64995 _this.onTouchMove = function (e) { 64996 // Prevent whole page from scrolling on iOS. 64997 e.preventDefault(); 64998 if (e.touches.length === 2) { 64999 _this.onPinchMove(e); 65000 } else if (e.touches.length === 1) { 65001 _this.onDrag(Cropper.getTouchPoint(e.touches[0])); 65002 } 65003 }; 65004 _this.onGestureStart = function (e) { 65005 if (!_this.currentDoc) return; 65006 e.preventDefault(); 65007 _this.currentDoc.addEventListener('gesturechange', _this.onGestureMove); 65008 _this.currentDoc.addEventListener('gestureend', _this.onGestureEnd); 65009 _this.gestureZoomStart = _this.props.zoom; 65010 _this.gestureRotationStart = _this.props.rotation; 65011 }; 65012 _this.onGestureMove = function (e) { 65013 e.preventDefault(); 65014 if (_this.isTouching) { 65015 // this is to avoid conflict between gesture and touch events 65016 return; 65017 } 65018 var point = Cropper.getMousePoint(e); 65019 var newZoom = _this.gestureZoomStart - 1 + e.scale; 65020 _this.setNewZoom(newZoom, point, { 65021 shouldUpdatePosition: true 65022 }); 65023 if (_this.props.onRotationChange) { 65024 var newRotation = _this.gestureRotationStart + e.rotation; 65025 _this.props.onRotationChange(newRotation); 65026 } 65027 }; 65028 _this.onGestureEnd = function (e) { 65029 _this.cleanEvents(); 65030 }; 65031 _this.onDragStart = function (_a) { 65032 var _b, _c; 65033 var x = _a.x, 65034 y = _a.y; 65035 _this.dragStartPosition = { 65036 x: x, 65037 y: y 65038 }; 65039 _this.dragStartCrop = __assign({}, _this.props.crop); 65040 (_c = (_b = _this.props).onInteractionStart) === null || _c === void 0 ? void 0 : _c.call(_b); 65041 }; 65042 _this.onDrag = function (_a) { 65043 var x = _a.x, 65044 y = _a.y; 65045 if (!_this.currentWindow) return; 65046 if (_this.rafDragTimeout) _this.currentWindow.cancelAnimationFrame(_this.rafDragTimeout); 65047 _this.rafDragTimeout = _this.currentWindow.requestAnimationFrame(function () { 65048 if (!_this.state.cropSize) return; 65049 if (x === undefined || y === undefined) return; 65050 var offsetX = x - _this.dragStartPosition.x; 65051 var offsetY = y - _this.dragStartPosition.y; 65052 var requestedPosition = { 65053 x: _this.dragStartCrop.x + offsetX, 65054 y: _this.dragStartCrop.y + offsetY 65055 }; 65056 var newPosition = _this.props.restrictPosition ? restrictPosition(requestedPosition, _this.mediaSize, _this.state.cropSize, _this.props.zoom, _this.props.rotation) : requestedPosition; 65057 _this.props.onCropChange(newPosition); 65058 }); 65059 }; 65060 _this.onDragStopped = function () { 65061 var _a, _b; 65062 _this.isTouching = false; 65063 _this.cleanEvents(); 65064 _this.emitCropData(); 65065 (_b = (_a = _this.props).onInteractionEnd) === null || _b === void 0 ? void 0 : _b.call(_a); 65066 }; 65067 _this.onWheel = function (e) { 65068 if (!_this.currentWindow) return; 65069 if (_this.props.onWheelRequest && !_this.props.onWheelRequest(e)) { 65070 return; 65071 } 65072 e.preventDefault(); 65073 var point = Cropper.getMousePoint(e); 65074 var pixelY = normalize_wheel_default()(e).pixelY; 65075 var newZoom = _this.props.zoom - pixelY * _this.props.zoomSpeed / 200; 65076 _this.setNewZoom(newZoom, point, { 65077 shouldUpdatePosition: true 65078 }); 65079 if (!_this.state.hasWheelJustStarted) { 65080 _this.setState({ 65081 hasWheelJustStarted: true 65082 }, function () { 65083 var _a, _b; 65084 return (_b = (_a = _this.props).onInteractionStart) === null || _b === void 0 ? void 0 : _b.call(_a); 65085 }); 65086 } 65087 if (_this.wheelTimer) { 65088 clearTimeout(_this.wheelTimer); 65089 } 65090 _this.wheelTimer = _this.currentWindow.setTimeout(function () { 65091 return _this.setState({ 65092 hasWheelJustStarted: false 65093 }, function () { 65094 var _a, _b; 65095 return (_b = (_a = _this.props).onInteractionEnd) === null || _b === void 0 ? void 0 : _b.call(_a); 65096 }); 65097 }, 250); 65098 }; 65099 _this.getPointOnContainer = function (_a, containerTopLeft) { 65100 var x = _a.x, 65101 y = _a.y; 65102 if (!_this.containerRect) { 65103 throw new Error('The Cropper is not mounted'); 65104 } 65105 return { 65106 x: _this.containerRect.width / 2 - (x - containerTopLeft.x), 65107 y: _this.containerRect.height / 2 - (y - containerTopLeft.y) 65108 }; 65109 }; 65110 _this.getPointOnMedia = function (_a) { 65111 var x = _a.x, 65112 y = _a.y; 65113 var _b = _this.props, 65114 crop = _b.crop, 65115 zoom = _b.zoom; 65116 return { 65117 x: (x + crop.x) / zoom, 65118 y: (y + crop.y) / zoom 65119 }; 65120 }; 65121 _this.setNewZoom = function (zoom, point, _a) { 65122 var _b = _a === void 0 ? {} : _a, 65123 _c = _b.shouldUpdatePosition, 65124 shouldUpdatePosition = _c === void 0 ? true : _c; 65125 if (!_this.state.cropSize || !_this.props.onZoomChange) return; 65126 var newZoom = clamp(zoom, _this.props.minZoom, _this.props.maxZoom); 65127 if (shouldUpdatePosition) { 65128 var zoomPoint = _this.getPointOnContainer(point, _this.containerPosition); 65129 var zoomTarget = _this.getPointOnMedia(zoomPoint); 65130 var requestedPosition = { 65131 x: zoomTarget.x * newZoom - zoomPoint.x, 65132 y: zoomTarget.y * newZoom - zoomPoint.y 65133 }; 65134 var newPosition = _this.props.restrictPosition ? restrictPosition(requestedPosition, _this.mediaSize, _this.state.cropSize, newZoom, _this.props.rotation) : requestedPosition; 65135 _this.props.onCropChange(newPosition); 65136 } 65137 _this.props.onZoomChange(newZoom); 65138 }; 65139 _this.getCropData = function () { 65140 if (!_this.state.cropSize) { 65141 return null; 65142 } 65143 // this is to ensure the crop is correctly restricted after a zoom back (https://github.com/ValentinH/react-easy-crop/issues/6) 65144 var restrictedPosition = _this.props.restrictPosition ? restrictPosition(_this.props.crop, _this.mediaSize, _this.state.cropSize, _this.props.zoom, _this.props.rotation) : _this.props.crop; 65145 return computeCroppedArea(restrictedPosition, _this.mediaSize, _this.state.cropSize, _this.getAspect(), _this.props.zoom, _this.props.rotation, _this.props.restrictPosition); 65146 }; 65147 _this.emitCropData = function () { 65148 var cropData = _this.getCropData(); 65149 if (!cropData) return; 65150 var croppedAreaPercentages = cropData.croppedAreaPercentages, 65151 croppedAreaPixels = cropData.croppedAreaPixels; 65152 if (_this.props.onCropComplete) { 65153 _this.props.onCropComplete(croppedAreaPercentages, croppedAreaPixels); 65154 } 65155 if (_this.props.onCropAreaChange) { 65156 _this.props.onCropAreaChange(croppedAreaPercentages, croppedAreaPixels); 65157 } 65158 }; 65159 _this.emitCropAreaChange = function () { 65160 var cropData = _this.getCropData(); 65161 if (!cropData) return; 65162 var croppedAreaPercentages = cropData.croppedAreaPercentages, 65163 croppedAreaPixels = cropData.croppedAreaPixels; 65164 if (_this.props.onCropAreaChange) { 65165 _this.props.onCropAreaChange(croppedAreaPercentages, croppedAreaPixels); 65166 } 65167 }; 65168 _this.recomputeCropPosition = function () { 65169 if (!_this.state.cropSize) return; 65170 var newPosition = _this.props.restrictPosition ? restrictPosition(_this.props.crop, _this.mediaSize, _this.state.cropSize, _this.props.zoom, _this.props.rotation) : _this.props.crop; 65171 _this.props.onCropChange(newPosition); 65172 _this.emitCropData(); 65173 }; 65174 return _this; 65175 } 65176 Cropper.prototype.componentDidMount = function () { 65177 if (!this.currentDoc || !this.currentWindow) return; 65178 if (this.containerRef) { 65179 if (this.containerRef.ownerDocument) { 65180 this.currentDoc = this.containerRef.ownerDocument; 65181 } 65182 if (this.currentDoc.defaultView) { 65183 this.currentWindow = this.currentDoc.defaultView; 65184 } 65185 this.initResizeObserver(); 65186 // only add window resize listener if ResizeObserver is not supported. Otherwise, it would be redundant 65187 if (typeof window.ResizeObserver === 'undefined') { 65188 this.currentWindow.addEventListener('resize', this.computeSizes); 65189 } 65190 this.props.zoomWithScroll && this.containerRef.addEventListener('wheel', this.onWheel, { 65191 passive: false 65192 }); 65193 this.containerRef.addEventListener('gesturestart', this.onGestureStart); 65194 } 65195 this.currentDoc.addEventListener('scroll', this.onScroll); 65196 if (!this.props.disableAutomaticStylesInjection) { 65197 this.styleRef = this.currentDoc.createElement('style'); 65198 this.styleRef.setAttribute('type', 'text/css'); 65199 if (this.props.nonce) { 65200 this.styleRef.setAttribute('nonce', this.props.nonce); 65201 } 65202 this.styleRef.innerHTML = css_248z; 65203 this.currentDoc.head.appendChild(this.styleRef); 65204 } 65205 // when rendered via SSR, the image can already be loaded and its onLoad callback will never be called 65206 if (this.imageRef.current && this.imageRef.current.complete) { 65207 this.onMediaLoad(); 65208 } 65209 // set image and video refs in the parent if the callbacks exist 65210 if (this.props.setImageRef) { 65211 this.props.setImageRef(this.imageRef); 65212 } 65213 if (this.props.setVideoRef) { 65214 this.props.setVideoRef(this.videoRef); 65215 } 65216 }; 65217 Cropper.prototype.componentWillUnmount = function () { 65218 var _a, _b; 65219 if (!this.currentDoc || !this.currentWindow) return; 65220 if (typeof window.ResizeObserver === 'undefined') { 65221 this.currentWindow.removeEventListener('resize', this.computeSizes); 65222 } 65223 (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect(); 65224 if (this.containerRef) { 65225 this.containerRef.removeEventListener('gesturestart', this.preventZoomSafari); 65226 } 65227 if (this.styleRef) { 65228 (_b = this.styleRef.parentNode) === null || _b === void 0 ? void 0 : _b.removeChild(this.styleRef); 65229 } 65230 this.cleanEvents(); 65231 this.props.zoomWithScroll && this.clearScrollEvent(); 65232 }; 65233 Cropper.prototype.componentDidUpdate = function (prevProps) { 65234 var _a, _b, _c, _d, _e, _f, _g, _h, _j; 65235 if (prevProps.rotation !== this.props.rotation) { 65236 this.computeSizes(); 65237 this.recomputeCropPosition(); 65238 } else if (prevProps.aspect !== this.props.aspect) { 65239 this.computeSizes(); 65240 } else if (prevProps.objectFit !== this.props.objectFit) { 65241 this.computeSizes(); 65242 } else if (prevProps.zoom !== this.props.zoom) { 65243 this.recomputeCropPosition(); 65244 } else if (((_a = prevProps.cropSize) === null || _a === void 0 ? void 0 : _a.height) !== ((_b = this.props.cropSize) === null || _b === void 0 ? void 0 : _b.height) || ((_c = prevProps.cropSize) === null || _c === void 0 ? void 0 : _c.width) !== ((_d = this.props.cropSize) === null || _d === void 0 ? void 0 : _d.width)) { 65245 this.computeSizes(); 65246 } else if (((_e = prevProps.crop) === null || _e === void 0 ? void 0 : _e.x) !== ((_f = this.props.crop) === null || _f === void 0 ? void 0 : _f.x) || ((_g = prevProps.crop) === null || _g === void 0 ? void 0 : _g.y) !== ((_h = this.props.crop) === null || _h === void 0 ? void 0 : _h.y)) { 65247 this.emitCropAreaChange(); 65248 } 65249 if (prevProps.zoomWithScroll !== this.props.zoomWithScroll && this.containerRef) { 65250 this.props.zoomWithScroll ? this.containerRef.addEventListener('wheel', this.onWheel, { 65251 passive: false 65252 }) : this.clearScrollEvent(); 65253 } 65254 if (prevProps.video !== this.props.video) { 65255 (_j = this.videoRef.current) === null || _j === void 0 ? void 0 : _j.load(); 65256 } 65257 var objectFit = this.getObjectFit(); 65258 if (objectFit !== this.state.mediaObjectFit) { 65259 this.setState({ 65260 mediaObjectFit: objectFit 65261 }, this.computeSizes); 65262 } 65263 }; 65264 Cropper.prototype.getAspect = function () { 65265 var _a = this.props, 65266 cropSize = _a.cropSize, 65267 aspect = _a.aspect; 65268 if (cropSize) { 65269 return cropSize.width / cropSize.height; 65270 } 65271 return aspect; 65272 }; 65273 Cropper.prototype.getObjectFit = function () { 65274 var _a, _b, _c, _d; 65275 if (this.props.objectFit === 'cover') { 65276 var mediaRef = this.imageRef.current || this.videoRef.current; 65277 if (mediaRef && this.containerRef) { 65278 this.containerRect = this.containerRef.getBoundingClientRect(); 65279 var containerAspect = this.containerRect.width / this.containerRect.height; 65280 var naturalWidth = ((_a = this.imageRef.current) === null || _a === void 0 ? void 0 : _a.naturalWidth) || ((_b = this.videoRef.current) === null || _b === void 0 ? void 0 : _b.videoWidth) || 0; 65281 var naturalHeight = ((_c = this.imageRef.current) === null || _c === void 0 ? void 0 : _c.naturalHeight) || ((_d = this.videoRef.current) === null || _d === void 0 ? void 0 : _d.videoHeight) || 0; 65282 var mediaAspect = naturalWidth / naturalHeight; 65283 return mediaAspect < containerAspect ? 'horizontal-cover' : 'vertical-cover'; 65284 } 65285 return 'horizontal-cover'; 65286 } 65287 return this.props.objectFit; 65288 }; 65289 Cropper.prototype.onPinchStart = function (e) { 65290 var pointA = Cropper.getTouchPoint(e.touches[0]); 65291 var pointB = Cropper.getTouchPoint(e.touches[1]); 65292 this.lastPinchDistance = getDistanceBetweenPoints(pointA, pointB); 65293 this.lastPinchRotation = getRotationBetweenPoints(pointA, pointB); 65294 this.onDragStart(getCenter(pointA, pointB)); 65295 }; 65296 Cropper.prototype.onPinchMove = function (e) { 65297 var _this = this; 65298 if (!this.currentDoc || !this.currentWindow) return; 65299 var pointA = Cropper.getTouchPoint(e.touches[0]); 65300 var pointB = Cropper.getTouchPoint(e.touches[1]); 65301 var center = getCenter(pointA, pointB); 65302 this.onDrag(center); 65303 if (this.rafPinchTimeout) this.currentWindow.cancelAnimationFrame(this.rafPinchTimeout); 65304 this.rafPinchTimeout = this.currentWindow.requestAnimationFrame(function () { 65305 var distance = getDistanceBetweenPoints(pointA, pointB); 65306 var newZoom = _this.props.zoom * (distance / _this.lastPinchDistance); 65307 _this.setNewZoom(newZoom, center, { 65308 shouldUpdatePosition: false 65309 }); 65310 _this.lastPinchDistance = distance; 65311 var rotation = getRotationBetweenPoints(pointA, pointB); 65312 var newRotation = _this.props.rotation + (rotation - _this.lastPinchRotation); 65313 _this.props.onRotationChange && _this.props.onRotationChange(newRotation); 65314 _this.lastPinchRotation = rotation; 65315 }); 65316 }; 65317 Cropper.prototype.render = function () { 65318 var _this = this; 65319 var _a = this.props, 65320 image = _a.image, 65321 video = _a.video, 65322 mediaProps = _a.mediaProps, 65323 transform = _a.transform, 65324 _b = _a.crop, 65325 x = _b.x, 65326 y = _b.y, 65327 rotation = _a.rotation, 65328 zoom = _a.zoom, 65329 cropShape = _a.cropShape, 65330 showGrid = _a.showGrid, 65331 _c = _a.style, 65332 containerStyle = _c.containerStyle, 65333 cropAreaStyle = _c.cropAreaStyle, 65334 mediaStyle = _c.mediaStyle, 65335 _d = _a.classes, 65336 containerClassName = _d.containerClassName, 65337 cropAreaClassName = _d.cropAreaClassName, 65338 mediaClassName = _d.mediaClassName; 65339 var objectFit = this.state.mediaObjectFit; 65340 return external_React_.createElement("div", { 65341 onMouseDown: this.onMouseDown, 65342 onTouchStart: this.onTouchStart, 65343 ref: function ref(el) { 65344 return _this.containerRef = el; 65345 }, 65346 "data-testid": "container", 65347 style: containerStyle, 65348 className: classNames('reactEasyCrop_Container', containerClassName) 65349 }, image ? external_React_.createElement("img", __assign({ 65350 alt: "", 65351 className: classNames('reactEasyCrop_Image', objectFit === 'contain' && 'reactEasyCrop_Contain', objectFit === 'horizontal-cover' && 'reactEasyCrop_Cover_Horizontal', objectFit === 'vertical-cover' && 'reactEasyCrop_Cover_Vertical', mediaClassName) 65352 }, mediaProps, { 65353 src: image, 65354 ref: this.imageRef, 65355 style: __assign(__assign({}, mediaStyle), { 65356 transform: transform || "translate(".concat(x, "px, ").concat(y, "px) rotate(").concat(rotation, "deg) scale(").concat(zoom, ")") 65357 }), 65358 onLoad: this.onMediaLoad 65359 })) : video && external_React_.createElement("video", __assign({ 65360 autoPlay: true, 65361 loop: true, 65362 muted: true, 65363 className: classNames('reactEasyCrop_Video', objectFit === 'contain' && 'reactEasyCrop_Contain', objectFit === 'horizontal-cover' && 'reactEasyCrop_Cover_Horizontal', objectFit === 'vertical-cover' && 'reactEasyCrop_Cover_Vertical', mediaClassName) 65364 }, mediaProps, { 65365 ref: this.videoRef, 65366 onLoadedMetadata: this.onMediaLoad, 65367 style: __assign(__assign({}, mediaStyle), { 65368 transform: transform || "translate(".concat(x, "px, ").concat(y, "px) rotate(").concat(rotation, "deg) scale(").concat(zoom, ")") 65369 }), 65370 controls: false 65371 }), (Array.isArray(video) ? video : [{ 65372 src: video 65373 }]).map(function (item) { 65374 return external_React_.createElement("source", __assign({ 65375 key: item.src 65376 }, item)); 65377 })), this.state.cropSize && external_React_.createElement("div", { 65378 style: __assign(__assign({}, cropAreaStyle), { 65379 width: this.state.cropSize.width, 65380 height: this.state.cropSize.height 65381 }), 65382 "data-testid": "cropper", 65383 className: classNames('reactEasyCrop_CropArea', cropShape === 'round' && 'reactEasyCrop_CropAreaRound', showGrid && 'reactEasyCrop_CropAreaGrid', cropAreaClassName) 65384 })); 65385 }; 65386 Cropper.defaultProps = { 65387 zoom: 1, 65388 rotation: 0, 65389 aspect: 4 / 3, 65390 maxZoom: index_module_MAX_ZOOM, 65391 minZoom: index_module_MIN_ZOOM, 65392 cropShape: 'rect', 65393 objectFit: 'contain', 65394 showGrid: true, 65395 style: {}, 65396 classes: {}, 65397 mediaProps: {}, 65398 zoomSpeed: 1, 65399 restrictPosition: true, 65400 zoomWithScroll: true 65401 }; 65402 Cropper.getMousePoint = function (e) { 65403 return { 65404 x: Number(e.clientX), 65405 y: Number(e.clientY) 65406 }; 65407 }; 65408 Cropper.getTouchPoint = function (touch) { 65409 return { 65410 x: Number(touch.clientX), 65411 y: Number(touch.clientY) 65412 }; 65413 }; 65414 return Cropper; 65415 }(external_React_.Component); 65416 65417 65418 65419 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/cropper.js 65420 /** 65421 * External dependencies 65422 */ 65423 65424 65425 65426 /** 65427 * WordPress dependencies 65428 */ 65429 65430 65431 65432 /** 65433 * Internal dependencies 65434 */ 65435 65436 65437 65438 65439 65440 function ImageCropper({ 65441 url, 65442 width, 65443 height, 65444 naturalHeight, 65445 naturalWidth, 65446 borderProps 65447 }) { 65448 const { 65449 isInProgress, 65450 editedUrl, 65451 position, 65452 zoom, 65453 aspect, 65454 setPosition, 65455 setCrop, 65456 setZoom, 65457 rotation 65458 } = useImageEditingContext(); 65459 const [contentResizeListener, { 65460 width: clientWidth 65461 }] = (0,external_wp_compose_namespaceObject.useResizeObserver)(); 65462 let editedHeight = height || clientWidth * naturalHeight / naturalWidth; 65463 if (rotation % 180 === 90) { 65464 editedHeight = clientWidth * naturalWidth / naturalHeight; 65465 } 65466 const area = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 65467 className: dist_clsx('wp-block-image__crop-area', borderProps?.className, { 65468 'is-applying': isInProgress 65469 }), 65470 style: { 65471 ...borderProps?.style, 65472 width: width || clientWidth, 65473 height: editedHeight 65474 }, 65475 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Cropper, { 65476 image: editedUrl || url, 65477 disabled: isInProgress, 65478 minZoom: MIN_ZOOM / 100, 65479 maxZoom: MAX_ZOOM / 100, 65480 crop: position, 65481 zoom: zoom / 100, 65482 aspect: aspect, 65483 onCropChange: pos => { 65484 setPosition(pos); 65485 }, 65486 onCropComplete: newCropPercent => { 65487 setCrop(newCropPercent); 65488 }, 65489 onZoomChange: newZoom => { 65490 setZoom(newZoom * 100); 65491 } 65492 }), isInProgress && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Spinner, {})] 65493 }); 65494 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 65495 children: [contentResizeListener, area] 65496 }); 65497 } 65498 65499 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/search.js 65500 /** 65501 * WordPress dependencies 65502 */ 65503 65504 65505 const search = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 65506 xmlns: "http://www.w3.org/2000/svg", 65507 viewBox: "0 0 24 24", 65508 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 65509 d: "M13 5c-3.3 0-6 2.7-6 6 0 1.4.5 2.7 1.3 3.7l-3.8 3.8 1.1 1.1 3.8-3.8c1 .8 2.3 1.3 3.7 1.3 3.3 0 6-2.7 6-6S16.3 5 13 5zm0 10.5c-2.5 0-4.5-2-4.5-4.5s2-4.5 4.5-4.5 4.5 2 4.5 4.5-2 4.5-4.5 4.5z" 65510 }) 65511 }); 65512 /* harmony default export */ const library_search = (search); 65513 65514 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/zoom-dropdown.js 65515 /** 65516 * WordPress dependencies 65517 */ 65518 65519 65520 65521 65522 /** 65523 * Internal dependencies 65524 */ 65525 65526 65527 65528 function ZoomDropdown() { 65529 const { 65530 isInProgress, 65531 zoom, 65532 setZoom 65533 } = useImageEditingContext(); 65534 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 65535 contentClassName: "wp-block-image__zoom", 65536 popoverProps: constants_POPOVER_PROPS, 65537 renderToggle: ({ 65538 isOpen, 65539 onToggle 65540 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 65541 icon: library_search, 65542 label: (0,external_wp_i18n_namespaceObject.__)('Zoom'), 65543 onClick: onToggle, 65544 "aria-expanded": isOpen, 65545 disabled: isInProgress 65546 }), 65547 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalDropdownContentWrapper, { 65548 paddingSize: "medium", 65549 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.RangeControl, { 65550 __next40pxDefaultSize: true, 65551 __nextHasNoMarginBottom: true, 65552 label: (0,external_wp_i18n_namespaceObject.__)('Zoom'), 65553 min: MIN_ZOOM, 65554 max: MAX_ZOOM, 65555 value: Math.round(zoom), 65556 onChange: setZoom 65557 }) 65558 }) 65559 }); 65560 } 65561 65562 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/rotate-right.js 65563 /** 65564 * WordPress dependencies 65565 */ 65566 65567 65568 const rotateRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 65569 xmlns: "http://www.w3.org/2000/svg", 65570 viewBox: "0 0 24 24", 65571 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 65572 d: "M15.1 4.8l-3-2.5V4c-4.4 0-8 3.6-8 8 0 3.7 2.5 6.9 6 7.7.3.1.6.1 1 .2l.2-1.5c-.4 0-.7-.1-1.1-.2l-.1.2v-.2c-2.6-.8-4.5-3.3-4.5-6.2 0-3.6 2.9-6.5 6.5-6.5v1.8l3-2.5zM20 11c-.2-1.4-.7-2.7-1.6-3.8l-1.2.8c.7.9 1.1 2 1.3 3.1L20 11zm-1.5 1.8c-.1.5-.2 1.1-.4 1.6s-.5 1-.8 1.5l1.2.9c.4-.5.8-1.1 1-1.8s.5-1.3.5-2l-1.5-.2zm-5.6 5.6l.2 1.5c1.4-.2 2.7-.7 3.8-1.6l-.9-1.1c-.9.7-2 1.1-3.1 1.2z" 65573 }) 65574 }); 65575 /* harmony default export */ const rotate_right = (rotateRight); 65576 65577 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/rotation-button.js 65578 /** 65579 * WordPress dependencies 65580 */ 65581 65582 65583 65584 65585 65586 /** 65587 * Internal dependencies 65588 */ 65589 65590 65591 function RotationButton() { 65592 const { 65593 isInProgress, 65594 rotateClockwise 65595 } = useImageEditingContext(); 65596 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 65597 icon: rotate_right, 65598 label: (0,external_wp_i18n_namespaceObject.__)('Rotate'), 65599 onClick: rotateClockwise, 65600 disabled: isInProgress 65601 }); 65602 } 65603 65604 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/form-controls.js 65605 /** 65606 * WordPress dependencies 65607 */ 65608 65609 65610 65611 /** 65612 * Internal dependencies 65613 */ 65614 65615 65616 65617 65618 function FormControls() { 65619 const { 65620 isInProgress, 65621 apply, 65622 cancel 65623 } = useImageEditingContext(); 65624 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 65625 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 65626 onClick: apply, 65627 disabled: isInProgress, 65628 children: (0,external_wp_i18n_namespaceObject.__)('Apply') 65629 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 65630 onClick: cancel, 65631 children: (0,external_wp_i18n_namespaceObject.__)('Cancel') 65632 })] 65633 }); 65634 } 65635 65636 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-editor/index.js 65637 /** 65638 * WordPress dependencies 65639 */ 65640 65641 65642 /** 65643 * Internal dependencies 65644 */ 65645 65646 65647 65648 65649 65650 65651 65652 65653 65654 function ImageEditor({ 65655 id, 65656 url, 65657 width, 65658 height, 65659 naturalHeight, 65660 naturalWidth, 65661 onSaveImage, 65662 onFinishEditing, 65663 borderProps 65664 }) { 65665 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ImageEditingProvider, { 65666 id: id, 65667 url: url, 65668 naturalWidth: naturalWidth, 65669 naturalHeight: naturalHeight, 65670 onSaveImage: onSaveImage, 65671 onFinishEditing: onFinishEditing, 65672 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ImageCropper, { 65673 borderProps: borderProps, 65674 url: url, 65675 width: width, 65676 height: height, 65677 naturalHeight: naturalHeight, 65678 naturalWidth: naturalWidth 65679 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(block_controls, { 65680 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.ToolbarGroup, { 65681 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ZoomDropdown, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarItem, { 65682 children: toggleProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AspectRatioDropdown, { 65683 toggleProps: toggleProps 65684 }) 65685 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RotationButton, {})] 65686 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 65687 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FormControls, {}) 65688 })] 65689 })] 65690 }); 65691 } 65692 65693 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-size-control/use-dimension-handler.js 65694 /** 65695 * WordPress dependencies 65696 */ 65697 65698 function useDimensionHandler(customHeight, customWidth, defaultHeight, defaultWidth, onChange) { 65699 var _ref, _ref2; 65700 const [currentWidth, setCurrentWidth] = (0,external_wp_element_namespaceObject.useState)((_ref = customWidth !== null && customWidth !== void 0 ? customWidth : defaultWidth) !== null && _ref !== void 0 ? _ref : ''); 65701 const [currentHeight, setCurrentHeight] = (0,external_wp_element_namespaceObject.useState)((_ref2 = customHeight !== null && customHeight !== void 0 ? customHeight : defaultHeight) !== null && _ref2 !== void 0 ? _ref2 : ''); 65702 65703 // When an image is first inserted, the default dimensions are initially 65704 // undefined. This effect updates the dimensions when the default values 65705 // come through. 65706 (0,external_wp_element_namespaceObject.useEffect)(() => { 65707 if (customWidth === undefined && defaultWidth !== undefined) { 65708 setCurrentWidth(defaultWidth); 65709 } 65710 if (customHeight === undefined && defaultHeight !== undefined) { 65711 setCurrentHeight(defaultHeight); 65712 } 65713 }, [defaultWidth, defaultHeight]); 65714 65715 // If custom values change, it means an outsider has resized the image using some other method (eg resize box) 65716 // this keeps track of these values too. We need to parse before comparing; custom values can be strings. 65717 (0,external_wp_element_namespaceObject.useEffect)(() => { 65718 if (customWidth !== undefined && Number.parseInt(customWidth) !== Number.parseInt(currentWidth)) { 65719 setCurrentWidth(customWidth); 65720 } 65721 if (customHeight !== undefined && Number.parseInt(customHeight) !== Number.parseInt(currentHeight)) { 65722 setCurrentHeight(customHeight); 65723 } 65724 }, [customWidth, customHeight]); 65725 const updateDimension = (dimension, value) => { 65726 const parsedValue = value === '' ? undefined : parseInt(value, 10); 65727 if (dimension === 'width') { 65728 setCurrentWidth(parsedValue); 65729 } else { 65730 setCurrentHeight(parsedValue); 65731 } 65732 onChange({ 65733 [dimension]: parsedValue 65734 }); 65735 }; 65736 const updateDimensions = (nextHeight, nextWidth) => { 65737 setCurrentHeight(nextHeight !== null && nextHeight !== void 0 ? nextHeight : defaultHeight); 65738 setCurrentWidth(nextWidth !== null && nextWidth !== void 0 ? nextWidth : defaultWidth); 65739 onChange({ 65740 height: nextHeight, 65741 width: nextWidth 65742 }); 65743 }; 65744 return { 65745 currentHeight, 65746 currentWidth, 65747 updateDimension, 65748 updateDimensions 65749 }; 65750 } 65751 65752 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/image-size-control/index.js 65753 /** 65754 * WordPress dependencies 65755 */ 65756 65757 65758 65759 /** 65760 * Internal dependencies 65761 */ 65762 65763 65764 65765 65766 const IMAGE_SIZE_PRESETS = [25, 50, 75, 100]; 65767 const image_size_control_noop = () => {}; 65768 function ImageSizeControl({ 65769 imageSizeHelp, 65770 imageWidth, 65771 imageHeight, 65772 imageSizeOptions = [], 65773 isResizable = true, 65774 slug, 65775 width, 65776 height, 65777 onChange, 65778 onChangeImage = image_size_control_noop 65779 }) { 65780 const { 65781 currentHeight, 65782 currentWidth, 65783 updateDimension, 65784 updateDimensions 65785 } = useDimensionHandler(height, width, imageHeight, imageWidth, onChange); 65786 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 65787 children: [imageSizeOptions && imageSizeOptions.length > 0 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SelectControl, { 65788 __nextHasNoMarginBottom: true, 65789 label: (0,external_wp_i18n_namespaceObject.__)('Resolution'), 65790 value: slug, 65791 options: imageSizeOptions, 65792 onChange: onChangeImage, 65793 help: imageSizeHelp, 65794 size: "__unstable-large" 65795 }), isResizable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 65796 className: "block-editor-image-size-control", 65797 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 65798 align: "baseline", 65799 spacing: "3", 65800 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNumberControl, { 65801 className: "block-editor-image-size-control__width", 65802 label: (0,external_wp_i18n_namespaceObject.__)('Width'), 65803 value: currentWidth, 65804 min: 1, 65805 onChange: value => updateDimension('width', value), 65806 size: "__unstable-large" 65807 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNumberControl, { 65808 className: "block-editor-image-size-control__height", 65809 label: (0,external_wp_i18n_namespaceObject.__)('Height'), 65810 value: currentHeight, 65811 min: 1, 65812 onChange: value => updateDimension('height', value), 65813 size: "__unstable-large" 65814 })] 65815 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 65816 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ButtonGroup, { 65817 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Image size presets'), 65818 children: IMAGE_SIZE_PRESETS.map(scale => { 65819 const scaledWidth = Math.round(imageWidth * (scale / 100)); 65820 const scaledHeight = Math.round(imageHeight * (scale / 100)); 65821 const isCurrent = currentWidth === scaledWidth && currentHeight === scaledHeight; 65822 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Button, { 65823 size: "small", 65824 variant: isCurrent ? 'primary' : undefined, 65825 isPressed: isCurrent, 65826 onClick: () => updateDimensions(scaledHeight, scaledWidth), 65827 children: [scale, "%"] 65828 }, scale); 65829 }) 65830 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 65831 size: "small", 65832 onClick: () => updateDimensions(), 65833 children: (0,external_wp_i18n_namespaceObject.__)('Reset') 65834 })] 65835 })] 65836 })] 65837 }); 65838 } 65839 65840 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/url-popover/link-viewer-url.js 65841 /** 65842 * External dependencies 65843 */ 65844 65845 65846 /** 65847 * WordPress dependencies 65848 */ 65849 65850 65851 65852 function LinkViewerURL({ 65853 url, 65854 urlLabel, 65855 className 65856 }) { 65857 const linkClassName = dist_clsx(className, 'block-editor-url-popover__link-viewer-url'); 65858 if (!url) { 65859 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 65860 className: linkClassName 65861 }); 65862 } 65863 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ExternalLink, { 65864 className: linkClassName, 65865 href: url, 65866 children: urlLabel || (0,external_wp_url_namespaceObject.filterURLForDisplay)((0,external_wp_url_namespaceObject.safeDecodeURI)(url)) 65867 }); 65868 } 65869 65870 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/url-popover/link-viewer.js 65871 /** 65872 * External dependencies 65873 */ 65874 65875 65876 /** 65877 * WordPress dependencies 65878 */ 65879 65880 65881 65882 65883 /** 65884 * Internal dependencies 65885 */ 65886 65887 65888 65889 function LinkViewer({ 65890 className, 65891 linkClassName, 65892 onEditLinkClick, 65893 url, 65894 urlLabel, 65895 ...props 65896 }) { 65897 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 65898 className: dist_clsx('block-editor-url-popover__link-viewer', className), 65899 ...props, 65900 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LinkViewerURL, { 65901 url: url, 65902 urlLabel: urlLabel, 65903 className: linkClassName 65904 }), onEditLinkClick && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 65905 icon: edit, 65906 label: (0,external_wp_i18n_namespaceObject.__)('Edit'), 65907 onClick: onEditLinkClick, 65908 size: "compact" 65909 })] 65910 }); 65911 } 65912 65913 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/url-popover/link-editor.js 65914 /** 65915 * External dependencies 65916 */ 65917 65918 65919 /** 65920 * WordPress dependencies 65921 */ 65922 65923 65924 65925 65926 /** 65927 * Internal dependencies 65928 */ 65929 65930 65931 65932 function LinkEditor({ 65933 autocompleteRef, 65934 className, 65935 onChangeInputValue, 65936 value, 65937 ...props 65938 }) { 65939 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("form", { 65940 className: dist_clsx('block-editor-url-popover__link-editor', className), 65941 ...props, 65942 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(url_input, { 65943 value: value, 65944 onChange: onChangeInputValue, 65945 autocompleteRef: autocompleteRef 65946 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 65947 icon: keyboard_return, 65948 label: (0,external_wp_i18n_namespaceObject.__)('Apply'), 65949 type: "submit", 65950 size: "compact" 65951 })] 65952 }); 65953 } 65954 65955 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/url-popover/index.js 65956 /** 65957 * WordPress dependencies 65958 */ 65959 65960 65961 65962 65963 65964 65965 /** 65966 * Internal dependencies 65967 */ 65968 65969 65970 65971 65972 65973 const { 65974 __experimentalPopoverLegacyPositionToPlacement 65975 } = unlock(external_wp_components_namespaceObject.privateApis); 65976 const DEFAULT_PLACEMENT = 'bottom'; 65977 const URLPopover = (0,external_wp_element_namespaceObject.forwardRef)(({ 65978 additionalControls, 65979 children, 65980 renderSettings, 65981 // The DEFAULT_PLACEMENT value is assigned inside the function's body 65982 placement, 65983 focusOnMount = 'firstElement', 65984 // Deprecated 65985 position, 65986 // Rest 65987 ...popoverProps 65988 }, ref) => { 65989 if (position !== undefined) { 65990 external_wp_deprecated_default()('`position` prop in wp.blockEditor.URLPopover', { 65991 since: '6.2', 65992 alternative: '`placement` prop' 65993 }); 65994 } 65995 65996 // Compute popover's placement: 65997 // - give priority to `placement` prop, if defined 65998 // - otherwise, compute it from the legacy `position` prop (if defined) 65999 // - finally, fallback to the DEFAULT_PLACEMENT. 66000 let computedPlacement; 66001 if (placement !== undefined) { 66002 computedPlacement = placement; 66003 } else if (position !== undefined) { 66004 computedPlacement = __experimentalPopoverLegacyPositionToPlacement(position); 66005 } 66006 computedPlacement = computedPlacement || DEFAULT_PLACEMENT; 66007 const [isSettingsExpanded, setIsSettingsExpanded] = (0,external_wp_element_namespaceObject.useState)(false); 66008 const showSettings = !!renderSettings && isSettingsExpanded; 66009 const toggleSettingsVisibility = () => { 66010 setIsSettingsExpanded(!isSettingsExpanded); 66011 }; 66012 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Popover, { 66013 ref: ref, 66014 role: "dialog", 66015 "aria-modal": "true", 66016 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Edit URL'), 66017 className: "block-editor-url-popover", 66018 focusOnMount: focusOnMount, 66019 placement: computedPlacement, 66020 shift: true, 66021 variant: "toolbar", 66022 ...popoverProps, 66023 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 66024 className: "block-editor-url-popover__input-container", 66025 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 66026 className: "block-editor-url-popover__row", 66027 children: [children, !!renderSettings && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 66028 className: "block-editor-url-popover__settings-toggle", 66029 icon: chevron_down, 66030 label: (0,external_wp_i18n_namespaceObject.__)('Link settings'), 66031 onClick: toggleSettingsVisibility, 66032 "aria-expanded": isSettingsExpanded, 66033 size: "compact" 66034 })] 66035 }) 66036 }), showSettings && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 66037 className: "block-editor-url-popover__settings", 66038 children: renderSettings() 66039 }), additionalControls && !showSettings && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 66040 className: "block-editor-url-popover__additional-controls", 66041 children: additionalControls 66042 })] 66043 }); 66044 }); 66045 URLPopover.LinkEditor = LinkEditor; 66046 URLPopover.LinkViewer = LinkViewer; 66047 66048 /** 66049 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/url-popover/README.md 66050 */ 66051 /* harmony default export */ const url_popover = (URLPopover); 66052 66053 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/media-placeholder/index.js 66054 /** 66055 * External dependencies 66056 */ 66057 66058 66059 /** 66060 * WordPress dependencies 66061 */ 66062 66063 66064 66065 66066 66067 66068 66069 66070 /** 66071 * Internal dependencies 66072 */ 66073 66074 66075 66076 66077 66078 66079 66080 const media_placeholder_noop = () => {}; 66081 const InsertFromURLPopover = ({ 66082 src, 66083 onChange, 66084 onSubmit, 66085 onClose, 66086 popoverAnchor 66087 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(url_popover, { 66088 anchor: popoverAnchor, 66089 onClose: onClose, 66090 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("form", { 66091 className: "block-editor-media-placeholder__url-input-form", 66092 onSubmit: onSubmit, 66093 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControl, { 66094 __next40pxDefaultSize: true, 66095 label: (0,external_wp_i18n_namespaceObject.__)('URL'), 66096 hideLabelFromVision: true, 66097 placeholder: (0,external_wp_i18n_namespaceObject.__)('Paste or type URL'), 66098 onChange: onChange, 66099 value: src, 66100 suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControlSuffixWrapper, { 66101 variant: "control", 66102 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 66103 size: "small", 66104 icon: keyboard_return, 66105 label: (0,external_wp_i18n_namespaceObject.__)('Apply'), 66106 type: "submit" 66107 }) 66108 }) 66109 }) 66110 }) 66111 }); 66112 const URLSelectionUI = ({ 66113 src, 66114 onChangeSrc, 66115 onSelectURL 66116 }) => { 66117 // Use internal state instead of a ref to make sure that the component 66118 // re-renders when the popover's anchor updates. 66119 const [popoverAnchor, setPopoverAnchor] = (0,external_wp_element_namespaceObject.useState)(null); 66120 const [isURLInputVisible, setIsURLInputVisible] = (0,external_wp_element_namespaceObject.useState)(false); 66121 const openURLInput = () => { 66122 setIsURLInputVisible(true); 66123 }; 66124 const closeURLInput = () => { 66125 setIsURLInputVisible(false); 66126 popoverAnchor?.focus(); 66127 }; 66128 const onSubmitSrc = event => { 66129 event.preventDefault(); 66130 if (src && onSelectURL) { 66131 onSelectURL(src); 66132 closeURLInput(); 66133 } 66134 }; 66135 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 66136 className: "block-editor-media-placeholder__url-input-container", 66137 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 66138 __next40pxDefaultSize: true, 66139 className: "block-editor-media-placeholder__button", 66140 onClick: openURLInput, 66141 isPressed: isURLInputVisible, 66142 variant: "secondary", 66143 "aria-haspopup": "dialog", 66144 ref: setPopoverAnchor, 66145 children: (0,external_wp_i18n_namespaceObject.__)('Insert from URL') 66146 }), isURLInputVisible && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InsertFromURLPopover, { 66147 src: src, 66148 onChange: onChangeSrc, 66149 onSubmit: onSubmitSrc, 66150 onClose: closeURLInput, 66151 popoverAnchor: popoverAnchor 66152 })] 66153 }); 66154 }; 66155 function MediaPlaceholder({ 66156 value = {}, 66157 allowedTypes, 66158 className, 66159 icon, 66160 labels = {}, 66161 mediaPreview, 66162 notices, 66163 isAppender, 66164 accept, 66165 addToGallery, 66166 multiple = false, 66167 handleUpload = true, 66168 disableDropZone, 66169 disableMediaButtons, 66170 onError, 66171 onSelect, 66172 onCancel, 66173 onSelectURL, 66174 onToggleFeaturedImage, 66175 onDoubleClick, 66176 onFilesPreUpload = media_placeholder_noop, 66177 onHTMLDrop: deprecatedOnHTMLDrop, 66178 children, 66179 mediaLibraryButton, 66180 placeholder, 66181 style 66182 }) { 66183 if (deprecatedOnHTMLDrop) { 66184 external_wp_deprecated_default()('wp.blockEditor.MediaPlaceholder onHTMLDrop prop', { 66185 since: '6.2', 66186 version: '6.4' 66187 }); 66188 } 66189 const mediaUpload = (0,external_wp_data_namespaceObject.useSelect)(select => { 66190 const { 66191 getSettings 66192 } = select(store); 66193 return getSettings().mediaUpload; 66194 }, []); 66195 const [src, setSrc] = (0,external_wp_element_namespaceObject.useState)(''); 66196 (0,external_wp_element_namespaceObject.useEffect)(() => { 66197 var _value$src; 66198 setSrc((_value$src = value?.src) !== null && _value$src !== void 0 ? _value$src : ''); 66199 }, [value?.src]); 66200 const onlyAllowsImages = () => { 66201 if (!allowedTypes || allowedTypes.length === 0) { 66202 return false; 66203 } 66204 return allowedTypes.every(allowedType => allowedType === 'image' || allowedType.startsWith('image/')); 66205 }; 66206 const onFilesUpload = files => { 66207 if (!handleUpload || typeof handleUpload === 'function' && !handleUpload(files)) { 66208 return onSelect(files); 66209 } 66210 onFilesPreUpload(files); 66211 let setMedia; 66212 if (multiple) { 66213 if (addToGallery) { 66214 // Since the setMedia function runs multiple times per upload group 66215 // and is passed newMedia containing every item in its group each time, we must 66216 // filter out whatever this upload group had previously returned to the 66217 // gallery before adding and returning the image array with replacement newMedia 66218 // values. 66219 66220 // Define an array to store urls from newMedia between subsequent function calls. 66221 let lastMediaPassed = []; 66222 setMedia = newMedia => { 66223 // Remove any images this upload group is responsible for (lastMediaPassed). 66224 // Their replacements are contained in newMedia. 66225 const filteredMedia = (value !== null && value !== void 0 ? value : []).filter(item => { 66226 // If Item has id, only remove it if lastMediaPassed has an item with that id. 66227 if (item.id) { 66228 return !lastMediaPassed.some( 66229 // Be sure to convert to number for comparison. 66230 ({ 66231 id 66232 }) => Number(id) === Number(item.id)); 66233 } 66234 // Compare transient images via .includes since gallery may append extra info onto the url. 66235 return !lastMediaPassed.some(({ 66236 urlSlug 66237 }) => item.url.includes(urlSlug)); 66238 }); 66239 // Return the filtered media array along with newMedia. 66240 onSelect(filteredMedia.concat(newMedia)); 66241 // Reset lastMediaPassed and set it with ids and urls from newMedia. 66242 lastMediaPassed = newMedia.map(media => { 66243 // Add everything up to '.fileType' to compare via .includes. 66244 const cutOffIndex = media.url.lastIndexOf('.'); 66245 const urlSlug = media.url.slice(0, cutOffIndex); 66246 return { 66247 id: media.id, 66248 urlSlug 66249 }; 66250 }); 66251 }; 66252 } else { 66253 setMedia = onSelect; 66254 } 66255 } else { 66256 setMedia = ([media]) => onSelect(media); 66257 } 66258 mediaUpload({ 66259 allowedTypes, 66260 filesList: files, 66261 onFileChange: setMedia, 66262 onError 66263 }); 66264 }; 66265 async function handleBlocksDrop(blocks) { 66266 if (!blocks || !Array.isArray(blocks)) { 66267 return; 66268 } 66269 function recursivelyFindMediaFromBlocks(_blocks) { 66270 return _blocks.flatMap(block => (block.name === 'core/image' || block.name === 'core/audio' || block.name === 'core/video') && block.attributes.url ? [block] : recursivelyFindMediaFromBlocks(block.innerBlocks)); 66271 } 66272 const mediaBlocks = recursivelyFindMediaFromBlocks(blocks); 66273 if (!mediaBlocks.length) { 66274 return; 66275 } 66276 const uploadedMediaList = await Promise.all(mediaBlocks.map(block => block.attributes.id ? block.attributes : new Promise((resolve, reject) => { 66277 window.fetch(block.attributes.url).then(response => response.blob()).then(blob => mediaUpload({ 66278 filesList: [blob], 66279 additionalData: { 66280 title: block.attributes.title, 66281 alt_text: block.attributes.alt, 66282 caption: block.attributes.caption 66283 }, 66284 onFileChange: ([media]) => { 66285 if (media.id) { 66286 resolve(media); 66287 } 66288 }, 66289 allowedTypes, 66290 onError: reject 66291 })).catch(() => resolve(block.attributes.url)); 66292 }))).catch(err => onError(err)); 66293 if (multiple) { 66294 onSelect(uploadedMediaList); 66295 } else { 66296 onSelect(uploadedMediaList[0]); 66297 } 66298 } 66299 async function onHTMLDrop(HTML) { 66300 const blocks = (0,external_wp_blocks_namespaceObject.pasteHandler)({ 66301 HTML 66302 }); 66303 return await handleBlocksDrop(blocks); 66304 } 66305 const onUpload = event => { 66306 onFilesUpload(event.target.files); 66307 }; 66308 const defaultRenderPlaceholder = content => { 66309 let { 66310 instructions, 66311 title 66312 } = labels; 66313 if (!mediaUpload && !onSelectURL) { 66314 instructions = (0,external_wp_i18n_namespaceObject.__)('To edit this block, you need permission to upload media.'); 66315 } 66316 if (instructions === undefined || title === undefined) { 66317 const typesAllowed = allowedTypes !== null && allowedTypes !== void 0 ? allowedTypes : []; 66318 const [firstAllowedType] = typesAllowed; 66319 const isOneType = 1 === typesAllowed.length; 66320 const isAudio = isOneType && 'audio' === firstAllowedType; 66321 const isImage = isOneType && 'image' === firstAllowedType; 66322 const isVideo = isOneType && 'video' === firstAllowedType; 66323 if (instructions === undefined && mediaUpload) { 66324 instructions = (0,external_wp_i18n_namespaceObject.__)('Upload a media file or pick one from your media library.'); 66325 if (isAudio) { 66326 instructions = (0,external_wp_i18n_namespaceObject.__)('Upload or drag an audio file here, or pick one from your library.'); 66327 } else if (isImage) { 66328 instructions = (0,external_wp_i18n_namespaceObject.__)('Upload or drag an image file here, or pick one from your library.'); 66329 } else if (isVideo) { 66330 instructions = (0,external_wp_i18n_namespaceObject.__)('Upload or drag a video file here, or pick one from your library.'); 66331 } 66332 } 66333 if (title === undefined) { 66334 title = (0,external_wp_i18n_namespaceObject.__)('Media'); 66335 if (isAudio) { 66336 title = (0,external_wp_i18n_namespaceObject.__)('Audio'); 66337 } else if (isImage) { 66338 title = (0,external_wp_i18n_namespaceObject.__)('Image'); 66339 } else if (isVideo) { 66340 title = (0,external_wp_i18n_namespaceObject.__)('Video'); 66341 } 66342 } 66343 } 66344 const placeholderClassName = dist_clsx('block-editor-media-placeholder', className, { 66345 'is-appender': isAppender 66346 }); 66347 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Placeholder, { 66348 icon: icon, 66349 label: title, 66350 instructions: instructions, 66351 className: placeholderClassName, 66352 notices: notices, 66353 onDoubleClick: onDoubleClick, 66354 preview: mediaPreview, 66355 style: style, 66356 children: [content, children] 66357 }); 66358 }; 66359 const renderPlaceholder = placeholder !== null && placeholder !== void 0 ? placeholder : defaultRenderPlaceholder; 66360 const renderDropZone = () => { 66361 if (disableDropZone) { 66362 return null; 66363 } 66364 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropZone, { 66365 onFilesDrop: onFilesUpload, 66366 onHTMLDrop: onHTMLDrop 66367 }); 66368 }; 66369 const renderCancelLink = () => { 66370 return onCancel && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 66371 __next40pxDefaultSize: true, 66372 className: "block-editor-media-placeholder__cancel-button", 66373 title: (0,external_wp_i18n_namespaceObject.__)('Cancel'), 66374 variant: "link", 66375 onClick: onCancel, 66376 children: (0,external_wp_i18n_namespaceObject.__)('Cancel') 66377 }); 66378 }; 66379 const renderUrlSelectionUI = () => { 66380 return onSelectURL && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(URLSelectionUI, { 66381 src: src, 66382 onChangeSrc: setSrc, 66383 onSelectURL: onSelectURL 66384 }); 66385 }; 66386 const renderFeaturedImageToggle = () => { 66387 return onToggleFeaturedImage && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 66388 className: "block-editor-media-placeholder__url-input-container", 66389 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 66390 __next40pxDefaultSize: true, 66391 className: "block-editor-media-placeholder__button", 66392 onClick: onToggleFeaturedImage, 66393 variant: "secondary", 66394 children: (0,external_wp_i18n_namespaceObject.__)('Use featured image') 66395 }) 66396 }); 66397 }; 66398 const renderMediaUploadChecked = () => { 66399 const defaultButton = ({ 66400 open 66401 }) => { 66402 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 66403 __next40pxDefaultSize: true, 66404 variant: "secondary", 66405 onClick: () => { 66406 open(); 66407 }, 66408 children: (0,external_wp_i18n_namespaceObject.__)('Media Library') 66409 }); 66410 }; 66411 const libraryButton = mediaLibraryButton !== null && mediaLibraryButton !== void 0 ? mediaLibraryButton : defaultButton; 66412 const uploadMediaLibraryButton = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(media_upload, { 66413 addToGallery: addToGallery, 66414 gallery: multiple && onlyAllowsImages(), 66415 multiple: multiple, 66416 onSelect: onSelect, 66417 allowedTypes: allowedTypes, 66418 mode: "browse", 66419 value: Array.isArray(value) ? value.map(({ 66420 id 66421 }) => id) : value.id, 66422 render: libraryButton 66423 }); 66424 if (mediaUpload && isAppender) { 66425 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 66426 children: [renderDropZone(), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FormFileUpload, { 66427 onChange: onUpload, 66428 accept: accept, 66429 multiple: !!multiple, 66430 render: ({ 66431 openFileDialog 66432 }) => { 66433 const content = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 66434 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 66435 __next40pxDefaultSize: true, 66436 variant: "primary", 66437 className: dist_clsx('block-editor-media-placeholder__button', 'block-editor-media-placeholder__upload-button'), 66438 onClick: openFileDialog, 66439 children: (0,external_wp_i18n_namespaceObject.__)('Upload') 66440 }), uploadMediaLibraryButton, renderUrlSelectionUI(), renderFeaturedImageToggle(), renderCancelLink()] 66441 }); 66442 return renderPlaceholder(content); 66443 } 66444 })] 66445 }); 66446 } 66447 if (mediaUpload) { 66448 const content = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 66449 children: [renderDropZone(), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FormFileUpload, { 66450 render: ({ 66451 openFileDialog 66452 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 66453 __next40pxDefaultSize: true, 66454 onClick: openFileDialog, 66455 variant: "primary", 66456 className: dist_clsx('block-editor-media-placeholder__button', 'block-editor-media-placeholder__upload-button'), 66457 children: (0,external_wp_i18n_namespaceObject.__)('Upload') 66458 }), 66459 onChange: onUpload, 66460 accept: accept, 66461 multiple: !!multiple 66462 }), uploadMediaLibraryButton, renderUrlSelectionUI(), renderFeaturedImageToggle(), renderCancelLink()] 66463 }); 66464 return renderPlaceholder(content); 66465 } 66466 return renderPlaceholder(uploadMediaLibraryButton); 66467 }; 66468 if (disableMediaButtons) { 66469 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(check, { 66470 children: renderDropZone() 66471 }); 66472 } 66473 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(check, { 66474 fallback: renderPlaceholder(renderUrlSelectionUI()), 66475 children: renderMediaUploadChecked() 66476 }); 66477 } 66478 66479 /** 66480 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/media-placeholder/README.md 66481 */ 66482 /* harmony default export */ const media_placeholder = ((0,external_wp_components_namespaceObject.withFilters)('editor.MediaPlaceholder')(MediaPlaceholder)); 66483 66484 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/panel-color-settings/index.js 66485 /** 66486 * Internal dependencies 66487 */ 66488 66489 66490 const PanelColorSettings = ({ 66491 colorSettings, 66492 ...props 66493 }) => { 66494 const settings = colorSettings.map(setting => { 66495 if (!setting) { 66496 return setting; 66497 } 66498 const { 66499 value, 66500 onChange, 66501 ...otherSettings 66502 } = setting; 66503 return { 66504 ...otherSettings, 66505 colorValue: value, 66506 onColorChange: onChange 66507 }; 66508 }); 66509 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(panel_color_gradient_settings, { 66510 settings: settings, 66511 gradients: [], 66512 disableCustomGradients: true, 66513 ...props 66514 }); 66515 }; 66516 /* harmony default export */ const panel_color_settings = (PanelColorSettings); 66517 66518 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/format-toolbar/index.js 66519 /** 66520 * External dependencies 66521 */ 66522 66523 66524 /** 66525 * WordPress dependencies 66526 */ 66527 66528 66529 66530 66531 /** 66532 * Internal dependencies 66533 */ 66534 66535 66536 66537 66538 const format_toolbar_POPOVER_PROPS = { 66539 placement: 'bottom-start' 66540 }; 66541 const FormatToolbar = () => { 66542 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 66543 children: [['bold', 'italic', 'link', 'unknown'].map(format => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Slot, { 66544 name: `RichText.ToolbarControls.$format}` 66545 }, format)), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Slot, { 66546 name: "RichText.ToolbarControls", 66547 children: fills => { 66548 if (!fills.length) { 66549 return null; 66550 } 66551 const allProps = fills.map(([{ 66552 props 66553 }]) => props); 66554 const hasActive = allProps.some(({ 66555 isActive 66556 }) => isActive); 66557 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarItem, { 66558 children: toggleProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.DropdownMenu, { 66559 icon: chevron_down 66560 /* translators: button label text should, if possible, be under 16 characters. */, 66561 label: (0,external_wp_i18n_namespaceObject.__)('More'), 66562 toggleProps: { 66563 ...toggleProps, 66564 className: dist_clsx(toggleProps.className, { 66565 'is-pressed': hasActive 66566 }), 66567 description: (0,external_wp_i18n_namespaceObject.__)('Displays more block tools') 66568 }, 66569 controls: orderBy(fills.map(([{ 66570 props 66571 }]) => props), 'title'), 66572 popoverProps: format_toolbar_POPOVER_PROPS 66573 }) 66574 }); 66575 } 66576 })] 66577 }); 66578 }; 66579 /* harmony default export */ const format_toolbar = (FormatToolbar); 66580 66581 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/format-toolbar-container.js 66582 /** 66583 * WordPress dependencies 66584 */ 66585 66586 66587 66588 /** 66589 * Internal dependencies 66590 */ 66591 66592 66593 66594 66595 function InlineToolbar({ 66596 popoverAnchor 66597 }) { 66598 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, { 66599 placement: "top", 66600 focusOnMount: false, 66601 anchor: popoverAnchor, 66602 className: "block-editor-rich-text__inline-format-toolbar", 66603 __unstableSlotName: "block-toolbar", 66604 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigableToolbar, { 66605 className: "block-editor-rich-text__inline-format-toolbar-group" 66606 /* translators: accessibility text for the inline format toolbar */, 66607 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Format tools'), 66608 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarGroup, { 66609 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(format_toolbar, {}) 66610 }) 66611 }) 66612 }); 66613 } 66614 const FormatToolbarContainer = ({ 66615 inline, 66616 editableContentElement 66617 }) => { 66618 if (inline) { 66619 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InlineToolbar, { 66620 popoverAnchor: editableContentElement 66621 }); 66622 } 66623 66624 // Render regular toolbar. 66625 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_controls, { 66626 group: "inline", 66627 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(format_toolbar, {}) 66628 }); 66629 }; 66630 /* harmony default export */ const format_toolbar_container = (FormatToolbarContainer); 66631 66632 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/use-mark-persistent.js 66633 /** 66634 * WordPress dependencies 66635 */ 66636 66637 66638 66639 /** 66640 * Internal dependencies 66641 */ 66642 66643 function useMarkPersistent({ 66644 html, 66645 value 66646 }) { 66647 const previousTextRef = (0,external_wp_element_namespaceObject.useRef)(); 66648 const hasActiveFormats = !!value.activeFormats?.length; 66649 const { 66650 __unstableMarkLastChangeAsPersistent 66651 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 66652 66653 // Must be set synchronously to make sure it applies to the last change. 66654 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 66655 // Ignore mount. 66656 if (!previousTextRef.current) { 66657 previousTextRef.current = value.text; 66658 return; 66659 } 66660 66661 // Text input, so don't create an undo level for every character. 66662 // Create an undo level after 1 second of no input. 66663 if (previousTextRef.current !== value.text) { 66664 const timeout = window.setTimeout(() => { 66665 __unstableMarkLastChangeAsPersistent(); 66666 }, 1000); 66667 previousTextRef.current = value.text; 66668 return () => { 66669 window.clearTimeout(timeout); 66670 }; 66671 } 66672 __unstableMarkLastChangeAsPersistent(); 66673 }, [html, hasActiveFormats]); 66674 } 66675 66676 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/use-format-types.js 66677 /** 66678 * WordPress dependencies 66679 */ 66680 66681 66682 66683 function formatTypesSelector(select) { 66684 return select(external_wp_richText_namespaceObject.store).getFormatTypes(); 66685 } 66686 66687 /** 66688 * Set of all interactive content tags. 66689 * 66690 * @see https://html.spec.whatwg.org/multipage/dom.html#interactive-content 66691 */ 66692 const interactiveContentTags = new Set(['a', 'audio', 'button', 'details', 'embed', 'iframe', 'input', 'label', 'select', 'textarea', 'video']); 66693 function prefixSelectKeys(selected, prefix) { 66694 if (typeof selected !== 'object') { 66695 return { 66696 [prefix]: selected 66697 }; 66698 } 66699 return Object.fromEntries(Object.entries(selected).map(([key, value]) => [`$prefix}.$key}`, value])); 66700 } 66701 function getPrefixedSelectKeys(selected, prefix) { 66702 if (selected[prefix]) { 66703 return selected[prefix]; 66704 } 66705 return Object.keys(selected).filter(key => key.startsWith(prefix + '.')).reduce((accumulator, key) => { 66706 accumulator[key.slice(prefix.length + 1)] = selected[key]; 66707 return accumulator; 66708 }, {}); 66709 } 66710 66711 /** 66712 * This hook provides RichText with the `formatTypes` and its derived props from 66713 * experimental format type settings. 66714 * 66715 * @param {Object} $0 Options 66716 * @param {string} $0.clientId Block client ID. 66717 * @param {string} $0.identifier Block attribute. 66718 * @param {boolean} $0.withoutInteractiveFormatting Whether to clean the interactive formattings or not. 66719 * @param {Array} $0.allowedFormats Allowed formats 66720 */ 66721 function useFormatTypes({ 66722 clientId, 66723 identifier, 66724 withoutInteractiveFormatting, 66725 allowedFormats 66726 }) { 66727 const allFormatTypes = (0,external_wp_data_namespaceObject.useSelect)(formatTypesSelector, []); 66728 const formatTypes = (0,external_wp_element_namespaceObject.useMemo)(() => { 66729 return allFormatTypes.filter(({ 66730 name, 66731 interactive, 66732 tagName 66733 }) => { 66734 if (allowedFormats && !allowedFormats.includes(name)) { 66735 return false; 66736 } 66737 if (withoutInteractiveFormatting && (interactive || interactiveContentTags.has(tagName))) { 66738 return false; 66739 } 66740 return true; 66741 }); 66742 }, [allFormatTypes, allowedFormats, withoutInteractiveFormatting]); 66743 const keyedSelected = (0,external_wp_data_namespaceObject.useSelect)(select => formatTypes.reduce((accumulator, type) => { 66744 if (!type.__experimentalGetPropsForEditableTreePreparation) { 66745 return accumulator; 66746 } 66747 return { 66748 ...accumulator, 66749 ...prefixSelectKeys(type.__experimentalGetPropsForEditableTreePreparation(select, { 66750 richTextIdentifier: identifier, 66751 blockClientId: clientId 66752 }), type.name) 66753 }; 66754 }, {}), [formatTypes, clientId, identifier]); 66755 const dispatch = (0,external_wp_data_namespaceObject.useDispatch)(); 66756 const prepareHandlers = []; 66757 const valueHandlers = []; 66758 const changeHandlers = []; 66759 const dependencies = []; 66760 for (const key in keyedSelected) { 66761 dependencies.push(keyedSelected[key]); 66762 } 66763 formatTypes.forEach(type => { 66764 if (type.__experimentalCreatePrepareEditableTree) { 66765 const handler = type.__experimentalCreatePrepareEditableTree(getPrefixedSelectKeys(keyedSelected, type.name), { 66766 richTextIdentifier: identifier, 66767 blockClientId: clientId 66768 }); 66769 if (type.__experimentalCreateOnChangeEditableValue) { 66770 valueHandlers.push(handler); 66771 } else { 66772 prepareHandlers.push(handler); 66773 } 66774 } 66775 if (type.__experimentalCreateOnChangeEditableValue) { 66776 let dispatchers = {}; 66777 if (type.__experimentalGetPropsForEditableTreeChangeHandler) { 66778 dispatchers = type.__experimentalGetPropsForEditableTreeChangeHandler(dispatch, { 66779 richTextIdentifier: identifier, 66780 blockClientId: clientId 66781 }); 66782 } 66783 const selected = getPrefixedSelectKeys(keyedSelected, type.name); 66784 changeHandlers.push(type.__experimentalCreateOnChangeEditableValue({ 66785 ...(typeof selected === 'object' ? selected : {}), 66786 ...dispatchers 66787 }, { 66788 richTextIdentifier: identifier, 66789 blockClientId: clientId 66790 })); 66791 } 66792 }); 66793 return { 66794 formatTypes, 66795 prepareHandlers, 66796 valueHandlers, 66797 changeHandlers, 66798 dependencies 66799 }; 66800 } 66801 66802 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/before-input-rules.js 66803 /** 66804 * WordPress dependencies 66805 */ 66806 66807 66808 66809 /** 66810 * Internal dependencies 66811 */ 66812 66813 66814 /** 66815 * When typing over a selection, the selection will we wrapped by a matching 66816 * character pair. The second character is optional, it defaults to the first 66817 * character. 66818 * 66819 * @type {string[]} Array of character pairs. 66820 */ 66821 const wrapSelectionSettings = ['`', '"', "'", '“”', '‘’']; 66822 /* harmony default export */ const before_input_rules = (props => element => { 66823 function onInput(event) { 66824 const { 66825 inputType, 66826 data 66827 } = event; 66828 const { 66829 value, 66830 onChange, 66831 registry 66832 } = props.current; 66833 66834 // Only run the rules when inserting text. 66835 if (inputType !== 'insertText') { 66836 return; 66837 } 66838 if ((0,external_wp_richText_namespaceObject.isCollapsed)(value)) { 66839 return; 66840 } 66841 const pair = (0,external_wp_hooks_namespaceObject.applyFilters)('blockEditor.wrapSelectionSettings', wrapSelectionSettings).find(([startChar, endChar]) => startChar === data || endChar === data); 66842 if (!pair) { 66843 return; 66844 } 66845 const [startChar, endChar = startChar] = pair; 66846 const start = value.start; 66847 const end = value.end + startChar.length; 66848 let newValue = (0,external_wp_richText_namespaceObject.insert)(value, startChar, start, start); 66849 newValue = (0,external_wp_richText_namespaceObject.insert)(newValue, endChar, end, end); 66850 const { 66851 __unstableMarkLastChangeAsPersistent, 66852 __unstableMarkAutomaticChange 66853 } = registry.dispatch(store); 66854 __unstableMarkLastChangeAsPersistent(); 66855 onChange(newValue); 66856 __unstableMarkAutomaticChange(); 66857 const init = {}; 66858 for (const key in event) { 66859 init[key] = event[key]; 66860 } 66861 init.data = endChar; 66862 const { 66863 ownerDocument 66864 } = element; 66865 const { 66866 defaultView 66867 } = ownerDocument; 66868 const newEvent = new defaultView.InputEvent('input', init); 66869 66870 // Dispatch an `input` event with the new data. This will trigger the 66871 // input rules. 66872 // Postpone the `input` to the next event loop tick so that the dispatch 66873 // doesn't happen synchronously in the middle of `beforeinput` dispatch. 66874 // This is closer to how native `input` event would be timed, and also 66875 // makes sure that the `input` event is dispatched only after the `onChange` 66876 // call few lines above has fully updated the data store state and rerendered 66877 // all affected components. 66878 window.queueMicrotask(() => { 66879 event.target.dispatchEvent(newEvent); 66880 }); 66881 event.preventDefault(); 66882 } 66883 element.addEventListener('beforeinput', onInput); 66884 return () => { 66885 element.removeEventListener('beforeinput', onInput); 66886 }; 66887 }); 66888 66889 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/prevent-event-discovery.js 66890 /** 66891 * WordPress dependencies 66892 */ 66893 66894 function preventEventDiscovery(value) { 66895 const searchText = 'tales of gutenberg'; 66896 const addText = ' 🐡🐢🦀🐤🦋🐘🐧🐹🦁🦄🦍🐼🐿🎃🐴🐝🐆🦕🦔🌱🍇π🍌🐉💧🥨🌌🍂🍠🥦🥚🥝🎟🥥🥒🛵🥖🍒🍯🎾🎲🐺🐚🐮⌛️'; 66897 const { 66898 start, 66899 text 66900 } = value; 66901 if (start < searchText.length) { 66902 return value; 66903 } 66904 const charactersBefore = text.slice(start - searchText.length, start); 66905 if (charactersBefore.toLowerCase() !== searchText) { 66906 return value; 66907 } 66908 return (0,external_wp_richText_namespaceObject.insert)(value, addText); 66909 } 66910 66911 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/input-rules.js 66912 /** 66913 * WordPress dependencies 66914 */ 66915 66916 66917 66918 /** 66919 * Internal dependencies 66920 */ 66921 66922 66923 66924 function findSelection(blocks) { 66925 let i = blocks.length; 66926 while (i--) { 66927 const attributeKey = retrieveSelectedAttribute(blocks[i].attributes); 66928 if (attributeKey) { 66929 blocks[i].attributes[attributeKey] = blocks[i].attributes[attributeKey] 66930 // To do: refactor this to use rich text's selection instead, so 66931 // we no longer have to use on this hack inserting a special 66932 // character. 66933 .toString().replace(START_OF_SELECTED_AREA, ''); 66934 return [blocks[i].clientId, attributeKey, 0, 0]; 66935 } 66936 const nestedSelection = findSelection(blocks[i].innerBlocks); 66937 if (nestedSelection) { 66938 return nestedSelection; 66939 } 66940 } 66941 return []; 66942 } 66943 /* harmony default export */ const input_rules = (props => element => { 66944 function inputRule() { 66945 const { 66946 getValue, 66947 onReplace, 66948 selectionChange, 66949 registry 66950 } = props.current; 66951 if (!onReplace) { 66952 return; 66953 } 66954 66955 // We must use getValue() here because value may be update 66956 // asynchronously. 66957 const value = getValue(); 66958 const { 66959 start, 66960 text 66961 } = value; 66962 const characterBefore = text.slice(start - 1, start); 66963 66964 // The character right before the caret must be a plain space. 66965 if (characterBefore !== ' ') { 66966 return; 66967 } 66968 const trimmedTextBefore = text.slice(0, start).trim(); 66969 const prefixTransforms = (0,external_wp_blocks_namespaceObject.getBlockTransforms)('from').filter(({ 66970 type 66971 }) => type === 'prefix'); 66972 const transformation = (0,external_wp_blocks_namespaceObject.findTransform)(prefixTransforms, ({ 66973 prefix 66974 }) => { 66975 return trimmedTextBefore === prefix; 66976 }); 66977 if (!transformation) { 66978 return; 66979 } 66980 const content = (0,external_wp_richText_namespaceObject.toHTMLString)({ 66981 value: (0,external_wp_richText_namespaceObject.insert)(value, START_OF_SELECTED_AREA, 0, start) 66982 }); 66983 const block = transformation.transform(content); 66984 selectionChange(...findSelection([block])); 66985 onReplace([block]); 66986 registry.dispatch(store).__unstableMarkAutomaticChange(); 66987 return true; 66988 } 66989 function onInput(event) { 66990 const { 66991 inputType, 66992 type 66993 } = event; 66994 const { 66995 getValue, 66996 onChange, 66997 __unstableAllowPrefixTransformations, 66998 formatTypes, 66999 registry 67000 } = props.current; 67001 67002 // Only run input rules when inserting text. 67003 if (inputType !== 'insertText' && type !== 'compositionend') { 67004 return; 67005 } 67006 if (__unstableAllowPrefixTransformations && inputRule()) { 67007 return; 67008 } 67009 const value = getValue(); 67010 const transformed = formatTypes.reduce((accumlator, { 67011 __unstableInputRule 67012 }) => { 67013 if (__unstableInputRule) { 67014 accumlator = __unstableInputRule(accumlator); 67015 } 67016 return accumlator; 67017 }, preventEventDiscovery(value)); 67018 const { 67019 __unstableMarkLastChangeAsPersistent, 67020 __unstableMarkAutomaticChange 67021 } = registry.dispatch(store); 67022 if (transformed !== value) { 67023 __unstableMarkLastChangeAsPersistent(); 67024 onChange({ 67025 ...transformed, 67026 activeFormats: value.activeFormats 67027 }); 67028 __unstableMarkAutomaticChange(); 67029 } 67030 } 67031 element.addEventListener('input', onInput); 67032 element.addEventListener('compositionend', onInput); 67033 return () => { 67034 element.removeEventListener('input', onInput); 67035 element.removeEventListener('compositionend', onInput); 67036 }; 67037 }); 67038 67039 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/insert-replacement-text.js 67040 /** 67041 * Internal dependencies 67042 */ 67043 67044 67045 /** 67046 * When the browser is about to auto correct, add an undo level so the user can 67047 * revert the change. 67048 * 67049 * @param {Object} props 67050 */ 67051 /* harmony default export */ const insert_replacement_text = (props => element => { 67052 function onInput(event) { 67053 if (event.inputType !== 'insertReplacementText') { 67054 return; 67055 } 67056 const { 67057 registry 67058 } = props.current; 67059 registry.dispatch(store).__unstableMarkLastChangeAsPersistent(); 67060 } 67061 element.addEventListener('beforeinput', onInput); 67062 return () => { 67063 element.removeEventListener('beforeinput', onInput); 67064 }; 67065 }); 67066 67067 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/remove-browser-shortcuts.js 67068 /** 67069 * WordPress dependencies 67070 */ 67071 67072 67073 /** 67074 * Hook to prevent default behaviors for key combinations otherwise handled 67075 * internally by RichText. 67076 */ 67077 /* harmony default export */ const remove_browser_shortcuts = (() => node => { 67078 function onKeydown(event) { 67079 if (external_wp_keycodes_namespaceObject.isKeyboardEvent.primary(event, 'z') || external_wp_keycodes_namespaceObject.isKeyboardEvent.primary(event, 'y') || external_wp_keycodes_namespaceObject.isKeyboardEvent.primaryShift(event, 'z')) { 67080 event.preventDefault(); 67081 } 67082 } 67083 node.addEventListener('keydown', onKeydown); 67084 return () => { 67085 node.removeEventListener('keydown', onKeydown); 67086 }; 67087 }); 67088 67089 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/shortcuts.js 67090 /* harmony default export */ const shortcuts = (props => element => { 67091 const { 67092 keyboardShortcuts 67093 } = props.current; 67094 function onKeyDown(event) { 67095 for (const keyboardShortcut of keyboardShortcuts.current) { 67096 keyboardShortcut(event); 67097 } 67098 } 67099 element.addEventListener('keydown', onKeyDown); 67100 return () => { 67101 element.removeEventListener('keydown', onKeyDown); 67102 }; 67103 }); 67104 67105 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/input-events.js 67106 /* harmony default export */ const input_events = (props => element => { 67107 const { 67108 inputEvents 67109 } = props.current; 67110 function onInput(event) { 67111 for (const keyboardShortcut of inputEvents.current) { 67112 keyboardShortcut(event); 67113 } 67114 } 67115 element.addEventListener('input', onInput); 67116 return () => { 67117 element.removeEventListener('input', onInput); 67118 }; 67119 }); 67120 67121 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/undo-automatic-change.js 67122 /** 67123 * WordPress dependencies 67124 */ 67125 67126 67127 /** 67128 * Internal dependencies 67129 */ 67130 67131 /* harmony default export */ const undo_automatic_change = (props => element => { 67132 function onKeyDown(event) { 67133 const { 67134 keyCode 67135 } = event; 67136 if (event.defaultPrevented) { 67137 return; 67138 } 67139 if (keyCode !== external_wp_keycodes_namespaceObject.BACKSPACE && keyCode !== external_wp_keycodes_namespaceObject.ESCAPE) { 67140 return; 67141 } 67142 const { 67143 registry 67144 } = props.current; 67145 const { 67146 didAutomaticChange, 67147 getSettings 67148 } = registry.select(store); 67149 const { 67150 __experimentalUndo 67151 } = getSettings(); 67152 if (!__experimentalUndo) { 67153 return; 67154 } 67155 if (!didAutomaticChange()) { 67156 return; 67157 } 67158 event.preventDefault(); 67159 __experimentalUndo(); 67160 } 67161 element.addEventListener('keydown', onKeyDown); 67162 return () => { 67163 element.removeEventListener('keydown', onKeyDown); 67164 }; 67165 }); 67166 67167 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/utils.js 67168 /** 67169 * WordPress dependencies 67170 */ 67171 67172 67173 67174 function addActiveFormats(value, activeFormats) { 67175 if (activeFormats?.length) { 67176 let index = value.formats.length; 67177 while (index--) { 67178 value.formats[index] = [...activeFormats, ...(value.formats[index] || [])]; 67179 } 67180 } 67181 } 67182 67183 /** 67184 * Get the multiline tag based on the multiline prop. 67185 * 67186 * @param {?(string|boolean)} multiline The multiline prop. 67187 * 67188 * @return {string | undefined} The multiline tag. 67189 */ 67190 function getMultilineTag(multiline) { 67191 if (multiline !== true && multiline !== 'p' && multiline !== 'li') { 67192 return; 67193 } 67194 return multiline === true ? 'p' : multiline; 67195 } 67196 function getAllowedFormats({ 67197 allowedFormats, 67198 disableFormats 67199 }) { 67200 if (disableFormats) { 67201 return getAllowedFormats.EMPTY_ARRAY; 67202 } 67203 return allowedFormats; 67204 } 67205 getAllowedFormats.EMPTY_ARRAY = []; 67206 67207 /** 67208 * Creates a link from pasted URL. 67209 * Creates a paragraph block containing a link to the URL, and calls `onReplace`. 67210 * 67211 * @param {string} url The URL that could not be embedded. 67212 * @param {Function} onReplace Function to call with the created fallback block. 67213 */ 67214 function createLinkInParagraph(url, onReplace) { 67215 const link = /*#__PURE__*/_jsx("a", { 67216 href: url, 67217 children: url 67218 }); 67219 onReplace(createBlock('core/paragraph', { 67220 content: renderToString(link) 67221 })); 67222 } 67223 67224 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/paste-handler.js 67225 /** 67226 * WordPress dependencies 67227 */ 67228 67229 67230 67231 67232 /** 67233 * Internal dependencies 67234 */ 67235 67236 67237 67238 /** @typedef {import('@wordpress/rich-text').RichTextValue} RichTextValue */ 67239 67240 /* harmony default export */ const paste_handler = (props => element => { 67241 function _onPaste(event) { 67242 const { 67243 disableFormats, 67244 onChange, 67245 value, 67246 formatTypes, 67247 tagName, 67248 onReplace, 67249 __unstableEmbedURLOnPaste, 67250 preserveWhiteSpace, 67251 pastePlainText 67252 } = props.current; 67253 67254 // The event listener is attached to the window, so we need to check if 67255 // the target is the element or inside the element. 67256 if (!element.contains(event.target)) { 67257 return; 67258 } 67259 if (event.defaultPrevented) { 67260 return; 67261 } 67262 const { 67263 plainText, 67264 html 67265 } = getPasteEventData(event); 67266 event.preventDefault(); 67267 67268 // Allows us to ask for this information when we get a report. 67269 window.console.log('Received HTML:\n\n', html); 67270 window.console.log('Received plain text:\n\n', plainText); 67271 if (disableFormats) { 67272 onChange((0,external_wp_richText_namespaceObject.insert)(value, plainText)); 67273 return; 67274 } 67275 const isInternal = event.clipboardData.getData('rich-text') === 'true'; 67276 function pasteInline(content) { 67277 const transformed = formatTypes.reduce((accumulator, { 67278 __unstablePasteRule 67279 }) => { 67280 // Only allow one transform. 67281 if (__unstablePasteRule && accumulator === value) { 67282 accumulator = __unstablePasteRule(value, { 67283 html, 67284 plainText 67285 }); 67286 } 67287 return accumulator; 67288 }, value); 67289 if (transformed !== value) { 67290 onChange(transformed); 67291 } else { 67292 const valueToInsert = (0,external_wp_richText_namespaceObject.create)({ 67293 html: content 67294 }); 67295 addActiveFormats(valueToInsert, value.activeFormats); 67296 onChange((0,external_wp_richText_namespaceObject.insert)(value, valueToInsert)); 67297 } 67298 } 67299 67300 // If the data comes from a rich text instance, we can directly use it 67301 // without filtering the data. The filters are only meant for externally 67302 // pasted content and remove inline styles. 67303 if (isInternal) { 67304 pasteInline(html); 67305 return; 67306 } 67307 if (pastePlainText) { 67308 onChange((0,external_wp_richText_namespaceObject.insert)(value, (0,external_wp_richText_namespaceObject.create)({ 67309 text: plainText 67310 }))); 67311 return; 67312 } 67313 let mode = 'INLINE'; 67314 const trimmedPlainText = plainText.trim(); 67315 if (__unstableEmbedURLOnPaste && (0,external_wp_richText_namespaceObject.isEmpty)(value) && (0,external_wp_url_namespaceObject.isURL)(trimmedPlainText) && 67316 // For the link pasting feature, allow only http(s) protocols. 67317 /^https?:/.test(trimmedPlainText)) { 67318 mode = 'BLOCKS'; 67319 } 67320 const content = (0,external_wp_blocks_namespaceObject.pasteHandler)({ 67321 HTML: html, 67322 plainText, 67323 mode, 67324 tagName, 67325 preserveWhiteSpace 67326 }); 67327 if (typeof content === 'string') { 67328 pasteInline(content); 67329 } else if (content.length > 0) { 67330 if (onReplace && (0,external_wp_richText_namespaceObject.isEmpty)(value)) { 67331 onReplace(content, content.length - 1, -1); 67332 } 67333 } 67334 } 67335 const { 67336 defaultView 67337 } = element.ownerDocument; 67338 67339 // Attach the listener to the window so parent elements have the chance to 67340 // prevent the default behavior. 67341 defaultView.addEventListener('paste', _onPaste); 67342 return () => { 67343 defaultView.removeEventListener('paste', _onPaste); 67344 }; 67345 }); 67346 67347 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/delete.js 67348 /** 67349 * WordPress dependencies 67350 */ 67351 67352 67353 /* harmony default export */ const event_listeners_delete = (props => element => { 67354 function onKeyDown(event) { 67355 const { 67356 keyCode 67357 } = event; 67358 if (event.defaultPrevented) { 67359 return; 67360 } 67361 const { 67362 value, 67363 onMerge, 67364 onRemove 67365 } = props.current; 67366 if (keyCode === external_wp_keycodes_namespaceObject.DELETE || keyCode === external_wp_keycodes_namespaceObject.BACKSPACE) { 67367 const { 67368 start, 67369 end, 67370 text 67371 } = value; 67372 const isReverse = keyCode === external_wp_keycodes_namespaceObject.BACKSPACE; 67373 const hasActiveFormats = value.activeFormats && !!value.activeFormats.length; 67374 67375 // Only process delete if the key press occurs at an uncollapsed edge. 67376 if (!(0,external_wp_richText_namespaceObject.isCollapsed)(value) || hasActiveFormats || isReverse && start !== 0 || !isReverse && end !== text.length) { 67377 return; 67378 } 67379 if (onMerge) { 67380 onMerge(!isReverse); 67381 } 67382 67383 // Only handle remove on Backspace. This serves dual-purpose of being 67384 // an intentional user interaction distinguishing between Backspace and 67385 // Delete to remove the empty field, but also to avoid merge & remove 67386 // causing destruction of two fields (merge, then removed merged). 67387 else if (onRemove && (0,external_wp_richText_namespaceObject.isEmpty)(value) && isReverse) { 67388 onRemove(!isReverse); 67389 } 67390 event.preventDefault(); 67391 } 67392 } 67393 element.addEventListener('keydown', onKeyDown); 67394 return () => { 67395 element.removeEventListener('keydown', onKeyDown); 67396 }; 67397 }); 67398 67399 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/enter.js 67400 /** 67401 * WordPress dependencies 67402 */ 67403 67404 67405 /* harmony default export */ const enter = (props => element => { 67406 function onKeyDownDeprecated(event) { 67407 if (event.keyCode !== external_wp_keycodes_namespaceObject.ENTER) { 67408 return; 67409 } 67410 const { 67411 onReplace, 67412 onSplit 67413 } = props.current; 67414 if (onReplace && onSplit) { 67415 event.__deprecatedOnSplit = true; 67416 } 67417 } 67418 function onKeyDown(event) { 67419 if (event.defaultPrevented) { 67420 return; 67421 } 67422 67423 // The event listener is attached to the window, so we need to check if 67424 // the target is the element. 67425 if (event.target !== element) { 67426 return; 67427 } 67428 if (event.keyCode !== external_wp_keycodes_namespaceObject.ENTER) { 67429 return; 67430 } 67431 const { 67432 value, 67433 onChange, 67434 disableLineBreaks, 67435 onSplitAtEnd, 67436 onSplitAtDoubleLineEnd, 67437 registry 67438 } = props.current; 67439 event.preventDefault(); 67440 const { 67441 text, 67442 start, 67443 end 67444 } = value; 67445 if (event.shiftKey) { 67446 if (!disableLineBreaks) { 67447 onChange((0,external_wp_richText_namespaceObject.insert)(value, '\n')); 67448 } 67449 } else if (onSplitAtEnd && start === end && end === text.length) { 67450 onSplitAtEnd(); 67451 } else if ( 67452 // For some blocks it's desirable to split at the end of the 67453 // block when there are two line breaks at the end of the 67454 // block, so triple Enter exits the block. 67455 onSplitAtDoubleLineEnd && start === end && end === text.length && text.slice(-2) === '\n\n') { 67456 registry.batch(() => { 67457 const _value = { 67458 ...value 67459 }; 67460 _value.start = _value.end - 2; 67461 onChange((0,external_wp_richText_namespaceObject.remove)(_value)); 67462 onSplitAtDoubleLineEnd(); 67463 }); 67464 } else if (!disableLineBreaks) { 67465 onChange((0,external_wp_richText_namespaceObject.insert)(value, '\n')); 67466 } 67467 } 67468 const { 67469 defaultView 67470 } = element.ownerDocument; 67471 67472 // Attach the listener to the window so parent elements have the chance to 67473 // prevent the default behavior. 67474 defaultView.addEventListener('keydown', onKeyDown); 67475 element.addEventListener('keydown', onKeyDownDeprecated); 67476 return () => { 67477 defaultView.removeEventListener('keydown', onKeyDown); 67478 element.removeEventListener('keydown', onKeyDownDeprecated); 67479 }; 67480 }); 67481 67482 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/firefox-compat.js 67483 /** 67484 * Internal dependencies 67485 */ 67486 67487 /* harmony default export */ const firefox_compat = (props => element => { 67488 function onFocus() { 67489 const { 67490 registry 67491 } = props.current; 67492 if (!registry.select(store).isMultiSelecting()) { 67493 return; 67494 } 67495 67496 // This is a little hack to work around focus issues with nested 67497 // editable elements in Firefox. For some reason the editable child 67498 // element sometimes regains focus, while it should not be focusable 67499 // and focus should remain on the editable parent element. 67500 // To do: try to find the cause of the shifting focus. 67501 const parentEditable = element.parentElement.closest('[contenteditable="true"]'); 67502 if (parentEditable) { 67503 parentEditable.focus(); 67504 } 67505 } 67506 element.addEventListener('focus', onFocus); 67507 return () => { 67508 element.removeEventListener('focus', onFocus); 67509 }; 67510 }); 67511 67512 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/event-listeners/index.js 67513 /** 67514 * WordPress dependencies 67515 */ 67516 67517 67518 67519 /** 67520 * Internal dependencies 67521 */ 67522 67523 67524 67525 67526 67527 67528 67529 67530 67531 67532 67533 const allEventListeners = [before_input_rules, input_rules, insert_replacement_text, remove_browser_shortcuts, shortcuts, input_events, undo_automatic_change, paste_handler, event_listeners_delete, enter, firefox_compat]; 67534 function useEventListeners(props) { 67535 const propsRef = (0,external_wp_element_namespaceObject.useRef)(props); 67536 propsRef.current = props; 67537 const refEffects = (0,external_wp_element_namespaceObject.useMemo)(() => allEventListeners.map(refEffect => refEffect(propsRef)), [propsRef]); 67538 return (0,external_wp_compose_namespaceObject.useRefEffect)(element => { 67539 if (!props.isSelected) { 67540 return; 67541 } 67542 const cleanups = refEffects.map(effect => effect(element)); 67543 return () => { 67544 cleanups.forEach(cleanup => cleanup()); 67545 }; 67546 }, [refEffects, props.isSelected]); 67547 } 67548 67549 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/format-edit.js 67550 /** 67551 * WordPress dependencies 67552 */ 67553 67554 67555 67556 /** 67557 * Internal dependencies 67558 */ 67559 67560 67561 67562 const format_edit_DEFAULT_BLOCK_CONTEXT = {}; 67563 const usesContextKey = Symbol('usesContext'); 67564 function format_edit_Edit({ 67565 onChange, 67566 onFocus, 67567 value, 67568 forwardedRef, 67569 settings 67570 }) { 67571 const { 67572 name, 67573 edit: EditFunction, 67574 [usesContextKey]: usesContext 67575 } = settings; 67576 const blockContext = (0,external_wp_element_namespaceObject.useContext)(block_context); 67577 67578 // Assign context values using the block type's declared context needs. 67579 const context = (0,external_wp_element_namespaceObject.useMemo)(() => { 67580 return usesContext ? Object.fromEntries(Object.entries(blockContext).filter(([key]) => usesContext.includes(key))) : format_edit_DEFAULT_BLOCK_CONTEXT; 67581 }, [usesContext, blockContext]); 67582 if (!EditFunction) { 67583 return null; 67584 } 67585 const activeFormat = (0,external_wp_richText_namespaceObject.getActiveFormat)(value, name); 67586 const isActive = activeFormat !== undefined; 67587 const activeObject = (0,external_wp_richText_namespaceObject.getActiveObject)(value); 67588 const isObjectActive = activeObject !== undefined && activeObject.type === name; 67589 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(EditFunction, { 67590 isActive: isActive, 67591 activeAttributes: isActive ? activeFormat.attributes || {} : {}, 67592 isObjectActive: isObjectActive, 67593 activeObjectAttributes: isObjectActive ? activeObject.attributes || {} : {}, 67594 value: value, 67595 onChange: onChange, 67596 onFocus: onFocus, 67597 contentRef: forwardedRef, 67598 context: context 67599 }, name); 67600 } 67601 function FormatEdit({ 67602 formatTypes, 67603 ...props 67604 }) { 67605 return formatTypes.map(settings => /*#__PURE__*/(0,external_React_.createElement)(format_edit_Edit, { 67606 settings: settings, 67607 ...props, 67608 key: settings.name 67609 })); 67610 } 67611 67612 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/content.js 67613 /** 67614 * WordPress dependencies 67615 */ 67616 67617 67618 67619 67620 /** 67621 * Internal dependencies 67622 */ 67623 67624 67625 /** 67626 * Internal dependencies 67627 */ 67628 67629 67630 function valueToHTMLString(value, multiline) { 67631 if (rich_text.isEmpty(value)) { 67632 const multilineTag = getMultilineTag(multiline); 67633 return multilineTag ? `<$multilineTag}></$multilineTag}>` : ''; 67634 } 67635 if (Array.isArray(value)) { 67636 external_wp_deprecated_default()('wp.blockEditor.RichText value prop as children type', { 67637 since: '6.1', 67638 version: '6.3', 67639 alternative: 'value prop as string', 67640 link: 'https://developer.wordpress.org/block-editor/how-to-guides/block-tutorial/introducing-attributes-and-editable-fields/' 67641 }); 67642 return external_wp_blocks_namespaceObject.children.toHTML(value); 67643 } 67644 67645 // To do: deprecate string type. 67646 if (typeof value === 'string') { 67647 return value; 67648 } 67649 67650 // To do: create a toReactComponent method on RichTextData, which we 67651 // might in the future also use for the editable tree. See 67652 // https://github.com/WordPress/gutenberg/pull/41655. 67653 return value.toHTMLString(); 67654 } 67655 function Content({ 67656 value, 67657 tagName: Tag, 67658 multiline, 67659 format, 67660 ...props 67661 }) { 67662 value = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_element_namespaceObject.RawHTML, { 67663 children: valueToHTMLString(value, multiline) 67664 }); 67665 return Tag ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tag, { 67666 ...props, 67667 children: value 67668 }) : value; 67669 } 67670 67671 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/multiline.js 67672 /** 67673 * WordPress dependencies 67674 */ 67675 67676 67677 67678 67679 67680 67681 /** 67682 * Internal dependencies 67683 */ 67684 67685 67686 67687 67688 67689 function RichTextMultiline({ 67690 children, 67691 identifier, 67692 tagName: TagName = 'div', 67693 value = '', 67694 onChange, 67695 multiline, 67696 ...props 67697 }, forwardedRef) { 67698 external_wp_deprecated_default()('wp.blockEditor.RichText multiline prop', { 67699 since: '6.1', 67700 version: '6.3', 67701 alternative: 'nested blocks (InnerBlocks)', 67702 link: 'https://developer.wordpress.org/block-editor/how-to-guides/block-tutorial/nested-blocks-inner-blocks/' 67703 }); 67704 const { 67705 clientId 67706 } = useBlockEditContext(); 67707 const { 67708 getSelectionStart, 67709 getSelectionEnd 67710 } = (0,external_wp_data_namespaceObject.useSelect)(store); 67711 const { 67712 selectionChange 67713 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 67714 const multilineTagName = getMultilineTag(multiline); 67715 value = value || `<$multilineTagName}></$multilineTagName}>`; 67716 const padded = `</$multilineTagName}>$value}<$multilineTagName}>`; 67717 const values = padded.split(`</$multilineTagName}><$multilineTagName}>`); 67718 values.shift(); 67719 values.pop(); 67720 function _onChange(newValues) { 67721 onChange(`<$multilineTagName}>$newValues.join(`</$multilineTagName}><$multilineTagName}>`)}</$multilineTagName}>`); 67722 } 67723 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TagName, { 67724 ref: forwardedRef, 67725 children: values.map((_value, index) => { 67726 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RichTextWrapper, { 67727 identifier: `$identifier}-$index}`, 67728 tagName: multilineTagName, 67729 value: _value, 67730 onChange: newValue => { 67731 const newValues = values.slice(); 67732 newValues[index] = newValue; 67733 _onChange(newValues); 67734 }, 67735 isSelected: undefined, 67736 onKeyDown: event => { 67737 if (event.keyCode !== external_wp_keycodes_namespaceObject.ENTER) { 67738 return; 67739 } 67740 event.preventDefault(); 67741 const { 67742 offset: start 67743 } = getSelectionStart(); 67744 const { 67745 offset: end 67746 } = getSelectionEnd(); 67747 67748 // Cannot split if there is no selection. 67749 if (typeof start !== 'number' || typeof end !== 'number') { 67750 return; 67751 } 67752 const richTextValue = (0,external_wp_richText_namespaceObject.create)({ 67753 html: _value 67754 }); 67755 richTextValue.start = start; 67756 richTextValue.end = end; 67757 const array = (0,external_wp_richText_namespaceObject.split)(richTextValue).map(v => (0,external_wp_richText_namespaceObject.toHTMLString)({ 67758 value: v 67759 })); 67760 const newValues = values.slice(); 67761 newValues.splice(index, 1, ...array); 67762 _onChange(newValues); 67763 selectionChange(clientId, `$identifier}-$index + 1}`, 0, 0); 67764 }, 67765 onMerge: forward => { 67766 const newValues = values.slice(); 67767 let offset = 0; 67768 if (forward) { 67769 if (!newValues[index + 1]) { 67770 return; 67771 } 67772 newValues.splice(index, 2, newValues[index] + newValues[index + 1]); 67773 offset = newValues[index].length - 1; 67774 } else { 67775 if (!newValues[index - 1]) { 67776 return; 67777 } 67778 newValues.splice(index - 1, 2, newValues[index - 1] + newValues[index]); 67779 offset = newValues[index - 1].length - 1; 67780 } 67781 _onChange(newValues); 67782 selectionChange(clientId, `$identifier}-$index - (forward ? 0 : 1)}`, offset, offset); 67783 }, 67784 ...props 67785 }, index); 67786 }) 67787 }); 67788 } 67789 /* harmony default export */ const multiline = ((0,external_wp_element_namespaceObject.forwardRef)(RichTextMultiline)); 67790 67791 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/with-deprecations.js 67792 /** 67793 * WordPress dependencies 67794 */ 67795 67796 67797 67798 67799 67800 /** 67801 * Internal dependencies 67802 */ 67803 67804 67805 function withDeprecations(Component) { 67806 return (0,external_wp_element_namespaceObject.forwardRef)((props, ref) => { 67807 let value = props.value; 67808 let onChange = props.onChange; 67809 67810 // Handle deprecated format. 67811 if (Array.isArray(value)) { 67812 external_wp_deprecated_default()('wp.blockEditor.RichText value prop as children type', { 67813 since: '6.1', 67814 version: '6.3', 67815 alternative: 'value prop as string', 67816 link: 'https://developer.wordpress.org/block-editor/how-to-guides/block-tutorial/introducing-attributes-and-editable-fields/' 67817 }); 67818 value = external_wp_blocks_namespaceObject.children.toHTML(props.value); 67819 onChange = newValue => props.onChange(external_wp_blocks_namespaceObject.children.fromDOM((0,external_wp_richText_namespaceObject.__unstableCreateElement)(document, newValue).childNodes)); 67820 } 67821 const NewComponent = props.multiline ? multiline : Component; 67822 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NewComponent, { 67823 ...props, 67824 value: value, 67825 onChange: onChange, 67826 ref: ref 67827 }); 67828 }); 67829 } 67830 67831 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/index.js 67832 /** 67833 * External dependencies 67834 */ 67835 67836 67837 /** 67838 * WordPress dependencies 67839 */ 67840 67841 67842 67843 67844 67845 67846 67847 67848 67849 /** 67850 * Internal dependencies 67851 */ 67852 67853 67854 67855 67856 67857 67858 67859 67860 67861 67862 67863 67864 67865 67866 67867 67868 67869 const keyboardShortcutContext = (0,external_wp_element_namespaceObject.createContext)(); 67870 const inputEventContext = (0,external_wp_element_namespaceObject.createContext)(); 67871 const instanceIdKey = Symbol('instanceId'); 67872 67873 /** 67874 * Removes props used for the native version of RichText so that they are not 67875 * passed to the DOM element and log warnings. 67876 * 67877 * @param {Object} props Props to filter. 67878 * 67879 * @return {Object} Filtered props. 67880 */ 67881 function removeNativeProps(props) { 67882 const { 67883 __unstableMobileNoFocusOnMount, 67884 deleteEnter, 67885 placeholderTextColor, 67886 textAlign, 67887 selectionColor, 67888 tagsToEliminate, 67889 disableEditingMenu, 67890 fontSize, 67891 fontFamily, 67892 fontWeight, 67893 fontStyle, 67894 minWidth, 67895 maxWidth, 67896 disableSuggestions, 67897 disableAutocorrection, 67898 ...restProps 67899 } = props; 67900 return restProps; 67901 } 67902 function RichTextWrapper({ 67903 children, 67904 tagName = 'div', 67905 value: adjustedValue = '', 67906 onChange: adjustedOnChange, 67907 isSelected: originalIsSelected, 67908 multiline, 67909 inlineToolbar, 67910 wrapperClassName, 67911 autocompleters, 67912 onReplace, 67913 placeholder, 67914 allowedFormats, 67915 withoutInteractiveFormatting, 67916 onRemove, 67917 onMerge, 67918 onSplit, 67919 __unstableOnSplitAtEnd: onSplitAtEnd, 67920 __unstableOnSplitAtDoubleLineEnd: onSplitAtDoubleLineEnd, 67921 identifier, 67922 preserveWhiteSpace, 67923 __unstablePastePlainText: pastePlainText, 67924 __unstableEmbedURLOnPaste, 67925 __unstableDisableFormats: disableFormats, 67926 disableLineBreaks, 67927 __unstableAllowPrefixTransformations, 67928 readOnly, 67929 ...props 67930 }, forwardedRef) { 67931 props = removeNativeProps(props); 67932 if (onSplit) { 67933 external_wp_deprecated_default()('wp.blockEditor.RichText onSplit prop', { 67934 since: '6.4', 67935 alternative: 'block.json support key: "splitting"' 67936 }); 67937 } 67938 const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(RichTextWrapper); 67939 const anchorRef = (0,external_wp_element_namespaceObject.useRef)(); 67940 const context = useBlockEditContext(); 67941 const { 67942 clientId, 67943 isSelected: isBlockSelected, 67944 name: blockName 67945 } = context; 67946 const blockBindings = context[blockBindingsKey]; 67947 const blockContext = (0,external_wp_element_namespaceObject.useContext)(block_context); 67948 const registry = (0,external_wp_data_namespaceObject.useRegistry)(); 67949 const selector = select => { 67950 // Avoid subscribing to the block editor store if the block is not 67951 // selected. 67952 if (!isBlockSelected) { 67953 return { 67954 isSelected: false 67955 }; 67956 } 67957 const { 67958 getSelectionStart, 67959 getSelectionEnd 67960 } = select(store); 67961 const selectionStart = getSelectionStart(); 67962 const selectionEnd = getSelectionEnd(); 67963 let isSelected; 67964 if (originalIsSelected === undefined) { 67965 isSelected = selectionStart.clientId === clientId && selectionEnd.clientId === clientId && (identifier ? selectionStart.attributeKey === identifier : selectionStart[instanceIdKey] === instanceId); 67966 } else if (originalIsSelected) { 67967 isSelected = selectionStart.clientId === clientId; 67968 } 67969 return { 67970 selectionStart: isSelected ? selectionStart.offset : undefined, 67971 selectionEnd: isSelected ? selectionEnd.offset : undefined, 67972 isSelected 67973 }; 67974 }; 67975 const { 67976 selectionStart, 67977 selectionEnd, 67978 isSelected 67979 } = (0,external_wp_data_namespaceObject.useSelect)(selector, [clientId, identifier, instanceId, originalIsSelected, isBlockSelected]); 67980 const { 67981 disableBoundBlock, 67982 bindingsPlaceholder, 67983 bindingsLabel 67984 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 67985 var _fieldsList$relatedBi; 67986 if (!blockBindings?.[identifier] || !canBindBlock(blockName)) { 67987 return {}; 67988 } 67989 const relatedBinding = blockBindings[identifier]; 67990 const blockBindingsSource = (0,external_wp_blocks_namespaceObject.getBlockBindingsSource)(relatedBinding.source); 67991 const blockBindingsContext = {}; 67992 if (blockBindingsSource?.usesContext?.length) { 67993 for (const key of blockBindingsSource.usesContext) { 67994 blockBindingsContext[key] = blockContext[key]; 67995 } 67996 } 67997 const _disableBoundBlock = !blockBindingsSource?.canUserEditValue?.({ 67998 select, 67999 context: blockBindingsContext, 68000 args: relatedBinding.args 68001 }); 68002 68003 // Don't modify placeholders if value is not empty. 68004 if (adjustedValue.length > 0) { 68005 return { 68006 disableBoundBlock: _disableBoundBlock, 68007 // Null values will make them fall back to the default behavior. 68008 bindingsPlaceholder: null, 68009 bindingsLabel: null 68010 }; 68011 } 68012 const { 68013 getBlockAttributes 68014 } = select(store); 68015 const blockAttributes = getBlockAttributes(clientId); 68016 const fieldsList = blockBindingsSource?.getFieldsList?.({ 68017 select, 68018 context: blockBindingsContext 68019 }); 68020 const bindingKey = (_fieldsList$relatedBi = fieldsList?.[relatedBinding?.args?.key]?.label) !== null && _fieldsList$relatedBi !== void 0 ? _fieldsList$relatedBi : blockBindingsSource?.label; 68021 const _bindingsPlaceholder = _disableBoundBlock ? bindingKey : (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: connected field label or source label */ 68022 (0,external_wp_i18n_namespaceObject.__)('Add %s'), bindingKey); 68023 const _bindingsLabel = _disableBoundBlock ? relatedBinding?.args?.key || blockBindingsSource?.label : (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: source label or key */ 68024 (0,external_wp_i18n_namespaceObject.__)('Empty %s; start writing to edit its value'), relatedBinding?.args?.key || blockBindingsSource?.label); 68025 return { 68026 disableBoundBlock: _disableBoundBlock, 68027 bindingsPlaceholder: blockAttributes?.placeholder || _bindingsPlaceholder, 68028 bindingsLabel: _bindingsLabel 68029 }; 68030 }, [blockBindings, identifier, blockName, blockContext, adjustedValue]); 68031 const shouldDisableEditing = readOnly || disableBoundBlock; 68032 const { 68033 getSelectionStart, 68034 getSelectionEnd, 68035 getBlockRootClientId 68036 } = (0,external_wp_data_namespaceObject.useSelect)(store); 68037 const { 68038 selectionChange 68039 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 68040 const adjustedAllowedFormats = getAllowedFormats({ 68041 allowedFormats, 68042 disableFormats 68043 }); 68044 const hasFormats = !adjustedAllowedFormats || adjustedAllowedFormats.length > 0; 68045 const onSelectionChange = (0,external_wp_element_namespaceObject.useCallback)((start, end) => { 68046 const selection = {}; 68047 const unset = start === undefined && end === undefined; 68048 const baseSelection = { 68049 clientId, 68050 [identifier ? 'attributeKey' : instanceIdKey]: identifier ? identifier : instanceId 68051 }; 68052 if (typeof start === 'number' || unset) { 68053 // If we are only setting the start (or the end below), which 68054 // means a partial selection, and we're not updating a selection 68055 // with the same client ID, abort. This means the selected block 68056 // is a parent block. 68057 if (end === undefined && getBlockRootClientId(clientId) !== getBlockRootClientId(getSelectionEnd().clientId)) { 68058 return; 68059 } 68060 selection.start = { 68061 ...baseSelection, 68062 offset: start 68063 }; 68064 } 68065 if (typeof end === 'number' || unset) { 68066 if (start === undefined && getBlockRootClientId(clientId) !== getBlockRootClientId(getSelectionStart().clientId)) { 68067 return; 68068 } 68069 selection.end = { 68070 ...baseSelection, 68071 offset: end 68072 }; 68073 } 68074 selectionChange(selection); 68075 }, [clientId, getBlockRootClientId, getSelectionEnd, getSelectionStart, identifier, instanceId, selectionChange]); 68076 const { 68077 formatTypes, 68078 prepareHandlers, 68079 valueHandlers, 68080 changeHandlers, 68081 dependencies 68082 } = useFormatTypes({ 68083 clientId, 68084 identifier, 68085 withoutInteractiveFormatting, 68086 allowedFormats: adjustedAllowedFormats 68087 }); 68088 function addEditorOnlyFormats(value) { 68089 return valueHandlers.reduce((accumulator, fn) => fn(accumulator, value.text), value.formats); 68090 } 68091 function removeEditorOnlyFormats(value) { 68092 formatTypes.forEach(formatType => { 68093 // Remove formats created by prepareEditableTree, because they are editor only. 68094 if (formatType.__experimentalCreatePrepareEditableTree) { 68095 value = (0,external_wp_richText_namespaceObject.removeFormat)(value, formatType.name, 0, value.text.length); 68096 } 68097 }); 68098 return value.formats; 68099 } 68100 function addInvisibleFormats(value) { 68101 return prepareHandlers.reduce((accumulator, fn) => fn(accumulator, value.text), value.formats); 68102 } 68103 const { 68104 value, 68105 getValue, 68106 onChange, 68107 ref: richTextRef 68108 } = (0,external_wp_richText_namespaceObject.__unstableUseRichText)({ 68109 value: adjustedValue, 68110 onChange(html, { 68111 __unstableFormats, 68112 __unstableText 68113 }) { 68114 adjustedOnChange(html); 68115 Object.values(changeHandlers).forEach(changeHandler => { 68116 changeHandler(__unstableFormats, __unstableText); 68117 }); 68118 }, 68119 selectionStart, 68120 selectionEnd, 68121 onSelectionChange, 68122 placeholder: bindingsPlaceholder || placeholder, 68123 __unstableIsSelected: isSelected, 68124 __unstableDisableFormats: disableFormats, 68125 preserveWhiteSpace, 68126 __unstableDependencies: [...dependencies, tagName], 68127 __unstableAfterParse: addEditorOnlyFormats, 68128 __unstableBeforeSerialize: removeEditorOnlyFormats, 68129 __unstableAddInvisibleFormats: addInvisibleFormats 68130 }); 68131 const autocompleteProps = useBlockEditorAutocompleteProps({ 68132 onReplace, 68133 completers: autocompleters, 68134 record: value, 68135 onChange 68136 }); 68137 useMarkPersistent({ 68138 html: adjustedValue, 68139 value 68140 }); 68141 const keyboardShortcuts = (0,external_wp_element_namespaceObject.useRef)(new Set()); 68142 const inputEvents = (0,external_wp_element_namespaceObject.useRef)(new Set()); 68143 function onFocus() { 68144 anchorRef.current?.focus(); 68145 } 68146 const TagName = tagName; 68147 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 68148 children: [isSelected && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(keyboardShortcutContext.Provider, { 68149 value: keyboardShortcuts, 68150 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inputEventContext.Provider, { 68151 value: inputEvents, 68152 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Popover.__unstableSlotNameProvider, { 68153 value: "__unstable-block-tools-after", 68154 children: [children && children({ 68155 value, 68156 onChange, 68157 onFocus 68158 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FormatEdit, { 68159 value: value, 68160 onChange: onChange, 68161 onFocus: onFocus, 68162 formatTypes: formatTypes, 68163 forwardedRef: anchorRef 68164 })] 68165 }) 68166 }) 68167 }), isSelected && hasFormats && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(format_toolbar_container, { 68168 inline: inlineToolbar, 68169 editableContentElement: anchorRef.current 68170 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TagName 68171 // Overridable props. 68172 , { 68173 role: "textbox", 68174 "aria-multiline": !disableLineBreaks, 68175 "aria-readonly": shouldDisableEditing, 68176 ...props, 68177 "aria-label": bindingsLabel || props['aria-label'] || placeholder, 68178 ...autocompleteProps, 68179 ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([ 68180 // Rich text ref must be first because its focus listener 68181 // must be set up before any other ref calls .focus() on 68182 // mount. 68183 richTextRef, forwardedRef, autocompleteProps.ref, props.ref, useEventListeners({ 68184 registry, 68185 getValue, 68186 onChange, 68187 __unstableAllowPrefixTransformations, 68188 formatTypes, 68189 onReplace, 68190 selectionChange, 68191 isSelected, 68192 disableFormats, 68193 value, 68194 tagName, 68195 onSplit, 68196 __unstableEmbedURLOnPaste, 68197 pastePlainText, 68198 onMerge, 68199 onRemove, 68200 removeEditorOnlyFormats, 68201 disableLineBreaks, 68202 onSplitAtEnd, 68203 onSplitAtDoubleLineEnd, 68204 keyboardShortcuts, 68205 inputEvents 68206 }), anchorRef]), 68207 contentEditable: !shouldDisableEditing, 68208 suppressContentEditableWarning: true, 68209 className: dist_clsx('block-editor-rich-text__editable', props.className, 'rich-text') 68210 // Setting tabIndex to 0 is unnecessary, the element is already 68211 // focusable because it's contentEditable. This also fixes a 68212 // Safari bug where it's not possible to Shift+Click multi 68213 // select blocks when Shift Clicking into an element with 68214 // tabIndex because Safari will focus the element. However, 68215 // Safari will correctly ignore nested contentEditable elements. 68216 , 68217 tabIndex: props.tabIndex === 0 && !shouldDisableEditing ? null : props.tabIndex, 68218 "data-wp-block-attribute-key": identifier 68219 })] 68220 }); 68221 } 68222 68223 // This is the private API for the RichText component. 68224 // It allows access to all props, not just the public ones. 68225 const PrivateRichText = withDeprecations((0,external_wp_element_namespaceObject.forwardRef)(RichTextWrapper)); 68226 PrivateRichText.Content = Content; 68227 PrivateRichText.isEmpty = value => { 68228 return !value || value.length === 0; 68229 }; 68230 68231 // This is the public API for the RichText component. 68232 // We wrap the PrivateRichText component to hide some props from the public API. 68233 /** 68234 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/rich-text/README.md 68235 */ 68236 const PublicForwardedRichTextContainer = (0,external_wp_element_namespaceObject.forwardRef)((props, ref) => { 68237 const context = useBlockEditContext(); 68238 const isPreviewMode = context[isPreviewModeKey]; 68239 if (isPreviewMode) { 68240 // Remove all non-content props. 68241 const { 68242 children, 68243 tagName: Tag = 'div', 68244 value, 68245 onChange, 68246 isSelected, 68247 multiline, 68248 inlineToolbar, 68249 wrapperClassName, 68250 autocompleters, 68251 onReplace, 68252 placeholder, 68253 allowedFormats, 68254 withoutInteractiveFormatting, 68255 onRemove, 68256 onMerge, 68257 onSplit, 68258 __unstableOnSplitAtEnd, 68259 __unstableOnSplitAtDoubleLineEnd, 68260 identifier, 68261 preserveWhiteSpace, 68262 __unstablePastePlainText, 68263 __unstableEmbedURLOnPaste, 68264 __unstableDisableFormats, 68265 disableLineBreaks, 68266 __unstableAllowPrefixTransformations, 68267 readOnly, 68268 ...contentProps 68269 } = removeNativeProps(props); 68270 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tag, { 68271 ...contentProps, 68272 dangerouslySetInnerHTML: { 68273 __html: valueToHTMLString(value, multiline) 68274 } 68275 }); 68276 } 68277 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateRichText, { 68278 ref: ref, 68279 ...props, 68280 readOnly: false 68281 }); 68282 }); 68283 PublicForwardedRichTextContainer.Content = Content; 68284 PublicForwardedRichTextContainer.isEmpty = value => { 68285 return !value || value.length === 0; 68286 }; 68287 /* harmony default export */ const rich_text = (PublicForwardedRichTextContainer); 68288 68289 68290 68291 68292 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/editable-text/index.js 68293 /** 68294 * WordPress dependencies 68295 */ 68296 68297 68298 /** 68299 * Internal dependencies 68300 */ 68301 68302 68303 const EditableText = (0,external_wp_element_namespaceObject.forwardRef)((props, ref) => { 68304 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(rich_text, { 68305 ref: ref, 68306 ...props, 68307 __unstableDisableFormats: true 68308 }); 68309 }); 68310 EditableText.Content = ({ 68311 value = '', 68312 tagName: Tag = 'div', 68313 ...props 68314 }) => { 68315 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tag, { 68316 ...props, 68317 children: value 68318 }); 68319 }; 68320 68321 /** 68322 * Renders an editable text input in which text formatting is not allowed. 68323 */ 68324 /* harmony default export */ const editable_text = (EditableText); 68325 68326 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/plain-text/index.js 68327 /** 68328 * External dependencies 68329 */ 68330 68331 68332 68333 /** 68334 * WordPress dependencies 68335 */ 68336 68337 68338 /** 68339 * Internal dependencies 68340 */ 68341 68342 68343 /** 68344 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/plain-text/README.md 68345 */ 68346 68347 const PlainText = (0,external_wp_element_namespaceObject.forwardRef)(({ 68348 __experimentalVersion, 68349 ...props 68350 }, ref) => { 68351 if (__experimentalVersion === 2) { 68352 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(editable_text, { 68353 ref: ref, 68354 ...props 68355 }); 68356 } 68357 const { 68358 className, 68359 onChange, 68360 ...remainingProps 68361 } = props; 68362 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(lib/* default */.A, { 68363 ref: ref, 68364 className: dist_clsx('block-editor-plain-text', className), 68365 onChange: event => onChange(event.target.value), 68366 ...remainingProps 68367 }); 68368 }); 68369 /* harmony default export */ const plain_text = (PlainText); 68370 68371 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/responsive-block-control/label.js 68372 /** 68373 * WordPress dependencies 68374 */ 68375 68376 68377 68378 68379 68380 68381 function ResponsiveBlockControlLabel({ 68382 property, 68383 viewport, 68384 desc 68385 }) { 68386 const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(ResponsiveBlockControlLabel); 68387 const accessibleLabel = desc || (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: 1: property name. 2: viewport name. */ 68388 (0,external_wp_i18n_namespaceObject._x)('Controls the %1$s property for %2$s viewports.', 'Text labelling a interface as controlling a given layout property (eg: margin) for a given screen size.'), property, viewport.label); 68389 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 68390 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 68391 "aria-describedby": `rbc-desc-$instanceId}`, 68392 children: viewport.label 68393 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, { 68394 as: "span", 68395 id: `rbc-desc-$instanceId}`, 68396 children: accessibleLabel 68397 })] 68398 }); 68399 } 68400 68401 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/responsive-block-control/index.js 68402 /** 68403 * External dependencies 68404 */ 68405 68406 68407 /** 68408 * WordPress dependencies 68409 */ 68410 68411 68412 68413 68414 /** 68415 * Internal dependencies 68416 */ 68417 68418 68419 68420 function ResponsiveBlockControl(props) { 68421 const { 68422 title, 68423 property, 68424 toggleLabel, 68425 onIsResponsiveChange, 68426 renderDefaultControl, 68427 renderResponsiveControls, 68428 isResponsive = false, 68429 defaultLabel = { 68430 id: 'all', 68431 label: (0,external_wp_i18n_namespaceObject._x)('All', 'screen sizes') 68432 }, 68433 viewports = [{ 68434 id: 'small', 68435 label: (0,external_wp_i18n_namespaceObject.__)('Small screens') 68436 }, { 68437 id: 'medium', 68438 label: (0,external_wp_i18n_namespaceObject.__)('Medium screens') 68439 }, { 68440 id: 'large', 68441 label: (0,external_wp_i18n_namespaceObject.__)('Large screens') 68442 }] 68443 } = props; 68444 if (!title || !property || !renderDefaultControl) { 68445 return null; 68446 } 68447 const toggleControlLabel = toggleLabel || (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: Property value for the control (eg: margin, padding, etc.). */ 68448 (0,external_wp_i18n_namespaceObject.__)('Use the same %s on all screen sizes.'), property); 68449 const toggleHelpText = (0,external_wp_i18n_namespaceObject.__)('Toggle between using the same value for all screen sizes or using a unique value per screen size.'); 68450 const defaultControl = renderDefaultControl( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ResponsiveBlockControlLabel, { 68451 property: property, 68452 viewport: defaultLabel 68453 }), defaultLabel); 68454 const defaultResponsiveControls = () => { 68455 return viewports.map(viewport => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_element_namespaceObject.Fragment, { 68456 children: renderDefaultControl( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ResponsiveBlockControlLabel, { 68457 property: property, 68458 viewport: viewport 68459 }), viewport) 68460 }, viewport.id)); 68461 }; 68462 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { 68463 className: "block-editor-responsive-block-control", 68464 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("legend", { 68465 className: "block-editor-responsive-block-control__title", 68466 children: title 68467 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 68468 className: "block-editor-responsive-block-control__inner", 68469 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 68470 __nextHasNoMarginBottom: true, 68471 className: "block-editor-responsive-block-control__toggle", 68472 label: toggleControlLabel, 68473 checked: !isResponsive, 68474 onChange: onIsResponsiveChange, 68475 help: toggleHelpText 68476 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 68477 className: dist_clsx('block-editor-responsive-block-control__group', { 68478 'is-responsive': isResponsive 68479 }), 68480 children: [!isResponsive && defaultControl, isResponsive && (renderResponsiveControls ? renderResponsiveControls(viewports) : defaultResponsiveControls())] 68481 })] 68482 })] 68483 }); 68484 } 68485 /* harmony default export */ const responsive_block_control = (ResponsiveBlockControl); 68486 68487 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/shortcut.js 68488 /** 68489 * WordPress dependencies 68490 */ 68491 68492 68493 68494 /** 68495 * Internal dependencies 68496 */ 68497 68498 function RichTextShortcut({ 68499 character, 68500 type, 68501 onUse 68502 }) { 68503 const keyboardShortcuts = (0,external_wp_element_namespaceObject.useContext)(keyboardShortcutContext); 68504 const onUseRef = (0,external_wp_element_namespaceObject.useRef)(); 68505 onUseRef.current = onUse; 68506 (0,external_wp_element_namespaceObject.useEffect)(() => { 68507 function callback(event) { 68508 if (external_wp_keycodes_namespaceObject.isKeyboardEvent[type](event, character)) { 68509 onUseRef.current(); 68510 event.preventDefault(); 68511 } 68512 } 68513 keyboardShortcuts.current.add(callback); 68514 return () => { 68515 keyboardShortcuts.current.delete(callback); 68516 }; 68517 }, [character, type]); 68518 return null; 68519 } 68520 68521 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/toolbar-button.js 68522 /** 68523 * WordPress dependencies 68524 */ 68525 68526 68527 68528 function RichTextToolbarButton({ 68529 name, 68530 shortcutType, 68531 shortcutCharacter, 68532 ...props 68533 }) { 68534 let shortcut; 68535 let fillName = 'RichText.ToolbarControls'; 68536 if (name) { 68537 fillName += `.$name}`; 68538 } 68539 if (shortcutType && shortcutCharacter) { 68540 shortcut = external_wp_keycodes_namespaceObject.displayShortcut[shortcutType](shortcutCharacter); 68541 } 68542 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Fill, { 68543 name: fillName, 68544 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 68545 ...props, 68546 shortcut: shortcut 68547 }) 68548 }); 68549 } 68550 68551 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/input-event.js 68552 /** 68553 * WordPress dependencies 68554 */ 68555 68556 68557 /** 68558 * Internal dependencies 68559 */ 68560 68561 function __unstableRichTextInputEvent({ 68562 inputType, 68563 onInput 68564 }) { 68565 const callbacks = (0,external_wp_element_namespaceObject.useContext)(inputEventContext); 68566 const onInputRef = (0,external_wp_element_namespaceObject.useRef)(); 68567 onInputRef.current = onInput; 68568 (0,external_wp_element_namespaceObject.useEffect)(() => { 68569 function callback(event) { 68570 if (event.inputType === inputType) { 68571 onInputRef.current(); 68572 event.preventDefault(); 68573 } 68574 } 68575 callbacks.current.add(callback); 68576 return () => { 68577 callbacks.current.delete(callback); 68578 }; 68579 }, [inputType]); 68580 return null; 68581 } 68582 68583 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/tool-selector/index.js 68584 /** 68585 * WordPress dependencies 68586 */ 68587 68588 68589 68590 68591 68592 68593 /** 68594 * Internal dependencies 68595 */ 68596 68597 68598 68599 68600 68601 const selectIcon = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SVG, { 68602 xmlns: "http://www.w3.org/2000/svg", 68603 width: "24", 68604 height: "24", 68605 viewBox: "0 0 24 24", 68606 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Path, { 68607 d: "M9.4 20.5L5.2 3.8l14.6 9-2 .3c-.2 0-.4.1-.7.1-.9.2-1.6.3-2.2.5-.8.3-1.4.5-1.8.8-.4.3-.8.8-1.3 1.5-.4.5-.8 1.2-1.2 2l-.3.6-.9 1.9zM7.6 7.1l2.4 9.3c.2-.4.5-.8.7-1.1.6-.8 1.1-1.4 1.6-1.8.5-.4 1.3-.8 2.2-1.1l1.2-.3-8.1-5z" 68608 }) 68609 }); 68610 function ToolSelector(props, ref) { 68611 const mode = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).__unstableGetEditorMode(), []); 68612 const { 68613 resetZoomLevel, 68614 __unstableSetEditorMode 68615 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 68616 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Dropdown, { 68617 renderToggle: ({ 68618 isOpen, 68619 onToggle 68620 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 68621 size: "compact", 68622 ...props, 68623 ref: ref, 68624 icon: mode === 'navigation' ? selectIcon : edit, 68625 "aria-expanded": isOpen, 68626 "aria-haspopup": "true", 68627 onClick: onToggle 68628 /* translators: button label text should, if possible, be under 16 characters. */, 68629 label: (0,external_wp_i18n_namespaceObject.__)('Tools') 68630 }), 68631 popoverProps: { 68632 placement: 'bottom-start' 68633 }, 68634 renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 68635 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.NavigableMenu, { 68636 role: "menu", 68637 "aria-label": (0,external_wp_i18n_namespaceObject.__)('Tools'), 68638 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItemsChoice, { 68639 value: mode === 'navigation' ? 'navigation' : 'edit', 68640 onSelect: newMode => { 68641 resetZoomLevel(); 68642 __unstableSetEditorMode(newMode); 68643 }, 68644 choices: [{ 68645 value: 'edit', 68646 label: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 68647 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 68648 icon: edit 68649 }), (0,external_wp_i18n_namespaceObject.__)('Edit')] 68650 }) 68651 }, { 68652 value: 'navigation', 68653 label: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 68654 children: [selectIcon, (0,external_wp_i18n_namespaceObject.__)('Select')] 68655 }) 68656 }] 68657 }) 68658 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 68659 className: "block-editor-tool-selector__help", 68660 children: (0,external_wp_i18n_namespaceObject.__)('Tools provide different interactions for selecting, navigating, and editing blocks. Toggle between select and edit by pressing Escape and Enter.') 68661 })] 68662 }) 68663 }); 68664 } 68665 /* harmony default export */ const tool_selector = ((0,external_wp_element_namespaceObject.forwardRef)(ToolSelector)); 68666 68667 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/unit-control/index.js 68668 /** 68669 * WordPress dependencies 68670 */ 68671 68672 68673 /** 68674 * Internal dependencies 68675 */ 68676 68677 68678 function UnitControl({ 68679 units: unitsProp, 68680 ...props 68681 }) { 68682 const [availableUnits] = use_settings_useSettings('spacing.units'); 68683 const units = (0,external_wp_components_namespaceObject.__experimentalUseCustomUnits)({ 68684 availableUnits: availableUnits || ['%', 'px', 'em', 'rem', 'vw'], 68685 units: unitsProp 68686 }); 68687 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 68688 units: units, 68689 ...props 68690 }); 68691 } 68692 68693 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/arrow-left.js 68694 /** 68695 * WordPress dependencies 68696 */ 68697 68698 68699 const arrowLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 68700 xmlns: "http://www.w3.org/2000/svg", 68701 viewBox: "0 0 24 24", 68702 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 68703 d: "M20 11.2H6.8l3.7-3.7-1-1L3.9 12l5.6 5.5 1-1-3.7-3.7H20z" 68704 }) 68705 }); 68706 /* harmony default export */ const arrow_left = (arrowLeft); 68707 68708 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/url-input/button.js 68709 /** 68710 * WordPress dependencies 68711 */ 68712 68713 68714 68715 68716 68717 /** 68718 * Internal dependencies 68719 */ 68720 68721 68722 68723 class URLInputButton extends external_wp_element_namespaceObject.Component { 68724 constructor() { 68725 super(...arguments); 68726 this.toggle = this.toggle.bind(this); 68727 this.submitLink = this.submitLink.bind(this); 68728 this.state = { 68729 expanded: false 68730 }; 68731 } 68732 toggle() { 68733 this.setState({ 68734 expanded: !this.state.expanded 68735 }); 68736 } 68737 submitLink(event) { 68738 event.preventDefault(); 68739 this.toggle(); 68740 } 68741 render() { 68742 const { 68743 url, 68744 onChange 68745 } = this.props; 68746 const { 68747 expanded 68748 } = this.state; 68749 const buttonLabel = url ? (0,external_wp_i18n_namespaceObject.__)('Edit link') : (0,external_wp_i18n_namespaceObject.__)('Insert link'); 68750 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 68751 className: "block-editor-url-input__button", 68752 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 68753 size: "compact", 68754 icon: library_link, 68755 label: buttonLabel, 68756 onClick: this.toggle, 68757 className: "components-toolbar__control", 68758 isPressed: !!url 68759 }), expanded && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("form", { 68760 className: "block-editor-url-input__button-modal", 68761 onSubmit: this.submitLink, 68762 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 68763 className: "block-editor-url-input__button-modal-line", 68764 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 68765 __next40pxDefaultSize: true, 68766 className: "block-editor-url-input__back", 68767 icon: arrow_left, 68768 label: (0,external_wp_i18n_namespaceObject.__)('Close'), 68769 onClick: this.toggle 68770 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(url_input, { 68771 value: url || '', 68772 onChange: onChange, 68773 suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalInputControlSuffixWrapper, { 68774 variant: "control", 68775 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 68776 size: "small", 68777 icon: keyboard_return, 68778 label: (0,external_wp_i18n_namespaceObject.__)('Submit'), 68779 type: "submit" 68780 }) 68781 }) 68782 })] 68783 }) 68784 })] 68785 }); 68786 } 68787 } 68788 68789 /** 68790 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/url-input/README.md 68791 */ 68792 /* harmony default export */ const url_input_button = (URLInputButton); 68793 68794 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/image.js 68795 /** 68796 * WordPress dependencies 68797 */ 68798 68799 68800 const image_image = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 68801 viewBox: "0 0 24 24", 68802 xmlns: "http://www.w3.org/2000/svg", 68803 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 68804 d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM5 4.5h14c.3 0 .5.2.5.5v8.4l-3-2.9c-.3-.3-.8-.3-1 0L11.9 14 9 12c-.3-.2-.6-.2-.8 0l-3.6 2.6V5c-.1-.3.1-.5.4-.5zm14 15H5c-.3 0-.5-.2-.5-.5v-2.4l4.1-3 3 1.9c.3.2.7.2.9-.1L16 12l3.5 3.4V19c0 .3-.2.5-.5.5z" 68805 }) 68806 }); 68807 /* harmony default export */ const library_image = (image_image); 68808 68809 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/url-popover/image-url-input-ui.js 68810 /** 68811 * WordPress dependencies 68812 */ 68813 68814 68815 68816 68817 68818 68819 /** 68820 * Internal dependencies 68821 */ 68822 68823 68824 68825 68826 const LINK_DESTINATION_NONE = 'none'; 68827 const LINK_DESTINATION_CUSTOM = 'custom'; 68828 const LINK_DESTINATION_MEDIA = 'media'; 68829 const LINK_DESTINATION_ATTACHMENT = 'attachment'; 68830 const NEW_TAB_REL = ['noreferrer', 'noopener']; 68831 const ImageURLInputUI = ({ 68832 linkDestination, 68833 onChangeUrl, 68834 url, 68835 mediaType = 'image', 68836 mediaUrl, 68837 mediaLink, 68838 linkTarget, 68839 linkClass, 68840 rel, 68841 showLightboxSetting, 68842 lightboxEnabled, 68843 onSetLightbox, 68844 resetLightbox 68845 }) => { 68846 const [isOpen, setIsOpen] = (0,external_wp_element_namespaceObject.useState)(false); 68847 // Use internal state instead of a ref to make sure that the component 68848 // re-renders when the popover's anchor updates. 68849 const [popoverAnchor, setPopoverAnchor] = (0,external_wp_element_namespaceObject.useState)(null); 68850 const openLinkUI = () => { 68851 setIsOpen(true); 68852 }; 68853 const [isEditingLink, setIsEditingLink] = (0,external_wp_element_namespaceObject.useState)(false); 68854 const [urlInput, setUrlInput] = (0,external_wp_element_namespaceObject.useState)(null); 68855 const autocompleteRef = (0,external_wp_element_namespaceObject.useRef)(null); 68856 const wrapperRef = (0,external_wp_element_namespaceObject.useRef)(); 68857 (0,external_wp_element_namespaceObject.useEffect)(() => { 68858 if (!wrapperRef.current) { 68859 return; 68860 } 68861 const nextFocusTarget = external_wp_dom_namespaceObject.focus.focusable.find(wrapperRef.current)[0] || wrapperRef.current; 68862 nextFocusTarget.focus(); 68863 }, [isEditingLink, url, lightboxEnabled]); 68864 const startEditLink = () => { 68865 if (linkDestination === LINK_DESTINATION_MEDIA || linkDestination === LINK_DESTINATION_ATTACHMENT) { 68866 setUrlInput(''); 68867 } 68868 setIsEditingLink(true); 68869 }; 68870 const stopEditLink = () => { 68871 setIsEditingLink(false); 68872 }; 68873 const closeLinkUI = () => { 68874 setUrlInput(null); 68875 stopEditLink(); 68876 setIsOpen(false); 68877 }; 68878 const getUpdatedLinkTargetSettings = value => { 68879 const newLinkTarget = value ? '_blank' : undefined; 68880 let updatedRel; 68881 if (newLinkTarget) { 68882 const rels = (rel !== null && rel !== void 0 ? rel : '').split(' '); 68883 NEW_TAB_REL.forEach(relVal => { 68884 if (!rels.includes(relVal)) { 68885 rels.push(relVal); 68886 } 68887 }); 68888 updatedRel = rels.join(' '); 68889 } else { 68890 const rels = (rel !== null && rel !== void 0 ? rel : '').split(' ').filter(relVal => NEW_TAB_REL.includes(relVal) === false); 68891 updatedRel = rels.length ? rels.join(' ') : undefined; 68892 } 68893 return { 68894 linkTarget: newLinkTarget, 68895 rel: updatedRel 68896 }; 68897 }; 68898 const onFocusOutside = () => { 68899 return event => { 68900 // The autocomplete suggestions list renders in a separate popover (in a portal), 68901 // so onFocusOutside fails to detect that a click on a suggestion occurred in the 68902 // LinkContainer. Detect clicks on autocomplete suggestions using a ref here, and 68903 // return to avoid the popover being closed. 68904 const autocompleteElement = autocompleteRef.current; 68905 if (autocompleteElement && autocompleteElement.contains(event.target)) { 68906 return; 68907 } 68908 setIsOpen(false); 68909 setUrlInput(null); 68910 stopEditLink(); 68911 }; 68912 }; 68913 const onSubmitLinkChange = () => { 68914 return event => { 68915 if (urlInput) { 68916 // It is possible the entered URL actually matches a named link destination. 68917 // This check will ensure our link destination is correct. 68918 const selectedDestination = getLinkDestinations().find(destination => destination.url === urlInput)?.linkDestination || LINK_DESTINATION_CUSTOM; 68919 onChangeUrl({ 68920 href: urlInput, 68921 linkDestination: selectedDestination, 68922 lightbox: { 68923 enabled: false 68924 } 68925 }); 68926 } 68927 stopEditLink(); 68928 setUrlInput(null); 68929 event.preventDefault(); 68930 }; 68931 }; 68932 const onLinkRemove = () => { 68933 onChangeUrl({ 68934 linkDestination: LINK_DESTINATION_NONE, 68935 href: '' 68936 }); 68937 }; 68938 const getLinkDestinations = () => { 68939 const linkDestinations = [{ 68940 linkDestination: LINK_DESTINATION_MEDIA, 68941 title: (0,external_wp_i18n_namespaceObject.__)('Link to image file'), 68942 url: mediaType === 'image' ? mediaUrl : undefined, 68943 icon: library_image 68944 }]; 68945 if (mediaType === 'image' && mediaLink) { 68946 linkDestinations.push({ 68947 linkDestination: LINK_DESTINATION_ATTACHMENT, 68948 title: (0,external_wp_i18n_namespaceObject.__)('Link to attachment page'), 68949 url: mediaType === 'image' ? mediaLink : undefined, 68950 icon: library_page 68951 }); 68952 } 68953 return linkDestinations; 68954 }; 68955 const onSetHref = value => { 68956 const linkDestinations = getLinkDestinations(); 68957 let linkDestinationInput; 68958 if (!value) { 68959 linkDestinationInput = LINK_DESTINATION_NONE; 68960 } else { 68961 linkDestinationInput = (linkDestinations.find(destination => { 68962 return destination.url === value; 68963 }) || { 68964 linkDestination: LINK_DESTINATION_CUSTOM 68965 }).linkDestination; 68966 } 68967 onChangeUrl({ 68968 linkDestination: linkDestinationInput, 68969 href: value 68970 }); 68971 }; 68972 const onSetNewTab = value => { 68973 const updatedLinkTarget = getUpdatedLinkTargetSettings(value); 68974 onChangeUrl(updatedLinkTarget); 68975 }; 68976 const onSetLinkRel = value => { 68977 onChangeUrl({ 68978 rel: value 68979 }); 68980 }; 68981 const onSetLinkClass = value => { 68982 onChangeUrl({ 68983 linkClass: value 68984 }); 68985 }; 68986 const advancedOptions = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 68987 spacing: "3", 68988 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 68989 __nextHasNoMarginBottom: true, 68990 label: (0,external_wp_i18n_namespaceObject.__)('Open in new tab'), 68991 onChange: onSetNewTab, 68992 checked: linkTarget === '_blank' 68993 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextControl, { 68994 __next40pxDefaultSize: true, 68995 __nextHasNoMarginBottom: true, 68996 label: (0,external_wp_i18n_namespaceObject.__)('Link rel'), 68997 value: rel !== null && rel !== void 0 ? rel : '', 68998 onChange: onSetLinkRel 68999 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextControl, { 69000 __next40pxDefaultSize: true, 69001 __nextHasNoMarginBottom: true, 69002 label: (0,external_wp_i18n_namespaceObject.__)('Link CSS class'), 69003 value: linkClass || '', 69004 onChange: onSetLinkClass 69005 })] 69006 }); 69007 const linkEditorValue = urlInput !== null ? urlInput : url; 69008 const hideLightboxPanel = !lightboxEnabled || lightboxEnabled && !showLightboxSetting; 69009 const showLinkEditor = !linkEditorValue && hideLightboxPanel; 69010 const urlLabel = (getLinkDestinations().find(destination => destination.linkDestination === linkDestination) || {}).title; 69011 const PopoverChildren = () => { 69012 if (lightboxEnabled && showLightboxSetting && !url && !isEditingLink) { 69013 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 69014 className: "block-editor-url-popover__expand-on-click", 69015 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { 69016 icon: library_fullscreen 69017 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 69018 className: "text", 69019 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 69020 children: (0,external_wp_i18n_namespaceObject.__)('Expand on click') 69021 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 69022 className: "description", 69023 children: (0,external_wp_i18n_namespaceObject.__)('Scales the image with a lightbox effect') 69024 })] 69025 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 69026 icon: link_off, 69027 label: (0,external_wp_i18n_namespaceObject.__)('Disable expand on click'), 69028 onClick: () => { 69029 onSetLightbox?.(false); 69030 }, 69031 size: "compact" 69032 })] 69033 }); 69034 } else if (!url || isEditingLink) { 69035 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(url_popover.LinkEditor, { 69036 className: "block-editor-format-toolbar__link-container-content", 69037 value: linkEditorValue, 69038 onChangeInputValue: setUrlInput, 69039 onSubmit: onSubmitLinkChange(), 69040 autocompleteRef: autocompleteRef 69041 }); 69042 } else if (url && !isEditingLink) { 69043 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 69044 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(url_popover.LinkViewer, { 69045 className: "block-editor-format-toolbar__link-container-content", 69046 url: url, 69047 onEditLinkClick: startEditLink, 69048 urlLabel: urlLabel 69049 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 69050 icon: link_off, 69051 label: (0,external_wp_i18n_namespaceObject.__)('Remove link'), 69052 onClick: () => { 69053 onLinkRemove(); 69054 resetLightbox?.(); 69055 }, 69056 size: "compact" 69057 })] 69058 }); 69059 } 69060 }; 69061 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 69062 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, { 69063 icon: library_link, 69064 className: "components-toolbar__control", 69065 label: (0,external_wp_i18n_namespaceObject.__)('Link'), 69066 "aria-expanded": isOpen, 69067 onClick: openLinkUI, 69068 ref: setPopoverAnchor, 69069 isActive: !!url || lightboxEnabled && showLightboxSetting 69070 }), isOpen && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(url_popover, { 69071 ref: wrapperRef, 69072 anchor: popoverAnchor, 69073 onFocusOutside: onFocusOutside(), 69074 onClose: closeLinkUI, 69075 renderSettings: hideLightboxPanel ? () => advancedOptions : null, 69076 additionalControls: showLinkEditor && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.NavigableMenu, { 69077 children: [getLinkDestinations().map(link => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 69078 icon: link.icon, 69079 iconPosition: "left", 69080 onClick: () => { 69081 setUrlInput(null); 69082 onSetHref(link.url); 69083 stopEditLink(); 69084 }, 69085 children: link.title 69086 }, link.linkDestination)), showLightboxSetting && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuItem, { 69087 className: "block-editor-url-popover__expand-on-click", 69088 icon: library_fullscreen, 69089 info: (0,external_wp_i18n_namespaceObject.__)('Scale the image with a lightbox effect.'), 69090 iconPosition: "left", 69091 onClick: () => { 69092 setUrlInput(null); 69093 onChangeUrl({ 69094 linkDestination: LINK_DESTINATION_NONE, 69095 href: '' 69096 }); 69097 onSetLightbox?.(true); 69098 stopEditLink(); 69099 }, 69100 children: (0,external_wp_i18n_namespaceObject.__)('Expand on click') 69101 }, "expand-on-click")] 69102 }), 69103 offset: 13, 69104 children: PopoverChildren() 69105 })] 69106 }); 69107 }; 69108 69109 69110 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/preview-options/index.js 69111 /** 69112 * WordPress dependencies 69113 */ 69114 69115 function PreviewOptions() { 69116 external_wp_deprecated_default()('wp.blockEditor.PreviewOptions', { 69117 version: '6.5' 69118 }); 69119 return null; 69120 } 69121 69122 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-resize-canvas/index.js 69123 /** 69124 * WordPress dependencies 69125 */ 69126 69127 69128 /** 69129 * Function to resize the editor window. 69130 * 69131 * @param {string} deviceType Used for determining the size of the container (e.g. Desktop, Tablet, Mobile) 69132 * 69133 * @return {Object} Inline styles to be added to resizable container. 69134 */ 69135 function useResizeCanvas(deviceType) { 69136 const [actualWidth, updateActualWidth] = (0,external_wp_element_namespaceObject.useState)(window.innerWidth); 69137 (0,external_wp_element_namespaceObject.useEffect)(() => { 69138 if (deviceType === 'Desktop') { 69139 return; 69140 } 69141 const resizeListener = () => updateActualWidth(window.innerWidth); 69142 window.addEventListener('resize', resizeListener); 69143 return () => { 69144 window.removeEventListener('resize', resizeListener); 69145 }; 69146 }, [deviceType]); 69147 const getCanvasWidth = device => { 69148 let deviceWidth; 69149 switch (device) { 69150 case 'Tablet': 69151 deviceWidth = 780; 69152 break; 69153 case 'Mobile': 69154 deviceWidth = 360; 69155 break; 69156 default: 69157 return null; 69158 } 69159 return deviceWidth < actualWidth ? deviceWidth : actualWidth; 69160 }; 69161 const contentInlineStyles = device => { 69162 const height = device === 'Mobile' ? '768px' : '1024px'; 69163 const marginVertical = '40px'; 69164 const marginHorizontal = 'auto'; 69165 switch (device) { 69166 case 'Tablet': 69167 case 'Mobile': 69168 return { 69169 width: getCanvasWidth(device), 69170 // Keeping margin styles separate to avoid warnings 69171 // when those props get overridden in the iframe component 69172 marginTop: marginVertical, 69173 marginBottom: marginVertical, 69174 marginLeft: marginHorizontal, 69175 marginRight: marginHorizontal, 69176 height, 69177 overflowY: 'auto' 69178 }; 69179 default: 69180 return { 69181 marginLeft: marginHorizontal, 69182 marginRight: marginHorizontal 69183 }; 69184 } 69185 }; 69186 return contentInlineStyles(deviceType); 69187 } 69188 69189 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/skip-to-selected-block/index.js 69190 /** 69191 * WordPress dependencies 69192 */ 69193 69194 69195 69196 69197 69198 /** 69199 * Internal dependencies 69200 */ 69201 69202 69203 69204 /** 69205 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/skip-to-selected-block/README.md 69206 */ 69207 69208 function SkipToSelectedBlock() { 69209 const selectedBlockClientId = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getBlockSelectionStart(), []); 69210 const ref = (0,external_wp_element_namespaceObject.useRef)(); 69211 useBlockElementRef(selectedBlockClientId, ref); 69212 const onClick = () => { 69213 ref.current?.focus(); 69214 }; 69215 return selectedBlockClientId ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 69216 __next40pxDefaultSize: true, 69217 variant: "secondary", 69218 className: "block-editor-skip-to-selected-block", 69219 onClick: onClick, 69220 children: (0,external_wp_i18n_namespaceObject.__)('Skip to the selected block') 69221 }) : null; 69222 } 69223 69224 ;// CONCATENATED MODULE: external ["wp","wordcount"] 69225 const external_wp_wordcount_namespaceObject = window["wp"]["wordcount"]; 69226 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/multi-selection-inspector/index.js 69227 /** 69228 * WordPress dependencies 69229 */ 69230 69231 69232 69233 69234 69235 69236 /** 69237 * Internal dependencies 69238 */ 69239 69240 69241 69242 69243 function MultiSelectionInspector() { 69244 const { 69245 blocks 69246 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 69247 const { 69248 getMultiSelectedBlocks 69249 } = select(store); 69250 return { 69251 blocks: getMultiSelectedBlocks() 69252 }; 69253 }, []); 69254 const words = (0,external_wp_wordcount_namespaceObject.count)((0,external_wp_blocks_namespaceObject.serialize)(blocks), 'words'); 69255 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 69256 className: "block-editor-multi-selection-inspector__card", 69257 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 69258 icon: library_copy, 69259 showColors: true 69260 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 69261 className: "block-editor-multi-selection-inspector__card-content", 69262 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 69263 className: "block-editor-multi-selection-inspector__card-title", 69264 children: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of blocks */ 69265 (0,external_wp_i18n_namespaceObject._n)('%d Block', '%d Blocks', blocks.length), blocks.length) 69266 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 69267 className: "block-editor-multi-selection-inspector__card-description", 69268 children: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of words */ 69269 (0,external_wp_i18n_namespaceObject._n)('%d word selected.', '%d words selected.', words), words) 69270 })] 69271 })] 69272 }); 69273 } 69274 69275 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/cog.js 69276 /** 69277 * WordPress dependencies 69278 */ 69279 69280 69281 const cog = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 69282 xmlns: "http://www.w3.org/2000/svg", 69283 viewBox: "0 0 24 24", 69284 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 69285 fillRule: "evenodd", 69286 d: "M10.289 4.836A1 1 0 0111.275 4h1.306a1 1 0 01.987.836l.244 1.466c.787.26 1.503.679 2.108 1.218l1.393-.522a1 1 0 011.216.437l.653 1.13a1 1 0 01-.23 1.273l-1.148.944a6.025 6.025 0 010 2.435l1.149.946a1 1 0 01.23 1.272l-.653 1.13a1 1 0 01-1.216.437l-1.394-.522c-.605.54-1.32.958-2.108 1.218l-.244 1.466a1 1 0 01-.987.836h-1.306a1 1 0 01-.986-.836l-.244-1.466a5.995 5.995 0 01-2.108-1.218l-1.394.522a1 1 0 01-1.217-.436l-.653-1.131a1 1 0 01.23-1.272l1.149-.946a6.026 6.026 0 010-2.435l-1.148-.944a1 1 0 01-.23-1.272l.653-1.131a1 1 0 011.217-.437l1.393.522a5.994 5.994 0 012.108-1.218l.244-1.466zM14.929 12a3 3 0 11-6 0 3 3 0 016 0z", 69287 clipRule: "evenodd" 69288 }) 69289 }); 69290 /* harmony default export */ const library_cog = (cog); 69291 69292 ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/styles.js 69293 /** 69294 * WordPress dependencies 69295 */ 69296 69297 69298 const styles = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { 69299 viewBox: "0 0 24 24", 69300 xmlns: "http://www.w3.org/2000/svg", 69301 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { 69302 fillRule: "evenodd", 69303 clipRule: "evenodd", 69304 d: "M20 12a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-1.5 0a6.5 6.5 0 0 1-6.5 6.5v-13a6.5 6.5 0 0 1 6.5 6.5Z" 69305 }) 69306 }); 69307 /* harmony default export */ const library_styles = (styles); 69308 69309 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls-tabs/utils.js 69310 /** 69311 * WordPress dependencies 69312 */ 69313 69314 69315 const TAB_SETTINGS = { 69316 name: 'settings', 69317 title: (0,external_wp_i18n_namespaceObject.__)('Settings'), 69318 value: 'settings', 69319 icon: library_cog, 69320 className: 'block-editor-block-inspector__tab-item' 69321 }; 69322 const TAB_STYLES = { 69323 name: 'styles', 69324 title: (0,external_wp_i18n_namespaceObject.__)('Styles'), 69325 value: 'styles', 69326 icon: library_styles, 69327 className: 'block-editor-block-inspector__tab-item' 69328 }; 69329 const TAB_LIST_VIEW = { 69330 name: 'list', 69331 title: (0,external_wp_i18n_namespaceObject.__)('List View'), 69332 value: 'list-view', 69333 icon: list_view, 69334 className: 'block-editor-block-inspector__tab-item' 69335 }; 69336 69337 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls-tabs/advanced-controls-panel.js 69338 /** 69339 * WordPress dependencies 69340 */ 69341 69342 69343 69344 /** 69345 * Internal dependencies 69346 */ 69347 69348 69349 const AdvancedControls = () => { 69350 const fills = (0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(InspectorAdvancedControls.slotName); 69351 const hasFills = Boolean(fills && fills.length); 69352 if (!hasFills) { 69353 return null; 69354 } 69355 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.PanelBody, { 69356 className: "block-editor-block-inspector__advanced", 69357 title: (0,external_wp_i18n_namespaceObject.__)('Advanced'), 69358 initialOpen: false, 69359 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69360 group: "advanced" 69361 }) 69362 }); 69363 }; 69364 /* harmony default export */ const advanced_controls_panel = (AdvancedControls); 69365 69366 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls-tabs/position-controls-panel.js 69367 /** 69368 * WordPress dependencies 69369 */ 69370 69371 69372 69373 69374 69375 /** 69376 * Internal dependencies 69377 */ 69378 69379 69380 69381 69382 const PositionControlsPanel = () => { 69383 const [initialOpen, setInitialOpen] = (0,external_wp_element_namespaceObject.useState)(); 69384 69385 // Determine whether the panel should be expanded. 69386 const { 69387 multiSelectedBlocks 69388 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 69389 const { 69390 getBlocksByClientId, 69391 getSelectedBlockClientIds 69392 } = select(store); 69393 const clientIds = getSelectedBlockClientIds(); 69394 return { 69395 multiSelectedBlocks: getBlocksByClientId(clientIds) 69396 }; 69397 }, []); 69398 (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { 69399 // If any selected block has a position set, open the panel by default. 69400 // The first block's value will still be used within the control though. 69401 if (initialOpen === undefined) { 69402 setInitialOpen(multiSelectedBlocks.some(({ 69403 attributes 69404 }) => !!attributes?.style?.position?.type)); 69405 } 69406 }, [initialOpen, multiSelectedBlocks, setInitialOpen]); 69407 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.PanelBody, { 69408 className: "block-editor-block-inspector__position", 69409 title: (0,external_wp_i18n_namespaceObject.__)('Position'), 69410 initialOpen: initialOpen !== null && initialOpen !== void 0 ? initialOpen : false, 69411 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69412 group: "position" 69413 }) 69414 }); 69415 }; 69416 const PositionControls = () => { 69417 const fills = (0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(inspector_controls_groups.position.Slot.__unstableName); 69418 const hasFills = Boolean(fills && fills.length); 69419 if (!hasFills) { 69420 return null; 69421 } 69422 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PositionControlsPanel, {}); 69423 }; 69424 /* harmony default export */ const position_controls_panel = (PositionControls); 69425 69426 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls-tabs/settings-tab.js 69427 /** 69428 * Internal dependencies 69429 */ 69430 69431 69432 69433 69434 69435 69436 const SettingsTab = ({ 69437 showAdvancedControls = false 69438 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 69439 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(position_controls_panel, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69440 group: "bindings" 69441 }), showAdvancedControls && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 69442 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(advanced_controls_panel, {}) 69443 })] 69444 }); 69445 /* harmony default export */ const settings_tab = (SettingsTab); 69446 69447 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls-tabs/styles-tab.js 69448 /** 69449 * WordPress dependencies 69450 */ 69451 69452 69453 69454 /** 69455 * Internal dependencies 69456 */ 69457 69458 69459 69460 69461 69462 69463 const StylesTab = ({ 69464 blockName, 69465 clientId, 69466 hasBlockStyles 69467 }) => { 69468 const borderPanelLabel = useBorderPanelLabel({ 69469 blockName 69470 }); 69471 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 69472 children: [hasBlockStyles && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 69473 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.PanelBody, { 69474 title: (0,external_wp_i18n_namespaceObject.__)('Styles'), 69475 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_styles, { 69476 clientId: clientId 69477 }) 69478 }) 69479 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69480 group: "color", 69481 label: (0,external_wp_i18n_namespaceObject.__)('Color'), 69482 className: "color-block-support-panel__inner-wrapper" 69483 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69484 group: "background", 69485 label: (0,external_wp_i18n_namespaceObject.__)('Background image') 69486 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69487 group: "filter" 69488 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69489 group: "typography", 69490 label: (0,external_wp_i18n_namespaceObject.__)('Typography') 69491 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69492 group: "dimensions", 69493 label: (0,external_wp_i18n_namespaceObject.__)('Dimensions') 69494 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69495 group: "border", 69496 label: borderPanelLabel 69497 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69498 group: "styles" 69499 })] 69500 }); 69501 }; 69502 /* harmony default export */ const styles_tab = (StylesTab); 69503 69504 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls-tabs/use-is-list-view-tab-disabled.js 69505 // List view tab restricts the blocks that may render to it via the 69506 // allowlist below. 69507 const allowlist = ['core/navigation']; 69508 const useIsListViewTabDisabled = blockName => { 69509 return !allowlist.includes(blockName); 69510 }; 69511 /* harmony default export */ const use_is_list_view_tab_disabled = (useIsListViewTabDisabled); 69512 69513 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls-tabs/index.js 69514 /** 69515 * WordPress dependencies 69516 */ 69517 69518 69519 69520 69521 /** 69522 * Internal dependencies 69523 */ 69524 69525 69526 69527 69528 69529 69530 69531 69532 const { 69533 Tabs: inspector_controls_tabs_Tabs 69534 } = unlock(external_wp_components_namespaceObject.privateApis); 69535 function InspectorControlsTabs({ 69536 blockName, 69537 clientId, 69538 hasBlockStyles, 69539 tabs 69540 }) { 69541 const showIconLabels = (0,external_wp_data_namespaceObject.useSelect)(select => { 69542 return select(external_wp_preferences_namespaceObject.store).get('core', 'showIconLabels'); 69543 }, []); 69544 69545 // The tabs panel will mount before fills are rendered to the list view 69546 // slot. This means the list view tab isn't initially included in the 69547 // available tabs so the panel defaults selection to the settings tab 69548 // which at the time is the first tab. This check allows blocks known to 69549 // include the list view tab to set it as the tab selected by default. 69550 const initialTabName = !use_is_list_view_tab_disabled(blockName) ? TAB_LIST_VIEW.name : undefined; 69551 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 69552 className: "block-editor-block-inspector__tabs", 69553 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(inspector_controls_tabs_Tabs, { 69554 defaultTabId: initialTabName, 69555 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls_tabs_Tabs.TabList, { 69556 children: tabs.map(tab => showIconLabels ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls_tabs_Tabs.Tab, { 69557 tabId: tab.name, 69558 className: tab.className, 69559 children: tab.title 69560 }, tab.name) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tooltip, { 69561 text: tab.title, 69562 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls_tabs_Tabs.Tab, { 69563 tabId: tab.name, 69564 className: tab.className, 69565 "aria-label": tab.title, 69566 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Icon, { 69567 icon: tab.icon 69568 }) 69569 }) 69570 }, tab.name)) 69571 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls_tabs_Tabs.TabPanel, { 69572 tabId: TAB_SETTINGS.name, 69573 focusable: false, 69574 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(settings_tab, { 69575 showAdvancedControls: !!blockName 69576 }) 69577 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls_tabs_Tabs.TabPanel, { 69578 tabId: TAB_STYLES.name, 69579 focusable: false, 69580 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_tab, { 69581 blockName: blockName, 69582 clientId: clientId, 69583 hasBlockStyles: hasBlockStyles 69584 }) 69585 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls_tabs_Tabs.TabPanel, { 69586 tabId: TAB_LIST_VIEW.name, 69587 focusable: false, 69588 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69589 group: "list" 69590 }) 69591 })] 69592 }, clientId) 69593 }); 69594 } 69595 69596 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-controls-tabs/use-inspector-controls-tabs.js 69597 /** 69598 * WordPress dependencies 69599 */ 69600 69601 69602 69603 /** 69604 * Internal dependencies 69605 */ 69606 69607 69608 69609 69610 69611 const use_inspector_controls_tabs_EMPTY_ARRAY = []; 69612 function getShowTabs(blockName, tabSettings = {}) { 69613 // Block specific setting takes precedence over generic default. 69614 if (tabSettings[blockName] !== undefined) { 69615 return tabSettings[blockName]; 69616 } 69617 69618 // Use generic default if set over the Gutenberg experiment option. 69619 if (tabSettings.default !== undefined) { 69620 return tabSettings.default; 69621 } 69622 return true; 69623 } 69624 function useInspectorControlsTabs(blockName) { 69625 const tabs = []; 69626 const { 69627 bindings: bindingsGroup, 69628 border: borderGroup, 69629 color: colorGroup, 69630 default: defaultGroup, 69631 dimensions: dimensionsGroup, 69632 list: listGroup, 69633 position: positionGroup, 69634 styles: stylesGroup, 69635 typography: typographyGroup, 69636 effects: effectsGroup 69637 } = inspector_controls_groups; 69638 69639 // List View Tab: If there are any fills for the list group add that tab. 69640 const listViewDisabled = use_is_list_view_tab_disabled(blockName); 69641 const listFills = (0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(listGroup.Slot.__unstableName); 69642 const hasListFills = !listViewDisabled && !!listFills && listFills.length; 69643 69644 // Styles Tab: Add this tab if there are any fills for block supports 69645 // e.g. border, color, spacing, typography, etc. 69646 const styleFills = [...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(borderGroup.Slot.__unstableName) || []), ...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(colorGroup.Slot.__unstableName) || []), ...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(dimensionsGroup.Slot.__unstableName) || []), ...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(stylesGroup.Slot.__unstableName) || []), ...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(typographyGroup.Slot.__unstableName) || []), ...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(effectsGroup.Slot.__unstableName) || [])]; 69647 const hasStyleFills = styleFills.length; 69648 69649 // Settings Tab: If we don't have multiple tabs to display 69650 // (i.e. both list view and styles), check only the default and position 69651 // InspectorControls slots. If we have multiple tabs, we'll need to check 69652 // the advanced controls slot as well to ensure they are rendered. 69653 const advancedFills = [...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(InspectorAdvancedControls.slotName) || []), ...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(bindingsGroup.Slot.__unstableName) || [])]; 69654 const settingsFills = [...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(defaultGroup.Slot.__unstableName) || []), ...((0,external_wp_components_namespaceObject.__experimentalUseSlotFills)(positionGroup.Slot.__unstableName) || []), ...(hasListFills && hasStyleFills > 1 ? advancedFills : [])]; 69655 69656 // Add the tabs in the order that they will default to if available. 69657 // List View > Settings > Styles. 69658 if (hasListFills) { 69659 tabs.push(TAB_LIST_VIEW); 69660 } 69661 if (settingsFills.length) { 69662 tabs.push(TAB_SETTINGS); 69663 } 69664 if (hasStyleFills) { 69665 tabs.push(TAB_STYLES); 69666 } 69667 const tabSettings = (0,external_wp_data_namespaceObject.useSelect)(select => { 69668 return select(store).getSettings().blockInspectorTabs; 69669 }, []); 69670 const showTabs = getShowTabs(blockName, tabSettings); 69671 return showTabs ? tabs : use_inspector_controls_tabs_EMPTY_ARRAY; 69672 } 69673 69674 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-inspector/useBlockInspectorAnimationSettings.js 69675 /** 69676 * WordPress dependencies 69677 */ 69678 69679 69680 /** 69681 * Internal dependencies 69682 */ 69683 69684 function useBlockInspectorAnimationSettings(blockType) { 69685 return (0,external_wp_data_namespaceObject.useSelect)(select => { 69686 if (blockType) { 69687 const globalBlockInspectorAnimationSettings = select(store).getSettings().blockInspectorAnimation; 69688 69689 // Get the name of the block that will allow it's children to be animated. 69690 const animationParent = globalBlockInspectorAnimationSettings?.animationParent; 69691 69692 // Determine whether the animationParent block is a parent of the selected block. 69693 const { 69694 getSelectedBlockClientId, 69695 getBlockParentsByBlockName 69696 } = select(store); 69697 const _selectedBlockClientId = getSelectedBlockClientId(); 69698 const animationParentBlockClientId = getBlockParentsByBlockName(_selectedBlockClientId, animationParent, true)[0]; 69699 69700 // If the selected block is not a child of the animationParent block, 69701 // and not an animationParent block itself, don't animate. 69702 if (!animationParentBlockClientId && blockType.name !== animationParent) { 69703 return null; 69704 } 69705 return globalBlockInspectorAnimationSettings?.[blockType.name]; 69706 } 69707 return null; 69708 }, [blockType]); 69709 } 69710 69711 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-info-slot-fill/index.js 69712 /** 69713 * WordPress dependencies 69714 */ 69715 69716 69717 /** 69718 * Internal dependencies 69719 */ 69720 69721 69722 69723 const { 69724 createPrivateSlotFill 69725 } = unlock(external_wp_components_namespaceObject.privateApis); 69726 const { 69727 Fill: block_info_slot_fill_Fill, 69728 Slot: block_info_slot_fill_Slot 69729 } = createPrivateSlotFill('BlockInformation'); 69730 const BlockInfo = props => { 69731 const context = useBlockEditContext(); 69732 if (!context[mayDisplayControlsKey]) { 69733 return null; 69734 } 69735 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_info_slot_fill_Fill, { 69736 ...props 69737 }); 69738 }; 69739 BlockInfo.Slot = props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_info_slot_fill_Slot, { 69740 ...props 69741 }); 69742 /* harmony default export */ const block_info_slot_fill = (BlockInfo); 69743 69744 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-quick-navigation/index.js 69745 /** 69746 * WordPress dependencies 69747 */ 69748 69749 69750 69751 /** 69752 * Internal dependencies 69753 */ 69754 69755 69756 69757 69758 69759 69760 function BlockQuickNavigation({ 69761 clientIds, 69762 onSelect 69763 }) { 69764 if (!clientIds.length) { 69765 return null; 69766 } 69767 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalVStack, { 69768 spacing: 1, 69769 children: clientIds.map(clientId => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockQuickNavigationItem, { 69770 onSelect: onSelect, 69771 clientId: clientId 69772 }, clientId)) 69773 }); 69774 } 69775 function BlockQuickNavigationItem({ 69776 clientId, 69777 onSelect 69778 }) { 69779 const blockInformation = useBlockDisplayInformation(clientId); 69780 const blockTitle = useBlockDisplayTitle({ 69781 clientId, 69782 context: 'list-view' 69783 }); 69784 const { 69785 isSelected 69786 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 69787 const { 69788 isBlockSelected, 69789 hasSelectedInnerBlock 69790 } = select(store); 69791 return { 69792 isSelected: isBlockSelected(clientId) || hasSelectedInnerBlock(clientId, /* deep: */true) 69793 }; 69794 }, [clientId]); 69795 const { 69796 selectBlock 69797 } = (0,external_wp_data_namespaceObject.useDispatch)(store); 69798 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button 69799 // TODO: Switch to `true` (40px size) if possible 69800 , { 69801 __next40pxDefaultSize: false, 69802 isPressed: isSelected, 69803 onClick: async () => { 69804 await selectBlock(clientId); 69805 if (onSelect) { 69806 onSelect(clientId); 69807 } 69808 }, 69809 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, { 69810 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, { 69811 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, { 69812 icon: blockInformation?.icon 69813 }) 69814 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexBlock, { 69815 style: { 69816 textAlign: 'left' 69817 }, 69818 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, { 69819 children: blockTitle 69820 }) 69821 })] 69822 }) 69823 }); 69824 } 69825 69826 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-inspector/index.js 69827 /** 69828 * WordPress dependencies 69829 */ 69830 69831 69832 69833 69834 69835 /** 69836 * Internal dependencies 69837 */ 69838 69839 69840 69841 69842 69843 69844 69845 69846 69847 69848 69849 69850 69851 69852 69853 69854 69855 69856 69857 69858 function BlockStylesPanel({ 69859 clientId 69860 }) { 69861 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.PanelBody, { 69862 title: (0,external_wp_i18n_namespaceObject.__)('Styles'), 69863 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_styles, { 69864 clientId: clientId 69865 }) 69866 }); 69867 } 69868 function BlockInspectorLockedBlocks({ 69869 topLevelLockedBlock 69870 }) { 69871 const contentClientIds = (0,external_wp_data_namespaceObject.useSelect)(select => { 69872 const { 69873 getClientIdsOfDescendants, 69874 getBlockName, 69875 getBlockEditingMode 69876 } = select(store); 69877 return getClientIdsOfDescendants(topLevelLockedBlock).filter(clientId => getBlockName(clientId) !== 'core/list-item' && getBlockEditingMode(clientId) === 'contentOnly'); 69878 }, [topLevelLockedBlock]); 69879 const hasBlockStyles = (0,external_wp_data_namespaceObject.useSelect)(select => { 69880 const { 69881 getBlockName 69882 } = select(store); 69883 const { 69884 getBlockStyles 69885 } = select(external_wp_blocks_namespaceObject.store); 69886 return !!getBlockStyles(getBlockName(topLevelLockedBlock))?.length; 69887 }, [topLevelLockedBlock]); 69888 const blockInformation = useBlockDisplayInformation(topLevelLockedBlock); 69889 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 69890 className: "block-editor-block-inspector", 69891 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_card, { 69892 ...blockInformation, 69893 className: blockInformation.isSynced && 'is-synced' 69894 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_info_slot_fill.Slot, {}), hasBlockStyles && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockStylesPanel, { 69895 clientId: topLevelLockedBlock 69896 }), contentClientIds.length > 0 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.PanelBody, { 69897 title: (0,external_wp_i18n_namespaceObject.__)('Content'), 69898 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockQuickNavigation, { 69899 clientIds: contentClientIds 69900 }) 69901 })] 69902 }); 69903 } 69904 const BlockInspector = ({ 69905 showNoBlockSelectedMessage = true 69906 }) => { 69907 const { 69908 count, 69909 selectedBlockName, 69910 selectedBlockClientId, 69911 blockType, 69912 topLevelLockedBlock 69913 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 69914 const { 69915 getSelectedBlockClientId, 69916 getSelectedBlockCount, 69917 getBlockName, 69918 getContentLockingParent, 69919 getTemplateLock 69920 } = unlock(select(store)); 69921 const _selectedBlockClientId = getSelectedBlockClientId(); 69922 const _selectedBlockName = _selectedBlockClientId && getBlockName(_selectedBlockClientId); 69923 const _blockType = _selectedBlockName && (0,external_wp_blocks_namespaceObject.getBlockType)(_selectedBlockName); 69924 return { 69925 count: getSelectedBlockCount(), 69926 selectedBlockClientId: _selectedBlockClientId, 69927 selectedBlockName: _selectedBlockName, 69928 blockType: _blockType, 69929 topLevelLockedBlock: getContentLockingParent(_selectedBlockClientId) || (getTemplateLock(_selectedBlockClientId) === 'contentOnly' || _selectedBlockName === 'core/block' ? _selectedBlockClientId : undefined) 69930 }; 69931 }, []); 69932 const availableTabs = useInspectorControlsTabs(blockType?.name); 69933 const showTabs = availableTabs?.length > 1; 69934 69935 // The block inspector animation settings will be completely 69936 // removed in the future to create an API which allows the block 69937 // inspector to transition between what it 69938 // displays based on the relationship between the selected block 69939 // and its parent, and only enable it if the parent is controlling 69940 // its children blocks. 69941 const blockInspectorAnimationSettings = useBlockInspectorAnimationSettings(blockType); 69942 const borderPanelLabel = useBorderPanelLabel({ 69943 blockName: selectedBlockName 69944 }); 69945 if (count > 1) { 69946 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 69947 className: "block-editor-block-inspector", 69948 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MultiSelectionInspector, {}), showTabs ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InspectorControlsTabs, { 69949 tabs: availableTabs 69950 }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 69951 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69952 group: "color", 69953 label: (0,external_wp_i18n_namespaceObject.__)('Color'), 69954 className: "color-block-support-panel__inner-wrapper" 69955 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69956 group: "background", 69957 label: (0,external_wp_i18n_namespaceObject.__)('Background image') 69958 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69959 group: "typography", 69960 label: (0,external_wp_i18n_namespaceObject.__)('Typography') 69961 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69962 group: "dimensions", 69963 label: (0,external_wp_i18n_namespaceObject.__)('Dimensions') 69964 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69965 group: "border", 69966 label: borderPanelLabel 69967 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 69968 group: "styles" 69969 })] 69970 })] 69971 }); 69972 } 69973 const isSelectedBlockUnregistered = selectedBlockName === (0,external_wp_blocks_namespaceObject.getUnregisteredTypeHandlerName)(); 69974 69975 /* 69976 * If the selected block is of an unregistered type, avoid showing it as an actual selection 69977 * because we want the user to focus on the unregistered block warning, not block settings. 69978 */ 69979 if (!blockType || !selectedBlockClientId || isSelectedBlockUnregistered) { 69980 if (showNoBlockSelectedMessage) { 69981 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { 69982 className: "block-editor-block-inspector__no-blocks", 69983 children: (0,external_wp_i18n_namespaceObject.__)('No block selected.') 69984 }); 69985 } 69986 return null; 69987 } 69988 if (topLevelLockedBlock) { 69989 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockInspectorLockedBlocks, { 69990 topLevelLockedBlock: topLevelLockedBlock 69991 }); 69992 } 69993 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockInspectorSingleBlockWrapper, { 69994 animate: blockInspectorAnimationSettings, 69995 wrapper: children => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AnimatedContainer, { 69996 blockInspectorAnimationSettings: blockInspectorAnimationSettings, 69997 selectedBlockClientId: selectedBlockClientId, 69998 children: children 69999 }), 70000 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockInspectorSingleBlock, { 70001 clientId: selectedBlockClientId, 70002 blockName: blockType.name 70003 }) 70004 }); 70005 }; 70006 const BlockInspectorSingleBlockWrapper = ({ 70007 animate, 70008 wrapper, 70009 children 70010 }) => { 70011 return animate ? wrapper(children) : children; 70012 }; 70013 const AnimatedContainer = ({ 70014 blockInspectorAnimationSettings, 70015 selectedBlockClientId, 70016 children 70017 }) => { 70018 const animationOrigin = blockInspectorAnimationSettings && blockInspectorAnimationSettings.enterDirection === 'leftToRight' ? -50 : 50; 70019 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__unstableMotion.div, { 70020 animate: { 70021 x: 0, 70022 opacity: 1, 70023 transition: { 70024 ease: 'easeInOut', 70025 duration: 0.14 70026 } 70027 }, 70028 initial: { 70029 x: animationOrigin, 70030 opacity: 0 70031 }, 70032 children: children 70033 }, selectedBlockClientId); 70034 }; 70035 const BlockInspectorSingleBlock = ({ 70036 clientId, 70037 blockName 70038 }) => { 70039 const availableTabs = useInspectorControlsTabs(blockName); 70040 const showTabs = availableTabs?.length > 1; 70041 const hasBlockStyles = (0,external_wp_data_namespaceObject.useSelect)(select => { 70042 const { 70043 getBlockStyles 70044 } = select(external_wp_blocks_namespaceObject.store); 70045 const blockStyles = getBlockStyles(blockName); 70046 return blockStyles && blockStyles.length > 0; 70047 }, [blockName]); 70048 const blockInformation = useBlockDisplayInformation(clientId); 70049 const borderPanelLabel = useBorderPanelLabel({ 70050 blockName 70051 }); 70052 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 70053 className: "block-editor-block-inspector", 70054 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_card, { 70055 ...blockInformation, 70056 className: blockInformation.isSynced && 'is-synced' 70057 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_variation_transforms, { 70058 blockClientId: clientId 70059 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_info_slot_fill.Slot, {}), showTabs && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InspectorControlsTabs, { 70060 hasBlockStyles: hasBlockStyles, 70061 clientId: clientId, 70062 blockName: blockName, 70063 tabs: availableTabs 70064 }), !showTabs && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 70065 children: [hasBlockStyles && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockStylesPanel, { 70066 clientId: clientId 70067 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 70068 group: "list" 70069 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 70070 group: "color", 70071 label: (0,external_wp_i18n_namespaceObject.__)('Color'), 70072 className: "color-block-support-panel__inner-wrapper" 70073 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 70074 group: "background", 70075 label: (0,external_wp_i18n_namespaceObject.__)('Background image') 70076 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 70077 group: "typography", 70078 label: (0,external_wp_i18n_namespaceObject.__)('Typography') 70079 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 70080 group: "dimensions", 70081 label: (0,external_wp_i18n_namespaceObject.__)('Dimensions') 70082 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 70083 group: "border", 70084 label: borderPanelLabel 70085 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 70086 group: "styles" 70087 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(position_controls_panel, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls.Slot, { 70088 group: "bindings" 70089 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 70090 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(advanced_controls_panel, {}) 70091 })] 70092 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SkipToSelectedBlock, {}, "back")] 70093 }); 70094 }; 70095 70096 /** 70097 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-inspector/README.md 70098 */ 70099 /* harmony default export */ const block_inspector = (BlockInspector); 70100 70101 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/copy-handler/index.js 70102 /** 70103 * WordPress dependencies 70104 */ 70105 70106 70107 /** 70108 * Internal dependencies 70109 */ 70110 70111 70112 /** 70113 * @deprecated 70114 */ 70115 70116 const __unstableUseClipboardHandler = () => { 70117 external_wp_deprecated_default()('__unstableUseClipboardHandler', { 70118 alternative: 'BlockCanvas or WritingFlow', 70119 since: '6.4', 70120 version: '6.7' 70121 }); 70122 return useClipboardHandler(); 70123 }; 70124 70125 /** 70126 * @deprecated 70127 * @param {Object} props 70128 */ 70129 function CopyHandler(props) { 70130 external_wp_deprecated_default()('CopyHandler', { 70131 alternative: 'BlockCanvas or WritingFlow', 70132 since: '6.4', 70133 version: '6.7' 70134 }); 70135 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 70136 ...props, 70137 ref: useClipboardHandler() 70138 }); 70139 } 70140 70141 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/library.js 70142 /** 70143 * WordPress dependencies 70144 */ 70145 70146 70147 70148 /** 70149 * Internal dependencies 70150 */ 70151 70152 70153 70154 const library_noop = () => {}; 70155 function InserterLibrary({ 70156 rootClientId, 70157 clientId, 70158 isAppender, 70159 showInserterHelpPanel, 70160 showMostUsedBlocks = false, 70161 __experimentalInsertionIndex, 70162 __experimentalInitialTab, 70163 __experimentalInitialCategory, 70164 __experimentalFilterValue, 70165 onPatternCategorySelection, 70166 onSelect = library_noop, 70167 shouldFocusBlock = false, 70168 onClose 70169 }, ref) { 70170 const { 70171 destinationRootClientId 70172 } = (0,external_wp_data_namespaceObject.useSelect)(select => { 70173 const { 70174 getBlockRootClientId 70175 } = select(store); 70176 const _rootClientId = rootClientId || getBlockRootClientId(clientId) || undefined; 70177 return { 70178 destinationRootClientId: _rootClientId 70179 }; 70180 }, [clientId, rootClientId]); 70181 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateInserterMenu, { 70182 onSelect: onSelect, 70183 rootClientId: destinationRootClientId, 70184 clientId: clientId, 70185 isAppender: isAppender, 70186 showInserterHelpPanel: showInserterHelpPanel, 70187 showMostUsedBlocks: showMostUsedBlocks, 70188 __experimentalInsertionIndex: __experimentalInsertionIndex, 70189 __experimentalFilterValue: __experimentalFilterValue, 70190 onPatternCategorySelection: onPatternCategorySelection, 70191 __experimentalInitialTab: __experimentalInitialTab, 70192 __experimentalInitialCategory: __experimentalInitialCategory, 70193 shouldFocusBlock: shouldFocusBlock, 70194 ref: ref, 70195 onClose: onClose 70196 }); 70197 } 70198 const PrivateInserterLibrary = (0,external_wp_element_namespaceObject.forwardRef)(InserterLibrary); 70199 function PublicInserterLibrary(props, ref) { 70200 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateInserterLibrary, { 70201 ...props, 70202 onPatternCategorySelection: undefined, 70203 ref: ref 70204 }); 70205 } 70206 /* harmony default export */ const library = ((0,external_wp_element_namespaceObject.forwardRef)(PublicInserterLibrary)); 70207 70208 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/selection-scroll-into-view/index.js 70209 /** 70210 * WordPress dependencies 70211 */ 70212 70213 70214 /** 70215 * Scrolls the multi block selection end into view if not in view already. This 70216 * is important to do after selection by keyboard. 70217 * 70218 * @deprecated 70219 */ 70220 function MultiSelectScrollIntoView() { 70221 external_wp_deprecated_default()('wp.blockEditor.MultiSelectScrollIntoView', { 70222 hint: 'This behaviour is now built-in.', 70223 since: '5.8' 70224 }); 70225 return null; 70226 } 70227 70228 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/typewriter/index.js 70229 /** 70230 * WordPress dependencies 70231 */ 70232 70233 70234 70235 70236 70237 /** 70238 * Internal dependencies 70239 */ 70240 70241 70242 const isIE = window.navigator.userAgent.indexOf('Trident') !== -1; 70243 const arrowKeyCodes = new Set([external_wp_keycodes_namespaceObject.UP, external_wp_keycodes_namespaceObject.DOWN, external_wp_keycodes_namespaceObject.LEFT, external_wp_keycodes_namespaceObject.RIGHT]); 70244 const initialTriggerPercentage = 0.75; 70245 function useTypewriter() { 70246 const hasSelectedBlock = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).hasSelectedBlock(), []); 70247 return (0,external_wp_compose_namespaceObject.useRefEffect)(node => { 70248 if (!hasSelectedBlock) { 70249 return; 70250 } 70251 const { 70252 ownerDocument 70253 } = node; 70254 const { 70255 defaultView 70256 } = ownerDocument; 70257 let scrollResizeRafId; 70258 let onKeyDownRafId; 70259 let caretRect; 70260 function onScrollResize() { 70261 if (scrollResizeRafId) { 70262 return; 70263 } 70264 scrollResizeRafId = defaultView.requestAnimationFrame(() => { 70265 computeCaretRectangle(); 70266 scrollResizeRafId = null; 70267 }); 70268 } 70269 function onKeyDown(event) { 70270 // Ensure the any remaining request is cancelled. 70271 if (onKeyDownRafId) { 70272 defaultView.cancelAnimationFrame(onKeyDownRafId); 70273 } 70274 70275 // Use an animation frame for a smooth result. 70276 onKeyDownRafId = defaultView.requestAnimationFrame(() => { 70277 maintainCaretPosition(event); 70278 onKeyDownRafId = null; 70279 }); 70280 } 70281 70282 /** 70283 * Maintains the scroll position after a selection change caused by a 70284 * keyboard event. 70285 * 70286 * @param {KeyboardEvent} event Keyboard event. 70287 */ 70288 function maintainCaretPosition({ 70289 keyCode 70290 }) { 70291 if (!isSelectionEligibleForScroll()) { 70292 return; 70293 } 70294 const currentCaretRect = (0,external_wp_dom_namespaceObject.computeCaretRect)(defaultView); 70295 if (!currentCaretRect) { 70296 return; 70297 } 70298 70299 // If for some reason there is no position set to be scrolled to, let 70300 // this be the position to be scrolled to in the future. 70301 if (!caretRect) { 70302 caretRect = currentCaretRect; 70303 return; 70304 } 70305 70306 // Even though enabling the typewriter effect for arrow keys results in 70307 // a pleasant experience, it may not be the case for everyone, so, for 70308 // now, let's disable it. 70309 if (arrowKeyCodes.has(keyCode)) { 70310 // Reset the caret position to maintain. 70311 caretRect = currentCaretRect; 70312 return; 70313 } 70314 const diff = currentCaretRect.top - caretRect.top; 70315 if (diff === 0) { 70316 return; 70317 } 70318 const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(node); 70319 70320 // The page must be scrollable. 70321 if (!scrollContainer) { 70322 return; 70323 } 70324 const windowScroll = scrollContainer === ownerDocument.body || scrollContainer === ownerDocument.documentElement; 70325 const scrollY = windowScroll ? defaultView.scrollY : scrollContainer.scrollTop; 70326 const scrollContainerY = windowScroll ? 0 : scrollContainer.getBoundingClientRect().top; 70327 const relativeScrollPosition = windowScroll ? caretRect.top / defaultView.innerHeight : (caretRect.top - scrollContainerY) / (defaultView.innerHeight - scrollContainerY); 70328 70329 // If the scroll position is at the start, the active editable element 70330 // is the last one, and the caret is positioned within the initial 70331 // trigger percentage of the page, do not scroll the page. 70332 // The typewriter effect should not kick in until an empty page has been 70333 // filled with the initial trigger percentage or the user scrolls 70334 // intentionally down. 70335 if (scrollY === 0 && relativeScrollPosition < initialTriggerPercentage && isLastEditableNode()) { 70336 // Reset the caret position to maintain. 70337 caretRect = currentCaretRect; 70338 return; 70339 } 70340 const scrollContainerHeight = windowScroll ? defaultView.innerHeight : scrollContainer.clientHeight; 70341 70342 // Abort if the target scroll position would scroll the caret out of 70343 // view. 70344 if ( 70345 // The caret is under the lower fold. 70346 caretRect.top + caretRect.height > scrollContainerY + scrollContainerHeight || 70347 // The caret is above the upper fold. 70348 caretRect.top < scrollContainerY) { 70349 // Reset the caret position to maintain. 70350 caretRect = currentCaretRect; 70351 return; 70352 } 70353 if (windowScroll) { 70354 defaultView.scrollBy(0, diff); 70355 } else { 70356 scrollContainer.scrollTop += diff; 70357 } 70358 } 70359 70360 /** 70361 * Adds a `selectionchange` listener to reset the scroll position to be 70362 * maintained. 70363 */ 70364 function addSelectionChangeListener() { 70365 ownerDocument.addEventListener('selectionchange', computeCaretRectOnSelectionChange); 70366 } 70367 70368 /** 70369 * Resets the scroll position to be maintained during a `selectionchange` 70370 * event. Also removes the listener, so it acts as a one-time listener. 70371 */ 70372 function computeCaretRectOnSelectionChange() { 70373 ownerDocument.removeEventListener('selectionchange', computeCaretRectOnSelectionChange); 70374 computeCaretRectangle(); 70375 } 70376 70377 /** 70378 * Resets the scroll position to be maintained. 70379 */ 70380 function computeCaretRectangle() { 70381 if (isSelectionEligibleForScroll()) { 70382 caretRect = (0,external_wp_dom_namespaceObject.computeCaretRect)(defaultView); 70383 } 70384 } 70385 70386 /** 70387 * Checks if the current situation is elegible for scroll: 70388 * - There should be one and only one block selected. 70389 * - The component must contain the selection. 70390 * - The active element must be contenteditable. 70391 */ 70392 function isSelectionEligibleForScroll() { 70393 return node.contains(ownerDocument.activeElement) && ownerDocument.activeElement.isContentEditable; 70394 } 70395 function isLastEditableNode() { 70396 const editableNodes = node.querySelectorAll('[contenteditable="true"]'); 70397 const lastEditableNode = editableNodes[editableNodes.length - 1]; 70398 return lastEditableNode === ownerDocument.activeElement; 70399 } 70400 70401 // When the user scrolls or resizes, the scroll position should be 70402 // reset. 70403 defaultView.addEventListener('scroll', onScrollResize, true); 70404 defaultView.addEventListener('resize', onScrollResize, true); 70405 node.addEventListener('keydown', onKeyDown); 70406 node.addEventListener('keyup', maintainCaretPosition); 70407 node.addEventListener('mousedown', addSelectionChangeListener); 70408 node.addEventListener('touchstart', addSelectionChangeListener); 70409 return () => { 70410 defaultView.removeEventListener('scroll', onScrollResize, true); 70411 defaultView.removeEventListener('resize', onScrollResize, true); 70412 node.removeEventListener('keydown', onKeyDown); 70413 node.removeEventListener('keyup', maintainCaretPosition); 70414 node.removeEventListener('mousedown', addSelectionChangeListener); 70415 node.removeEventListener('touchstart', addSelectionChangeListener); 70416 ownerDocument.removeEventListener('selectionchange', computeCaretRectOnSelectionChange); 70417 defaultView.cancelAnimationFrame(scrollResizeRafId); 70418 defaultView.cancelAnimationFrame(onKeyDownRafId); 70419 }; 70420 }, [hasSelectedBlock]); 70421 } 70422 function Typewriter({ 70423 children 70424 }) { 70425 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { 70426 ref: useTypewriter(), 70427 className: "block-editor__typewriter", 70428 children: children 70429 }); 70430 } 70431 70432 /** 70433 * The exported component. The implementation of Typewriter faced technical 70434 * challenges in Internet Explorer, and is simply skipped, rendering the given 70435 * props children instead. 70436 * 70437 * @type {Component} 70438 */ 70439 const TypewriterOrIEBypass = isIE ? props => props.children : Typewriter; 70440 70441 /** 70442 * Ensures that the text selection keeps the same vertical distance from the 70443 * viewport during keyboard events within this component. The vertical distance 70444 * can vary. It is the last clicked or scrolled to position. 70445 */ 70446 /* harmony default export */ const typewriter = (TypewriterOrIEBypass); 70447 70448 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/recursion-provider/index.js 70449 /** 70450 * WordPress dependencies 70451 */ 70452 70453 70454 70455 /** 70456 * Internal dependencies 70457 */ 70458 70459 70460 const RenderedRefsContext = (0,external_wp_element_namespaceObject.createContext)({}); 70461 70462 /** 70463 * Immutably adds an unique identifier to a set scoped for a given block type. 70464 * 70465 * @param {Object} renderedBlocks Rendered blocks grouped by block name 70466 * @param {string} blockName Name of the block. 70467 * @param {*} uniqueId Any value that acts as a unique identifier for a block instance. 70468 * 70469 * @return {Object} The list of rendered blocks grouped by block name. 70470 */ 70471 function addToBlockType(renderedBlocks, blockName, uniqueId) { 70472 const result = { 70473 ...renderedBlocks, 70474 [blockName]: renderedBlocks[blockName] ? new Set(renderedBlocks[blockName]) : new Set() 70475 }; 70476 result[blockName].add(uniqueId); 70477 return result; 70478 } 70479 70480 /** 70481 * A React context provider for use with the `useHasRecursion` hook to prevent recursive 70482 * renders. 70483 * 70484 * Wrap block content with this provider and provide the same `uniqueId` prop as used 70485 * with `useHasRecursion`. 70486 * 70487 * @param {Object} props 70488 * @param {*} props.uniqueId Any value that acts as a unique identifier for a block instance. 70489 * @param {string} props.blockName Optional block name. 70490 * @param {JSX.Element} props.children React children. 70491 * 70492 * @return {JSX.Element} A React element. 70493 */ 70494 function RecursionProvider({ 70495 children, 70496 uniqueId, 70497 blockName = '' 70498 }) { 70499 const previouslyRenderedBlocks = (0,external_wp_element_namespaceObject.useContext)(RenderedRefsContext); 70500 const { 70501 name 70502 } = useBlockEditContext(); 70503 blockName = blockName || name; 70504 const newRenderedBlocks = (0,external_wp_element_namespaceObject.useMemo)(() => addToBlockType(previouslyRenderedBlocks, blockName, uniqueId), [previouslyRenderedBlocks, blockName, uniqueId]); 70505 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RenderedRefsContext.Provider, { 70506 value: newRenderedBlocks, 70507 children: children 70508 }); 70509 } 70510 70511 /** 70512 * A React hook for keeping track of blocks previously rendered up in the block 70513 * tree. Blocks susceptible to recursion can use this hook in their `Edit` 70514 * function to prevent said recursion. 70515 * 70516 * Use this with the `RecursionProvider` component, using the same `uniqueId` value 70517 * for both the hook and the provider. 70518 * 70519 * @param {*} uniqueId Any value that acts as a unique identifier for a block instance. 70520 * @param {string} blockName Optional block name. 70521 * 70522 * @return {boolean} A boolean describing whether the provided id has already been rendered. 70523 */ 70524 function useHasRecursion(uniqueId, blockName = '') { 70525 const previouslyRenderedBlocks = (0,external_wp_element_namespaceObject.useContext)(RenderedRefsContext); 70526 const { 70527 name 70528 } = useBlockEditContext(); 70529 blockName = blockName || name; 70530 return Boolean(previouslyRenderedBlocks[blockName]?.has(uniqueId)); 70531 } 70532 const DeprecatedExperimentalRecursionProvider = props => { 70533 external_wp_deprecated_default()('wp.blockEditor.__experimentalRecursionProvider', { 70534 since: '6.5', 70535 alternative: 'wp.blockEditor.RecursionProvider' 70536 }); 70537 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RecursionProvider, { 70538 ...props 70539 }); 70540 }; 70541 const DeprecatedExperimentalUseHasRecursion = (...args) => { 70542 external_wp_deprecated_default()('wp.blockEditor.__experimentalUseHasRecursion', { 70543 since: '6.5', 70544 alternative: 'wp.blockEditor.useHasRecursion' 70545 }); 70546 return useHasRecursion(...args); 70547 }; 70548 70549 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inspector-popover-header/index.js 70550 /** 70551 * WordPress dependencies 70552 */ 70553 70554 70555 70556 70557 70558 function InspectorPopoverHeader({ 70559 title, 70560 help, 70561 actions = [], 70562 onClose 70563 }) { 70564 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 70565 className: "block-editor-inspector-popover-header", 70566 spacing: 4, 70567 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 70568 alignment: "center", 70569 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalHeading, { 70570 className: "block-editor-inspector-popover-header__heading", 70571 level: 2, 70572 size: 13, 70573 children: title 70574 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalSpacer, {}), actions.map(({ 70575 label, 70576 icon, 70577 onClick 70578 }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 70579 size: "small", 70580 className: "block-editor-inspector-popover-header__action", 70581 label: label, 70582 icon: icon, 70583 variant: !icon && 'tertiary', 70584 onClick: onClick, 70585 children: !icon && label 70586 }, label)), onClose && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 70587 size: "small", 70588 className: "block-editor-inspector-popover-header__action", 70589 label: (0,external_wp_i18n_namespaceObject.__)('Close'), 70590 icon: close_small, 70591 onClick: onClose 70592 })] 70593 }), help && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalText, { 70594 children: help 70595 })] 70596 }); 70597 } 70598 70599 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/publish-date-time-picker/index.js 70600 /** 70601 * WordPress dependencies 70602 */ 70603 70604 70605 70606 70607 70608 /** 70609 * Internal dependencies 70610 */ 70611 70612 70613 70614 function PublishDateTimePicker({ 70615 onClose, 70616 onChange, 70617 showPopoverHeaderActions, 70618 isCompact, 70619 currentDate, 70620 ...additionalProps 70621 }, ref) { 70622 const datePickerProps = { 70623 startOfWeek: (0,external_wp_date_namespaceObject.getSettings)().l10n.startOfWeek, 70624 onChange, 70625 currentDate: isCompact ? undefined : currentDate, 70626 currentTime: isCompact ? currentDate : undefined, 70627 ...additionalProps 70628 }; 70629 const DatePickerComponent = isCompact ? external_wp_components_namespaceObject.TimePicker : external_wp_components_namespaceObject.DateTimePicker; 70630 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { 70631 ref: ref, 70632 className: "block-editor-publish-date-time-picker", 70633 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InspectorPopoverHeader, { 70634 title: (0,external_wp_i18n_namespaceObject.__)('Publish'), 70635 actions: showPopoverHeaderActions ? [{ 70636 label: (0,external_wp_i18n_namespaceObject.__)('Now'), 70637 onClick: () => onChange?.(null) 70638 }] : undefined, 70639 onClose: onClose 70640 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DatePickerComponent, { 70641 ...datePickerProps 70642 })] 70643 }); 70644 } 70645 const PrivatePublishDateTimePicker = (0,external_wp_element_namespaceObject.forwardRef)(PublishDateTimePicker); 70646 function PublicPublishDateTimePicker(props, ref) { 70647 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivatePublishDateTimePicker, { 70648 ...props, 70649 showPopoverHeaderActions: true, 70650 isCompact: false, 70651 ref: ref 70652 }); 70653 } 70654 /* harmony default export */ const publish_date_time_picker = ((0,external_wp_element_namespaceObject.forwardRef)(PublicPublishDateTimePicker)); 70655 70656 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/index.js 70657 /* 70658 * Block Creation Components 70659 */ 70660 70661 70662 70663 70664 70665 70666 70667 70668 70669 70670 70671 70672 70673 70674 70675 70676 70677 70678 70679 70680 70681 70682 70683 70684 70685 70686 70687 70688 70689 70690 70691 70692 70693 70694 70695 70696 70697 70698 70699 70700 70701 70702 70703 70704 70705 70706 70707 70708 70709 70710 70711 70712 70713 70714 70715 70716 70717 70718 70719 70720 70721 70722 70723 70724 70725 70726 70727 70728 70729 70730 /* 70731 * Content Related Components 70732 */ 70733 70734 70735 70736 70737 70738 70739 70740 70741 70742 70743 70744 70745 70746 70747 70748 70749 70750 70751 70752 70753 70754 70755 70756 70757 70758 70759 70760 70761 70762 70763 70764 70765 70766 70767 70768 70769 70770 70771 70772 70773 /* 70774 * State Related Components 70775 */ 70776 70777 70778 70779 70780 70781 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/elements/index.js 70782 const elements_ELEMENT_CLASS_NAMES = { 70783 button: 'wp-element-button', 70784 caption: 'wp-element-caption' 70785 }; 70786 const __experimentalGetElementClassName = element => { 70787 return elements_ELEMENT_CLASS_NAMES[element] ? elements_ELEMENT_CLASS_NAMES[element] : ''; 70788 }; 70789 70790 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/get-px-from-css-unit.js 70791 /** 70792 * This function was accidentally exposed for mobile/native usage. 70793 * 70794 * @deprecated 70795 * 70796 * @return {string} Empty string. 70797 */ 70798 /* harmony default export */ const get_px_from_css_unit = (() => ''); 70799 70800 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/utils/index.js 70801 70802 70803 70804 70805 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/image-settings-panel.js 70806 /** 70807 * WordPress dependencies 70808 */ 70809 70810 70811 70812 /** 70813 * Internal dependencies 70814 */ 70815 70816 70817 70818 function useHasImageSettingsPanel(name, value, inheritedValue) { 70819 // Note: If lightbox `value` exists, that means it was 70820 // defined via the the Global Styles UI and will NOT 70821 // be a boolean value or contain the `allowEditing` property, 70822 // so we should show the settings panel in those cases. 70823 return name === 'core/image' && inheritedValue?.lightbox?.allowEditing || !!value?.lightbox; 70824 } 70825 function ImageSettingsPanel({ 70826 onChange, 70827 value, 70828 inheritedValue, 70829 panelId 70830 }) { 70831 const dropdownMenuProps = useToolsPanelDropdownMenuProps(); 70832 const resetLightbox = () => { 70833 onChange(undefined); 70834 }; 70835 const onChangeLightbox = newSetting => { 70836 onChange({ 70837 enabled: newSetting 70838 }); 70839 }; 70840 let lightboxChecked = false; 70841 if (inheritedValue?.lightbox?.enabled) { 70842 lightboxChecked = inheritedValue.lightbox.enabled; 70843 } 70844 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { 70845 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanel, { 70846 label: (0,external_wp_i18n_namespaceObject._x)('Settings', 'Image settings'), 70847 resetAll: resetLightbox, 70848 panelId: panelId, 70849 dropdownMenuProps: dropdownMenuProps, 70850 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem 70851 // We use the `userSettings` prop instead of `settings`, because `settings` 70852 // contains the core/theme values for the lightbox and we want to show the 70853 // "RESET" button ONLY when the user has explicitly set a value in the 70854 // Global Styles. 70855 , { 70856 hasValue: () => !!value?.lightbox, 70857 label: (0,external_wp_i18n_namespaceObject.__)('Expand on click'), 70858 onDeselect: resetLightbox, 70859 isShownByDefault: true, 70860 panelId: panelId, 70861 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, { 70862 __nextHasNoMarginBottom: true, 70863 label: (0,external_wp_i18n_namespaceObject.__)('Expand on click'), 70864 checked: lightboxChecked, 70865 onChange: onChangeLightbox 70866 }) 70867 }) 70868 }) 70869 }); 70870 } 70871 70872 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/advanced-panel.js 70873 /** 70874 * WordPress dependencies 70875 */ 70876 70877 70878 70879 70880 /** 70881 * Internal dependencies 70882 */ 70883 70884 70885 70886 function AdvancedPanel({ 70887 value, 70888 onChange, 70889 inheritedValue = value 70890 }) { 70891 // Custom CSS 70892 const [cssError, setCSSError] = (0,external_wp_element_namespaceObject.useState)(null); 70893 const customCSS = inheritedValue?.css; 70894 function handleOnChange(newValue) { 70895 onChange({ 70896 ...value, 70897 css: newValue 70898 }); 70899 if (cssError) { 70900 // Check if the new value is valid CSS, and pass a wrapping selector 70901 // to ensure that `transformStyles` validates the CSS. Note that the 70902 // wrapping selector here is not used in the actual output of any styles. 70903 const [transformed] = transform_styles([{ 70904 css: newValue 70905 }], '.for-validation-only'); 70906 if (transformed) { 70907 setCSSError(null); 70908 } 70909 } 70910 } 70911 function handleOnBlur(event) { 70912 if (!event?.target?.value) { 70913 setCSSError(null); 70914 return; 70915 } 70916 70917 // Check if the new value is valid CSS, and pass a wrapping selector 70918 // to ensure that `transformStyles` validates the CSS. Note that the 70919 // wrapping selector here is not used in the actual output of any styles. 70920 const [transformed] = transform_styles([{ 70921 css: event.target.value 70922 }], '.for-validation-only'); 70923 setCSSError(transformed === null ? (0,external_wp_i18n_namespaceObject.__)('There is an error with your CSS structure.') : null); 70924 } 70925 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, { 70926 spacing: 3, 70927 children: [cssError && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Notice, { 70928 status: "error", 70929 onRemove: () => setCSSError(null), 70930 children: cssError 70931 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextareaControl, { 70932 label: (0,external_wp_i18n_namespaceObject.__)('Additional CSS'), 70933 __nextHasNoMarginBottom: true, 70934 value: customCSS, 70935 onChange: newValue => handleOnChange(newValue), 70936 onBlur: handleOnBlur, 70937 className: "block-editor-global-styles-advanced-panel__custom-css-input", 70938 spellCheck: false 70939 })] 70940 }); 70941 } 70942 70943 ;// CONCATENATED MODULE: ./node_modules/memize/dist/index.js 70944 /** 70945 * Memize options object. 70946 * 70947 * @typedef MemizeOptions 70948 * 70949 * @property {number} [maxSize] Maximum size of the cache. 70950 */ 70951 70952 /** 70953 * Internal cache entry. 70954 * 70955 * @typedef MemizeCacheNode 70956 * 70957 * @property {?MemizeCacheNode|undefined} [prev] Previous node. 70958 * @property {?MemizeCacheNode|undefined} [next] Next node. 70959 * @property {Array<*>} args Function arguments for cache 70960 * entry. 70961 * @property {*} val Function result. 70962 */ 70963 70964 /** 70965 * Properties of the enhanced function for controlling cache. 70966 * 70967 * @typedef MemizeMemoizedFunction 70968 * 70969 * @property {()=>void} clear Clear the cache. 70970 */ 70971 70972 /** 70973 * Accepts a function to be memoized, and returns a new memoized function, with 70974 * optional options. 70975 * 70976 * @template {(...args: any[]) => any} F 70977 * 70978 * @param {F} fn Function to memoize. 70979 * @param {MemizeOptions} [options] Options object. 70980 * 70981 * @return {((...args: Parameters<F>) => ReturnType<F>) & MemizeMemoizedFunction} Memoized function. 70982 */ 70983 function memize(fn, options) { 70984 var size = 0; 70985 70986 /** @type {?MemizeCacheNode|undefined} */ 70987 var head; 70988 70989 /** @type {?MemizeCacheNode|undefined} */ 70990 var tail; 70991 70992 options = options || {}; 70993 70994 function memoized(/* ...args */) { 70995 var node = head, 70996 len = arguments.length, 70997 args, 70998 i; 70999 71000 searchCache: while (node) { 71001 // Perform a shallow equality test to confirm that whether the node 71002 // under test is a candidate for the arguments passed. Two arrays 71003 // are shallowly equal if their length matches and each entry is 71004 // strictly equal between the two sets. Avoid abstracting to a 71005 // function which could incur an arguments leaking deoptimization. 71006 71007 // Check whether node arguments match arguments length 71008 if (node.args.length !== arguments.length) { 71009 node = node.next; 71010 continue; 71011 } 71012 71013 // Check whether node arguments match arguments values 71014 for (i = 0; i < len; i++) { 71015 if (node.args[i] !== arguments[i]) { 71016 node = node.next; 71017 continue searchCache; 71018 } 71019 } 71020 71021 // At this point we can assume we've found a match 71022 71023 // Surface matched node to head if not already 71024 if (node !== head) { 71025 // As tail, shift to previous. Must only shift if not also 71026 // head, since if both head and tail, there is no previous. 71027 if (node === tail) { 71028 tail = node.prev; 71029 } 71030 71031 // Adjust siblings to point to each other. If node was tail, 71032 // this also handles new tail's empty `next` assignment. 71033 /** @type {MemizeCacheNode} */ (node.prev).next = node.next; 71034 if (node.next) { 71035 node.next.prev = node.prev; 71036 } 71037 71038 node.next = head; 71039 node.prev = null; 71040 /** @type {MemizeCacheNode} */ (head).prev = node; 71041 head = node; 71042 } 71043 71044 // Return immediately 71045 return node.val; 71046 } 71047 71048 // No cached value found. Continue to insertion phase: 71049 71050 // Create a copy of arguments (avoid leaking deoptimization) 71051 args = new Array(len); 71052 for (i = 0; i < len; i++) { 71053 args[i] = arguments[i]; 71054 } 71055 71056 node = { 71057 args: args, 71058 71059 // Generate the result from original function 71060 val: fn.apply(null, args), 71061 }; 71062 71063 // Don't need to check whether node is already head, since it would 71064 // have been returned above already if it was 71065 71066 // Shift existing head down list 71067 if (head) { 71068 head.prev = node; 71069 node.next = head; 71070 } else { 71071 // If no head, follows that there's no tail (at initial or reset) 71072 tail = node; 71073 } 71074 71075 // Trim tail if we're reached max size and are pending cache insertion 71076 if (size === /** @type {MemizeOptions} */ (options).maxSize) { 71077 tail = /** @type {MemizeCacheNode} */ (tail).prev; 71078 /** @type {MemizeCacheNode} */ (tail).next = null; 71079 } else { 71080 size++; 71081 } 71082 71083 head = node; 71084 71085 return node.val; 71086 } 71087 71088 memoized.clear = function () { 71089 head = null; 71090 tail = null; 71091 size = 0; 71092 }; 71093 71094 // Ignore reason: There's not a clear solution to create an intersection of 71095 // the function with additional properties, where the goal is to retain the 71096 // function signature of the incoming argument and add control properties 71097 // on the return value. 71098 71099 // @ts-ignore 71100 return memoized; 71101 } 71102 71103 71104 71105 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/get-global-styles-changes.js 71106 /** 71107 * External dependencies 71108 */ 71109 71110 71111 /** 71112 * WordPress dependencies 71113 */ 71114 71115 71116 const globalStylesChangesCache = new Map(); 71117 const get_global_styles_changes_EMPTY_ARRAY = []; 71118 const translationMap = { 71119 caption: (0,external_wp_i18n_namespaceObject.__)('Caption'), 71120 link: (0,external_wp_i18n_namespaceObject.__)('Link'), 71121 button: (0,external_wp_i18n_namespaceObject.__)('Button'), 71122 heading: (0,external_wp_i18n_namespaceObject.__)('Heading'), 71123 h1: (0,external_wp_i18n_namespaceObject.__)('H1'), 71124 h2: (0,external_wp_i18n_namespaceObject.__)('H2'), 71125 h3: (0,external_wp_i18n_namespaceObject.__)('H3'), 71126 h4: (0,external_wp_i18n_namespaceObject.__)('H4'), 71127 h5: (0,external_wp_i18n_namespaceObject.__)('H5'), 71128 h6: (0,external_wp_i18n_namespaceObject.__)('H6'), 71129 'settings.color': (0,external_wp_i18n_namespaceObject.__)('Color'), 71130 'settings.typography': (0,external_wp_i18n_namespaceObject.__)('Typography'), 71131 'styles.color': (0,external_wp_i18n_namespaceObject.__)('Colors'), 71132 'styles.spacing': (0,external_wp_i18n_namespaceObject.__)('Spacing'), 71133 'styles.background': (0,external_wp_i18n_namespaceObject.__)('Background'), 71134 'styles.typography': (0,external_wp_i18n_namespaceObject.__)('Typography') 71135 }; 71136 const getBlockNames = memize(() => (0,external_wp_blocks_namespaceObject.getBlockTypes)().reduce((accumulator, { 71137 name, 71138 title 71139 }) => { 71140 accumulator[name] = title; 71141 return accumulator; 71142 }, {})); 71143 const isObject = obj => obj !== null && typeof obj === 'object'; 71144 71145 /** 71146 * Get the translation for a given global styles key. 71147 * @param {string} key A key representing a path to a global style property or setting. 71148 * @return {string|undefined} A translated key or undefined if no translation exists. 71149 */ 71150 function getTranslation(key) { 71151 if (translationMap[key]) { 71152 return translationMap[key]; 71153 } 71154 const keyArray = key.split('.'); 71155 if (keyArray?.[0] === 'blocks') { 71156 const blockName = getBlockNames()?.[keyArray[1]]; 71157 return blockName || keyArray[1]; 71158 } 71159 if (keyArray?.[0] === 'elements') { 71160 return translationMap[keyArray[1]] || keyArray[1]; 71161 } 71162 return undefined; 71163 } 71164 71165 /** 71166 * A deep comparison of two objects, optimized for comparing global styles. 71167 * @param {Object} changedObject The changed object to compare. 71168 * @param {Object} originalObject The original object to compare against. 71169 * @param {string} parentPath A key/value pair object of block names and their rendered titles. 71170 * @return {string[]} An array of paths whose values have changed. 71171 */ 71172 function deepCompare(changedObject, originalObject, parentPath = '') { 71173 // We have two non-object values to compare. 71174 if (!isObject(changedObject) && !isObject(originalObject)) { 71175 /* 71176 * Only return a path if the value has changed. 71177 * And then only the path name up to 2 levels deep. 71178 */ 71179 return changedObject !== originalObject ? parentPath.split('.').slice(0, 2).join('.') : undefined; 71180 } 71181 71182 // Enable comparison when an object doesn't have a corresponding property to compare. 71183 changedObject = isObject(changedObject) ? changedObject : {}; 71184 originalObject = isObject(originalObject) ? originalObject : {}; 71185 const allKeys = new Set([...Object.keys(changedObject), ...Object.keys(originalObject)]); 71186 let diffs = []; 71187 for (const key of allKeys) { 71188 const path = parentPath ? parentPath + '.' + key : key; 71189 const changedPath = deepCompare(changedObject[key], originalObject[key], path); 71190 if (changedPath) { 71191 diffs = diffs.concat(changedPath); 71192 } 71193 } 71194 return diffs; 71195 } 71196 71197 /** 71198 * Returns an array of translated summarized global styles changes. 71199 * Results are cached using a Map() key of `JSON.stringify( { next, previous } )`. 71200 * 71201 * @param {Object} next The changed object to compare. 71202 * @param {Object} previous The original object to compare against. 71203 * @return {Array[]} A 2-dimensional array of tuples: [ "group", "translated change" ]. 71204 */ 71205 function getGlobalStylesChangelist(next, previous) { 71206 const cacheKey = JSON.stringify({ 71207 next, 71208 previous 71209 }); 71210 if (globalStylesChangesCache.has(cacheKey)) { 71211 return globalStylesChangesCache.get(cacheKey); 71212 } 71213 71214 /* 71215 * Compare the two changesets with normalized keys. 71216 * The order of these keys determines the order in which 71217 * they'll appear in the results. 71218 */ 71219 const changedValueTree = deepCompare({ 71220 styles: { 71221 background: next?.styles?.background, 71222 color: next?.styles?.color, 71223 typography: next?.styles?.typography, 71224 spacing: next?.styles?.spacing 71225 }, 71226 blocks: next?.styles?.blocks, 71227 elements: next?.styles?.elements, 71228 settings: next?.settings 71229 }, { 71230 styles: { 71231 background: previous?.styles?.background, 71232 color: previous?.styles?.color, 71233 typography: previous?.styles?.typography, 71234 spacing: previous?.styles?.spacing 71235 }, 71236 blocks: previous?.styles?.blocks, 71237 elements: previous?.styles?.elements, 71238 settings: previous?.settings 71239 }); 71240 if (!changedValueTree.length) { 71241 globalStylesChangesCache.set(cacheKey, get_global_styles_changes_EMPTY_ARRAY); 71242 return get_global_styles_changes_EMPTY_ARRAY; 71243 } 71244 71245 // Remove duplicate results. 71246 const result = [...new Set(changedValueTree)] 71247 /* 71248 * Translate the keys. 71249 * Remove empty translations. 71250 */.reduce((acc, curr) => { 71251 const translation = getTranslation(curr); 71252 if (translation) { 71253 acc.push([curr.split('.')[0], translation]); 71254 } 71255 return acc; 71256 }, []); 71257 globalStylesChangesCache.set(cacheKey, result); 71258 return result; 71259 } 71260 71261 /** 71262 * From a getGlobalStylesChangelist() result, returns an array of translated global styles changes, grouped by type. 71263 * The types are 'blocks', 'elements', 'settings', and 'styles'. 71264 * 71265 * @param {Object} next The changed object to compare. 71266 * @param {Object} previous The original object to compare against. 71267 * @param {{maxResults:number}} options Options. maxResults: results to return before truncating. 71268 * @return {string[]} An array of translated changes. 71269 */ 71270 function getGlobalStylesChanges(next, previous, options = {}) { 71271 let changeList = getGlobalStylesChangelist(next, previous); 71272 const changesLength = changeList.length; 71273 const { 71274 maxResults 71275 } = options; 71276 if (changesLength) { 71277 // Truncate to `n` results if necessary. 71278 if (!!maxResults && changesLength > maxResults) { 71279 changeList = changeList.slice(0, maxResults); 71280 } 71281 return Object.entries(changeList.reduce((acc, curr) => { 71282 const group = acc[curr[0]] || []; 71283 if (!group.includes(curr[1])) { 71284 acc[curr[0]] = [...group, curr[1]]; 71285 } 71286 return acc; 71287 }, {})).map(([key, changeValues]) => { 71288 const changeValuesLength = changeValues.length; 71289 const joinedChangesValue = changeValues.join( /* translators: Used between list items, there is a space after the comma. */ 71290 (0,external_wp_i18n_namespaceObject.__)(', ') // eslint-disable-line @wordpress/i18n-no-flanking-whitespace 71291 ); 71292 switch (key) { 71293 case 'blocks': 71294 { 71295 return (0,external_wp_i18n_namespaceObject.sprintf)( 71296 // translators: %s: a list of block names separated by a comma. 71297 (0,external_wp_i18n_namespaceObject._n)('%s block.', '%s blocks.', changeValuesLength), joinedChangesValue); 71298 } 71299 case 'elements': 71300 { 71301 return (0,external_wp_i18n_namespaceObject.sprintf)( 71302 // translators: %s: a list of element names separated by a comma. 71303 (0,external_wp_i18n_namespaceObject._n)('%s element.', '%s elements.', changeValuesLength), joinedChangesValue); 71304 } 71305 case 'settings': 71306 { 71307 return (0,external_wp_i18n_namespaceObject.sprintf)( 71308 // translators: %s: a list of theme.json setting labels separated by a comma. 71309 (0,external_wp_i18n_namespaceObject.__)('%s settings.'), joinedChangesValue); 71310 } 71311 case 'styles': 71312 { 71313 return (0,external_wp_i18n_namespaceObject.sprintf)( 71314 // translators: %s: a list of theme.json top-level styles labels separated by a comma. 71315 (0,external_wp_i18n_namespaceObject.__)('%s styles.'), joinedChangesValue); 71316 } 71317 default: 71318 { 71319 return (0,external_wp_i18n_namespaceObject.sprintf)( 71320 // translators: %s: a list of global styles changes separated by a comma. 71321 (0,external_wp_i18n_namespaceObject.__)('%s.'), joinedChangesValue); 71322 } 71323 } 71324 }); 71325 } 71326 return get_global_styles_changes_EMPTY_ARRAY; 71327 } 71328 71329 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/index.js 71330 71331 71332 71333 71334 71335 71336 71337 71338 71339 71340 71341 71342 71343 71344 71345 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/rich-text/get-rich-text-values.js 71346 /** 71347 * WordPress dependencies 71348 */ 71349 71350 71351 71352 71353 /** 71354 * Internal dependencies 71355 */ 71356 71357 71358 71359 /* 71360 * This function is similar to `@wordpress/element`'s `renderToString` function, 71361 * except that it does not render the elements to a string, but instead collects 71362 * the values of all rich text `Content` elements. 71363 */ 71364 71365 function addValuesForElement(element, values, innerBlocks) { 71366 if (null === element || undefined === element || false === element) { 71367 return; 71368 } 71369 if (Array.isArray(element)) { 71370 return addValuesForElements(element, values, innerBlocks); 71371 } 71372 switch (typeof element) { 71373 case 'string': 71374 case 'number': 71375 return; 71376 } 71377 const { 71378 type, 71379 props 71380 } = element; 71381 switch (type) { 71382 case external_wp_element_namespaceObject.StrictMode: 71383 case external_wp_element_namespaceObject.Fragment: 71384 return addValuesForElements(props.children, values, innerBlocks); 71385 case external_wp_element_namespaceObject.RawHTML: 71386 return; 71387 case inner_blocks.Content: 71388 return addValuesForBlocks(values, innerBlocks); 71389 case Content: 71390 values.push(props.value); 71391 return; 71392 } 71393 switch (typeof type) { 71394 case 'string': 71395 if (typeof props.children !== 'undefined') { 71396 return addValuesForElements(props.children, values, innerBlocks); 71397 } 71398 return; 71399 case 'function': 71400 const el = type.prototype && typeof type.prototype.render === 'function' ? new type(props).render() : type(props); 71401 return addValuesForElement(el, values, innerBlocks); 71402 } 71403 } 71404 function addValuesForElements(children, ...args) { 71405 children = Array.isArray(children) ? children : [children]; 71406 for (let i = 0; i < children.length; i++) { 71407 addValuesForElement(children[i], ...args); 71408 } 71409 } 71410 function addValuesForBlocks(values, blocks) { 71411 for (let i = 0; i < blocks.length; i++) { 71412 const { 71413 name, 71414 attributes, 71415 innerBlocks 71416 } = blocks[i]; 71417 const saveElement = (0,external_wp_blocks_namespaceObject.getSaveElement)(name, attributes, 71418 /*#__PURE__*/ 71419 // Instead of letting save elements use `useInnerBlocksProps.save`, 71420 // force them to use InnerBlocks.Content instead so we can intercept 71421 // a single component. 71422 (0,external_ReactJSXRuntime_namespaceObject.jsx)(inner_blocks.Content, {})); 71423 addValuesForElement(saveElement, values, innerBlocks); 71424 } 71425 } 71426 function getRichTextValues(blocks = []) { 71427 external_wp_blocks_namespaceObject.__unstableGetBlockProps.skipFilters = true; 71428 const values = []; 71429 addValuesForBlocks(values, blocks); 71430 external_wp_blocks_namespaceObject.__unstableGetBlockProps.skipFilters = false; 71431 return values.map(value => value instanceof external_wp_richText_namespaceObject.RichTextData ? value : external_wp_richText_namespaceObject.RichTextData.fromHTMLString(value)); 71432 } 71433 71434 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/resizable-box-popover/index.js 71435 /** 71436 * WordPress dependencies 71437 */ 71438 71439 71440 /** 71441 * Internal dependencies 71442 */ 71443 71444 71445 function ResizableBoxPopover({ 71446 clientId, 71447 resizableBoxProps, 71448 ...props 71449 }) { 71450 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cover, { 71451 clientId: clientId, 71452 __unstablePopoverSlot: "block-toolbar", 71453 ...props, 71454 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ResizableBox, { 71455 ...resizableBoxProps 71456 }) 71457 }); 71458 } 71459 71460 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-removal-warning-modal/index.js 71461 /** 71462 * WordPress dependencies 71463 */ 71464 71465 71466 71467 71468 71469 /** 71470 * Internal dependencies 71471 */ 71472 71473 71474 71475 71476 function BlockRemovalWarningModal({ 71477 rules 71478 }) { 71479 const { 71480 clientIds, 71481 selectPrevious, 71482 message 71483 } = (0,external_wp_data_namespaceObject.useSelect)(select => unlock(select(store)).getRemovalPromptData()); 71484 const { 71485 clearBlockRemovalPrompt, 71486 setBlockRemovalRules, 71487 privateRemoveBlocks 71488 } = unlock((0,external_wp_data_namespaceObject.useDispatch)(store)); 71489 71490 // Load block removal rules, simultaneously signalling that the block 71491 // removal prompt is in place. 71492 (0,external_wp_element_namespaceObject.useEffect)(() => { 71493 setBlockRemovalRules(rules); 71494 return () => { 71495 setBlockRemovalRules(); 71496 }; 71497 }, [rules, setBlockRemovalRules]); 71498 if (!message) { 71499 return; 71500 } 71501 const onConfirmRemoval = () => { 71502 privateRemoveBlocks(clientIds, selectPrevious, /* force */true); 71503 clearBlockRemovalPrompt(); 71504 }; 71505 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Modal, { 71506 title: (0,external_wp_i18n_namespaceObject.__)('Be careful!'), 71507 onRequestClose: clearBlockRemovalPrompt, 71508 size: "medium", 71509 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", { 71510 children: message 71511 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, { 71512 justify: "right", 71513 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 71514 variant: "tertiary", 71515 onClick: clearBlockRemovalPrompt, 71516 __next40pxDefaultSize: true, 71517 children: (0,external_wp_i18n_namespaceObject.__)('Cancel') 71518 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, { 71519 variant: "primary", 71520 onClick: onConfirmRemoval, 71521 __next40pxDefaultSize: true, 71522 children: (0,external_wp_i18n_namespaceObject.__)('Delete') 71523 })] 71524 })] 71525 }); 71526 } 71527 71528 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/dimensions-tool/scale-tool.js 71529 /** 71530 * WordPress dependencies 71531 */ 71532 71533 71534 71535 71536 /** 71537 * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps 71538 */ 71539 71540 /** 71541 * The descriptions are purposely made generic as object-fit could be used for 71542 * any replaced element. Provide your own set of options if you need different 71543 * help text or labels. 71544 * 71545 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element 71546 * 71547 * @type {SelectControlProps[]} 71548 */ 71549 71550 const DEFAULT_SCALE_OPTIONS = [{ 71551 value: 'fill', 71552 label: (0,external_wp_i18n_namespaceObject._x)('Fill', 'Scale option for dimensions control'), 71553 help: (0,external_wp_i18n_namespaceObject.__)('Fill the space by stretching the content.') 71554 }, { 71555 value: 'contain', 71556 label: (0,external_wp_i18n_namespaceObject._x)('Contain', 'Scale option for dimensions control'), 71557 help: (0,external_wp_i18n_namespaceObject.__)('Fit the content to the space without clipping.') 71558 }, { 71559 value: 'cover', 71560 label: (0,external_wp_i18n_namespaceObject._x)('Cover', 'Scale option for dimensions control'), 71561 help: (0,external_wp_i18n_namespaceObject.__)("Fill the space by clipping what doesn't fit.") 71562 }, { 71563 value: 'none', 71564 label: (0,external_wp_i18n_namespaceObject._x)('None', 'Scale option for dimensions control'), 71565 help: (0,external_wp_i18n_namespaceObject.__)('Do not adjust the sizing of the content. Content that is too large will be clipped, and content that is too small will have additional padding.') 71566 }, { 71567 value: 'scale-down', 71568 label: (0,external_wp_i18n_namespaceObject._x)('Scale down', 'Scale option for dimensions control'), 71569 help: (0,external_wp_i18n_namespaceObject.__)('Scale down the content to fit the space if it is too big. Content that is too small will have additional padding.') 71570 }]; 71571 71572 /** 71573 * @callback ScaleToolPropsOnChange 71574 * @param {string} nextValue New scale value. 71575 * @return {void} 71576 */ 71577 71578 /** 71579 * @typedef {Object} ScaleToolProps 71580 * @property {string} [panelId] ID of the panel that contains the controls. 71581 * @property {string} [value] Current scale value. 71582 * @property {ScaleToolPropsOnChange} [onChange] Callback to update the scale value. 71583 * @property {SelectControlProps[]} [options] Scale options. 71584 * @property {string} [defaultValue] Default scale value. 71585 * @property {boolean} [showControl=true] Whether to show the control. 71586 * @property {boolean} [isShownByDefault=true] Whether the tool panel is shown by default. 71587 */ 71588 71589 /** 71590 * A tool to select the CSS object-fit property for the image. 71591 * 71592 * @param {ScaleToolProps} props 71593 * 71594 * @return {import('react').ReactElement} The scale tool. 71595 */ 71596 function ScaleTool({ 71597 panelId, 71598 value, 71599 onChange, 71600 options = DEFAULT_SCALE_OPTIONS, 71601 defaultValue = DEFAULT_SCALE_OPTIONS[0].value, 71602 isShownByDefault = true 71603 }) { 71604 // Match the CSS default so if the value is used directly in CSS it will look correct in the control. 71605 const displayValue = value !== null && value !== void 0 ? value : 'fill'; 71606 const scaleHelp = (0,external_wp_element_namespaceObject.useMemo)(() => { 71607 return options.reduce((acc, option) => { 71608 acc[option.value] = option.help; 71609 return acc; 71610 }, {}); 71611 }, [options]); 71612 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 71613 label: (0,external_wp_i18n_namespaceObject.__)('Scale'), 71614 isShownByDefault: isShownByDefault, 71615 hasValue: () => displayValue !== defaultValue, 71616 onDeselect: () => onChange(defaultValue), 71617 panelId: panelId, 71618 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, { 71619 __nextHasNoMarginBottom: true, 71620 label: (0,external_wp_i18n_namespaceObject.__)('Scale'), 71621 isBlock: true, 71622 help: scaleHelp[displayValue], 71623 value: displayValue, 71624 onChange: onChange, 71625 size: "__unstable-large", 71626 children: options.map(option => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, { 71627 ...option 71628 }, option.value)) 71629 }) 71630 }); 71631 } 71632 71633 ;// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/extends.js 71634 function extends_extends() { 71635 extends_extends = Object.assign ? Object.assign.bind() : function (target) { 71636 for (var i = 1; i < arguments.length; i++) { 71637 var source = arguments[i]; 71638 for (var key in source) { 71639 if (Object.prototype.hasOwnProperty.call(source, key)) { 71640 target[key] = source[key]; 71641 } 71642 } 71643 } 71644 return target; 71645 }; 71646 return extends_extends.apply(this, arguments); 71647 } 71648 ;// CONCATENATED MODULE: ./node_modules/@emotion/memoize/dist/emotion-memoize.esm.js 71649 function memoize(fn) { 71650 var cache = Object.create(null); 71651 return function (arg) { 71652 if (cache[arg] === undefined) cache[arg] = fn(arg); 71653 return cache[arg]; 71654 }; 71655 } 71656 71657 71658 71659 ;// CONCATENATED MODULE: ./node_modules/@emotion/styled/node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js 71660 71661 71662 var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23 71663 71664 var isPropValid = /* #__PURE__ */memoize(function (prop) { 71665 return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 71666 /* o */ 71667 && prop.charCodeAt(1) === 110 71668 /* n */ 71669 && prop.charCodeAt(2) < 91; 71670 } 71671 /* Z+1 */ 71672 ); 71673 71674 71675 71676 ;// CONCATENATED MODULE: ./node_modules/@emotion/sheet/dist/emotion-sheet.browser.esm.js 71677 /* 71678 71679 Based off glamor's StyleSheet, thanks Sunil ❤️ 71680 71681 high performance StyleSheet for css-in-js systems 71682 71683 - uses multiple style tags behind the scenes for millions of rules 71684 - uses `insertRule` for appending in production for *much* faster performance 71685 71686 // usage 71687 71688 import { StyleSheet } from '@emotion/sheet' 71689 71690 let styleSheet = new StyleSheet({ key: '', container: document.head }) 71691 71692 styleSheet.insert('#box { border: 1px solid red; }') 71693 - appends a css rule into the stylesheet 71694 71695 styleSheet.flush() 71696 - empties the stylesheet of all its contents 71697 71698 */ 71699 // $FlowFixMe 71700 function sheetForTag(tag) { 71701 if (tag.sheet) { 71702 // $FlowFixMe 71703 return tag.sheet; 71704 } // this weirdness brought to you by firefox 71705 71706 /* istanbul ignore next */ 71707 71708 71709 for (var i = 0; i < document.styleSheets.length; i++) { 71710 if (document.styleSheets[i].ownerNode === tag) { 71711 // $FlowFixMe 71712 return document.styleSheets[i]; 71713 } 71714 } 71715 } 71716 71717 function createStyleElement(options) { 71718 var tag = document.createElement('style'); 71719 tag.setAttribute('data-emotion', options.key); 71720 71721 if (options.nonce !== undefined) { 71722 tag.setAttribute('nonce', options.nonce); 71723 } 71724 71725 tag.appendChild(document.createTextNode('')); 71726 tag.setAttribute('data-s', ''); 71727 return tag; 71728 } 71729 71730 var StyleSheet = /*#__PURE__*/function () { 71731 // Using Node instead of HTMLElement since container may be a ShadowRoot 71732 function StyleSheet(options) { 71733 var _this = this; 71734 71735 this._insertTag = function (tag) { 71736 var before; 71737 71738 if (_this.tags.length === 0) { 71739 if (_this.insertionPoint) { 71740 before = _this.insertionPoint.nextSibling; 71741 } else if (_this.prepend) { 71742 before = _this.container.firstChild; 71743 } else { 71744 before = _this.before; 71745 } 71746 } else { 71747 before = _this.tags[_this.tags.length - 1].nextSibling; 71748 } 71749 71750 _this.container.insertBefore(tag, before); 71751 71752 _this.tags.push(tag); 71753 }; 71754 71755 this.isSpeedy = options.speedy === undefined ? "production" === 'production' : options.speedy; 71756 this.tags = []; 71757 this.ctr = 0; 71758 this.nonce = options.nonce; // key is the value of the data-emotion attribute, it's used to identify different sheets 71759 71760 this.key = options.key; 71761 this.container = options.container; 71762 this.prepend = options.prepend; 71763 this.insertionPoint = options.insertionPoint; 71764 this.before = null; 71765 } 71766 71767 var _proto = StyleSheet.prototype; 71768 71769 _proto.hydrate = function hydrate(nodes) { 71770 nodes.forEach(this._insertTag); 71771 }; 71772 71773 _proto.insert = function insert(rule) { 71774 // the max length is how many rules we have per style tag, it's 65000 in speedy mode 71775 // it's 1 in dev because we insert source maps that map a single rule to a location 71776 // and you can only have one source map per style tag 71777 if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) { 71778 this._insertTag(createStyleElement(this)); 71779 } 71780 71781 var tag = this.tags[this.tags.length - 1]; 71782 71783 if (false) { var isImportRule; } 71784 71785 if (this.isSpeedy) { 71786 var sheet = sheetForTag(tag); 71787 71788 try { 71789 // this is the ultrafast version, works across browsers 71790 // the big drawback is that the css won't be editable in devtools 71791 sheet.insertRule(rule, sheet.cssRules.length); 71792 } catch (e) { 71793 if (false) {} 71794 } 71795 } else { 71796 tag.appendChild(document.createTextNode(rule)); 71797 } 71798 71799 this.ctr++; 71800 }; 71801 71802 _proto.flush = function flush() { 71803 // $FlowFixMe 71804 this.tags.forEach(function (tag) { 71805 return tag.parentNode && tag.parentNode.removeChild(tag); 71806 }); 71807 this.tags = []; 71808 this.ctr = 0; 71809 71810 if (false) {} 71811 }; 71812 71813 return StyleSheet; 71814 }(); 71815 71816 71817 71818 ;// CONCATENATED MODULE: ./node_modules/stylis/src/Utility.js 71819 /** 71820 * @param {number} 71821 * @return {number} 71822 */ 71823 var abs = Math.abs 71824 71825 /** 71826 * @param {number} 71827 * @return {string} 71828 */ 71829 var Utility_from = String.fromCharCode 71830 71831 /** 71832 * @param {object} 71833 * @return {object} 71834 */ 71835 var Utility_assign = Object.assign 71836 71837 /** 71838 * @param {string} value 71839 * @param {number} length 71840 * @return {number} 71841 */ 71842 function hash (value, length) { 71843 return Utility_charat(value, 0) ^ 45 ? (((((((length << 2) ^ Utility_charat(value, 0)) << 2) ^ Utility_charat(value, 1)) << 2) ^ Utility_charat(value, 2)) << 2) ^ Utility_charat(value, 3) : 0 71844 } 71845 71846 /** 71847 * @param {string} value 71848 * @return {string} 71849 */ 71850 function trim (value) { 71851 return value.trim() 71852 } 71853 71854 /** 71855 * @param {string} value 71856 * @param {RegExp} pattern 71857 * @return {string?} 71858 */ 71859 function Utility_match (value, pattern) { 71860 return (value = pattern.exec(value)) ? value[0] : value 71861 } 71862 71863 /** 71864 * @param {string} value 71865 * @param {(string|RegExp)} pattern 71866 * @param {string} replacement 71867 * @return {string} 71868 */ 71869 function Utility_replace (value, pattern, replacement) { 71870 return value.replace(pattern, replacement) 71871 } 71872 71873 /** 71874 * @param {string} value 71875 * @param {string} search 71876 * @return {number} 71877 */ 71878 function indexof (value, search) { 71879 return value.indexOf(search) 71880 } 71881 71882 /** 71883 * @param {string} value 71884 * @param {number} index 71885 * @return {number} 71886 */ 71887 function Utility_charat (value, index) { 71888 return value.charCodeAt(index) | 0 71889 } 71890 71891 /** 71892 * @param {string} value 71893 * @param {number} begin 71894 * @param {number} end 71895 * @return {string} 71896 */ 71897 function Utility_substr (value, begin, end) { 71898 return value.slice(begin, end) 71899 } 71900 71901 /** 71902 * @param {string} value 71903 * @return {number} 71904 */ 71905 function Utility_strlen (value) { 71906 return value.length 71907 } 71908 71909 /** 71910 * @param {any[]} value 71911 * @return {number} 71912 */ 71913 function Utility_sizeof (value) { 71914 return value.length 71915 } 71916 71917 /** 71918 * @param {any} value 71919 * @param {any[]} array 71920 * @return {any} 71921 */ 71922 function Utility_append (value, array) { 71923 return array.push(value), value 71924 } 71925 71926 /** 71927 * @param {string[]} array 71928 * @param {function} callback 71929 * @return {string} 71930 */ 71931 function Utility_combine (array, callback) { 71932 return array.map(callback).join('') 71933 } 71934 71935 ;// CONCATENATED MODULE: ./node_modules/stylis/src/Tokenizer.js 71936 71937 71938 var line = 1 71939 var column = 1 71940 var Tokenizer_length = 0 71941 var Tokenizer_position = 0 71942 var Tokenizer_character = 0 71943 var characters = '' 71944 71945 /** 71946 * @param {string} value 71947 * @param {object | null} root 71948 * @param {object | null} parent 71949 * @param {string} type 71950 * @param {string[] | string} props 71951 * @param {object[] | string} children 71952 * @param {number} length 71953 */ 71954 function node (value, root, parent, type, props, children, length) { 71955 return {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: ''} 71956 } 71957 71958 /** 71959 * @param {object} root 71960 * @param {object} props 71961 * @return {object} 71962 */ 71963 function Tokenizer_copy (root, props) { 71964 return Utility_assign(node('', null, null, '', null, null, 0), root, {length: -root.length}, props) 71965 } 71966 71967 /** 71968 * @return {number} 71969 */ 71970 function Tokenizer_char () { 71971 return Tokenizer_character 71972 } 71973 71974 /** 71975 * @return {number} 71976 */ 71977 function prev () { 71978 Tokenizer_character = Tokenizer_position > 0 ? Utility_charat(characters, --Tokenizer_position) : 0 71979 71980 if (column--, Tokenizer_character === 10) 71981 column = 1, line-- 71982 71983 return Tokenizer_character 71984 } 71985 71986 /** 71987 * @return {number} 71988 */ 71989 function next () { 71990 Tokenizer_character = Tokenizer_position < Tokenizer_length ? Utility_charat(characters, Tokenizer_position++) : 0 71991 71992 if (column++, Tokenizer_character === 10) 71993 column = 1, line++ 71994 71995 return Tokenizer_character 71996 } 71997 71998 /** 71999 * @return {number} 72000 */ 72001 function peek () { 72002 return Utility_charat(characters, Tokenizer_position) 72003 } 72004 72005 /** 72006 * @return {number} 72007 */ 72008 function caret () { 72009 return Tokenizer_position 72010 } 72011 72012 /** 72013 * @param {number} begin 72014 * @param {number} end 72015 * @return {string} 72016 */ 72017 function slice (begin, end) { 72018 return Utility_substr(characters, begin, end) 72019 } 72020 72021 /** 72022 * @param {number} type 72023 * @return {number} 72024 */ 72025 function token (type) { 72026 switch (type) { 72027 // \0 \t \n \r \s whitespace token 72028 case 0: case 9: case 10: case 13: case 32: 72029 return 5 72030 // ! + , / > @ ~ isolate token 72031 case 33: case 43: case 44: case 47: case 62: case 64: case 126: 72032 // ; { } breakpoint token 72033 case 59: case 123: case 125: 72034 return 4 72035 // : accompanied token 72036 case 58: 72037 return 3 72038 // " ' ( [ opening delimit token 72039 case 34: case 39: case 40: case 91: 72040 return 2 72041 // ) ] closing delimit token 72042 case 41: case 93: 72043 return 1 72044 } 72045 72046 return 0 72047 } 72048 72049 /** 72050 * @param {string} value 72051 * @return {any[]} 72052 */ 72053 function alloc (value) { 72054 return line = column = 1, Tokenizer_length = Utility_strlen(characters = value), Tokenizer_position = 0, [] 72055 } 72056 72057 /** 72058 * @param {any} value 72059 * @return {any} 72060 */ 72061 function dealloc (value) { 72062 return characters = '', value 72063 } 72064 72065 /** 72066 * @param {number} type 72067 * @return {string} 72068 */ 72069 function delimit (type) { 72070 return trim(slice(Tokenizer_position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type))) 72071 } 72072 72073 /** 72074 * @param {string} value 72075 * @return {string[]} 72076 */ 72077 function Tokenizer_tokenize (value) { 72078 return dealloc(tokenizer(alloc(value))) 72079 } 72080 72081 /** 72082 * @param {number} type 72083 * @return {string} 72084 */ 72085 function whitespace (type) { 72086 while (Tokenizer_character = peek()) 72087 if (Tokenizer_character < 33) 72088 next() 72089 else 72090 break 72091 72092 return token(type) > 2 || token(Tokenizer_character) > 3 ? '' : ' ' 72093 } 72094 72095 /** 72096 * @param {string[]} children 72097 * @return {string[]} 72098 */ 72099 function tokenizer (children) { 72100 while (next()) 72101 switch (token(Tokenizer_character)) { 72102 case 0: append(identifier(Tokenizer_position - 1), children) 72103 break 72104 case 2: append(delimit(Tokenizer_character), children) 72105 break 72106 default: append(from(Tokenizer_character), children) 72107 } 72108 72109 return children 72110 } 72111 72112 /** 72113 * @param {number} index 72114 * @param {number} count 72115 * @return {string} 72116 */ 72117 function escaping (index, count) { 72118 while (--count && next()) 72119 // not 0-9 A-F a-f 72120 if (Tokenizer_character < 48 || Tokenizer_character > 102 || (Tokenizer_character > 57 && Tokenizer_character < 65) || (Tokenizer_character > 70 && Tokenizer_character < 97)) 72121 break 72122 72123 return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32)) 72124 } 72125 72126 /** 72127 * @param {number} type 72128 * @return {number} 72129 */ 72130 function delimiter (type) { 72131 while (next()) 72132 switch (Tokenizer_character) { 72133 // ] ) " ' 72134 case type: 72135 return Tokenizer_position 72136 // " ' 72137 case 34: case 39: 72138 if (type !== 34 && type !== 39) 72139 delimiter(Tokenizer_character) 72140 break 72141 // ( 72142 case 40: 72143 if (type === 41) 72144 delimiter(type) 72145 break 72146 // \ 72147 case 92: 72148 next() 72149 break 72150 } 72151 72152 return Tokenizer_position 72153 } 72154 72155 /** 72156 * @param {number} type 72157 * @param {number} index 72158 * @return {number} 72159 */ 72160 function commenter (type, index) { 72161 while (next()) 72162 // // 72163 if (type + Tokenizer_character === 47 + 10) 72164 break 72165 // /* 72166 else if (type + Tokenizer_character === 42 + 42 && peek() === 47) 72167 break 72168 72169 return '/*' + slice(index, Tokenizer_position - 1) + '*' + Utility_from(type === 47 ? type : next()) 72170 } 72171 72172 /** 72173 * @param {number} index 72174 * @return {string} 72175 */ 72176 function identifier (index) { 72177 while (!token(peek())) 72178 next() 72179 72180 return slice(index, Tokenizer_position) 72181 } 72182 72183 ;// CONCATENATED MODULE: ./node_modules/stylis/src/Enum.js 72184 var Enum_MS = '-ms-' 72185 var Enum_MOZ = '-moz-' 72186 var Enum_WEBKIT = '-webkit-' 72187 72188 var COMMENT = 'comm' 72189 var Enum_RULESET = 'rule' 72190 var Enum_DECLARATION = 'decl' 72191 72192 var PAGE = '@page' 72193 var MEDIA = '@media' 72194 var IMPORT = '@import' 72195 var CHARSET = '@charset' 72196 var VIEWPORT = '@viewport' 72197 var SUPPORTS = '@supports' 72198 var DOCUMENT = '@document' 72199 var NAMESPACE = '@namespace' 72200 var Enum_KEYFRAMES = '@keyframes' 72201 var FONT_FACE = '@font-face' 72202 var COUNTER_STYLE = '@counter-style' 72203 var FONT_FEATURE_VALUES = '@font-feature-values' 72204 72205 ;// CONCATENATED MODULE: ./node_modules/stylis/src/Serializer.js 72206 72207 72208 72209 /** 72210 * @param {object[]} children 72211 * @param {function} callback 72212 * @return {string} 72213 */ 72214 function Serializer_serialize (children, callback) { 72215 var output = '' 72216 var length = Utility_sizeof(children) 72217 72218 for (var i = 0; i < length; i++) 72219 output += callback(children[i], i, children, callback) || '' 72220 72221 return output 72222 } 72223 72224 /** 72225 * @param {object} element 72226 * @param {number} index 72227 * @param {object[]} children 72228 * @param {function} callback 72229 * @return {string} 72230 */ 72231 function Serializer_stringify (element, index, children, callback) { 72232 switch (element.type) { 72233 case IMPORT: case Enum_DECLARATION: return element.return = element.return || element.value 72234 case COMMENT: return '' 72235 case Enum_KEYFRAMES: return element.return = element.value + '{' + Serializer_serialize(element.children, callback) + '}' 72236 case Enum_RULESET: element.value = element.props.join(',') 72237 } 72238 72239 return Utility_strlen(children = Serializer_serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : '' 72240 } 72241 72242 ;// CONCATENATED MODULE: ./node_modules/stylis/src/Middleware.js 72243 72244 72245 72246 72247 72248 72249 /** 72250 * @param {function[]} collection 72251 * @return {function} 72252 */ 72253 function middleware (collection) { 72254 var length = Utility_sizeof(collection) 72255 72256 return function (element, index, children, callback) { 72257 var output = '' 72258 72259 for (var i = 0; i < length; i++) 72260 output += collection[i](element, index, children, callback) || '' 72261 72262 return output 72263 } 72264 } 72265 72266 /** 72267 * @param {function} callback 72268 * @return {function} 72269 */ 72270 function rulesheet (callback) { 72271 return function (element) { 72272 if (!element.root) 72273 if (element = element.return) 72274 callback(element) 72275 } 72276 } 72277 72278 /** 72279 * @param {object} element 72280 * @param {number} index 72281 * @param {object[]} children 72282 * @param {function} callback 72283 */ 72284 function prefixer (element, index, children, callback) { 72285 if (element.length > -1) 72286 if (!element.return) 72287 switch (element.type) { 72288 case DECLARATION: element.return = prefix(element.value, element.length, children) 72289 return 72290 case KEYFRAMES: 72291 return serialize([copy(element, {value: replace(element.value, '@', '@' + WEBKIT)})], callback) 72292 case RULESET: 72293 if (element.length) 72294 return combine(element.props, function (value) { 72295 switch (match(value, /(::plac\w+|:read-\w+)/)) { 72296 // :read-(only|write) 72297 case ':read-only': case ':read-write': 72298 return serialize([copy(element, {props: [replace(value, /:(read-\w+)/, ':' + MOZ + '$1')]})], callback) 72299 // :placeholder 72300 case '::placeholder': 72301 return serialize([ 72302 copy(element, {props: [replace(value, /:(plac\w+)/, ':' + WEBKIT + 'input-$1')]}), 72303 copy(element, {props: [replace(value, /:(plac\w+)/, ':' + MOZ + '$1')]}), 72304 copy(element, {props: [replace(value, /:(plac\w+)/, MS + 'input-$1')]}) 72305 ], callback) 72306 } 72307 72308 return '' 72309 }) 72310 } 72311 } 72312 72313 /** 72314 * @param {object} element 72315 * @param {number} index 72316 * @param {object[]} children 72317 */ 72318 function namespace (element) { 72319 switch (element.type) { 72320 case RULESET: 72321 element.props = element.props.map(function (value) { 72322 return combine(tokenize(value), function (value, index, children) { 72323 switch (charat(value, 0)) { 72324 // \f 72325 case 12: 72326 return substr(value, 1, strlen(value)) 72327 // \0 ( + > ~ 72328 case 0: case 40: case 43: case 62: case 126: 72329 return value 72330 // : 72331 case 58: 72332 if (children[++index] === 'global') 72333 children[index] = '', children[++index] = '\f' + substr(children[index], index = 1, -1) 72334 // \s 72335 case 32: 72336 return index === 1 ? '' : value 72337 default: 72338 switch (index) { 72339 case 0: element = value 72340 return sizeof(children) > 1 ? '' : value 72341 case index = sizeof(children) - 1: case 2: 72342 return index === 2 ? value + element + element : value + element 72343 default: 72344 return value 72345 } 72346 } 72347 }) 72348 }) 72349 } 72350 } 72351 72352 ;// CONCATENATED MODULE: ./node_modules/stylis/src/Parser.js 72353 72354 72355 72356 72357 /** 72358 * @param {string} value 72359 * @return {object[]} 72360 */ 72361 function compile (value) { 72362 return dealloc(Parser_parse('', null, null, null, [''], value = alloc(value), 0, [0], value)) 72363 } 72364 72365 /** 72366 * @param {string} value 72367 * @param {object} root 72368 * @param {object?} parent 72369 * @param {string[]} rule 72370 * @param {string[]} rules 72371 * @param {string[]} rulesets 72372 * @param {number[]} pseudo 72373 * @param {number[]} points 72374 * @param {string[]} declarations 72375 * @return {object} 72376 */ 72377 function Parser_parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) { 72378 var index = 0 72379 var offset = 0 72380 var length = pseudo 72381 var atrule = 0 72382 var property = 0 72383 var previous = 0 72384 var variable = 1 72385 var scanning = 1 72386 var ampersand = 1 72387 var character = 0 72388 var type = '' 72389 var props = rules 72390 var children = rulesets 72391 var reference = rule 72392 var characters = type 72393 72394 while (scanning) 72395 switch (previous = character, character = next()) { 72396 // ( 72397 case 40: 72398 if (previous != 108 && Utility_charat(characters, length - 1) == 58) { 72399 if (indexof(characters += Utility_replace(delimit(character), '&', '&\f'), '&\f') != -1) 72400 ampersand = -1 72401 break 72402 } 72403 // " ' [ 72404 case 34: case 39: case 91: 72405 characters += delimit(character) 72406 break 72407 // \t \n \r \s 72408 case 9: case 10: case 13: case 32: 72409 characters += whitespace(previous) 72410 break 72411 // \ 72412 case 92: 72413 characters += escaping(caret() - 1, 7) 72414 continue 72415 // / 72416 case 47: 72417 switch (peek()) { 72418 case 42: case 47: 72419 Utility_append(Parser_comment(commenter(next(), caret()), root, parent), declarations) 72420 break 72421 default: 72422 characters += '/' 72423 } 72424 break 72425 // { 72426 case 123 * variable: 72427 points[index++] = Utility_strlen(characters) * ampersand 72428 // } ; \0 72429 case 125 * variable: case 59: case 0: 72430 switch (character) { 72431 // \0 } 72432 case 0: case 125: scanning = 0 72433 // ; 72434 case 59 + offset: 72435 if (property > 0 && (Utility_strlen(characters) - length)) 72436 Utility_append(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration(Utility_replace(characters, ' ', '') + ';', rule, parent, length - 2), declarations) 72437 break 72438 // @ ; 72439 case 59: characters += ';' 72440 // { rule/at-rule 72441 default: 72442 Utility_append(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets) 72443 72444 if (character === 123) 72445 if (offset === 0) 72446 Parser_parse(characters, root, reference, reference, props, rulesets, length, points, children) 72447 else 72448 switch (atrule === 99 && Utility_charat(characters, 3) === 110 ? 100 : atrule) { 72449 // d m s 72450 case 100: case 109: case 115: 72451 Parser_parse(value, reference, reference, rule && Utility_append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length), children), rules, children, length, points, rule ? props : children) 72452 break 72453 default: 72454 Parser_parse(characters, reference, reference, reference, [''], children, 0, points, children) 72455 } 72456 } 72457 72458 index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo 72459 break 72460 // : 72461 case 58: 72462 length = 1 + Utility_strlen(characters), property = previous 72463 default: 72464 if (variable < 1) 72465 if (character == 123) 72466 --variable 72467 else if (character == 125 && variable++ == 0 && prev() == 125) 72468 continue 72469 72470 switch (characters += Utility_from(character), character * variable) { 72471 // & 72472 case 38: 72473 ampersand = offset > 0 ? 1 : (characters += '\f', -1) 72474 break 72475 // , 72476 case 44: 72477 points[index++] = (Utility_strlen(characters) - 1) * ampersand, ampersand = 1 72478 break 72479 // @ 72480 case 64: 72481 // - 72482 if (peek() === 45) 72483 characters += delimit(next()) 72484 72485 atrule = peek(), offset = length = Utility_strlen(type = characters += identifier(caret())), character++ 72486 break 72487 // - 72488 case 45: 72489 if (previous === 45 && Utility_strlen(characters) == 2) 72490 variable = 0 72491 } 72492 } 72493 72494 return rulesets 72495 } 72496 72497 /** 72498 * @param {string} value 72499 * @param {object} root 72500 * @param {object?} parent 72501 * @param {number} index 72502 * @param {number} offset 72503 * @param {string[]} rules 72504 * @param {number[]} points 72505 * @param {string} type 72506 * @param {string[]} props 72507 * @param {string[]} children 72508 * @param {number} length 72509 * @return {object} 72510 */ 72511 function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length) { 72512 var post = offset - 1 72513 var rule = offset === 0 ? rules : [''] 72514 var size = Utility_sizeof(rule) 72515 72516 for (var i = 0, j = 0, k = 0; i < index; ++i) 72517 for (var x = 0, y = Utility_substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x) 72518 if (z = trim(j > 0 ? rule[x] + ' ' + y : Utility_replace(y, /&\f/g, rule[x]))) 72519 props[k++] = z 72520 72521 return node(value, root, parent, offset === 0 ? Enum_RULESET : type, props, children, length) 72522 } 72523 72524 /** 72525 * @param {number} value 72526 * @param {object} root 72527 * @param {object?} parent 72528 * @return {object} 72529 */ 72530 function Parser_comment (value, root, parent) { 72531 return node(value, root, parent, COMMENT, Utility_from(Tokenizer_char()), Utility_substr(value, 2, -2), 0) 72532 } 72533 72534 /** 72535 * @param {string} value 72536 * @param {object} root 72537 * @param {object?} parent 72538 * @param {number} length 72539 * @return {object} 72540 */ 72541 function declaration (value, root, parent, length) { 72542 return node(value, root, parent, Enum_DECLARATION, Utility_substr(value, 0, length), Utility_substr(value, length + 1, -1), length) 72543 } 72544 72545 ;// CONCATENATED MODULE: ./node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js 72546 72547 72548 72549 72550 72551 var identifierWithPointTracking = function identifierWithPointTracking(begin, points, index) { 72552 var previous = 0; 72553 var character = 0; 72554 72555 while (true) { 72556 previous = character; 72557 character = peek(); // &\f 72558 72559 if (previous === 38 && character === 12) { 72560 points[index] = 1; 72561 } 72562 72563 if (token(character)) { 72564 break; 72565 } 72566 72567 next(); 72568 } 72569 72570 return slice(begin, Tokenizer_position); 72571 }; 72572 72573 var toRules = function toRules(parsed, points) { 72574 // pretend we've started with a comma 72575 var index = -1; 72576 var character = 44; 72577 72578 do { 72579 switch (token(character)) { 72580 case 0: 72581 // &\f 72582 if (character === 38 && peek() === 12) { 72583 // this is not 100% correct, we don't account for literal sequences here - like for example quoted strings 72584 // stylis inserts \f after & to know when & where it should replace this sequence with the context selector 72585 // and when it should just concatenate the outer and inner selectors 72586 // it's very unlikely for this sequence to actually appear in a different context, so we just leverage this fact here 72587 points[index] = 1; 72588 } 72589 72590 parsed[index] += identifierWithPointTracking(Tokenizer_position - 1, points, index); 72591 break; 72592 72593 case 2: 72594 parsed[index] += delimit(character); 72595 break; 72596 72597 case 4: 72598 // comma 72599 if (character === 44) { 72600 // colon 72601 parsed[++index] = peek() === 58 ? '&\f' : ''; 72602 points[index] = parsed[index].length; 72603 break; 72604 } 72605 72606 // fallthrough 72607 72608 default: 72609 parsed[index] += Utility_from(character); 72610 } 72611 } while (character = next()); 72612 72613 return parsed; 72614 }; 72615 72616 var getRules = function getRules(value, points) { 72617 return dealloc(toRules(alloc(value), points)); 72618 }; // WeakSet would be more appropriate, but only WeakMap is supported in IE11 72619 72620 72621 var fixedElements = /* #__PURE__ */new WeakMap(); 72622 var compat = function compat(element) { 72623 if (element.type !== 'rule' || !element.parent || // positive .length indicates that this rule contains pseudo 72624 // negative .length indicates that this rule has been already prefixed 72625 element.length < 1) { 72626 return; 72627 } 72628 72629 var value = element.value, 72630 parent = element.parent; 72631 var isImplicitRule = element.column === parent.column && element.line === parent.line; 72632 72633 while (parent.type !== 'rule') { 72634 parent = parent.parent; 72635 if (!parent) return; 72636 } // short-circuit for the simplest case 72637 72638 72639 if (element.props.length === 1 && value.charCodeAt(0) !== 58 72640 /* colon */ 72641 && !fixedElements.get(parent)) { 72642 return; 72643 } // if this is an implicitly inserted rule (the one eagerly inserted at the each new nested level) 72644 // then the props has already been manipulated beforehand as they that array is shared between it and its "rule parent" 72645 72646 72647 if (isImplicitRule) { 72648 return; 72649 } 72650 72651 fixedElements.set(element, true); 72652 var points = []; 72653 var rules = getRules(value, points); 72654 var parentRules = parent.props; 72655 72656 for (var i = 0, k = 0; i < rules.length; i++) { 72657 for (var j = 0; j < parentRules.length; j++, k++) { 72658 element.props[k] = points[i] ? rules[i].replace(/&\f/g, parentRules[j]) : parentRules[j] + " " + rules[i]; 72659 } 72660 } 72661 }; 72662 var removeLabel = function removeLabel(element) { 72663 if (element.type === 'decl') { 72664 var value = element.value; 72665 72666 if ( // charcode for l 72667 value.charCodeAt(0) === 108 && // charcode for b 72668 value.charCodeAt(2) === 98) { 72669 // this ignores label 72670 element["return"] = ''; 72671 element.value = ''; 72672 } 72673 } 72674 }; 72675 var ignoreFlag = 'emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason'; 72676 72677 var isIgnoringComment = function isIgnoringComment(element) { 72678 return element.type === 'comm' && element.children.indexOf(ignoreFlag) > -1; 72679 }; 72680 72681 var createUnsafeSelectorsAlarm = function createUnsafeSelectorsAlarm(cache) { 72682 return function (element, index, children) { 72683 if (element.type !== 'rule' || cache.compat) return; 72684 var unsafePseudoClasses = element.value.match(/(:first|:nth|:nth-last)-child/g); 72685 72686 if (unsafePseudoClasses) { 72687 var isNested = element.parent === children[0]; // in nested rules comments become children of the "auto-inserted" rule 72688 // 72689 // considering this input: 72690 // .a { 72691 // .b /* comm */ {} 72692 // color: hotpink; 72693 // } 72694 // we get output corresponding to this: 72695 // .a { 72696 // & { 72697 // /* comm */ 72698 // color: hotpink; 72699 // } 72700 // .b {} 72701 // } 72702 72703 var commentContainer = isNested ? children[0].children : // global rule at the root level 72704 children; 72705 72706 for (var i = commentContainer.length - 1; i >= 0; i--) { 72707 var node = commentContainer[i]; 72708 72709 if (node.line < element.line) { 72710 break; 72711 } // it is quite weird but comments are *usually* put at `column: element.column - 1` 72712 // so we seek *from the end* for the node that is earlier than the rule's `element` and check that 72713 // this will also match inputs like this: 72714 // .a { 72715 // /* comm */ 72716 // .b {} 72717 // } 72718 // 72719 // but that is fine 72720 // 72721 // it would be the easiest to change the placement of the comment to be the first child of the rule: 72722 // .a { 72723 // .b { /* comm */ } 72724 // } 72725 // with such inputs we wouldn't have to search for the comment at all 72726 // TODO: consider changing this comment placement in the next major version 72727 72728 72729 if (node.column < element.column) { 72730 if (isIgnoringComment(node)) { 72731 return; 72732 } 72733 72734 break; 72735 } 72736 } 72737 72738 unsafePseudoClasses.forEach(function (unsafePseudoClass) { 72739 console.error("The pseudo class \"" + unsafePseudoClass + "\" is potentially unsafe when doing server-side rendering. Try changing it to \"" + unsafePseudoClass.split('-child')[0] + "-of-type\"."); 72740 }); 72741 } 72742 }; 72743 }; 72744 72745 var isImportRule = function isImportRule(element) { 72746 return element.type.charCodeAt(1) === 105 && element.type.charCodeAt(0) === 64; 72747 }; 72748 72749 var isPrependedWithRegularRules = function isPrependedWithRegularRules(index, children) { 72750 for (var i = index - 1; i >= 0; i--) { 72751 if (!isImportRule(children[i])) { 72752 return true; 72753 } 72754 } 72755 72756 return false; 72757 }; // use this to remove incorrect elements from further processing 72758 // so they don't get handed to the `sheet` (or anything else) 72759 // as that could potentially lead to additional logs which in turn could be overhelming to the user 72760 72761 72762 var nullifyElement = function nullifyElement(element) { 72763 element.type = ''; 72764 element.value = ''; 72765 element["return"] = ''; 72766 element.children = ''; 72767 element.props = ''; 72768 }; 72769 72770 var incorrectImportAlarm = function incorrectImportAlarm(element, index, children) { 72771 if (!isImportRule(element)) { 72772 return; 72773 } 72774 72775 if (element.parent) { 72776 console.error("`@import` rules can't be nested inside other rules. Please move it to the top level and put it before regular rules. Keep in mind that they can only be used within global styles."); 72777 nullifyElement(element); 72778 } else if (isPrependedWithRegularRules(index, children)) { 72779 console.error("`@import` rules can't be after other rules. Please put your `@import` rules before your other rules."); 72780 nullifyElement(element); 72781 } 72782 }; 72783 72784 /* eslint-disable no-fallthrough */ 72785 72786 function emotion_cache_browser_esm_prefix(value, length) { 72787 switch (hash(value, length)) { 72788 // color-adjust 72789 case 5103: 72790 return Enum_WEBKIT + 'print-' + value + value; 72791 // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function) 72792 72793 case 5737: 72794 case 4201: 72795 case 3177: 72796 case 3433: 72797 case 1641: 72798 case 4457: 72799 case 2921: // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break 72800 72801 case 5572: 72802 case 6356: 72803 case 5844: 72804 case 3191: 72805 case 6645: 72806 case 3005: // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite, 72807 72808 case 6391: 72809 case 5879: 72810 case 5623: 72811 case 6135: 72812 case 4599: 72813 case 4855: // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width) 72814 72815 case 4215: 72816 case 6389: 72817 case 5109: 72818 case 5365: 72819 case 5621: 72820 case 3829: 72821 return Enum_WEBKIT + value + value; 72822 // appearance, user-select, transform, hyphens, text-size-adjust 72823 72824 case 5349: 72825 case 4246: 72826 case 4810: 72827 case 6968: 72828 case 2756: 72829 return Enum_WEBKIT + value + Enum_MOZ + value + Enum_MS + value + value; 72830 // flex, flex-direction 72831 72832 case 6828: 72833 case 4268: 72834 return Enum_WEBKIT + value + Enum_MS + value + value; 72835 // order 72836 72837 case 6165: 72838 return Enum_WEBKIT + value + Enum_MS + 'flex-' + value + value; 72839 // align-items 72840 72841 case 5187: 72842 return Enum_WEBKIT + value + Utility_replace(value, /(\w+).+(:[^]+)/, Enum_WEBKIT + 'box-$1$2' + Enum_MS + 'flex-$1$2') + value; 72843 // align-self 72844 72845 case 5443: 72846 return Enum_WEBKIT + value + Enum_MS + 'flex-item-' + Utility_replace(value, /flex-|-self/, '') + value; 72847 // align-content 72848 72849 case 4675: 72850 return Enum_WEBKIT + value + Enum_MS + 'flex-line-pack' + Utility_replace(value, /align-content|flex-|-self/, '') + value; 72851 // flex-shrink 72852 72853 case 5548: 72854 return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, 'shrink', 'negative') + value; 72855 // flex-basis 72856 72857 case 5292: 72858 return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, 'basis', 'preferred-size') + value; 72859 // flex-grow 72860 72861 case 6060: 72862 return Enum_WEBKIT + 'box-' + Utility_replace(value, '-grow', '') + Enum_WEBKIT + value + Enum_MS + Utility_replace(value, 'grow', 'positive') + value; 72863 // transition 72864 72865 case 4554: 72866 return Enum_WEBKIT + Utility_replace(value, /([^-])(transform)/g, '$1' + Enum_WEBKIT + '$2') + value; 72867 // cursor 72868 72869 case 6187: 72870 return Utility_replace(Utility_replace(Utility_replace(value, /(zoom-|grab)/, Enum_WEBKIT + '$1'), /(image-set)/, Enum_WEBKIT + '$1'), value, '') + value; 72871 // background, background-image 72872 72873 case 5495: 72874 case 3959: 72875 return Utility_replace(value, /(image-set\([^]*)/, Enum_WEBKIT + '$1' + '$`$1'); 72876 // justify-content 72877 72878 case 4968: 72879 return Utility_replace(Utility_replace(value, /(.+:)(flex-)?(.*)/, Enum_WEBKIT + 'box-pack:$3' + Enum_MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + Enum_WEBKIT + value + value; 72880 // (margin|padding)-inline-(start|end) 72881 72882 case 4095: 72883 case 3583: 72884 case 4068: 72885 case 2532: 72886 return Utility_replace(value, /(.+)-inline(.+)/, Enum_WEBKIT + '$1$2') + value; 72887 // (min|max)?(width|height|inline-size|block-size) 72888 72889 case 8116: 72890 case 7059: 72891 case 5753: 72892 case 5535: 72893 case 5445: 72894 case 5701: 72895 case 4933: 72896 case 4677: 72897 case 5533: 72898 case 5789: 72899 case 5021: 72900 case 4765: 72901 // stretch, max-content, min-content, fill-available 72902 if (Utility_strlen(value) - 1 - length > 6) switch (Utility_charat(value, length + 1)) { 72903 // (m)ax-content, (m)in-content 72904 case 109: 72905 // - 72906 if (Utility_charat(value, length + 4) !== 45) break; 72907 // (f)ill-available, (f)it-content 72908 72909 case 102: 72910 return Utility_replace(value, /(.+:)(.+)-([^]+)/, '$1' + Enum_WEBKIT + '$2-$3' + '$1' + Enum_MOZ + (Utility_charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value; 72911 // (s)tretch 72912 72913 case 115: 72914 return ~indexof(value, 'stretch') ? emotion_cache_browser_esm_prefix(Utility_replace(value, 'stretch', 'fill-available'), length) + value : value; 72915 } 72916 break; 72917 // position: sticky 72918 72919 case 4949: 72920 // (s)ticky? 72921 if (Utility_charat(value, length + 1) !== 115) break; 72922 // display: (flex|inline-flex) 72923 72924 case 6444: 72925 switch (Utility_charat(value, Utility_strlen(value) - 3 - (~indexof(value, '!important') && 10))) { 72926 // stic(k)y 72927 case 107: 72928 return Utility_replace(value, ':', ':' + Enum_WEBKIT) + value; 72929 // (inline-)?fl(e)x 72930 72931 case 101: 72932 return Utility_replace(value, /(.+:)([^;!]+)(;|!.+)?/, '$1' + Enum_WEBKIT + (Utility_charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + Enum_WEBKIT + '$2$3' + '$1' + Enum_MS + '$2box$3') + value; 72933 } 72934 72935 break; 72936 // writing-mode 72937 72938 case 5936: 72939 switch (Utility_charat(value, length + 11)) { 72940 // vertical-l(r) 72941 case 114: 72942 return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, /[svh]\w+-[tblr]{2}/, 'tb') + value; 72943 // vertical-r(l) 72944 72945 case 108: 72946 return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, /[svh]\w+-[tblr]{2}/, 'tb-rl') + value; 72947 // horizontal(-)tb 72948 72949 case 45: 72950 return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, /[svh]\w+-[tblr]{2}/, 'lr') + value; 72951 } 72952 72953 return Enum_WEBKIT + value + Enum_MS + value + value; 72954 } 72955 72956 return value; 72957 } 72958 72959 var emotion_cache_browser_esm_prefixer = function prefixer(element, index, children, callback) { 72960 if (element.length > -1) if (!element["return"]) switch (element.type) { 72961 case Enum_DECLARATION: 72962 element["return"] = emotion_cache_browser_esm_prefix(element.value, element.length); 72963 break; 72964 72965 case Enum_KEYFRAMES: 72966 return Serializer_serialize([Tokenizer_copy(element, { 72967 value: Utility_replace(element.value, '@', '@' + Enum_WEBKIT) 72968 })], callback); 72969 72970 case Enum_RULESET: 72971 if (element.length) return Utility_combine(element.props, function (value) { 72972 switch (Utility_match(value, /(::plac\w+|:read-\w+)/)) { 72973 // :read-(only|write) 72974 case ':read-only': 72975 case ':read-write': 72976 return Serializer_serialize([Tokenizer_copy(element, { 72977 props: [Utility_replace(value, /:(read-\w+)/, ':' + Enum_MOZ + '$1')] 72978 })], callback); 72979 // :placeholder 72980 72981 case '::placeholder': 72982 return Serializer_serialize([Tokenizer_copy(element, { 72983 props: [Utility_replace(value, /:(plac\w+)/, ':' + Enum_WEBKIT + 'input-$1')] 72984 }), Tokenizer_copy(element, { 72985 props: [Utility_replace(value, /:(plac\w+)/, ':' + Enum_MOZ + '$1')] 72986 }), Tokenizer_copy(element, { 72987 props: [Utility_replace(value, /:(plac\w+)/, Enum_MS + 'input-$1')] 72988 })], callback); 72989 } 72990 72991 return ''; 72992 }); 72993 } 72994 }; 72995 72996 var defaultStylisPlugins = [emotion_cache_browser_esm_prefixer]; 72997 72998 var createCache = function createCache(options) { 72999 var key = options.key; 73000 73001 if (false) {} 73002 73003 if ( key === 'css') { 73004 var ssrStyles = document.querySelectorAll("style[data-emotion]:not([data-s])"); // get SSRed styles out of the way of React's hydration 73005 // document.head is a safe place to move them to(though note document.head is not necessarily the last place they will be) 73006 // note this very very intentionally targets all style elements regardless of the key to ensure 73007 // that creating a cache works inside of render of a React component 73008 73009 Array.prototype.forEach.call(ssrStyles, function (node) { 73010 // we want to only move elements which have a space in the data-emotion attribute value 73011 // because that indicates that it is an Emotion 11 server-side rendered style elements 73012 // while we will already ignore Emotion 11 client-side inserted styles because of the :not([data-s]) part in the selector 73013 // Emotion 10 client-side inserted styles did not have data-s (but importantly did not have a space in their data-emotion attributes) 73014 // so checking for the space ensures that loading Emotion 11 after Emotion 10 has inserted some styles 73015 // will not result in the Emotion 10 styles being destroyed 73016 var dataEmotionAttribute = node.getAttribute('data-emotion'); 73017 73018 if (dataEmotionAttribute.indexOf(' ') === -1) { 73019 return; 73020 } 73021 document.head.appendChild(node); 73022 node.setAttribute('data-s', ''); 73023 }); 73024 } 73025 73026 var stylisPlugins = options.stylisPlugins || defaultStylisPlugins; 73027 73028 if (false) {} 73029 73030 var inserted = {}; 73031 var container; 73032 var nodesToHydrate = []; 73033 73034 { 73035 container = options.container || document.head; 73036 Array.prototype.forEach.call( // this means we will ignore elements which don't have a space in them which 73037 // means that the style elements we're looking at are only Emotion 11 server-rendered style elements 73038 document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) { 73039 var attrib = node.getAttribute("data-emotion").split(' '); // $FlowFixMe 73040 73041 for (var i = 1; i < attrib.length; i++) { 73042 inserted[attrib[i]] = true; 73043 } 73044 73045 nodesToHydrate.push(node); 73046 }); 73047 } 73048 73049 var _insert; 73050 73051 var omnipresentPlugins = [compat, removeLabel]; 73052 73053 if (false) {} 73054 73055 { 73056 var currentSheet; 73057 var finalizingPlugins = [Serializer_stringify, false ? 0 : rulesheet(function (rule) { 73058 currentSheet.insert(rule); 73059 })]; 73060 var serializer = middleware(omnipresentPlugins.concat(stylisPlugins, finalizingPlugins)); 73061 73062 var stylis = function stylis(styles) { 73063 return Serializer_serialize(compile(styles), serializer); 73064 }; 73065 73066 _insert = function insert(selector, serialized, sheet, shouldCache) { 73067 currentSheet = sheet; 73068 73069 if (false) {} 73070 73071 stylis(selector ? selector + "{" + serialized.styles + "}" : serialized.styles); 73072 73073 if (shouldCache) { 73074 cache.inserted[serialized.name] = true; 73075 } 73076 }; 73077 } 73078 73079 var cache = { 73080 key: key, 73081 sheet: new StyleSheet({ 73082 key: key, 73083 container: container, 73084 nonce: options.nonce, 73085 speedy: options.speedy, 73086 prepend: options.prepend, 73087 insertionPoint: options.insertionPoint 73088 }), 73089 nonce: options.nonce, 73090 inserted: inserted, 73091 registered: {}, 73092 insert: _insert 73093 }; 73094 cache.sheet.hydrate(nodesToHydrate); 73095 return cache; 73096 }; 73097 73098 /* harmony default export */ const emotion_cache_browser_esm = (createCache); 73099 73100 ;// CONCATENATED MODULE: ./node_modules/@emotion/hash/dist/emotion-hash.esm.js 73101 /* eslint-disable */ 73102 // Inspired by https://github.com/garycourt/murmurhash-js 73103 // Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86 73104 function murmur2(str) { 73105 // 'm' and 'r' are mixing constants generated offline. 73106 // They're not really 'magic', they just happen to work well. 73107 // const m = 0x5bd1e995; 73108 // const r = 24; 73109 // Initialize the hash 73110 var h = 0; // Mix 4 bytes at a time into the hash 73111 73112 var k, 73113 i = 0, 73114 len = str.length; 73115 73116 for (; len >= 4; ++i, len -= 4) { 73117 k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24; 73118 k = 73119 /* Math.imul(k, m): */ 73120 (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16); 73121 k ^= 73122 /* k >>> r: */ 73123 k >>> 24; 73124 h = 73125 /* Math.imul(k, m): */ 73126 (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^ 73127 /* Math.imul(h, m): */ 73128 (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16); 73129 } // Handle the last few bytes of the input array 73130 73131 73132 switch (len) { 73133 case 3: 73134 h ^= (str.charCodeAt(i + 2) & 0xff) << 16; 73135 73136 case 2: 73137 h ^= (str.charCodeAt(i + 1) & 0xff) << 8; 73138 73139 case 1: 73140 h ^= str.charCodeAt(i) & 0xff; 73141 h = 73142 /* Math.imul(h, m): */ 73143 (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16); 73144 } // Do a few final mixes of the hash to ensure the last few 73145 // bytes are well-incorporated. 73146 73147 73148 h ^= h >>> 13; 73149 h = 73150 /* Math.imul(h, m): */ 73151 (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16); 73152 return ((h ^ h >>> 15) >>> 0).toString(36); 73153 } 73154 73155 /* harmony default export */ const emotion_hash_esm = (murmur2); 73156 73157 ;// CONCATENATED MODULE: ./node_modules/@emotion/unitless/dist/emotion-unitless.esm.js 73158 var unitlessKeys = { 73159 animationIterationCount: 1, 73160 borderImageOutset: 1, 73161 borderImageSlice: 1, 73162 borderImageWidth: 1, 73163 boxFlex: 1, 73164 boxFlexGroup: 1, 73165 boxOrdinalGroup: 1, 73166 columnCount: 1, 73167 columns: 1, 73168 flex: 1, 73169 flexGrow: 1, 73170 flexPositive: 1, 73171 flexShrink: 1, 73172 flexNegative: 1, 73173 flexOrder: 1, 73174 gridRow: 1, 73175 gridRowEnd: 1, 73176 gridRowSpan: 1, 73177 gridRowStart: 1, 73178 gridColumn: 1, 73179 gridColumnEnd: 1, 73180 gridColumnSpan: 1, 73181 gridColumnStart: 1, 73182 msGridRow: 1, 73183 msGridRowSpan: 1, 73184 msGridColumn: 1, 73185 msGridColumnSpan: 1, 73186 fontWeight: 1, 73187 lineHeight: 1, 73188 opacity: 1, 73189 order: 1, 73190 orphans: 1, 73191 tabSize: 1, 73192 widows: 1, 73193 zIndex: 1, 73194 zoom: 1, 73195 WebkitLineClamp: 1, 73196 // SVG-related properties 73197 fillOpacity: 1, 73198 floodOpacity: 1, 73199 stopOpacity: 1, 73200 strokeDasharray: 1, 73201 strokeDashoffset: 1, 73202 strokeMiterlimit: 1, 73203 strokeOpacity: 1, 73204 strokeWidth: 1 73205 }; 73206 73207 /* harmony default export */ const emotion_unitless_esm = (unitlessKeys); 73208 73209 ;// CONCATENATED MODULE: ./node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js 73210 73211 73212 73213 73214 var ILLEGAL_ESCAPE_SEQUENCE_ERROR = "You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences"; 73215 var UNDEFINED_AS_OBJECT_KEY_ERROR = "You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key)."; 73216 var hyphenateRegex = /[A-Z]|^ms/g; 73217 var animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g; 73218 73219 var isCustomProperty = function isCustomProperty(property) { 73220 return property.charCodeAt(1) === 45; 73221 }; 73222 73223 var isProcessableValue = function isProcessableValue(value) { 73224 return value != null && typeof value !== 'boolean'; 73225 }; 73226 73227 var processStyleName = /* #__PURE__ */memoize(function (styleName) { 73228 return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, '-$&').toLowerCase(); 73229 }); 73230 73231 var processStyleValue = function processStyleValue(key, value) { 73232 switch (key) { 73233 case 'animation': 73234 case 'animationName': 73235 { 73236 if (typeof value === 'string') { 73237 return value.replace(animationRegex, function (match, p1, p2) { 73238 cursor = { 73239 name: p1, 73240 styles: p2, 73241 next: cursor 73242 }; 73243 return p1; 73244 }); 73245 } 73246 } 73247 } 73248 73249 if (emotion_unitless_esm[key] !== 1 && !isCustomProperty(key) && typeof value === 'number' && value !== 0) { 73250 return value + 'px'; 73251 } 73252 73253 return value; 73254 }; 73255 73256 if (false) { var hyphenatedCache, hyphenPattern, msPattern, oldProcessStyleValue, contentValues, contentValuePattern; } 73257 73258 var noComponentSelectorMessage = (/* unused pure expression or super */ null && ('Component selectors can only be used in conjunction with ' + '@emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware ' + 'compiler transform.')); 73259 73260 function handleInterpolation(mergedProps, registered, interpolation) { 73261 if (interpolation == null) { 73262 return ''; 73263 } 73264 73265 if (interpolation.__emotion_styles !== undefined) { 73266 if (false) {} 73267 73268 return interpolation; 73269 } 73270 73271 switch (typeof interpolation) { 73272 case 'boolean': 73273 { 73274 return ''; 73275 } 73276 73277 case 'object': 73278 { 73279 if (interpolation.anim === 1) { 73280 cursor = { 73281 name: interpolation.name, 73282 styles: interpolation.styles, 73283 next: cursor 73284 }; 73285 return interpolation.name; 73286 } 73287 73288 if (interpolation.styles !== undefined) { 73289 var next = interpolation.next; 73290 73291 if (next !== undefined) { 73292 // not the most efficient thing ever but this is a pretty rare case 73293 // and there will be very few iterations of this generally 73294 while (next !== undefined) { 73295 cursor = { 73296 name: next.name, 73297 styles: next.styles, 73298 next: cursor 73299 }; 73300 next = next.next; 73301 } 73302 } 73303 73304 var styles = interpolation.styles + ";"; 73305 73306 if (false) {} 73307 73308 return styles; 73309 } 73310 73311 return createStringFromObject(mergedProps, registered, interpolation); 73312 } 73313 73314 case 'function': 73315 { 73316 if (mergedProps !== undefined) { 73317 var previousCursor = cursor; 73318 var result = interpolation(mergedProps); 73319 cursor = previousCursor; 73320 return handleInterpolation(mergedProps, registered, result); 73321 } else if (false) {} 73322 73323 break; 73324 } 73325 73326 case 'string': 73327 if (false) { var replaced, matched; } 73328 73329 break; 73330 } // finalize string values (regular strings and functions interpolated into css calls) 73331 73332 73333 if (registered == null) { 73334 return interpolation; 73335 } 73336 73337 var cached = registered[interpolation]; 73338 return cached !== undefined ? cached : interpolation; 73339 } 73340 73341 function createStringFromObject(mergedProps, registered, obj) { 73342 var string = ''; 73343 73344 if (Array.isArray(obj)) { 73345 for (var i = 0; i < obj.length; i++) { 73346 string += handleInterpolation(mergedProps, registered, obj[i]) + ";"; 73347 } 73348 } else { 73349 for (var _key in obj) { 73350 var value = obj[_key]; 73351 73352 if (typeof value !== 'object') { 73353 if (registered != null && registered[value] !== undefined) { 73354 string += _key + "{" + registered[value] + "}"; 73355 } else if (isProcessableValue(value)) { 73356 string += processStyleName(_key) + ":" + processStyleValue(_key, value) + ";"; 73357 } 73358 } else { 73359 if (_key === 'NO_COMPONENT_SELECTOR' && "production" !== 'production') {} 73360 73361 if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) { 73362 for (var _i = 0; _i < value.length; _i++) { 73363 if (isProcessableValue(value[_i])) { 73364 string += processStyleName(_key) + ":" + processStyleValue(_key, value[_i]) + ";"; 73365 } 73366 } 73367 } else { 73368 var interpolated = handleInterpolation(mergedProps, registered, value); 73369 73370 switch (_key) { 73371 case 'animation': 73372 case 'animationName': 73373 { 73374 string += processStyleName(_key) + ":" + interpolated + ";"; 73375 break; 73376 } 73377 73378 default: 73379 { 73380 if (false) {} 73381 73382 string += _key + "{" + interpolated + "}"; 73383 } 73384 } 73385 } 73386 } 73387 } 73388 } 73389 73390 return string; 73391 } 73392 73393 var labelPattern = /label:\s*([^\s;\n{]+)\s*(;|$)/g; 73394 var sourceMapPattern; 73395 73396 if (false) {} // this is the cursor for keyframes 73397 // keyframes are stored on the SerializedStyles object as a linked list 73398 73399 73400 var cursor; 73401 var emotion_serialize_browser_esm_serializeStyles = function serializeStyles(args, registered, mergedProps) { 73402 if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) { 73403 return args[0]; 73404 } 73405 73406 var stringMode = true; 73407 var styles = ''; 73408 cursor = undefined; 73409 var strings = args[0]; 73410 73411 if (strings == null || strings.raw === undefined) { 73412 stringMode = false; 73413 styles += handleInterpolation(mergedProps, registered, strings); 73414 } else { 73415 if (false) {} 73416 73417 styles += strings[0]; 73418 } // we start at 1 since we've already handled the first arg 73419 73420 73421 for (var i = 1; i < args.length; i++) { 73422 styles += handleInterpolation(mergedProps, registered, args[i]); 73423 73424 if (stringMode) { 73425 if (false) {} 73426 73427 styles += strings[i]; 73428 } 73429 } 73430 73431 var sourceMap; 73432 73433 if (false) {} // using a global regex with .exec is stateful so lastIndex has to be reset each time 73434 73435 73436 labelPattern.lastIndex = 0; 73437 var identifierName = ''; 73438 var match; // https://esbench.com/bench/5b809c2cf2949800a0f61fb5 73439 73440 while ((match = labelPattern.exec(styles)) !== null) { 73441 identifierName += '-' + // $FlowFixMe we know it's not null 73442 match[1]; 73443 } 73444 73445 var name = emotion_hash_esm(styles) + identifierName; 73446 73447 if (false) {} 73448 73449 return { 73450 name: name, 73451 styles: styles, 73452 next: cursor 73453 }; 73454 }; 73455 73456 73457 73458 ;// CONCATENATED MODULE: ./node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js 73459 73460 73461 73462 var syncFallback = function syncFallback(create) { 73463 return create(); 73464 }; 73465 73466 var useInsertionEffect = external_React_['useInsertion' + 'Effect'] ? external_React_['useInsertion' + 'Effect'] : false; 73467 var emotion_use_insertion_effect_with_fallbacks_browser_esm_useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect || syncFallback; 73468 var useInsertionEffectWithLayoutFallback = (/* unused pure expression or super */ null && (useInsertionEffect || useLayoutEffect)); 73469 73470 73471 73472 ;// CONCATENATED MODULE: ./node_modules/@emotion/react/dist/emotion-element-6a883da9.browser.esm.js 73473 73474 73475 73476 73477 73478 73479 73480 73481 73482 var emotion_element_6a883da9_browser_esm_hasOwnProperty = {}.hasOwnProperty; 73483 73484 var EmotionCacheContext = /* #__PURE__ */(0,external_React_.createContext)( // we're doing this to avoid preconstruct's dead code elimination in this one case 73485 // because this module is primarily intended for the browser and node 73486 // but it's also required in react native and similar environments sometimes 73487 // and we could have a special build just for that 73488 // but this is much easier and the native packages 73489 // might use a different theme context in the future anyway 73490 typeof HTMLElement !== 'undefined' ? /* #__PURE__ */emotion_cache_browser_esm({ 73491 key: 'css' 73492 }) : null); 73493 73494 if (false) {} 73495 73496 var CacheProvider = EmotionCacheContext.Provider; 73497 var __unsafe_useEmotionCache = function useEmotionCache() { 73498 return useContext(EmotionCacheContext); 73499 }; 73500 73501 var withEmotionCache = function withEmotionCache(func) { 73502 // $FlowFixMe 73503 return /*#__PURE__*/(0,external_React_.forwardRef)(function (props, ref) { 73504 // the cache will never be null in the browser 73505 var cache = (0,external_React_.useContext)(EmotionCacheContext); 73506 return func(props, cache, ref); 73507 }); 73508 }; 73509 73510 var ThemeContext = /* #__PURE__ */(0,external_React_.createContext)({}); 73511 73512 if (false) {} 73513 73514 var useTheme = function useTheme() { 73515 return useContext(ThemeContext); 73516 }; 73517 73518 var getTheme = function getTheme(outerTheme, theme) { 73519 if (typeof theme === 'function') { 73520 var mergedTheme = theme(outerTheme); 73521 73522 if (false) {} 73523 73524 return mergedTheme; 73525 } 73526 73527 if (false) {} 73528 73529 return _extends({}, outerTheme, theme); 73530 }; 73531 73532 var createCacheWithTheme = /* #__PURE__ */(/* unused pure expression or super */ null && (weakMemoize(function (outerTheme) { 73533 return weakMemoize(function (theme) { 73534 return getTheme(outerTheme, theme); 73535 }); 73536 }))); 73537 var ThemeProvider = function ThemeProvider(props) { 73538 var theme = useContext(ThemeContext); 73539 73540 if (props.theme !== theme) { 73541 theme = createCacheWithTheme(theme)(props.theme); 73542 } 73543 73544 return /*#__PURE__*/createElement(ThemeContext.Provider, { 73545 value: theme 73546 }, props.children); 73547 }; 73548 function withTheme(Component) { 73549 var componentName = Component.displayName || Component.name || 'Component'; 73550 73551 var render = function render(props, ref) { 73552 var theme = useContext(ThemeContext); 73553 return /*#__PURE__*/createElement(Component, _extends({ 73554 theme: theme, 73555 ref: ref 73556 }, props)); 73557 }; // $FlowFixMe 73558 73559 73560 var WithTheme = /*#__PURE__*/forwardRef(render); 73561 WithTheme.displayName = "WithTheme(" + componentName + ")"; 73562 return hoistNonReactStatics(WithTheme, Component); 73563 } 73564 73565 var getLastPart = function getLastPart(functionName) { 73566 // The match may be something like 'Object.createEmotionProps' or 73567 // 'Loader.prototype.render' 73568 var parts = functionName.split('.'); 73569 return parts[parts.length - 1]; 73570 }; 73571 73572 var getFunctionNameFromStackTraceLine = function getFunctionNameFromStackTraceLine(line) { 73573 // V8 73574 var match = /^\s+at\s+([A-Za-z0-9$.]+)\s/.exec(line); 73575 if (match) return getLastPart(match[1]); // Safari / Firefox 73576 73577 match = /^([A-Za-z0-9$.]+)@/.exec(line); 73578 if (match) return getLastPart(match[1]); 73579 return undefined; 73580 }; 73581 73582 var internalReactFunctionNames = /* #__PURE__ */new Set(['renderWithHooks', 'processChild', 'finishClassComponent', 'renderToString']); // These identifiers come from error stacks, so they have to be valid JS 73583 // identifiers, thus we only need to replace what is a valid character for JS, 73584 // but not for CSS. 73585 73586 var sanitizeIdentifier = function sanitizeIdentifier(identifier) { 73587 return identifier.replace(/\$/g, '-'); 73588 }; 73589 73590 var getLabelFromStackTrace = function getLabelFromStackTrace(stackTrace) { 73591 if (!stackTrace) return undefined; 73592 var lines = stackTrace.split('\n'); 73593 73594 for (var i = 0; i < lines.length; i++) { 73595 var functionName = getFunctionNameFromStackTraceLine(lines[i]); // The first line of V8 stack traces is just "Error" 73596 73597 if (!functionName) continue; // If we reach one of these, we have gone too far and should quit 73598 73599 if (internalReactFunctionNames.has(functionName)) break; // The component name is the first function in the stack that starts with an 73600 // uppercase letter 73601 73602 if (/^[A-Z]/.test(functionName)) return sanitizeIdentifier(functionName); 73603 } 73604 73605 return undefined; 73606 }; 73607 73608 var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__'; 73609 var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__'; 73610 var createEmotionProps = function createEmotionProps(type, props) { 73611 if (false) {} 73612 73613 var newProps = {}; 73614 73615 for (var key in props) { 73616 if (emotion_element_6a883da9_browser_esm_hasOwnProperty.call(props, key)) { 73617 newProps[key] = props[key]; 73618 } 73619 } 73620 73621 newProps[typePropName] = type; // For performance, only call getLabelFromStackTrace in development and when 73622 // the label hasn't already been computed 73623 73624 if (false) { var label; } 73625 73626 return newProps; 73627 }; 73628 73629 var Insertion = function Insertion(_ref) { 73630 var cache = _ref.cache, 73631 serialized = _ref.serialized, 73632 isStringTag = _ref.isStringTag; 73633 registerStyles(cache, serialized, isStringTag); 73634 var rules = useInsertionEffectAlwaysWithSyncFallback(function () { 73635 return insertStyles(cache, serialized, isStringTag); 73636 }); 73637 73638 return null; 73639 }; 73640 73641 var Emotion = /* #__PURE__ */(/* unused pure expression or super */ null && (withEmotionCache(function (props, cache, ref) { 73642 var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works 73643 // not passing the registered cache to serializeStyles because it would 73644 // make certain babel optimisations not possible 73645 73646 if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) { 73647 cssProp = cache.registered[cssProp]; 73648 } 73649 73650 var WrappedComponent = props[typePropName]; 73651 var registeredStyles = [cssProp]; 73652 var className = ''; 73653 73654 if (typeof props.className === 'string') { 73655 className = getRegisteredStyles(cache.registered, registeredStyles, props.className); 73656 } else if (props.className != null) { 73657 className = props.className + " "; 73658 } 73659 73660 var serialized = serializeStyles(registeredStyles, undefined, useContext(ThemeContext)); 73661 73662 if (false) { var labelFromStack; } 73663 73664 className += cache.key + "-" + serialized.name; 73665 var newProps = {}; 73666 73667 for (var key in props) { 73668 if (emotion_element_6a883da9_browser_esm_hasOwnProperty.call(props, key) && key !== 'css' && key !== typePropName && ( true || 0)) { 73669 newProps[key] = props[key]; 73670 } 73671 } 73672 73673 newProps.ref = ref; 73674 newProps.className = className; 73675 return /*#__PURE__*/createElement(Fragment, null, /*#__PURE__*/createElement(Insertion, { 73676 cache: cache, 73677 serialized: serialized, 73678 isStringTag: typeof WrappedComponent === 'string' 73679 }), /*#__PURE__*/createElement(WrappedComponent, newProps)); 73680 }))); 73681 73682 if (false) {} 73683 73684 73685 73686 ;// CONCATENATED MODULE: ./node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js 73687 var isBrowser = "object" !== 'undefined'; 73688 function emotion_utils_browser_esm_getRegisteredStyles(registered, registeredStyles, classNames) { 73689 var rawClassName = ''; 73690 classNames.split(' ').forEach(function (className) { 73691 if (registered[className] !== undefined) { 73692 registeredStyles.push(registered[className] + ";"); 73693 } else { 73694 rawClassName += className + " "; 73695 } 73696 }); 73697 return rawClassName; 73698 } 73699 var emotion_utils_browser_esm_registerStyles = function registerStyles(cache, serialized, isStringTag) { 73700 var className = cache.key + "-" + serialized.name; 73701 73702 if ( // we only need to add the styles to the registered cache if the 73703 // class name could be used further down 73704 // the tree but if it's a string tag, we know it won't 73705 // so we don't have to add it to registered cache. 73706 // this improves memory usage since we can avoid storing the whole style string 73707 (isStringTag === false || // we need to always store it if we're in compat mode and 73708 // in node since emotion-server relies on whether a style is in 73709 // the registered cache to know whether a style is global or not 73710 // also, note that this check will be dead code eliminated in the browser 73711 isBrowser === false ) && cache.registered[className] === undefined) { 73712 cache.registered[className] = serialized.styles; 73713 } 73714 }; 73715 var emotion_utils_browser_esm_insertStyles = function insertStyles(cache, serialized, isStringTag) { 73716 emotion_utils_browser_esm_registerStyles(cache, serialized, isStringTag); 73717 var className = cache.key + "-" + serialized.name; 73718 73719 if (cache.inserted[serialized.name] === undefined) { 73720 var current = serialized; 73721 73722 do { 73723 var maybeStyles = cache.insert(serialized === current ? "." + className : '', current, cache.sheet, true); 73724 73725 current = current.next; 73726 } while (current !== undefined); 73727 } 73728 }; 73729 73730 73731 73732 ;// CONCATENATED MODULE: ./node_modules/@emotion/styled/base/dist/emotion-styled-base.browser.esm.js 73733 73734 73735 73736 73737 73738 73739 73740 73741 var testOmitPropsOnStringTag = isPropValid; 73742 73743 var testOmitPropsOnComponent = function testOmitPropsOnComponent(key) { 73744 return key !== 'theme'; 73745 }; 73746 73747 var getDefaultShouldForwardProp = function getDefaultShouldForwardProp(tag) { 73748 return typeof tag === 'string' && // 96 is one less than the char code 73749 // for "a" so this is checking that 73750 // it's a lowercase character 73751 tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent; 73752 }; 73753 var composeShouldForwardProps = function composeShouldForwardProps(tag, options, isReal) { 73754 var shouldForwardProp; 73755 73756 if (options) { 73757 var optionsShouldForwardProp = options.shouldForwardProp; 73758 shouldForwardProp = tag.__emotion_forwardProp && optionsShouldForwardProp ? function (propName) { 73759 return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName); 73760 } : optionsShouldForwardProp; 73761 } 73762 73763 if (typeof shouldForwardProp !== 'function' && isReal) { 73764 shouldForwardProp = tag.__emotion_forwardProp; 73765 } 73766 73767 return shouldForwardProp; 73768 }; 73769 73770 var emotion_styled_base_browser_esm_ILLEGAL_ESCAPE_SEQUENCE_ERROR = "You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences"; 73771 73772 var emotion_styled_base_browser_esm_Insertion = function Insertion(_ref) { 73773 var cache = _ref.cache, 73774 serialized = _ref.serialized, 73775 isStringTag = _ref.isStringTag; 73776 emotion_utils_browser_esm_registerStyles(cache, serialized, isStringTag); 73777 var rules = emotion_use_insertion_effect_with_fallbacks_browser_esm_useInsertionEffectAlwaysWithSyncFallback(function () { 73778 return emotion_utils_browser_esm_insertStyles(cache, serialized, isStringTag); 73779 }); 73780 73781 return null; 73782 }; 73783 73784 var createStyled = function createStyled(tag, options) { 73785 if (false) {} 73786 73787 var isReal = tag.__emotion_real === tag; 73788 var baseTag = isReal && tag.__emotion_base || tag; 73789 var identifierName; 73790 var targetClassName; 73791 73792 if (options !== undefined) { 73793 identifierName = options.label; 73794 targetClassName = options.target; 73795 } 73796 73797 var shouldForwardProp = composeShouldForwardProps(tag, options, isReal); 73798 var defaultShouldForwardProp = shouldForwardProp || getDefaultShouldForwardProp(baseTag); 73799 var shouldUseAs = !defaultShouldForwardProp('as'); 73800 return function () { 73801 var args = arguments; 73802 var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : []; 73803 73804 if (identifierName !== undefined) { 73805 styles.push("label:" + identifierName + ";"); 73806 } 73807 73808 if (args[0] == null || args[0].raw === undefined) { 73809 styles.push.apply(styles, args); 73810 } else { 73811 if (false) {} 73812 73813 styles.push(args[0][0]); 73814 var len = args.length; 73815 var i = 1; 73816 73817 for (; i < len; i++) { 73818 if (false) {} 73819 73820 styles.push(args[i], args[0][i]); 73821 } 73822 } // $FlowFixMe: we need to cast StatelessFunctionalComponent to our PrivateStyledComponent class 73823 73824 73825 var Styled = withEmotionCache(function (props, cache, ref) { 73826 var FinalTag = shouldUseAs && props.as || baseTag; 73827 var className = ''; 73828 var classInterpolations = []; 73829 var mergedProps = props; 73830 73831 if (props.theme == null) { 73832 mergedProps = {}; 73833 73834 for (var key in props) { 73835 mergedProps[key] = props[key]; 73836 } 73837 73838 mergedProps.theme = (0,external_React_.useContext)(ThemeContext); 73839 } 73840 73841 if (typeof props.className === 'string') { 73842 className = emotion_utils_browser_esm_getRegisteredStyles(cache.registered, classInterpolations, props.className); 73843 } else if (props.className != null) { 73844 className = props.className + " "; 73845 } 73846 73847 var serialized = emotion_serialize_browser_esm_serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps); 73848 className += cache.key + "-" + serialized.name; 73849 73850 if (targetClassName !== undefined) { 73851 className += " " + targetClassName; 73852 } 73853 73854 var finalShouldForwardProp = shouldUseAs && shouldForwardProp === undefined ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp; 73855 var newProps = {}; 73856 73857 for (var _key in props) { 73858 if (shouldUseAs && _key === 'as') continue; 73859 73860 if ( // $FlowFixMe 73861 finalShouldForwardProp(_key)) { 73862 newProps[_key] = props[_key]; 73863 } 73864 } 73865 73866 newProps.className = className; 73867 newProps.ref = ref; 73868 return /*#__PURE__*/(0,external_React_.createElement)(external_React_.Fragment, null, /*#__PURE__*/(0,external_React_.createElement)(emotion_styled_base_browser_esm_Insertion, { 73869 cache: cache, 73870 serialized: serialized, 73871 isStringTag: typeof FinalTag === 'string' 73872 }), /*#__PURE__*/(0,external_React_.createElement)(FinalTag, newProps)); 73873 }); 73874 Styled.displayName = identifierName !== undefined ? identifierName : "Styled(" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + ")"; 73875 Styled.defaultProps = tag.defaultProps; 73876 Styled.__emotion_real = Styled; 73877 Styled.__emotion_base = baseTag; 73878 Styled.__emotion_styles = styles; 73879 Styled.__emotion_forwardProp = shouldForwardProp; 73880 Object.defineProperty(Styled, 'toString', { 73881 value: function value() { 73882 if (targetClassName === undefined && "production" !== 'production') {} // $FlowFixMe: coerce undefined to string 73883 73884 73885 return "." + targetClassName; 73886 } 73887 }); 73888 73889 Styled.withComponent = function (nextTag, nextOptions) { 73890 return createStyled(nextTag, extends_extends({}, options, nextOptions, { 73891 shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true) 73892 })).apply(void 0, styles); 73893 }; 73894 73895 return Styled; 73896 }; 73897 }; 73898 73899 /* harmony default export */ const emotion_styled_base_browser_esm = (createStyled); 73900 73901 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/dimensions-tool/width-height-tool.js 73902 73903 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } 73904 /** 73905 * External dependencies 73906 */ 73907 73908 /** 73909 * WordPress dependencies 73910 */ 73911 73912 73913 73914 73915 73916 const SingleColumnToolsPanelItem = /*#__PURE__*/emotion_styled_base_browser_esm(external_wp_components_namespaceObject.__experimentalToolsPanelItem, true ? { 73917 target: "ef8pe3d0" 73918 } : 0)( true ? { 73919 name: "957xgf", 73920 styles: "grid-column:span 1" 73921 } : 0); 73922 73923 /** 73924 * @typedef {import('@wordpress/components/build-types/unit-control/types').WPUnitControlUnit} WPUnitControlUnit 73925 */ 73926 73927 /** 73928 * @typedef {Object} WidthHeightToolValue 73929 * @property {string} [width] Width CSS value. 73930 * @property {string} [height] Height CSS value. 73931 */ 73932 73933 /** 73934 * @callback WidthHeightToolOnChange 73935 * @param {WidthHeightToolValue} nextValue Next dimensions value. 73936 * @return {void} 73937 */ 73938 73939 /** 73940 * @typedef {Object} WidthHeightToolProps 73941 * @property {string} [panelId] ID of the panel that contains the controls. 73942 * @property {WidthHeightToolValue} [value] Current dimensions values. 73943 * @property {WidthHeightToolOnChange} [onChange] Callback to update the dimensions values. 73944 * @property {WPUnitControlUnit[]} [units] Units options. 73945 * @property {boolean} [isShownByDefault] Whether the panel is shown by default. 73946 */ 73947 73948 /** 73949 * Component that renders controls to edit the dimensions of an image or container. 73950 * 73951 * @param {WidthHeightToolProps} props The component props. 73952 * 73953 * @return {import('react').ReactElement} The width and height tool. 73954 */ 73955 function WidthHeightTool({ 73956 panelId, 73957 value = {}, 73958 onChange = () => {}, 73959 units, 73960 isShownByDefault = true 73961 }) { 73962 var _value$width, _value$height; 73963 // null, undefined, and 'auto' all represent the default value. 73964 const width = value.width === 'auto' ? '' : (_value$width = value.width) !== null && _value$width !== void 0 ? _value$width : ''; 73965 const height = value.height === 'auto' ? '' : (_value$height = value.height) !== null && _value$height !== void 0 ? _value$height : ''; 73966 const onDimensionChange = dimension => nextDimension => { 73967 const nextValue = { 73968 ...value 73969 }; 73970 // Empty strings or undefined may be passed and both represent removing the value. 73971 if (!nextDimension) { 73972 delete nextValue[dimension]; 73973 } else { 73974 nextValue[dimension] = nextDimension; 73975 } 73976 onChange(nextValue); 73977 }; 73978 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 73979 children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SingleColumnToolsPanelItem, { 73980 label: (0,external_wp_i18n_namespaceObject.__)('Width'), 73981 isShownByDefault: isShownByDefault, 73982 hasValue: () => width !== '', 73983 onDeselect: onDimensionChange('width'), 73984 panelId: panelId, 73985 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 73986 label: (0,external_wp_i18n_namespaceObject.__)('Width'), 73987 placeholder: (0,external_wp_i18n_namespaceObject.__)('Auto'), 73988 labelPosition: "top", 73989 units: units, 73990 min: 0, 73991 value: width, 73992 onChange: onDimensionChange('width'), 73993 size: "__unstable-large" 73994 }) 73995 }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SingleColumnToolsPanelItem, { 73996 label: (0,external_wp_i18n_namespaceObject.__)('Height'), 73997 isShownByDefault: isShownByDefault, 73998 hasValue: () => height !== '', 73999 onDeselect: onDimensionChange('height'), 74000 panelId: panelId, 74001 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, { 74002 label: (0,external_wp_i18n_namespaceObject.__)('Height'), 74003 placeholder: (0,external_wp_i18n_namespaceObject.__)('Auto'), 74004 labelPosition: "top", 74005 units: units, 74006 min: 0, 74007 value: height, 74008 onChange: onDimensionChange('height'), 74009 size: "__unstable-large" 74010 }) 74011 })] 74012 }); 74013 } 74014 74015 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/dimensions-tool/index.js 74016 /** 74017 * WordPress dependencies 74018 */ 74019 74020 74021 /** 74022 * Internal dependencies 74023 */ 74024 74025 74026 74027 74028 /** 74029 * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps 74030 */ 74031 74032 /** 74033 * @typedef {import('@wordpress/components/build-types/unit-control/types').WPUnitControlUnit} WPUnitControlUnit 74034 */ 74035 74036 /** 74037 * @typedef {Object} Dimensions 74038 * @property {string} [width] CSS width property. 74039 * @property {string} [height] CSS height property. 74040 * @property {string} [scale] CSS object-fit property. 74041 * @property {string} [aspectRatio] CSS aspect-ratio property. 74042 */ 74043 74044 /** 74045 * @callback DimensionsControlsOnChange 74046 * @param {Dimensions} nextValue 74047 * @return {void} 74048 */ 74049 74050 /** 74051 * @typedef {Object} DimensionsControlsProps 74052 * @property {string} [panelId] ID of the panel that contains the controls. 74053 * @property {Dimensions} [value] Current dimensions values. 74054 * @property {DimensionsControlsOnChange} [onChange] Callback to update the dimensions values. 74055 * @property {SelectControlProps[]} [aspectRatioOptions] Aspect ratio options. 74056 * @property {SelectControlProps[]} [scaleOptions] Scale options. 74057 * @property {WPUnitControlUnit[]} [unitsOptions] Units options. 74058 */ 74059 74060 /** 74061 * Component that renders controls to edit the dimensions of an image or container. 74062 * 74063 * @param {DimensionsControlsProps} props The component props. 74064 * 74065 * @return {Element} The dimensions controls. 74066 */ 74067 74068 74069 74070 function DimensionsTool({ 74071 panelId, 74072 value = {}, 74073 onChange = () => {}, 74074 aspectRatioOptions, 74075 // Default options handled by AspectRatioTool. 74076 defaultAspectRatio = 'auto', 74077 // Match CSS default value for aspect-ratio. 74078 scaleOptions, 74079 // Default options handled by ScaleTool. 74080 defaultScale = 'fill', 74081 // Match CSS default value for object-fit. 74082 unitsOptions, 74083 // Default options handled by UnitControl. 74084 tools = ['aspectRatio', 'widthHeight', 'scale'] 74085 }) { 74086 // Coerce undefined and CSS default values to be null. 74087 const width = value.width === undefined || value.width === 'auto' ? null : value.width; 74088 const height = value.height === undefined || value.height === 'auto' ? null : value.height; 74089 const aspectRatio = value.aspectRatio === undefined || value.aspectRatio === 'auto' ? null : value.aspectRatio; 74090 const scale = value.scale === undefined || value.scale === 'fill' ? null : value.scale; 74091 74092 // Keep track of state internally, so when the value is cleared by means 74093 // other than directly editing that field, it's easier to restore the 74094 // previous value. 74095 const [lastScale, setLastScale] = (0,external_wp_element_namespaceObject.useState)(scale); 74096 const [lastAspectRatio, setLastAspectRatio] = (0,external_wp_element_namespaceObject.useState)(aspectRatio); 74097 74098 // 'custom' is not a valid value for CSS aspect-ratio, but it is used in the 74099 // dropdown to indicate that setting both the width and height is the same 74100 // as a custom aspect ratio. 74101 const aspectRatioValue = width && height ? 'custom' : lastAspectRatio; 74102 const showScaleControl = aspectRatio || width && height; 74103 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { 74104 children: [tools.includes('aspectRatio') && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AspectRatioTool, { 74105 panelId: panelId, 74106 options: aspectRatioOptions, 74107 defaultValue: defaultAspectRatio, 74108 value: aspectRatioValue, 74109 onChange: nextAspectRatio => { 74110 const nextValue = { 74111 ...value 74112 }; 74113 74114 // 'auto' is CSS default, so it gets treated as null. 74115 nextAspectRatio = nextAspectRatio === 'auto' ? null : nextAspectRatio; 74116 setLastAspectRatio(nextAspectRatio); 74117 74118 // Update aspectRatio. 74119 if (!nextAspectRatio) { 74120 delete nextValue.aspectRatio; 74121 } else { 74122 nextValue.aspectRatio = nextAspectRatio; 74123 } 74124 74125 // Auto-update scale. 74126 if (!nextAspectRatio) { 74127 delete nextValue.scale; 74128 } else if (lastScale) { 74129 nextValue.scale = lastScale; 74130 } else { 74131 nextValue.scale = defaultScale; 74132 setLastScale(defaultScale); 74133 } 74134 74135 // Auto-update width and height. 74136 if ('custom' !== nextAspectRatio && width && height) { 74137 delete nextValue.height; 74138 } 74139 onChange(nextValue); 74140 } 74141 }), tools.includes('widthHeight') && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WidthHeightTool, { 74142 panelId: panelId, 74143 units: unitsOptions, 74144 value: { 74145 width, 74146 height 74147 }, 74148 onChange: ({ 74149 width: nextWidth, 74150 height: nextHeight 74151 }) => { 74152 const nextValue = { 74153 ...value 74154 }; 74155 74156 // 'auto' is CSS default, so it gets treated as null. 74157 nextWidth = nextWidth === 'auto' ? null : nextWidth; 74158 nextHeight = nextHeight === 'auto' ? null : nextHeight; 74159 74160 // Update width. 74161 if (!nextWidth) { 74162 delete nextValue.width; 74163 } else { 74164 nextValue.width = nextWidth; 74165 } 74166 74167 // Update height. 74168 if (!nextHeight) { 74169 delete nextValue.height; 74170 } else { 74171 nextValue.height = nextHeight; 74172 } 74173 74174 // Auto-update aspectRatio. 74175 if (nextWidth && nextHeight) { 74176 delete nextValue.aspectRatio; 74177 } else if (lastAspectRatio) { 74178 nextValue.aspectRatio = lastAspectRatio; 74179 } else { 74180 // No setting defaultAspectRatio here, because 74181 // aspectRatio is optional in this scenario, 74182 // unlike scale. 74183 } 74184 74185 // Auto-update scale. 74186 if (!lastAspectRatio && !!nextWidth !== !!nextHeight) { 74187 delete nextValue.scale; 74188 } else if (lastScale) { 74189 nextValue.scale = lastScale; 74190 } else { 74191 nextValue.scale = defaultScale; 74192 setLastScale(defaultScale); 74193 } 74194 onChange(nextValue); 74195 } 74196 }), tools.includes('scale') && showScaleControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ScaleTool, { 74197 panelId: panelId, 74198 options: scaleOptions, 74199 defaultValue: defaultScale, 74200 value: lastScale, 74201 onChange: nextScale => { 74202 const nextValue = { 74203 ...value 74204 }; 74205 74206 // 'fill' is CSS default, so it gets treated as null. 74207 nextScale = nextScale === 'fill' ? null : nextScale; 74208 setLastScale(nextScale); 74209 74210 // Update scale. 74211 if (!nextScale) { 74212 delete nextValue.scale; 74213 } else { 74214 nextValue.scale = nextScale; 74215 } 74216 onChange(nextValue); 74217 } 74218 })] 74219 }); 74220 } 74221 /* harmony default export */ const dimensions_tool = (DimensionsTool); 74222 74223 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/resolution-tool/index.js 74224 /** 74225 * WordPress dependencies 74226 */ 74227 74228 74229 74230 const DEFAULT_SIZE_OPTIONS = [{ 74231 label: (0,external_wp_i18n_namespaceObject._x)('Thumbnail', 'Image size option for resolution control'), 74232 value: 'thumbnail' 74233 }, { 74234 label: (0,external_wp_i18n_namespaceObject._x)('Medium', 'Image size option for resolution control'), 74235 value: 'medium' 74236 }, { 74237 label: (0,external_wp_i18n_namespaceObject._x)('Large', 'Image size option for resolution control'), 74238 value: 'large' 74239 }, { 74240 label: (0,external_wp_i18n_namespaceObject._x)('Full Size', 'Image size option for resolution control'), 74241 value: 'full' 74242 }]; 74243 function ResolutionTool({ 74244 panelId, 74245 value, 74246 onChange, 74247 options = DEFAULT_SIZE_OPTIONS, 74248 defaultValue = DEFAULT_SIZE_OPTIONS[0].value, 74249 isShownByDefault = true 74250 }) { 74251 const displayValue = value !== null && value !== void 0 ? value : defaultValue; 74252 return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToolsPanelItem, { 74253 hasValue: () => displayValue !== defaultValue, 74254 label: (0,external_wp_i18n_namespaceObject.__)('Resolution'), 74255 onDeselect: () => onChange(defaultValue), 74256 isShownByDefault: isShownByDefault, 74257 panelId: panelId, 74258 children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SelectControl, { 74259 __nextHasNoMarginBottom: true, 74260 label: (0,external_wp_i18n_namespaceObject.__)('Resolution'), 74261 value: displayValue, 74262 options: options, 74263 onChange: onChange, 74264 help: (0,external_wp_i18n_namespaceObject.__)('Select the size of the source image.'), 74265 size: "__unstable-large" 74266 }) 74267 }); 74268 } 74269 74270 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/private-apis.js 74271 /** 74272 * Internal dependencies 74273 */ 74274 74275 74276 74277 74278 74279 74280 74281 74282 74283 74284 74285 74286 74287 74288 74289 74290 74291 74292 74293 74294 74295 74296 74297 74298 74299 74300 74301 74302 74303 74304 74305 74306 74307 /** 74308 * Private @wordpress/block-editor APIs. 74309 */ 74310 const privateApis = {}; 74311 lock(privateApis, { 74312 ...global_styles_namespaceObject, 74313 ExperimentalBlockCanvas: ExperimentalBlockCanvas, 74314 ExperimentalBlockEditorProvider: ExperimentalBlockEditorProvider, 74315 getDuotoneFilter: getDuotoneFilter, 74316 getRichTextValues: getRichTextValues, 74317 PrivateQuickInserter: QuickInserter, 74318 extractWords: extractWords, 74319 getNormalizedSearchTerms: getNormalizedSearchTerms, 74320 normalizeString: normalizeString, 74321 PrivateListView: PrivateListView, 74322 ResizableBoxPopover: ResizableBoxPopover, 74323 BlockInfo: block_info_slot_fill, 74324 useHasBlockToolbar: useHasBlockToolbar, 74325 cleanEmptyObject: utils_cleanEmptyObject, 74326 BlockQuickNavigation: BlockQuickNavigation, 74327 LayoutStyle: LayoutStyle, 74328 BlockRemovalWarningModal: BlockRemovalWarningModal, 74329 useLayoutClasses: useLayoutClasses, 74330 useLayoutStyles: useLayoutStyles, 74331 DimensionsTool: dimensions_tool, 74332 ResolutionTool: ResolutionTool, 74333 TabbedSidebar: tabbed_sidebar, 74334 TextAlignmentControl: TextAlignmentControl, 74335 usesContextKey: usesContextKey, 74336 useFlashEditableBlocks: useFlashEditableBlocks, 74337 useZoomOutModeExit: useZoomOutModeExit, 74338 useZoomOut: useZoomOut, 74339 globalStylesDataKey: globalStylesDataKey, 74340 globalStylesLinksDataKey: globalStylesLinksDataKey, 74341 selectBlockPatternsKey: selectBlockPatternsKey, 74342 requiresWrapperOnCopy: requiresWrapperOnCopy, 74343 PrivateRichText: PrivateRichText, 74344 PrivateInserterLibrary: PrivateInserterLibrary, 74345 reusableBlocksSelectKey: reusableBlocksSelectKey, 74346 PrivateBlockPopover: PrivateBlockPopover, 74347 PrivatePublishDateTimePicker: PrivatePublishDateTimePicker, 74348 useSpacingSizes: useSpacingSizes, 74349 useBlockDisplayTitle: useBlockDisplayTitle, 74350 __unstableBlockStyleVariationOverridesWithConfig: __unstableBlockStyleVariationOverridesWithConfig, 74351 setBackgroundStyleDefaults: setBackgroundStyleDefaults, 74352 sectionRootClientIdKey: sectionRootClientIdKey 74353 }); 74354 74355 ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/index.js 74356 /** 74357 * Internal dependencies 74358 */ 74359 74360 74361 74362 74363 74364 74365 74366 74367 74368 })(); 74369 74370 (window.wp = window.wp || {}).blockEditor = __webpack_exports__; 74371 /******/ })() 74372 ;
title
Description
Body
title
Description
Body
title
Description
Body
title
Body
| Generated : Thu Nov 21 08:20:01 2024 | Cross-referenced by PHPXref |